/*
Theme Name:   Astra Child – Olga
Description:  Motyw potomny Astry dla strony aktorskiej (jasny styl)
Template:     astra
Version:      2.3.1
Text Domain:  astra-child-olga
*/

/* ==========================================================================
   STRONA AKTORSKA – jasny motyw
   ========================================================================== */

/* 1. TOKENY – kolory i czcionki zmieniasz tylko tutaj ------------------------ */
:root {
	--oa-bg:            #ffffff;   /* tło strony */
	--oa-surface:       #f5f3ef;   /* karty, pola */
	--oa-line:          rgba(20, 18, 16, .14);
	--oa-text:          #16130f;   /* tekst główny */
	--oa-muted:         #6d675e;   /* tekst pomocniczy */
	--oa-accent:        #8a6a2f;   /* ciepłe złoto – nadtytuły, detale */
	--oa-on-accent:     #ffffff;   /* tekst na wypełnionym przycisku */

	--oa-font-head: "Cormorant Garamond", "Times New Roman", Georgia, serif;
	--oa-font-body: "Jost", system-ui, -apple-system, "Segoe UI", sans-serif;

	--oa-ease: cubic-bezier(.77, 0, .18, 1);
}

/* 2. BAZA ------------------------------------------------------------------- */
html { background: var(--oa-bg); }
body {
	background: var(--oa-bg);
	color: var(--oa-text);
	font-family: var(--oa-font-body);
	font-size: 1.0625rem;
	font-weight: 400;
	line-height: 1.75;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
::selection { background: var(--oa-text); color: #fff; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--oa-font-head);
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: .01em;
	color: var(--oa-text);
}
h1 { font-size: clamp(2.6rem, 7vw, 5rem); font-weight: 500; }
h2 { font-size: clamp(2rem, 4.5vw, 3.25rem); }
h3 { font-size: clamp(1.4rem, 2.5vw, 1.9rem); }

.oa-eyebrow {
	font-size: .78rem;
	letter-spacing: .32em;
	text-transform: uppercase;
	color: var(--oa-accent);
	margin-bottom: .5rem;
}
.oa-muted { color: var(--oa-muted); }

a { color: var(--oa-text); text-decoration-thickness: 1px; text-underline-offset: 4px; transition: color .25s; }
a:hover { color: var(--oa-accent); }
:focus-visible { outline: 2px solid var(--oa-accent); outline-offset: 3px; }
hr, .wp-block-separator { border: 0; border-top: 1px solid var(--oa-line); opacity: 1; }

/* 3. PRZYCISKI (blok „Przycisk") – jasny motyw: czarna ramka ---------------- */
body .wp-block-button .wp-block-button__link,
body .wp-block-button .wp-element-button {
	background: transparent;
	color: var(--oa-text);
	border: 1px solid var(--oa-text);
	border-radius: 0;
	padding: .9em 2em;
	font-family: var(--oa-font-body);
	font-size: .8rem;
	font-weight: 400;
	letter-spacing: .24em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background .3s, color .3s, border-color .3s;
}
body .wp-block-button .wp-block-button__link:link,
body .wp-block-button .wp-block-button__link:visited,
body .wp-block-button .wp-block-button__link:focus,
body .wp-block-button .wp-block-button__link:active { color: var(--oa-text) !important; background: transparent; }
body .wp-block-button .wp-block-button__link:hover,
body .wp-block-button .wp-block-button__link:link:hover,
body .wp-block-button .wp-block-button__link:visited:hover {
	background: var(--oa-text);
	border-color: var(--oa-text);
	color: var(--oa-on-accent) !important;
}
body .wp-block-button.is-style-fill .wp-block-button__link { background: var(--oa-text); color: var(--oa-on-accent) !important; }

/* 4. STRONA GŁÓWNA ----------------------------------------------------------
   Okładka (Cover) z klasą  oa-hero  i dwiema grupami w środku:
     oa-hero-top     = nazwisko + podtytuł (u góry)
     oa-hero-bottom  = przyciski (na dole): blok „Przyciski” z oa-menu (lewa
                       strona) i drugi z oa-menu oa-menu-right (Kontakt, prawa)
   -------------------------------------------------------------------------- */
.oa-hero {
	min-height: 100vh;
	min-height: 100svh;
	isolation: isolate;
	padding: 0;
}
/* delikatne przyciemnienie góry i dołu – żeby biały tekst był czytelny */
.oa-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to bottom, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 62%, rgba(0,0,0,.4) 100%);
	pointer-events: none;
}
.oa-hero .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
	align-self: stretch;
	width: 100%;
	max-width: none;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: clamp(1rem, 2.5vw, 2.2rem);
	box-sizing: border-box;
}
/* nazwisko u góry po lewej, „aktorka" wyśrodkowana pod nim */
.oa-hero-top { align-self: flex-start; text-align: center; }
body .oa-hero h1,
body .oa-hero .oa-hero-sub { color: #fff !important; text-shadow: 0 1px 18px rgba(0,0,0,.35); }
.oa-hero h1 { margin: 0; font-size: clamp(2.2rem, 5.2vw, 4rem); line-height: 1; }
.oa-hero .oa-hero-sub {
	margin: .25rem 0 0;
	font-weight: 400;
	line-height: 1.2;
	font-family: var(--oa-font-head);
	font-size: clamp(1.1rem, 2vw, 1.5rem);
	letter-spacing: .04em;
}
/* przyciski: lewa kolumna + „Kontakt" po prawej */
.oa-hero-bottom {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 1rem;
}
.oa-hero-bottom .wp-block-buttons.oa-menu { display: flex; flex-direction: column; align-items: stretch; gap: .6rem; margin: 0; }
.oa-hero-bottom .wp-block-buttons.oa-menu:first-child { margin-left: clamp(0rem, 7vw, 9rem); }
.oa-hero-bottom .wp-block-buttons.oa-menu-right { align-items: flex-end; }
.oa-hero-bottom .oa-menu .wp-block-button { margin: 0; }
/* Przyciski na zdjęciu: „szron” (rozmyte szkło), lekko zaokrąglone rogi.
   Zmieniasz tu: promień (border-radius), siłę rozmycia (blur), przezroczystość tła. */
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link {
	display: block;
	min-width: 11.5rem;
	text-align: center;
	padding: .8em 1.4em;
	font-size: .8rem;
	letter-spacing: .2em;
	color: #fff !important;
	border: 1px solid rgba(255, 255, 255, .38);
	border-radius: 10px;                                   /* lekkie zaokrąglenie */
	background: rgba(20, 16, 12, .38);                     /* awaryjnie, gdy przeglądarka nie zna blur */
	-webkit-backdrop-filter: blur(12px) saturate(1.1);
	backdrop-filter: blur(12px) saturate(1.1);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	body .oa-hero .oa-menu .wp-block-button .wp-block-button__link { background: rgba(30, 24, 18, .26); }
}
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link:link,
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link:visited,
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link:focus,
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link:active { color: #fff !important; }
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link:hover,
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link:link:hover,
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link:visited:hover,
body .oa-hero .oa-menu .wp-block-button .wp-block-button__link:focus-visible {
	background: rgba(255, 255, 255, .88);
	color: var(--oa-text) !important;
	border-color: rgba(255, 255, 255, .88);
}
@media (max-width: 600px) {
	.oa-hero-top { align-self: center; }
	.oa-hero-bottom .wp-block-buttons.oa-menu:first-child { margin-left: 0; }
	body .oa-hero .oa-menu .wp-block-button .wp-block-button__link { min-width: 9rem; padding: .75em 1em; font-size: .74rem; letter-spacing: .14em; }
}

/* Widok na komputerze / tablecie poziomo (tam, gdzie jest poziome zdjęcie):
   osoba na zdjęciu stoi po lewej, więc nazwisko i przyciski są przy PRAWEJ
   krawędzi i są większe. Telefon (poniżej 768 px) i tablet w pionie zostają bez zmian.
   „!important” pokonuje wyśrodkowanie, które WordPress dodaje blokom w okładce. */
@media (min-width: 768px) and (min-aspect-ratio: 1/1) {
	body .oa-hero .wp-block-cover__inner-container {
		padding-left: clamp(2rem, 6vw, 7rem);
		padding-right: clamp(2rem, 6vw, 7rem);
	}
	body .oa-hero .wp-block-cover__inner-container > .oa-hero-top,
	body .oa-hero .wp-block-cover__inner-container > .oa-hero-bottom {
		align-self: flex-end;
		margin-left: auto !important;
		margin-right: 0 !important;
		max-width: none !important;
		width: auto;
	}
	.oa-hero-top { text-align: center; }               /* „aktorka” pod środkiem nazwiska */
	body .oa-hero h1 { font-size: clamp(2.6rem, 6vw, 6.5rem); }
	body .oa-hero .oa-hero-sub { font-size: clamp(1.3rem, 2.5vw, 2.4rem); }

	.oa-hero-bottom { justify-content: flex-start; gap: clamp(.6rem, 1vw, 1rem); }
	.oa-hero-bottom .wp-block-buttons.oa-menu { gap: clamp(.5rem, .8vw, .9rem); }
	.oa-hero-bottom .wp-block-buttons.oa-menu:first-child { margin-left: 0; }
	body .oa-hero .oa-menu .wp-block-button .wp-block-button__link {
		min-width: clamp(10.5rem, 17vw, 19rem);
		padding: 1.05em 1.5em;
		font-size: clamp(.8rem, min(1.3vw, 2.4vh), 1.3rem);   /* „vh” pilnuje, żeby na niskim ekranie nic nie wyszło poza kadr */
		border-radius: 14px;
	}
}

/* Niski poziomy ekran (np. telefon obrócony poziomo): mniejsze przyciski, żeby wszystko
   mieściło się w jednym kadrze. */
@media (min-width: 768px) and (min-aspect-ratio: 1/1) and (max-height: 520px) {
	body .oa-hero .oa-menu .wp-block-button .wp-block-button__link { padding: .6em 1em; font-size: .74rem; min-width: 9rem; border-radius: 10px; }
	.oa-hero-bottom .wp-block-buttons.oa-menu { gap: .35rem; }
	body .oa-hero h1 { font-size: clamp(2rem, 5vw, 3rem); }
	body .oa-hero .oa-hero-sub { font-size: 1.1rem; }
}

/* 5. PODSTRONY --------------------------------------------------------------- */
.oa-section { padding-block: clamp(3rem, 8vw, 7rem); }
.oa-back + .oa-section { padding-top: 0; }

/* link „← Powrót" (blok Akapit z klasą oa-back) */
.oa-back { margin: 0 0 2.5rem; font-size: .78rem; letter-spacing: .26em; text-transform: uppercase; line-height: 1.2; }
.oa-back a, .entry-content .oa-back a { color: var(--oa-text) !important; text-decoration: none; transition: color .25s; }
.oa-back a:hover, .entry-content .oa-back a:hover { color: var(--oa-accent) !important; }

/* nadtytuł zawsze w kolorze akcentu (Astra nadpisywała) */
p.oa-eyebrow, .entry-content p.oa-eyebrow { color: var(--oa-accent) !important; }

/* Galeria zdjęć */
.wp-block-gallery { gap: .75rem; }
.wp-block-gallery .wp-block-image { overflow: hidden; }
.wp-block-gallery .wp-block-image img { transition: transform .6s var(--oa-ease); }
.wp-block-gallery .wp-block-image:hover img { transform: scale(1.03); }

/* Showreel / O mnie – filmy z YouTube */
.wp-block-embed { margin-inline: 0; }
.wp-block-embed.is-type-video .wp-block-embed__wrapper { box-shadow: 0 18px 50px rgba(0,0,0,.14); background: #000; }

/* O mnie – długi tekst biograficzny: jedna wąska kolumna (wideo + tekst + zdjęcie + cytat) dla czytelności */
.oa-omnie { max-width: 700px; margin: 2.5rem auto 0; }
.oa-omnie .wp-block-embed { margin: 0 0 3rem; }
.oa-omnie-bio p { line-height: 1.85; margin: 0 0 1.4rem; text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.oa-omnie-bio p:last-child { margin-bottom: 0; }

.oa-omnie-photo.wp-block-image { max-width: 480px; margin: 3.5rem auto; text-align: center; }
.oa-omnie-photo img { display: block; width: 100%; height: auto; border-radius: 14px; box-shadow: 0 18px 50px rgba(0,0,0,.14); }

/* cytat na zamknięcie – kursywa nagłówkowej szeryfówki, cienka linia u góry, podpis autora jak oa-meta */
.oa-quote { max-width: 620px; margin: 3.5rem auto 0; padding-top: 2.4rem; border-top: 1px solid var(--oa-line); text-align: center; }
.oa-quote p { font-family: var(--oa-font-head); font-style: italic; font-size: clamp(1.15rem, 2.3vw, 1.45rem); line-height: 1.65; color: var(--oa-text); margin: 0 0 1.1rem; }
.oa-quote p:last-child { margin-bottom: 0; }
.oa-quote .oa-quote-author { font-family: var(--oa-font-body); font-style: normal; font-size: .76rem; letter-spacing: .22em; text-transform: uppercase; color: var(--oa-accent); }

/* Próba głosu – karty z odtwarzaczem */
.oa-samples { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 1rem; margin-top: 2.5rem; }
.oa-samples > *, .oa-spektakle > * { max-width: none !important; margin: 0 !important; }
.oa-sample { background: var(--oa-surface); border: 1px solid var(--oa-line); border-left: 2px solid var(--oa-accent); padding: 1.4rem 1.6rem; }
.oa-sample h3 { margin: 0 0 .5rem; }
.wp-block-audio { margin: 0; }
.wp-block-audio audio { width: 100%; }
.entry-content .oa-meta { font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: var(--oa-muted); margin: 0 0 1rem; }

/* Spektakle – karty: zdjęcie + podpis */
.oa-spektakle { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 3rem 2rem; margin-top: 2.5rem; }
.oa-spektakl .wp-block-image { margin: 0 0 1rem; }
.oa-spektakl .wp-block-image img { display: block; width: 100%; height: auto; }
.oa-spektakl h3 { margin: 0 0 .3rem; }
.entry-content .oa-spektakl .oa-meta { color: var(--oa-accent); margin: 0 0 .8rem; }
.oa-spektakl p { color: var(--oa-muted); font-size: .95rem; line-height: 1.7; margin: 0; }

/* Spektakle jako filmy: jedna kolumna, filmy do 720 px szerokości */
.oa-spektakle-wideo { grid-template-columns: minmax(0, 720px); gap: 3.5rem; }
.oa-spektakl .wp-block-embed { margin: 0 0 1rem; }

/* Spektakle jako zdjęcia: jedna kolumna, galeria z podpisami */
.oa-spektakle-zdjecia { grid-template-columns: minmax(0, 1fr); gap: 4rem; }
/* Galeria „Mozaika" (strona Zdjęcia): klasa oa-galeria-mozaika na bloku Galeria ---
   Rytm powtarza się co 10 zdjęć: duże + 2 małe, 2 równe, 2 małe przy dużym… ;
   działa przy dowolnej liczbie zdjęć, kolejne po prostu ciągną wzór dalej. */
.wp-block-gallery.oa-galeria-mozaika {
	--r: clamp(11rem, 29vw, 26rem);
	display: grid !important;
	grid-template-columns: repeat(12, 1fr);
	grid-auto-rows: var(--r);
	grid-auto-flow: dense;
	gap: .9rem;
}
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image {
	width: auto !important; flex: none !important; margin: 0;
	grid-column: span 6; height: 100%;
}
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image img {
	display: block; width: 100%; height: 100% !important;
	object-fit: cover; object-position: 50% 22%;
}
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+1)  { grid-column: 1 / span 7;  grid-row: span 2; }
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+2),
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+3)  { grid-column: 8 / span 5; }
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+4)  { grid-column: 1 / span 6;  grid-row: span 2; }
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+5)  { grid-column: 7 / span 6;  grid-row: span 2; }
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+6),
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+7)  { grid-column: 1 / span 5; }
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+8)  { grid-column: 6 / span 7;  grid-row: span 2; }
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+9)  { grid-column: 1 / span 6;  grid-row: span 2; }
.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(10n+10) { grid-column: 7 / span 6;  grid-row: span 2; }
@media (max-width: 700px) {
	.wp-block-gallery.oa-galeria-mozaika { grid-template-columns: 1fr 1fr; grid-auto-rows: auto; gap: .6rem; }
	.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(n) {
		grid-column: auto !important; grid-row: auto !important; aspect-ratio: 3/4; height: auto;
	}
	.wp-block-gallery.oa-galeria-mozaika figure.wp-block-image:nth-child(5n+1) {
		grid-column: 1 / -1 !important; aspect-ratio: 4/5;
	}
}

.oa-spektakle-zdjecia .wp-block-gallery { margin-top: 1.4rem; }
.oa-spektakle-zdjecia .wp-block-gallery figcaption { font-size: .85rem; line-height: 1.5; }

/* Kontakt */
.oa-contact { gap: 3rem; }
.oa-contact h3 { font-size: .78rem; font-family: var(--oa-font-body); letter-spacing: .3em; text-transform: uppercase; color: var(--oa-accent); font-weight: 400; margin-bottom: .6rem; }
.oa-contact p { margin-top: 0; }
/* kilka pozycji (np. e-mail, Instagram, Facebook) w jednej kolumnie – odstęp nad każdą kolejną */
.oa-contact h2 ~ h2, .oa-contact h3 ~ h3 { margin-top: 1.8rem !important; }
.oa-contact a { color: var(--oa-text); text-decoration: none; border-bottom: 1px solid var(--oa-accent); }
.oa-contact a:hover { color: var(--oa-accent); }

/* Formularze */
input[type="text"], input[type="email"], input[type="tel"], textarea, select {
	width: 100%; background: var(--oa-surface); color: var(--oa-text);
	border: 1px solid var(--oa-line); border-radius: 0; padding: .85rem 1rem; font: inherit;
}
input:focus, textarea:focus, select:focus { border-color: var(--oa-text); outline: none; }
input[type="submit"], button[type="submit"] {
	background: transparent; color: var(--oa-text); border: 1px solid var(--oa-text); border-radius: 0;
	padding: .9em 2em; letter-spacing: .24em; text-transform: uppercase; font-size: .8rem; cursor: pointer; transition: background .3s, color .3s;
}
input[type="submit"]:hover, button[type="submit"]:hover { background: var(--oa-text); color: var(--oa-on-accent); }

/* 6. DOPASOWANIE DO ASTRY (jej selektory są mocne) --------------------------- */
#masthead, .site-header { display: none !important; }   /* strona nie ma nawigacji */

html, body, .site, #page, #content, .site-content, .ast-container,
.ast-separate-container, .ast-separate-container #primary,
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-single:not(.ast-related-post),
.ast-separate-container .ast-article-post,
.ast-separate-container .site-main > .ast-row,
.ast-plain-container, .ast-plain-container .site-content,
.ast-page-builder-template .site-content > .ast-container,
article.page, .entry-content { background-color: var(--oa-bg) !important; }

.entry-content :is(h1, h2, h3, h4, h5, h6), .entry-title, .entry-title a, .page-title { color: var(--oa-text); font-family: var(--oa-font-head); }
.entry-content p, .entry-content li { color: var(--oa-text); }
.entry-content a:not(.wp-block-button__link) { color: var(--oa-text); }
.entry-content a:not(.wp-block-button__link):hover { color: var(--oa-accent); }
.site-footer, .ast-small-footer, .site-below-footer-wrap { background-color: var(--oa-bg); color: var(--oa-muted); border-top: 1px solid var(--oa-line); }

/* SEO: nagłówki w hierarchii H1 → H2, wygląd jak wcześniej --------------------- */
/* główny nagłówek podstrony (H1) wygląda jak dawny duży H2 */
.entry-content .oa-section h1 { font-size: clamp(2rem, 4.5vw, 3.25rem); line-height: 1.1; margin-top: 0; }
/* nagłówki kart (H2) wyglądają jak dawne H3 */
.entry-content .oa-sample h2,
.entry-content .oa-spektakl h2 { font-size: clamp(1.4rem, 2.5vw, 1.9rem); line-height: 1.15; margin: 0 0 .4rem; }
.entry-content .oa-contact h2 {
	font-size: .78rem; font-family: var(--oa-font-body); letter-spacing: .3em;
	text-transform: uppercase; color: var(--oa-accent); font-weight: 400; margin: 0 0 .6rem;
}

/* Powiększanie zdjęć w galeriach (okienko) – skrypt w scripts.js ------------------ */
.wp-block-gallery figure.wp-block-image { cursor: zoom-in; }
html.oa-lb-open { overflow: hidden; }
dialog.oa-lightbox {
	position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none;
	margin: 0; padding: 0; border: 0; background: rgba(255, 255, 255, .96); color: var(--oa-text);
	display: none; align-items: center; justify-content: center;
}
dialog.oa-lightbox[open] { display: flex; }
dialog.oa-lightbox::backdrop { background: rgba(255, 255, 255, .96); }
.oa-lb-fig { margin: 0; display: flex; flex-direction: column; align-items: center; max-width: 100%; }
.oa-lb-fig img {
	display: block; width: auto; height: auto; max-width: min(92vw, 1600px); max-height: 84vh;
	object-fit: contain; box-shadow: 0 8px 40px rgba(0, 0, 0, .12);
}
.oa-lb-fig figcaption { margin-top: .8rem; font-size: .9rem; text-align: center; max-width: 60ch; padding: 0 1rem; }
.oa-lb-count { position: absolute; left: 0; right: 0; bottom: .8rem; text-align: center; font-size: .78rem; letter-spacing: .2em; opacity: .55; }
dialog.oa-lightbox button {
	position: absolute; border: 0 !important; background: transparent !important; color: var(--oa-text) !important; cursor: pointer;
	font-size: 2.6rem; line-height: 1; width: 3.2rem; height: 3.2rem; padding: 0; border-radius: 50%;
	display: flex; align-items: center; justify-content: center; transition: background .2s;
}
dialog.oa-lightbox button:hover, dialog.oa-lightbox button:focus-visible { background: rgba(0, 0, 0, .07) !important; outline: none; }
.oa-lb-close { top: .8rem; right: .8rem; font-size: 2.4rem !important; }
.oa-lb-nav { top: 50%; transform: translateY(-50%); }
.oa-lb-prev { left: .6rem; } .oa-lb-next { right: .6rem; }
dialog.oa-lightbox.oa-lb-single .oa-lb-nav { display: none; }
@media (max-width: 700px) {
	.oa-lb-fig img { max-width: 100vw; max-height: 78vh; box-shadow: none; }
	.oa-lb-nav { display: none !important; }   /* na telefonie: przeciągnięcie palcem */
}

/* Galeria „Karuzela" (strona Zdjęcia) – klasa oa-galeria-karuzela na bloku Galeria -----
   Struktura i przełączanie robi scripts.js (owija galerię w .oa-karuzela).
   Zdjęcia pionowe/kwadratowe mają wspólną, stałą proporcję (przycięte); pozioma zostaje w swoich
   proporcjach (ustawia to scripts.js przez --ar). Sąsiednie zdjęcia chowają się pod środkowym –
   UWAGA: "gap" we flexboksie nie może być ujemny (przeglądarka po prostu by go zignorowała), więc
   nachodzenie robimy przez ujemny margines na każdej figurze oprócz pierwszej.
   --overlap jest WYLICZANY z szerokości zdjęcia (min(--sh,--maxw/.667)*.667), nie sztywną liczbą:
   zdjęcia dalej od środka są pomniejszone o 22% (transform: scale w regule niżej), więc bez tej
   rekompensaty przy dalszych parach widać szparę zamiast nachodzenia – to poprawka z 22.09/2. */
.oa-karuzela { position: relative; margin: 1rem 0 0; }
.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela {
	--sh: clamp(12.5rem, min(27vw, 50vh), 28rem);    /* wysokość zdjęcia w środku – mniejsze, żeby zmieściło się więcej sąsiadów */
	--maxw: 38vw;                                     /* najszersze zdjęcie (poziome) */
	--overlap: calc(-0.22 * (min(var(--sh), var(--maxw) / 0.667) * 0.667) - 16px);
	display: flex !important; flex-wrap: nowrap !important; gap: 0 !important; align-items: center;
	overflow-x: auto; overflow-y: hidden;
	scroll-snap-type: x mandatory; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	margin: 0; padding: 2.2rem 30% 3.2rem;            /* boczne odstępy dopasowuje skrypt */
}
.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela::-webkit-scrollbar { display: none; }
.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela:focus-visible { outline: 1px dashed rgba(22,19,15,.3); outline-offset: -4px; }
.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela figure.wp-block-image {
	flex: 0 0 auto !important; margin: 0 !important; max-width: none !important;
	aspect-ratio: var(--ar, .667);
	height: min(var(--sh), calc(var(--maxw) / var(--ar, .667)));
	width: auto !important;
	border-radius: 14px; overflow: hidden; position: relative;
	scroll-snap-align: center; scroll-snap-stop: always;
	transform: scale(calc(1 - .22 * min(var(--d, 0), 1)));
	box-shadow: 0 16px 34px -12px rgba(30, 24, 18, calc(.38 * (1 - min(var(--d, 0), 1))));
	will-change: transform, opacity;
}
.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela figure.wp-block-image:not(:first-child) {
	margin-left: var(--overlap) !important;
}
.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela figure.wp-block-image img {
	display: block; width: 100% !important; height: 100% !important; max-width: none !important;
	flex: 1 1 auto !important; object-fit: cover; object-position: 50% 25%;
}
.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela figure.wp-block-image figcaption { display: none; }

/* Strzałki: jedna z obwódką i beżową strzałką na białym, druga wypełniona beżem z białą strzałką */
.oa-karuzela-nav { display: flex; justify-content: center; gap: .8rem; margin-top: .2rem; }
.oa-karuzela-nav button {
	width: 2.7rem; height: 2.7rem; padding: 0; border-radius: 50%; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid var(--oa-accent) !important;
	transition: background .25s, color .25s, opacity .25s;
}
.oa-karuzela-nav .oa-k-prev { background: #fff !important; color: var(--oa-accent) !important; }
.oa-karuzela-nav .oa-k-next { background: var(--oa-accent) !important; color: #fff !important; }
.oa-karuzela-nav button:hover:not(:disabled), .oa-karuzela-nav button:focus-visible { outline: none; opacity: .82; }
.oa-karuzela-nav button:disabled { opacity: .3; cursor: default; }
@media (max-width: 700px) {
	.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela {
		--sh: min(62vw, 52vh); --maxw: 62vw; padding-top: 1.4rem; padding-bottom: 2.4rem;
	}
}
@media (prefers-reduced-motion: reduce) {
	.oa-karuzela > .wp-block-gallery.oa-galeria-karuzela { scroll-behavior: auto; }
}

/* Galeria „Tablica" (strona Spektakle) – klasa oa-galeria-tablica na bloku Galeria -----
   Kwadratowe kafelki w bloku po 5 zdjęć: 3 mniejsze po lewej, 2 większe po prawej (potem wzór się powtarza).
   Zdjęcia są kadrowane do kwadratu, pod każdym mały podpis (tytuł spektaklu).
   Wysokość wierszy dolicza skrypt (scripts.js), żeby kafelki wyszły kwadratowe. */
.wp-block-gallery.oa-galeria-tablica {
	display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr));
	grid-auto-rows: var(--r, auto); grid-auto-flow: row dense;
	gap: .8rem; align-items: stretch; margin: 1.6rem 0 0;
}
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image {
	display: flex !important; flex-direction: column; width: auto !important; max-width: none !important;
	margin: 0 !important; overflow: visible !important; position: relative; min-height: 0; min-width: 0;
}
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+1),
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+2),
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+3) { grid-column: 1 / span 2; grid-row: span 2; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+4),
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+5) { grid-column: 3 / span 3; grid-row: span 3; }
/* ostatni, niepełny blok (1–4 zdjęć) – rozciągamy, żeby nie zostawały dziury */
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+1):last-child { grid-column: 1 / -1; grid-row: span 3; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+1):nth-last-child(2) { grid-column: 1 / span 3; grid-row: span 3; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+2):last-child { grid-column: 4 / span 2; grid-row: span 3; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+1):nth-last-child(3) { grid-column: 1 / span 3; grid-row: span 3; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+2):nth-last-child(2) { grid-column: 4 / span 2; grid-row: span 3; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+3):last-child { grid-column: 1 / -1; grid-row: span 3; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:nth-child(5n+4):last-child { grid-row: span 6; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image img {
	display: block; width: 100% !important; height: auto !important; max-width: 100% !important;
	flex: 1 1 0; min-height: 0; object-fit: cover; object-position: 50% 30%;
	border-radius: 12px; transition: opacity .3s;
}
.wp-block-gallery.oa-galeria-tablica:not(.oa-tablica-js) figure.wp-block-image img { aspect-ratio: 1 / 1; }
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image:hover img { transform: none; opacity: .92; }
/* Podpis: pierwsza linia (tytuł spektaklu) – lekki kursywny szeryf; druga linia (reżyseria + teatr,
   w tej samej linii co reżyseria, oddzielone przecinkiem, przez Shift+Enter w polu podpisu) –
   mniejsza, prosta, przygaszona. Bez wersalików i pogrubienia. */
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image figcaption {
	position: static !important; flex: 0 0 auto !important; background: none !important;
	padding: .5rem .1rem 0 !important; margin: 0 !important; max-height: none !important; overflow: visible !important;
	font-family: var(--oa-font-body) !important; font-weight: 400 !important; font-style: normal !important;
	font-size: .6rem; line-height: 1.45; letter-spacing: .03em; text-transform: none !important; text-align: left;
	color: var(--oa-muted) !important;
}
.wp-block-gallery.oa-galeria-tablica figure.wp-block-image figcaption::first-line {
	font-family: var(--oa-font-head) !important; font-style: italic; font-weight: 400 !important;
	font-size: .95rem; letter-spacing: .01em; color: var(--oa-text) !important;
}
@media (max-width: 700px) {
	.wp-block-gallery.oa-galeria-tablica { gap: .6rem; }
	.wp-block-gallery.oa-galeria-tablica figure.wp-block-image figcaption { font-size: .56rem; padding-top: .35rem !important; }
	.wp-block-gallery.oa-galeria-tablica figure.wp-block-image figcaption::first-line { font-size: .82rem; }
}
