/* Transparent navigation inverts the actual pixels beneath it. */
.site-header{background:transparent;box-shadow:none;mix-blend-mode:difference;color:#fff;pointer-events:none;transition:transform .26s var(--ease);will-change:transform}
.site-header.is-scrolled{box-shadow:none}
.site-header .brand img{filter:brightness(0) invert(1)}
.site-header .header-note{color:inherit}
.site-header a,.site-header button{pointer-events:auto}
.site-header a:focus-visible,.site-header button:focus-visible{outline-color:#fff}
.site-header.is-hidden{transform:translateY(-110%)}
.site-header.is-hidden a,.site-header.is-hidden button{pointer-events:none}
.site-header:focus-within{transform:none}
.site-header:focus-within a,.site-header:focus-within button{pointer-events:auto}

/* The small hero window opens into one full-width, fixed-ratio reel. */
.hero{padding-bottom:24px}
.hero-bottom{display:block;position:relative;padding-top:48px}
.hero-summary{position:absolute;top:48px;left:0;max-width:48%;z-index:1}
.hero-summary .round-link{width:fit-content;margin-top:32px}
.reel-track{position:relative;aspect-ratio:16/9}
.showreel{width:32%;aspect-ratio:16/9;position:relative;margin-left:auto;isolation:isolate;overflow:hidden;border-radius:4px;background:var(--night);color:white}
.reel-media,.reel-media>img,.reel-media>video{position:absolute;inset:0;width:100%;height:100%}
.reel-media>img,.reel-media>video{object-fit:cover;max-width:none}
.reel-media:after{content:'';position:absolute;inset:0;background:none;pointer-events:none}
.reel-heading{position:absolute;top:20px;left:20px;right:20px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 16px;pointer-events:none}
.reel-title{font-size:clamp(13px,1.05vw,18px);font-weight:500;letter-spacing:-.025em}
.reel-label{font-size:12px;letter-spacing:.04em}
.reel-controls{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:4px;background:#091426d9;border:1px solid #ffffff30;border-radius:32px;padding:3px}
.reel-controls button{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;transition:background .18s,color .18s}
.reel-controls button[hidden]{display:none}
.showreel:not([data-ready]) .reel-controls{display:none}
.reel-controls button:disabled{opacity:.35;cursor:default}
.reel-controls button:hover:not(:disabled),.reel-controls button:focus-visible{background:var(--lime);color:var(--night)}
.reel-controls button:focus-visible{outline:2px solid white;outline-offset:3px}
.reel-controls .icon{width:18px;height:18px}
.reel-count{font-size:12px;min-width:59px;text-align:center;font-variant-numeric:tabular-nums}
.reel-empty{height:100%;display:grid;place-items:center;font-size:clamp(24px,5vw,72px);letter-spacing:-.05em}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(min-width:761px) and (prefers-reduced-motion:reduce){.hero-summary{position:static;max-width:none;margin-bottom:36px}.showreel{width:100%}}
@media(max-width:760px){
  .hero{padding-top:135px;padding-bottom:15px}
  .hero-bottom{padding-top:30px}
  .hero-summary{position:static;max-width:100%;margin-bottom:30px;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:22px}
  .hero-summary p{font-size:16px}
  .hero-summary .round-link{margin-top:0;gap:12px}
  .showreel{width:100%}
  .reel-heading{top:16px;left:16px;right:16px}
  .reel-title{font-size:13px}
  .reel-label{font-size:12px}
  .reel-controls{left:10px;bottom:10px;padding:1px;gap:0}
}
@media(prefers-reduced-motion:reduce){.site-header{transition:none}}
.reel-label{font-size:13px;letter-spacing:.12em}
@supports not (mix-blend-mode:difference){.site-header{background:var(--paper);color:var(--ink)}.site-header .brand img{filter:none}}