/* ===== CINEMATIC HERO FILM — every page ===== */
.vhero{position:relative;height:172vh;height:172svh;background:var(--cream)}
.vhero .vh-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.vhero .vh-stage{position:absolute;inset:0;overflow:hidden;background:var(--c,#D6E6B8);
  clip-path:inset(var(--ty,0px) var(--tx,0px) var(--ty,0px) var(--tx,0px) round var(--rad,0px));will-change:clip-path}
.vhero video,.vhero .vh-post{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--op,62% 50%);
  transform:scale(var(--vs,1.14));transform-origin:62% 50%;will-change:transform}
.vhero .vh-post{z-index:0}
.vhero video{z-index:1;opacity:0;transition:opacity 1.2s ease}
.vhero.playing video{opacity:1}
.vhero .vh-wash{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,rgba(251,246,236,.94) 0%,rgba(251,246,236,.78) 24%,rgba(251,246,236,.28) 46%,rgba(251,246,236,0) 62%),
  linear-gradient(0deg,rgba(251,246,236,.5) 0%,rgba(251,246,236,0) 26%)}
/* letterbox bars that open like a cinema curtain */
.vhero .vh-lb{position:absolute;left:0;right:0;height:13vh;background:var(--cream);z-index:4;transition:transform 1.5s cubic-bezier(.7,0,.2,1) .15s}
.vhero .vh-lb.t{top:0}.vhero .vh-lb.b{bottom:0}
.vhero.open .vh-lb.t{transform:translateY(-101%)}.vhero.open .vh-lb.b{transform:translateY(101%)}
.vhero .vh-copy{position:absolute;z-index:3;left:max(24px,calc((100vw - 1180px)/2 + 24px));top:calc(50% - var(--off,0px)/2);transform:translateY(calc(-42% + var(--cy,0px)));
  max-width:min(560px,46vw);opacity:var(--co,1)}
.vhero .vh-copy .eyebrow{opacity:0;transform:translateY(14px);transition:all .9s ease 1.1s}
.vhero.open .vh-copy .eyebrow{opacity:.8;transform:none}
.vhero .vh-h{font-size:clamp(2.7rem,6vw,4.3rem);line-height:1.02;max-width:14ch}
.vhero .vh-h .ln{display:block;overflow:hidden;padding-bottom:.08em}
.vhero .vh-h .ln>span{display:inline-block;transform:translateY(112%);transition:transform 1.15s cubic-bezier(.2,.9,.2,1)}
.vhero.open .vh-h .ln>span{transform:none}
.vhero.open .vh-h .ln:nth-child(1)>span{transition-delay:.95s}
.vhero.open .vh-h .ln:nth-child(2)>span{transition-delay:1.1s}
.vhero.open .vh-h .ln:nth-child(3)>span{transition-delay:1.25s}
.vhero .vh-sub{margin:20px 0 26px;font-size:1.08rem;max-width:38ch;opacity:0;transform:translateY(16px);transition:all 1s ease 1.45s}
.vhero.open .vh-sub{opacity:1;transform:none}
.vhero .vh-cta{display:flex;gap:12px;flex-wrap:wrap;opacity:0;transform:translateY(16px);transition:all 1s ease 1.6s}
.vhero.open .vh-cta{opacity:1;transform:none}
/* sound + scroll cue */
.vhero .vh-snd{position:absolute;z-index:5;right:max(20px,calc((100vw - 1180px)/2 + 20px));bottom:calc(var(--ty,0px) + var(--off,0px) + 22px);display:flex;align-items:center;gap:10px;
  min-height:44px;padding:0 18px;border-radius:999px;border:0;background:rgba(255,253,248,.84);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  color:var(--ink);font:600 .86rem var(--body);cursor:pointer;box-shadow:0 8px 24px rgba(74,43,63,.14);opacity:0;transition:opacity .8s ease 1.8s}
.vhero.open .vh-snd{opacity:1}
.vhero .vh-snd .eq{display:flex;gap:2px;align-items:flex-end;height:14px}
.vhero .vh-snd .eq i{width:3px;height:4px;background:var(--ink);border-radius:2px}
.vhero.sound .vh-snd .eq i{animation:vheq .9s ease-in-out infinite}
.vhero.sound .vh-snd .eq i:nth-child(2){animation-delay:.2s}.vhero.sound .vh-snd .eq i:nth-child(3){animation-delay:.4s}.vhero.sound .vh-snd .eq i:nth-child(4){animation-delay:.1s}
@keyframes vheq{0%,100%{height:4px}50%{height:14px}}
.vhero .vh-cue{position:absolute;z-index:5;left:50%;bottom:calc(var(--ty,0px) + var(--off,0px) + 26px);transform:translateX(-50%);font:700 .7rem var(--body);letter-spacing:.2em;text-transform:uppercase;
  display:flex;flex-direction:column;align-items:center;gap:8px;opacity:calc(var(--co,1)*.8)}
.vhero .vh-cue i{width:1.5px;height:34px;background:linear-gradient(var(--ink),transparent);animation:vhcue 1.8s ease-in-out infinite;transform-origin:top}
@keyframes vhcue{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
/* chapter label ticks bottom-left */
.vhero .vh-tag{position:absolute;z-index:5;left:max(24px,calc((100vw - 1180px)/2 + 24px));bottom:calc(var(--ty,0px) + var(--off,0px) + 26px);font:400 1rem var(--acc);font-style:italic;opacity:0;transition:opacity .8s ease 2s}
.vhero.open .vh-tag{opacity:.8}
/* giant outlined wordmark that slides in as the film becomes a card */
.vhero .vh-word{position:absolute;z-index:0;left:0;right:0;bottom:2vh;text-align:center;font:400 clamp(6rem,22vw,20rem)/.8 var(--disp);color:transparent;
  -webkit-text-stroke:1.5px rgba(74,43,63,.16);letter-spacing:-.04em;transform:translateY(var(--wy,40%));pointer-events:none}
@media(max-width:900px){
  .vhero{height:158vh;height:158svh}
  .vhero video,.vhero .vh-post{object-position:var(--opm,70% 50%)}
  .vhero .vh-wash{background:linear-gradient(0deg,rgba(251,246,236,.97) 0%,rgba(251,246,236,.88) 30%,rgba(251,246,236,.35) 52%,rgba(251,246,236,0) 68%)}
  .vhero .vh-copy{left:20px;right:20px;top:auto;bottom:calc(var(--ty,0px) + var(--off,0px) + 78px);transform:translateY(var(--cy,0px));max-width:none}
  .vhero .vh-h{font-size:clamp(2.2rem,10vw,2.9rem)}
  .vhero .vh-sub{margin:12px 0 18px;font-size:.98rem}
  .vhero .vh-lb{height:9vh}
  .vhero .vh-tag{display:none}
  .vhero .vh-cue{display:none}
  .vhero .vh-snd{right:16px;bottom:calc(var(--ty,0px) + var(--off,0px) + 18px);min-height:40px;padding:0 14px;font-size:.8rem}
  .vhero .vh-cta .btn{min-height:46px}
}
@media(max-height:640px){.vhero .vh-sub{display:none}}
/* copy on the right when the subject sits left */
@media(min-width:901px){
  .vhero.r .vh-copy{left:auto;right:max(24px,calc((100vw - 1180px)/2 + 24px))}
  .vhero.r .vh-wash{background:linear-gradient(270deg,rgba(251,246,236,.94) 0%,rgba(251,246,236,.78) 24%,rgba(251,246,236,.28) 46%,rgba(251,246,236,0) 62%),linear-gradient(0deg,rgba(251,246,236,.5) 0%,rgba(251,246,236,0) 26%)}
  .vhero.r .vh-snd{right:auto;left:max(20px,calc((100vw - 1180px)/2 + 20px))}
  .vhero.r .vh-tag{left:auto;right:max(24px,calc((100vw - 1180px)/2 + 24px))}
  .vhero.c .vh-copy{left:50%;transform:translate(-50%,calc(-42% + var(--cy,0px)));text-align:center;max-width:720px}
  .vhero.c .vh-h{margin:0 auto}.vhero.c .vh-sub{margin-left:auto;margin-right:auto}.vhero.c .vh-cta{justify-content:center}
  .vhero.c .vh-wash{background:radial-gradient(ellipse at 50% 50%,rgba(251,246,236,.82) 0%,rgba(251,246,236,.5) 40%,rgba(251,246,236,.1) 75%)}
}