/* Color tokens applied to the public portfolio from Settings. */
:root{--contact-bg:#ded3bc;--contact-ink:#23261d;--contact-accent:#71512b}
body{background:var(--bg);color:var(--ink)}
/* Section backgrounds: every section paints its own --section-bg (the page black unless the editor sets one;
   the contact panel uses its own palette colour). Seams between sections are drawn by section-blend.js. */
.cinematic-hero,.cinematic-watch,.cinematic-about,.cinematic-gallery,.cinematic-credits{--section-bg:var(--bg)}
.cinematic-contact{--section-bg:var(--contact-bg)}
.cinematic-about,.cinematic-gallery,.cinematic-credits,.cinematic-contact{background:var(--section-bg)}
.watch-section.cinematic-watch{background:transparent}
.cinematic-watch::before{background:linear-gradient(transparent,var(--section-bg) 23vh)}
.section-light{--ink:#17150f;--muted:#5b554b;--line:#d2c9b7;color:var(--ink)}
/* Sections are styled with fixed light-on-dark text colours; a light background chosen in the editor
   switches every text role in that section to readable dark ink (accents to a deep gold). */
.section-light :is(h1,h2,h3,h4,p,li,dt,blockquote,figcaption,.lead,.credit-title,.credit-title a,.channel-title,.text-link){color:var(--ink)!important}
.section-light :is(p:not(.lead):not(.eyebrow),dd,small,.credit-role,.credit-director,.format,.muted){color:var(--muted)!important}
.section-light :is(.eyebrow,h2 em,h3 em,.text-link span){color:#7a5718!important}
.section-light :is(.text-link,.credit-row){border-color:var(--line)!important}
.site-header .main-nav a{text-shadow:0 1px 6px rgba(8,8,8,.6)}
.section-seams{position:absolute;left:0;top:0;width:100%;height:0;z-index:30;pointer-events:none}
.section-seam{position:absolute;left:0;width:100%;pointer-events:none}
.section-seam::before{content:'';position:absolute;inset:0;-webkit-backdrop-filter:blur(var(--section-blend-blur,6px));backdrop-filter:blur(var(--section-blend-blur,6px));-webkit-mask-image:linear-gradient(180deg,transparent,#000 38%,#000 62%,transparent);mask-image:linear-gradient(180deg,transparent,#000 38%,#000 62%,transparent)}
.section-seam::after{content:'';position:absolute;inset:0;background:var(--seam-gradient,none)}
.cinema-active .section-seams{display:none}
.site-header nav a,.opening-note,.opening-bottom,.credit-row,.gallery-image span{color:var(--muted)}
.opening-shade{background:linear-gradient(90deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 95%,transparent) 19%,color-mix(in srgb,var(--bg) 35%,transparent) 40%,transparent 63%),linear-gradient(0deg,var(--bg),transparent 19%)}
.cinematic-credits .credit-row::before{background:color-mix(in srgb,var(--surface) 78%,var(--bg))}
.cinematic-contact{color:var(--contact-ink)}
.cinematic-contact .contact-portrait{background:transparent}
.cinematic-contact .contact-portrait::after{background:linear-gradient(180deg,var(--section-bg),transparent 18%,transparent 78%,var(--section-bg))}
.cinematic-contact .contact-copy .eyebrow{color:var(--contact-accent)}
.cinematic-contact h2 em{color:var(--contact-accent)}
.cinematic-contact .contact-copy>p:not(.eyebrow){color:color-mix(in srgb,var(--contact-ink) 72%,var(--contact-bg))}
.cinematic-contact .contact-button{background:var(--contact-ink);color:var(--contact-bg)}
.cinematic-contact .email-line .quiet-link{color:color-mix(in srgb,var(--contact-ink) 72%,var(--contact-bg))}
footer.wrap{color:var(--ink)}
