/* Navy/green hero with a white surface only behind the logo animation. */
.hero-surface{position:relative;isolation:isolate}
.hero-surface:before{content:'';position:absolute;inset:-120px 0 0;z-index:-1;background:radial-gradient(ellipse at 96% 12%,#20b36559 0%,#20b36508 52%,transparent 68%),radial-gradient(ellipse at 60% 110%,#20b36540 0%,transparent 58%),linear-gradient(116deg,var(--navy) 0%,var(--navy) 43%,#20b3654d 100%),var(--navy)}
.hero-surface .hero h1{color:var(--white)}
.hero-surface .hero h1 em{color:var(--green)}
.hero-surface .hero-description{color:var(--white)}
.hero-surface .hero-copy .button{color:var(--white);border-color:var(--white);box-shadow:0 8px 24px #042f5f26}
.hero-surface .hero-copy .button:hover{border-color:var(--white);box-shadow:0 10px 28px #042f5f4d}
.hero-surface .text-link{color:var(--white);text-decoration-color:var(--white)}
.hero-surface :is(a,button):focus-visible{outline-color:var(--white)}
.hero-surface .brand-reveal{padding-top:0;min-width:0}
.brand-reveal-scene{width:100%;aspect-ratio:600/520;contain:layout paint;isolation:isolate;background:var(--white);border-radius:18px}
.brand-reveal-scene>svg{display:block;width:100%;height:100%;stroke:none;stroke-width:0}
.hero-surface .brand-reveal-caption{margin:16px 0 0;text-align:center;font-size:11px;letter-spacing:.025em;color:var(--white)}
@media(max-width:600px){.hero-surface:before{background:radial-gradient(ellipse at 100% 80%,#20b36540 0%,transparent 62%),linear-gradient(155deg,var(--navy) 0%,var(--navy) 48%,#20b3654d 100%),var(--navy)}.hero-surface .hero{padding-bottom:48px}.hero-surface .brand-reveal{margin-top:8px}.hero-surface .brand-reveal-caption{font-size:10px;letter-spacing:0}}