/*
Theme Name:   Astra Child – Olga
Description:  Motyw potomny Astry dla strony aktorskiej (jasny styl)
Template:     astra
Version:      2.1.0
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; }
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;
	background: transparent;
	border: 1px solid #fff;
	color: #fff !important;
}
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; background: transparent; }
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 {
	background: #fff;
	color: var(--oa-text) !important;
	border-color: #fff;
}
@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; }
}

/* 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; }
.oa-omnie { gap: 3rem; align-items: flex-start; }
@media (max-width: 781px) { .oa-omnie { gap: 2rem; } }

/* 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; }
.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; }
.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;
}