/**
 * VETKA — Kafle „dlaczego my" (wariant 6a) — restyl WNĘTRZA.
 *
 * Zmienia wyłącznie zawartość i style wnętrza trzech istniejących kafli Elementora
 * na stronie głównej (post 11200). NIE dotyka rozmiaru, pozycji, siatki, marginesów
 * ani odstępów — te pochodzą z kontenerów Elementora:
 *   .vetka-feature-card  → .elementor-element-40b3097 / -7f2f902 / -c009aa2
 * Markup .vk-feature__* renderuje widget HTML (.vetka-feature-card__widget) w każdym kaflu.
 *
 * Paleta wg brandbooka (brand.css): zieleń #003B26, krem #F4EFE6,
 * terakota #C4622D jako drobny akcent (wyłącznie wartość „Gratis").
 * Font: Montserrat 500/700 (enqueue `vetka-montserrat` w functions.php, css2 z CDN).
 * Ikony: inline SVG (Material Symbols Rounded: schedule, groups, local_parking).
 */

:root {
	--vk-green:         #003b26;
	--vk-cream:         #f4efe6;
	--vk-terracotta:    #c4622d;
	--vk-ink-soft:      #6f7a6c; /* opis na kremie */
	--vk-sage-soft:     #9fbfab; /* opis na zieleni */
	--vk-rule-cream:    #dcd4c4;
	--vk-rule-green:    rgba(255, 255, 255, .16);
	--vk-icon-bg-cream: rgba(0, 59, 38, .08);
	--vk-icon-bg-green: rgba(255, 255, 255, .10);
	--vk-feature-font:  "Montserrat", "Outfit", system-ui, -apple-system, sans-serif;
}

/* ---------- Wnętrze wypełnia wysokość kafla i rozkłada treść (góra / dół) ----------
   Kontener kafla (Elementor .e-con) jest już flex-column/space-between. Widget HTML
   (.vetka-feature-card__widget) rozciągamy na całą wysokość, a .vk-feature__inner
   rozkłada treść między górę i dół. Uwaga: kontenery Elementora nie renderują
   własnej klasy CSS, więc wysokość pinujemy po ID elementu (sekcja media niżej). */
.vetka-feature-card__widget {
	flex: 1 1 auto !important; /* nadpisuje domyślny flex dziecka kontenera Elementora */
	width: 100%;
	display: flex !important;
}
.vk-feature__inner {
	flex: 1 1 auto;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 24px;
	font-family: var(--vk-feature-font);
}

/* ---------- Górny rząd: powiększona ikona w chipie + duża wartość ---------- */
.vk-feature__top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}
.vk-feature__icon {
	flex: 0 0 auto;
	width: 84px;
	height: 84px;
	border-radius: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.vk-feature__glyph {
	width: 46px;
	height: 46px;
	display: block;
}
.vk-feature__stat {
	font-family: var(--vk-feature-font);
	font-weight: 700;
	font-size: 54px;
	line-height: 1;
	letter-spacing: -.02em;
	text-align: right;
	white-space: nowrap;
}
.vk-feature__stat--accent {
	font-size: 46px;
	color: var(--vk-terracotta);
}

/* ---------- Dolny blok: cienka linia + tytuł + opis ---------- */
.vk-feature__bottom {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.vk-feature__rule {
	display: block;
	width: 100%;
	height: 1px;
	border: 0;
}
.vk-feature__text {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.vk-feature__title {
	margin: 0;
	padding: 0;
	font-family: var(--vk-feature-font);
	font-weight: 700;
	font-size: 24px;
	line-height: 1.2;
	letter-spacing: -.01em;
}
.vk-feature__desc {
	margin: 0;
	padding: 0;
	font-family: var(--vk-feature-font);
	font-weight: 500;
	font-size: 15px;
	line-height: 1.5;
}

/* ---------- Wariant KREMOWY (kafel 1 „Czynni całą dobę", kafel 3 „Bezpłatny parking") ---------- */
.vk-feature--cream .vk-feature__icon         { background: var(--vk-icon-bg-cream); color: var(--vk-green); }
.vk-feature--cream .vk-feature__stat         { color: var(--vk-green); }
.vk-feature--cream .vk-feature__stat--accent { color: var(--vk-terracotta); }
.vk-feature--cream .vk-feature__rule         { background: var(--vk-rule-cream); }
.vk-feature--cream .vk-feature__title        { color: var(--vk-green); }
.vk-feature--cream .vk-feature__desc         { color: var(--vk-ink-soft); }

/* ---------- Wariant ZIELONY (kafel 2 „Doświadczony zespół") ---------- */
.vk-feature--green .vk-feature__icon         { background: var(--vk-icon-bg-green); color: var(--vk-cream); }
.vk-feature--green .vk-feature__stat         { color: var(--vk-cream); }
.vk-feature--green .vk-feature__rule         { background: var(--vk-rule-green); }
.vk-feature--green .vk-feature__title        { color: var(--vk-cream); }
.vk-feature--green .vk-feature__desc         { color: var(--vk-sage-soft); }

/* ---------- Nadpisanie globalnej typografii motywu ----------
   Motyw narzuca własną typografię nagłówków/paragrafów z wyższą specyficznością niż
   pojedyncza klasa .vk-* (Elementor Kit `.elementor-kit-5333 h3` = 0,1,1; `p` w
   style.min.css). Prefiks `.vetka-feature-card__widget` podnosi naszą specyficzność
   do (0,2,0) i przywraca wartości 6a — bez !important. */
.vetka-feature-card__widget .vk-feature__stat         { font-family: var(--vk-feature-font); font-weight: 700; font-size: 54px; line-height: 1; }
.vetka-feature-card__widget .vk-feature__stat--accent { font-size: 46px; }
.vetka-feature-card__widget .vk-feature__title        { font-family: var(--vk-feature-font); font-weight: 700; font-size: 24px; line-height: 1.2; margin: 0; }
.vetka-feature-card__widget .vk-feature__desc         { font-family: var(--vk-feature-font); font-weight: 500; font-size: 15px; line-height: 1.5; margin: 0; }

/* ---------- Zachowanie wysokości kafli z produkcji ----------
   Wnętrze 6a jest niższe niż dotychczasowa treść, więc pinujemy min-height kafla
   do wartości produkcyjnych, aby ROZMIAR i POZYCJA kafli nie uległy zmianie.
   Pinujemy po ID kontenerów Elementora (klasa własna kontenera nie jest renderowana).
   Punkty łamania i układ siatki pochodzą z Elementora — nie zmieniamy ich.
   Desktop (>1024px): 3 kolumny → 343px.  Tablet (768–1024px): kafel 1 na pełną
   szerokość → 323px.  Mobile (≤767px): kolumna — wysokość z treści (jak dotychczas). */
@media (min-width: 1025px) {
	.elementor-element-40b3097,
	.elementor-element-7f2f902,
	.elementor-element-c009aa2 { min-height: var( --vk-feature-card-h, 343px ) !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	.elementor-element-40b3097,
	.elementor-element-7f2f902,
	.elementor-element-c009aa2 { min-height: var( --vk-feature-card-h-tab, 323px ) !important; }
}
