.hero{background:#071616;overflow:hidden}
.hero-films,.hero-shade{position:absolute;inset:0;pointer-events:none}
.hero-films{z-index:-2}
.hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;opacity:0;transition:opacity .8s ease}
.hero-film.is-active{opacity:1}
.hero-shade{z-index:-1;background:rgba(0,0,0,.38)}
.hero-copy{bottom:26%;max-width:80%;text-shadow:0 2px 25px #0003}
.hero-copy h1{font-size:clamp(60px,7.4vw,132px)}
.hero-controls{position:absolute;top:112px;right:var(--gutter);display:flex;align-items:center;gap:24px;color:white;z-index:3}
.hero-controls button{font:14px/1.3 Modena,Arial,sans-serif;color:inherit;min-height:44px;border:0;border-top:2px solid #ffffff50;background:#0005;padding:10px 12px;cursor:pointer}
.hero-controls button[aria-pressed=true]{border-color:white;background:#0008}
.hero-controls button:focus-visible{outline:2px solid white;outline-offset:4px}
.hero-controls span{margin-left:10px}.hero-controls .hero-pause{font-family:Arial,sans-serif;border-top:0;min-width:68px}
@media(max-width:760px){.hero{aspect-ratio:auto;min-height:650px;height:88svh;padding:0}.hero-copy{bottom:26%;max-width:calc(100% - 48px)}.hero-copy h1{font-size:clamp(46px,11.5vw,78px);line-height:1}.hero-copy>p{max-width:26ch;font-size:12px}.hero-controls{left:24px;right:24px;top:94px;gap:8px;justify-content:flex-end}.hero-controls button{font-size:12px;padding:8px}.hero-controls span{display:none}.hero-shade{background:rgba(0,0,0,.43)}}
@media(prefers-reduced-motion:reduce){.hero-film{transition:none}}
.hero-copy{bottom:88px}
.hero-copy h1{opacity:.7}
.hero-controls{top:auto;bottom:30px;left:var(--gutter);right:auto;gap:10px}
.hero-controls .hero-slide-button{position:relative;width:44px;height:32px;min-height:32px;padding:0;border:0;background:transparent}
.hero-controls .hero-slide-button::before{content:'';position:absolute;left:0;right:0;top:12px;height:7px;border:1px solid #ffffffb3;border-radius:999px;background:transparent;transition:background .25s}
.hero-controls .hero-slide-button[aria-pressed=true]{background:transparent;border:0}
.hero-controls .hero-slide-button[aria-pressed=true]::before{background:#ffffffb3}
.hero nav>a:hover,.hero nav>button:hover,.hero nav .more>button:hover{color:inherit;opacity:.7}
.hero nav a,.hero nav button{transition:opacity .2s}
.hero #more-links a:hover,.hero #more-links button:hover{color:inherit;opacity:.7}
.hero-loading{position:absolute;inset:0;display:flex;gap:12px;align-items:center;justify-content:center;pointer-events:none;color:#fff;z-index:2;font:13px/1.4 Arial,sans-serif}
.hero-loading[hidden]{display:none}
.hero-spinner{width:22px;height:22px;border:2px solid #ffffff40;border-top-color:#fff;border-radius:50%;animation:hero-spin .8s linear infinite}
@keyframes hero-spin{to{transform:rotate(360deg)}}
@media(max-width:760px){.hero-copy{bottom:90px}.hero-controls{top:auto;bottom:32px;left:24px;right:auto;justify-content:flex-start}}
@media(prefers-reduced-motion:reduce){.hero-spinner{animation:none}}