@charset "UTF-8";

/* ============================================================
   Blok: MT Kafle informacyjne — mt/karty

   Układ z makiety `dokumenty/kafel.png`: piktogram na górze, zielony nagłówek
   pod nim, opis pod nagłówkiem. Bez ramki, bez cienia, bez belki — kafel to
   kolumna treści, nie pudełko. W wąskiej kolumnie piktogram z boku zabierał
   opisowi połowę szerokości i tekst łamał się po trzy słowa.
   ============================================================ */

.mt-cards { padding-block: 2rem; }
.mt-cards__title { text-align: center; margin-bottom: 1.6rem; }

.mt-cards__grid {
	display: grid;
	gap: 2.4rem 2.8rem;
	margin: 0;
	padding: 0;
	list-style: none;
	/* Jedna kolumna na telefonie; zadana liczba dopiero od 900 px. */
	grid-template-columns: 1fr;
}

.mt-card {
	display: flex;
	flex-direction: column;
	/* Wyrównanie do góry, żeby przy kafelkach różnej długości piktogramy
	   i nagłówki stały w jednej linii. */
	justify-content: flex-start;
}

.mt-card__img {
	display: block;
	width: auto;
	max-width: 100%;
	max-height: 130px;
	margin: 0 auto .9rem;
}

.mt-card__title {
	margin: 0 0 .8rem;
	font-size: 1.6rem;
	line-height: 1.2;
	text-align: center;
	color: var(--mt-green, #14945c);
}

.mt-card__text { font-size: 1rem; }
.mt-card__text > *:first-child { margin-top: 0; }
.mt-card__text > *:last-child { margin-bottom: 0; }

/* Przycisk kasowania kafla — tylko w edytorze. */
.mt-card__remove { margin: .8rem auto 0; }

@media (min-width: 900px) {
	.mt-cards__grid {
		grid-template-columns: repeat(var(--mt-cards-cols, 3), 1fr);
	}
	.mt-card__img { max-height: 150px; }
}