/* Orange and emerald light shared by the homepage header and hero. */
body.home-ambient{position:relative;isolation:isolate;background:#fff}
.home-ambient main{position:relative;z-index:1}
.home-ambient .reference-hero{background:transparent}
.hero-ambient{position:absolute;top:0;inset-inline-start:0;width:100%;height:var(--hero-ambient-height,0px);overflow:hidden;pointer-events:none;z-index:0;background:#fff;contain:paint}
/* A low-contrast light field, with broad overlapping forms rather than color spots. */
.hero-ambient-light{position:absolute;display:block;width:85%;height:105%;inset-inline-start:24%;top:0;border-radius:50%;filter:blur(55px);will-change:transform;animation:ambient-drift 18s ease-in-out infinite alternate}
.hero-ambient-light-orange{background:radial-gradient(ellipse,rgba(246,187,151,.55) 0%,rgba(250,216,194,.3) 38%,rgba(250,216,194,0) 70%);inset-inline-start:13%;top:0;animation-delay:-4s}
.hero-ambient-light-emerald{background:radial-gradient(ellipse,rgba(183,212,189,.5) 0%,rgba(220,236,219,.25) 38%,rgba(220,236,219,0) 70%);inset-inline-start:47%;top:14%;animation-name:ambient-drift-cool;animation-duration:21s;animation-delay:-9s}
.hero-ambient-light-mint{background:radial-gradient(ellipse,rgba(246,224,169,.5) 0%,rgba(251,240,212,.25) 38%,rgba(251,240,212,0) 70%);inset-inline-start:30%;top:-37%;animation-duration:16s;animation-delay:-11s}
.hero-ambient-light-purple{background:radial-gradient(ellipse,rgba(202,189,225,.5) 0%,rgba(228,220,240,.28) 38%,rgba(228,220,240,0) 70%);left:50%;top:-20%;animation-name:ambient-drift-cool;animation-duration:19s;animation-delay:-3s}
.hero-ambient::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 3%,rgba(255,255,255,.86) 25%,rgba(255,255,255,.15) 62%,transparent 100%),linear-gradient(180deg,rgba(255,255,255,.75),transparent 25%,transparent 78%,#fff 100%)}
.home-ambient .site-header.home-ambient-header:not(:hover):not(:has(:focus-visible)):not(:has(.menu-toggle[aria-expanded=true])){background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.hero-ambient.is-paused .hero-ambient-light{animation-play-state:paused}
@keyframes ambient-drift{0%{transform:translate3d(-12%,-6%,0) rotate(-12deg) scale(.95)}50%{transform:translate3d(9%,9%,0) rotate(8deg) scale(1.12)}100%{transform:translate3d(-3%,17%,0) rotate(-4deg) scale(1.04)}}
@keyframes ambient-drift-cool{0%{transform:translate3d(8%,9%,0) rotate(8deg) scale(1.08)}50%{transform:translate3d(-14%,-10%,0) rotate(-10deg) scale(.94)}100%{transform:translate3d(-4%,15%,0) rotate(5deg) scale(1.12)}}
@media(max-width:700px){
 .hero-ambient-light{width:160%;height:65%;filter:blur(35px)}
 .hero-ambient-light-orange{inset-inline-start:-65%;top:33%}
 .hero-ambient-light-emerald{inset-inline-start:0;top:52%}
 .hero-ambient-light-mint{inset-inline-start:-35%;top:18%}
 .hero-ambient-light-purple{inset-inline-start:5%;top:28%}
 .hero-ambient::after{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.9) 28%,rgba(255,255,255,.2) 58%,transparent 82%,#fff 100%)}
}
@media(prefers-reduced-motion:reduce){.hero-ambient-light{animation:none;will-change:auto}}

/* Keep the sticky navigation opaque as soon as the page leaves the top. */

/* Keep the scrolled surface opaque while preserving the shared interactive theme. */
.home-ambient .site-header:not(.home-ambient-header){
 background:var(--nav-surface);border:0;box-shadow:0 2px 12px #22221e08;
 backdrop-filter:none;-webkit-backdrop-filter:none;
 transition:background-color .3s ease,color .3s ease;
}

.home-ambient .reference-media.demo-showcase{border-color:#d5ded9;box-shadow:0 24px 64px -24px rgba(19,45,35,.22),0 4px 16px rgba(19,45,35,.06)}