/* A grid reveal into the benefits, followed by compositor-only text motion. */
.buildBenefits{position:relative;height:440vh;background:#040404;color:#f7f7f4;isolation:isolate}
.buildBenefits__sticky{position:sticky;top:0;height:100vh;display:grid;place-items:center;overflow:hidden;background:#050505;contain:paint}
.buildBenefits__pixels{position:absolute;top:0;left:0;pointer-events:none;image-rendering:pixelated;opacity:.58}
.buildBenefits__sticky::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#ffffff10 1px,transparent 1px),linear-gradient(90deg,#ffffff10 1px,transparent 1px);background-size:6.25vw 6.25vw}
.buildBenefits__intro{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8rem 3rem}
.buildBenefits__eyebrow{font:700 1.35rem/1 Archivo,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:#ddd9e5;margin:0 0 3rem}
.buildBenefits__intro h2{font:700 clamp(8rem,13vw,21rem)/.8 'PP Right',sans-serif;text-transform:uppercase;letter-spacing:.01em;margin:0}
.buildBenefits__intro h2 span{display:block}
.buildBenefits__intro h2 span:nth-child(2){color:#f1d95f}
.buildBenefits__sub{font:400 clamp(1.8rem,2vw,3rem)/1.25 Archivo,sans-serif;margin:3rem 0 0;color:#eeeaf4}
.buildBenefits__statements{position:absolute;inset:0;z-index:1;display:grid;place-items:center;pointer-events:none}
.buildBenefits__statement{grid-area:1/1;width:min(92vw,190rem);margin:0;text-align:center;text-transform:uppercase;font:700 clamp(7rem,12vw,19rem)/.82 'PP Right',sans-serif;letter-spacing:.005em;opacity:0;visibility:hidden}
.buildBenefits__statement span,.buildBenefits__statement strong{display:block}
.buildBenefits__statement strong{font:inherit;color:#f1d95f}
.buildBenefits__handoff{position:absolute;z-index:1;left:0;right:0;bottom:5vh;text-align:center;margin:0;font:500 clamp(1.4rem,1.5vw,2.1rem)/1.3 Archivo,sans-serif;color:#e2deea;letter-spacing:.02em;opacity:0}
/* Let supporting browsers drive the text on their scroll timeline. */
.buildBenefits--native{view-timeline:--website-benefits block}
.buildBenefits--native .buildBenefits__intro,.buildBenefits--native .buildBenefits__statement,.buildBenefits--native .buildBenefits__handoff{animation-duration:auto;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--website-benefits;animation-range:contain;will-change:transform,opacity}
.buildBenefits--native .buildBenefits__intro{animation-name:website-benefit-intro}
.buildBenefits--native .buildBenefits__statement{visibility:visible}
.buildBenefits--native .buildBenefits__statement:nth-child(1){animation-name:website-benefit-one}
.buildBenefits--native .buildBenefits__statement:nth-child(2){animation-name:website-benefit-two}
.buildBenefits--native .buildBenefits__statement:nth-child(3){animation-name:website-benefit-three}
.buildBenefits--native .buildBenefits__handoff{animation-name:website-benefit-handoff}
@keyframes website-benefit-intro{0%,9%{opacity:1;transform:translate3d(0,0,0)}21%,100%{opacity:0;transform:translate3d(0,-6vh,0)}}
@keyframes website-benefit-one{0%,15%{opacity:0;transform:translate3d(0,3vh,0) scale(.78)}25%,33%{opacity:1;transform:translate3d(0,0,0) scale(1)}43%,100%{opacity:0;transform:translate3d(0,-3vh,0) scale(1.1)}}
@keyframes website-benefit-two{0%,37.5%{opacity:0;transform:translate3d(0,3vh,0) scale(.78)}47.5%,55.5%{opacity:1;transform:translate3d(0,0,0) scale(1)}65.5%,100%{opacity:0;transform:translate3d(0,-3vh,0) scale(1.1)}}
@keyframes website-benefit-three{0%,60%{opacity:0;transform:translate3d(0,3vh,0) scale(.78)}70%,78%{opacity:1;transform:translate3d(0,0,0) scale(1)}88%,100%{opacity:0;transform:translate3d(0,-3vh,0) scale(1.1)}}
@keyframes website-benefit-handoff{0%,86%{opacity:0;transform:translate3d(0,20px,0)}96%,100%{opacity:1;transform:translate3d(0,0,0)}}
/* Preserve the ambient colour without continuously rasterising blurred orbs. */
.blurry-builds .gradBlobs__orb{display:none;animation:none;filter:none}
.blurry-builds .gradBlobs{background:radial-gradient(ellipse at 0 88%,#5956e899,transparent 38%),radial-gradient(ellipse at 98% 7%,#fece2266,transparent 30%)}
.blurry-builds .aiFeatures .gradBlobs{background:radial-gradient(ellipse at 0 10%,#fece2266,transparent 20%),radial-gradient(ellipse at 100% 25%,#5956e899,transparent 22%),radial-gradient(ellipse at 0 72%,#5956e899,transparent 24%),radial-gradient(ellipse at 95% 95%,#fece2266,transparent 24%)}
.blurry-builds .aiCta .gradBlobs{background:radial-gradient(ellipse at 100% 70%,#5956e899,transparent 40%)}
.blurry-builds .aiFeatures__card{will-change:auto}
.blurry-builds .aiFeatures__progressInner{width:100%;transform:scaleX(0);transform-origin:left center}
.blurry-builds .aiFeatures__progressInner::before{display:none}
.aiFeatures--native{view-timeline:--website-features block}
.aiFeatures--native .aiFeatures__card{animation:website-feature-slide auto linear both;animation-timeline:--website-features;animation-range:contain}
.aiFeatures--native .aiFeatures__progressInner{animation:website-feature-progress auto linear both;animation-timeline:--website-features;animation-range:contain}
@keyframes website-feature-slide{from{transform:translate3d(calc(var(--build-card-index) * (100vw - 10rem)),-50%,0)}to{transform:translate3d(calc((var(--build-card-index) - 4) * (100vw - 10rem)),-50%,0)}}
@keyframes website-feature-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.blurry-builds.reduce-motion .aiFeatures{height:auto;padding:6rem}
.reduce-motion .aiFeatures__sticky{position:static;height:auto}
.reduce-motion .aiFeatures__slides{display:grid;gap:3rem;height:auto}
.reduce-motion .aiFeatures__card{position:relative;top:auto;left:auto;width:100%;transform:none!important}
.reduce-motion .aiFeatures__progress{display:none}
.buildBenefits--flat{height:auto}
.buildBenefits--flat .buildBenefits__sticky{position:relative;height:auto;min-height:100vh;padding:12rem 3rem;display:flex;flex-direction:column;gap:9rem;background:linear-gradient(160deg,#211940,#050505 48%,#2d2510)}
.buildBenefits--flat .buildBenefits__pixels{display:none}
.buildBenefits--flat .buildBenefits__intro{position:relative;opacity:1;transform:none;padding:0}
.buildBenefits--flat .buildBenefits__statements{position:relative;display:grid;gap:8rem}
.buildBenefits--flat .buildBenefits__statement{grid-area:auto;opacity:1;visibility:visible;transform:none;font-size:clamp(5rem,9vw,12rem)}
.buildBenefits--flat .buildBenefits__handoff{position:relative;bottom:auto;opacity:1;transform:none}
.no-js .buildBenefits{height:auto}
.no-js .buildBenefits__sticky{position:relative;height:auto;min-height:100vh;padding:12rem 3rem;display:flex;flex-direction:column;gap:9rem}
.no-js .buildBenefits__pixels{display:none}
.no-js .buildBenefits__intro{position:relative;padding:0}
.no-js .buildBenefits__statements{position:relative;display:grid;gap:8rem}
.no-js .buildBenefits__statement{grid-area:auto;opacity:1;visibility:visible;font-size:clamp(5rem,9vw,12rem)}
.no-js .buildBenefits__handoff{position:relative;bottom:auto;opacity:1}
@media screen and (orientation:portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px){
 .buildBenefits{height:auto}
 .buildBenefits__sticky{position:relative;height:auto;min-height:0;padding:10rem 2rem;display:flex;flex-direction:column;gap:9rem;background:linear-gradient(160deg,#211940,#050505 48%,#2d2510)}
 .buildBenefits__sticky::after{background-size:18vw 18vw}
 .buildBenefits__pixels{display:none}
 .buildBenefits__intro{position:relative;padding:0;opacity:1!important;transform:none!important}
 .buildBenefits__eyebrow{font-size:1.1rem;margin-bottom:2rem}
 .buildBenefits__intro h2{font-size:20vw}
 .buildBenefits__sub{font-size:1.7rem;width:29rem;max-width:90vw}
 .buildBenefits__statements{position:relative;display:grid;gap:8rem}
 .buildBenefits__statement{grid-area:auto;opacity:1!important;visibility:visible!important;transform:none!important;font-size:15vw;width:90vw}
 .buildBenefits__handoff{position:relative;bottom:auto;opacity:1!important;transform:none!important;font-size:1.35rem}
}
@media(prefers-reduced-motion:reduce){
 .buildBenefits{height:auto}.buildBenefits__sticky{position:relative;height:auto;min-height:100vh;padding:12rem 3rem;display:flex;flex-direction:column;gap:9rem;background:linear-gradient(160deg,#211940,#050505 48%,#2d2510)}.buildBenefits__pixels{display:none}.buildBenefits__intro{position:relative;opacity:1!important;transform:none!important;padding:0}.buildBenefits__statements{position:relative;display:grid;gap:8rem}.buildBenefits__statement{grid-area:auto;opacity:1!important;visibility:visible!important;transform:none!important;font-size:clamp(5rem,9vw,12rem)}.buildBenefits__handoff{position:relative;bottom:auto;opacity:1!important;transform:none!important}
}

