.hero {
  position: relative;
  min-height: min(920px, calc(100svh - var(--header-height,72px)));
  overflow: hidden;
  background: #020713;
}
.hero-slide {position:absolute;inset:0;opacity:0;transition:opacity 700ms ease;pointer-events:none}
.hero-slide.is-active {opacity:1;pointer-events:auto}
.hero-visual {position:absolute;inset:0;pointer-events:none;user-select:none}
.hero-backdrop {position:absolute;inset:-5%;background-position:center;background-size:cover;filter:blur(28px) brightness(.46) saturate(1.15)}
.hero-media {position:relative;width:100%;height:100%;object-fit:cover;object-position:center}
.hero-visual::after {position:absolute;inset:0;content:"";background:linear-gradient(180deg,#02071338,#02071314 48%,#030915)}
.hero-layout {position:relative;display:grid;height:100%;place-items:center}
.hero-copy {position:relative;z-index:2;max-width:1280px;padding:84px 0 180px;text-align:center}
.hero-logo {width:clamp(180px,15.6vw,300px);margin:0 auto 22px}
.hero-copy h1 {margin:0 0 26px;font-size:clamp(3.475rem,calc(4.1vw - 2px),4.775rem);letter-spacing:.04em;line-height:1;text-shadow:0 0 48px #004fff42;text-wrap:balance;white-space:pre-line}
.hero-copy p {max-width:720px;margin:0 auto;color:#b5c1dc;font-size:clamp(1rem,calc(1.5vw - 2px),1.125rem)}
.hero-navigation {position:absolute;z-index:3;top:50%;right:clamp(20px,2.6vw,50px);left:clamp(20px,2.6vw,50px);display:flex;justify-content:space-between;pointer-events:none;transform:translateY(-50%)}
.hero-navigation button {display:grid;width:44px;height:44px;padding:0;place-items:center;border:0;background:transparent;pointer-events:auto}
.hero-navigation img {width:17px;height:30px}
.hero-navigation button:last-child img {transform:rotate(180deg)}
.hero-dots {position:absolute;z-index:3;bottom:clamp(24px,5vh,60px);left:50%;display:flex;transform:translateX(-50%)}
.hero-dots button {display:grid;place-items:center;width:32px;min-height:44px;padding:0;border:0;background:transparent}
.hero-dots button::after {content:"";width:9px;height:9px;border:1px solid #ffffffb8;border-radius:50%;transition:width 180ms ease,border-radius 180ms ease,background 180ms ease}
.hero-dots button:hover::after,.hero-dots button:focus-visible::after,.hero-dots button[aria-current]::after {background:#fff}
.hero-dots button[aria-current]::after {width:26px;border-radius:99px}
@media(min-width:1024px) and (orientation:landscape) {
  .hero-layout {align-items:end;justify-items:end}
  .hero-copy {width:100%;padding:0 0 clamp(112px,14vh,160px);text-align:right}
  .hero-logo {margin-right:0;margin-left:auto}
  .hero-copy p {margin-right:0}
}
@media(max-width:767px) and (orientation:portrait) {
  .hero {min-height:calc(100svh - 64px)}
  .hero-copy {padding:52px 4px 38vh}
  .hero-logo {width:150px;margin-bottom:18px}
  .hero-copy h1 {margin-bottom:18px;font-size:clamp(2.875rem,calc(14vw - 2px),3.875rem);letter-spacing:-.04em;line-height:.98}
  .hero-copy p {font-size:.94rem}
  .hero-media {object-fit:contain}
  .hero-navigation {right:8px;left:8px}
  .hero-dots {bottom:24px}
}
@media(prefers-reduced-motion:reduce) {.hero-slide,.hero-dots button::after {transition:none}}