/*
Theme Name: UTW Ciechanów
Description: Motyw blokowy dla strony Uniwersytetu Trzeciego Wieku. Kolory pochodzą ze zdjęcia głównego i logo: granat odznaki, drewno belek, czerwień drzwi, bursztynowe światło.
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: utw
License: GPL-2.0-or-later
*/

:root {
	--utw-header-h: 4.75rem;
	--utw-gutter: clamp(1.25rem, 4vw, 3rem);
	--utw-sheet-overlap: 2rem;
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}

/* Widoczny fokus z klawiatury: granat na jasnym tle, bursztyn na ciemnym */
:where(a, button, summary, input, textarea, select):focus-visible {
	outline: 3px solid var(--wp--preset--color--granat);
	outline-offset: 3px;
}
.utw-header :focus-visible,
.utw-hero :focus-visible,
.utw-footer :focus-visible {
	outline-color: var(--wp--preset--color--bursztyn);
}

/* Odstępy między dużymi blokami ustalamy sami */
.wp-site-blocks > * { margin-block: 0; }

/* ---------- Nagłówek ---------- */

/* Bez paska na żadnej stronie: nagłówek ma zerową wysokość i jest przyklejony do góry (sticky, nie fixed,
   bo na iPhonie fixed potrafi się przesuwać przy zwijaniu paska Safari). Logo leży na banerze i znika po
   przewinięciu, a przycisk Menu zostaje w rogu ekranu, więc zawsze jest pod ręką */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	height: 0;
	z-index: 40;
}
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 46px; }
}
@media (max-width: 600px) {
	/* na wąskim ekranie pasek administratora przewija się razem ze stroną, więc nagłówek nie zostawia pod nim luki */
	.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 0; }
}

.utw-header {
	box-sizing: border-box;
	padding: 1.25rem var(--utw-gutter);
	background: transparent;
	color: #fff;
}

.utw-brand {
	gap: 0.1rem;
	transition: opacity 0.25s, visibility 0.25s;
}
/* po przewinięciu logo chowa się, żeby nie zasłaniać treści (klasę ustawia nav.js) */
.utw-scrolled .utw-brand { opacity: 0; visibility: hidden; pointer-events: none; }
@media (prefers-reduced-motion: reduce) {
	.utw-brand { transition: none; }
}
.utw-brand .wp-block-site-title {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.625rem;
	font-weight: 700;
	line-height: 1.1;
}
.utw-brand .wp-block-site-title a {
	color: #fff;
	text-decoration: none;
	text-shadow: 0 1px 16px rgba(9, 13, 32, 0.6);
}
.utw-brand .wp-block-site-tagline {
	margin: 0;
	font-size: 1rem;
	line-height: 1.2;
	color: var(--wp--preset--color--bursztyn);
	text-shadow: 0 1px 12px rgba(9, 13, 32, 0.6);
}
/* na stronie głównej logo jest w zdjęciu, więc nazwa w nagłówku jest zbędna */
/* Logo w nagłówku: plakietka z przezroczystym tłem, z cieniem, żeby była czytelna na zdjęciu */
.utw-logo { display: block; line-height: 0; }
.utw-logo img {
	display: block;
	width: auto;
	height: 4.25rem;
	filter: drop-shadow(0 2px 10px rgba(9, 13, 32, 0.5));
}
@media (min-width: 56rem) {
	.utw-logo img { height: 6.5rem; }
}
.home .utw-brand { display: none; }
@media (max-width: 24rem) {
	/* wąskie telefony (360 px i mniej): nazwa nie może dotykać przycisku Menu */
	.utw-brand .wp-block-site-title { font-size: 1.375rem; }
	.utw-nav .wp-block-navigation__responsive-container-open { padding: 0 0.85rem; }
}
@media (max-width: 21rem) {
	/* bardzo wąskie ekrany (320 px): przycisk to sama ikona, żeby nazwa miała miejsce */
	.utw-brand .wp-block-site-title { font-size: 1.25rem; }
	.utw-brand .wp-block-site-tagline { font-size: 0.9375rem; }
	.utw-header .utw-nav .wp-block-navigation__responsive-container-open::after { content: none; }
	.utw-header .utw-nav .wp-block-navigation__responsive-container-open { padding: 0 0.8rem; }
}

/* ---------- Menu wysuwane z prawej ---------- */

/* Przycisk Menu: kolor ciemnego drewna i bursztynowa ramka, jak na zdjęciu głównym */
/* Blok nawigacji WordPressa jest domyślnie position: relative. Zdejmujemy to, żeby przycisk liczył położenie
   od przyklejonego nagłówka (czyli od krawędzi ekranu), a nie od siebie */
.utw-header .utw-nav.wp-block-navigation { position: static; }
.utw-nav .wp-block-navigation__responsive-container-open {
	position: absolute;
	top: 1rem;
	right: var(--utw-gutter);
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	gap: 0.6rem;
	min-height: 3.25rem;
	padding: 0 1rem;
	border: 1.5px solid rgba(231, 166, 74, 0.8);
	border-radius: 999px;
	background: rgba(19, 26, 54, 0.88);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	color: #fff7ea;
	font-size: 1.125rem;
	font-weight: 700;
	box-shadow: 0 6px 20px rgba(9, 13, 32, 0.3);
	transition: background 0.2s, color 0.2s;
	cursor: pointer;
}
.utw-nav .wp-block-navigation__responsive-container-open::after { content: "Menu"; }
.utw-nav .wp-block-navigation__responsive-container-open svg { width: 1.75rem; height: 1.75rem; }
.utw-nav .wp-block-navigation__responsive-container-open:hover {
	border-color: var(--wp--preset--color--bursztyn);
	background: var(--wp--preset--color--bursztyn);
	color: var(--wp--preset--color--dab);
}

.utw-nav .wp-block-navigation__responsive-container.is-menu-open {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: auto;
	box-sizing: border-box;
	width: min(92vw, 26rem);
	padding: 0;
	overflow-y: auto;
	/* przyciemnienie reszty strony */
	box-shadow: 0 0 0 100vmax rgba(8, 11, 28, 0.55);
	/* szkło: granatowe, lekko przezroczyste, z rozmytym zdjęciem pod spodem (kolor z ustawień bloku trzeba nadpisać) */
	background-color: rgba(27, 37, 80, 0.9) !important;
	-webkit-backdrop-filter: blur(18px) saturate(1.25);
	backdrop-filter: blur(18px) saturate(1.25);
	border-left: 1px solid rgba(255, 255, 255, 0.22);
	animation: utw-drawer 0.34s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
@keyframes utw-drawer {
	from { transform: translateX(100%); box-shadow: 0 0 0 100vmax rgba(8, 11, 28, 0); }
	to   { transform: none;             box-shadow: 0 0 0 100vmax rgba(8, 11, 28, 0.55); }
}
@media (prefers-reduced-motion: reduce) {
	.utw-nav .wp-block-navigation__responsive-container.is-menu-open { animation: none; }
}

.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	box-sizing: border-box;
	width: 100%;
	padding: 6rem 1.75rem 2rem;
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	width: 100%;
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	display: block;
	border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: block;
	padding: 1rem 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.625rem;
	font-weight: 600;
	line-height: 1.25;
	color: #fff;
	text-decoration: none;
	transition: color 0.15s, padding-left 0.15s;
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
	padding-left: 0.35rem;
	color: var(--wp--preset--color--bursztyn);
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .utw-nav-cta {
	margin-top: 1.75rem;
	border-bottom: 0;
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .utw-nav-cta .wp-block-navigation-item__content {
	padding: 1rem 1.25rem;
	border-radius: 999px;
	background: var(--wp--preset--color--czerwien);
	font-family: var(--wp--preset--font-family--tekst);
	font-size: 1.25rem;
	font-weight: 700;
	text-align: center;
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .utw-nav-cta .wp-block-navigation-item__content:hover {
	padding-left: 1.25rem;
	background: #8e1f25;
	color: #fff;
}

.utw-nav .wp-block-navigation__responsive-container-close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	gap: 0.5rem;
	min-height: 3.25rem;
	padding: 0 1rem;
	border: 2px solid rgba(255, 255, 255, 0.7);
	border-radius: 999px;
	background: transparent;
	color: #fff;
	font-size: 1.125rem;
	font-weight: 700;
	cursor: pointer;
}
.utw-nav .wp-block-navigation__responsive-container-close::after { content: "Zamknij"; }
.utw-nav .wp-block-navigation__responsive-container-close svg { width: 1.5rem; height: 1.5rem; }

/* ---------- Strona główna: zdjęcie i nasuwana karta ---------- */

.utw-home > * { margin-block: 0; }

/* Zdjęcie zostaje przyklejone pod nagłówkiem, a jasna karta z treścią nasuwa się na nie przy przewijaniu */
.utw-hero {
	position: sticky;
	top: 0;
	z-index: 0;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	box-sizing: border-box;
	/* na wąskim telefonie zdjęcie jest niższe (140vw), żeby w kadrze zmieściła się cała grupa, a nie jedna osoba */
	/* + nakładka karty: dzięki temu jasna karta zaczyna się dopiero pod dolną krawędzią ekranu */
	height: calc(min(100svh, 150vw) + var(--utw-sheet-overlap));
	min-height: 26rem;
	overflow: hidden;
	isolation: isolate;
	background: var(--wp--preset--color--dab);
}

.utw-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	/* lewy górny róg (plakietka UTW) ma być zawsze w kadrze, na telefonie też */
	background: url("assets/images/hero.webp") 0% 0% / cover no-repeat;
}
.utw-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(9, 13, 32, 0) 38%, rgba(9, 13, 32, 0.5) 68%, rgba(9, 13, 32, 0.86) 100%);
}

/* Nagłówek h1 zostaje dla czytników ekranu i wyszukiwarek, ale nie jest widoczny */
.utw-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Hasło po lewej, przyciski po prawej (w jednej linii z przyciskiem Menu); na telefonie jedno pod drugim */
.utw-hero__actions {
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.25rem 2rem;
	width: 100%;
	padding: 0 var(--utw-gutter) calc(var(--utw-sheet-overlap) + 2.25rem) max(var(--utw-gutter), 1.5rem);
}
@media (min-width: 56rem) {
	/* więcej powietrza od dolnej i lewej krawędzi; prawa strona zostaje w linii z przyciskiem Menu */
	.utw-hero__actions {
		padding-bottom: calc(var(--utw-sheet-overlap) + 4.5rem);
		padding-left: clamp(2rem, 6vw, 6rem);
	}
}
.utw-hero__title {
	flex: 1 1 18rem;
	margin: 0;
	font-size: clamp(2.125rem, 9.2vw, 3.25rem);
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -0.02em;
	color: #fff;
	text-shadow: 0 2px 28px rgba(9, 13, 32, 0.6);
	text-wrap: balance;
}
@media (min-width: 56rem) {
	.utw-hero__title { font-size: clamp(3rem, 5.4vw, 5.25rem); }
}
.utw-hero .wp-block-buttons {
	flex: 0 0 auto;
	justify-content: flex-end;
	gap: 0.75rem;
	margin: 0;
}
.utw-hero .wp-block-button__link {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 3.5rem;
	padding-inline: 1.5rem;
	font-size: 1.1875rem;
	box-shadow: 0 8px 24px rgba(9, 13, 32, 0.35);
}
/* Poza telefonem przyciski mają tekst współmierny do dużego hasła */
@media (min-width: 40rem) {
	.utw-hero .wp-block-button__link {
		min-height: 4rem;
		padding-inline: 2rem;
		font-size: 1.4375rem;
	}
}
@media (min-width: 56rem) {
	.utw-hero .wp-block-button__link { font-size: 1.5rem; }
}
.utw-hero .utw-button-light .wp-block-button__link {
	background: #fff;
	color: var(--wp--preset--color--dab);
}
.utw-hero .utw-button-light .wp-block-button__link:hover {
	background: var(--wp--preset--color--bursztyn);
	color: var(--wp--preset--color--dab);
}
@media (max-width: 30rem) {
	.utw-hero .wp-block-button { flex: 1 1 auto; }
	.utw-hero .wp-block-button__link { padding-inline: 1rem; }
}
@media (max-width: 23rem) {
	/* bardzo wąski telefon: przyciski jeden pod drugim, na całą szerokość */
	.utw-hero .wp-block-buttons { flex: 1 1 100%; }
	.utw-hero .wp-block-button { flex: 1 1 100%; }
}

/* Jedna zaplanowana animacja przy wejściu: zdjęcie się osadza, potem pojawiają się przyciski */
@media (prefers-reduced-motion: no-preference) {
	.utw-hero::before { animation: utw-hero-in 2.4s cubic-bezier(0.16, 0.84, 0.3, 1) both; }
	.utw-hero__actions { animation: utw-rise 0.8s 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
	@keyframes utw-hero-in { from { scale: 1.12; } }
	@keyframes utw-rise { from { opacity: 0; translate: 0 1rem; } }
}
/* Zdjęcie ciemnieje, gdy karta na nie wjeżdża (tam, gdzie przeglądarka to potrafi) */
@supports (animation-timeline: scroll()) {
	@media (prefers-reduced-motion: no-preference) {
		.utw-hero {
			animation: utw-hero-cover linear both;
			animation-timeline: scroll(root block);
			animation-range: 0 100vh;
		}
		@keyframes utw-hero-cover { to { filter: brightness(0.45); } }
	}
}

main > .utw-sheet,
.utw-home .wp-block-post-content > .utw-sheet {
	position: relative;
	z-index: 1;
	margin-block-start: calc(-1 * var(--utw-sheet-overlap));
	border-radius: var(--utw-sheet-overlap) var(--utw-sheet-overlap) 0 0;
	background: var(--wp--preset--color--len);
}
.utw-sheet > * { margin-block: 0; }
.utw-page > * { margin-block: 0; }
.utw-home .wp-block-post-content > * { margin-block: 0; }

/* Treść stron z edytora: pełne sekcje na całą szerokość, zwykłe bloki w kolumnie przy lewej krawędzi */
.utw-sheet:not(.utw-prose, .utw-evpage) > .wp-block-post-content > .alignfull { margin-block: 0; }
.utw-sheet:not(.utw-prose, .utw-evpage) > .wp-block-post-content > :where(:not(.alignfull)) {
	box-sizing: border-box;
	max-width: 44rem;
	margin-inline: max(var(--utw-gutter), calc((100% - 74rem) / 2)) var(--utw-gutter);
}
.utw-sheet:not(.utw-prose, .utw-evpage) > .wp-block-post-content > :where(:not(.alignfull)):first-child { margin-top: clamp(2.5rem, 6vw, 4.5rem); }
.utw-sheet:not(.utw-prose, .utw-evpage) > .wp-block-post-content > :where(:not(.alignfull)):last-child { margin-bottom: clamp(3rem, 7vw, 5.5rem); }
.utw-banner__lead p { margin: 0; }

/* Zdanie otwierające */
.utw-intro .wp-block-columns { gap: 1.5rem 4rem; margin: 0; }
.utw-statement {
	margin: 0;
	font-size: clamp(2rem, 4.4vw, 3.75rem);
	font-weight: 400;
	line-height: 1.08;
	letter-spacing: -0.015em;
	text-wrap: balance;
}
.utw-intro__aside p { margin: 0 0 1rem; color: #4b5373; }
.utw-more a {
	font-weight: 700;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.25em;
}

/* Najnowsze wpisy: pierwszy duży, dwa obok */
.utw-news { padding-top: 0; }
.utw-news__head { margin-bottom: 2rem; gap: 0.5rem 2rem; }
.utw-news__head h2 { margin: 0; font-size: var(--wp--preset--font-size--x-large); }
.utw-news__head p { margin: 0; }
.utw-news .utw-news__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2.5rem 2rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.utw-news .utw-news__grid > li { margin: 0; }
.utw-story .wp-block-post-featured-image {
	aspect-ratio: 3 / 2;
	margin: 0 0 0.5rem;
	overflow: hidden;
	border-radius: 1.125rem;
}
.utw-story .wp-block-post-featured-image a { display: block; height: 100%; }
.utw-story .wp-block-post-featured-image img { height: 100%; transition: scale 0.5s cubic-bezier(0.2, 0.7, 0.2, 1); }
.utw-story:hover .wp-block-post-featured-image img { scale: 1.04; }
.utw-story .wp-block-post-title { font-weight: 500; }
@media (prefers-reduced-motion: reduce) {
	.utw-story .wp-block-post-featured-image img { transition: none; }
}
@media (min-width: 56rem) {
	.utw-news .utw-news__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.utw-news .utw-news__grid > li:first-child { grid-column: span 2; grid-row: span 2; }
	.utw-news__grid > li:first-child .utw-story { height: 100%; }
	.utw-news__grid > li:first-child .wp-block-post-featured-image { flex: 1; aspect-ratio: auto; min-height: 18rem; }
	.utw-news__grid > li:first-child .wp-block-post-title { font-size: clamp(1.75rem, 2.6vw, 2.5rem); line-height: 1.15; }
}

/* Na skróty: duże odnośniki dla osób, które nie zaglądają do menu */
.utw-index-band { background: var(--wp--preset--color--granat); color: #fff; }
.utw-index-band h2 { margin: 0 0 1.5rem; color: #fff; font-size: var(--wp--preset--font-size--x-large); }
.utw-index { margin: 0; }
.utw-index__row {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0.25rem 2rem;
	align-items: baseline;
	margin: 0;
	padding: 1.25rem 0;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	transition: padding-left 0.2s;
}
.utw-index__row:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
.utw-index__name {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.75rem, 3.4vw, 3rem);
	font-weight: 400;
	line-height: 1.1;
}
.utw-index__name a { color: #fff; text-decoration: none; transition: color 0.15s; }
/* cały wiersz jest odnośnikiem */
.utw-index__name a::after { content: ""; position: absolute; inset: 0; }
.utw-index__name a:focus-visible { outline: none; }
.utw-index__row:focus-within { outline: 3px solid var(--wp--preset--color--bursztyn); outline-offset: 2px; }
.utw-index__desc { margin: 0; font-size: 1.125rem; color: rgba(255, 255, 255, 0.8); }
.utw-index__row:hover { padding-left: 0.75rem; }
.utw-index__row:hover .utw-index__name a { color: var(--wp--preset--color--bursztyn); }
.utw-index-band :focus-visible { outline-color: var(--wp--preset--color--bursztyn); }
@media (min-width: 48rem) {
	.utw-index__row { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
}

/* ---------- Sekcje i karty wpisów ---------- */

.utw-main { padding-inline: var(--utw-gutter); }

.utw-section {
	box-sizing: border-box;
	/* boczne marginesy ustawiają kolumnę 74rem, więc treść zawsze ma tę samą lewą krawędź co baner */
	padding: clamp(3rem, 7vw, 5.5rem) max(var(--utw-gutter), calc((100% - 74rem) / 2));
}
:where(.utw-section) p { max-width: 44rem; }
.utw-section__title { margin: 0 0 0.5rem; }
.utw-section__lead { margin: 0 0 2rem; max-width: 36rem; color: #4b5373; }

.utw-cards { gap: 2rem 1.75rem; }
.utw-card { display: flex; flex-direction: column; gap: 0.6rem; }
.utw-card .wp-block-post-featured-image { margin: 0 0 0.4rem; }
.utw-card .wp-block-post-featured-image img { display: block; width: 100%; object-fit: cover; }
.utw-card .wp-block-post-terms {
	font-size: 1rem;
	font-weight: 700;
	color: var(--wp--preset--color--czerwien);
}
.utw-card .wp-block-post-terms a { color: inherit; text-decoration: none; }
.utw-card .wp-block-post-title { margin: 0; font-size: 1.5rem; line-height: 1.25; }
.utw-card .wp-block-post-title a { color: var(--wp--preset--color--dab); text-decoration: none; }
.utw-card .wp-block-post-title a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.utw-card .wp-block-post-date { font-size: 1rem; color: #4b5373; }
.utw-card .utw-card__label { margin: 0; font-size: 1rem; font-weight: 700; color: var(--wp--preset--color--czerwien); }
.utw-card .utw-card__date { margin: 0; font-size: 1rem; color: #4b5373; }

/* ---------- Podstrony: baner ze zdjęciem i ta sama jasna karta co na stronie głównej ---------- */

.utw-banner {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	box-sizing: border-box;
	min-height: clamp(22rem, 56svh, 36rem);
	padding: 7rem 0 calc(var(--utw-sheet-overlap) + 2.25rem);
	overflow: hidden;
	background: var(--wp--preset--color--dab);
	color: #fff;
}
.utw-banner::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	background: url("assets/images/banner.webp") var(--utw-banner-x, 50%) var(--utw-banner-y, 35%) / cover no-repeat;
}
.utw-banner::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(9, 13, 32, 0.72) 0%, rgba(9, 13, 32, 0.2) 32%, rgba(9, 13, 32, 0.5) 62%, rgba(9, 13, 32, 0.9) 100%);
}
.utw-banner { --utw-banner-x: 60%; --utw-banner-y: 40%; }
/* Banery używają zdjęcia bez plakietki (banner.webp), a każda podstrona pokazuje inny jego fragment */
.utw-slug-o-nas .utw-banner { --utw-banner-x: 20%; --utw-banner-y: 70%; }
.utw-slug-zajecia .utw-banner { --utw-banner-x: 100%; --utw-banner-y: 60%; }
.utw-slug-kontakt .utw-banner { --utw-banner-x: 40%; --utw-banner-y: 85%; }
.utw-slug-dzialalnosc-sekcji-teatralnej .utw-banner { --utw-banner-x: 0%; --utw-banner-y: 55%; }
.utw-banner--news { --utw-banner-x: 60%; --utw-banner-y: 40%; }

.utw-banner__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: calc(74rem + 2 * var(--utw-gutter));
	margin-inline: auto;
	padding-inline: var(--utw-gutter);
}
.utw-banner__title {
	max-width: 14em;
	margin: 0;
	font-size: clamp(2.5rem, 7vw, 5rem);
	font-weight: 500;
	line-height: 1.04;
	letter-spacing: -0.02em;
	color: #fff;
	text-shadow: 0 2px 28px rgba(9, 13, 32, 0.6);
	text-wrap: balance;
}
.utw-banner__lead {
	max-width: 34rem;
	margin: 1rem 0 0;
	font-size: 1.375rem;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.94);
	text-shadow: 0 1px 18px rgba(9, 13, 32, 0.6);
}
.utw-banner__meta { margin: 0 0 0.75rem; font-weight: 700; color: var(--wp--preset--color--bursztyn); }
.utw-banner__meta a { color: inherit; text-decoration: none; }
.utw-banner .wp-block-post-date { margin: 1rem 0 0; color: rgba(255, 255, 255, 0.9); }

/* Skoki do części strony: przyciski z edytora */
.utw-jump { gap: 0.75rem; margin: 0 0 clamp(2.5rem, 5vw, 4rem); }
.utw-jump .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	min-height: 3.25rem;
	padding: 0 1.4rem;
	border: 2px solid var(--wp--preset--color--granat);
	border-radius: 999px;
	background: transparent;
	color: var(--wp--preset--color--granat);
	font-size: 1.125rem;
	font-weight: 700;
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
}
.utw-jump .wp-block-button__link:hover { background: var(--wp--preset--color--granat); color: #fff; }

/* Nagłówek części: tytuł i krótki wstęp obok */
.utw-section__head { margin: 0 0 1.5rem; }
.utw-section__head h2 { margin: 0; scroll-margin-top: 2rem; }
.utw-section__head p { margin: 0.5rem 0 0; max-width: 36rem; color: #4b5373; }
.utw-section + .utw-section { padding-top: 0; }

/* Liczby */
.utw-facts { display: flex; flex-wrap: wrap; gap: 1.5rem 4rem; margin: 0; }
.utw-intro .utw-facts { margin-top: 3rem; }
.utw-fact { margin: 0; }
.utw-fact__num {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(3.5rem, 8vw, 6rem);
	font-weight: 600;
	line-height: 1;
	color: var(--wp--preset--color--granat);
}
.utw-fact__label { display: block; max-width: 14rem; margin-top: 0.5rem; color: #4b5373; }

/* Oś czasu: to jest prawdziwa kolejność wydarzeń, więc numeracja latami ma sens */
.utw-timeline { margin: 0; }
.utw-timeline > .utw-tl-item {
	position: relative;
	margin: 0;
	padding: 0 0 2.75rem 1.5rem;
	border-left: 2px solid rgba(27, 37, 80, 0.2);
}
.utw-timeline > .utw-tl-item:last-child { padding-bottom: 0; border-left-color: transparent; }
.utw-timeline > .utw-tl-item::before {
	content: "";
	position: absolute;
	top: 0.5rem;
	left: -0.55rem;
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	background: var(--wp--preset--color--bursztyn);
	box-shadow: 0 0 0 3px var(--wp--preset--color--len);
}
.utw-timeline__year {
	margin: 0 0 0.5rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: 2rem;
	font-weight: 600;
	line-height: 1.1;
	color: var(--wp--preset--color--granat);
}
.utw-timeline__year--text { font-size: 1.5rem; line-height: 1.15; }
.utw-timeline__body > * { margin: 0 0 0.9rem; max-width: 44rem; }
.utw-timeline__body > :last-child { margin-bottom: 0; }
.utw-timeline__body > .utw-timeline__small { font-size: 1.0625rem; color: #4b5373; }
@media (min-width: 48rem) {
	.utw-timeline > .utw-tl-item {
		display: grid;
		grid-template-columns: 9rem minmax(0, 1fr);
		column-gap: 3rem;
		padding-left: 0;
		border-left: 0;
	}
	.utw-timeline > .utw-tl-item::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: calc(9rem + 1.5rem - 1px);
		width: 2px;
		background: rgba(27, 37, 80, 0.2);
	}
	.utw-timeline > .utw-tl-item:last-child::after { display: none; }
	.utw-timeline > .utw-tl-item::before { top: 0.55rem; left: calc(9rem + 1.5rem - 0.5rem); z-index: 1; }
	.utw-timeline__year { margin: 0; text-align: right; font-size: 2.5rem; }
	.utw-timeline__year.utw-timeline__year--text { font-size: 1.5rem; padding-top: 0.35rem; }
}

/* Wiersze: nazwa po lewej, opis po prawej */
.utw-rows { margin: 0; }
.utw-row {
	display: grid;
	gap: 0.5rem 3rem;
	margin: 0;
	padding: 1.75rem 0;
	border-top: 1px solid rgba(19, 26, 54, 0.18);
}
.utw-row:last-child { border-bottom: 1px solid rgba(19, 26, 54, 0.18); }
.utw-row__name {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.625rem, 3vw, 2.25rem);
	font-weight: 600;
	line-height: 1.15;
}
.utw-row__text > * { margin: 0 0 0.6rem; }
.utw-row__text > :last-child { margin-bottom: 0; }
.utw-row__text > .utw-row__meta { margin-bottom: 0.4rem; font-weight: 700; color: var(--wp--preset--color--czerwien); }
@media (min-width: 48rem) {
	.utw-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); }
}

/* Rozwijane zajęcia: blok „Szczegóły” z edytora, działa z klawiatury i czytnikiem ekranu */
.utw-acc { margin: 0; }
.utw-acc .wp-block-details { margin: 0; border-top: 1px solid rgba(19, 26, 54, 0.18); }
.utw-acc .wp-block-details:last-child { border-bottom: 1px solid rgba(19, 26, 54, 0.18); }
.utw-acc .wp-block-details > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 3.5rem;
	padding: 1.4rem 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.5rem, 2.8vw, 2rem);
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	list-style: none;
}
.utw-acc .wp-block-details > summary::-webkit-details-marker { display: none; }
.utw-acc .wp-block-details > summary::after {
	content: "";
	flex: none;
	width: 2.75rem;
	height: 2.75rem;
	border: 2px solid var(--wp--preset--color--granat);
	border-radius: 50%;
	background:
		linear-gradient(var(--wp--preset--color--granat), var(--wp--preset--color--granat)) center / 1rem 2px no-repeat,
		linear-gradient(var(--wp--preset--color--granat), var(--wp--preset--color--granat)) center / 2px 1rem no-repeat;
	transition: background-color 0.15s;
}
.utw-acc .wp-block-details > summary:hover::after { background-color: rgba(231, 166, 74, 0.35); }
.utw-acc .wp-block-details[open] > summary::after {
	background:
		linear-gradient(var(--wp--preset--color--granat), var(--wp--preset--color--granat)) center / 1rem 2px no-repeat;
}
.utw-acc .wp-block-details > :not(summary) { max-width: 44rem; margin: 0 0 0.8rem; }
.utw-acc .wp-block-details > :last-child { margin-bottom: 1.75rem; }
.utw-acc .wp-block-details ul { padding-left: 1.4rem; }
.utw-acc .wp-block-details li { margin-bottom: 0.3rem; }

/* Zakończenie podstrony: granatowy pas z zaproszeniem */
.utw-cta { background: var(--wp--preset--color--granat); color: #fff; }
.utw-section.utw-cta,
.utw-section.utw-index-band { padding-block: clamp(3rem, 7vw, 5.5rem); }
.utw-cta h2 { margin: 0 0 1rem; color: #fff; font-size: clamp(2rem, 4.4vw, 3.5rem); font-weight: 400; }
.utw-cta p { max-width: 36rem; margin: 0 0 1.75rem; font-size: 1.375rem; color: rgba(255, 255, 255, 0.88); }
.utw-cta :focus-visible { outline-color: var(--wp--preset--color--bursztyn); }
.utw-cta .wp-block-button__link { min-height: 3.5rem; display: inline-flex; align-items: center; font-size: 1.1875rem; }

/* Zwykła treść strony lub wpisu */
.utw-prose {
	box-sizing: border-box;
	/* ta sama lewa krawędź co tytuł w banerze i sekcje (szerokość 74rem) */
	padding: clamp(2.5rem, 6vw, 4.5rem) max(var(--utw-gutter), calc((100% - 74rem) / 2)) clamp(3rem, 7vw, 5.5rem);
}
.utw-prose .wp-block-post-content { max-width: 44rem; }
.utw-prose .wp-block-post-featured-image { margin: 0 0 2.5rem; overflow: hidden; border-radius: 1.125rem; }
.utw-prose .wp-block-post-featured-image img { display: block; width: 100%; height: auto; }
.utw-prose .wp-block-post-content > * + * { margin-block-start: 1.25rem; }
.utw-prose .wp-block-post-content h2 { margin-block-start: 2.5rem; }
.utw-back { margin: 2.5rem 0 0; font-weight: 700; }

/* Siatka wpisów (relacje, ogłoszenia, wszystkie wpisy) */
.utw-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2.5rem 2rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.utw-grid > li { margin: 0; }
@media (min-width: 40rem) { .utw-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .utw-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.utw-pagination { margin-top: 3rem; font-weight: 700; }

/* ---------- Wydarzenia (wtyczka utw-wydarzenia) ---------- */

.utw-events { margin: 0; }
.utw-ev-filter { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0 0 clamp(2rem, 4vw, 3rem); }
.utw-ev-filter button,
.utw-ev__more {
	appearance: none;
	display: inline-flex;
	align-items: center;
	min-height: 3.25rem;
	padding: 0 1.4rem;
	border: 2px solid var(--wp--preset--color--granat);
	border-radius: 999px;
	background: transparent;
	color: var(--wp--preset--color--granat);
	font: inherit;
	font-size: 1.125rem;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
}
.utw-ev-filter button:hover,
.utw-ev__more:hover,
.utw-ev-filter button.is-active { background: var(--wp--preset--color--granat); color: #fff; }

.utw-ev-sec + .utw-ev-sec { margin-top: clamp(3rem, 6vw, 5rem); }
.utw-ev-sec > h2 { margin: 0 0 1.75rem; }
.utw-ev-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2.5rem 2rem;
	margin: 0;
}
@media (min-width: 40rem) { .utw-ev-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .utw-ev-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.utw-ev { position: relative; margin: 0; }
.utw-ev[hidden], .utw-ev__none[hidden], .utw-ev__more[hidden] { display: none; }
.utw-ev__media {
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	border-radius: 1.125rem;
	background: var(--wp--preset--color--dab);
}
.utw-ev__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: scale 0.5s cubic-bezier(0.2, 0.7, 0.2, 1); }
.utw-ev__media img.is-portrait { object-position: 50% 10%; }
.utw-ev:hover .utw-ev__media img { scale: 1.04; }
/* wydarzenie bez zdjęcia: kadr ze zdjęcia głównego */
.utw-ev__ph {
	display: block;
	width: 100%;
	height: 100%;
	/* wydarzenie bez zdjęcia: budynek z zdjęcia głównego, przyciemniony granatem */
	background: linear-gradient(0deg, rgba(27, 37, 80, 0.45), rgba(27, 37, 80, 0.45)), url("assets/images/banner.webp") 50% 50% / cover no-repeat;
}
.utw-ev__date {
	position: absolute;
	left: 1rem;
	bottom: 1rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 3.75rem;
	padding: 0.45rem 0.65rem 0.5rem;
	border-radius: 0.6rem;
	background: var(--wp--preset--color--granat);
	color: #fff;
	line-height: 1;
}
.utw-ev__date b { font-family: var(--wp--preset--font-family--display); font-size: 1.75rem; font-weight: 600; }
.utw-ev__date span { margin-top: 0.15rem; font-size: 1rem; font-weight: 700; }
/* nadchodzące wyróżnia bursztynowa plakietka */
.utw-ev.is-upcoming .utw-ev__date { background: var(--wp--preset--color--bursztyn); color: var(--wp--preset--color--dab); }
.utw-ev__body { padding-top: 0.9rem; }
.utw-ev__type { margin: 0 0 0.3rem; font-weight: 700; color: var(--wp--preset--color--czerwien); }
.utw-ev__title { margin: 0; font-size: 1.5rem; font-weight: 500; line-height: 1.25; }
.utw-ev__title a { color: var(--wp--preset--color--dab); text-decoration: none; }
/* cała karta jest odnośnikiem */
.utw-ev__title a::after { content: ""; position: absolute; inset: 0; }
.utw-ev__title a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.utw-ev__meta { margin: 0.4rem 0 0; color: #4b5373; }
.utw-ev__none { margin: 0; color: #4b5373; }
.utw-ev__morewrap { margin: 2.5rem 0 0; }
@media (prefers-reduced-motion: reduce) { .utw-ev__media img { transition: none; } }

/* Strona wydarzenia */
.utw-evpage {
	box-sizing: border-box;
	padding: clamp(2.5rem, 6vw, 4rem) max(var(--utw-gutter), calc((100% - 74rem) / 2)) clamp(3rem, 7vw, 5.5rem);
}
.utw-evpage > * { margin-block: 0; }
.utw-evpage .wp-block-post-content > * { margin-block: 0 1.25rem; }
.utw-evpage .wp-block-post-content > :where(p, ul, ol, h2, h3, blockquote) { max-width: 44rem; }
.utw-evpage .wp-block-post-content h2 { margin-block: 2.5rem 1rem; }
.utw-evpage .wp-block-post-content h3 { margin-block: 2rem 0.75rem; }
.utw-evpage .wp-block-post-content blockquote {
	margin-inline: 0;
	padding: 0 0 0 1.25rem;
	border-left: 3px solid var(--wp--preset--color--bursztyn);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.375rem;
	line-height: 1.4;
}
.utw-evpage .wp-block-post-content blockquote p { margin: 0; }
.utw-ev-info { display: grid; gap: 1rem 3rem; margin: 0 0 2.5rem; padding: 1.25rem 0; border-block: 1px solid rgba(19, 26, 54, 0.18); }
.utw-ev-info > div { display: grid; gap: 0.15rem; }
.utw-ev-info dt { font-weight: 700; color: var(--wp--preset--color--czerwien); }
.utw-ev-info dd { margin: 0; font-size: 1.25rem; }
@media (min-width: 48rem) { .utw-ev-info { grid-template-columns: repeat(auto-fit, minmax(14rem, max-content)); } }
.utw-evphoto { margin: 0 0 2.5rem; }
.utw-evphoto img { display: block; border-radius: 1.125rem; }
.utw-evphoto.is-landscape img { width: 100%; max-height: 38rem; object-fit: cover; }
.utw-evphoto.is-portrait img { width: auto; max-width: min(100%, 26rem); height: auto; }
.utw-evpage .wp-block-gallery { gap: 1rem; margin-top: 1rem; }
.utw-evpage .wp-block-gallery img { border-radius: 0.75rem; }

@media (max-width: 40rem) {
	/* wąski ekran: pokazujemy prawą część zdjęcia z napisem budynku */
	.utw-banner,
	.utw-slug-o-nas .utw-banner,
	.utw-slug-zajecia .utw-banner,
	.utw-slug-kontakt .utw-banner,
	.utw-slug-dzialalnosc-sekcji-teatralnej .utw-banner,
	.utw-banner--news { --utw-banner-x: 80%; }
}

/* Duże pola dotyku: odnośniki w tekście i w stopce mają co najmniej 44 px wysokości */
.utw-footer a,
.utw-more a,
.utw-back a,
.utw-sheet p > a:only-child {
	display: inline-block;
	padding-block: 0.6rem;
}
.utw-footer p { margin-block: 0; }

/* Twórczość sekcji teatralnej (wtyczka utw-tworczosc) */
.utw-tw-empty { margin: 0 0 2rem; color: #4b5373; }
.utw-tw-excerpt { margin: 0; }

/* Strona Aktualności */
.utw-news-empty { margin: 0 0 2rem; color: #4b5373; }
.utw-news-more { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; margin-top: clamp(2.5rem, 5vw, 4rem); }
.utw-news-more p { margin: 0 0.5rem 0 0; font-weight: 700; }
.utw-news-more a {
	display: inline-flex;
	align-items: center;
	min-height: 3.25rem;
	padding: 0 1.4rem;
	border: 2px solid var(--wp--preset--color--granat);
	border-radius: 999px;
	color: var(--wp--preset--color--granat);
	font-weight: 700;
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
}
.utw-news-more a:hover { background: var(--wp--preset--color--granat); color: #fff; }

/* Powiązanie wydarzenia z relacją */
.utw-rel { margin: 2.5rem 0 0; padding: 1.25rem 1.5rem; border-left: 4px solid var(--wp--preset--color--bursztyn); background: #fff; border-radius: 0 0.75rem 0.75rem 0; max-width: 44rem; }
.utw-rel p { margin: 0; }
.utw-rel__label { font-weight: 700; color: var(--wp--preset--color--czerwien); }
.utw-rel__link { margin-top: 0.25rem; font-family: var(--wp--preset--font-family--display); font-size: 1.375rem; }
.utw-rel__link a { color: var(--wp--preset--color--dab); }
.utw-rel__date { margin-top: 0.25rem; color: #4b5373; }

/* ---------- Ogłoszenia (wtyczka utw-ogloszenia) ---------- */

.utw-og-sec + .utw-og-sec { margin-top: clamp(3rem, 6vw, 5rem); }
.utw-og-sec > h2 { margin: 0 0 1.75rem; }
.utw-og-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
@media (min-width: 56rem) { .utw-og-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.utw-og {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid rgba(19, 26, 54, 0.18);
	border-radius: 1.125rem;
	background: #fff;
}
.utw-og.is-pinned { border: 2px solid var(--wp--preset--color--bursztyn); }
.utw-og.is-past { background: transparent; }
.utw-og__media { aspect-ratio: 16 / 9; overflow: hidden; background: var(--wp--preset--color--dab); }
.utw-og__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.utw-og__body { padding: 1.25rem 1.5rem 1.5rem; }
.utw-og__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.6rem; margin: 0 0 0.5rem; color: #4b5373; }
.utw-og__pin {
	padding: 0.1rem 0.7rem;
	border-radius: 999px;
	background: var(--wp--preset--color--bursztyn);
	color: var(--wp--preset--color--dab);
	font-weight: 700;
}
.utw-og__title { margin: 0; font-size: 1.5rem; font-weight: 500; line-height: 1.25; }
.utw-og__title a { color: var(--wp--preset--color--dab); text-decoration: none; }
/* cała karta jest odnośnikiem */
.utw-og__title a::after { content: ""; position: absolute; inset: 0; }
.utw-og__title a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.utw-og__excerpt { margin: 0.75rem 0 0; }
.utw-og__none { margin: 0; color: #4b5373; }

/* ---------- Harmonogram zajęć (wtyczka utw-harmonogram) ---------- */

.utw-schedule { margin: 0; }
.utw-schedule__tools { display: flex; justify-content: flex-end; margin: 0 0 1.5rem; }
.utw-schedule__print {
	appearance: none;
	display: inline-flex;
	align-items: center;
	min-height: 3.25rem;
	padding: 0 1.4rem;
	border: 2px solid var(--wp--preset--color--granat);
	border-radius: 999px;
	background: transparent;
	color: var(--wp--preset--color--granat);
	font: inherit;
	font-size: 1.125rem;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
}
.utw-schedule__print:hover { background: var(--wp--preset--color--granat); color: #fff; }
.utw-schedule__empty { margin: 0 0 1rem; color: #4b5373; }

/* Dzień: nazwa po lewej, godziny i zajęcia po prawej */
.utw-day {
	display: grid;
	gap: 0.75rem 3rem;
	padding: 1.75rem 0 2.25rem;
	border-top: 2px solid var(--wp--preset--color--granat);
}
.utw-day:last-child { border-bottom: 1px solid rgba(27, 37, 80, 0.2); }
.utw-day__name {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	font-weight: 600;
	line-height: 1.1;
	color: var(--wp--preset--color--granat);
}
.utw-day.is-today .utw-day__name::after {
	content: "dziś";
	margin-left: 0.75rem;
	padding: 0.2rem 0.7rem;
	border-radius: 999px;
	background: var(--wp--preset--color--czerwien);
	color: #fff;
	font-family: var(--wp--preset--font-family--tekst);
	font-size: 1rem;
	font-weight: 700;
	vertical-align: middle;
}
.utw-day__slots { margin: 0; padding: 0; list-style: none; }
.utw-slot {
	display: grid;
	gap: 0.15rem 2rem;
	margin: 0;
	padding: 1rem 0;
	border-top: 1px solid rgba(19, 26, 54, 0.14);
}
.utw-slot:first-child { padding-top: 0; border-top: 0; }
.utw-slot > * { margin: 0; }
.utw-slot__time {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.5rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	color: var(--wp--preset--color--dab);
}
.utw-slot__title { margin: 0; font-size: 1.375rem; font-weight: 700; line-height: 1.3; }
.utw-slot__place,
.utw-slot__note { margin: 0.15rem 0 0; color: #4b5373; }
.utw-slot__note { font-style: italic; }
@media (min-width: 48rem) {
	.utw-day { grid-template-columns: 15rem minmax(0, 1fr); }
	.utw-slot { grid-template-columns: 9.5rem minmax(0, 1fr); }
	.utw-slot__time { padding-top: 0.1rem; }
}

/* Wydruk harmonogramu: sama tabela, czarno na białym */
@media print {
	.wp-site-blocks > header.wp-block-template-part,
	.utw-footer,
	.utw-schedule__tools,
	.utw-cta { display: none !important; }
	body { background: #fff; color: #000; }
	.utw-banner { min-height: 0; padding: 0 0 1rem; overflow: visible; background: none; color: #000; }
	.utw-banner::before, .utw-banner::after { display: none; }
	.utw-banner__title, .utw-banner__lead { color: #000; text-shadow: none; }
	.utw-banner__title { font-size: 2rem; }
	main > .utw-sheet { margin: 0; border-radius: 0; background: #fff; }
	.utw-section { padding: 0 0 1rem; }
	.utw-day { break-inside: avoid; padding: 0.75rem 0 1rem; border-top-color: #000; }
	.utw-day__name, .utw-slot__time, .utw-slot__place, .utw-slot__note { color: #000; }
}

/* ---------- Stopka ---------- */

.utw-footer {
	box-sizing: border-box;
	padding: 3rem var(--utw-gutter);
	background: var(--wp--preset--color--dab);
	color: #d5d9ea;
}
.utw-footer a { color: var(--wp--preset--color--bursztyn); }
.utw-footer .wp-block-site-title { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: 1.5rem; font-weight: 700; }
.utw-footer .wp-block-site-title a { color: #fff; text-decoration: none; }
.utw-footer p { margin: 0; }

/* ---------- Nowoczesny wygląd ---------- */
/* Warstwa na końcu pliku: zmienia kształty i szczegóły, nie układ stron. Kolory i kroje pism są w theme.json. */

:root {
	--utw-radius: 1.5rem;
	--utw-sheet-overlap: 2.5rem;
}

h1, h2, h3, .wp-block-heading { text-wrap: balance; }

/* Większe, spokojniejsze zaokrąglenia zdjęć i kart */
.utw-story .wp-block-post-featured-image,
.utw-ev__media,
.utw-prose .wp-block-post-featured-image,
.utw-evphoto img { border-radius: var(--utw-radius); }
.utw-og { border-radius: var(--utw-radius); border-color: rgba(19, 26, 54, 0.1); box-shadow: 0 1px 0 rgba(19, 26, 54, 0.04), 0 12px 32px -18px rgba(19, 26, 54, 0.35); }
.utw-og.is-pinned { border-color: var(--wp--preset--color--bursztyn); }
.utw-evpage .wp-block-gallery img { border-radius: 1rem; }
.utw-rel { border-radius: 0 1rem 1rem 0; }

/* Filtry wydarzeń jako przełącznik: jedno jasne pole, aktywna opcja wypełniona granatem */
.utw-ev-filter {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 0.25rem;
	padding: 0.35rem;
	border-radius: 1.75rem;
	background: rgba(19, 26, 54, 0.07);
}
.utw-ev-filter button {
	min-height: 2.9rem;
	padding: 0 1.25rem;
	border: 0;
	font-weight: 650;
}
.utw-ev-filter button:hover:not(.is-active) { background: rgba(19, 26, 54, 0.09); color: var(--wp--preset--color--granat); }
.utw-ev-filter button.is-active { box-shadow: 0 6px 16px -6px rgba(27, 37, 80, 0.6); }
.utw-ev__more { border-radius: 999px; font-weight: 650; }

/* Plakietka z datą: szkło na zdjęciu, nadchodzące zostają bursztynowe */
.utw-ev__date {
	border-radius: 1rem;
	background: rgba(255, 255, 255, 0.86);
	color: var(--wp--preset--color--dab);
	-webkit-backdrop-filter: blur(10px) saturate(1.4);
	backdrop-filter: blur(10px) saturate(1.4);
	box-shadow: 0 8px 22px -8px rgba(9, 13, 32, 0.55);
}
.utw-ev__date b { font-weight: 700; letter-spacing: -0.03em; }
.utw-ev__date span { font-weight: 650; }
.utw-ev__type,
.utw-card .utw-card__label,
.utw-og__pin { letter-spacing: 0; }

/* Pasek „Na skróty”: wcięty, z dużym zaokrągleniem zamiast pełnej szerokości */
.utw-section.utw-index-band {
	margin: 0 clamp(0.75rem, 2vw, 1.5rem) clamp(0.75rem, 2vw, 1.5rem);
	border-radius: calc(var(--utw-radius) + 0.5rem);
	background: linear-gradient(155deg, #1d2a5e 0%, var(--wp--preset--color--granat) 55%, #141c44 100%);
}

/* Wiersze list (zajęcia, kontakt, zarząd): jaśniejsze linie, mocniejsze nazwy */
.utw-row__name,
.utw-day__name,
.utw-acc .wp-block-details > summary { letter-spacing: -0.02em; }
.utw-acc .wp-block-details > summary::after { border-width: 2px; }

/* Przyciski i odnośniki */
.wp-block-button__link { letter-spacing: -0.005em; }
.utw-hero .wp-block-button__link { box-shadow: 0 14px 30px -12px rgba(9, 13, 32, 0.7); }
.utw-news-more a,
.utw-jump .wp-block-button__link { font-weight: 650; }
a { text-underline-offset: 0.18em; text-decoration-thickness: 1.5px; }

/* Duże hasła: zwarte, ciężkie, z ciasnym światłem między literami */
.utw-hero__title,
.utw-banner__title { letter-spacing: -0.028em; font-weight: 650; line-height: 1.02; }
.utw-statement { letter-spacing: -0.03em; font-weight: 600; }
.utw-fact__num { font-weight: 700; letter-spacing: -0.04em; }

/* Stopka */
.utw-footer { background: linear-gradient(180deg, #0f1530 0%, var(--wp--preset--color--dab) 100%); }

/* Wąski ekran: filtry zawijają się, więc każdy przycisk ma własne tło zamiast wspólnego pola */
@media (max-width: 40rem) {
	.utw-ev-filter { display: flex; gap: 0.5rem; padding: 0; border-radius: 0; background: none; }
	.utw-ev-filter button { background: rgba(19, 26, 54, 0.08); border-radius: 999px; }
	.utw-ev-filter button.is-active { background: var(--wp--preset--color--granat); }
}

/* Autor strony w stopce */
.utw-footer .utw-footer__credit {
	margin: 2.5rem 0 0;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	font-size: 1rem;
	color: rgba(213, 217, 234, 0.75);
}

/* Menu wysuwane: wszystkie pozycje mają się mieścić na telefonie razem z paskami Safari (iPhone, ok. 740 px widocznej wysokości) */
.utw-nav .wp-block-navigation__responsive-container.is-menu-open {
	height: 100dvh;
	overscroll-behavior: contain;
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 4.75rem 1.5rem calc(1.25rem + env(safe-area-inset-bottom));
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	padding: 0.7rem 0;
	font-size: 1.375rem;
	line-height: 1.2;
}
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .utw-nav-cta { margin-top: 1.1rem; }
.utw-nav .wp-block-navigation__responsive-container.is-menu-open .utw-nav-cta .wp-block-navigation-item__content { padding: 0.9rem 1.25rem; }
@media (max-height: 40rem) {
	.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 4.25rem; }
	.utw-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: 0.55rem 0; font-size: 1.25rem; }
	.utw-nav .wp-block-navigation__responsive-container.is-menu-open .utw-nav-cta { margin-top: 0.9rem; }
}

/* Regulamin w rozwijanych rozdziałach (strona Zarząd) */
.utw-acc .utw-reg__par {
	margin-top: 1.75rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.25rem;
	font-weight: 650;
	color: var(--wp--preset--color--granat);
}
.utw-acc .utw-reg__par:first-child { margin-top: 0; }
.utw-acc .utw-reg__sub { padding-left: 1.5rem; }