:root{--aero-header-height:72px}
.site-header{background:transparent;backdrop-filter:none;border-bottom-color:transparent;transition:background .2s,border-color .2s}
.site-header.is-scrolled{background:color-mix(in srgb,var(--site-bg) 88%,transparent);backdrop-filter:blur(14px);border-bottom-color:var(--site-border)}
.hero{position:relative;isolation:isolate;padding-top:0}
.hero-intro{min-height:calc(85svh - 72px);padding:80px 0 60px;display:flex;flex-direction:column;justify-content:center;align-items:center}
.hero .product{margin-top:20px}
.hero-aero{position:absolute;z-index:-1;top:calc(-1 * var(--aero-header-height));left:50%;transform:translateX(-50%);width:100vw;height:calc(clamp(760px,118svh,1440px) + var(--aero-header-height));pointer-events:none;overflow:hidden;opacity:.9;mask-image:linear-gradient(to bottom,black 88%,transparent 100%)}
.hero-aero::after{position:absolute;content:"";inset:0;background:radial-gradient(ellipse 390px 230px at 50% 38%,color-mix(in srgb,var(--site-bg) 35%,transparent) 0%,transparent 100%)}
.hero-aero>.aero-shards{width:100%;height:100%}
:root[data-theme=light] .hero-aero{opacity:.6}

@media(max-width:640px){:root{--aero-header-height:64px}.hero-intro{min-height:calc(82svh - 64px);padding:70px 0 45px}.hero-aero{height:calc(106svh + var(--aero-header-height));min-height:760px;opacity:.85}.hero-aero::after{background:radial-gradient(ellipse 240px 240px at 50% 40%,color-mix(in srgb,var(--site-bg) 35%,transparent) 0%,transparent 100%)}}

@media(prefers-reduced-motion:reduce){.site-header{transition:none}}

/* One viewport-sized GPU surface follows a ribbon anchored to document coordinates. */
body{isolation:isolate}
.page-ribbon.hero-aero{position:fixed;inset:0;width:100%;height:100svh;min-height:0;left:0;transform:none;z-index:-1;opacity:.75;mask-image:linear-gradient(to right,black 0%,black 12%,rgba(0,0,0,.4) 38%,rgba(0,0,0,.4) 62%,black 88%,black 100%)}
.page-ribbon.hero-aero::after{display:none}
.hero{isolation:auto}
.ownership{background:transparent}
:root[data-theme=light] .page-ribbon.hero-aero{opacity:.4}
@media(max-width:640px){.page-ribbon.hero-aero{opacity:.5;mask-image:linear-gradient(to right,black,rgba(0,0,0,.35) 35%,rgba(0,0,0,.35) 65%,black)}}

/* Wider hero title; phrases stay together when narrower screens wrap. */
.hero-intro{max-width:100%}
.hero-intro h1{display:flex;justify-content:center;font-size:clamp(58px,5.25vw,88px);line-height:1.2;letter-spacing:-.045em;margin:0 0 30px;white-space:nowrap}
.hero-intro h1>.hero-title-clause{color:inherit}
@media(max-width:1000px){.hero-intro h1{flex-wrap:wrap;font-size:clamp(32px,6.2vw,60px);row-gap:.08em;letter-spacing:-.035em}}
