/* Brand and film share one stage; keep the original frame visible on phones. */
:root{--hero-tail:144px;--hero-scrim:color-mix(in srgb,var(--primary) 96%,transparent)}
.hero{grid-template-columns:minmax(0,1fr);grid-template-areas:'stage' 'action';gap:var(--s3);padding-top:var(--s4)}
.hero-photo{grid-area:stage;align-self:start;width:100%}
.hero-media{overflow:hidden;border-radius:var(--r1);background:var(--primary);padding-bottom:var(--hero-tail)}
.hero-photo img{border-radius:0}
.hero-media video{height:calc(100% - var(--hero-tail));border-radius:0;object-fit:contain}
.hero-media:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,transparent calc(100% - var(--hero-tail) - 48px),var(--primary) calc(100% - var(--hero-tail)))}
.hero-copy{grid-area:stage;z-index:2;align-self:end;pointer-events:none;padding:var(--s6);margin-bottom:var(--s6)}
.hero .eyebrow{display:none}
.hero h1{font-size:28px;line-height:1.2;letter-spacing:-.045em;font-weight:550;color:var(--ivory);text-wrap:initial}
.hero-sub{font-size:14px;line-height:1.6;margin-top:var(--s3);color:var(--ivory);max-width:none}
.hero-action{grid-area:action;padding:0;margin:0;text-align:left}
.hero-action .button{width:100%}
.hero-photo figcaption{margin-top:var(--s1)}
.video-toggle{z-index:3;top:var(--s2);right:var(--s2);bottom:auto;box-shadow:none}
@media(min-width:760px){
 .hero{padding-top:var(--s4);gap:var(--s4)}
 .hero-media{padding-bottom:0}
 .hero-media video{height:100%}
 .hero-media:after{background:linear-gradient(to right,var(--hero-scrim),color-mix(in srgb,var(--primary) 78%,transparent) 24%,transparent 55%),linear-gradient(to bottom,transparent 65%,color-mix(in srgb,var(--primary) 85%,transparent) 100%)}
 .hero-copy{padding:var(--s8);margin-bottom:var(--s6);width:46%}
 .hero h1{font-size:clamp(32px,3.4vw,48px);line-height:1.15}
 .hero-sub{font-size:16px;margin-top:var(--s4)}
 .hero-action{display:flex;align-items:center;gap:var(--s4)}
 .hero-action .button{width:auto;min-width:224px}
 .hero-action .status{margin:0}
 .video-toggle{top:var(--s4);right:var(--s4)}
}
@media(min-width:1100px){.hero-copy{padding:var(--s12)}}
.hero-copy{margin-bottom:0}
/* Hide the skip link robustly; reveal only for deliberate keyboard navigation. */
.skip,.skip:focus{position:fixed;inset:0 auto auto 0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip:focus-visible{top:var(--s4);left:var(--s4);width:auto;height:auto;margin:0;padding:var(--s4);overflow:visible;clip-path:none;white-space:normal}
#main:focus{outline:none}
html{scroll-behavior:auto}