/* Preserve the supplied photograph's complete 2400 × 941 composition. */
.home-page .site-header:not(.is-scrolled){background:#04030c;color:#f8f7ff}
.home-page .site-header:not(.is-scrolled) .brand-mark{color:#8153d7;background:linear-gradient(110deg,#8153d7,#5265ff);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.home-page .site-header:not(.is-scrolled) .nav-link{color:#c2bdce}
.home-page .site-header:not(.is-scrolled) .contact-link{border-color:#777183}
.home-page .site-header:not(.is-scrolled) .menu-toggle{color:#f8f7ff;border-color:#504859}
.home-page .site-header:not(.is-scrolled) .mobile-nav{background:#04030c;color:#f8f7ff;border-color:#504859}
.hero-banner{padding:0;background:#04030c;color:#faf9ff;isolation:isolate}
.hero-backdrop{width:100%}
.hero-backdrop img{display:block;width:100%;height:auto;aspect-ratio:2400/941;object-fit:contain}
.hero-content{position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-start;text-align:left;gap:0;width:100%}
.hero-banner .hero-copy{width:55%;padding:0 0 10px}
.hero-banner .eyebrow{font-size:11px;color:#cbc4d9;letter-spacing:.12em;margin-bottom:27px}
.hero-banner .hero-title{font-size:clamp(44px,4.65vw,74px);line-height:1.12;letter-spacing:-.055em;font-weight:500}
.hero-banner .color-text{color:#d9c9ff;background:none;-webkit-text-fill-color:currentColor}
.hero-banner .hero-description{max-width:440px;font-size:16px;line-height:1.85;color:#c9c4d3;margin-top:24px}
.hero-banner .hero-actions{margin-top:31px;flex-direction:row;align-items:center;gap:30px}
.hero-banner .btn-primary{background:#f5f1ff;color:#171127;border-color:#f5f1ff;min-height:50px}
.hero-banner .text-link{color:#f0eafa;font-size:13px;white-space:nowrap}
.hero-banner :focus-visible{outline-color:#d7baff}
/* The content sheet scrolls above a native sticky hero; reversing scroll unwinds it. */
.home-page #main{position:relative;isolation:isolate}
.home-page .hero-banner{position:sticky;top:var(--hero-pin-top,88px);z-index:0}
.home-content{position:relative;z-index:1;background:var(--color-base-100);display:flow-root}
.home-page .site-footer{position:relative;z-index:1}
@media(max-width:800px){.home-page .hero-banner{top:var(--hero-pin-top,76px)}}
@media(max-width:600px){.home-page .hero-banner{top:var(--hero-pin-top,72px)}}
@media(prefers-reduced-motion:reduce){.home-page .hero-banner{position:relative;top:auto}}
@media(hover:hover) and (pointer:fine){
 .hero-banner .btn-primary:hover{background:#ded2ff;border-color:#ded2ff}
 .hero-banner .text-link:hover{color:#d7baff}
 .home-page .site-header:not(.is-scrolled) .nav-link:hover{color:#fff}
}
@media(min-width:1800px){.hero-banner .hero-copy{width:60%}.hero-banner .hero-title{font-size:80px}}
@media(min-width:901px) and (max-width:1100px){
 .hero-banner .eyebrow{font-size:9px;margin-bottom:18px}
 .hero-banner .hero-title{font-size:46px}
 .hero-banner .hero-description{font-size:13px;max-width:360px;margin-top:18px}
 .hero-banner .hero-actions{margin-top:23px;gap:24px}
 .hero-banner .btn{padding:11px 20px;min-height:46px;font-size:12px}
}
/* On smaller screens the entire image sits below the copy, without cropping the subject. */
@media(max-width:900px){
 .hero-banner{display:flex;flex-direction:column;padding:0}
 .hero-backdrop{order:2}
 .hero-content{position:relative;inset:auto;order:1;padding-top:45px;padding-bottom:36px}
 .hero-banner .hero-copy{width:100%;padding:0}
 .hero-banner .hero-title{font-size:clamp(40px,7.5vw,62px)}
 .hero-banner .hero-description{max-width:490px;font-size:15px;margin-top:21px}
 .hero-banner .hero-actions{margin-top:27px}
 .hero-banner .eyebrow{font-size:10px;margin-bottom:23px}
}
@media(max-width:600px){
 .hero-content{padding-top:31px;padding-bottom:31px}
 .hero-banner .eyebrow{font-size:9px;letter-spacing:.085em;margin-bottom:22px}
 .hero-banner .hero-title{font-size:clamp(35px,10vw,52px)}
 .hero-banner .hero-description{font-size:14px;max-width:355px;margin-top:22px}
 .hero-banner .hero-actions{gap:23px;margin-top:27px}
 .hero-banner .btn-primary{min-height:48px}
 .hero-banner .text-link{font-size:12px;gap:12px}
}

/* Fluid hero buttons: soft color fill and responsive press feedback. */
.hero-banner .hero-actions{gap:16px;flex-wrap:wrap}
.hero-banner .hero-fluid-button{position:relative;isolation:isolate;overflow:hidden;justify-content:center;min-height:50px;padding:14px 26px;gap:0;transition:transform 160ms var(--ease-out),background-color 180ms ease,color 180ms ease,border-color 180ms ease}
.hero-banner .hero-fluid-secondary{background:rgba(245,241,255,.08);border-color:rgba(245,241,255,.35);color:#f5f1ff}
.hero-banner .hero-fluid-button::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(110deg,#3445e9,#8153d7);opacity:0;transition:opacity 180ms ease}
.hero-banner .hero-fluid-button:focus-visible{outline:2px solid #d7baff;outline-offset:4px}
@media(hover:hover) and (pointer:fine){
 .hero-banner .hero-fluid-button:hover{transform:translateY(-2px);color:#fff;border-color:transparent;background:transparent}
 .hero-banner .hero-fluid-button:hover::before{opacity:1}
}
.hero-banner .hero-fluid-button:active{transform:scale(.97)}
@media(max-width:600px){.hero-banner .hero-fluid-button{padding:12px 22px;min-height:48px}}
@media(prefers-reduced-motion:reduce){
 .hero-banner .hero-fluid-button:hover,.hero-banner .hero-fluid-button:active{transform:none}
 .hero-banner .hero-fluid-button{transition:background-color 180ms ease,color 180ms ease,border-color 180ms ease}
}

/* Keep the next section below the opening viewport. */
.home-page{--hero-header-height:88px}
.home-page .hero-banner{min-height:calc(100vh - var(--hero-header-height));min-height:calc(100svh - var(--hero-header-height))}
@media(min-width:901px){
 .hero-banner .hero-backdrop{position:absolute;inset:0;height:100%}
 .hero-banner .hero-backdrop img{height:100%;aspect-ratio:auto;object-fit:cover;object-position:right center}
 .hero-banner .hero-content{position:relative;inset:auto;min-height:inherit;padding-block:48px}
}
@media(max-width:900px){.hero-banner .hero-backdrop{margin-top:auto}}
@media(max-width:800px){.home-page{--hero-header-height:76px}}
@media(max-width:600px){.home-page{--hero-header-height:72px}}