/* aliciareuss.de — "Bühne" theme, forked from YJAR CMS's "Modern" theme.
   Dark stage palette (aubergine/black + champagne gold), Fraunces for
   headings, Inter for body — same brand as the original static prototype.
   Brand colours come from site.brand.* (see layout.html's inline <style>);
   this file only defines the FIXED, safe font-family lists those hook into. */
:root {
	--navy: #f7f1ea;
	--navy-2: #e7dcc9;
	--ink: #ede3d3;
	--muted: rgba(247,241,234,.68);
	--paper: #110a13;
	--surface: #1c1420;
	--line: rgba(247,241,234,.14);
	--brand-primary: #d8b56d;
	--brand-accent: #d9a6a1;
	--on-brand: #1b1418;
	--footer-bg: #0b070c;
	--wrap: 1180px;
	--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--font-display: "Fraunces", Georgia, "Times New Roman", serif;
	--font-body: var(--font-sans);
}
:root[data-font="serif"] { --font-body: Georgia, "Times New Roman", serif; }

@font-face { font-family: "Fraunces"; src: url("/theme/fonts/fraunces-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Fraunces"; src: url("/theme/fonts/fraunces-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Fraunces"; src: url("/theme/fonts/fraunces-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Fraunces"; src: url("/theme/fonts/fraunces-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Fraunces"; src: url("/theme/fonts/fraunces-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Fraunces"; src: url("/theme/fonts/fraunces-500-italic.woff2") format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/theme/fonts/inter-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/theme/fonts/inter-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/theme/fonts/inter-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/theme/fonts/inter-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font-family: var(--font-body);
	color: var(--ink);
	background: var(--paper);
	line-height: 1.6;
}
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
a { color: var(--brand-primary); text-decoration: none; }
a:hover { color: var(--brand-accent); }
img { max-width: 100%; height: auto; }

/* Consistent, visible keyboard-focus ring — mouse/touch users never see
   it, :focus-visible only fires for keyboard/AT focus. */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible,
select:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
	outline: 2px solid var(--brand-accent); outline-offset: 2px; border-radius: 4px;
}

.skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 100;
	background: var(--surface); color: var(--navy); padding: 10px 16px; border-radius: 0 0 10px 0;
}
.skip-link:focus { left: 0; }

.preview-bar { text-align: center; font-weight: 700; padding: 8px 12px; font-size: 14px; }
.preview-bar:not(.preview-bar--customizer) { background: var(--brand-accent); color: var(--on-brand); }
.preview-bar--customizer { background: var(--surface); color: var(--navy); }

/* Header — sticky dark stage bar, gold wordmark. */
.site-header { background: rgba(17,10,19,.92); backdrop-filter: blur(6px); color: var(--ink); position: sticky; top: 0; z-index: 10; border-bottom: 1px solid var(--line); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-top: 16px; padding-bottom: 16px; flex-wrap: wrap; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--navy); font-weight: 600; font-size: 19px; font-family: var(--font-display); letter-spacing: .02em; }
.brand__logo { max-height: 36px; width: auto; display: block; }
.brand:hover { color: var(--brand-primary); }

.menu { list-style: none; display: flex; gap: 2px; margin: 0; padding: 0; flex-wrap: wrap; }
.menu__item a { display: inline-block; padding: 10px 14px; border-radius: 8px; font-weight: 600; font-size: 15px; color: var(--ink); transition: background .15s ease, color .15s ease; }
.menu__item a:hover { background: rgba(247,241,234,.08); color: var(--navy); }

/* Mobile nav toggle — CSS-only checkbox hack, no JS. */
.nav-toggle-input { position: absolute; opacity: 0; pointer-events: none; }
.nav-toggle-label { display: none; }

.lang-switch { display: flex; gap: 2px; margin-left: 8px; }
.lang-switch__item { display: inline-block; padding: 6px 9px; border-radius: 6px; font-weight: 700; font-size: 12px; letter-spacing: .03em; text-transform: uppercase; color: var(--ink); border: 1px solid var(--line); }
.lang-switch__item:hover { background: rgba(247,241,234,.1); }
.lang-switch__item.is-active { background: var(--brand-primary); color: var(--on-brand); border-color: var(--brand-primary); }

/* Main */
.site-main { padding: 48px 0 72px; background: var(--paper); }
.page__title, .post__title { font-family: var(--font-display); color: var(--navy); font-weight: 800; font-size: clamp(1.9rem, 4.4vw, 2.9rem); line-height: 1.12; margin: 0 0 22px; letter-spacing: -.01em; }
.content { font-size: 17px; }
.content p { margin: 0 0 1.1em; }
.content h2 { font-family: var(--font-display); font-weight: 800; color: var(--navy); margin-top: 1.6em; }
.content h3 { font-family: var(--font-display); font-weight: 700; color: var(--navy); }
.content .lead { font-size: 1.25em; color: var(--navy); }
.content a { text-decoration: underline; text-underline-offset: 2px; }
.content ul, .content ol { padding-left: 1.3em; }
.content blockquote { border-left: 4px solid var(--brand-accent); margin: 1.2em 0; padding: .5em 0 .5em 1.1em; color: var(--navy); background: var(--surface); border-radius: 0 10px 10px 0; }

.btn, .content .btn {
	display: inline-block; background: var(--brand-primary); color: var(--on-brand); text-decoration: none;
	padding: 12px 24px; border-radius: 999px; font-weight: 700; transition: background .15s ease, transform .1s ease;
}
.btn:hover, .content .btn:hover { background: var(--brand-accent); transform: translateY(-1px); }
.btn:active, .content .btn:active { transform: translateY(0); }
/* .btn--ghost — used by the account templates (login/logout/reset). */
.btn--ghost, .content .btn--ghost {
	background: transparent; color: var(--navy); border: 2px solid var(--navy); padding: 10px 22px; border-radius: 999px;
}
.btn--ghost:hover, .content .btn--ghost:hover { background: var(--navy); color: var(--on-brand); transform: none; }

/* Account pages (login/register/forgot/reset/logout) */
.account-page { max-width: 480px; }
.account-form { margin-top: 8px; }
.hint { color: var(--muted); font-size: 14px; margin-top: 20px; }
.hint a { font-weight: 700; color: var(--brand-primary); }

/* Post meta + card-based list */
.post__meta, .postcard__meta { color: var(--muted); font-size: 14px; }
.postgrid { display: grid; gap: 26px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.postcard {
	border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--paper);
	box-shadow: 0 2px 10px rgba(15,23,48,.05); transition: box-shadow .15s ease, transform .15s ease;
	display: flex; flex-direction: column;
}
.postcard:hover { box-shadow: 0 16px 32px rgba(15,23,48,.14); transform: translateY(-3px); }
.postcard__body { padding: 20px 22px 24px; }
.postcard__title { margin: 4px 0 8px; font-size: 1.3rem; font-family: var(--font-display); font-weight: 700; }
.postcard__title a { color: var(--navy); }
.postcard__title a:hover { color: var(--brand-primary); }
.postcard__excerpt { margin: 0 0 10px; color: var(--muted); }
.postcard__more { font-weight: 700; color: var(--brand-primary); }
.postcard__thumb { display: block; margin: 0; }
.postcard__thumb img { display: block; width: 100%; height: 190px; object-fit: cover; }

.post__image, .page > .post__image {
	width: 100%; max-height: 440px; object-fit: cover; border-radius: 16px; margin: 0 0 26px;
}

.post__cats, .post__tags { margin: 0 0 18px; display: flex; gap: 8px; flex-wrap: wrap; }
.chip {
	display: inline-block; padding: 6px 14px; border-radius: 999px; font-size: 13px; font-weight: 700;
	background: var(--surface); color: var(--navy); text-decoration: none;
}
.chip:hover { background: var(--brand-primary); color: var(--on-brand); }
.chip--tag { background: transparent; border: 1px solid var(--line); color: var(--muted); font-weight: 600; }
.chip--tag:hover { border-color: var(--brand-accent); color: var(--navy); }

.pagination { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 16px; padding-top: 20px; border-top: 1px solid var(--line); }
.pagination__status { color: var(--muted); font-size: 14px; }
.pagination__prev, .pagination__next { font-weight: 700; color: var(--brand-primary); }
.pagination__prev:hover, .pagination__next:hover { color: var(--brand-accent); }

.notfound { text-align: center; padding: 70px 0; }
.notfound__code { font-family: var(--font-display); font-size: 5rem; font-weight: 800; color: var(--brand-accent); margin: 0; }
.notfound h1 { font-family: var(--font-display); color: var(--navy); }

.site-footer { background: var(--footer-bg); color: var(--muted); }
.site-footer .wrap { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 24px; padding-bottom: 24px; }
.site-footer p { margin: 0; font-size: 14px; }
.site-footer__claim { color: var(--brand-accent); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 12px; }

@media (max-width: 620px) {
	.site-header .wrap { position: relative; flex-wrap: wrap; }
	.nav-toggle-label {
		display: flex; align-items: center; justify-content: center;
		width: 40px; height: 40px; margin-left: auto; border-radius: 8px; cursor: pointer;
	}
	.nav-toggle-label:hover { background: rgba(255,255,255,.08); }
	.nav-toggle-label span, .nav-toggle-label span::before, .nav-toggle-label span::after {
		content: ""; display: block; width: 22px; height: 2px; background: #fff; border-radius: 2px;
		transition: transform .2s ease, opacity .2s ease;
	}
	.nav-toggle-label span { position: relative; }
	.nav-toggle-label span::before { position: absolute; top: -7px; }
	.nav-toggle-label span::after { position: absolute; top: 7px; }
	.nav-toggle-input:checked + .nav-toggle-label span { background: transparent; }
	.nav-toggle-input:checked + .nav-toggle-label span::before { top: 0; transform: rotate(45deg); }
	.nav-toggle-input:checked + .nav-toggle-label span::after { top: 0; transform: rotate(-45deg); }
	.nav-toggle-input:focus-visible + .nav-toggle-label { outline: 2px solid var(--brand-accent); outline-offset: 2px; }

	.site-nav { display: none; width: 100%; order: 3; margin-top: 10px; }
	.nav-toggle-input:checked ~ .site-nav { display: block; }
	.site-nav .menu { flex-direction: column; gap: 2px; }
	.site-nav .menu__item a { display: block; padding: 12px 14px; }
	.lang-switch { order: 4; width: 100%; margin-left: 0; margin-top: 10px; }
}

/* Comments */
.comments { margin-top: 48px; padding-top: 30px; border-top: 1px solid var(--line); }
.comments__title { font-family: var(--font-display); color: var(--navy); margin: 0 0 16px; }
.comments__empty { color: var(--muted); }
.comments__hint { font-size: 13px; color: var(--muted); margin: 8px 0 0; }
.comments__notice { padding: 10px 14px; border-radius: 10px; font-weight: 700; margin: 0 0 18px; }
.comments__notice--ok { background: #e3f3e8; color: #1c6b3a; }
.comments__notice--err { background: #fce4e2; color: #c0392b; }
.comments__list { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 16px; }
.comment { border: 1px solid var(--line); border-radius: 14px; padding: 16px 20px; background: var(--surface); }
.comment__meta { margin: 0 0 6px; font-size: 13px; color: var(--muted); }
.comment__body { margin: 0; white-space: pre-wrap; word-wrap: break-word; }

.comment-form, .yjar-form { max-width: 560px; }
.comment-form label, .yjar-form label { display: block; font-weight: 700; color: var(--navy); font-size: 14px; margin: 14px 0 5px; }
.comment-form input[type=text], .comment-form input[type=email], .comment-form textarea,
.yjar-form input[type=text], .yjar-form input[type=email], .yjar-form textarea, .yjar-form select {
	width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: 10px; font-family: inherit; font-size: 15px; color: var(--ink); background: var(--surface);
}
.comment-form textarea, .yjar-form textarea { resize: vertical; line-height: 1.5; min-height: 100px; }
.comment-form input:focus, .comment-form textarea:focus,
.yjar-form input:focus, .yjar-form textarea:focus, .yjar-form select:focus { outline: none; border-color: var(--brand-primary); box-shadow: 0 0 0 3px rgba(91,124,250,.2); }
.comment-form button, .yjar-form button { margin-top: 16px; border: none; cursor: pointer; }
.comment-form__hp, .hp-field { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.yjar-form .form-field { margin: 14px 0; }
.yjar-form .form-field--checkbox label { display: flex; align-items: center; gap: 8px; font-weight: 400; }

/* ===================================================================
   Page-builder blocks (plugins/page-builder/) — same fixed class names
   regardless of theme; see themes/yjar/style.css for the authoritative
   list of what the renderer emits.
   =================================================================== */
.block { margin: 0 0 26px; }
.block:last-child { margin-bottom: 0; }
.block--heading { font-family: var(--font-display); font-weight: 800; color: var(--navy); }
.block--image img { display: block; border-radius: 12px; }
.block--image figcaption { margin-top: 8px; font-size: 14px; color: var(--muted); }
.block--spacer { margin: 0; }

.block__btn { display: inline-block; padding: 12px 24px; border-radius: 999px; font-weight: 700; text-decoration: none; transition: background .15s ease, color .15s ease, border-color .15s ease, transform .1s ease; }
.block__btn--primary { background: var(--brand-primary); color: var(--on-brand); }
.block__btn--primary:hover { background: var(--brand-accent); transform: translateY(-1px); }
.block__btn--secondary { background: var(--surface); color: var(--navy); }
.block__btn--secondary:hover { background: var(--brand-accent); color: var(--on-brand); }
.block__btn--ghost { background: transparent; color: var(--navy); border: 2px solid var(--navy); padding: 10px 22px; }
.block__btn--ghost:hover { border-color: var(--brand-accent); color: var(--brand-accent); }

.block--columns { display: grid; gap: 24px; grid-template-columns: repeat(var(--cols, 2), 1fr); align-items: start; }
.block__col > .block:last-child { margin-bottom: 0; }

.block--gallery { display: grid; gap: 14px; grid-template-columns: repeat(var(--gallery-cols, 3), 1fr); }
.gallery__item { margin: 0; }
.gallery__item img { display: block; width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 12px; }

.block--testimonial { margin: 0 0 26px; padding: 28px 30px; border-radius: 16px; background: var(--surface); border-left: 4px solid var(--brand-accent); }
.testimonial__quote { margin: 0 0 16px; font-size: 1.15em; color: var(--navy); font-style: italic; }
.testimonial__author { display: flex; align-items: center; gap: 12px; }
.testimonial__avatar { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; }
.testimonial__who { display: flex; flex-direction: column; }
.testimonial__name { font-weight: 800; color: var(--navy); }
.testimonial__role { font-size: 13px; color: var(--muted); }

.block--pricing-table { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); align-items: stretch; }
.pricing-card { display: flex; flex-direction: column; padding: 28px 26px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.pricing-card--featured { border-color: var(--brand-accent); box-shadow: 0 14px 32px rgba(255,138,61,.18); }
.pricing-card__title { margin: 0 0 6px; font-family: var(--font-display); color: var(--navy); }
.pricing-card__price { margin: 0 0 16px; font-size: 1.7em; font-weight: 800; color: var(--navy); }
.pricing-card__features { list-style: none; margin: 0 0 20px; padding: 0; flex: 1; display: grid; gap: 8px; }
.pricing-card__features li { padding-left: 22px; position: relative; }
.pricing-card__features li::before { content: "\2713"; position: absolute; left: 0; color: var(--brand-primary); font-weight: 700; }
.pricing-card__cta { text-align: center; }

.block--accordion { display: grid; gap: 10px; }
.accordion__item { border: 1px solid var(--line); border-radius: 12px; padding: 4px 18px; background: var(--paper); }
.accordion__summary { cursor: pointer; padding: 14px 0; font-weight: 700; color: var(--navy); list-style: none; }
.accordion__summary::-webkit-details-marker { display: none; }
.accordion__summary::before { content: "+"; display: inline-block; width: 1.2em; color: var(--brand-primary); font-weight: 700; }
.accordion__item[open] > .accordion__summary::before { content: "\2013"; }
.accordion__content { padding: 0 0 16px; }
.accordion__content p:last-child { margin-bottom: 0; }

.block--tabs { display: flex; flex-wrap: wrap; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.tabs__radio { position: absolute; opacity: 0; width: 1px; height: 1px; order: 0; }
.tabs__label { order: 1; padding: 13px 20px; cursor: pointer; font-weight: 700; color: var(--navy); background: var(--surface); border-bottom: 3px solid transparent; }
.tabs__label:hover { color: var(--brand-primary); }
.tabs__radio:checked + .tabs__label { background: var(--paper); border-bottom-color: var(--brand-accent); }
.tabs__radio:focus-visible + .tabs__label { outline: 2px solid var(--brand-accent); outline-offset: -2px; }
.tabs__panel { order: 9; display: none; width: 100%; padding: 24px; background: var(--paper); }
.tabs__radio:checked + .tabs__label + .tabs__panel { display: block; }

.block--icon-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.icon-list__item { display: flex; align-items: flex-start; gap: 10px; }
.icon-list__icon { flex: none; color: var(--brand-primary); margin-top: 2px; }
.icon-list__icon svg { display: block; }

.block--divider { border: none; border-top-style: solid; border-top-width: 2px; border-top-color: var(--line); width: var(--divider-width, 100%); margin: var(--divider-spacing, 24px) auto; }
.block--divider-dashed { border-top-style: dashed; }
.block--divider-dotted { border-top-style: dotted; }

.block--video-embed { margin: 0 0 26px; }
.video-embed__frame { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; }
.video-embed__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

@media (max-width: 680px) {
	.u-hide-mobile { display: none !important; }
	.block--columns { grid-template-columns: 1fr; }
	.block--columns.block--columns-keep { grid-template-columns: repeat(var(--cols, 2), 1fr); }
}
@media (min-width: 681px) {
	.u-hide-desktop { display: none !important; }
}

/* Entrance animations — see /theme/block-animations.js. */
html.can-animate [data-animate] { transition: opacity .6s ease, transform .6s ease; }
html.can-animate [data-animate="fade-in"] { opacity: 0; }
html.can-animate [data-animate="slide-up"] { opacity: 0; transform: translateY(28px); }
html.can-animate [data-animate].is-inview { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	html.can-animate [data-animate] { transition: none !important; opacity: 1 !important; transform: none !important; }
}

/* Always dark (this brand's fixed stage look — not tied to the visitor's
   OS colour-scheme preference). */
.postcard, .pricing-card, .accordion__item, .tabs__panel, .comment { background: var(--surface); }

/* ===== Ported one-pager section styles from the original static site (public/styles.css) ===== */
/* =====================================================================
   Alicia Reuß — aliciareuss.de
   Premium one-pager · self-hosted fonts · dependency-free
   ===================================================================== */

/* ---------- Fonts (self-hosted, DSGVO-konform) ---------- */
@font-face{font-family:'Fraunces';src:url('/theme/fonts/fraunces-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url('/theme/fonts/fraunces-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url('/theme/fonts/fraunces-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url('/theme/fonts/fraunces-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url('/theme/fonts/fraunces-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Fraunces';src:url('/theme/fonts/fraunces-500-italic.woff2') format('woff2');font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:'Inter';src:url('/theme/fonts/inter-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/theme/fonts/inter-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/theme/fonts/inter-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/theme/fonts/inter-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --stage-ink:#110A13;
  --stage-ink-2:#18101b;
  --stage-ink-3:#20141f;
  --cream:#F7F1EA;
  --cream-dim:rgba(247,241,234,.70);
  --cream-faint:rgba(247,241,234,.42);
  --gold:#D8B56D;
  --gold-bright:#E7C988;
  --rose:#D9A6A1;
  --bordeaux:#7A1F35;
  --stage-line:rgba(216,181,109,.20);
  --stage-line-soft:rgba(247,241,234,.10);
  --font-display:'Fraunces',Georgia,'Times New Roman',serif;
  --font-body:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --container:1180px;
  --pad:clamp(1.25rem,5vw,2.5rem);
  --r:14px;
  --shadow:0 30px 80px -30px rgba(0,0,0,.7);
  color-scheme:dark;
}

/* ---------- Reset / base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--stage-ink);color:var(--cream);
  font-family:var(--font-body);font-size:clamp(1rem,.96rem + .2vw,1.08rem);
  line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.08;margin:0;letter-spacing:-.01em}
p{margin:0 0 1rem}
::selection{background:var(--gold);color:var(--stage-ink)}

.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--pad)}

.skip-link{position:fixed;left:1rem;top:-60px;z-index:200;background:var(--gold);color:var(--stage-ink);
  padding:.6rem 1rem;border-radius:8px;font-weight:600;transition:top .2s}
.skip-link:focus{top:1rem}

:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px;border-radius:4px}

/* ---------- Eyebrow / headings ---------- */
.eyebrow{font-family:var(--font-body);text-transform:uppercase;letter-spacing:.26em;
  font-size:.72rem;font-weight:600;color:var(--gold);margin:0 0 1rem}
.section-title{font-size:clamp(2rem,1.4rem + 2.6vw,3.4rem)}
.section-sub{color:var(--cream-dim);max-width:60ch;margin-top:1rem;font-size:1.05rem}
.section-head{text-align:center;max-width:760px;margin:0 auto clamp(2.5rem,5vw,4rem)}
.section-head--left{text-align:left;margin-inline:0}
.section-head .section-sub{margin-inline:auto}
.section-head--left .section-sub{margin-inline:0}

.section{padding:clamp(4.5rem,9vw,8rem) 0;position:relative}
.lead{font-family:var(--font-display);font-size:clamp(1.3rem,1.05rem + 1.1vw,1.85rem);
  line-height:1.35;color:var(--cream);font-weight:500}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.5rem;border-radius:100px;
  padding:.85rem 1.6rem;font-weight:600;font-size:.95rem;border:1px solid transparent;
  transition:transform .25s cubic-bezier(.2,.7,.3,1),background .25s,color .25s,border-color .25s,box-shadow .25s;
  will-change:transform}
.btn-sm{padding:.6rem 1.15rem;font-size:.85rem}
.btn-gold{background:linear-gradient(135deg,var(--gold-bright),var(--gold));color:#1a120a;
  box-shadow:0 10px 30px -12px rgba(216,181,109,.6)}
.btn-gold:hover{transform:translateY(-3px);box-shadow:0 18px 40px -14px rgba(216,181,109,.75)}
.btn-line{border-color:var(--stage-line);color:var(--cream);background:rgba(247,241,234,.02)}
.btn-line:hover{border-color:var(--gold);color:var(--gold-bright);transform:translateY(-3px)}
.btn-ghost{border-color:var(--stage-line);color:var(--cream)}
.btn-ghost:hover{background:var(--gold);color:var(--stage-ink);border-color:var(--gold)}
.btn-text{color:var(--cream);padding-inline:.3rem}
.btn-text:hover{color:var(--gold-bright)}

/* ---------- Scroll progress ---------- */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:120;background:transparent;pointer-events:none}
.scroll-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--rose))}

/* ---------- Header ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;
  transition:background .35s,backdrop-filter .35s,border-color .35s;
  border-bottom:1px solid transparent}
.site-header.scrolled{background:rgba(17,10,19,.82);backdrop-filter:blur(14px);border-bottom-color:var(--stage-line-soft)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;height:74px}
.brand{display:flex;align-items:center;gap:.7rem;font-weight:600}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;
  background:radial-gradient(120% 120% at 50% 30%,#3a2436,#140d16);
  font-family:var(--font-display);color:var(--gold-bright);font-size:1rem;border:1px solid var(--stage-line)}
.brand-name{font-family:var(--font-display);font-size:1.15rem;letter-spacing:.01em}
.nav{display:flex;align-items:center;gap:2rem}
.nav a{font-size:.95rem;color:var(--cream-dim);position:relative;transition:color .25s}
.nav a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;
  background:var(--gold);transition:right .3s ease}
.nav a:not(.nav-cta):hover,.nav a.active{color:var(--cream)}
.nav a.active::after,.nav a:not(.nav-cta):hover::after{right:0}
.nav-cta{margin-left:.5rem}
.nav-toggle{display:none;flex-direction:column;gap:5px;width:42px;height:42px;border:1px solid var(--stage-line);
  border-radius:10px;background:rgba(247,241,234,.03);align-items:center;justify-content:center}
.nav-toggle span{width:20px;height:2px;background:var(--cream);transition:transform .3s,opacity .3s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;
  padding:7rem 0 4rem;overflow:hidden;isolation:isolate}
.hero-spotlight{position:absolute;inset:-20% -10% auto;height:120%;z-index:-2;
  background:
    radial-gradient(60% 55% at 62% 8%,rgba(231,201,136,.20),transparent 60%),
    radial-gradient(45% 50% at 20% 80%,rgba(122,31,53,.30),transparent 70%),
    radial-gradient(50% 60% at 85% 70%,rgba(217,166,161,.14),transparent 70%);
  animation:drift 18s ease-in-out infinite alternate}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;
  background:linear-gradient(180deg,#0d070f 0%,#150d17 40%,#110A13 100%)}
.hero-grain{position:absolute;inset:0;z-index:-1;opacity:.5;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.025) 1px,transparent 1px);background-size:3px 3px}
@keyframes drift{from{transform:translate3d(-2%,-1%,0) scale(1.02)}to{transform:translate3d(3%,2%,0) scale(1.08)}}

.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero-title{font-size:clamp(3.4rem,2rem + 8vw,7.5rem);font-weight:600;letter-spacing:-.025em;margin:.4rem 0 1.4rem}
.hero-title .accent{color:transparent;background:linear-gradient(120deg,var(--gold-bright),var(--rose));-webkit-background-clip:text;background-clip:text;font-style:italic;font-weight:500}
.hero-claim{font-family:var(--font-display);font-style:italic;font-size:clamp(1.2rem,1rem + 1vw,1.7rem);color:var(--rose);margin-bottom:1.2rem}
.hero-lead{color:var(--cream-dim);max-width:46ch;margin-bottom:2rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;margin-bottom:2.4rem}
.hero-badges{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem .6rem;padding:0;margin:0}
.hero-badges li{font-size:.78rem;letter-spacing:.04em;color:var(--cream-dim);
  border:1px solid var(--stage-line);border-radius:100px;padding:.4rem .9rem;background:rgba(247,241,234,.02)}

.hero-visual{position:relative;justify-self:center}
.portrait-frame{position:relative;width:min(360px,80vw);aspect-ratio:3/4;border-radius:18px;overflow:hidden;
  border:1px solid var(--stage-line);box-shadow:var(--shadow);
  transform:perspective(900px) rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg));
  transition:transform .3s ease}
.portrait-frame img{width:100%;height:100%;object-fit:cover}
.portrait-glow{position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 80px rgba(231,201,136,.18);border-radius:18px}
.float-card{position:absolute;background:rgba(24,16,27,.86);backdrop-filter:blur(10px);
  border:1px solid var(--stage-line);border-radius:12px;padding:.7rem 1rem;display:flex;flex-direction:column;
  box-shadow:0 20px 50px -25px rgba(0,0,0,.8)}
.float-card .fc-k{font-size:.68rem;text-transform:uppercase;letter-spacing:.18em;color:var(--gold)}
.float-card .fc-v{font-family:var(--font-display);font-size:1rem;color:var(--cream)}
.float-card--top{top:8%;left:-9%;animation:floaty 6s ease-in-out infinite}
.float-card--bottom{bottom:9%;right:-11%;animation:floaty 7s ease-in-out infinite reverse}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

.scroll-hint{position:absolute;bottom:1.6rem;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--cream-faint);
  font-size:.7rem;letter-spacing:.24em;text-transform:uppercase}
.scroll-hint i{width:1px;height:38px;background:linear-gradient(var(--gold),transparent);position:relative;overflow:hidden}
.scroll-hint i::after{content:"";position:absolute;top:-40%;left:0;width:100%;height:40%;background:var(--gold-bright);animation:scrolldot 2s ease-in-out infinite}
@keyframes scrolldot{0%{top:-40%}60%,100%{top:120%}}

/* ---------- Story ---------- */
.section--story{background:linear-gradient(180deg,var(--stage-ink),var(--stage-ink-2))}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.story-body p{color:var(--cream-dim)}
.story-body strong{color:var(--cream);font-weight:600}
.quickfacts{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:0;margin:3.5rem 0 0}
.quickfacts li{border-top:1px solid var(--stage-line);padding-top:1rem;display:flex;flex-direction:column;gap:.2rem}
.quickfacts b{font-family:var(--font-display);font-size:1.35rem;color:var(--gold-bright);font-weight:600}
.quickfacts span{font-size:.85rem;color:var(--cream-dim)}

/* ---------- Vita timeline ---------- */
.section--vita{background:var(--stage-ink-2)}
.timeline{list-style:none;margin:0;padding:0;position:relative;max-width:860px;margin-inline:auto}
.timeline::before{content:"";position:absolute;left:7.5rem;top:8px;bottom:8px;width:1px;
  background:linear-gradient(var(--stage-line),var(--gold),var(--stage-line))}
.tl-item{position:relative;display:grid;grid-template-columns:7.5rem 1fr;gap:1.8rem;padding:.7rem 0 2.2rem}
.tl-year{font-family:var(--font-display);font-size:1rem;color:var(--gold);text-align:right;padding-top:.9rem;font-weight:500}
.tl-card{position:relative;background:rgba(247,241,234,.025);border:1px solid var(--stage-line-soft);
  border-radius:12px;padding:1.1rem 1.4rem;transition:border-color .3s,transform .3s,background .3s}
.tl-card::before{content:"";position:absolute;left:-1.85rem;top:1.4rem;width:11px;height:11px;border-radius:50%;
  background:var(--stage-ink-2);border:2px solid var(--gold);box-shadow:0 0 0 4px var(--stage-ink-2)}
.tl-card:hover{border-color:var(--stage-line);transform:translateX(4px);background:rgba(247,241,234,.04)}
.tl-card h3{font-size:1.2rem;margin-bottom:.3rem}
.tl-card p{margin:0;color:var(--cream-dim);font-size:.95rem}
.tl-item--now .tl-card::before{background:var(--gold);box-shadow:0 0 0 4px var(--stage-ink-2),0 0 18px var(--gold)}
.vita-actions{text-align:center;margin-top:1rem}

/* ---------- Productions ---------- */
.section--prod{background:linear-gradient(180deg,var(--stage-ink-2),var(--stage-ink))}
.prod-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem}
.prod-card{display:flex;flex-direction:column;background:rgba(247,241,234,.025);border:1px solid var(--stage-line-soft);
  border-radius:var(--r);overflow:hidden;transition:transform .35s,border-color .35s,box-shadow .35s}
.prod-card:hover{transform:translateY(-6px);border-color:var(--stage-line);box-shadow:var(--shadow)}
.prod-media{position:relative;aspect-ratio:16/9;display:grid;place-items:center;overflow:hidden;
  background:linear-gradient(135deg,#2a1830,#160d18)}
.prod-media::before{content:attr(data-cat);font-family:var(--font-display);font-size:2.4rem;
  color:rgba(231,201,136,.13);letter-spacing:.04em;text-transform:uppercase}
.prod-media::after{content:"";position:absolute;inset:0;
  background:radial-gradient(80% 60% at 50% 0%,rgba(231,201,136,.16),transparent 70%)}
.prod-year{position:absolute;top:.9rem;right:1rem;z-index:2;font-size:.72rem;letter-spacing:.14em;
  background:rgba(17,10,19,.7);border:1px solid var(--stage-line);border-radius:100px;padding:.3rem .8rem;color:var(--gold-bright)}
.prod-body{padding:1.4rem 1.5rem 1.6rem;display:flex;flex-direction:column;gap:.55rem}
.prod-body h3{font-size:1.5rem}
.prod-role{color:var(--rose);font-style:italic;font-family:var(--font-display);margin:0}
.prod-role strong{font-style:normal;color:var(--gold-bright);font-weight:600}
.prod-meta{font-size:.78rem;letter-spacing:.02em;color:var(--cream-faint);margin:0;text-transform:uppercase}
.prod-body>p{color:var(--cream-dim);font-size:.95rem;margin:.2rem 0 0}
.prod-pieces{margin:.4rem 0 0;padding-left:1.1rem;color:var(--cream-dim);font-size:.9rem}
.prod-pieces li{margin-bottom:.2rem}
.prod-links{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.6rem}
.prod-links a{font-size:.85rem;color:var(--gold);border-bottom:1px solid var(--stage-line);padding-bottom:2px;transition:color .2s,border-color .2s}
.prod-links a:hover{color:var(--gold-bright);border-color:var(--gold)}
.todo-inline{color:var(--cream-faint);font-style:italic;font-size:.85em}

.roots{margin-top:2.6rem;border:1px solid var(--stage-line-soft);border-left:3px solid var(--gold);
  border-radius:12px;padding:1.6rem 1.8rem;background:rgba(122,31,53,.10)}
.roots-title{font-size:1.2rem;color:var(--cream);margin-bottom:.6rem}
.roots p{color:var(--cream-dim);margin-bottom:.8rem}
.roots-list{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.7rem}
.roots-list li{font-size:.9rem;color:var(--cream-dim);background:rgba(247,241,234,.04);border:1px solid var(--stage-line-soft);
  border-radius:100px;padding:.45rem 1rem}
.roots-list b{color:var(--gold-bright);font-weight:600}

/* ---------- Media / showreel ---------- */
.section--media{background:var(--stage-ink)}
.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.media-tile{position:relative;aspect-ratio:4/3;border-radius:var(--r);border:1px solid var(--stage-line-soft);
  background:linear-gradient(135deg,#1d1322,#130c16);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:.6rem;overflow:hidden;color:var(--cream);
  transition:transform .35s,border-color .35s}
.media-tile--wide{grid-column:span 3;aspect-ratio:21/7}
.media-tile::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 80% at 50% 30%,rgba(231,201,136,.12),transparent 70%);opacity:0;transition:opacity .35s}
.media-tile:hover{transform:translateY(-4px);border-color:var(--gold)}
.media-tile:hover::after{opacity:1}
.media-tile .play{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;
  background:rgba(231,201,136,.12);border:1px solid var(--gold);color:var(--gold-bright);transition:transform .35s,background .35s}
.media-tile:hover .play{transform:scale(1.08);background:rgba(231,201,136,.22)}
.media-tile .play::before{content:"";position:absolute;width:56px;height:56px;border-radius:50%;border:1px solid var(--gold);animation:pulse 2.4s ease-out infinite;opacity:0}
.media-tile--wide .play{width:64px;height:64px}
@keyframes pulse{0%{transform:scale(.9);opacity:.6}100%{transform:scale(1.7);opacity:0}}
.media-label{font-family:var(--font-display);font-size:1.15rem}
.media-soon{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);
  border:1px solid var(--stage-line);border-radius:100px;padding:.18rem .7rem}

/* ---------- Listen ---------- */
.section--listen{background:linear-gradient(180deg,var(--stage-ink),var(--stage-ink-2))}
.listen-wrap{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.listen-card{display:flex;gap:1.4rem;align-items:flex-start;background:rgba(247,241,234,.03);
  border:1px solid var(--stage-line);border-radius:18px;padding:1.5rem;box-shadow:var(--shadow)}
.listen-cover{flex:0 0 110px;width:110px;height:110px;border-radius:12px;display:grid;place-items:center;
  background:radial-gradient(120% 120% at 30% 20%,#7A1F35,#160d18);color:var(--gold-bright);font-size:2.4rem;
  border:1px solid var(--stage-line)}
.listen-track{font-family:var(--font-display);font-size:1.4rem;margin:0 0 .2rem}
.listen-album{font-size:.85rem;color:var(--cream-dim);margin:0 0 .9rem}
.listen-links{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:.8rem}
.listen-note{font-size:.78rem;color:var(--cream-faint);margin:0;font-style:italic}
/* Spotify 2-click consent player */
.spotify-embed{margin:.2rem 0 1rem;border:1px solid var(--stage-line);border-radius:12px;overflow:hidden;background:rgba(30,215,96,.06)}
.spotify-embed iframe{display:block;width:100%;border:0}
.spotify-load{display:flex;align-items:center;gap:.9rem;width:100%;text-align:left;background:transparent;border:0;padding:.85rem 1rem;color:var(--cream)}
.spotify-load:hover{background:rgba(30,215,96,.10)}
.sp-icon{display:grid;place-items:center;flex:0 0 auto;width:42px;height:42px;border-radius:50%;background:#1ed760;color:#06120a;font-size:1rem}
.sp-text{display:flex;flex-direction:column;line-height:1.3}
.sp-text b{font-size:.95rem}
.sp-text small{color:var(--cream-faint);font-size:.74rem}

/* Awards / highlights strip */
.awards{list-style:none;display:flex;flex-wrap:wrap;gap:.7rem;padding:0;margin:1.8rem 0 0}
.awards li{font-size:.85rem;color:var(--cream-dim);border:1px solid var(--stage-line);border-radius:100px;
  padding:.5rem 1.1rem;background:rgba(216,181,109,.07)}
.awards b{color:var(--gold-bright);font-weight:600}

/* Wide feature production card (e.g. LION) */
.prod-card--wide{grid-column:1/-1}
@media (min-width:721px){
  .prod-card--wide{flex-direction:row}
  .prod-card--wide .prod-media{flex:0 0 46%;aspect-ratio:16/10}
  .prod-card--wide .prod-body{justify-content:center;padding:2rem 2.4rem}
  .prod-card--wide h3{font-size:1.8rem}
}

/* ---------- Skills ---------- */
.section--skills{background:var(--stage-ink-2)}
.skills-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1.5rem,4vw,3rem);align-items:start}
.castingfacts{background:linear-gradient(160deg,rgba(247,241,234,.06),rgba(247,241,234,.02));
  border:1px solid var(--stage-line);border-radius:16px;padding:1.8rem;position:sticky;top:100px}
.castingfacts h3{font-size:1.3rem;color:var(--gold-bright);margin-bottom:1.1rem}
.castingfacts dl{margin:0 0 1.4rem;display:flex;flex-direction:column}
.castingfacts dl>div{display:flex;justify-content:space-between;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--stage-line-soft)}
.castingfacts dt{color:var(--cream-faint);font-size:.85rem;letter-spacing:.04em}
.castingfacts dd{margin:0;text-align:right;color:var(--cream);font-size:.9rem;font-weight:500}
.skillcards{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.skill-card{border:1px solid var(--stage-line-soft);border-radius:14px;padding:1.3rem 1.4rem;
  background:rgba(247,241,234,.02);transition:border-color .3s,transform .3s}
.skill-card:hover{border-color:var(--gold);transform:translateY(-4px)}
.skill-card h4{font-size:1.15rem;color:var(--gold-bright);margin-bottom:.4rem}
.skill-card p{margin:0;color:var(--cream-dim);font-size:.92rem;line-height:1.6}

/* ---------- Gallery ---------- */
.section--gallery{background:linear-gradient(180deg,var(--stage-ink-2),var(--stage-ink))}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:1rem}
.gallery-item{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--stage-line-soft);
  cursor:pointer;margin:0;background-size:cover;background-position:center;transition:transform .4s,border-color .4s}
.gallery-item::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#241531,#150d18)}
.gallery-item:nth-child(2n)::before{background:linear-gradient(135deg,#2a1622,#140d16)}
.gallery-item:nth-child(3n)::before{background:linear-gradient(160deg,#1c1430,#140d18)}
.gallery-item::after{content:attr(data-cat) " · Foto folgt";position:absolute;left:1rem;bottom:.9rem;z-index:2;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim);
  background:rgba(17,10,19,.55);border:1px solid var(--stage-line-soft);border-radius:100px;padding:.3rem .8rem;backdrop-filter:blur(4px)}
.gallery-item .ph-mark{position:absolute;inset:0;z-index:1;display:grid;place-items:center;
  font-family:var(--font-display);font-size:2.4rem;color:rgba(231,201,136,.16)}
.gallery-item:hover{transform:scale(.985);border-color:var(--gold)}
/* A gallery item that already holds a real photo needs none of the
   placeholder chrome (gradient, "Foto folgt" pill, monogram watermark). */
.gallery-item:has(img){cursor:default}
.gallery-item:has(img)::before,.gallery-item:has(img)::after{content:none}
.gallery-item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.g-tall{grid-row:span 2}
.g-wide{grid-column:span 2}

/* ---------- Press ---------- */
.section--press{background:var(--stage-ink)}
.press-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.press-card{display:flex;align-items:baseline;gap:.6rem;border:1px solid var(--stage-line-soft);border-radius:12px;
  padding:1.2rem 1.4rem;transition:border-color .3s,transform .3s,background .3s;background:rgba(247,241,234,.02)}
.press-card:hover{border-color:var(--gold);transform:translateY(-3px);background:rgba(247,241,234,.04)}
.press-k{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.press-v{font-family:var(--font-display);font-size:1.1rem;color:var(--cream);flex:1}
.press-go{color:var(--cream-faint);font-size:1.1rem}

/* ---------- Contact ---------- */
.section--contact{background:linear-gradient(180deg,var(--stage-ink),#0c060e)}
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.contact-direct{list-style:none;padding:0;margin:1.8rem 0 0;display:flex;flex-direction:column;gap:1rem}
.contact-direct li{display:flex;flex-direction:column;gap:.15rem;border-top:1px solid var(--stage-line-soft);padding-top:1rem}
.contact-direct span{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.contact-direct a{font-family:var(--font-display);font-size:1.2rem;color:var(--cream);transition:color .2s}
.contact-direct a:hover{color:var(--gold-bright)}

.contact-form{background:rgba(247,241,234,.03);border:1px solid var(--stage-line);border-radius:18px;padding:1.8rem;box-shadow:var(--shadow)}
.form-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.field{margin-bottom:1.1rem;display:flex;flex-direction:column;gap:.4rem}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.field label,.field-check span{font-size:.85rem;color:var(--cream-dim)}
.field input,.field select,.field textarea{width:100%;background:rgba(17,10,19,.6);border:1px solid var(--stage-line-soft);
  border-radius:10px;padding:.75rem .9rem;color:var(--cream);font-family:inherit;font-size:.95rem;transition:border-color .25s,background .25s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);background:rgba(17,10,19,.85)}
.field textarea{resize:vertical;min-height:110px}
.field-check{display:flex;gap:.7rem;align-items:flex-start;margin:.2rem 0 1.3rem;cursor:pointer}
.field-check input{margin-top:.25rem;accent-color:var(--gold);width:18px;height:18px;flex:0 0 auto}
.field-check a{color:var(--gold);text-decoration:underline}
.form-status{margin:.9rem 0 0;font-size:.9rem;min-height:1.2em}
.form-status.ok{color:var(--gold-bright)}
.form-status.err{color:var(--rose)}

/* ---------- Footer ---------- */
.site-footer{background:#0c060e;border-top:1px solid var(--stage-line-soft);padding:3.5rem 0 2rem}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:2rem;align-items:start}
.footer-brand .brand-mark{margin-bottom:.9rem}
.footer-name{font-family:var(--font-display);font-size:1.4rem;margin:0}
.footer-role{color:var(--cream-faint);font-size:.85rem;margin:.2rem 0 0}
.footer-nav,.footer-meta{display:flex;flex-direction:column;gap:.6rem;padding-top:.4rem}
.footer-nav a,.footer-meta a{color:var(--cream-dim);font-size:.92rem;transition:color .2s;width:fit-content}
.footer-nav a:hover,.footer-meta a:hover{color:var(--gold-bright)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;
  margin-top:2.6rem;padding-top:1.4rem;border-top:1px solid var(--stage-line-soft)}
.footer-bottom p{margin:0;color:var(--cream-faint);font-size:.85rem}
.footer-bottom nav{display:flex;gap:1.4rem}
.footer-bottom a{color:var(--cream-dim);font-size:.85rem;transition:color .2s}
.footer-bottom a:hover{color:var(--gold-bright)}

/* ---------- Lightbox ---------- */
.lightbox{position:fixed;inset:0;z-index:300;display:none;place-items:center;padding:5vw;
  background:rgba(8,4,9,.92);backdrop-filter:blur(8px)}
.lightbox.open{display:grid}
.lb-inner{width:min(680px,90vw);aspect-ratio:3/4;max-height:78vh;border-radius:16px;border:1px solid var(--stage-line);
  background:linear-gradient(135deg,#241531,#150d18);display:grid;place-items:center;
  font-family:var(--font-display);font-size:3rem;color:rgba(231,201,136,.2)}
.lb-caption{color:var(--cream-dim);margin:1rem 0 0;font-size:.9rem;letter-spacing:.06em}
.lb-close{position:fixed;top:1.4rem;right:1.6rem;width:46px;height:46px;border-radius:50%;
  border:1px solid var(--stage-line);background:rgba(24,16,27,.8);color:var(--cream);font-size:1.6rem;line-height:1}
.lb-close:hover{border-color:var(--gold);color:var(--gold-bright)}

/* ---------- Reveal animations (only when JS active) ---------- */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.3,1),transform .8s cubic-bezier(.2,.7,.3,1)}
.js .reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}
.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}
.reveal[data-d="4"]{transition-delay:.32s}
.reveal[data-d="5"]{transition-delay:.40s}
.reveal[data-d="6"]{transition-delay:.48s}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;text-align:center}
  .hero-cta,.hero-badges{justify-content:center}
  .hero-lead{margin-inline:auto}
  .hero-visual{order:-1;margin-bottom:1rem}
  .float-card--top{left:-2%}
  .float-card--bottom{right:-2%}
  .story-grid{grid-template-columns:1fr}
  .listen-wrap,.skills-layout,.contact-grid{grid-template-columns:1fr}
  .castingfacts{position:static}
  .prod-grid{grid-template-columns:1fr}
  .press-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .nav{position:fixed;inset:74px 0 auto;flex-direction:column;align-items:stretch;gap:0;
    background:rgba(13,8,15,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--stage-line-soft);
    padding:.5rem var(--pad) 1.5rem;transform:translateY(-130%);transition:transform .35s ease;height:auto}
  .nav.open{transform:translateY(0)}
  .nav a{padding:1rem 0;border-bottom:1px solid var(--stage-line-soft);color:var(--cream)}
  .nav-cta{margin:1rem 0 0;justify-content:center}
  .nav-toggle{display:flex}
  .quickfacts{grid-template-columns:1fr 1fr}
  .media-grid{grid-template-columns:1fr 1fr}
  .media-tile--wide{grid-column:span 2;aspect-ratio:16/8}
  .skillcards{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:1fr 1fr;grid-auto-rows:160px}
  .g-wide{grid-column:span 2}
  .press-grid,.footer-grid{grid-template-columns:1fr}
  .field-row{grid-template-columns:1fr}
  .timeline::before{left:5.2rem}
  .tl-item{grid-template-columns:5.2rem 1fr;gap:1.2rem}
}
@media (max-width:420px){
  .brand-name{display:none}
  .hero-title{font-size:clamp(3rem,14vw,4rem)}
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .reveal{opacity:1;transform:none}
  .hero-spotlight{animation:none}
}

/* ---------- No-JS safety ---------- */
.no-js .reveal{opacity:1;transform:none}

/* ---------- Legal pages ---------- */
.legal{padding:8rem 0 5rem;min-height:70vh}
.legal .container{max-width:760px}
.legal h1{font-size:clamp(2rem,1.5rem + 2vw,3rem);margin-bottom:1.5rem}
.legal h2{font-size:1.3rem;color:var(--gold-bright);margin:2.4rem 0 .7rem}
.legal p,.legal li{color:var(--cream-dim);font-size:.97rem}
.legal a{color:var(--gold);text-decoration:underline}
.legal a:hover{color:var(--gold-bright)}
.legal strong{color:var(--cream)}
.legal .back{display:inline-block;margin-bottom:2rem;color:var(--cream-dim);text-decoration:none}
.legal .back:hover{color:var(--gold-bright)}
.legal .todo{display:block;background:rgba(122,31,53,.18);border:1px solid var(--stage-line);border-left:3px solid var(--rose);
  border-radius:10px;padding:1rem 1.2rem;margin:1.5rem 0;color:var(--cream);font-size:.9rem}
.legal .todo b{color:var(--rose)}
.legal address{font-style:normal;color:var(--cream);line-height:1.8}

/* ---------- 404 ---------- */
.err-page{min-height:100svh;display:grid;place-items:center;text-align:center;padding:2rem;position:relative;overflow:hidden}
.err-page::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(60% 50% at 50% 30%,rgba(231,201,136,.14),transparent 60%),linear-gradient(180deg,#0d070f,#110A13)}
.err-code{font-family:var(--font-display);font-size:clamp(5rem,20vw,11rem);line-height:1;
  background:linear-gradient(120deg,var(--gold-bright),var(--rose));-webkit-background-clip:text;background-clip:text;color:transparent}
.err-page h1{font-size:1.6rem;margin:.5rem 0 1rem}
.err-page p{color:var(--cream-dim);margin-bottom:2rem}

/* The one-pager's hero must be full-bleed, not boxed inside the theme
   layout's default 1180px .wrap — only kicks in on the page that actually
   contains a .hero (the homepage), every other page keeps the normal
   constrained .wrap. */
.site-main .wrap:has(.hero) { max-width: none; padding: 0; }

/* ===================================================================
   Minimal one-pager layout (Sept 2026 redesign) — "less is more":
   full-bleed hero photo, narrow readable measure, hairline-divided work
   list instead of cards, unlabelled photo grid, single-CTA contact.
   =================================================================== */
.container--narrow{max-width:640px}
.container--narrow .eyebrow{margin-bottom:.6rem}
.container--narrow .section-title{margin-bottom:1.6rem}
.container--narrow .lead{margin-bottom:1rem}
.container--narrow > p{color:var(--cream-dim);max-width:60ch}
.container--narrow > p.lead{color:var(--cream)}

/* Hero — full-bleed real photo, text pinned bottom-left over a scrim. */
.hero--minimal{min-height:100svh;padding:0;display:block}
.hero--minimal::before,.hero--minimal .hero-spotlight,.hero--minimal .hero-grain{display:none}
.hero-photo{position:absolute;inset:0;z-index:-2}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.hero--minimal::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(0deg,rgba(9,6,12,.92) 0%,rgba(9,6,12,.55) 42%,rgba(9,6,12,.08) 68%)}
.hero-copy-minimal{position:relative;max-width:var(--container);margin-inline:auto;padding:var(--pad);
  min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:clamp(2.5rem,6vw,5rem)}
.hero-copy-minimal .hero-cta{margin-bottom:0}

/* Fact line — a single quiet row instead of a badge cluster. */
.factline{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;padding:0;margin:1.6rem 0 0;
  font-size:.82rem;letter-spacing:.03em;color:var(--cream-dim);border-top:1px solid var(--stage-line-soft);padding-top:1.2rem}

/* Work list — hairline rows, no card chrome. */
.work-list{margin-top:2rem}
.work-item{padding:1.6rem 0;border-top:1px solid var(--stage-line-soft)}
.work-list .work-item:last-child{border-bottom:1px solid var(--stage-line-soft)}
.work-item__head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.work-item__head h3{font-family:var(--font-display);font-size:clamp(1.2rem,1rem + .8vw,1.6rem);font-weight:500}
.work-item__year{font-size:.78rem;letter-spacing:.08em;color:var(--gold);white-space:nowrap}
.work-item__role{color:var(--cream-dim);margin:.35rem 0 .5rem}
.work-item p{margin:0 0 .3rem;font-size:.92rem;color:var(--cream-dim)}
.work-item p:last-child{margin-bottom:0}
.listen-note{margin-top:1.8rem;font-size:.88rem;color:var(--cream-dim)}
.listen-note a{color:var(--gold);text-decoration:underline;text-underline-offset:2px}

/* Gallery — plain, unlabelled photo grid; only ever holds real photos. */
.section--gallery-minimal{background:none;padding:0}
.gallery-grid--minimal{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:min(70vh,560px);gap:2px}
.gallery-grid--minimal .gallery-item{position:relative;border-radius:0;border:none;margin:0;cursor:default}
.gallery-grid--minimal .gallery-item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gallery-grid--minimal .gallery-item::before,.gallery-grid--minimal .gallery-item::after{content:none}

/* Contact — centered, single CTA row, no form. */
.contact-minimal{text-align:center}
.contact-minimal .lead{max-width:52ch;margin-inline:auto}
.contact-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem;margin-top:1.8rem}

@media (max-width:760px){
  .gallery-grid--minimal{grid-template-columns:repeat(2,1fr);grid-auto-rows:min(60vh,380px)}
}

/* Vita & Skills — compact two-column facts, no cards, just hairlines. */
.vita-skills{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);margin-top:2rem}
.vita-skills h3{font-family:var(--font-display);font-weight:500;font-size:1.1rem;margin-bottom:.9rem;color:var(--cream)}
.fact-rows{display:grid;gap:0}
.fact-row{padding:.85rem 0;border-top:1px solid var(--stage-line-soft);display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem}
.fact-rows .fact-row:last-child{border-bottom:1px solid var(--stage-line-soft)}
.fact-row dt{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.fact-row dd{margin:0;font-size:.92rem;color:var(--cream-dim);grid-column:1/-1}
@media (min-width:560px){
  .fact-row{grid-template-columns:9rem 1fr}
  .fact-row dd{grid-column:auto}
}
@media (max-width:680px){
  .vita-skills{grid-template-columns:1fr;gap:2rem}
}

/* Wider narrow-container variant, used only where the two-column Vita &
   Skills grid needs a bit more room than the single-column prose sections. */
.container--medium{max-width:820px}
.container--medium .eyebrow{margin-bottom:.6rem}

/* Press quote — a single understated pull-quote, not a boxed testimonial card. */
.press-quote{margin:1.8rem 0 0;padding-left:1.1rem;border-left:2px solid var(--gold)}
.press-quote p{margin:0;font-family:var(--font-display);font-style:italic;font-size:1.05rem;color:var(--cream)}
.press-quote cite{font-style:normal;color:var(--cream-dim);font-size:.85rem}