/* ============================================================
   CKW Theme — Main Stylesheet
   Centrum Kultury Wilanów
   ============================================================ */

/* ---------- Design tokens (sync z istniejącym CKW Elementor design system) ---------- */
:root {
	/* Colors — 1:1 z elementor-kit + :root klienta */
	--ckw-red:           #EA2628;
	--ckw-dark-red:      #910A0C;
	--ckw-dark:          #1E2022;
	--ckw-dark-blue:     #2F5497;
	--ckw-light-blue:    #B9D0E2;
	--ckw-olive-green:   #DEE2B0;
	--ckw-soft-green:    #C6DAC7;
	--ckw-cream:         #FFF7F0;
	--ckw-light-gray:    #E9E9E9;
	--ckw-gray:          #D9D9D9;
	--ckw-white:         #FFFFFF;
	--ckw-black:         #000000;
	--ckw-body-bg:       #FFF7F0;

	/* Aliasy zachowane dla backward-compat z moich starszych nazw */
	--ckw-bg:        var(--ckw-body-bg);
	--ckw-bg-card:   var(--ckw-white);
	--ckw-ink:       var(--ckw-dark);
	--ckw-ink-2:     var(--ckw-black);
	--ckw-muted:     var(--ckw-gray);
	--ckw-muted-2:   #B1B1B1;
	--ckw-red-dark:  var(--ckw-dark-red);
	--ckw-footer-bg: var(--ckw-dark);
	--ckw-accent-blue: var(--ckw-light-blue);

	/* Type — 1:1 z elementor-kit */
	--ckw-font-primary: 'Instrument Sans', sans-serif;
	--ckw-font-sans:    'Instrument Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--ckw-font-alt:     'Inter', system-ui, sans-serif;
	--ckw-font-dec:     'Italianno', cursive;

	/* Font sizes (matching --ckw-fs-* z klienta) */
	--ckw-fs-12: 12px;
	--ckw-fs-14: 14px;
	--ckw-fs-16: 16px;
	--ckw-fs-18: 18px;
	--ckw-fs-20: 20px;
	--ckw-fs-24: 24px;
	--ckw-fs-28: 28px;
	--ckw-fs-36: 36px;
	--ckw-fs-48: 48px;
	--ckw-fs-64: 64px;

	/* Widths */
	--ckw-width-design:  1440px;
	--ckw-width-wide:    1312px;
	--ckw-width-content: 1138px;
	--ckw-container:     var(--ckw-width-wide);
	--ckw-gutter:        64px;

	/* Spacing scale */
	--ckw-space-4:   4px;
	--ckw-space-8:   8px;
	--ckw-space-12:  12px;
	--ckw-space-16:  16px;
	--ckw-space-20:  20px;
	--ckw-space-24:  24px;
	--ckw-space-32:  32px;
	--ckw-space-40:  40px;
	--ckw-space-48:  48px;
	--ckw-space-64:  64px;
	--ckw-space-80:  80px;
	--ckw-space-96:  96px;
	--ckw-space-128: 128px;

	/* Wysokość stałego wiersza przycisków WUTW/WIM pod paskiem menu (przycisk + odstęp).
	   Panel rozwijanego menu rezerwuje ją w swoim padding-top, żeby pozycje menu
	   nie chowały się pod przyciskami. Na wąskich ekranach przyciski idą w kolumnę,
	   więc wartość rośnie — patrz media query 900px. */
	--ckw-cta-row-h: 60px;

	/* Shapes */
	--ckw-radius-pill: 90px;
	--ckw-radius-sm:   8px;
	--ckw-radius-md:   14px;

	/* Shadows */
	--ckw-shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
	--ckw-shadow-md: 0 6px 24px rgba(0,0,0,0.08);

	/* Motion */
	--ckw-ease: cubic-bezier(.4, 0, .2, 1);
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; overflow-x: clip; }
body {
	margin: 0;
	background: var(--ckw-bg);
	color: var(--ckw-ink);
	font-family: var(--ckw-font-sans);
	font-size: 18px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	/* Przycina nadmiar full-bleed (width:100vw zawiera scrollbar desktopowy → ~8-15px
	   za szeroko). MUSI być na html I body naraz (root-propagation — na jednym nie
	   działa). `clip` (nie `hidden`) NIE tworzy kontenera scrolla → sticky header OK. */
	overflow-x: clip;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
/* Reguła Weroniki: klikalne = zmiana koloru na hover, BEZ podkreślenia (globalnie). */
a:hover { text-decoration: none; }
button { font: inherit; cursor: pointer; }

/* Focus ring (WCAG 2.1 AA) */
:focus-visible {
	outline: 3px solid var(--ckw-red);
	outline-offset: 3px;
	border-radius: 4px;
}

/* Skip link */
.ckw-skip-link {
	position: absolute;
	left: -9999px;
	top: auto;
	background: var(--ckw-ink);
	color: var(--ckw-cream);
	padding: 12px 20px;
	z-index: 9999;
	border-radius: 0 0 8px 0;
	font-weight: 700;
}
.ckw-skip-link:focus { left: 0; top: 0; }

/* Containers */
.ckw-container {
	max-width: var(--ckw-container);
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 24px);
}

/* ---------- Site header / Navigation ---------- */
.ckw-site-header {
	position: sticky;
	top: 0;
	z-index: 50;
}
.ckw-nav-wrap {
	padding: 24px clamp(16px, 4vw, 64px);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	position: relative;
	z-index: 50;
}
.ckw-nav {
	width: 100%;
	max-width: 1138px;
	min-height: 79px;
	border: 2px solid var(--ckw-ink-2);
	border-radius: var(--ckw-radius-pill);
	background: rgba(255, 255, 255, 0.72);
	-webkit-backdrop-filter: saturate(140%) blur(18px);
	backdrop-filter: saturate(140%) blur(18px);
	padding: 10px 48px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	position: relative;
	z-index: 3;
	transition: background-color .25s var(--ckw-ease);
}
/* Kiedy dropdown otwarty — wszystkie pille stają się mniej przezroczyste */
.ckw-nav-wrap:has(.ckw-nav-dropdown.is-open) .ckw-nav,
.ckw-nav-wrap:has(.ckw-nav-dropdown.is-open) .ckw-nav-pill {
	background: rgba(255, 255, 255, 0.98);
}
.ckw-logo { display: inline-flex; }
.ckw-logo--red img { height: 67px; width: auto; }

.ckw-nav__primary {
	display: flex;
	gap: 36px;
	margin: 0;
	padding: 0;
	list-style: none;
	align-items: center;
	flex: 1;
	justify-content: flex-end;
}
.ckw-nav__primary a {
	font-family: var(--ckw-font-sans);
	font-size: 18px;
	color: var(--ckw-ink);
	padding: 6px 4px;
	border-radius: 4px;
	transition: color .15s var(--ckw-ease);
	text-decoration: none;
}
.ckw-nav__primary a:hover,
.ckw-nav__primary a[aria-current="page"] {
	color: var(--ckw-red);
	text-decoration: none;
}

/* Globalne: aktywny link (bieżąca strona / wybrany tab) — czerwony, bez podkreślenia */
a[aria-current="page"],
.current-menu-item > a,
.current_page_item > a,
.current-menu-ancestor > a,
.current_page_ancestor > a {
	color: var(--ckw-red);
	text-decoration: none;
}
.ckw-nav__actions { display: flex; align-items: center; gap: 18px; }
.ckw-icon-btn {
	width: 30px; height: 30px;
	border: 0; background: transparent;
	color: var(--ckw-ink);
	display: inline-flex; align-items: center; justify-content: center;
	padding: 0;
}
.ckw-icon-btn svg { width: 30px; height: 30px; }
.ckw-icon-btn:hover { color: var(--ckw-red); }
.ckw-bip-link img { width: 50px; height: 50px; display: block; }

.ckw-hamburger {
	width: 36px; height: 30px;
	border: 0; background: transparent;
	display: flex; flex-direction: column; justify-content: space-between;
	padding: 4px 2px;
}
.ckw-hamburger span {
	display: block;
	height: 3px; width: 100%;
	background: var(--ckw-ink-2);
	border-radius: 2px;
	transition: transform .25s var(--ckw-ease), opacity .15s var(--ckw-ease);
}
.ckw-hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(10px) rotate(45deg); }
.ckw-hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.ckw-hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-10px) rotate(-45deg); }

/* Floating "bilety" CTA — DISABLED (zastąpione dropdown'em przy hamburgerze) */
.ckw-tickets-fab { display: none !important; }

/* ---------- Header dropdowns (menu + search) ---------- */
.ckw-nav-dropdown {
	position: absolute;
	left: clamp(16px, 4vw, 64px);
	right: clamp(16px, 4vw, 64px);
	top: 50%;                 /* zaczyna się od środka głównego pilla — górna połowa schowana za nim */
	width: auto;
	max-width: 1138px;
	margin: 0 auto;
	display: none;
	flex-direction: column;
	gap: 12px;
	z-index: 1;               /* pod głównym pillem (z:3) — wysuwa się "spod" niego */
}
.ckw-nav-dropdown.is-open {
	display: flex;
}
@media (prefers-reduced-motion: no-preference) {
	.ckw-nav-dropdown.is-open {
		animation: ckw-slide-from-under .35s cubic-bezier(.4, 0, .2, 1) both;
	}
	@keyframes ckw-slide-from-under {
		0%   { transform: translateY(-100%); opacity: 0; }
		40%  { opacity: 1; }
		100% { transform: translateY(0); opacity: 1; }
	}
}

.ckw-nav-pill {
	border: 2px solid var(--ckw-ink-2);
	border-radius: var(--ckw-radius-pill);
	background: rgba(255, 255, 255, 0.72);
	-webkit-backdrop-filter: saturate(140%) blur(18px);
	backdrop-filter: saturate(140%) blur(18px);
	padding: 18px 48px;
	display: flex;
	align-items: center;
	gap: 24px;
	transition: background-color .25s var(--ckw-ease);
}

/* Secondary menu pill — wysuwa się ze środka głównego pilla, więc górna część jest schowana */
.ckw-nav-secondary {
	/*
	 * padding-top = 60px (40px za main pillem + 20px oddechu) + wysokość stałego
	 * wiersza przycisków WUTW/WIM. Wiersz stoi w normalnym flow nad panelem, a panel
	 * jest pozycjonowany absolutnie — bez tej rezerwy pozycje menu wychodziłyby
	 * dokładnie pod przyciskami i były nimi zasłonięte.
	 */
	padding: calc(60px + var(--ckw-cta-row-h)) 48px 18px;
	border-radius: 0 0 40px 40px;
	border-width: 0 2px 2px;
	min-height: 110px;
	align-items: flex-end;
}
.ckw-nav-secondary__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	flex: 1;
	font-size: 18px;
}
.ckw-nav-secondary__menu a {
	color: var(--ckw-ink);
	padding: 6px 2px;
	border-radius: 4px;
	transition: color .15s var(--ckw-ease);
}
.ckw-nav-secondary__menu a:hover,
.ckw-nav-secondary__menu a:focus-visible {
	color: var(--ckw-red);
	text-decoration: none;
}

/* Row z CTA: WUTW + Wilanowski Instytut Muzyczny */
.ckw-nav-cta-row {
	display: flex;
	justify-content: flex-end;
	gap: 12px;
	padding: 0 8px;
}
.ckw-nav-cta-row .ckw-btn {
	padding: 12px 28px;
	font-size: 16px;
}

/*
 * Wariant stały — przyciski poza chowanym panelem, widoczne od razu.
 * Szerokość i wyrównanie jak główny pill, żeby prawa krawędź szła w jednej linii
 * z hamburgerem. z-index: 2 — nad wysuwanym panelem (1), pod głównym pillem (3).
 */
.ckw-nav-cta-row--stala {
	width: 100%;
	max-width: 1138px;
	position: relative;
	z-index: 2;
	padding: 0 8px;
}

/* Domyślnie widać pełną nazwę; skrót wchodzi dopiero na wąskich ekranach. */
.ckw-btn__skrot { display: none; }

/* Search pill — krótszy, wyrównany do prawej strony głównego pilla */
.ckw-nav-search {
	padding: 56px 48px 14px 48px;  /* padding-right: 48px = wyrównanie do hamburgera */
	border-radius: 0 0 40px 40px;
	border-width: 0 2px 2px;
	min-height: 110px;
	align-items: center;            /* środkowanie input vs. button */
	max-width: 616px;
	margin-left: auto;
	width: 100%;
}
.ckw-nav-search__form {
	display: flex;
	align-items: center;
	gap: 14px;
	flex: 1;
}
.ckw-nav-search__input {
	flex: 1;
	background: transparent;
	border: 0;
	font-family: var(--ckw-font-sans);
	font-size: 18px;
	color: var(--ckw-ink);
	outline: none;
	min-width: 0;
	padding: 8px 0;
}
.ckw-nav-search__input::placeholder {
	color: var(--ckw-muted-2);
}
.ckw-nav-search__submit {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 26px;
	border-radius: var(--ckw-radius-pill);
	background: var(--ckw-ink);
	color: #fff;
	border: 0;
	font-family: var(--ckw-font-sans);
	font-weight: 600;
	font-size: 16px;
	transition: background .15s var(--ckw-ease);
}
.ckw-nav-search__submit:hover { background: var(--ckw-red); }
.ckw-nav-search__submit::after {
	content: "›";
	font-size: 22px;
	line-height: 1;
}

/* Buttons hover states (highlight current trigger) — bez tła, tylko zmiana koloru */
.ckw-icon-btn.is-active,
.ckw-hamburger.is-active { color: var(--ckw-red); }

/* Overlay menu */
.ckw-overlay {
	position: fixed; inset: 0;
	background: rgba(30,32,34,0.97);
	z-index: 100;
	display: flex; align-items: center; justify-content: center;
	padding: 40px;
}
.ckw-overlay[hidden] { display: none; }
.ckw-overlay__inner { width: 100%; max-width: 600px; position: relative; color: var(--ckw-cream); }
.ckw-overlay__close {
	position: absolute; top: -40px; right: 0;
	width: 56px; height: 56px;
	background: transparent; color: var(--ckw-cream);
	border: 0;
	font-size: 48px; line-height: 1;
}
.ckw-overlay nav ul {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-direction: column; gap: 18px;
	font-size: 36px; font-weight: 700;
}
.ckw-overlay nav a {
	color: var(--ckw-cream);
	display: inline-block;
	padding: 6px 0;
	border-bottom: 2px solid transparent;
}
.ckw-overlay nav a:hover { border-color: var(--ckw-red); text-decoration: none; }

/* ---------- Main ---------- */
.ckw-main { display: block; min-height: 50vh; }
.ckw-main:focus { outline: none; }

/* ---------- Breadcrumbs ---------- */
.ckw-breadcrumbs {
	max-width: var(--ckw-container);
	margin: 24px auto 8px;
	padding-inline: clamp(16px, 4vw, 24px);
	font-size: 15px;
	color: var(--ckw-muted-2);
}
.ckw-breadcrumbs a:hover { color: var(--ckw-ink); }
.ckw-breadcrumbs [aria-current="page"] { color: var(--ckw-ink); font-weight: 600; }

/* ---------- Title line (ckw-title-line) ---------- */
/* Tytuł podstrony: pasek pod spodem jest CZARNY i kończy się na ostatniej literze tytułu.
   Po lewej rozciąga się do krawędzi viewportu. */
.ckw-title-line {
	position: relative;
	max-width: var(--ckw-container);
	margin: var(--ckw-space-48) auto var(--ckw-space-48);
	padding: 0 clamp(16px, 4vw, 24px) var(--ckw-space-16);
}
.ckw-title-line h1,
.ckw-title-line h2 {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-36);
	line-height: 1.1;
	margin: 0;
	color: var(--ckw-dark);
	letter-spacing: 0;
	position: relative;
	display: inline-block;        /* pasek dopasowuje się do szerokości tekstu */
}
.ckw-title-line h1::after,
.ckw-title-line h2::after {
	content: '';
	position: absolute;
	bottom: -16px;                /* tuż pod tekstem */
	right: 0;                     /* kończy na ostatniej literze tytułu */
	left: calc(50% - 50vw - var(--ckw-space-16, 16px));  /* sięga do lewej krawędzi viewportu */
	height: 3px;
	background: var(--ckw-black);
}

/* ---------- Buttons ---------- */
.ckw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 28px;
	border-radius: var(--ckw-radius-pill);
	background: var(--ckw-red);
	color: #fff;
	font-family: var(--ckw-font-sans);
	font-weight: 600;
	font-size: 18px;
	border: 0;
	text-decoration: none;
	transition: background .2s var(--ckw-ease), transform .15s var(--ckw-ease);
}
.ckw-btn:hover { background: var(--ckw-red-dark); text-decoration: none; transform: translateY(-1px); }
.ckw-btn--ghost { background: transparent; color: var(--ckw-ink); border: 2px solid var(--ckw-ink); }
.ckw-btn--ghost:hover { background: var(--ckw-ink); color: var(--ckw-cream); }

/* ---------- Contact (Kontakt) page ---------- */
.ckw-contact { padding: clamp(32px, 5vw, 64px) 0 80px; }
.ckw-contact__section {
	max-width: var(--ckw-container);
	margin: 0 auto 64px;
	padding-inline: clamp(16px, 4vw, 24px);
}
.ckw-contact__heading {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	color: var(--ckw-dark);
	margin: 0 0 var(--ckw-space-24);
}

/* Siedziba: 2 kolumny mapa | dane */
.ckw-contact__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ckw-space-40);
	align-items: start;
}
.ckw-contact__map {
	aspect-ratio: 600 / 495;
	background: var(--ckw-gray);
	border-radius: var(--ckw-radius-sm);
	overflow: hidden;
	position: relative;
}
.ckw-contact__map iframe { width: 100%; height: 100%; border: 0; }
.ckw-contact__map-placeholder {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	color: var(--ckw-muted-2);
	font-family: var(--ckw-font-primary);
	letter-spacing: 0.1em;
	font-size: var(--ckw-fs-14);
	text-transform: uppercase;
	background:
		repeating-linear-gradient(45deg, rgba(255,255,255,.5) 0 14px, transparent 14px 28px),
		var(--ckw-gray);
}
.ckw-contact__details {
	display: flex; flex-direction: column;
	gap: var(--ckw-space-24);
	font-family: var(--ckw-font-primary);
}
.ckw-contact__name {
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	line-height: 1.15;
	margin: 0;
	color: var(--ckw-dark);
}
.ckw-contact__details p { margin: 0; font-size: var(--ckw-fs-18); line-height: 1.55; }
.ckw-contact__details a {
	color: var(--ckw-dark);
	text-decoration: none; /* bez podkreślenia — hover zmienia tylko kolor (uwaga Weroniki) */
}
.ckw-contact__details a:hover { color: var(--ckw-red); }
.ckw-contact__details .ckw-account-info { color: var(--ckw-muted-2); font-size: var(--ckw-fs-15, 15px); }

/* === Teams: 3-kolumnowy układ === */
.ckw-teams {
	max-width: var(--ckw-container);
	margin: 0 auto var(--ckw-space-80);
	padding-inline: clamp(16px, 4vw, 24px);
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--ckw-space-48) var(--ckw-space-32);
	align-items: start;
}
.ckw-team-col {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-16);
}
.ckw-team-col__title {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	color: var(--ckw-dark);
	margin: 0 0 var(--ckw-space-8);
	line-height: 1.15;
}

/* Person row */
.ckw-person {
	display: flex;
	gap: var(--ckw-space-20);
	padding: var(--ckw-space-8) 0;
}
.ckw-person__bar {
	width: 6px;
	flex-shrink: 0;
	background: var(--ckw-red);    /* czerwony jak na live'ie u Dyrektora */
	border-radius: 0;              /* płaski prostokąt */
}
.ckw-person--accent .ckw-person__bar { background: var(--ckw-red); }
.ckw-person__body {
	padding: var(--ckw-space-4) 0;
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-16);
}
.ckw-person__head {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	line-height: 1.4;
	margin: 0;
	color: var(--ckw-dark);
}
.ckw-person__head strong {
	display: block;
	font-weight: 700;
}
.ckw-person__contact {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	line-height: 1.5;
	margin: 0;
	color: var(--ckw-dark);
}
.ckw-person__contact a {
	color: var(--ckw-dark);
	text-decoration: none; /* bez podkreślenia — hover zmienia tylko kolor (uwaga Weroniki) */
}
.ckw-person__contact a:hover { color: var(--ckw-red); }

/* Pozostałe filie: każda jako 2-kolumnowy row, map + details (z koordynacją pod spodem) */
.ckw-branch {
	max-width: var(--ckw-container);
	margin: 0 auto var(--ckw-space-64);
	padding-inline: clamp(16px, 4vw, 24px);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ckw-space-40);
	align-items: start;
}
.ckw-branch__details {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-24);
	font-family: var(--ckw-font-primary);
}
.ckw-branch__details h3 {
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	line-height: 1.15;
	margin: 0;
	color: var(--ckw-dark);
}
.ckw-branch__details p { margin: 0; font-size: var(--ckw-fs-18); line-height: 1.55; }
.ckw-branch__details a {
	color: var(--ckw-dark);
	text-decoration: none; /* bez podkreślenia — hover zmienia tylko kolor (uwaga Weroniki) */
}
.ckw-branch__details a:hover { color: var(--ckw-red); }
.ckw-branch__staff {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-12);
	margin-top: var(--ckw-space-8);
}

@media (max-width: 980px) {
	.ckw-teams { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
	.ckw-teams { grid-template-columns: 1fr; }
	.ckw-contact__row,
	.ckw-branch { grid-template-columns: 1fr; }
}

/* ---------- Site footer ---------- */
.ckw-site-footer {
	background: var(--ckw-footer-bg);
	color: var(--ckw-cream);
	font-family: var(--ckw-font-sans);
}
.ckw-footer {
	max-width: 1440px;
	margin: 0 auto;
	padding: 64px clamp(24px, 5vw, 64px);
	display: grid;
	grid-template-columns: minmax(220px, 1fr) minmax(260px, 1.2fr) minmax(280px, 1.5fr);
	gap: clamp(32px, 4vw, 64px);
	align-items: start;
}
@media (max-width: 1100px) {
	.ckw-footer { grid-template-columns: 1fr 1fr; }
	.ckw-footer__brand { grid-column: 1 / -1; }
}
.ckw-footer__brand {
	display: flex; flex-direction: column; gap: 28px;
}
.ckw-logo--cream {
	width: 200px; height: auto;
}
.ckw-footer__social-label {
	margin: 0 0 10px;
	font-size: 18px;
}
.ckw-social-list {
	list-style: none; margin: 0; padding: 0;
	display: flex; gap: 12px;
}
.ckw-social-list a {
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px;
	background: var(--ckw-cream);
	color: var(--ckw-footer-bg);
	border-radius: 50%;
	transition: background .15s var(--ckw-ease), color .15s var(--ckw-ease);
}
.ckw-social-list a:hover { background: var(--ckw-red); color: #fff; text-decoration: none; }
.ckw-footer__heading {
	font-family: var(--ckw-font-sans);
	font-weight: 700;
	font-size: 24px;
	margin: 0 0 32px;
	color: var(--ckw-cream);
}
.ckw-footer__grid {
	display: grid;
	grid-template-columns: minmax(140px, auto) 1fr;
	gap: 24px 32px;
}
.ckw-footer__grid p { margin: 0 0 8px; line-height: 1.4; }
.ckw-footer__grid a { color: var(--ckw-cream); }
.ckw-footer__grid a:hover { color: var(--ckw-red); text-decoration: none; }
.ckw-footer .ckw-menu {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-direction: column; gap: 16px;
}
.ckw-footer .ckw-menu a { color: var(--ckw-cream); font-size: 18px; }
.ckw-footer .ckw-menu a:hover { color: var(--ckw-red); }


/* ============================================================
   HOME PAGE — Hero, Calendar, News, Newsletter
   ============================================================ */

/* ---------- Single news/event post ---------- */
.ckw-single-post {
	max-width: var(--ckw-container);
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 24px) clamp(48px, 6vw, 96px);
	display: grid;
	grid-template-columns: 569px 1fr;
	gap: 46px;
	align-items: start;
}
.ckw-single-post__hero-image {
	width: 100%;
	height: auto;
	display: block;
}
/* Wariant dla Grup Artystycznych — kwadratowe zdjęcie (przycięte) */
.ckw-single-post--group .ckw-single-post__hero-image { aspect-ratio: 1 / 1; object-fit: cover; }
.ckw-single-post--group { grid-template-columns: 525px 1fr; }
@media (max-width: 900px) {
	.ckw-single-post--group { grid-template-columns: 1fr; }
}
.ckw-single-post__body {
	display: flex;
	flex-direction: column;
	gap: 30px;
	font-family: var(--ckw-font-primary);
}

.ckw-single-post__tag {
	display: inline-block;
	align-self: flex-start;
	padding: 6px 24px;
	background: var(--ckw-light-blue);
	border-radius: var(--ckw-radius-pill);
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
}
.ckw-single-post__title {
	font-weight: 700;
	font-size: var(--ckw-fs-36);
	line-height: 1.28;
	color: var(--ckw-dark);
	margin: 0;
}

/* Meta — data box + 2 pille obok */
.ckw-single-post__meta {
	display: flex;
	/* Box daty 194px + dwa chipy po 200px przekraczają kolumnę treści (569px). */
	flex-wrap: wrap;
	gap: 18px;
	align-items: center;
}
.ckw-single-post__date {
	width: 194px;
	min-height: 85px;
	border: 2px solid var(--ckw-black);
	background: transparent;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 12px 18px;
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
	line-height: 1.2;
	text-align: center;
}
.ckw-single-post__date strong { font-size: 22px; display: block; }
.ckw-single-post__meta-chips {
	display: flex;
	flex-direction: column;
	gap: 15px;
}
.ckw-single-post__meta-chip {
	/* 200px było szerokością SZTYWNĄ — długie „Międzypokoleniowe Centrum Edukacji"
	   wychodziło poza chip. Teraz to minimum, a chip rośnie w dół. */
	min-width: 200px;
	max-width: 100%;
	min-height: 35px;
	background: var(--ckw-light-blue);
	border-radius: var(--ckw-radius-pill);
	padding: 6px 18px;
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 8px;
	line-height: 1.25;
	overflow-wrap: anywhere;
}
.ckw-single-post__meta-chip svg { width: 14px; height: 14px; flex-shrink: 0; }

/* Akordeony */
.ckw-accordion {
	background: #FFF7F0;
	border: 2px solid var(--ckw-dark);
}
.ckw-accordion__head {
	width: 100%;
	background: transparent;
	border: 0;
	padding: 16px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
	cursor: pointer;
	text-align: left;
}
.ckw-accordion__icon { font-size: 18px; line-height: 1; transition: transform .2s var(--ckw-ease); flex-shrink: 0; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; }
.ckw-accordion[open] .ckw-accordion__icon { transform: rotate(45deg); }
.ckw-accordion__body {
	padding: 0 24px 20px;
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	line-height: 1.55;
	color: var(--ckw-dark);
}
.ckw-accordion__body p { margin: 0 0 16px; }
.ckw-accordion__body p:last-child { margin-bottom: 0; }

/* Galeria w akordeonie */
.ckw-gallery {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}
.ckw-gallery__item {
	aspect-ratio: 1 / 1;
	background: var(--ckw-gray) center/cover no-repeat;
	display: block;
}

/* CTA na dole */
.ckw-single-post__cta-wrap {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 12px;
	margin-top: 16px;
	flex-wrap: wrap;
}
.ckw-single-post__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	background: var(--ckw-red);
	color: var(--ckw-white);
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	border-radius: var(--ckw-radius-pill);
	text-decoration: none;
	border: 2px solid var(--ckw-red);
	transition: background .15s var(--ckw-ease), color .15s var(--ckw-ease);
}
.ckw-single-post__cta:hover { background: var(--ckw-dark-red); border-color: var(--ckw-dark-red); }
.ckw-single-post__cta--ghost {
	background: transparent;
	color: var(--ckw-dark);
	border-color: var(--ckw-black);
}
.ckw-single-post__cta--ghost:hover { background: var(--ckw-dark); color: var(--ckw-cream); border-color: var(--ckw-dark); }

@media (max-width: 900px) {
	/* minmax(0,1fr) — track może zejść poniżej min-content, żeby max-width:100%
	   na obrazkach/treści WYSIWYG faktycznie zadziałało (inaczej szeroki img rozpycha grid) */
	.ckw-single-post { grid-template-columns: minmax(0, 1fr); }
}
/* Media w treści wpisu nigdy szersze niż kolumna (importowane obrazki mają natywne wymiary) */
.ckw-single-post__body img,
.ckw-single-post__body iframe,
.ckw-single-post__body video,
.ckw-single-post__body table { max-width: 100%; }
.ckw-single-post__body img { height: auto; }
.ckw-news-page { padding-bottom: clamp(48px, 6vw, 96px); }
.ckw-news-page__filters {
	max-width: var(--ckw-container);
	margin: 0 auto var(--ckw-space-32);
	padding: 0 clamp(16px, 4vw, 24px);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ckw-space-16);
}
.ckw-news-page__filters select {
	width: 100%;
	border: 2px solid var(--ckw-dark);
	background: transparent;
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	padding: 6px 18px;
	height: 40px;
	color: var(--ckw-dark);
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E2022' stroke-width='2'%3E%3Cpolyline points='6,9 12,15 18,9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 16px;
	padding-right: 36px;
}

.ckw-news-page__section-title {
	max-width: var(--ckw-container);
	margin: 0 auto var(--ckw-space-24);
	padding: 0 clamp(16px, 4vw, 24px);
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	color: var(--ckw-dark);
}

.ckw-news-list {
	max-width: var(--ckw-container);
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 24px);
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-32);
}

/* Karta szeroka — 2 kolumny (image | content) */
.ckw-news-wide {
	display: grid;
	/*
	 * 268px, nie 381px — kolumna zwężona przy przejściu na format 3:4 (19.08).
	 * Przy dawnej szerokości pionowy obrazek urósłby do 508px i wiersz spuchłby
	 * o jedną trzecią, zostawiając pustkę pod tekstem. 268×357 trzyma wysokość
	 * wiersza tam, gdzie była, a tekst dostaje więcej miejsca.
	 */
	grid-template-columns: 268px 1fr;
	gap: 32px;
	padding: 30px;
	border: 2px solid var(--ckw-black);
	background: transparent;
	font-family: var(--ckw-font-primary);
}

/* Lewa: zdjęcie + 2 pille */
.ckw-news-wide__media {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-24);
}
.ckw-news-wide__image {
	width: 100%;
	/*
	 * 3:4 — ten sam format co kafelki na stronie głównej. Amina 18.08: listy
	 * pod /aktualnosci/, /wydarzenia/ i /grupy-artystyczne/ zostały kwadratowe,
	 * „a dobrze byłoby mieć wszędzie ten sam format”. Jedna grafika obsługuje
	 * wtedy i social, i stronę.
	 */
	aspect-ratio: 3 / 4;
	background: #B1B1B1 center/cover no-repeat;
	display: block;
}
/* Grupy artystyczne trzymają ten sam format co reszta list — było 1/1. */
.ckw-news-wide--group .ckw-news-wide__image { aspect-ratio: 3 / 4; }
.ckw-news-wide__chips {
	/*
	 * `flex-wrap: wrap` — bez tego dwa chipy walczyły o 268px kolumny i wylewały się
	 * poza obrys karty w OBIE strony (kontener jest wyśrodkowany, a `.ckw-news-wide`
	 * nie ma `overflow: hidden`, więc było to widać). Pomiar na /grupy-artystyczne/
	 * 19.08: 267px chipów w kontenerze 268px, czyli zapas jednego piksela.
	 * `justify-content: center` zostaje — chipy są podpisem pod wyśrodkowanym zdjęciem,
	 * a `gap` obsługuje też odstęp między wierszami po zawinięciu.
	 */
	display: flex;
	flex-wrap: wrap;
	gap: 19px;
	justify-content: center;
}
.ckw-news-wide__chip {
	/* Reszta (min-height, line-height 1.2, text-align: center) już obsługuje
	   tekst wielowierszowy; brakowało tylko łamania bardzo długich słów. */
	overflow-wrap: break-word;
	max-width: 100%;
	min-height: 35px;
	background: var(--ckw-light-blue);
	border-radius: var(--ckw-radius-pill);
	padding: 6px 16px;
	font-family: var(--ckw-font-primary);
	font-size: 15px;
	color: var(--ckw-dark);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	line-height: 1.2;
	text-align: center;
}
.ckw-news-wide__chip svg { width: 14px; height: 14px; flex-shrink: 0; }
/* Chip z ikoną kalendarza (dla zakresu dat — Wystawy) */
.ckw-news-wide__chip--date svg { width: 16px; height: 16px; }

/* Prawa: tag + (data | tytuł) + excerpt + button "więcej" */
.ckw-news-wide__content {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-16);
	min-width: 0;
}
.ckw-news-wide__tag {
	align-self: flex-start;
	display: inline-block;
	padding: 6px 24px;
	background: var(--ckw-light-blue);
	border: none;
	border-radius: var(--ckw-radius-pill);
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
}
.ckw-news-wide__row {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 17px;
	align-items: center;
}
.ckw-news-wide__date {
	width: 136px;
	height: 85px;
	border: 2px solid var(--ckw-black);
	background: transparent;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	font-family: var(--ckw-font-primary);
	font-size: 28px;
	font-weight: 700;
	color: var(--ckw-black);
	line-height: 1;
}
.ckw-news-wide__date small {
	font-weight: 400;
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
}
.ckw-news-wide__title {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	line-height: 1.4;
	color: var(--ckw-dark);
	margin: 0;
}
.ckw-news-wide__title a { color: inherit; text-decoration: none; }
.ckw-news-wide__title a:hover { color: var(--ckw-red); }
.ckw-news-wide__excerpt {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	line-height: 1.4;
	color: var(--ckw-dark);
	text-align: justify;
	margin: 0;
}
.ckw-news-wide__cta {
	align-self: flex-end;
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 32px;
	background: var(--ckw-red);
	color: var(--ckw-white);
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	border-radius: var(--ckw-radius-pill);
	text-decoration: none;
	transition: background .15s var(--ckw-ease);
}
.ckw-news-wide__cta:hover { background: var(--ckw-dark-red); }
/* Wariant CTA "więcej →" — czarny z chevronem (Wystawy) */
.ckw-news-wide__cta--dark {
	background: var(--ckw-dark);
	color: var(--ckw-cream);
}
.ckw-news-wide__cta--dark:hover { background: var(--ckw-black); }
.ckw-news-wide__cta--dark svg {
	width: 16px;
	height: 16px;
	margin-left: 6px;
}

@media (max-width: 900px) {
	.ckw-news-wide { grid-template-columns: 1fr; }
	.ckw-news-page__filters { grid-template-columns: 1fr; }
}
.ckw-hero {
	position: relative;
	background: var(--ckw-light-gray);
	height: 100vh;
	height: 100dvh;
	display: flex;
	align-items: center;
	justify-content: center;
	isolation: isolate;
	margin-top: calc(-1 * var(--ckw-hero-overlap, 140px));  /* nakłada się pod nagłówek */
}

/* Slot na zdjęcie LUB film w tle — fixed scroll-over:
   video przyklejone do top:0 viewportu (zawsze 100vh). Kolejne sekcje
   (z własnym tłem) wjeżdżają NA niego od dołu i go przykrywają, więc
   po przewinięciu ~100vh user widzi już tylko content (video "puszcza"). */
.ckw-hero__media {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	height: 100dvh;
	overflow: hidden;
	pointer-events: none;
}
.ckw-hero__media img,
.ckw-hero__media video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}
/* Tło YouTube (iframe) — "cover" przez nadwymiarowanie 16:9 w obu osiach */
.ckw-hero__yt {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100vw;
	height: 56.25vw;       /* 16:9 względem szerokości */
	min-width: 177.78vh;   /* 16:9 względem wysokości */
	min-height: 100vh;
	min-height: 100dvh;
	transform: translate(-50%, -50%);
	border: 0;
	pointer-events: none;
}
/* Półprzezroczysty biały overlay nad zdjęciem — żeby typografia była czytelna */
.ckw-hero__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, 0.55);
	pointer-events: none;
}

/* Typografia 25-lecia — nad zdjęciem */
.ckw-hero__art {
	position: relative;
	max-width: 920px;
	width: 100%;
	padding: 0 clamp(16px, 4vw, 24px);
	z-index: 1;
}
.ckw-hero__art img { width: 100%; height: auto; display: block; }

/* ---------- Calendar section (strona główna) ---------- */
.ckw-calendar-section {
	background: var(--ckw-bg);
	padding: clamp(24px, 4vw, 48px) 0 clamp(48px, 6vw, 96px);
	position: relative;
	z-index: 1;
}

/* Sekcje pod hero muszą być NAD fixed video żeby je przykryć przy scrollu */
.ckw-section-news,
.ckw-newsletter,
.ckw-site-footer {
	position: relative;
	z-index: 1;
}
.ckw-section-news {
	background: var(--ckw-bg);
	/* padding-bottom przejmuje margin który był na .ckw-newsletter (80px),
	   żeby przestrzeń między news a newsletter była pokryta BG (inaczej fixed media prześwieca) */
	padding-bottom: 80px;
	/* flow-root zatrzymuje margin-collapse z .ckw-section-heading wewnątrz —
	   inaczej margin-top heading wycieka poza section i robi dziurę nad BG */
	display: flow-root;
}
.ckw-calendar-section__inner {
	max-width: var(--ckw-container);
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 24px);
}

/* Nagłówek miesiąca + chevron */
.ckw-month-nav {
	display: flex;
	align-items: center;
	gap: var(--ckw-space-12);
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	color: var(--ckw-dark);
	margin: 0 0 var(--ckw-space-24);
}
.ckw-month-nav button {
	background: transparent;
	border: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: var(--ckw-space-8);
	padding: 4px 8px;
	border-radius: 4px;
}
.ckw-month-nav button:hover { color: var(--ckw-red); }
.ckw-month-nav__chev { font-size: 22px; line-height: 1; display: inline-block; }

/* Filtry — 3 dropdowny */
.ckw-cal-filters {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--ckw-space-16);
	margin-bottom: var(--ckw-space-32);
}
.ckw-cal-filters select {
	width: 100%;
	border: 2px solid var(--ckw-dark);
	background: transparent;
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	padding: 6px 18px;
	height: 40px;
	color: var(--ckw-dark);
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E2022' stroke-width='2'%3E%3Cpolyline points='6,9 12,15 18,9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 16px;
	padding-right: 36px;
}
.ckw-cal-filters select:focus-visible { outline-offset: 2px; }

/* === Custom select (zastępuje natywny dropdown, daje pełną kontrolę nad hover) === */
.ckw-cs {
	position: relative;
}
.ckw-cs__native {
	/* Visually-hidden ale wciąż dostępny dla form submit i AT */
	position: absolute;
	width: 1px; height: 1px;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	overflow: hidden;
	white-space: nowrap;
}
.ckw-cs__trigger {
	width: 100%;
	border: 2px solid var(--ckw-dark);
	background: transparent;
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	padding: 6px 18px;
	height: 40px;
	color: var(--ckw-dark);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	cursor: pointer;
	text-align: left;
}
.ckw-cs__chev {
	font-size: 14px;
	line-height: 1;
	transition: transform .15s var(--ckw-ease);
}
.ckw-cs.is-open .ckw-cs__chev { transform: rotate(180deg); }
.ckw-cs__list {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	z-index: 20;
	margin: 0;
	padding: 6px 0;
	list-style: none;
	background: var(--ckw-white);
	border: 2px solid var(--ckw-dark);
	max-height: 320px;
	overflow-y: auto;
	box-shadow: var(--ckw-shadow-md);
}
.ckw-cs__list[hidden] { display: none; }
.ckw-cs__option {
	padding: 10px 18px;
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
	cursor: pointer;
	outline: none;
}
.ckw-cs__option:hover,
.ckw-cs__option:focus,
.ckw-cs__option.is-selected {
	background: var(--ckw-dark);
	color: var(--ckw-cream);
}

/* Główny grid: kalendarz + lista wydarzeń */
.ckw-cal-main {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: clamp(24px, 4vw, 64px);
	align-items: start;
}

/* === Siatka kalendarza === */
.ckw-cal-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 0;
	font-family: var(--ckw-font-primary);
}
.ckw-cal-grid__dayname {
	font-size: var(--ckw-fs-14);
	color: var(--ckw-dark);
	letter-spacing: 0.06em;
	padding: var(--ckw-space-12) var(--ckw-space-8) var(--ckw-space-8);
	text-transform: uppercase;
	font-weight: 400;
	text-align: left;
}
.ckw-cal-grid__day {
	background: transparent;
	border: 0;
	padding: var(--ckw-space-16) var(--ckw-space-12);
	font: inherit;
	font-size: 22px;
	font-weight: 600;
	color: var(--ckw-dark);
	text-align: left;
	cursor: pointer;
	border-top: 1px solid var(--ckw-dark);
	transition: background-color .15s var(--ckw-ease), color .2s var(--ckw-ease), opacity .2s var(--ckw-ease);
}
.ckw-cal-grid__day:hover:not(:disabled):not(.is-muted) { background: rgba(0,0,0,0.04); }
/* .is-empty — dzień bez żadnych eventów (disabled, nieklikalny) */
.ckw-cal-grid__day.is-empty {
	color: var(--ckw-gray);
	cursor: default;
	opacity: 0.55;
}
/* .is-muted — dzień z eventami ale żaden nie pasuje do aktywnego filtra (klikalny, panel pokaże fallback) */
.ckw-cal-grid__day.is-muted {
	color: var(--ckw-gray);
	opacity: 0.4;
}
.ckw-cal-grid__day.is-muted:hover { opacity: 0.7; background: rgba(0,0,0,0.02); }
.ckw-cal-grid__day.is-selected {
	background: var(--ckw-light-blue);
	color: var(--ckw-dark);
	opacity: 1;
}
.ckw-cal-grid__day.is-selected.is-muted { opacity: 1; }
.ckw-cal-grid__day:focus-visible { outline-offset: -3px; }

/* === Lista wydarzeń wybranego dnia === */
.ckw-cal-day {
	padding: var(--ckw-space-8) 0;
}
.ckw-cal-day__header {
	display: flex;
	align-items: center;
	gap: var(--ckw-space-12);
	margin-bottom: var(--ckw-space-24);
}
.ckw-cal-day__bar {
	width: 60px;
	height: 4px;
	background: var(--ckw-light-blue);
	display: inline-block;
}
.ckw-cal-day__title {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
	text-transform: uppercase;
	margin: 0;
	letter-spacing: 0.04em;
}
.ckw-cal-day__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}
.ckw-cal-day__item {
	display: grid;
	grid-template-columns: 100px 1fr;
	gap: var(--ckw-space-16);
	padding: var(--ckw-space-16) 0;
	font-family: var(--ckw-font-primary);
}
.ckw-cal-day__time {
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
	white-space: nowrap;
	padding-top: 2px;
}
.ckw-cal-day__name {
	font-size: var(--ckw-fs-18);
	font-weight: 700;
	color: var(--ckw-dark);
	margin: 0;
	line-height: 1.4;
}
.ckw-cal-day__name a { color: inherit; text-decoration: none; }
.ckw-cal-day__name a:hover { color: var(--ckw-red); text-decoration: none; }
.ckw-cal-day__empty {
	color: var(--ckw-muted-2);
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	font-style: italic;
}

/* Fallback: "Najbliższe pasujące: <link>" gdy filtry aktywne i brak eventów w dniu */
.ckw-cal-day__nearest {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-16);
	color: var(--ckw-dark);
	margin-top: var(--ckw-space-12);
	line-height: 1.5;
}
.ckw-cal-day__nearest a {
	color: var(--ckw-dark);
	text-decoration: none;
}
.ckw-cal-day__nearest a:hover { color: var(--ckw-red); }
.ckw-cal-day__nearest-title { font-weight: 700; }

/* === Custom select: × reset button (pojawia się gdy filtr aktywny) === */
.ckw-cs__clear {
	position: absolute;
	right: 6px;
	top: 50%;
	transform: translateY(-50%);
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 0;
	background: transparent;
	color: var(--ckw-dark);
	font-family: var(--ckw-font-primary);
	font-size: 22px;
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
	padding: 0;
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 2;
	transition: background-color .15s var(--ckw-ease), color .15s var(--ckw-ease);
}
.ckw-cs__clear:hover {
	background: var(--ckw-dark);
	color: var(--ckw-cream);
}
.ckw-cs.is-filled .ckw-cs__clear { display: inline-flex; }
.ckw-cs.is-filled .ckw-cs__chev { display: none; }
.ckw-cs.is-filled .ckw-cs__trigger { font-weight: 600; padding-right: 40px; }

/* "wyczyść wszystkie filtry" — pojawia się gdy ≥1 filtr aktywny */
.ckw-cal-filters__clear-all {
	grid-column: 1 / -1;
	justify-self: end;
	background: none;
	border: 0;
	text-decoration: underline;
	cursor: pointer;
	color: var(--ckw-dark);
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-14);
	padding: 0;
	margin-top: calc(var(--ckw-space-16) * -1);
	display: none;
}
.ckw-cal-filters__clear-all:hover { color: var(--ckw-red); }
.ckw-cal-filters.has-active .ckw-cal-filters__clear-all { display: inline-block; }

/* Responsywność kalendarza */
@media (max-width: 980px) {
	.ckw-cal-main { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.ckw-cal-filters { grid-template-columns: 1fr; gap: var(--ckw-space-8); }
	.ckw-cal-grid__day { font-size: 16px; padding: var(--ckw-space-8) var(--ckw-space-4); }
	.ckw-cal-day__item { grid-template-columns: 80px 1fr; }
}

/* ---------- Section heading (Aktualności etc.) ---------- */
.ckw-section-heading {
	max-width: var(--ckw-container);
	margin: clamp(48px, 6vw, 80px) auto var(--ckw-space-32);
	padding: 0 clamp(16px, 4vw, 24px);
}
.ckw-section-heading h2 {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	color: var(--ckw-dark);
	margin: 0;
	display: inline-block;
	position: relative;
	padding-bottom: var(--ckw-space-12);
}
.ckw-section-heading h2::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	left: calc(50% - 50vw - var(--ckw-space-16, 16px));
	height: 3px;
	background: var(--ckw-black);
}

/* ---------- Posts grid (Aktualności) ---------- */
.ckw-posts-grid {
	max-width: var(--ckw-container);
	margin: 32px auto;
	padding: 0 clamp(16px, 4vw, 24px);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
}
.ckw-posts-grid--3col { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px) { .ckw-posts-grid--3col { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .ckw-posts-grid--3col { grid-template-columns: 1fr; } }

/* ---------- Pagination ---------- */
.ckw-pagination {
	max-width: var(--ckw-container);
	margin: 32px auto 0;
	padding: 0 clamp(16px, 4vw, 24px);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--ckw-space-8);
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
}
.ckw-pagination ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: var(--ckw-space-8);
	list-style: none;
	margin: 0;
	padding: 0;
}
.ckw-pagination li { list-style: none; margin: 0; padding: 0; }
.ckw-pagination a, .ckw-pagination span {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 36px; height: 36px; padding: 0 10px;
	color: var(--ckw-muted-2); text-decoration: none;
	transition: color .15s var(--ckw-ease);
}
.ckw-pagination .is-current, .ckw-pagination .current { color: var(--ckw-dark); font-weight: 700; }
.ckw-pagination a:hover { color: var(--ckw-red); }
.ckw-pagination .prev, .ckw-pagination .next { color: var(--ckw-dark); font-size: 22px; }

/* ---------- Newsletter ---------- */
.ckw-newsletter {
	background: var(--ckw-white);
}
.ckw-newsletter__inner {
	max-width: var(--ckw-container);
	margin: 0 auto;
	padding: clamp(40px, 5vw, 64px) clamp(16px, 4vw, 24px);
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: clamp(24px, 4vw, 64px);
	align-items: start;
}
.ckw-newsletter__heading {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-36);
	margin: 0 0 var(--ckw-space-12);
	color: var(--ckw-gray);
}
.ckw-newsletter__body {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	color: var(--ckw-gray);
	line-height: 1.4;
	margin: 0;
	max-width: 480px;
}
.ckw-newsletter__cta {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
	margin: 0 0 var(--ckw-space-12);
}
.ckw-newsletter__form {
	display: flex;
	align-items: center;
	gap: var(--ckw-space-12);
	padding: 6px 6px 6px 18px;
	border: 2px solid var(--ckw-black);
	border-radius: var(--ckw-radius-pill);
	background: var(--ckw-white);
}
.ckw-newsletter__form input {
	flex: 1;
	border: 0;
	padding: 12px 0;
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	background: transparent;
	outline: none;
	min-width: 0;
	color: var(--ckw-dark);
}
.ckw-newsletter__form input::placeholder { color: rgba(0,0,0,0.5); }
.ckw-newsletter__submit {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 26px;
	border-radius: var(--ckw-radius-pill);
	background: var(--ckw-red);
	color: var(--ckw-white);
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	border: 0;
	transition: background .15s var(--ckw-ease);
	cursor: pointer;
}
.ckw-newsletter__submit:hover { background: var(--ckw-dark-red); }

/* Fluent Forms wewnątrz pigułki newslettera — wygląd 1:1 ze wzoru (preview-home.html).
   FF zostaje natywny (zapis do bazy, nonce, hook MessageFlow) — nadpisujemy tylko styl. */
.ckw-newsletter__form.ckw-newsletter__form--ff { background: transparent; padding: 6px 6px 6px 24px; }
.ckw-newsletter__form--ff .fluentform { flex: 1 1 auto; width: 100%; min-width: 0; }
.ckw-newsletter__form--ff .frm-fluent-form { width: 100%; min-width: 0; margin: 0; }
.ckw-newsletter__form--ff .frm-fluent-form fieldset { display: flex; align-items: center; gap: var(--ckw-space-12, 12px); width: 100%; margin: 0; padding: 0; border: 0; min-width: 0; }
.ckw-newsletter__form--ff .ff-el-group { margin: 0 !important; flex: 1 1 auto; }
.ckw-newsletter__form--ff .ff_submit_btn_wrapper { flex: 0 0 auto; }
.ckw-newsletter__form--ff .ff-el-input--label { display: none !important; }
.ckw-newsletter__form--ff .ff-el-input--content { padding: 0 !important; margin: 0 !important; }
.ckw-newsletter__form--ff input.ff-el-form-control {
	flex: 1; width: 100%;
	border: 0 !important; background: transparent !important; box-shadow: none !important;
	border-radius: 0 !important; outline: none !important;
	padding: 10px 0 !important; min-height: 0 !important; height: auto !important;
	color: var(--ckw-dark); font-family: var(--ckw-font-primary); font-size: var(--ckw-fs-18);
}
.ckw-newsletter__form--ff input.ff-el-form-control::placeholder { color: rgba(0,0,0,0.5); opacity: 1; }
.ckw-newsletter__form--ff .ff-btn-submit {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 44px; padding: 12px 40px; border: 0 !important; border-radius: var(--ckw-radius-pill) !important;
	background: var(--ckw-red) !important; color: #fff !important; cursor: pointer; box-shadow: none !important;
	font-family: var(--ckw-font-primary); font-weight: 700; font-size: var(--ckw-fs-18);
	transition: background .15s var(--ckw-ease); white-space: nowrap;
}
.ckw-newsletter__form--ff .ff-btn-submit:hover { background: var(--ckw-dark-red) !important; }
.ckw-newsletter__form--ff .ff-el-is-error .text-danger,
.ckw-newsletter__form--ff .error { font-family: var(--ckw-font-primary); font-size: var(--ckw-fs-14); }

/* Pole maila: usuń białe tło autouzupełniania przeglądarki (-webkit-autofill).
   Domyślnie autofill maluje pole na biało (priorytet user-agent, którego
   'background: transparent' nie ruszy) — zalewamy je kolorem wnętrza pigułki
   (jasnoniebieskie tło sekcji), tekst zostaje ciemny. */
.ckw-newsletter__form--ff input.ff-el-form-control:-webkit-autofill,
.ckw-newsletter__form--ff input.ff-el-form-control:-webkit-autofill:hover,
.ckw-newsletter__form--ff input.ff-el-form-control:-webkit-autofill:focus,
.ckw-newsletter__form--ff input.ff-el-form-control:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0 1000px var(--ckw-light-blue) inset !important;
	box-shadow: 0 0 0 1000px var(--ckw-light-blue) inset !important;
	-webkit-text-fill-color: var(--ckw-dark) !important;
	caret-color: var(--ckw-dark);
	transition: background-color 100000s ease-in-out 0s !important;
}

/* Stan po wysłaniu: czarna pigułka ZOSTAJE (element designu). Zerujemy tylko
   własne style kontenera Fluent Forms (delikatna ramka + padding), które
   powiększały pigułkę i rozjeżdżały layout. Komunikat wpisany w pigułkę,
   wysokość = wiersz pola, żeby pigułka nie zmieniała rozmiaru. */
.ckw-newsletter__form--ff .ff-message-success,
.ckw-newsletter__form--ff .ff-errors-in-stack {
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	margin: 0 !important;
	padding: 0 !important;
	color: var(--ckw-dark);
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-16);
	line-height: 1.3;
	text-align: left;
}
/* Wysokość = wiersz pola TYLKO gdy kontener ma treść. Pusty stack błędów /
   pusty komunikat zwija się do zera i NIE rozpycha pigułki w dół. */
.ckw-newsletter__form--ff .ff-message-success:not(:empty),
.ckw-newsletter__form--ff .ff-errors-in-stack:not(:empty) {
	min-height: 44px;
	display: flex;
	align-items: center;
}
@media (max-width: 640px) {
	.ckw-newsletter__form.ckw-newsletter__form--ff { padding: 6px; }
	.ckw-newsletter__form--ff .frm-fluent-form fieldset { flex-direction: column; align-items: stretch; gap: 8px; }
	.ckw-newsletter__form--ff .ff-btn-submit { width: 100%; justify-content: center; }
}

.ckw-newsletter__consent {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-14);
	color: var(--ckw-gray);
	text-align: center;
	margin: var(--ckw-space-12) 0 0;
}
.ckw-newsletter__consent a { color: inherit; text-decoration: underline; }
.ckw-newsletter__consent a:hover { color: var(--ckw-red); }
@media (max-width: 800px) {
	.ckw-newsletter__inner { grid-template-columns: 1fr; }
}

/* ---------- Aktualności (news) card ---------- */
.ckw-card-news {
	background: #FFF7F0;
	border: 2px solid var(--ckw-dark);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform .2s var(--ckw-ease), box-shadow .2s var(--ckw-ease);
	text-decoration: none;
	color: inherit;
	font-family: var(--ckw-font-primary);
}
.ckw-card-news:hover {
	transform: translateY(-2px);
	box-shadow: var(--ckw-shadow-md);
	text-decoration: none;
}
.ckw-card-news__head {
	padding: var(--ckw-space-32) var(--ckw-space-32) 0;
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-12);
	align-items: flex-start;
}
.ckw-card-news__tag {
	align-self: flex-end;
	display: inline-block;
	padding: 6px 22px;
	background: var(--ckw-light-blue);
	border: none;
	border-radius: var(--ckw-radius-pill);
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
}
.ckw-card-news__title {
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	line-height: 1.25;
	color: var(--ckw-dark);
	margin: 0;
}
/* Proporcja 3:4 — poprawka Aminy 17.08: jeden format grafiki na socjale i na stronę,
   żeby redakcja nie produkowała dwóch wersji tego samego materiału.
   Ta klasa obsługuje karty aktualności ORAZ wydarzeń (card-event.php używa tych samych
   klas), więc zmiana w jednym miejscu obejmuje oba typy. */
.ckw-card-news__media {
	margin: var(--ckw-space-24) var(--ckw-space-32) 0;
	aspect-ratio: 3 / 4;
	background: var(--ckw-gray) center/cover no-repeat;
	display: block;
}
.ckw-card-news__meta {
	/*
	 * Flex, nie grid — grid nie umie przenieść kolumny do nowego wiersza, a tego
	 * właśnie potrzebujemy: przy długiej nazwie lokalizacji chipy mają zejść POD
	 * box z datą zamiast rozpychać kartę. `margin-top: auto` dokleja blok meta
	 * do dołu, żeby karty w rzędzie miały wyrównane stopki.
	 */
	display: flex;
	flex-wrap: wrap;
	gap: var(--ckw-space-16);
	padding: var(--ckw-space-24) var(--ckw-space-32);
	align-items: center;
	margin-top: auto;
}
.ckw-card-news__date {
	/* Pod gridem kolumna `auto` trzymała szerokość sama; flex domyślnie kurczy. */
	flex: 0 0 auto;
	background: #FFF7F0;
	border: 2px solid var(--ckw-black);
	border-radius: 0;
	height: 85px;
	padding: 0 28px;
	font-size: 28px;
	font-weight: 700;
	text-align: center;
	line-height: 1.1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 6px;
}
.ckw-card-news__date small {
	font-weight: 400;
	font-size: var(--ckw-fs-18);
	display: block;
}
.ckw-card-news__chips {
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: stretch;
	/*
	 * 184px z designu zostaje, ale w innej roli: to PRÓG, przy którym chipy schodzą
	 * pod datę — a nie sztywne minimum szerokości chipa (to ono rozpychało kartę).
	 * `min-width: 0` zdejmuje automatyczne minimum flex-itema.
	 */
	flex: 1 1 184px;
	min-width: 0;
}
.ckw-card-news__chip {
	/*
	 * ZGŁOSZENIE KLIENTA 19.08: „Dom Pracy T…", „godz. 11:3…" — tekst ucięty w pół słowa.
	 * Powód: `min-width: 184px` przy ~123px dostępnego miejsca. Chip wychodził 65px poza
	 * kartę, a `overflow: hidden` karty ucinał go twardo. `text-overflow: ellipsis` nic
	 * nie dawał, bo chip rósł do treści (scrollWidth === clientWidth), więc nie miał
	 * czego skracać.
	 *
	 * Teraz chip ZAWIJA się do kolejnego wiersza i pokazuje pełną nazwę. Najdłuższa
	 * realna lokalizacja („Filia w Międzypokoleniowym Centrum Edukacji", 44 znaki)
	 * potrzebuje ~348px przy 14px — skracanie wielokropkiem obcięłoby ją do postaci
	 * bezużytecznej dla kogoś, kto szuka adresu.
	 *
	 * Wysokości kart się nie rozjadą: `.ckw-posts-grid` ma `align-items: stretch`,
	 * więc rząd i tak równa się do najwyższej karty.
	 * Przy jednym wierszu render jest jak dotąd: 14 × 1.25 + 12 = 29,5 < 35px.
	 */
	background: var(--ckw-light-blue);
	border-radius: var(--ckw-radius-pill);
	max-width: 100%;
	min-height: 35px;
	padding: 6px 18px;
	font-size: var(--ckw-fs-14);
	color: var(--ckw-dark);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	justify-content: center;
	text-align: center;
	line-height: 1.25;
	overflow-wrap: anywhere;
}
.ckw-card-news__chip svg {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
}
/* Blok @media (max-width: 900px) dla `.ckw-card-news__meta` USUNIĘTY 19.08.
   Robił to samo, co dziś robi `flex-wrap` — przenosił chipy pod datę — tylko na
   podstawie szerokości OKNA zamiast szerokości KARTY. Stąd błąd: ta sama karta
   w siatce 4-kolumnowej na dużym monitorze jest węższa niż na tablecie, więc przy
   901px+ chipy nadal się nie mieściły i były ucinane.
   Teraz układ steruje się treścią: `flex: 1 1 184px` na `.ckw-card-news__chips`
   przenosi je w dół dokładnie wtedy, gdy zabraknie miejsca — niezależnie od viewportu.
   `grid-template-columns` i `justify-self` byłyby tu i tak martwe po przejściu na flex. */


/* ---------- Legacy event item (used by Elementor calendar widget) ---------- */
.ckw-event-item {
	background: #fff;
	border: 1px solid var(--ckw-ink);
	border-top: 4px solid var(--ckw-red);
	width: 100%;
}
.ckw-event-item__day {
	padding: 14px 16px 6px;
	font-family: var(--ckw-font-sans);
	font-weight: 600;
	font-size: 28px;
	color: var(--ckw-ink);
}
.ckw-event-item__weekday {
	padding: 0 16px;
	font-size: 14px;
	color: var(--ckw-muted-2);
}
.ckw-event-item__body {
	padding: 12px 16px 14px;
	display: flex; gap: 12px;
	align-items: flex-start;
	border-top: 1px solid var(--ckw-muted);
	margin-top: 8px;
}
.ckw-event-item__time {
	background: var(--ckw-ink);
	color: var(--ckw-cream);
	padding: 4px 8px;
	font-size: 12px;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
}
.ckw-event-item__title {
	font-weight: 700;
	font-size: 16px;
	margin: 0 0 6px;
}
.ckw-event-item__where {
	font-size: 13px;
	color: var(--ckw-muted-2);
	margin: 0;
}

/* ---------- Generic page wrapper ---------- */
.ckw-page {
	max-width: var(--ckw-container);
	margin: 32px auto 80px;
	padding-inline: clamp(16px, 4vw, 24px);
}
.ckw-page h1 { font-size: clamp(28px, 4vw, 36px); margin: 0 0 24px; }
.ckw-page p { font-size: 18px; line-height: 1.6; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.ckw-nav { padding: 10px 20px; min-height: 64px; }
	.ckw-nav__primary { display: none; }
	.ckw-nav__actions { gap: 12px; }
	.ckw-nav-pill { padding: 16px 24px; }
	.ckw-nav-secondary__menu { gap: 16px 24px; font-size: 16px; }
	.ckw-nav-cta-row { justify-content: stretch; flex-direction: column; }
	.ckw-nav-cta-row .ckw-btn { width: 100%; justify-content: center; }

	/*
	 * Stały wiersz na telefonie: skrócone etykiety (WUTW / WIM) w jednym rzędzie.
	 * Pełne nazwy zawijały się do dwóch linijek i zabierały ~150px przyklejonego
	 * nagłówka, czyli piątą część ekranu. Pełna nazwa zostaje w `aria-label`.
	 */
	.ckw-nav-cta-row--stala { flex-direction: row; justify-content: center; }
	.ckw-nav-cta-row--stala .ckw-btn { width: auto; flex: 0 1 auto; }
	.ckw-nav-cta-row--stala .ckw-btn__pelna { display: none; }
	.ckw-nav-cta-row--stala .ckw-btn__skrot { display: inline; }
	:root { --ckw-cta-row-h: 60px; }
	.ckw-nav-search { padding: 10px 10px 10px 24px; }
	.ckw-footer { grid-template-columns: 1fr; gap: 40px; padding: 48px 24px; }
	.ckw-contact__row { grid-template-columns: 1fr; }
	.ckw-team { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	body { font-size: 16px; }
	.ckw-logo--red img { height: 48px; }
	.ckw-bip-link img { width: 36px; height: 36px; }
	.ckw-icon-btn { width: 28px; height: 28px; }
	.ckw-nav-secondary__menu { flex-direction: column; gap: 12px; }
	.ckw-footer__grid { grid-template-columns: 1fr; }
}

/* === MOBILE ≤640px — poziomy scroll + czytelność (2026-05-30) === */
@media (max-width: 640px) {
	/* Kalendarz / dzień: godziny mniejsze + odstęp od nazwy (były sklejone) */
	.ckw-cal-day__item  { grid-template-columns: auto 1fr; gap: 12px; }
	.ckw-cal-day__time  { font-size: 14px; }
	.ckw-cal-day__name  { font-size: 16px; }

	/* Karta listy (wydarzenia/wystawy): data + tytuł inline, tytuł się kurczy */
	.ckw-news-wide__row   { gap: 12px; }
	.ckw-news-wide__date  { width: 92px; height: auto; min-height: 64px; font-size: 22px; }
	.ckw-news-wide__title { font-size: 20px; min-width: 0; overflow-wrap: anywhere; }

	/* Karta aktualności (Polecamy): padding wewnętrzny o połowę + chipy mieszczą się */
	.ckw-card-news__head  { padding: 16px 16px 0; }
	.ckw-card-news__media { margin: 12px 16px 0; }
	.ckw-card-news__meta  { padding: 12px 16px; }

	/* Newsletter: na wąskim ekranie wspólny pill (input+przycisk) wygląda źle.
	   Rozbij na 2 osobne pille — input we własnym obrysie + przycisk pod nim. */
	.ckw-newsletter__form {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
		padding: 0;
		border: 0;
		background: transparent;
	}
	.ckw-newsletter__form input {
		width: 100%;
		border: 2px solid var(--ckw-black);
		border-radius: var(--ckw-radius-pill);
		padding: 14px 20px;
		background: var(--ckw-white);
	}
	.ckw-newsletter__submit { width: 100%; justify-content: center; }

	/* Single (post/event): meta data+chipy stack pionowo (sztywne 194px+200px nie mieściły się) */
	.ckw-single-post__meta       { flex-direction: column; align-items: stretch; gap: 12px; }
	.ckw-single-post__date       { width: 100%; }
	.ckw-single-post__meta-chips { width: 100%; }
	.ckw-single-post__meta-chip  { width: 100%; }
	.ckw-single-post__title      { overflow-wrap: anywhere; }
}

/* Reduce motion — kill non-essential animations.
   IMPORTANT: nie ruszamy `transition-duration` na *, bo to wybija
   discrete property changes (np. opacity 0→1 po dodaniu klasy). */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
	}
	html { scroll-behavior: auto; }
}

/* ---------- WUTW page ---------- */
.ckw-wutw__top-banner {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-top: calc(-1 * var(--ckw-hero-overlap, 200px));
	margin-bottom: 0;
	min-height: 602px;
	background: linear-gradient(to bottom, var(--ckw-dark-blue) 0%, #ffffff 55%, #f1f1f1 100%);
	padding-top: var(--ckw-hero-overlap, 200px);
	padding-bottom: 0;
}
.ckw-wutw__top-banner .ckw-title-line { margin-top: var(--ckw-space-32, 32px); margin-bottom: var(--ckw-space-32, 32px); }
.ckw-wutw {
	max-width: var(--ckw-container);
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 24px);
	font-family: var(--ckw-font-primary);
	color: var(--ckw-dark);
}
.ckw-wutw__hero {
	display: grid;
	grid-template-columns: 541fr 670fr;
	gap: clamp(32px, 5vw, 80px);
	align-items: center;
	padding: clamp(32px, 4vw, 64px) 0;
}
.ckw-wutw__logo {
	width: 100%;
	max-width: 541px;
	height: auto;
	display: block;
}
.ckw-wutw__intro {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-24);
	color: var(--ckw-dark-blue);
	font-size: var(--ckw-fs-18);
	line-height: 1.4;
}
.ckw-wutw__intro p { margin: 0; }

/* Duże zdjęcie z ludźmi — full-width sekcji */
.ckw-wutw__bigphoto {
	width: 100%;
	margin: clamp(32px, 5vw, 64px) 0;
	max-height: 600px;
	overflow: hidden;
	background: var(--ckw-gray);
}
.ckw-wutw__bigphoto img {
	width: 100%;
	height: auto;
	max-height: 600px;
	object-fit: cover;
	display: block;
}

.ckw-wutw__content {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(24px, 4vw, 50px);
	padding: clamp(32px, 4vw, 64px) 0;
}
.ckw-wutw__col {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-32);
}
.ckw-wutw__section h3 {
	color: var(--ckw-dark-blue);
	font-size: var(--ckw-fs-28);
	font-weight: 700;
	margin: 0 0 var(--ckw-space-16);
	line-height: 1.2;
}
.ckw-wutw__section p {
	margin: 0;
	font-size: var(--ckw-fs-18);
	line-height: 1.55;
	text-align: justify;
	white-space: pre-line;
}

.ckw-wutw__gallery {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: var(--ckw-space-16);
	align-items: center;
	padding: clamp(32px, 4vw, 48px) 0;
}
.ckw-wutw__gallery-arrow {
	width: 56px; height: 55px;
	background: transparent;
	border: 0;
	cursor: pointer;
	color: var(--ckw-dark);
	font-size: 32px;
	display: flex; align-items: center; justify-content: center;
	transition: color .15s var(--ckw-ease);
}
.ckw-wutw__gallery-arrow:hover { color: var(--ckw-red); }
.ckw-wutw__gallery-items {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--ckw-space-16);
}
.ckw-wutw__gallery-item {
	aspect-ratio: 1 / 1;
	background: var(--ckw-gray) center/cover no-repeat;
	display: block;
}

.ckw-wutw__events-title {
	margin: clamp(48px, 6vw, 80px) auto var(--ckw-space-32);
	max-width: var(--ckw-container);
	padding: 0 clamp(16px, 4vw, 24px);
}
.ckw-wutw__events-title h2 {
	display: inline-block;
	position: relative;
	margin: 0;
	padding-bottom: var(--ckw-space-12);
	font-size: var(--ckw-fs-28);
	font-weight: 700;
	color: var(--ckw-dark);
}
.ckw-wutw__events-title h2::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	left: calc(50% - 50vw - var(--ckw-space-16, 16px));
	height: 3px;
	background: var(--ckw-black);
}

@media (max-width: 900px) {
	.ckw-wutw__hero { grid-template-columns: 1fr; }
	.ckw-wutw__content { grid-template-columns: 1fr; }
	.ckw-wutw__gallery-items { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- Nasze odziały (filie) ---------- */
.ckw-branches-page {
	max-width: 100%;
	font-family: var(--ckw-font-primary);
}

/* Tabs z filiami */
.ckw-branches-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	justify-content: center;
	padding: 0 clamp(16px, 4vw, 100px);
	margin: clamp(32px, 4vw, 64px) auto 0;
	max-width: var(--ckw-container);
}
.ckw-branches-tab {
	display: inline-block;
	padding: 4px 8px;
	background: transparent;
	border: 0;
	color: var(--ckw-dark);
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	cursor: pointer;
	text-decoration: none;
	transition: color .15s var(--ckw-ease);
	position: relative;
}
.ckw-branches-tab:hover { color: var(--ckw-red); }
.ckw-branches-tab.is-active {
	color: var(--ckw-red);
	text-decoration: none;
}

/* Big aerial photo — full viewport width (breakout) */
.ckw-branches-aerial {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-top: clamp(16px, 3vw, 32px);
	margin-bottom: 8px;
	overflow: hidden;
	background: var(--ckw-gray);
}
.ckw-branches-aerial img {
	width: 100%;
	height: auto;
	max-height: 810px;
	object-fit: cover;
	display: block;
}
.ckw-branches-aerial__caption {
	max-width: var(--ckw-container);
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 24px);
	text-align: right;
	font-size: var(--ckw-fs-12);
	color: var(--ckw-dark);
	font-family: var(--ckw-font-primary);
	margin-bottom: clamp(32px, 4vw, 48px);
}

/* Info section: name+address (left) | description (right) */
.ckw-branches-info {
	max-width: var(--ckw-container);
	margin: 0 auto clamp(32px, 5vw, 64px);
	padding: 0 clamp(16px, 4vw, 24px);
	display: grid;
	grid-template-columns: 442fr 778fr;
	gap: clamp(24px, 4vw, 50px);
	align-items: start;
}
.ckw-branches-info__address {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-24);
	font-family: var(--ckw-font-primary);
}
/* Nadpis „Siedziba główna” — poprawka Aminy 17.08 (slajd 8). Celowo drobny i wyciszony:
   to etykieta porządkująca, nie drugi nagłówek konkurujący z nazwą placówki. */
.ckw-branches-info__label {
	font-family: var(--ckw-font-primary);
	font-weight: 600;
	font-size: var(--ckw-fs-14);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ckw-muted-2, #6b6b6b);
	margin: 0 0 4px;
}
.ckw-branches-info__name {
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-28);
	line-height: 1.15;
	color: var(--ckw-dark);
	margin: 0;
}
.ckw-branches-info__address p {
	margin: 0;
	font-size: var(--ckw-fs-18);
	line-height: 1.55;
	color: var(--ckw-dark);
}
.ckw-branches-info__address a {
	color: var(--ckw-dark);
	text-decoration: none; /* bez podkreślenia — hover zmienia tylko kolor (uwaga Weroniki) */
}
.ckw-branches-info__address a:hover { color: var(--ckw-red); }
.ckw-branches-info__body {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-32);
}
.ckw-branches-info__text {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	line-height: 1.55;
	text-align: justify;
	color: var(--ckw-dark);
	margin: 0;
}
.ckw-branches-info__cta-wrap {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 16px;
}
.ckw-branches-info__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 36px;
	background: var(--ckw-red);
	color: var(--ckw-white);
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	border-radius: var(--ckw-radius-pill);
	text-decoration: none;
	transition: background .15s var(--ckw-ease);
}
.ckw-branches-info__cta:hover { background: var(--ckw-dark-red); }

/* Carousel — mirror WUTW gallery */
@media (max-width: 900px) {
	.ckw-branches-info { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.ckw-branches-tabs {
		gap: 14px;
		padding: 0 var(--ckw-space-16);
		flex-wrap: nowrap;
		overflow-x: auto;
		justify-content: flex-start;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.ckw-branches-tabs::-webkit-scrollbar { display: none; }
	.ckw-branches-tab {
		font-size: var(--ckw-fs-14);
		padding: 3px 4px;
		flex-shrink: 0;
		white-space: nowrap;
	}
}

/* ---------- Haft page (O Hafcie) ---------- */
.ckw-haft {
	font-family: var(--ckw-font-primary);
	color: var(--ckw-dark);
}
.ckw-haft__logo {
	text-align: center;
	margin: clamp(24px, 4vw, 48px) auto;
	max-width: 313px;
}
.ckw-haft__logo img { width: 100%; height: auto; }

.ckw-haft__hero-title {
	text-align: center;
	font-family: var(--ckw-font-dec);
	font-size: clamp(40px, 6vw, 64px);
	font-weight: 400;
	color: var(--ckw-dark);
	margin: clamp(16px, 3vw, 32px) auto clamp(32px, 5vw, 64px);
	padding: 0 clamp(16px, 4vw, 24px);
	line-height: 1.1;
	max-width: 900px;
}

.ckw-haft__layout {
	max-width: var(--ckw-container);
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 24px);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(24px, 4vw, 64px);
	align-items: start;
}

/* Lewa kolumna: zdjęcia */
.ckw-haft__left {
	display: flex;
	flex-direction: column;
	gap: clamp(24px, 4vw, 48px);
	position: sticky;
	top: 200px;
}
.ckw-haft__pattern,
.ckw-haft__photo {
	width: 100%;
	display: block;
	background: var(--ckw-gray);
}
.ckw-haft__pattern {
	max-width: 430px;
	height: auto;
}
.ckw-haft__photo {
	aspect-ratio: 414 / 547;
	max-width: 414px;
}

/* Prawa kolumna: sekcje tekstowe */
.ckw-haft__sections {
	display: flex;
	flex-direction: column;
	gap: clamp(24px, 4vw, 40px);
}
.ckw-haft-section h3 {
	font-family: var(--ckw-font-dec);
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 400;
	color: var(--ckw-dark);
	margin: 0 0 var(--ckw-space-12);
	line-height: 1.1;
}
.ckw-haft-section p {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	line-height: 1.55;
	text-align: justify;
	color: var(--ckw-dark);
	margin: 0 0 var(--ckw-space-12);
	white-space: pre-line;
}

/* CTA "czytaj więcej" */
.ckw-haft__cta-wrap {
	max-width: var(--ckw-container);
	margin: clamp(24px, 4vw, 48px) auto 0;
	padding: 0 clamp(16px, 4vw, 24px);
	display: flex;
	justify-content: flex-end;
}
.ckw-haft__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 32px;
	background: var(--ckw-red);
	color: var(--ckw-white);
	font-family: var(--ckw-font-primary);
	font-weight: 700;
	font-size: var(--ckw-fs-18);
	border-radius: var(--ckw-radius-pill);
	text-decoration: none;
	transition: background .15s var(--ckw-ease);
}
.ckw-haft__cta:hover { background: var(--ckw-dark-red); }

/* Pełnoekranowe zdjęcie tradycji */
.ckw-haft__fullphoto {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-top: clamp(48px, 6vw, 96px);
	margin-bottom: clamp(48px, 6vw, 96px);
	max-height: 961px;
	overflow: hidden;
	background: var(--ckw-gray);
}
.ckw-haft__fullphoto img {
	width: 100%;
	height: auto;
	max-height: 961px;
	object-fit: cover;
	display: block;
}
.ckw-haft__fullphoto--parallax {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	height: 600px;
	max-height: 80vh;
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
@media (max-width: 900px) {
	.ckw-haft__fullphoto--parallax { background-attachment: scroll; height: 50vh; }
}

@media (max-width: 900px) {
	.ckw-haft__layout { grid-template-columns: 1fr; }
	.ckw-haft__left { position: static; }
}

/* ---------- Haft detal (czytaj więcej) ---------- */
.ckw-haft-detal {
	font-family: var(--ckw-font-primary);
	color: var(--ckw-dark);
	max-width: 1440px;
	margin: 0 auto;
	padding-bottom: clamp(48px, 6vw, 96px);
}
/* Pionowa linia 3px na osi — startuje od górnej krawędzi pierwszego zdjęcia */
.ckw-haft-detal__row { position: relative; }
.ckw-haft-detal__row::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 3px;
	background: var(--ckw-black);
	transform: translateX(-50%);
	pointer-events: none;
	z-index: 0;
}
.ckw-haft-detal__row:first-of-type::before {
	top: clamp(32px, 5vw, 64px); /* skip padding-top żeby linia startowała przy obrazku */
}
.ckw-haft-detal__row:last-of-type::before {
	bottom: clamp(32px, 5vw, 64px); /* końcówka też przy obrazku */
}
.ckw-haft-detal__text,
.ckw-haft-detal__figure { position: relative; z-index: 1; }
.ckw-haft-detal__logo {
	text-align: center;
	margin: clamp(24px, 4vw, 48px) auto;
	max-width: 313px;
}
.ckw-haft-detal__logo img { width: 100%; height: auto; }

.ckw-haft-detal__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(40px, 6vw, 90px);
	padding: clamp(32px, 5vw, 64px) clamp(16px, 8vw, 123px);
	align-items: start;
}

.ckw-haft-detal__text p {
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	line-height: 1.55;
	text-align: justify;
	color: var(--ckw-dark);
	margin: 0 0 var(--ckw-space-16);
	white-space: pre-line;
}
.ckw-haft-detal__text p:last-child { margin-bottom: 0; }

.ckw-haft-detal__figure {
	display: flex;
	flex-direction: column;
	gap: var(--ckw-space-12);
}
.ckw-haft-detal__figure img {
	width: 100%;
	height: auto;
	display: block;
	max-height: none;
	object-fit: contain;
}
.ckw-haft-detal__caption {
	margin: 0;
	font-family: var(--ckw-font-primary);
}
.ckw-haft-detal__caption-title {
	font-weight: 700;
	font-size: var(--ckw-fs-24);
	color: var(--ckw-dark);
	margin: 0;
	line-height: 1.2;
}
.ckw-haft-detal__caption-source {
	font-size: var(--ckw-fs-18);
	color: var(--ckw-dark);
	margin: 6px 0 0;
	line-height: 1.3;
}
/* Wyrównanie podpisu do strony obrazka (lewa kolumna = lewa, prawa = prawa) */
.ckw-haft-detal__row--text-left .ckw-haft-detal__figure { text-align: right; }
.ckw-haft-detal__row--text-left .ckw-haft-detal__caption { text-align: right; }
.ckw-haft-detal__row--text-right .ckw-haft-detal__figure { text-align: left; }
.ckw-haft-detal__row--text-right .ckw-haft-detal__caption { text-align: left; }

/* Końcowy tytuł dekoracyjny */
.ckw-haft-detal__bottom-title {
	text-align: center;
	font-family: var(--ckw-font-dec);
	font-weight: 400;
	font-size: clamp(48px, 8vw, 96px);
	color: var(--ckw-dark);
	margin: clamp(48px, 6vw, 96px) auto 0;
	padding: 0 clamp(16px, 4vw, 24px);
	line-height: 1.1;
}

@media (max-width: 900px) {
	.ckw-haft-detal__row { grid-template-columns: 1fr; }
	.ckw-haft-detal__row--text-left .ckw-haft-detal__figure,
	.ckw-haft-detal__row--text-right .ckw-haft-detal__figure { text-align: left; }
	.ckw-haft-detal__row::before { display: none; }
}

/* === TOR B ===
 * Style dla page templates dodanych w Torze B (plan-zajec, stacja-kolejka,
 * jubileusz-25-lat, bilety, zapisy-na-zajecia). Minimalne dodatki — większość
 * markupu korzysta z istniejących klas .ckw-haft / .ckw-wutw / .ckw-news-wide.
 */

/* Plan zajęć — intro */
.ckw-plan__intro {
	max-width: 920px;
	margin: 0 auto 32px;
	padding: 0 24px;
	font-size: var(--ckw-fs-18, 18px);
	line-height: 1.6;
	color: var(--ckw-dark, #1E2022);
}

.ckw-plan__cta {
	max-width: 920px;
	margin: 64px auto;
	padding: 32px 24px;
	text-align: center;
	background: var(--ckw-cream, #FFF7F0);
	border-radius: 12px;
}
.ckw-plan__cta h2 { margin-top: 0; }

/* Zapisy — formularz placeholder */
.ckw-zapisy-form-section {
	background-color: var(--ckw-cream, #FFF7F0);
	padding: 64px 24px;
}
.ckw-zapisy-form { display: block; }
.ckw-zapisy-form input[type="text"],
.ckw-zapisy-form input[type="tel"],
.ckw-zapisy-form input[type="email"],
.ckw-zapisy-form textarea {
	padding: 12px;
	border: 1px solid var(--ckw-gray, #D9D9D9);
	border-radius: 6px;
	font-family: inherit;
	font-size: 16px;
	width: 100%;
	box-sizing: border-box;
}
.ckw-zapisy-form label { font-size: 14px; }
.ckw-zapisy-form label > span { display: block; margin-bottom: 4px; }
.ckw-zapisy-form__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-top: 16px;
}

@media (max-width: 720px) {
	.ckw-zapisy-form__row { grid-template-columns: 1fr; }
}

/* === SEARCH RESULTS === */
.ckw-search-page { background: var(--ckw-cream, #FFF7F0); padding: clamp(32px, 5vw, 64px) 0; min-height: 60vh; }
.ckw-search-page__inner { max-width: var(--ckw-container, 1440px); margin: 0 auto; padding: 0 clamp(16px, 4vw, 24px); }
.ckw-search-page__header { margin-bottom: clamp(24px, 4vw, 48px); }
.ckw-search-page__title { font-family: var(--ckw-font-primary); font-weight: 700; font-size: clamp(28px, 5vw, 48px); margin: 0 0 16px; color: var(--ckw-dark); }
.ckw-search-page__query { color: var(--ckw-red); font-weight: 400; font-style: italic; }
.ckw-search-page__form { display: flex; gap: 8px; max-width: 600px; margin-top: 16px; }
.ckw-search-page__form input[type="search"] { flex: 1; padding: 12px 16px; border: 2px solid var(--ckw-dark); border-radius: var(--ckw-radius-pill, 999px); font-size: var(--ckw-fs-16); background: #fff; }
.ckw-search-page__form button { padding: 12px 28px; background: var(--ckw-red); color: #fff; border: 0; border-radius: var(--ckw-radius-pill, 999px); font-weight: 700; cursor: pointer; }
.ckw-search-page__form button:hover { background: var(--ckw-dark-red, #910A0C); }
.ckw-search-page__count { font-size: var(--ckw-fs-18); color: var(--ckw-dark); margin: 0 0 24px; }
.ckw-search-results { display: flex; flex-direction: column; gap: 16px; margin-bottom: 32px; }
.ckw-search-result { background: #fff; padding: 24px; border-radius: 12px; border-left: 4px solid var(--ckw-red); transition: transform .15s, box-shadow .15s; }
.ckw-search-result:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
.ckw-search-result__meta { display: flex; gap: 16px; align-items: center; margin-bottom: 8px; }
.ckw-search-result__type { display: inline-block; padding: 3px 12px; background: var(--ckw-light-blue, #B9D0E2); color: var(--ckw-dark); font-size: var(--ckw-fs-12); font-weight: 700; text-transform: uppercase; border-radius: var(--ckw-radius-pill, 999px); }
.ckw-search-result__date { font-size: var(--ckw-fs-14); color: var(--ckw-dark); opacity: 0.8; }
.ckw-search-result__title { font-family: var(--ckw-font-primary); font-weight: 700; font-size: var(--ckw-fs-24); margin: 0 0 12px; line-height: 1.3; }
.ckw-search-result__title a { color: var(--ckw-dark); text-decoration: none; }
.ckw-search-result__title a:hover { color: var(--ckw-red); }
.ckw-search-result__excerpt { font-size: var(--ckw-fs-16); line-height: 1.5; color: var(--ckw-dark); margin: 0 0 12px; }
.ckw-search-result__more { color: var(--ckw-red); font-weight: 700; text-decoration: none; font-size: var(--ckw-fs-14); }
.ckw-search-result__more:hover { text-decoration: underline; }
.ckw-search-page__empty { background: #fff; padding: clamp(32px, 5vw, 64px); border-radius: 12px; text-align: center; }
.ckw-search-page__empty-headline { font-size: var(--ckw-fs-20); font-weight: 700; margin: 0 0 16px; color: var(--ckw-dark); }
.ckw-search-page__empty-hint { font-size: var(--ckw-fs-16); margin: 0 0 24px; color: var(--ckw-dark); opacity: 0.8; }
.ckw-search-page__empty-links { list-style: none; padding: 0; margin: 0; display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.ckw-search-page__empty-links a { display: inline-block; padding: 8px 20px; background: var(--ckw-dark); color: #fff; text-decoration: none; border-radius: var(--ckw-radius-pill, 999px); font-weight: 700; font-size: var(--ckw-fs-14); }
.ckw-search-page__empty-links a:hover { background: var(--ckw-red); }
@media (max-width: 640px) {
	.ckw-search-page__form { flex-direction: column; }
	.ckw-search-page__form button { width: 100%; }
	.ckw-search-result__meta { flex-wrap: wrap; gap: 8px; }
}

/* ============================================================
   Cookie consent (RODO) — banner zgody
   ============================================================ */
.ckw-cookie {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 9999;
	background: var(--ckw-dark);
	color: #fff;
	box-shadow: 0 -6px 24px rgba(0,0,0,0.18);
	font-family: var(--ckw-font-sans);
}
.ckw-cookie[hidden] { display: none; }
.ckw-cookie__inner {
	max-width: var(--ckw-container, 1312px);
	margin: 0 auto;
	padding: 20px clamp(16px, 4vw, 48px);
	display: flex;
	align-items: center;
	gap: clamp(16px, 3vw, 40px);
	flex-wrap: wrap;
}
.ckw-cookie__text { flex: 1 1 360px; min-width: 280px; }
.ckw-cookie__title { font-size: var(--ckw-fs-18, 18px); font-weight: 700; margin: 0 0 6px; color: #fff; }
.ckw-cookie__body { font-size: var(--ckw-fs-14, 14px); line-height: 1.5; margin: 0; color: rgba(255,255,255,0.88); }
.ckw-cookie__body a { color: var(--ckw-light-blue); text-decoration: underline; }
.ckw-cookie__cats { margin-top: 14px; display: flex; flex-direction: column; gap: 10px; }
.ckw-cookie__cats[hidden] { display: none; }
.ckw-cookie__cat { display: flex; align-items: flex-start; gap: 10px; font-size: var(--ckw-fs-14, 14px); line-height: 1.4; color: rgba(255,255,255,0.9); cursor: pointer; }
.ckw-cookie__cat input { margin-top: 2px; width: 18px; height: 18px; accent-color: var(--ckw-red); flex: 0 0 auto; }
.ckw-cookie__cat strong { color: #fff; }
.ckw-cookie__actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.ckw-cookie__btn {
	font-family: var(--ckw-font-sans);
	font-size: var(--ckw-fs-14, 14px);
	font-weight: 700;
	padding: 11px 22px;
	border-radius: var(--ckw-radius-pill, 90px);
	border: 2px solid transparent;
	cursor: pointer;
	transition: background .2s var(--ckw-ease), color .2s var(--ckw-ease), border-color .2s var(--ckw-ease);
	white-space: nowrap;
}
.ckw-cookie__btn[hidden] { display: none; }
.ckw-cookie__btn--accept { background: var(--ckw-red); color: #fff; }
.ckw-cookie__btn--accept:hover { background: var(--ckw-dark-red); }
.ckw-cookie__btn--save { background: var(--ckw-light-blue); color: var(--ckw-dark); }
.ckw-cookie__btn--save:hover { background: #fff; }
.ckw-cookie__btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,0.5); }
.ckw-cookie__btn--ghost:hover { border-color: #fff; background: rgba(255,255,255,0.08); }

/* przycisk ponownego otwarcia ustawień */
.ckw-cookie-reopen {
	position: fixed;
	right: 16px; bottom: 16px;
	z-index: 9998;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	background: var(--ckw-dark);
	color: #fff;
	border: none;
	border-radius: var(--ckw-radius-pill, 90px);
	font-family: var(--ckw-font-sans);
	font-size: var(--ckw-fs-14, 14px);
	font-weight: 700;
	cursor: pointer;
	box-shadow: var(--ckw-shadow-md);
	opacity: 0.85;
	transition: opacity .2s var(--ckw-ease);
}
.ckw-cookie-reopen[hidden] { display: none; }
.ckw-cookie-reopen:hover { opacity: 1; }

@media (max-width: 640px) {
	.ckw-cookie__inner { flex-direction: column; align-items: stretch; gap: 14px; }
	.ckw-cookie__actions { justify-content: stretch; }
	.ckw-cookie__btn { flex: 1 1 auto; text-align: center; }
	.ckw-cookie-reopen span { display: none; }
	.ckw-cookie-reopen { padding: 10px; }
}

/* ---------- Plany zajęć (Figma node 46:652 — 1:1) ---------- */
/* Tło #e9e9e9, pigułki #b9d0e2 (chipy i przyciski), okładki 226×320, Instrument Sans. */
/* Płaskie szare tło na CAŁEJ stronie (też za headerem) — bez kremowego pasma u góry. */
body.page-template-page-plan-zajec { background-color: #e9e9e9; }
.ckw-plany-page { padding-bottom: 80px; }
.ckw-plany {
	max-width: 1138px;
	margin: 0 auto;
	padding-inline: clamp(16px, 4vw, 24px);
}

.ckw-plany__chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 24px clamp(24px, 6vw, 72px);
	margin: 32px 0 56px;
}
.ckw-plany__chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	/* `min(260px, 100%)` — na desktopie wymiar z designu, na wąskim ekranie chip
	   przestaje rozpychać kontener (ta reguła nie była resetowana w żadnym media query). */
	min-width: min(260px, 100%);
	min-height: 57px;
	padding: 0 28px;
	border-radius: 28.5px;
	background: #b9d0e2;
	color: #1e2022;
	font-family: var(--ckw-font-primary);
	font-size: 18px;
	font-weight: 400;
	line-height: 25px;
	text-align: center;
	text-decoration: none;
	transition: filter .15s;
}
.ckw-plany__chip:hover { filter: brightness(0.94); color: #1e2022; }

.ckw-plany__grid {
	display: grid;
	grid-template-columns: repeat(3, 226px);
	justify-content: center;
	column-gap: clamp(40px, 9vw, 115px);
	row-gap: 72px;
}
.ckw-plany__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 226px;
}
.ckw-plany__card-title {
	margin: 0 0 16px;
	font-family: var(--ckw-font-primary);
	font-weight: 600;
	font-size: 28px;
	line-height: 40px;
	color: #1e2022;
	text-align: center;
}
.ckw-plany__cover {
	display: block;
	width: 226px;
	height: 320px;
	margin-bottom: 27px;
	overflow: hidden;
}
.ckw-plany__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }

.ckw-plany__btn {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 226px;
	height: 57px;
	padding: 0 28px;
	margin-bottom: 17px;
	border-radius: 28.5px;
	background: #b9d0e2;
	color: #1e2022;
	font-family: var(--ckw-font-primary);
	font-size: 18px;
	font-weight: 400;
	line-height: 25px;
	text-decoration: none;
	transition: filter .15s;
}
.ckw-plany__btn:last-child { margin-bottom: 0; }
.ckw-plany__btn:hover { filter: brightness(0.94); color: #1e2022; }
.ckw-plany__btn-icon { width: 22px; height: 22px; flex-shrink: 0; }

@media (max-width: 820px) {
	.ckw-plany__grid { grid-template-columns: repeat(2, 226px); column-gap: clamp(24px, 6vw, 80px); }
}
@media (max-width: 540px) {
	.ckw-plany__grid { grid-template-columns: 226px; }
}

/* ==========================================================================
   Lightbox galerii (filie) — powiększenie zdjęć
   ========================================================================== */

body.ckw-lightbox-open {
	overflow: hidden; /* tło nie scrolluje się pod overlayem */
}

.ckw-lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: clamp(8px, 2vw, 24px);
	padding: clamp(16px, 4vw, 48px);
	background: rgba(30, 32, 34, .92); /* --ckw-dark z przezroczystością */
}

.ckw-lightbox[hidden] {
	display: none;
}

.ckw-lightbox__figure {
	grid-column: 2;
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ckw-space-16);
	min-width: 0;
}

.ckw-lightbox__img {
	max-width: 100%;
	max-height: 80vh;
	object-fit: contain;
	background: var(--ckw-dark);
}

.ckw-lightbox__caption {
	margin: 0;
	color: var(--ckw-white);
	font-size: 15px;
	line-height: 1.5;
	text-align: center;
	max-width: 60ch;
}

.ckw-lightbox__caption[hidden] {
	display: none;
}

.ckw-lightbox__nav,
.ckw-lightbox__close {
	width: 56px;
	height: 56px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .12);
	color: var(--ckw-white);
	font-size: 32px;
	line-height: 1;
	cursor: pointer;
	transition: background .2s ease, color .2s ease;
}

.ckw-lightbox__nav:hover,
.ckw-lightbox__nav:focus-visible,
.ckw-lightbox__close:hover,
.ckw-lightbox__close:focus-visible {
	background: var(--ckw-red); /* hover czerwony — spójnie z resztą serwisu */
	color: var(--ckw-white);
}

.ckw-lightbox__nav[hidden],
.ckw-lightbox__counter[hidden] {
	display: none;
}

.ckw-lightbox__nav--prev { grid-column: 1; }
.ckw-lightbox__nav--next { grid-column: 3; }

.ckw-lightbox__close {
	position: absolute;
	top: clamp(12px, 3vw, 32px);
	right: clamp(12px, 3vw, 32px);
	width: 48px;
	height: 48px;
	font-size: 28px;
}

.ckw-lightbox__counter {
	position: absolute;
	left: 50%;
	bottom: clamp(12px, 3vw, 32px);
	transform: translateX(-50%);
	margin: 0;
	color: var(--ckw-white);
	font-size: 15px;
	letter-spacing: .04em;
}

.ckw-wutw__gallery-item[data-ckw-lightbox-item] {
	cursor: zoom-in;
}

/* Stronicowanie: `display:block` na .ckw-wutw__gallery-item bije domyślne
   [hidden]{display:none} przeglądarki — bez tego ukryte kafelki i tak się
   renderują i siatka łamie je na kolejny wiersz. */
.ckw-wutw__gallery-item[hidden] {
	display: none;
}

.ckw-wutw__gallery-arrow:disabled {
	opacity: .35;
	cursor: default;
}

@media (max-width: 640px) {
	.ckw-lightbox {
		grid-template-columns: 1fr; /* na telefonie nawigujemy swipem */
		padding: 16px;
	}
	.ckw-lightbox__figure { grid-column: 1; }
	.ckw-lightbox__nav { display: none; }
}

/* ==========================================================================
   Zajęcia stałe — pasek filtrów.
   Wariant osobny, bo bazowy `.ckw-news-page__filters` ma sztywne dwie kolumny —
   dobre dla trzech filtrów wydarzeń, ale przy pięciu kontrolkach plus dwoma
   przyciskami układ się rozjeżdżał (wąskie pole „wiek" obok pigułki na pół szerokości,
   „wyczyść" spychane do osobnego rzędu).
   ========================================================================== */

.ckw-news-page__filters--zajecia {
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	align-items: center;
	margin-top: var(--ckw-space-24, 24px);
}

/* Pole „wiek" to liczba dwucyfrowa — nie potrzebuje szerokości selecta. */
.ckw-news-page__filters--zajecia input[type="number"] {
	width: 100%;
	border: 2px solid var(--ckw-dark);
	background: transparent;
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-18);
	padding: 6px 18px;
	height: 40px;
	color: var(--ckw-dark);
}

.ckw-news-page__filters--zajecia .ckw-zaj-actions {
	display: flex;
	gap: 12px;
	align-items: center;
}

.ckw-news-page__filters--zajecia .ckw-zaj-btn {
	height: 40px;
	padding: 0 24px;
	border: 2px solid var(--ckw-dark);
	border-radius: var(--ckw-radius-pill);
	background: var(--ckw-light-blue);
	font-family: var(--ckw-font-primary);
	font-size: var(--ckw-fs-16, 16px);
	color: var(--ckw-dark);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	white-space: nowrap;
}

.ckw-news-page__filters--zajecia .ckw-zaj-btn:hover {
	background: var(--ckw-dark);
	color: #FFF7F0;
	text-decoration: none;
}

.ckw-news-page__filters--zajecia .ckw-zaj-btn--ghost {
	background: transparent;
}

/* ==========================================================================
   Zajęcia stałe — karta zwarta (bez zdjęcia).
   Zajęć jest ponad 600 i żadne nie ma własnej fotografii, więc karta ze zdjęciem
   pokazywała przy każdej ten sam placeholder. Ta wersja niesie same fakty:
   co, kiedy, gdzie, dla kogo, za ile. Rodzina wizualna bez zmian — kremowe tło,
   obrys 2 px, chip w kolorze --ckw-light-blue.
   ========================================================================== */

.ckw-card-zaj {
	background: #FFF7F0;
	border: 2px solid var(--ckw-dark);
	padding: var(--ckw-space-24, 24px);
	display: flex;
	flex-direction: column;
	gap: 12px;
	text-decoration: none;
	color: inherit;
	font-family: var(--ckw-font-primary);
	transition: transform .2s var(--ckw-ease), box-shadow .2s var(--ckw-ease);
}

.ckw-card-zaj:hover {
	transform: translateY(-2px);
	box-shadow: var(--ckw-shadow-md);
	text-decoration: none;
}

/* Miniatura filii. Wysokość celowo niska — to ma być rozpoznawalny kadr miejsca,
   a nie okładka: karta musi zostać zwarta, bo pozycji jest ponad 600.
   Ujemne marginesy wyprowadzają zdjęcie poza padding karty, na całą jej szerokość. */
.ckw-card-zaj__media {
	margin: calc(var(--ckw-space-24, 24px) * -1) calc(var(--ckw-space-24, 24px) * -1) 4px;
	aspect-ratio: 3 / 4;
	background-size: cover;
	background-position: center;
	background-color: var(--ckw-light-gray);
	border-bottom: 2px solid var(--ckw-dark);
}

.ckw-card-zaj__top {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	min-height: 28px;
}

.ckw-card-zaj__tag {
	background: var(--ckw-light-blue);
	border-radius: var(--ckw-radius-pill);
	padding: 4px 14px;
	font-size: var(--ckw-fs-14);
	line-height: 20px;
	color: var(--ckw-dark);
}

.ckw-card-zaj__tag--new {
	background: var(--ckw-olive-green);
}

.ckw-card-zaj__title {
	margin: 0;
	font-size: var(--ckw-fs-20, 20px);
	line-height: 1.3;
	font-weight: 600;
	color: var(--ckw-dark);
}

.ckw-card-zaj__meta {
	margin: 0;
	display: grid;
	grid-template-columns: 72px 1fr;
	gap: 6px 12px;
	font-size: var(--ckw-fs-15, 15px);
}

/* `dl` z wierszami w gridzie: każdy wiersz to osobny kontener, żeby etykieta
   i wartość trzymały się razem także przy zawijaniu. */
.ckw-card-zaj__row {
	display: contents;
}

.ckw-card-zaj__row dt {
	color: var(--ckw-muted-2);
	font-size: var(--ckw-fs-14);
}

.ckw-card-zaj__row dd {
	margin: 0;
	color: var(--ckw-dark);
}

.ckw-card-zaj__price {
	margin: auto 0 0;
	padding-top: 12px;
	border-top: 1px solid var(--ckw-light-gray);
	font-weight: 600;
	color: var(--ckw-dark);
}

/* ==========================================================================
   Zajęcia stałe — tabela faktów na podstronie zajęć.
   Dodane celowo i wąsko: reszta widoku (filtry, karty, siatka) korzysta
   z komponentów aktualności i wydarzeń, więc nie wymaga własnych reguł.
   ========================================================================== */

.ckw-zajecia-facts {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 24px;
	font-size: 16px;
}

.ckw-zajecia-facts th,
.ckw-zajecia-facts td {
	padding: 12px 0;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--ckw-light-gray);
}

.ckw-zajecia-facts th {
	width: 168px;
	font-weight: 600;
	color: var(--ckw-ink);
}

.ckw-zajecia-facts td {
	color: var(--ckw-ink);
}

.ckw-zajecia-disclaimer {
	font-size: 14px;
	color: var(--ckw-muted-2);
	margin: 0 0 24px;
}

/* Na wąskim ekranie etykieta i wartość idą jedna pod drugą — przy 375 px
   kolumna 168 px zostawiałaby wartościom zbyt mało miejsca i łamała je co słowo. */
@media (max-width: 560px) {
	.ckw-zajecia-facts,
	.ckw-zajecia-facts tbody,
	.ckw-zajecia-facts tr,
	.ckw-zajecia-facts th,
	.ckw-zajecia-facts td {
		display: block;
		width: auto;
	}

	.ckw-zajecia-facts tr {
		border-bottom: 1px solid var(--ckw-light-gray);
		padding: 8px 0;
	}

	.ckw-zajecia-facts th,
	.ckw-zajecia-facts td {
		border-bottom: 0;
		padding: 2px 0;
	}

	.ckw-zajecia-facts th {
		font-size: 14px;
		color: var(--ckw-muted-2);
	}
}