:root{--bg:#efe8da;--paper:#f8f2e8;--ink:#201a16;--muted:#6f6358;--line:rgba(48,36,27,.16);--gold:#9b744a;--dark:#171310;--dark2:#29211b;--serif:"IBM Plex Sans Condensed","Arial Narrow",Arial,sans-serif;--display:"Cormorant Garamond",Georgia,serif;--sans:"Inter Tight",Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:linear-gradient(180deg,#f7f1e7,var(--bg));color:var(--ink);font-family:var(--sans);line-height:1.55;-webkit-font-smoothing:antialiased}a{color:inherit}.skip{position:fixed;left:12px;top:12px;transform:translateY(-160%);background:#fff;padding:10px 14px;z-index:999}.skip:focus{transform:none}.header{position:sticky;top:0;z-index:50;min-height:78px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;gap:24px;background:rgba(247,241,231,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{width:40px;height:40px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;font:600 1rem var(--serif);letter-spacing:.08em}.brand span:last-child{display:grid;line-height:1}.brand strong{font:600 1.25rem var(--serif);letter-spacing:.02em}.brand small{margin-top:5px;text-transform:uppercase;letter-spacing:.16em;font-size:.58rem;color:var(--muted)}.nav{display:flex;gap:24px;align-items:center}.nav a{text-decoration:none;font-family:var(--serif);font-size:.94rem;font-weight:500;letter-spacing:.035em;color:var(--muted)}.nav a:hover,.nav a.active{color:var(--ink)}.menu{display:none;border:1px solid var(--line);background:transparent;padding:10px 13px}.hero{min-height:calc(100vh - 78px);padding:8vw 7vw;display:grid;grid-template-columns:1.1fr .9fr;gap:8vw;align-items:center;overflow:hidden}.eyebrow{margin:0 0 16px;text-transform:uppercase;letter-spacing:.18em;font-size:.66rem;font-weight:600;color:var(--gold)}h1,h2,h3,blockquote{font-family:var(--serif);font-weight:500}h1{font-size:clamp(3.7rem,7vw,6.5rem);line-height:.9;letter-spacing:-.018em;margin:0;max-width:800px}h1 em{font-style:normal;color:var(--gold)}.lede{max-width:680px;font-size:1.03rem;color:var(--muted);margin:28px 0 0}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}.button{min-height:48px;padding:0 20px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;text-transform:uppercase;letter-spacing:.09em;font-family:var(--serif);font-size:.78rem;font-weight:600;border:1px solid transparent;cursor:pointer}.button.primary{background:var(--dark);color:#f6efe3}.button.ghost{border-color:var(--line)}.hero-art{min-height:520px;position:relative}.disc{position:absolute;width:min(430px,80%);aspect-ratio:1;border-radius:50%;right:3%;top:0;background:repeating-radial-gradient(circle,#30261f 0 3px,#211a15 4px 7px);box-shadow:0 30px 80px rgba(35,24,16,.2);display:grid;place-items:center;color:rgba(240,224,196,.62);font:500 1.8rem var(--serif);letter-spacing:.35em}.disc:after{content:"";width:26%;aspect-ratio:1;border-radius:50%;background:#b18b5f;border:10px solid #1b1511;position:absolute}.paper{position:absolute;left:3%;bottom:5%;width:72%;padding:30px;background:#dcc7a5;box-shadow:0 22px 50px rgba(39,27,18,.18);transform:rotate(-3deg)}.paper b{font:500 1.5rem var(--serif)}.paper p{margin:8px 0 0;color:#594939}.section{padding:104px 7vw}.section-head{max-width:900px;margin-bottom:48px}.section h2,.contact h2{font-size:clamp(2.8rem,5vw,4.9rem);line-height:.96;letter-spacing:-.014em;margin:0}.three-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{padding:34px;border:1px solid var(--line);background:rgba(255,255,255,.28);min-height:290px}.card>span{color:var(--gold);font:500 1.1rem var(--serif)}.card h3,.archive-list h3{font-size:2rem;margin:70px 0 8px}.card p,.archive-list p{color:var(--muted);margin:0}.dark{background:var(--dark);color:#f3eadf}.dark .muted,.dark .eyebrow{color:#b8a893}.split{display:grid;grid-template-columns:1fr .8fr;gap:8vw;align-items:end}.muted{color:var(--muted)}.feature-strip{margin-top:50px;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(255,255,255,.16)}.feature-strip>div{padding:32px;border-right:1px solid rgba(255,255,255,.16)}.feature-strip>div:last-child{border-right:0}.feature-strip small,.shelf-card small{display:block;text-transform:uppercase;letter-spacing:.13em;font-size:.62rem;color:var(--gold);margin-bottom:6px}.feature-strip strong,.shelf-card strong{font:500 1.8rem var(--serif)}.vintage-teaser{background:#ded0b7}.text-link{display:inline-block;margin-top:20px;font-weight:700;text-decoration:none}.archive-shelf{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:52px}.shelf-card{min-height:180px;padding:28px;background:rgba(248,241,228,.5);border:1px solid rgba(70,52,38,.15);display:flex;flex-direction:column;justify-content:flex-end}.journal{text-align:center;background:repeating-linear-gradient(0deg,rgba(255,255,255,.12) 0 28px,rgba(57,43,30,.06) 29px 30px)}blockquote{max-width:980px;margin:20px auto;font-size:clamp(3rem,7vw,6.4rem);line-height:.92;color:#49382c}.signoff{color:var(--muted)}.contact{display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw;background:var(--dark2);color:#f3eadf}.contact .muted{color:#bfae9c}.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}.contact-form label{display:grid;gap:7px;font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:#cab9a6}.contact-form label:nth-of-type(4),.contact-form label:nth-of-type(5){grid-column:1/-1}.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#f6eee3;padding:14px;font:inherit;outline:none}.contact-form select option{color:#111}.contact-form textarea{min-height:150px;resize:vertical}.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{border-color:#b99466}.hp{position:absolute!important;left:-9999px!important}.form-status{grid-column:1/-1;min-height:1.5em;margin:0;color:#cbbba8}.footer{padding:34px 5vw 46px;display:grid;grid-template-columns:1fr auto;gap:18px;border-top:1px solid var(--line);color:var(--muted)}.footer>div:first-child{display:grid}.footer strong{font:600 1.25rem var(--serif);color:var(--ink)}.footer-links{display:flex;gap:20px;flex-wrap:wrap}.footer-links a{text-decoration:none}.footer small{grid-column:1/-1}.vintage-hero{padding:120px 7vw 90px;max-width:1200px}.vintage-hero h1{max-width:980px}.archive-list{border-top:1px solid var(--line)}.archive-list article{display:grid;grid-template-columns:100px 1fr;gap:28px;padding:32px 0;border-bottom:1px solid var(--line)}.archive-list article>span{font:500 2rem var(--serif);color:var(--gold)}.archive-list h3{margin:0 0 8px}.archive-list small{display:block;margin-top:10px;color:var(--gold)}
@media(max-width:900px){.menu{display:block}.nav{display:none;position:absolute;top:78px;left:0;right:0;padding:22px 5vw;background:#f7f1e7;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start}.nav.open,.nav.always{display:flex}.nav.always{position:static;padding:0;background:transparent;border:0;flex-direction:row}.hero{grid-template-columns:1fr;padding-top:80px}.hero-art{min-height:420px}.three-grid,.feature-strip,.archive-shelf{grid-template-columns:1fr}.feature-strip>div{border-right:0;border-bottom:1px solid rgba(255,255,255,.16)}.feature-strip>div:last-child{border-bottom:0}.split,.contact{grid-template-columns:1fr}.contact-form{grid-template-columns:1fr}.contact-form label{grid-column:1/-1}.footer{grid-template-columns:1fr}.footer-links{justify-content:flex-start}}@media(max-width:560px){.header{padding:0 20px}.brand strong{font-size:1.05rem}.hero,.section,.vintage-hero{padding-left:22px;padding-right:22px}h1{font-size:clamp(3.5rem,18vw,5rem)}.hero-art{min-height:330px}.paper{width:84%;padding:22px}.archive-list article{grid-template-columns:52px 1fr}.nav.always a:nth-child(1){display:none}}

.media{background:rgba(255,255,255,.18)}
.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.media-card{min-height:250px;padding:30px;border:1px solid var(--line);background:rgba(248,242,232,.42)}
.media-card>span{display:block;color:var(--gold);text-transform:uppercase;letter-spacing:.12em;font:500 .72rem var(--serif)}
.media-card h3{font-size:2rem;line-height:1;margin:70px 0 10px}
.media-card p{margin:0;color:var(--muted)}
@media(max-width:900px){.media-grid{grid-template-columns:1fr}}

.memory-display{font-family:var(--display)!important;font-weight:500!important;letter-spacing:-.028em!important}
h1 .memory-display{font-style:italic;font-weight:600!important}
.latest-strip{padding:18px 7vw;display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.25)}
.latest-strip p{margin:0 0 3px}.latest-strip strong{font:500 1.18rem var(--serif)}.latest-strip a{text-decoration:none;font:500 .9rem var(--serif);letter-spacing:.04em}
.featured-song{margin-top:28px;border:1px solid rgba(255,255,255,.16);padding:32px;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;background:rgba(255,255,255,.03)}
.featured-song h3{font-size:clamp(2.2rem,4vw,4rem);line-height:.95;margin:0 0 14px;color:#f1e6d8}
.audio-button{min-height:48px;padding:0 20px;border:1px solid rgba(255,255,255,.22);background:transparent;color:#c7b7a5;font:500 .82rem var(--serif);letter-spacing:.06em}
.audio-button:not(:disabled){cursor:pointer;color:#f3eadf}
.photo-grid,.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.photo-placeholder,.video-card{min-height:260px;padding:30px;border:1px solid var(--line);display:flex;flex-direction:column;justify-content:flex-end}
.photo-placeholder{background:linear-gradient(145deg,rgba(216,196,166,.45),rgba(248,242,232,.72))}
.photo-placeholder span,.video-card small{display:block;margin-bottom:auto;color:var(--gold);text-transform:uppercase;letter-spacing:.13em;font:500 .7rem var(--serif)}
.photo-placeholder strong,.video-card strong{font:500 2rem/1 var(--serif);margin-bottom:10px}
.photo-placeholder p,.video-card p{margin:0;color:var(--muted)}
.video-grid .video-card{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.025)}
.video-grid .video-card p{color:#b8a893}
.press{background:#e8ddcb}
.update-pop{position:fixed;right:24px;bottom:24px;z-index:80;width:min(330px,calc(100vw - 48px));padding:22px 48px 20px 22px;background:#171310;color:#f3eadf;border:1px solid rgba(255,255,255,.16);box-shadow:0 20px 60px rgba(27,19,14,.28)}
.update-pop small{display:block;text-transform:uppercase;letter-spacing:.13em;color:#b8a893;margin-bottom:5px}
.update-pop strong{display:block;font:500 1.55rem var(--display);margin-bottom:9px}
.update-pop a{color:#d2b18a;text-decoration:none;font-size:.85rem}
.update-close{position:absolute;top:10px;right:12px;border:0;background:transparent;color:#b8a893;font-size:1.5rem;cursor:pointer}
@media(max-width:900px){.photo-grid,.video-grid{grid-template-columns:1fr}.featured-song{grid-template-columns:1fr}.latest-strip{align-items:flex-start;flex-direction:column;gap:8px}}

.latest-home{background:rgba(255,255,255,.22)}
.section-head.compact{margin-bottom:26px}
.latest-grid,.publication-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.latest-card,.publication-card{min-height:220px;padding:26px;border:1px solid var(--line);background:rgba(248,242,232,.5);display:flex;flex-direction:column;text-decoration:none;color:inherit}
.latest-card small,.publication-card small{color:var(--gold);text-transform:uppercase;letter-spacing:.12em;font:500 .72rem var(--serif)}
.latest-card strong,.publication-card strong{font:500 1.8rem/1.02 var(--serif);margin:52px 0 12px}
.latest-card span{margin-top:auto;color:var(--muted);font:.86rem var(--sans)}
.publication-card p{margin:0;color:var(--muted)}
@media(max-width:900px){.latest-grid,.publication-grid{grid-template-columns:1fr}}

.social-section{background:rgba(255,255,255,.16)}
.social-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.social-card{min-height:250px;padding:26px;border:1px solid var(--line);display:flex;flex-direction:column;text-decoration:none;color:inherit;background:rgba(248,242,232,.48)}
.social-card small{color:var(--gold);text-transform:uppercase;letter-spacing:.11em;font:500 .7rem var(--serif)}
.social-card strong{font:500 1.85rem/1 var(--serif);margin:58px 0 10px}
.social-card p{margin:0;color:var(--muted)}
.social-card span{margin-top:auto;padding-top:20px;color:var(--muted);font:.82rem var(--sans)}
.social-card.live{transition:transform .2s ease,background .2s ease}
.social-card.live:hover{transform:translateY(-3px);background:rgba(248,242,232,.72)}
.social-card.pending{opacity:.72}
.update-actions{display:flex;gap:12px;flex-wrap:wrap}
.update-actions a{display:inline-block}
.ambient-control{position:fixed;left:18px;bottom:18px;z-index:85;display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid rgba(255,255,255,.14);background:rgba(23,19,16,.9);color:#f3eadf;backdrop-filter:blur(12px);box-shadow:0 12px 35px rgba(27,19,14,.2)}
.ambient-control button{border:0;background:transparent;color:#d2b18a;font:500 .8rem var(--serif);cursor:pointer}
.ambient-control span{font:.76rem var(--sans);color:#b8a893}
@media(max-width:1000px){.social-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.social-grid{grid-template-columns:1fr}.ambient-control{left:12px;right:12px;bottom:12px;justify-content:space-between}}

.now-playing{
  position:fixed;left:18px;bottom:76px;z-index:90;
  width:min(330px,calc(100vw - 36px));padding:18px 42px 17px 18px;
  background:rgba(23,19,16,.94);color:#f3eadf;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 48px rgba(27,19,14,.24);
  backdrop-filter:blur(14px);
  transition:opacity .8s ease,transform .8s ease;
}
.now-playing small{display:block;color:#b8a893;text-transform:uppercase;letter-spacing:.13em;font:500 .68rem var(--serif);margin-bottom:5px}
.now-playing strong{display:block;font:500 1.45rem/1.02 var(--display);margin-bottom:5px}
.now-playing span{font:.76rem var(--sans);color:#b8a893}
.now-playing-close{position:absolute;top:8px;right:10px;border:0;background:transparent;color:#b8a893;font-size:1.35rem;cursor:pointer}
.now-playing.fade-out{opacity:0;transform:translateY(8px)}
.ambient-control{opacity:.86}
@media(max-width:640px){.now-playing{left:12px;bottom:72px;width:calc(100vw - 24px)}}


/* ===== redesign layer ===== */
/*
  Voice of Harisha — public website visual redesign layer
  Scope: typography, colour, spacing, cards, section moods, responsive polish.
  Safety: no audio/video/source/track/iframe selectors and no JS behavior changes.
  Load AFTER the existing styles.css.
*/

:root{
  --voh-ivory:#F4EEDF;
  --voh-cream:#E9DFC9;
  --voh-paper:#F1E8D6;
  --voh-paper-deep:#E5D7BC;
  --voh-soft-black:#171513;
  --voh-charcoal:#24211F;
  --voh-charcoal-deep:#1D1A18;
  --voh-brown:#3A2B24;
  --voh-brown-deep:#46362A;
  --voh-gold:#B79A63;
  --voh-gold-muted:#947C52;
  --voh-wine:#633D3C;
  --voh-text:#29231F;
  --voh-text-soft:#705F53;
  --voh-text-on-dark:#EDE5D5;
  --voh-text-on-dark-soft:#BEB3A6;
  --voh-line:rgba(59,43,33,.16);
  --voh-line-dark:rgba(237,229,213,.14);
  --voh-shadow:0 22px 70px rgba(41,30,23,.10);
  --voh-radius:2px;
  --voh-display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --voh-ml-display:"Gayathri","Noto Sans Malayalam",sans-serif;
  --voh-body:"Manrope","Inter Tight",Arial,sans-serif;
  --voh-ml-body:"Noto Sans Malayalam","Manrope",sans-serif;
}

html{scroll-padding-top:88px;background:var(--voh-soft-black)}
body{
  background:var(--voh-ivory);
  color:var(--voh-text);
  font-family:var(--voh-body);
  font-size:16px;
  line-height:1.7;
  letter-spacing:-.005em;
}
body:lang(ml), [lang="ml"]{font-family:var(--voh-ml-body)}
::selection{background:rgba(183,154,99,.28);color:var(--voh-text)}

/* Typography DNA */
h1,h2,h3,h4,blockquote,.memory-display,.featured-song h3,.latest-card strong,.publication-card strong,.social-card strong,.video-card strong,.photo-placeholder strong,.shelf-card strong,.feature-strip strong,.brand strong,.footer strong{
  font-family:var(--voh-display);
  font-weight:500;
  text-wrap:balance;
}
[lang="ml"] h1,[lang="ml"] h2,[lang="ml"] h3,h1[lang="ml"],h2[lang="ml"],h3[lang="ml"],.malayalam-display{
  font-family:var(--voh-ml-display)!important;
  font-weight:400!important;
  letter-spacing:0!important;
  line-height:1.34!important;
}
h1{font-size:clamp(4rem,7.2vw,7.1rem);line-height:.91;letter-spacing:-.036em}
.section h2,.contact h2{font-size:clamp(3.05rem,5.35vw,5.45rem);line-height:.94;letter-spacing:-.03em}
.card h3,.archive-list h3{font-size:clamp(2rem,3vw,2.65rem);line-height:1}
.lede,.muted,.card p,.archive-list p,.photo-placeholder p,.video-card p,.publication-card p,.social-card p{font-family:var(--voh-body)}
.eyebrow,.nav a,.button,.brand small,.feature-strip small,.shelf-card small,.latest-card small,.publication-card small,.social-card small,.video-card small,.photo-placeholder span,.contact-form label,.now-playing small,.update-pop small{
  font-family:var(--voh-body);
  font-weight:600;
  letter-spacing:.13em;
}
.eyebrow{font-size:.67rem;color:var(--voh-gold-muted);margin-bottom:18px}
.lede{font-size:clamp(1rem,1.25vw,1.12rem);line-height:1.75;max-width:640px}

/* Header / navigation */
.header{
  min-height:80px;
  padding-inline:clamp(22px,5vw,76px);
  background:rgba(244,238,223,.88);
  border-bottom:1px solid rgba(58,43,36,.11);
  backdrop-filter:blur(20px) saturate(105%);
}
.brand{gap:14px}
.brand-mark{
  width:42px;height:42px;
  border-color:rgba(148,124,82,.72);
  color:var(--voh-brown-deep);
  font-family:var(--voh-display);
  font-size:1.03rem;
  letter-spacing:.08em;
}
.brand strong{font-size:1.3rem;letter-spacing:.005em;color:var(--voh-text)}
.brand small{font-size:.56rem;color:#75695d;margin-top:6px}
.nav{gap:clamp(16px,1.7vw,28px)}
.nav a{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#71665c;position:relative}
.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:1px;background:var(--voh-gold);transition:right .22s ease}
.nav a:hover:after,.nav a.active:after{right:0}
.nav a:hover,.nav a.active{color:var(--voh-text)}
.menu{font:600 .72rem var(--voh-body);text-transform:uppercase;letter-spacing:.1em;color:var(--voh-text);border-color:var(--voh-line)}

/* Home opening */
.hero{
  min-height:calc(100svh - 80px);
  padding:clamp(86px,9vw,142px) clamp(22px,7vw,112px);
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);
  gap:clamp(50px,8vw,130px);
  background:
    radial-gradient(circle at 88% 18%,rgba(99,61,60,.105),transparent 28%),
    radial-gradient(circle at 8% 82%,rgba(183,154,99,.09),transparent 30%),
    var(--voh-ivory);
}
.hero-copy{position:relative;z-index:2}
.hero h1 em{color:var(--voh-wine)}
.hero .lede{color:#665b51;margin-top:32px}
.actions{margin-top:38px;gap:14px}
.button{min-height:48px;padding-inline:22px;font-size:.69rem;letter-spacing:.11em;border-radius:var(--voh-radius)}
.button.primary{background:var(--voh-charcoal);color:var(--voh-text-on-dark)}
.button.primary:hover{background:#11100f}
.button.ghost{border-color:rgba(58,43,36,.22);color:var(--voh-text)}
.button.ghost:hover{border-color:var(--voh-gold-muted);background:rgba(255,255,255,.22)}
.hero-art{min-height:520px;opacity:.92}
.disc{box-shadow:0 34px 100px rgba(39,28,21,.15);filter:saturate(.76)}
.paper{background:#ddccb0;box-shadow:var(--voh-shadow);color:var(--voh-brown-deep)}
.paper b{font-family:var(--voh-display);font-size:1.65rem}

/* Shared section rhythm */
.section{padding:clamp(86px,8vw,132px) clamp(22px,7vw,112px)}
.section-head{max-width:940px;margin-bottom:clamp(38px,4vw,60px)}
.section-head.compact{max-width:760px;margin-bottom:32px}
.split{gap:clamp(48px,8vw,126px)}
.muted{color:var(--voh-text-soft)}

/* Latest — quieter editorial strip */
.latest-home{background:#EFE7D8;border-top:1px solid rgba(59,43,33,.07);border-bottom:1px solid rgba(59,43,33,.08)}
.latest-home .section-head.compact h2{font-size:clamp(2.45rem,4vw,4rem);line-height:.98}
.latest-grid{gap:0;border-top:1px solid var(--voh-line);border-bottom:1px solid var(--voh-line)}
.latest-card{
  min-height:190px;padding:30px 32px;
  border:0;border-right:1px solid var(--voh-line);
  background:transparent;
}
.latest-card:last-child{border-right:0}
.latest-card strong{font-size:clamp(1.65rem,2.2vw,2.25rem);margin:44px 0 14px;line-height:1.02}
.latest-card span{font-size:.8rem;color:#776a5f}
.latest-card:hover{background:rgba(255,255,255,.22)}

/* About — typography and whitespace instead of card boxes */
#about{background:var(--voh-ivory)}
#about .three-grid{gap:0;border-top:1px solid var(--voh-line);border-bottom:1px solid var(--voh-line)}
#about .card{
  min-height:330px;padding:38px clamp(28px,3vw,46px);
  border:0;border-right:1px solid var(--voh-line);background:transparent;
}
#about .card:last-child{border-right:0}
#about .card>span{font-family:var(--voh-display);font-size:1.05rem;color:var(--voh-gold-muted)}
#about .card h3{margin:94px 0 14px}
#about .card p{color:#6e6258;max-width:34ch}

/* Music — deep performance mood */
#music{
  background:
    radial-gradient(circle at 14% 18%,rgba(183,154,99,.07),transparent 28%),
    linear-gradient(180deg,#201c19 0%,#171513 100%);
  color:var(--voh-text-on-dark);
}
#music .eyebrow{color:#b9a277}
#music .muted{color:var(--voh-text-on-dark-soft)}
#music .feature-strip{border-color:var(--voh-line-dark);margin-top:58px}
#music .feature-strip>div{padding:36px;border-color:var(--voh-line-dark);background:rgba(255,255,255,.012)}
#music .feature-strip strong{font-size:2rem;color:#efe5d5}
#music .featured-song{margin-top:30px;padding:36px;border-color:var(--voh-line-dark);background:rgba(255,255,255,.018)}
#music .featured-song h3{color:#efe5d5}

/* Public Vintage teaser — memory, not whole-site sepia */
.vintage-teaser{background:var(--voh-paper-deep);color:#352a23}
.vintage-teaser .muted{color:#68594d}
.archive-shelf{gap:0;border-top:1px solid rgba(70,52,38,.14);border-bottom:1px solid rgba(70,52,38,.14)}
.shelf-card{min-height:198px;padding:32px;border:0;border-right:1px solid rgba(70,52,38,.14);background:rgba(255,255,255,.1)}
.shelf-card:last-child{border-right:0}
.shelf-card strong{font-size:2rem;color:#3b2d25}
.text-link{font-family:var(--voh-body);font-size:.78rem;letter-spacing:.06em;color:#59473b}

/* Journal — light editorial paper */
.journal{
  background:
    linear-gradient(rgba(241,232,214,.95),rgba(241,232,214,.95)),
    repeating-linear-gradient(0deg,transparent 0 31px,rgba(85,63,47,.07) 32px 33px);
  padding-top:clamp(106px,10vw,170px);padding-bottom:clamp(106px,10vw,170px);
}
.journal blockquote{max-width:1000px;color:#4c382f;font-size:clamp(3.2rem,6.6vw,6.5rem);line-height:.94;letter-spacing:-.025em}
.journal .signoff{font-family:var(--voh-body);font-size:.78rem;letter-spacing:.04em;color:#796b5e}

/* Photos — neutral warm breathing space */
#photos{background:#F3EDE2}
.photo-grid{grid-template-columns:1.3fr .85fr .85fr;gap:16px}
.photo-placeholder{
  min-height:330px;padding:32px;
  border:1px solid rgba(59,43,33,.13);
  background:linear-gradient(145deg,rgba(232,219,198,.58),rgba(247,241,230,.92));
  box-shadow:none;
}
.photo-placeholder:first-child{min-height:470px}
.photo-placeholder strong{font-size:2.15rem;color:#3d3028}
.photo-placeholder p{color:#74685d;max-width:34ch}

/* Videos — darkest poster-first section */
#videos{background:#141312;color:#F0EADF}
#videos .section-head{margin-bottom:54px}
#videos .video-grid{gap:16px}
#videos .video-card{
  min-height:360px;padding:32px;
  border-color:rgba(240,234,223,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.035));
}
#videos .video-card strong{font-size:2.15rem;color:#F0EADF}
#videos .video-card p{color:#AAA198}
#videos .video-card:hover{border-color:rgba(183,154,99,.42)}

/* Optional Signature Films styling — applies only if these semantic classes already exist. */
.signature-films,.signature-films-section,[data-section="signature-films"]{
  background:var(--voh-charcoal);
  color:var(--voh-text-on-dark);
}
.signature-films .eyebrow,.signature-films-section .eyebrow,[data-section="signature-films"] .eyebrow{color:var(--voh-gold)}
.signature-grid,.signature-films-grid{display:grid;grid-template-columns:1.16fr .84fr .84fr;gap:16px}
.signature-card,.signature-film-card{border:1px solid rgba(237,229,213,.14);background:rgba(255,255,255,.018);overflow:hidden}
.signature-card:first-child,.signature-film-card:first-child{grid-row:span 1}
.signature-card h3,.signature-film-card h3{font-family:var(--voh-display);color:var(--voh-text-on-dark);font-weight:500}

/* Publications — quiet editorial */
#publications{background:#EAE0D0}
.publication-grid{gap:0;border-top:1px solid var(--voh-line);border-bottom:1px solid var(--voh-line)}
.publication-card{min-height:260px;padding:32px;border:0;border-right:1px solid var(--voh-line);background:transparent}
.publication-card:last-child{border-right:0}
.publication-card strong{font-size:2rem;margin:58px 0 12px}

/* Social — contemporary return to ivory */
#social{background:#F5F0E6}
#social .section-head{max-width:820px}
.social-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.social-card{
  min-height:270px;padding:30px;
  border-color:rgba(59,43,33,.14);
  background:rgba(255,255,255,.22);
}
.social-card strong{font-size:2.2rem;margin:64px 0 12px;color:#352b25}
.social-card.live{box-shadow:inset 0 2px 0 rgba(183,154,99,.66)}
.social-card.live:hover{transform:translateY(-2px);background:rgba(255,255,255,.42);border-color:rgba(148,124,82,.38)}
.social-card.pending{opacity:.58}
.social-card span{font-size:.76rem;letter-spacing:.03em}

/* Contact — warm charcoal finish */
#contact{background:#24201D;color:#F0E7DA}
#contact .eyebrow{color:#BDA579}
#contact .muted{color:#BFB1A3}
.contact-form{gap:16px 18px}
.contact-form input,.contact-form select,.contact-form textarea{
  border-color:rgba(240,231,218,.16);
  background:rgba(255,255,255,.025);
  color:#F3EBDD;
  border-radius:0;
}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{border-color:rgba(183,154,99,.82);box-shadow:0 0 0 1px rgba(183,154,99,.16)}

/* Footer */
.footer{background:#F2EBDD;padding:38px clamp(22px,5vw,76px) 48px;border-top:1px solid var(--voh-line)}
.footer strong{font-size:1.35rem;color:var(--voh-text)}
.footer-links a{font-size:.76rem;text-decoration:none;color:#6c6056}
.footer-links a:hover{color:var(--voh-text)}

/* Floating controls: visual polish only, behavior untouched */
.ambient-control,.now-playing,.update-pop{border-color:rgba(237,229,213,.14);background:rgba(23,21,19,.94);box-shadow:0 18px 52px rgba(24,18,14,.22)}
.ambient-control button,.update-pop a{color:#C6A979}
.ambient-control span,.now-playing span,.now-playing small,.update-pop small{color:#B8AA9A}
.now-playing strong,.update-pop strong{font-family:var(--voh-display);color:#F0E7DA}

/* Public Vintage page */
.vintage-hero{
  max-width:none;padding:clamp(110px,10vw,160px) clamp(22px,7vw,112px) clamp(80px,8vw,120px);
  background:
    radial-gradient(circle at 80% 12%,rgba(183,154,99,.10),transparent 28%),
    var(--voh-paper-deep);
}
.vintage-hero h1{max-width:1000px;color:#342820}
.vintage-hero h1 em{color:var(--voh-wine)}
.vintage-hero .lede{color:#65564b}
.archive-list{border-color:var(--voh-line)}
.archive-list article{grid-template-columns:90px 1fr;gap:34px;padding:38px 0;border-color:var(--voh-line)}
.archive-list article>span{font-family:var(--voh-display);color:var(--voh-gold-muted)}
.archive-list h3{font-family:var(--voh-display);font-weight:500}

/* Focus / accessibility */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--voh-gold);outline-offset:3px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* Tablet */
@media(max-width:1000px){
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:96px;padding-bottom:96px}
  .hero-copy{max-width:820px}
  .hero-art{width:min(640px,100%);min-height:420px;margin-inline:auto}
  .photo-grid{grid-template-columns:1fr 1fr}
  .photo-placeholder:first-child{grid-column:1/-1;min-height:420px}
  .signature-grid,.signature-films-grid{grid-template-columns:1fr 1fr}
  .signature-card:first-child,.signature-film-card:first-child{grid-column:1/-1}
}

/* Mobile navigation + content rhythm */
@media(max-width:900px){
  html{scroll-padding-top:76px}
  .header{min-height:74px}
  .nav{
    top:74px;padding:24px 22px 28px;
    background:rgba(244,238,223,.98);
    gap:17px;
    box-shadow:0 22px 50px rgba(41,30,23,.08)
  }
  .nav a{font-size:.74rem;letter-spacing:.095em;width:100%;padding:5px 0}
  .nav a:after{display:none}
  .hero{padding-top:78px}
  .section{padding-top:82px;padding-bottom:82px}
  .latest-grid,#about .three-grid,.archive-shelf,.publication-grid{grid-template-columns:1fr;border-bottom:0}
  .latest-card,#about .card,.shelf-card,.publication-card{border-right:0;border-bottom:1px solid var(--voh-line)}
  .latest-card:last-child,#about .card:last-child,.shelf-card:last-child,.publication-card:last-child{border-bottom:0}
  #about .card{min-height:250px}
  #about .card h3{margin-top:60px}
  .feature-strip>div{padding:30px}
  .photo-grid,.video-grid{grid-template-columns:1fr}
  .photo-placeholder:first-child{grid-column:auto}
  .photo-placeholder,.photo-placeholder:first-child,#videos .video-card{min-height:310px}
  .social-grid{grid-template-columns:1fr}
  .social-card{min-height:240px}
  .split{gap:28px}
  .contact{gap:52px}
  .footer{gap:24px}
}

/* Phone */
@media(max-width:640px){
  body{font-size:15.5px;line-height:1.68}
  .header{padding-inline:18px}
  .brand{gap:10px}
  .brand-mark{width:38px;height:38px;font-size:.92rem}
  .brand strong{font-size:1.08rem}
  .brand small{font-size:.5rem;letter-spacing:.13em}
  .menu{padding:9px 11px}
  .hero,.section,.vintage-hero{padding-left:22px;padding-right:22px}
  .hero{padding-top:70px;padding-bottom:76px;gap:48px}
  h1{font-size:clamp(3.45rem,16vw,4.75rem);line-height:.93}
  .section h2,.contact h2{font-size:clamp(2.75rem,12vw,4rem);line-height:.96}
  .hero .lede{margin-top:26px;font-size:1rem}
  .actions{margin-top:30px;width:100%}
  .actions .button{flex:1 1 140px}
  .hero-art{min-height:330px}
  .paper{width:84%;padding:22px}
  .section{padding-top:72px;padding-bottom:72px}
  .section-head{margin-bottom:34px}
  .latest-card{min-height:172px;padding:26px 22px}
  .latest-card strong{margin-top:36px;font-size:1.75rem}
  #about .card{padding:30px 22px;min-height:230px}
  #about .card h3{margin-top:48px}
  #music .feature-strip{margin-top:42px}
  #music .feature-strip>div{padding:26px 22px}
  #music .featured-song{padding:26px 22px}
  .journal{padding-top:92px;padding-bottom:92px}
  .journal blockquote{font-size:clamp(2.8rem,13vw,4.35rem)}
  .photo-placeholder,.photo-placeholder:first-child,#videos .video-card{min-height:290px;padding:26px 22px}
  .publication-card,.social-card{padding:26px 22px}
  .social-card strong{margin-top:48px}
  .signature-grid,.signature-films-grid{grid-template-columns:1fr}
  .signature-card:first-child,.signature-film-card:first-child{grid-column:auto}
  .contact-form input,.contact-form select,.contact-form textarea{font-size:16px}
  .ambient-control{left:10px;right:10px;bottom:10px;padding:9px 11px}
  .ambient-control span{font-size:.69rem;max-width:58vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .now-playing{left:10px;bottom:68px;width:calc(100vw - 20px)}
  .update-pop{right:12px;bottom:70px;width:calc(100vw - 24px)}
  .footer{padding-left:22px;padding-right:22px}
  .footer-links{gap:12px 18px}
}



/* --- VOH final prep additions --- */
.hero-art{display:grid;align-content:center;justify-items:center}
.signature-films .section-head h2{max-width:850px}
.signature-grid{margin-top:8px}
.signature-card{display:flex;flex-direction:column}
.signature-poster-wrap{position:relative;aspect-ratio:9/16;background:#0f0d0c;overflow:hidden}
.signature-poster{width:100%;height:100%;object-fit:cover;display:block}
.signature-copy{padding:22px 22px 24px}
.signature-copy small,.song-card-copy small{display:block;color:var(--voh-gold);text-transform:uppercase;letter-spacing:.12em;font:600 .68rem var(--voh-body)}
.signature-copy h3{font-size:2rem;line-height:1.02;margin:16px 0 10px}
.signature-copy p{margin:0;color:var(--voh-text-on-dark-soft)}
.selected-works{margin-top:42px}
.selected-head{margin-bottom:28px;max-width:760px}
.selected-head h3{font-size:clamp(2.15rem,3.4vw,3.4rem);line-height:1;margin:0;color:#f1e7d8;font-family:var(--voh-display);font-weight:500}
.selected-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.song-card{display:flex;flex-direction:column;border:1px solid rgba(237,229,213,.14);background:rgba(255,255,255,.02);overflow:hidden}
.song-card figure{margin:0;aspect-ratio:9/16;background:#0f0d0c}
.song-card figure img{width:100%;height:100%;object-fit:cover;display:block}
.song-card-copy{padding:24px}
.song-card-copy h4{margin:14px 0 10px;color:#F0EADF;font-size:2rem}
.song-card-copy p{margin:0;color:#b9ac9f}
@media(max-width:1100px){.signature-grid,.selected-grid{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:900px){.signature-grid,.selected-grid{grid-template-columns:1fr}.signature-copy h3,.song-card-copy h4{font-size:1.9rem}.hero-art{min-height:280px}}

/* ===== VOH final portable build: restored Home Signature Hero ===== */
html,body{max-width:100%;overflow-x:clip}
img,video{max-width:100%}

.signature-hero{
  min-height:590px;
  display:grid;
  place-items:center;
  position:relative;
  isolation:isolate;
}
.signature-stage{
  position:relative;
  width:min(100%,390px);
  aspect-ratio:9/16;
  overflow:hidden;
  background:#12100f;
  border:1px solid rgba(66,48,38,.2);
  box-shadow:0 36px 100px rgba(35,24,18,.22);
}
.signature-stage:before{
  content:"";
  position:absolute;
  inset:-18px;
  z-index:-1;
  border:1px solid rgba(148,124,82,.24);
  transform:translate(24px,24px);
}
.signature-clip{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  opacity:0;
  pointer-events:none;
  filter:saturate(.88) contrast(1.03) brightness(.94);
  transition:opacity 1.05s cubic-bezier(.4,0,.2,1);
}
.signature-clip.is-active{opacity:1}
.signature-veil{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(15,13,12,.02) 45%,rgba(15,13,12,.58) 100%);
}
.signature-badge{
  position:absolute;
  left:24px;
  right:24px;
  bottom:34px;
  display:grid;
  gap:4px;
  color:#f2e9d9;
  text-shadow:0 2px 18px rgba(0,0,0,.55);
}
.signature-badge small{
  font:600 .58rem var(--voh-body);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#c3ab7c;
}
.signature-badge strong{
  font:500 1.75rem/1 var(--voh-display);
  letter-spacing:-.01em;
}
.signature-progress{
  position:absolute;
  left:24px;
  right:24px;
  bottom:18px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
}
.signature-progress i{
  height:1px;
  background:rgba(242,233,217,.3);
  transition:background-color .55s ease,transform .55s ease;
  transform-origin:left;
}
.signature-progress i.is-active{background:#c3ab7c;transform:scaleY(2)}

.signature-card{transition:border-color .25s ease,transform .25s ease}
.signature-card:hover{border-color:rgba(183,154,99,.4);transform:translateY(-2px)}
.signature-poster-wrap:after{
  content:"Poster-first";
  position:absolute;
  top:18px;
  left:18px;
  padding:7px 9px;
  background:rgba(18,16,15,.76);
  color:#c8b48c;
  font:600 .55rem var(--voh-body);
  letter-spacing:.13em;
  text-transform:uppercase;
  backdrop-filter:blur(8px);
}

@media(max-width:1180px){
  .menu{display:block;min-width:48px;min-height:44px}
  .nav{
    display:none;
    position:absolute;
    top:80px;
    left:0;
    right:0;
    max-height:calc(100svh - 80px);
    overflow:auto;
    padding:25px clamp(22px,5vw,76px) 30px;
    background:rgba(244,238,223,.985);
    border-bottom:1px solid var(--voh-line);
    box-shadow:0 24px 52px rgba(39,28,21,.1);
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
  }
  .nav.open{display:flex}
  .nav a{width:100%;min-height:38px;display:flex;align-items:center}
  .nav a:after{display:none}
}

@media(max-width:1000px){
  .signature-hero{min-height:620px}
  .signature-stage{width:min(100%,365px)}
}

@media(max-width:640px){
  .signature-hero{min-height:auto;padding:12px 0 20px}
  .signature-stage{width:min(88vw,350px)}
  .signature-stage:before{inset:-10px;transform:translate(12px,12px)}
  .signature-badge{left:20px;right:20px;bottom:30px}
  .signature-progress{left:20px;right:20px;bottom:15px}
  .button,.ambient-control button,.now-playing-close,.update-close{min-height:44px}
}

@media(prefers-reduced-motion:reduce){
  .signature-clip{transition:none}
  .signature-progress{display:none}
}

/* ===== LOCKED VOH THEME + TYPOGRAPHY CORRECTION =====
   Theme/font only. Structure, content and media behavior unchanged. */
:root{
  --serif:var(--voh-display);
  --display:var(--voh-display);
  --sans:var(--voh-body);
}
body{font-family:var(--voh-body);}
h1,h2,h3,h4,blockquote,.memory-display,.featured-song h3,.latest-card strong,.publication-card strong,.social-card strong,.video-card strong,.photo-placeholder strong,.shelf-card strong,.feature-strip strong,.brand strong,.footer strong{
  font-family:var(--voh-display)!important;
}
.malayalam-display,[lang="ml"] h1,[lang="ml"] h2,[lang="ml"] h3,h1[lang="ml"],h2[lang="ml"],h3[lang="ml"]{
  font-family:var(--voh-ml-display)!important;
}
.nav a,.menu,.eyebrow,.button,.brand small,.feature-strip small,.shelf-card small,.latest-card small,.publication-card small,.social-card small,.video-card small,.photo-placeholder span,.contact-form label{
  font-family:var(--voh-body)!important;
}
.journal-title{color:#4c382f!important;font-family:var(--voh-display)!important;}

/* FINAL QA PATCH — official brand assets + public media behavior */
.brand{min-width:170px}.brand-logo{display:block;width:190px;max-width:24vw;height:52px;object-fit:contain;object-position:left center}.footer-lockup{width:min(360px,78vw);height:auto;display:block}.selected-video{width:100%;height:100%;object-fit:cover;display:block;background:#080706}.song-card figure:has(.selected-video){position:relative}.journal-title{max-width:980px;margin:18px auto;font-size:clamp(2.5rem,5vw,5.2rem);line-height:.98;color:#e8d8bf}.signature-poster,.song-card figure img,.selected-video{filter:saturate(.88) contrast(1.02)}
@media(max-width:1180px){.brand-logo{max-width:210px;width:180px}.nav{top:78px}}
@media(max-width:640px){.brand{min-width:0}.brand-logo{width:150px;max-width:55vw;height:46px}.hero{padding-top:54px}.footer-lockup{width:250px}.journal-title{font-size:clamp(2.25rem,12vw,3.7rem)}}


/* =====================================================================
   VOH FINAL VISUAL LOCK — "WHERE STORIES SING" REFERENCE
   Theme + typography only. Existing content/media/JS behavior preserved.
   ===================================================================== */
:root{
  --ref-black:#060504;
  --ref-black-2:#0b0806;
  --ref-charcoal:#12100e;
  --ref-brown:#24160e;
  --ref-gold:#c99b4a;
  --ref-gold-bright:#e0b967;
  --ref-gold-soft:#a87d39;
  --ref-ivory:#f0e3cf;
  --ref-ivory-soft:#cdbda8;
  --ref-muted:#9f9181;
  --ref-line:rgba(201,155,74,.30);
  --ref-line-soft:rgba(240,227,207,.11);
  --ref-display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --ref-caps:"Cinzel","Cormorant Garamond",Georgia,serif;
  --ref-body:"Manrope",Arial,sans-serif;
  --ref-ml:"Gayathri","Noto Sans Malayalam",sans-serif;
}
html{background:var(--ref-black)!important;color-scheme:dark}
body{
  background:
    radial-gradient(circle at 78% 8%,rgba(158,88,28,.10),transparent 26%),
    radial-gradient(circle at 12% 38%,rgba(201,155,74,.045),transparent 24%),
    var(--ref-black)!important;
  color:var(--ref-ivory)!important;
  font-family:var(--ref-body)!important;
  font-size:16px;
  line-height:1.68;
}
::selection{background:rgba(201,155,74,.30)!important;color:#fff7e8!important}

/* typography */
h1,h2,h3,h4,blockquote,.memory-display,.featured-song h3,.latest-card strong,
.publication-card strong,.social-card strong,.video-card strong,.photo-placeholder strong,
.shelf-card strong,.feature-strip strong,.footer strong,.signature-badge strong{
  font-family:var(--ref-display)!important;
  font-weight:500!important;
  color:var(--ref-ivory)!important;
  letter-spacing:-.015em!important;
}
.section h2,.contact h2{
  font-size:clamp(2.65rem,4.4vw,4.65rem)!important;
  line-height:.98!important;
  letter-spacing:-.018em!important;
}
h1{
  font-size:clamp(3.8rem,6.4vw,6.3rem)!important;
  line-height:.93!important;
  letter-spacing:-.026em!important;
  color:var(--ref-ivory)!important;
  text-shadow:0 3px 28px rgba(0,0,0,.28);
}
h1 em,h1 .memory-display{color:var(--ref-ivory)!important;font-style:normal!important;font-weight:500!important}
.malayalam-display,[lang="ml"] h1,[lang="ml"] h2,[lang="ml"] h3,h1[lang="ml"],h2[lang="ml"],h3[lang="ml"]{
  font-family:var(--ref-ml)!important;
  color:var(--ref-ivory)!important;
}
.eyebrow,.nav a,.menu,.button,.feature-strip small,.shelf-card small,.latest-card small,
.publication-card small,.social-card small,.video-card small,.photo-placeholder span,.contact-form label,
.signature-copy small,.song-card-copy small,.ambient-control button,.ambient-control span{
  font-family:var(--ref-body)!important;
}
.eyebrow{
  color:var(--ref-gold)!important;
  font-size:.66rem!important;
  font-weight:600!important;
  letter-spacing:.20em!important;
}
.lede,.muted,.card p,.archive-list p,.photo-placeholder p,.video-card p,.publication-card p,
.social-card p,.song-card-copy p,.signature-copy p,.signoff{
  color:var(--ref-ivory-soft)!important;
}

/* header */
.header{
  min-height:82px!important;
  background:linear-gradient(180deg,rgba(5,4,3,.97),rgba(5,4,3,.88))!important;
  border-bottom:1px solid rgba(201,155,74,.18)!important;
  box-shadow:0 10px 35px rgba(0,0,0,.18)!important;
  backdrop-filter:blur(18px) saturate(110%)!important;
}
.brand-logo{filter:sepia(.08) saturate(1.12) brightness(1.08)!important}
.nav a{
  color:#d7c7b0!important;
  font-size:.69rem!important;
  font-weight:500!important;
  letter-spacing:.10em!important;
}
.nav a:hover,.nav a.active{color:var(--ref-gold-bright)!important}
.nav a:after{background:var(--ref-gold)!important}
.menu{
  color:var(--ref-ivory)!important;
  border:1px solid rgba(201,155,74,.42)!important;
  background:rgba(201,155,74,.03)!important;
}

/* hero */
.hero{
  position:relative!important;
  min-height:calc(100svh - 82px)!important;
  padding:clamp(70px,7vw,116px) clamp(22px,6.5vw,104px)!important;
  grid-template-columns:minmax(0,1.02fr) minmax(320px,.98fr)!important;
  gap:clamp(42px,6vw,92px)!important;
  background:
    linear-gradient(90deg,rgba(5,4,3,.98) 0%,rgba(8,5,3,.94) 42%,rgba(24,13,7,.68) 100%),
    radial-gradient(circle at 76% 44%,rgba(181,100,33,.16),transparent 38%),
    var(--ref-black)!important;
  border-bottom:1px solid rgba(201,155,74,.18)!important;
}
.hero:before{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 48% 94%,rgba(201,155,74,.07),transparent 42%);
}
.hero-copy{max-width:720px!important}
.hero .lede{color:#cbbba5!important;font-family:var(--ref-display)!important;font-size:clamp(1.05rem,1.35vw,1.28rem)!important;line-height:1.55!important;max-width:610px!important}
.actions{margin-top:34px!important}
.button{
  min-height:46px!important;
  border-radius:999px!important;
  padding-inline:22px!important;
  font-size:.66rem!important;
  font-weight:600!important;
  letter-spacing:.13em!important;
}
.button.primary{
  color:var(--ref-gold-bright)!important;
  background:rgba(14,10,7,.82)!important;
  border:1px solid rgba(201,155,74,.72)!important;
}
.button.primary:hover{background:rgba(201,155,74,.10)!important}
.button.ghost{
  color:var(--ref-ivory)!important;
  border:1px solid rgba(240,227,207,.20)!important;
  background:rgba(255,255,255,.018)!important;
}
.button.ghost:hover{border-color:rgba(201,155,74,.58)!important;background:rgba(201,155,74,.06)!important}
.hero-art{opacity:1!important;min-height:560px!important}
.signature-stage{
  width:min(100%,430px)!important;
  border:1px solid rgba(201,155,74,.56)!important;
  border-radius:9px!important;
  box-shadow:0 28px 78px rgba(0,0,0,.48),0 0 55px rgba(168,94,27,.08)!important;
  background:#090604!important;
}
.signature-stage:before{
  border-color:rgba(201,155,74,.18)!important;
  background:transparent!important;
  transform:translate(15px,15px)!important;
}
.signature-clip{filter:saturate(.93) contrast(1.06) brightness(.78) sepia(.04)!important}
.signature-veil{background:linear-gradient(180deg,rgba(7,5,3,.02) 38%,rgba(6,4,3,.76) 100%)!important}
.signature-badge small{color:var(--ref-gold)!important}
.signature-progress i{background:rgba(240,227,207,.22)!important}
.signature-progress i.is-active{background:var(--ref-gold)!important}

/* all public sections share the dark cinematic house */
.section,.latest-home,#about,#music,.vintage-teaser,.journal,.media,#photos,#videos,.press,#publications,
.social-section,#social,.contact,#contact{
  color:var(--ref-ivory)!important;
  border-color:var(--ref-line-soft)!important;
}
.section{
  background:
    radial-gradient(circle at 82% 10%,rgba(123,65,25,.055),transparent 30%),
    var(--ref-black-2)!important;
}
.section:nth-of-type(even){background:linear-gradient(180deg,#0c0907,#080604)!important}
.section-head{max-width:900px!important}
.section-head h2{color:var(--ref-ivory)!important}

/* signature films = closest visual match to reference */
.signature-films{
  background:linear-gradient(180deg,#070504 0%,#0d0906 48%,#070504 100%)!important;
  text-align:center!important;
  border-top:1px solid rgba(201,155,74,.16)!important;
  border-bottom:1px solid rgba(201,155,74,.16)!important;
}
.signature-films .section-head{margin-left:auto!important;margin-right:auto!important;max-width:820px!important}
.signature-films .section-head h2{
  color:var(--ref-gold-bright)!important;
  font-family:var(--ref-caps)!important;
  text-transform:uppercase!important;
  font-size:clamp(2.15rem,3.8vw,3.6rem)!important;
  letter-spacing:.035em!important;
}
.signature-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important;text-align:left!important}
.signature-card{
  border:1px solid rgba(201,155,74,.45)!important;
  border-radius:8px!important;
  background:#0b0806!important;
  box-shadow:0 18px 48px rgba(0,0,0,.24)!important;
}
.signature-card:hover{border-color:rgba(224,185,103,.78)!important;transform:translateY(-3px)!important}
.signature-poster{filter:saturate(.88) contrast(1.06) brightness(.78) sepia(.07)!important}
.signature-copy{padding:24px!important}
.signature-copy h3{color:var(--ref-gold-bright)!important;font-size:clamp(2rem,2.8vw,2.8rem)!important}
.signature-copy small{color:var(--ref-gold)!important}
.signature-copy p{color:#bbae9b!important}
.signature-poster-wrap:after{background:rgba(7,5,4,.80)!important;color:var(--ref-gold-bright)!important;border:1px solid rgba(201,155,74,.28)!important}

/* cards and editorial blocks */
.latest-home,#about,.vintage-teaser,.journal,#photos,#publications,#social{
  background:linear-gradient(180deg,#0b0806,#070504)!important;
}
.latest-grid,#about .three-grid,.archive-shelf,.publication-grid{
  border-color:var(--ref-line)!important;
}
.latest-card,#about .card,.shelf-card,.publication-card,.social-card,.photo-placeholder,.video-card{
  color:var(--ref-ivory)!important;
  background:linear-gradient(180deg,rgba(38,25,16,.34),rgba(12,9,7,.38))!important;
  border-color:rgba(201,155,74,.24)!important;
  box-shadow:none!important;
}
.latest-card strong,#about .card h3,.shelf-card strong,.publication-card strong,.social-card strong,.photo-placeholder strong,.video-card strong{
  color:var(--ref-ivory)!important;
}
.latest-card small,#about .card>span,.shelf-card small,.publication-card small,.social-card small,.video-card small,.photo-placeholder span{
  color:var(--ref-gold)!important;
}
.latest-card span,.text-link{color:var(--ref-gold-bright)!important}
.latest-card:hover,.social-card:hover,.publication-card:hover{background:rgba(201,155,74,.045)!important}

/* music + selected songs */
#music,#videos{
  background:
    radial-gradient(circle at 16% 16%,rgba(201,155,74,.05),transparent 28%),
    linear-gradient(180deg,#0b0806,#050403)!important;
}
#music .feature-strip,#music .featured-song{border-color:rgba(201,155,74,.25)!important;background:rgba(255,255,255,.012)!important}
#music .feature-strip>div{border-color:rgba(201,155,74,.20)!important;background:rgba(255,255,255,.006)!important}
#music .feature-strip strong{color:var(--ref-gold-bright)!important}
.selected-head h3{color:var(--ref-ivory)!important}
.song-card{
  border:1px solid rgba(201,155,74,.42)!important;
  border-radius:8px!important;
  background:#0a0705!important;
  box-shadow:0 16px 42px rgba(0,0,0,.22)!important;
}
.song-card figure{background:#050403!important}
.song-card figure img,.selected-video{filter:saturate(.88) contrast(1.05) brightness(.82) sepia(.035)!important}
.song-card-copy small{color:var(--ref-gold)!important}
.song-card-copy h4{color:var(--ref-gold-bright)!important}

/* journal */
.journal{
  background:
    linear-gradient(rgba(8,6,4,.96),rgba(8,6,4,.96)),
    repeating-linear-gradient(0deg,transparent 0 31px,rgba(201,155,74,.045) 32px 33px)!important;
}
.journal blockquote,.journal-title{color:var(--ref-ivory)!important;text-shadow:0 2px 25px rgba(0,0,0,.22)}

/* contact / forms */
#contact{background:linear-gradient(180deg,#0c0907,#050403)!important}
.contact-form input,.contact-form select,.contact-form textarea{
  color:var(--ref-ivory)!important;
  background:rgba(255,255,255,.025)!important;
  border:1px solid rgba(201,155,74,.26)!important;
}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{
  border-color:rgba(224,185,103,.78)!important;
  box-shadow:0 0 0 1px rgba(201,155,74,.14)!important;
}
.contact-form label{color:#c6ad7f!important}
.contact-form select option{color:#f0e3cf!important;background:#0a0705!important}

/* footer + floating controls */
.footer{
  background:#050403!important;
  border-top:1px solid rgba(201,155,74,.20)!important;
  color:#9d8e7b!important;
}
.footer strong,.footer a{color:var(--ref-ivory)!important}
.footer-lockup{filter:sepia(.07) saturate(1.1) brightness(1.04)!important}
.ambient-control,.now-playing,.update-pop{
  background:rgba(7,5,4,.94)!important;
  border:1px solid rgba(201,155,74,.33)!important;
  box-shadow:0 18px 52px rgba(0,0,0,.38)!important;
}
.ambient-control button,.update-pop a{color:var(--ref-gold-bright)!important}
.ambient-control span,.now-playing span,.now-playing small,.update-pop small{color:#bba994!important}

/* desktop rhythm similar to the approved reference */
@media(min-width:1181px){
  .header{padding-inline:clamp(42px,4.4vw,74px)!important}
  .brand-logo{width:180px!important;height:58px!important}
  .nav{gap:clamp(18px,2vw,34px)!important}
}

/* mobile is intentionally dark and compact, not the old cream layout */
@media(max-width:1180px){
  .nav{
    top:82px!important;
    background:rgba(6,5,4,.985)!important;
    border-bottom:1px solid rgba(201,155,74,.22)!important;
    box-shadow:0 24px 52px rgba(0,0,0,.38)!important;
  }
  .nav a{color:#d9cbb7!important}
}
@media(max-width:900px){
  .hero{
    grid-template-columns:1fr!important;
    min-height:auto!important;
    padding-top:64px!important;
    gap:44px!important;
  }
  .hero-copy{max-width:680px!important}
  .hero-art{min-height:auto!important;padding:0 0 10px!important}
  .signature-stage{width:min(82vw,420px)!important}
  .signature-grid,.selected-grid{grid-template-columns:1fr!important}
}
@media(max-width:640px){
  body{font-size:15px!important}
  .header{min-height:74px!important;padding-inline:18px!important}
  .brand-logo{width:142px!important;height:48px!important;max-width:54vw!important}
  .nav{top:74px!important}
  .hero{
    padding:52px 22px 72px!important;
    background:
      radial-gradient(circle at 80% 72%,rgba(145,74,24,.12),transparent 34%),
      linear-gradient(180deg,#060504,#0b0705)!important;
  }
  h1{font-size:clamp(3.15rem,13.7vw,4.3rem)!important;line-height:.95!important}
  .hero .lede{font-size:1rem!important;margin-top:24px!important}
  .actions{margin-top:28px!important;gap:10px!important}
  .button{min-height:44px!important;padding-inline:18px!important}
  .section{padding:74px 22px!important}
  .section h2,.contact h2{font-size:clamp(2.55rem,12vw,3.7rem)!important}
  .signature-films .section-head h2{font-size:clamp(2rem,9.5vw,2.75rem)!important}
  .signature-stage{width:min(88vw,370px)!important}
  .ambient-control{left:10px!important;right:10px!important;bottom:10px!important;background:rgba(7,5,4,.95)!important}
}

/* legacy token remap: prevents any light-theme component from leaking through */
:root{
  --bg:#060504!important;
  --paper:#0b0806!important;
  --ink:#f0e3cf!important;
  --muted:#a99a88!important;
  --line:rgba(201,155,74,.24)!important;
  --gold:#c99b4a!important;
  --dark:#060504!important;
  --dark2:#0b0806!important;
  --voh-ivory:#080604!important;
  --voh-paper:#0b0806!important;
  --voh-paper-deep:#100b08!important;
  --voh-charcoal:#080604!important;
  --voh-soft-black:#050403!important;
  --voh-brown:#24160e!important;
  --voh-brown-deep:#140d08!important;
  --voh-wine:#c99b4a!important;
  --voh-gold:#c99b4a!important;
  --voh-gold-muted:#aa7f3f!important;
  --voh-text:#f0e3cf!important;
  --voh-text-soft:#a99a88!important;
  --voh-text-on-dark:#f0e3cf!important;
  --voh-text-on-dark-soft:#b5a692!important;
  --voh-line:rgba(201,155,74,.24)!important;
  --voh-line-dark:rgba(201,155,74,.24)!important;
  --voh-display:var(--ref-display)!important;
  --voh-body:var(--ref-body)!important;
}

/* FINAL SINGLE-SIGNATURE VIDEO PATCH */
.signature-progress{grid-template-columns:1fr!important}
.signature-progress i{display:none!important}
.signature-progress i:first-child{display:block!important;background:var(--ref-gold)!important;transform:scaleY(1.7)!important}
.signature-stage{background:#050403!important}
@media(max-width:640px){
  .signature-stage{border-radius:7px!important}
  .signature-badge strong{font-size:1.62rem!important}
}

/* =====================================================================
   VOH START -> FINAL LOCK, 22 AUG 2026
   Approved dark riverside theme + final font-role mapping from references.
   No structural or media-system redesign in this patch.
   ===================================================================== */
:root{
  --final-hero:"Cinzel Decorative", Georgia, serif;
  --final-editorial:"Bodoni Moda", Didot, "Times New Roman", serif;
  --final-ui:"Montserrat", Arial, sans-serif;
  --final-ml:"Gayathri","Noto Sans Malayalam",sans-serif;
  --final-black:#050403;
  --final-charcoal:#0a0705;
  --final-gold:#c9994a;
  --final-gold-bright:#e0b866;
  --final-ivory:#efe2cf;
  --final-ivory-soft:#c9b9a3;
  --final-wine:#7c433f;
}

html{background:var(--final-black)!important}
body{
  position:relative;
  isolation:isolate;
  background:var(--final-black)!important;
  color:var(--final-ivory)!important;
  font-family:var(--final-ui)!important;
  font-weight:400;
}
body::before{
  content:"";
  position:fixed;
  inset:-18px;
  z-index:0;
  pointer-events:none;
  background-image:url("assets/images/site/voh-cinematic-backdrop-final-20260822.jpg");
  background-size:cover;
  background-position:center 18%;
  filter:blur(.6px) saturate(.90) brightness(.70);
  transform:scale(1.035);
  opacity:.72;
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 78% 16%,rgba(195,114,43,.06),transparent 34%),
    linear-gradient(180deg,rgba(4,3,2,.22),rgba(4,3,2,.52) 55%,rgba(4,3,2,.78));
}
body > *{position:relative;z-index:1}

/* FINAL FONT ROLES */
body,.nav a,.menu,.button,.eyebrow,.feature-strip small,.shelf-card small,
.latest-card small,.publication-card small,.social-card small,.video-card small,
.photo-placeholder span,.contact-form label,.signature-copy small,.song-card-copy small,
.ambient-control button,.ambient-control span,.footer-links,.form-status{
  font-family:var(--final-ui)!important;
}

/* Main hero showpiece only: ornamental display reference */
.hero h1{
  font-family:var(--final-hero)!important;
  font-weight:400!important;
  letter-spacing:-.022em!important;
  line-height:.96!important;
  text-transform:none!important;
  color:var(--final-ivory)!important;
}
.hero h1 em,.hero h1 .memory-display{
  font-family:var(--final-editorial)!important;
  font-style:italic!important;
  font-weight:400!important;
  color:var(--final-gold-bright)!important;
  letter-spacing:-.025em!important;
}

/* High-contrast lyrical/editorial headline reference */
.section h2,.contact h2,.section-head h2,.journal-title,.featured-song h3,
.selected-head h3,.latest-card strong,.publication-card strong,.social-card strong,
.video-card strong,.photo-placeholder strong,.shelf-card strong,.feature-strip strong,
.signature-copy h3,.song-card-copy h4,.signature-badge strong,blockquote{
  font-family:var(--final-editorial)!important;
  font-weight:400!important;
}
.signature-films .section-head h2{
  font-family:var(--final-editorial)!important;
  font-weight:500!important;
  text-transform:uppercase!important;
  letter-spacing:.035em!important;
  color:var(--final-gold-bright)!important;
}
.memory-display:not(.hero h1 .memory-display){
  font-family:var(--final-editorial)!important;
  font-style:italic!important;
}
.malayalam-display,[lang="ml"]{font-family:var(--final-ml)!important}

/* Keep UI cinematic and clean, like the credit/reference frame. */
.nav a,.eyebrow,.button,.feature-strip small,.shelf-card small,.latest-card small,
.publication-card small,.social-card small,.video-card small,.signature-copy small,.song-card-copy small{
  letter-spacing:.105em!important;
}

/* Theme: dark river/garden backdrop visible through the site, never a flat cream page. */
.header{
  background:linear-gradient(180deg,rgba(4,3,2,.94),rgba(4,3,2,.79))!important;
}
.hero{
  background:
    linear-gradient(90deg,rgba(5,4,3,.74) 0%,rgba(7,5,3,.64) 46%,rgba(15,8,4,.38) 100%)!important;
}
.section,.latest-home,#about,#music,.vintage-teaser,.journal,.media,#photos,#videos,.press,#publications,
.social-section,#social,.contact,#contact{
  background:rgba(7,5,4,.87)!important;
  backdrop-filter:blur(2px);
}
.section:nth-of-type(even){background:rgba(10,7,5,.90)!important}
.signature-films{background:linear-gradient(180deg,rgba(5,4,3,.93),rgba(11,7,4,.91),rgba(5,4,3,.94))!important}
#music,#videos{background:rgba(5,4,3,.91)!important}
.journal{background:rgba(7,5,4,.92)!important}
#contact{background:rgba(5,4,3,.95)!important}
.footer{background:rgba(4,3,2,.96)!important}

/* Warm antique-gold, not yellow/neon. */
.eyebrow,.signature-badge small,.signature-copy small,.song-card-copy small,
.latest-card small,#about .card>span,.shelf-card small,.publication-card small,.social-card small,
.video-card small,.photo-placeholder span{color:var(--final-gold)!important}
.signature-copy h3,.song-card-copy h4,#music .feature-strip strong,.latest-card span,.text-link{
  color:var(--final-gold-bright)!important;
}
.lede,.muted,.card p,.archive-list p,.photo-placeholder p,.video-card p,.publication-card p,
.social-card p,.song-card-copy p,.signature-copy p,.signoff{color:var(--final-ivory-soft)!important}

/* Single home Signature film: no legacy multi-clip progress UI. */
.signature-progress{display:none!important}
.signature-stage{
  border-color:rgba(201,153,74,.58)!important;
  background:#050403!important;
  box-shadow:0 28px 80px rgba(0,0,0,.54),0 0 70px rgba(145,74,24,.10)!important;
}
.signature-clip{filter:saturate(.93) contrast(1.05) brightness(.80) sepia(.035)!important}

@media(max-width:900px){
  body::before{background-position:58% top;opacity:.66;filter:blur(.8px) saturate(.90) brightness(.68)}
  .hero{background:linear-gradient(180deg,rgba(5,4,3,.62),rgba(6,4,3,.82))!important}
}
@media(max-width:640px){
  .hero h1{font-size:clamp(2.95rem,12.3vw,4.05rem)!important;line-height:1!important}
  .signature-films .section-head h2{font-size:clamp(1.95rem,9.2vw,2.7rem)!important}
  body::before{opacity:.62;filter:blur(.9px) saturate(.88) brightness(.66)}
}

/* FINAL LOCK: pure river backdrop + reduced dark-overlay opacity; 2026-08-22 */

/* =====================================================================
   FINAL HOME MATCH PATCH — approved river backdrop preview
   Applied after every legacy rule so it wins the cascade.
   ===================================================================== */
:root{
  --home-black:#030302;
  --home-panel:rgba(5,4,3,.84);
  --home-panel-2:rgba(8,6,4,.88);
  --home-gold:#c99643;
  --home-gold-hi:#e2b45f;
  --home-ivory:#f1e7d8;
  --home-soft:#c7b7a3;
  --home-line:rgba(211,164,79,.27);
}
html,body{overflow-x:hidden!important;background:var(--home-black)!important}
body::before{
  inset:0!important;
  transform:none!important;
  background-size:cover!important;
  background-position:center top!important;
  background-attachment:fixed!important;
  filter:saturate(.92) contrast(1.02) brightness(.73)!important;
  opacity:.84!important;
}
body::after{
  background:
    linear-gradient(90deg,rgba(2,2,1,.86) 0%,rgba(3,2,1,.68) 34%,rgba(4,3,2,.25) 63%,rgba(3,2,1,.36) 100%),
    linear-gradient(180deg,rgba(2,2,1,.18) 0%,rgba(2,2,1,.18) 50%,rgba(2,2,1,.60) 100%)!important;
}
.header{
  min-height:70px!important;
  padding:0 clamp(28px,4.5vw,72px)!important;
  background:rgba(3,3,2,.72)!important;
  border-bottom:1px solid rgba(211,164,79,.14)!important;
  backdrop-filter:blur(12px) saturate(100%)!important;
}
.brand-logo{width:124px!important;height:50px!important;max-width:none!important;object-fit:contain!important}
.nav{gap:clamp(18px,2vw,34px)!important}
.nav a{font-size:.64rem!important;color:#d5c9ba!important;letter-spacing:.14em!important}
.nav a:hover,.nav a.active{color:var(--home-gold-hi)!important}
.menu{border-color:rgba(211,164,79,.54)!important;color:var(--home-ivory)!important;background:rgba(5,4,3,.34)!important}

/* Home is the exact locked riverside composition. The old signature video asset stays in the build,
   but is not allowed to cover the locked backdrop. */
.hero{
  grid-column:1/-1!important;
  display:block!important;
  position:relative!important;
  min-height:570px!important;
  padding:clamp(64px,7vw,98px) clamp(34px,7vw,112px) 48px!important;
  background:transparent!important;
  overflow:hidden!important;
}
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(2,2,1,.48) 0%,rgba(2,2,1,.24) 38%,transparent 70%);
}
.hero-copy{position:relative!important;z-index:2!important;width:min(520px,38vw)!important;max-width:520px!important}
.hero .eyebrow{margin-bottom:20px!important;color:var(--home-gold)!important;font-size:.62rem!important;letter-spacing:.15em!important}
.hero h1{margin:0!important;font-family:"Bodoni Moda",Didot,"Times New Roman",serif!important;text-transform:none!important;letter-spacing:-.035em!important;line-height:.88!important;color:var(--home-ivory)!important}
.hero h1 .hero-main{display:block!important;font-style:normal!important;font-weight:400!important;font-size:clamp(3.8rem,5.55vw,6.2rem)!important}
.hero h1 em.memory-display{display:block!important;margin-top:10px!important;font-family:"Bodoni Moda",Didot,"Times New Roman",serif!important;font-size:clamp(3.15rem,4.45vw,5.05rem)!important;line-height:.92!important;font-style:italic!important;font-weight:400!important;color:var(--home-gold-hi)!important;letter-spacing:-.035em!important}
.hero .lede{max-width:430px!important;margin-top:26px!important;color:#d1c2b0!important;font:400 .93rem/1.55 "Bodoni Moda",Georgia,serif!important}
.actions{margin-top:22px!important;gap:14px!important}
.button{height:40px!important;min-height:40px!important;padding:0 28px!important;border-radius:999px!important;font-family:"Montserrat",Arial,sans-serif!important;font-size:.64rem!important;letter-spacing:.13em!important}
.button.primary{background:rgba(4,3,2,.36)!important;border:1px solid var(--home-gold)!important;color:var(--home-gold-hi)!important}
.button.ghost{background:rgba(4,3,2,.22)!important;border:1px solid rgba(239,231,216,.48)!important;color:var(--home-ivory)!important}
.hero-art{display:none!important}

/* Page composition directly under the hero, as in the approved preview. */
main{
  display:grid!important;
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)!important;
  column-gap:14px!important;
  grid-auto-flow:row!important;
}
main > :not(.latest-home):not(.signature-films):not(.ambient-control):not(.hero){grid-column:1/-1!important}
.ambient-control{
  grid-column:1/-1!important;
  position:static!important;
  display:flex!important;
  width:auto!important;
  max-width:none!important;
  margin:0 clamp(34px,7vw,112px) 14px!important;
  min-height:46px!important;
  padding:0 22px!important;
  align-items:center!important;
  justify-content:space-between!important;
  border:1px solid var(--home-line)!important;
  background:rgba(4,3,2,.74)!important;
  box-shadow:none!important;
  backdrop-filter:blur(8px)!important;
}
.ambient-control[hidden]{display:none!important}
.ambient-control button{background:none!important;border:0!important;padding:0!important;color:var(--home-gold-hi)!important;font:400 .84rem "Bodoni Moda",Georgia,serif!important}
.ambient-control span{color:#b7a994!important;font:400 .72rem "Montserrat",Arial,sans-serif!important;letter-spacing:.01em!important}

.latest-home,.signature-films{
  align-self:stretch!important;
  margin-bottom:18px!important;
  padding:22px 24px!important;
  border:1px solid var(--home-line)!important;
  background:rgba(4,3,2,.82)!important;
  backdrop-filter:blur(8px)!important;
}
.latest-home{grid-column:1!important;margin-left:clamp(34px,7vw,112px)!important;margin-right:0!important}
.signature-films{grid-column:2!important;margin-right:clamp(34px,7vw,112px)!important;margin-left:0!important}
.compact-panel-head,.signature-films .section-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  max-width:none!important;
  margin:0 0 16px!important;
}
.compact-panel-head .eyebrow,.signature-films .section-head .eyebrow{margin:0!important;color:var(--home-gold-hi)!important;font-size:.64rem!important}
.panel-link{color:var(--home-gold-hi)!important;text-decoration:none!important;font:400 .72rem "Bodoni Moda",Georgia,serif!important;white-space:nowrap!important}
.reel-feature{display:grid!important;grid-template-columns:34% 1fr!important;min-height:112px!important;border:1px solid rgba(211,164,79,.17)!important;color:inherit!important;text-decoration:none!important;overflow:hidden!important}
.reel-mark{display:grid!important;place-items:center!important;background:radial-gradient(circle,rgba(173,103,32,.18),rgba(2,2,1,.94))!important}
.reel-mark img{width:70px!important;height:70px!important;object-fit:contain!important;opacity:.88!important}
.reel-copy{display:flex!important;flex-direction:column!important;justify-content:center!important;padding:18px 22px!important}
.reel-copy strong{font:italic 400 clamp(1.7rem,2.2vw,2.5rem)/1 "Bodoni Moda",Georgia,serif!important;color:var(--home-ivory)!important}
.reel-copy span{margin-top:10px!important;color:var(--home-gold-hi)!important;font:400 .78rem "Bodoni Moda",Georgia,serif!important}

.signature-films .section-head h2{display:none!important}
.signature-films .section-head .panel-link{display:block!important}
.signature-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;margin:0!important}
.signature-card{border:1px solid rgba(211,164,79,.18)!important;background:rgba(3,3,2,.55)!important;min-width:0!important}
.signature-poster-wrap{aspect-ratio:16/10!important}
.signature-poster{object-fit:cover!important;filter:saturate(.78) contrast(1.05) brightness(.68) sepia(.06)!important}
.signature-poster-wrap:after{display:none!important}
.signature-copy{padding:10px 12px 13px!important}
.signature-copy small,.signature-copy p{display:none!important}
.signature-copy h3{margin:0!important;font:400 clamp(.92rem,1.25vw,1.2rem)/1.05 "Bodoni Moda",Georgia,serif!important;color:var(--home-ivory)!important}

/* Remaining rooms keep the same DNA with controlled, darker variations. */
.section,#about,#music,.vintage-teaser,.journal,.media,#photos,#videos,.press,#publications,.social-section,#social,.contact,#contact{
  background:rgba(5,4,3,.89)!important;
  color:var(--home-ivory)!important;
  border-top:1px solid rgba(211,164,79,.12)!important;
}
.section:nth-of-type(even){background:rgba(8,6,4,.91)!important}
.section h2,.contact h2,.section-head h2,.journal-title,.featured-song h3,.selected-head h3,
.latest-card strong,.publication-card strong,.social-card strong,.video-card strong,.photo-placeholder strong,
.shelf-card strong,.feature-strip strong,.signature-copy h3,.song-card-copy h4,blockquote{
  font-family:"Bodoni Moda",Didot,"Times New Roman",serif!important;
  color:var(--home-ivory)!important;
}
.card,.latest-card,.photo-placeholder,.video-card,.publication-card,.social-card,.shelf-card,.song-card,.featured-song{
  background:rgba(5,4,3,.62)!important;border-color:rgba(211,164,79,.18)!important
}
.footer{background:#030302!important;color:#988b7a!important;border-top:1px solid rgba(211,164,79,.15)!important}

/* The delayed pop-up is redundant with the new in-flow Latest panel. */
.update-pop{display:none!important}

@media(max-width:1180px){
  .nav{background:rgba(3,3,2,.97)!important}
  .hero-copy{width:min(560px,54vw)!important}
}
@media(max-width:900px){
  main{display:block!important}
  .hero{min-height:900px!important;padding:72px 44px 48px!important}
  .hero-copy{width:min(610px,82vw)!important;max-width:610px!important}
  .ambient-control{margin:0 30px 16px!important}
  .latest-home,.signature-films{margin:0 30px 16px!important;padding:22px!important}
  .signature-grid{grid-template-columns:repeat(3,minmax(160px,1fr))!important;overflow-x:auto!important;padding-bottom:4px!important}
}
@media(max-width:640px){
  body::before{background-position:62% top!important;opacity:.80!important;filter:saturate(.90) contrast(1.02) brightness(.70)!important}
  body::after{background:linear-gradient(90deg,rgba(2,2,1,.74),rgba(2,2,1,.24) 78%),linear-gradient(180deg,rgba(2,2,1,.08),rgba(2,2,1,.60))!important}
  .header{min-height:82px!important;padding:0 28px!important;background:rgba(3,3,2,.56)!important}
  .brand-logo{width:150px!important;height:54px!important}
  .menu{display:block!important;font-size:.72rem!important;padding:12px 16px!important}
  .nav{top:82px!important}
  .hero{min-height:920px!important;padding:72px 44px 48px!important}
  .hero::after{background:linear-gradient(90deg,rgba(2,2,1,.44),rgba(2,2,1,.08) 78%)!important}
  .hero-copy{width:100%!important;max-width:560px!important}
  .hero h1 .hero-main{font-size:clamp(3.4rem,14.2vw,5.4rem)!important;line-height:.91!important}
  .hero h1 em.memory-display{font-size:clamp(3rem,12.2vw,4.65rem)!important;line-height:.94!important;margin-top:14px!important}
  .hero .lede{font-size:1rem!important;line-height:1.55!important;margin-top:28px!important;max-width:95%!important}
  .actions{display:grid!important;grid-template-columns:1fr 1.18fr!important;gap:18px!important;margin-top:28px!important}
  .button{width:100%!important;min-width:0!important;height:52px!important;font-size:.72rem!important;padding:0 12px!important}
  .ambient-control{margin:0 30px 18px!important;min-height:68px!important;padding:0 24px!important}
  .ambient-control button{font-size:.96rem!important}
  .ambient-control span{font-size:.72rem!important;text-align:right!important;max-width:58%!important}
  .latest-home,.signature-films{margin:0 30px 20px!important;padding:24px!important}
  .reel-feature{grid-template-columns:30% 1fr!important;min-height:132px!important}
  .reel-mark img{width:62px!important;height:62px!important}
  .reel-copy{padding:16px!important}
  .reel-copy strong{font-size:clamp(1.8rem,7.8vw,2.5rem)!important}
  .signature-grid{grid-template-columns:repeat(3,74vw)!important;gap:12px!important;scroll-snap-type:x mandatory!important}
  .signature-card{scroll-snap-align:start!important}
  .signature-poster-wrap{aspect-ratio:16/10!important}
  .section{padding:72px 30px!important}
}

/* =====================================================================
   FINAL ROOM THEMES — SAME HOUSE / DIFFERENT ROOMS
   Home is locked and untouched. Every public tab/section below receives
   a controlled variation of the approved riverside black-gold-wine DNA.
   ===================================================================== */

/* shared room behavior */
#about,#music,#vintage,#journal,#photos,#videos,#publications,#social,#contact{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  border-top:1px solid rgba(211,164,79,.14)!important;
  backdrop-filter:blur(2.5px) saturate(.94)!important;
}
#about::before,#music::before,#vintage::before,#journal::before,#photos::before,
#videos::before,#publications::before,#social::before,#contact::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:1;
}
#about .section-head,#music .split,#vintage .split,#journal>*:not(:empty),#photos .section-head,
#videos .section-head,#publications .section-head,#social .section-head,#contact .contact-copy{
  position:relative;
  z-index:1;
}

/* ABOUT — warm charcoal garden / introduction room */
#about{
  background:rgba(6,5,4,.82)!important;
}
#about::before{
  background:
    radial-gradient(circle at 16% 18%,rgba(206,151,70,.16),transparent 31%),
    radial-gradient(circle at 88% 70%,rgba(82,49,27,.22),transparent 35%),
    linear-gradient(135deg,rgba(4,3,2,.60),rgba(13,9,6,.82));
}
#about .eyebrow,#about .card>span{color:#d2a255!important}
#about .card{
  background:linear-gradient(160deg,rgba(31,22,14,.58),rgba(5,4,3,.62))!important;
  border-color:rgba(210,161,83,.25)!important;
}

/* MUSIC — golden river / performance room */
#music{
  background:rgba(5,4,3,.79)!important;
}
#music::before{
  background:
    radial-gradient(ellipse at 78% 16%,rgba(224,164,72,.20),transparent 34%),
    radial-gradient(ellipse at 52% 100%,rgba(125,69,28,.18),transparent 43%),
    linear-gradient(180deg,rgba(5,4,3,.68),rgba(7,4,2,.90));
}
#music .eyebrow,#music .song-card-copy small,#music .feature-strip small{color:#d7a85d!important}
#music .featured-song,#music .feature-strip,#music .song-card{
  background:rgba(7,5,3,.57)!important;
  border-color:rgba(221,169,83,.27)!important;
}
#music .selected-head h3,#music .featured-song h3{color:#f0dfc8!important}

/* VINTAGE — aged bronze / archive room */
#vintage{
  background:rgba(24,17,11,.87)!important;
}
#vintage::before{
  background:
    linear-gradient(90deg,rgba(82,56,31,.18) 0 1px,transparent 1px 34px),
    linear-gradient(rgba(116,82,46,.10) 0 1px,transparent 1px 34px),
    radial-gradient(circle at 22% 24%,rgba(190,137,70,.16),transparent 34%),
    linear-gradient(145deg,rgba(35,24,15,.76),rgba(9,6,4,.90));
}
#vintage .eyebrow,#vintage .text-link,#vintage .shelf-card small{color:#c99a5c!important}
#vintage .shelf-card{
  background:linear-gradient(180deg,rgba(71,49,28,.42),rgba(18,12,8,.58))!important;
  border-color:rgba(195,143,78,.26)!important;
}

/* JOURNAL — restrained wine / intimate writing room */
#journal{
  background:rgba(18,8,8,.88)!important;
}
#journal::before{
  background:
    repeating-linear-gradient(0deg,transparent 0 31px,rgba(216,181,125,.045) 32px 33px),
    radial-gradient(circle at 22% 30%,rgba(126,55,52,.30),transparent 37%),
    radial-gradient(circle at 86% 80%,rgba(91,47,30,.18),transparent 34%),
    linear-gradient(180deg,rgba(19,8,8,.74),rgba(7,4,3,.92));
}
#journal .eyebrow{color:#c99572!important}
#journal .journal-title{color:#f0dfd0!important}
#journal .signoff{color:#b9a292!important}

/* PHOTOS — dark foliage / gallery room */
#photos{
  background:rgba(7,8,5,.86)!important;
}
#photos::before{
  background:
    radial-gradient(circle at 84% 17%,rgba(116,110,55,.16),transparent 31%),
    radial-gradient(circle at 13% 78%,rgba(126,76,31,.14),transparent 34%),
    linear-gradient(145deg,rgba(6,8,5,.76),rgba(6,4,3,.91));
}
#photos .eyebrow,#photos .photo-placeholder span{color:#c5a45d!important}
#photos .photo-placeholder{
  background:linear-gradient(160deg,rgba(36,38,23,.40),rgba(8,6,4,.60))!important;
  border-color:rgba(193,158,82,.23)!important;
}

/* VIDEOS — deepest cinema black / moving-image room */
#videos{
  background:rgba(3,3,3,.91)!important;
}
#videos::before{
  background:
    radial-gradient(ellipse at 50% 0%,rgba(198,141,57,.12),transparent 35%),
    radial-gradient(circle at 88% 72%,rgba(102,45,28,.16),transparent 31%),
    linear-gradient(180deg,rgba(2,2,2,.72),rgba(4,3,2,.96));
}
#videos .eyebrow,#videos .video-card small{color:#d4a050!important}
#videos .video-card{
  background:linear-gradient(180deg,rgba(18,14,10,.55),rgba(3,3,3,.72))!important;
  border-color:rgba(212,160,80,.24)!important;
}

/* PUBLICATIONS — ink + antique paper undertone / editorial room */
#publications{
  background:rgba(12,9,7,.88)!important;
}
#publications::before{
  background:
    linear-gradient(105deg,rgba(114,82,47,.10) 0 1px,transparent 1px 58px),
    radial-gradient(circle at 18% 18%,rgba(185,134,75,.17),transparent 31%),
    linear-gradient(160deg,rgba(18,13,9,.76),rgba(6,5,4,.93));
}
#publications .eyebrow,#publications .publication-card small{color:#cba16d!important}
#publications .publication-card{
  background:linear-gradient(180deg,rgba(42,30,20,.42),rgba(7,5,4,.60))!important;
  border-color:rgba(199,155,98,.24)!important;
}

/* SOCIAL — ember + subtle wine / public connection room */
#social{
  background:rgba(11,6,5,.86)!important;
}
#social::before{
  background:
    radial-gradient(circle at 80% 24%,rgba(151,73,43,.24),transparent 35%),
    radial-gradient(circle at 17% 84%,rgba(195,137,55,.15),transparent 30%),
    linear-gradient(135deg,rgba(12,6,5,.76),rgba(5,4,3,.93));
}
#social .eyebrow,#social .social-card small,#social .social-card span{color:#d0a063!important}
#social .social-card{
  background:linear-gradient(155deg,rgba(49,22,18,.36),rgba(7,5,4,.62))!important;
  border-color:rgba(199,136,90,.25)!important;
}
#social .social-card:hover{background:linear-gradient(155deg,rgba(67,29,23,.46),rgba(10,7,5,.70))!important}

/* CONTACT — night river / quiet final room */
#contact{
  background:rgba(3,3,2,.94)!important;
}
#contact::before{
  background:
    radial-gradient(circle at 14% 30%,rgba(189,136,58,.13),transparent 30%),
    radial-gradient(circle at 87% 78%,rgba(93,45,29,.15),transparent 32%),
    linear-gradient(180deg,rgba(4,3,2,.78),rgba(2,2,1,.98));
}
#contact .eyebrow,#contact .contact-form label{color:#cda05d!important}
#contact .contact-form input,#contact .contact-form select,#contact .contact-form textarea{
  background:rgba(4,3,2,.58)!important;
  border-color:rgba(205,160,93,.27)!important;
}

/* room dividers and card rhythm */
#about,#music,#vintage,#journal,#photos,#videos,#publications,#social,#contact{
  box-shadow:inset 0 1px 0 rgba(238,194,111,.025)!important;
}
#about h2,#music h2,#vintage h2,#journal h2,#photos h2,#videos h2,#publications h2,#social h2,#contact h2{
  text-shadow:0 10px 34px rgba(0,0,0,.22)!important;
}

@media(max-width:640px){
  #about,#music,#vintage,#journal,#photos,#videos,#publications,#social,#contact{
    backdrop-filter:blur(1.6px) saturate(.92)!important;
  }
  #about::before,#music::before,#vintage::before,#journal::before,#photos::before,
  #videos::before,#publications::before,#social::before,#contact::before{
    opacity:.96;
  }
}

/* =====================================================================
   FINAL COLOR-HARDNESS PATCH — 22 AUG 2026
   User-approved locked composition preserved. This block only hardens
   contrast, amber/gold separation and panel depth across every public room.
   ===================================================================== */
:root{
  --hard-gold:#d7a44b;
  --hard-gold-hi:#efbd63;
  --hard-ivory:#f4e8d8;
  --hard-soft:#cbb9a2;
  --hard-line:rgba(226,172,78,.34);
}

/* Exact locked HOME image remains unchanged; grading is CSS-only. */
body::before{
  opacity:.94!important;
  filter:saturate(1.22) contrast(1.15) brightness(.82) sepia(.035)!important;
}
body::after{
  background:
    radial-gradient(circle at 72% 19%,rgba(219,126,31,.10),transparent 31%),
    linear-gradient(90deg,rgba(1,1,1,.82) 0%,rgba(2,2,1,.60) 32%,rgba(3,2,1,.16) 64%,rgba(2,2,1,.26) 100%),
    linear-gradient(180deg,rgba(2,2,1,.08) 0%,rgba(2,2,1,.10) 50%,rgba(2,2,1,.52) 100%)!important;
}

.header{
  background:rgba(3,2,1,.68)!important;
  border-bottom-color:rgba(226,172,78,.20)!important;
}
.hero{
  background:linear-gradient(90deg,rgba(3,2,1,.72) 0%,rgba(4,3,2,.52) 43%,rgba(8,4,2,.14) 74%,rgba(3,2,1,.18) 100%)!important;
}
.hero::after{
  background:linear-gradient(90deg,rgba(1,1,1,.42) 0%,rgba(2,2,1,.20) 40%,transparent 72%)!important;
}
.hero h1{color:var(--hard-ivory)!important;text-shadow:0 8px 30px rgba(0,0,0,.34)!important}
.hero h1 em,.hero h1 .memory-display{color:var(--hard-gold-hi)!important;text-shadow:0 7px 26px rgba(58,25,3,.34)!important}
.eyebrow,.panel-link,.text-link{color:var(--hard-gold)!important}
.lede,.muted,.card p,.archive-list p,.photo-placeholder p,.video-card p,.publication-card p,.social-card p,.song-card-copy p,.signature-copy p,.signoff{color:var(--hard-soft)!important}

/* Panels stay dark but stop smothering the color beneath them. */
.latest-home,.signature-films,.ambient-control{
  background:rgba(4,3,2,.80)!important;
  border-color:var(--hard-line)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.28)!important;
}
.reel-feature,.signature-card,.song-card,.featured-song,.feature-strip,
#about .card,#vintage .shelf-card,#photos .photo-placeholder,#videos .video-card,
#publications .publication-card,#social .social-card{
  border-color:rgba(226,172,78,.30)!important;
}

/* Stronger room separation while keeping one VOH visual DNA. */
#about{background:rgba(6,4,2,.75)!important}
#about::before{background:radial-gradient(circle at 18% 18%,rgba(226,160,66,.24),transparent 31%),radial-gradient(circle at 88% 72%,rgba(116,62,25,.26),transparent 35%),linear-gradient(135deg,rgba(4,3,2,.48),rgba(13,8,4,.75))!important}

#music{background:rgba(4,3,2,.70)!important}
#music::before{background:radial-gradient(ellipse at 78% 14%,rgba(239,166,60,.30),transparent 34%),radial-gradient(ellipse at 52% 100%,rgba(156,75,22,.23),transparent 43%),linear-gradient(180deg,rgba(4,3,2,.54),rgba(7,4,2,.82))!important}

#vintage{background:rgba(20,13,7,.79)!important}
#vintage::before{background:linear-gradient(90deg,rgba(116,76,35,.17) 0 1px,transparent 1px 34px),linear-gradient(rgba(145,94,43,.10) 0 1px,transparent 1px 34px),radial-gradient(circle at 22% 24%,rgba(218,146,65,.23),transparent 34%),linear-gradient(145deg,rgba(40,25,13,.70),rgba(8,5,3,.84))!important}

#journal{background:rgba(17,7,6,.81)!important}
#journal::before{background:repeating-linear-gradient(0deg,transparent 0 31px,rgba(231,190,115,.055) 32px 33px),radial-gradient(circle at 22% 30%,rgba(155,59,49,.38),transparent 37%),radial-gradient(circle at 86% 80%,rgba(121,54,24,.24),transparent 34%),linear-gradient(180deg,rgba(18,7,6,.68),rgba(7,3,2,.86))!important}

#photos{background:rgba(6,7,4,.78)!important}
#photos::before{background:radial-gradient(circle at 84% 17%,rgba(144,130,56,.23),transparent 31%),radial-gradient(circle at 13% 78%,rgba(158,78,24,.20),transparent 34%),linear-gradient(145deg,rgba(5,7,4,.67),rgba(5,3,2,.86))!important}

#videos{background:rgba(2,2,2,.84)!important}
#videos::before{background:radial-gradient(ellipse at 50% 0%,rgba(229,150,47,.19),transparent 35%),radial-gradient(circle at 88% 72%,rgba(135,46,22,.22),transparent 31%),linear-gradient(180deg,rgba(2,2,2,.62),rgba(3,2,1,.91))!important}

#publications{background:rgba(10,7,5,.80)!important}
#publications::before{background:linear-gradient(105deg,rgba(144,91,39,.13) 0 1px,transparent 1px 58px),radial-gradient(circle at 18% 18%,rgba(218,144,72,.24),transparent 31%),linear-gradient(160deg,rgba(17,11,6,.68),rgba(5,4,3,.87))!important}

#social{background:rgba(10,5,4,.78)!important}
#social::before{background:radial-gradient(circle at 80% 24%,rgba(184,67,34,.34),transparent 35%),radial-gradient(circle at 17% 84%,rgba(227,143,45,.22),transparent 30%),linear-gradient(135deg,rgba(12,5,4,.68),rgba(4,3,2,.87))!important}

#contact{background:rgba(3,2,1,.88)!important}
#contact::before{background:radial-gradient(circle at 14% 30%,rgba(220,143,45,.20),transparent 30%),radial-gradient(circle at 87% 78%,rgba(128,48,22,.20),transparent 32%),linear-gradient(180deg,rgba(3,2,1,.70),rgba(1,1,1,.94))!important}

/* Media receives a little more density without altering source files. */
.signature-poster,.song-card figure img,.selected-video{
  filter:saturate(1.08) contrast(1.10) brightness(.80) sepia(.035)!important;
}
.signature-clip{
  filter:saturate(1.07) contrast(1.10) brightness(.83) sepia(.025)!important;
}

@media(max-width:900px){
  body::before{opacity:.93!important;filter:saturate(1.20) contrast(1.14) brightness(.80) sepia(.035)!important}
}
@media(max-width:640px){
  body::before{opacity:.94!important;background-position:62% top!important;filter:saturate(1.20) contrast(1.15) brightness(.80) sepia(.035)!important}
  body::after{background:linear-gradient(90deg,rgba(1,1,1,.68),rgba(2,2,1,.12) 80%),linear-gradient(180deg,rgba(1,1,1,.06),rgba(1,1,1,.48))!important}
  .hero{background:linear-gradient(90deg,rgba(2,2,1,.58),rgba(2,2,1,.08) 80%)!important}
  #about,#music,#vintage,#journal,#photos,#videos,#publications,#social,#contact{backdrop-filter:blur(1.2px) saturate(1.08)!important}
}


/* =====================================================================
   FINAL iPHONE / WEBKIT HERO BACKDROP FIX — 22 AUG 2026
   Avoids iOS fixed-body pseudo background rendering failures.
   Mobile hero owns the locked backdrop directly; desktop remains unchanged.
   ===================================================================== */
@media (max-width: 900px){
  body::before,
  body::after{
    display:none!important;
    content:none!important;
  }

  .hero{
    background-image:
      linear-gradient(90deg,rgba(1,1,1,.64) 0%,rgba(2,2,1,.28) 42%,rgba(2,2,1,.06) 78%,rgba(1,1,1,.16) 100%),
      linear-gradient(180deg,rgba(1,1,1,.10) 0%,rgba(1,1,1,.04) 55%,rgba(1,1,1,.38) 100%),
      url("assets/images/site/voh-cinematic-backdrop-final-20260822.jpg")!important;
    background-size:cover,cover,cover!important;
    background-repeat:no-repeat!important;
    background-position:center,center,62% top!important;
    background-attachment:scroll,scroll,scroll!important;
    background-color:#030302!important;
  }

  .hero::after{
    background:linear-gradient(90deg,rgba(1,1,1,.34) 0%,rgba(2,2,1,.12) 45%,transparent 78%)!important;
  }
}

/* Explicit WebKit safety net. iPhone/iPad browsers all use WebKit. */
@supports (-webkit-touch-callout: none){
  @media (max-width: 900px){
    html,body{background:#030302!important;}
    body::before,body::after{display:none!important;content:none!important;}
    .hero{
      background-image:
        linear-gradient(90deg,rgba(1,1,1,.64) 0%,rgba(2,2,1,.28) 42%,rgba(2,2,1,.06) 78%,rgba(1,1,1,.16) 100%),
        linear-gradient(180deg,rgba(1,1,1,.10) 0%,rgba(1,1,1,.04) 55%,rgba(1,1,1,.38) 100%),
        url("assets/images/site/voh-cinematic-backdrop-final-20260822.jpg")!important;
      background-size:cover,cover,cover!important;
      background-repeat:no-repeat!important;
      background-position:center,center,62% top!important;
      background-attachment:scroll!important;
      -webkit-transform:translateZ(0);
      transform:translateZ(0);
    }
  }
}

/* =====================================================================
   FINAL SIGNATURE AI HERO INSERT + LOCKED TEXT-AREA DARKENING
   22 AUG 2026
   Keeps approved river backdrop. Shows the supplied combined Signature AI
   film in the pre-agreed hero slot. Mobile WebKit backdrop fix preserved.
   ===================================================================== */
.hero{
  display:grid!important;
  grid-template-columns:minmax(0,.82fr) minmax(300px,1.18fr)!important;
  column-gap:clamp(34px,5.2vw,92px)!important;
  align-items:center!important;
}
.hero-copy{
  width:100%!important;
  max-width:520px!important;
  position:relative!important;
  z-index:3!important;
}
.hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  pointer-events:none!important;
  background:linear-gradient(90deg,rgba(1,1,1,.58) 0%,rgba(2,2,1,.40) 28%,rgba(2,2,1,.14) 52%,transparent 72%)!important;
}
.hero::after{
  z-index:1!important;
  background:linear-gradient(90deg,rgba(1,1,1,.22) 0%,rgba(2,2,1,.10) 38%,transparent 70%)!important;
}
.hero-art.signature-hero{
  display:grid!important;
  min-height:520px!important;
  padding:0!important;
  margin:0!important;
  place-items:center!important;
  justify-self:end!important;
  width:min(100%,520px)!important;
  position:relative!important;
  z-index:3!important;
  opacity:1!important;
}
.signature-stage{
  width:min(100%,335px)!important;
  aspect-ratio:9/16!important;
  border:1px solid rgba(226,172,78,.32)!important;
  border-radius:2px!important;
  background:#050403!important;
  box-shadow:0 28px 86px rgba(0,0,0,.46),0 0 0 1px rgba(235,184,93,.05)!important;
}
.signature-stage:before{
  inset:-12px!important;
  transform:translate(16px,16px)!important;
  border-color:rgba(226,172,78,.17)!important;
}
.signature-clip{
  opacity:1!important;
  object-fit:cover!important;
  object-position:center center!important;
  filter:saturate(1.04) contrast(1.06) brightness(.86)!important;
}
.signature-veil{
  background:linear-gradient(180deg,rgba(4,3,2,.02) 52%,rgba(3,2,1,.18) 100%)!important;
}
.signature-badge,.signature-progress{display:none!important}

/* Robust narrow-mobile Vintage/Archive wrapping fix. */
@media(max-width:900px){
  .hero{
    display:block!important;
    min-height:auto!important;
    padding-bottom:54px!important;
  }
  .hero::before{
    background:linear-gradient(180deg,rgba(1,1,1,.26) 0%,rgba(2,2,1,.22) 48%,rgba(2,2,1,.07) 76%,transparent 100%)!important;
  }
  .hero-copy{width:100%!important;max-width:610px!important}
  .hero-art.signature-hero{
    width:100%!important;
    min-height:auto!important;
    margin:42px auto 0!important;
    justify-self:auto!important;
  }
  .signature-stage{width:min(78vw,330px)!important}

  #vintage .split{display:grid!important;grid-template-columns:1fr!important;gap:24px!important;align-items:start!important}
  #vintage .split>div{min-width:0!important;width:100%!important}
  #vintage h2,#vintage .muted,#vintage .text-link,#vintage .shelf-card strong,#vintage .shelf-card small{
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
  #vintage .archive-shelf{grid-template-columns:1fr!important;gap:0!important;width:100%!important;overflow:hidden!important}
  #vintage .shelf-card{width:100%!important;min-width:0!important;border-right:0!important}
}

@media(max-width:640px){
  .hero{
    padding-left:clamp(24px,9vw,44px)!important;
    padding-right:clamp(24px,9vw,44px)!important;
  }
  .hero::before{
    background:linear-gradient(180deg,rgba(1,1,1,.31) 0%,rgba(2,2,1,.22) 50%,rgba(2,2,1,.06) 78%,transparent 100%)!important;
  }
  .signature-stage{width:min(82vw,318px)!important}
  #vintage{padding-left:22px!important;padding-right:22px!important}
  #vintage h2{font-size:clamp(2.35rem,11.8vw,3.6rem)!important;line-height:.98!important}
  #vintage .muted{font-size:.98rem!important;line-height:1.55!important}
  #vintage .shelf-card{padding:24px 22px!important;min-height:150px!important}
  #vintage .shelf-card strong{font-size:clamp(1.55rem,7vw,2rem)!important;line-height:1.05!important}
}

/* =====================================================================
   SIGNATURE VIDEO + iPHONE FINAL VISIBILITY LOCK — cache-safe v2
   ===================================================================== */
.hero-art.signature-hero{
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:none!important;
  position:relative!important;
  z-index:4!important;
}
.signature-stage{
  overflow:hidden!important;
  background:#050403!important;
}
.signature-clip{
  display:block!important;
  width:100%!important;
  height:100%!important;
  opacity:1!important;
  visibility:visible!important;
  object-fit:cover!important;
}
@media(min-width:901px){
  .hero{
    display:grid!important;
    grid-template-columns:minmax(0,.82fr) minmax(320px,1.18fr)!important;
    align-items:center!important;
  }
  .hero-art.signature-hero{
    justify-self:end!important;
    width:min(100%,560px)!important;
    min-height:540px!important;
  }
  .signature-stage{width:min(100%,350px)!important;aspect-ratio:9/16!important}
}
@media(max-width:900px){
  .hero-art.signature-hero{
    display:grid!important;
    width:100%!important;
    min-height:auto!important;
    margin:34px auto 0!important;
    place-items:center!important;
  }
  .signature-stage{width:min(72vw,304px)!important;aspect-ratio:9/16!important}
}
@media(max-width:640px){
  .hero-art.signature-hero{margin-top:30px!important}
  .signature-stage{width:min(74vw,292px)!important}
}

/* ==========================================================
   VOH FINAL FONT MAP LOCK — 2026-08-23
   Cormorant Garamond + Cinzel + Montserrat
   ========================================================== */
:root{
  --voh-font-display:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --voh-font-caps:"Cinzel", "Times New Roman", serif;
  --voh-font-body:"Montserrat", "Avenir Next", Avenir, Arial, sans-serif;
}

/* Base supporting copy */
body,
p,
.lede,
.muted,
.signoff,
.card p,
.archive-list p,
.signature-copy p,
.song-card-copy p,
.photo-placeholder p,
.video-card p,
.publication-card p,
.social-card p,
.contact-form,
.footer,
.footer-links{
  font-family:var(--voh-font-body)!important;
  font-weight:300!important;
}

/* NAV FONT */
.nav a,
.menu{
  font-family:var(--voh-font-caps)!important;
  font-weight:500!important;
}

/* HERO EYEBROW FONT + shared editorial eyebrows */
.hero .eyebrow,
.section .eyebrow,
.compact-panel-head .eyebrow,
.signature-films .section-head .eyebrow,
.signature-copy small,
.song-card-copy small,
.feature-strip small,
.shelf-card small,
.photo-placeholder span,
.video-card small,
.publication-card small,
.social-card small,
.card>span{
  font-family:var(--voh-font-caps)!important;
  font-weight:500!important;
}

/* HERO MAIN TITLE FONT */
.hero h1,
.hero h1 .hero-main{
  font-family:var(--voh-font-display)!important;
  font-style:normal!important;
  font-weight:500!important;
}

/* HERO ACCENT FONT */
.hero h1 em.memory-display{
  font-family:var(--voh-font-display)!important;
  font-style:italic!important;
  font-weight:500!important;
}

/* HERO BODY FONT */
.hero .lede{
  font-family:var(--voh-font-body)!important;
  font-weight:300!important;
  letter-spacing:.005em!important;
}

/* BUTTON FONT */
.button,
.audio-button,
.contact-form button{
  font-family:var(--voh-font-caps)!important;
  font-weight:500!important;
}

/* UTILITY / SOUND BAR FONT */
.ambient-control,
.ambient-control button,
.ambient-control span{
  font-family:var(--voh-font-body)!important;
  font-weight:300!important;
}

/* CARD SECTION LABEL FONT */
.compact-panel-head .eyebrow,
.signature-films .section-head .eyebrow,
.panel-link{
  font-family:var(--voh-font-caps)!important;
  font-weight:500!important;
}

/* CARD FEATURE TITLE FONT */
.reel-copy strong{
  font-family:var(--voh-font-display)!important;
  font-style:italic!important;
  font-weight:500!important;
}

/* CARD TITLE FONT */
.signature-copy h3,
.latest-card strong,
.shelf-card strong,
.photo-placeholder strong,
.video-card strong,
.publication-card strong,
.social-card strong,
.card h3{
  font-family:var(--voh-font-display)!important;
  font-style:normal!important;
  font-weight:600!important;
}

/* AUDIO POPUP LABEL FONT */
.now-playing small,
.update-pop small{
  font-family:var(--voh-font-body)!important;
  font-weight:600!important;
}

/* AUDIO POPUP TITLE FONT */
.now-playing strong{
  font-family:var(--voh-font-display)!important;
  font-style:normal!important;
  font-weight:600!important;
}

/* AUDIO POPUP BODY FONT */
.now-playing span{
  font-family:var(--voh-font-body)!important;
  font-weight:300!important;
}

/* MUSIC CATEGORY FONT */
#music .feature-strip strong{
  font-family:var(--voh-font-display)!important;
  font-style:normal!important;
  font-weight:500!important;
}

/* MUSIC FEATURE HEADLINE FONT */
#music .featured-song h3.memory-display{
  font-family:var(--voh-font-display)!important;
  font-style:italic!important;
  font-weight:500!important;
}

/* MUSIC BODY FONT */
#music .muted,
#music .song-card-copy p{
  font-family:var(--voh-font-body)!important;
  font-weight:300!important;
}

/* MUSIC STATUS / BADGE FONT */
#music .audio-button{
  font-family:var(--voh-font-body)!important;
  font-weight:400!important;
}

/* MUSIC SECTION TITLE FONT */
#music .selected-head h3,
#music h2{
  font-family:var(--voh-font-display)!important;
  font-style:normal!important;
  font-weight:500!important;
}

/* ABOUT MAIN TITLE FONT */
#about .section-head h2{
  font-family:var(--voh-font-display)!important;
  font-style:normal!important;
  font-weight:500!important;
}

/* Remaining major editorial headings follow the locked display family */
.section h2,
.contact h2,
.journal-title,
blockquote{
  font-family:var(--voh-font-display)!important;
  font-weight:500!important;
}

/* Malayalam stays native and readable */
.malayalam-display,
[lang="ml"]{
  font-family:"Noto Sans Malayalam", "Gayathri", sans-serif!important;
}