/* Five broad bands rise together as a continuous train. */
main#top[data-effect="lines"] .hero-blurs{background:#ff3826;isolation:isolate}
main#top[data-effect="lines"] .hero-blurs span{
 display:block;position:absolute;left:-20%;right:auto;top:100%;bottom:auto;
 width:140%;height:75vh;border-radius:0;filter:blur(32px);opacity:0;
 mix-blend-mode:normal;background:#ff3826;rotate:0deg;
 animation:hero-five-band-sweep 12s linear infinite;will-change:transform,opacity;
}
main#top[data-effect="lines"] .hero-blurs span:nth-child(1){--band-start:0vh;background:linear-gradient(100deg,#ff3826 0%,#ff842c 28%,#ffd282 55%,#ecebd5 78%,#e8eff0 100%)}
main#top[data-effect="lines"] .hero-blurs span:nth-child(2){--band-start:70vh;background:#fff8ee}
main#top[data-effect="lines"] .hero-blurs span:nth-child(3){--band-start:140vh;background:linear-gradient(100deg,#ff3826 0%,#ff842c 28%,#ffd282 55%,#ecebd5 78%,#e8eff0 100%)}
main#top[data-effect="lines"] .hero-blurs span:nth-child(4){--band-start:210vh;background:#2f0f0b}
main#top[data-effect="lines"] .hero-blurs span:nth-child(5){--band-start:280vh;background:linear-gradient(100deg,#ff3826 0%,#ff842c 28%,#ffd282 55%,#ecebd5 78%,#e8eff0 100%)}
@keyframes hero-five-band-sweep{
 0%,8.333%{transform:translateY(var(--band-start));opacity:0}
 8.334%{transform:translateY(var(--band-start));opacity:1}
 41.667%{transform:translateY(calc(var(--band-start) - 460vh));opacity:1}
 41.668%,100%{transform:translateY(calc(var(--band-start) - 460vh));opacity:0}
}
main#top:not(.hero-light-ready) .hero-blurs span{animation-play-state:paused}
main#top .hero-blurs::after{display:none!important}
@media(prefers-reduced-motion:reduce){main#top .hero-blurs span{animation:none!important;display:none!important}}

main#top[data-effect="plain"] .hero-blurs{background:#ff3826}
main#top[data-effect="plain"] .hero-blurs span,main#top[data-effect="plain"] .hero-blurs::after{display:none!important}
main#top[data-effect="original"] .hero-blurs{background:#ff3826}
main#top[data-effect="original"] .hero-blurs span:nth-child(n+4){display:none}
main#top[data-effect="original"] .hero-blurs::after{display:block!important}
main#top:not([data-effect="lines"]):not([data-effect="original"]) .entrance-word{color:#fff!important;filter:none!important}
.hero-version-picker{position:fixed;right:20px;bottom:20px;z-index:1000;opacity:.3;font:12px HK,Arial,sans-serif}
.hero-version-picker select{font:inherit;color:#fff;background:#252525;border:1px solid #ffffff50;border-radius:8px;padding:9px 28px 9px 12px;cursor:pointer}

/* V4: the first faster, broad light spots. */
main#top[data-effect="dots-fast"] .hero-blurs{background:#101014;isolation:isolate}
main#top[data-effect="dots-fast"] .hero-blurs span{display:block;opacity:1;filter:blur(35px);border-radius:46%;mix-blend-mode:screen;width:110vw;height:130vh;background:radial-gradient(ellipse,#ffe1a3 0%,#ffd48a 13%,#ff9b30 30%,#ff422b 49%,#c42128 59%,transparent 72%)}
main#top[data-effect="dots-fast"] .hero-blurs span:nth-child(1){left:-35%;top:25%;animation:dots-fast-one 10s cubic-bezier(.45,0,.55,1) infinite alternate}
main#top[data-effect="dots-fast"] .hero-blurs span:nth-child(2){right:-42%;bottom:-30%;opacity:.9;animation:dots-fast-two 13s cubic-bezier(.45,0,.55,1) infinite alternate}
main#top[data-effect="dots-fast"] .hero-blurs span:nth-child(3){left:15%;top:70%;width:95vw;height:110vh;opacity:.65;animation:dots-fast-three 8s cubic-bezier(.45,0,.55,1) infinite alternate}
main#top:is([data-effect="dots-fast"],[data-effect="dots-last"]) .hero-blurs span:nth-child(n+4){display:none}
@keyframes dots-fast-one{0%{transform:translate(-5%,25%) scale(.85)}50%{transform:translate(35%,-25%) scale(1.1,.85)}100%{transform:translate(65%,-65%) scale(.9,1.3)}}
@keyframes dots-fast-two{0%{transform:translate(10%,20%) scale(.9)}50%{transform:translate(-30%,-35%) scale(1.15)}100%{transform:translate(-80%,-10%) scale(1.3,.8)}}
@keyframes dots-fast-three{from{transform:translate(-25%,10%) scale(1,.75)}to{transform:translate(30%,-55%) scale(1.2,1.3)}}
/* V5: the last synchronized spots, before the line experiments. */
main#top[data-effect="dots-last"] .hero-blurs{background:#2f0f0b;isolation:isolate}
main#top[data-effect="dots-last"] .hero-blurs span{display:block;opacity:1;filter:blur(35px);border-radius:46%;mix-blend-mode:screen;width:110vw;height:130vh;background:radial-gradient(ellipse,#f3f3e8 0%,#e8e7cc 13%,#ffc278 30%,#ff3826 49%,#8b291d 59%,transparent 72%)}
main#top[data-effect="dots-last"] .hero-blurs span:nth-child(1){left:-35%;top:25%;animation:dots-last-one 12s linear infinite}
main#top[data-effect="dots-last"] .hero-blurs span:nth-child(2){right:-42%;bottom:-30%;opacity:.9;animation:dots-last-two 12s linear infinite}
main#top[data-effect="dots-last"] .hero-blurs span:nth-child(3){left:15%;top:70%;width:95vw;height:110vh;opacity:.65;animation:dots-last-three 12s linear infinite}
@keyframes dots-last-one{0%{transform:translate(-5%,25%) scale(.85);animation-timing-function:cubic-bezier(.22,.75,.25,1)}25%{transform:translate(35%,-25%) scale(1.1,.85)}50%{transform:translate(42%,-32%) scale(1.15,.9);animation-timing-function:cubic-bezier(.22,.75,.25,1)}75%{transform:translate(-12%,32%) scale(.8)}100%{transform:translate(-5%,25%) scale(.85)}}
@keyframes dots-last-two{0%{transform:translate(10%,20%) scale(.9);animation-timing-function:cubic-bezier(.22,.75,.25,1)}25%{transform:translate(-55%,-35%) scale(1.15)}50%{transform:translate(-63%,-27%) scale(1.2);animation-timing-function:cubic-bezier(.22,.75,.25,1)}75%{transform:translate(17%,27%) scale(.85)}100%{transform:translate(10%,20%) scale(.9)}}
@keyframes dots-last-three{0%{transform:translate(-25%,10%) scale(1,.75);animation-timing-function:cubic-bezier(.22,.75,.25,1)}25%{transform:translate(30%,-55%) scale(1.2,1.3)}50%{transform:translate(22%,-47%) scale(1.14,1.22);animation-timing-function:cubic-bezier(.22,.75,.25,1)}75%{transform:translate(-33%,18%) scale(.94,.7)}100%{transform:translate(-25%,10%) scale(1,.75)}}
/* V6: a simple background and headline color exchange. */
main#top[data-effect="fade"] .hero-blurs{animation:hero-simple-fade 4s ease-in-out infinite}
main#top[data-effect="fade"] .hero-blurs span{display:none}
main#top[data-effect="fade"] h1{animation:hero-simple-text 4s ease-in-out infinite}
main#top[data-effect="fade"] .entrance-word{color:inherit!important;filter:none!important}
@keyframes hero-simple-fade{0%,8.33%,83.33%,100%{background:#ff3826}33.33%,58.33%{background:#fff8ee}}
@keyframes hero-simple-text{0%,8.33%,83.33%,100%{color:#fff;filter:blur(0)}20.83%,70.83%{filter:blur(7px)}33.33%,58.33%{color:#ff3826;filter:blur(0)}}
@media(prefers-reduced-motion:reduce){main#top[data-effect] h1,main#top[data-effect] .hero-blurs{animation:none!important}}

/* V7: white opening, one transition to site red, then hold. */
main#top[data-effect="fade-once"] .hero-blurs{background:#fff8ee;animation:hero-once-background 2s ease-in-out .35s both}
main#top[data-effect="fade-once"] .hero-blurs span{display:none}
main#top[data-effect="fade-once"] h1{color:#ff3826;animation:hero-once-text 2s ease-in-out .35s both}
main#top[data-effect="fade-once"] .entrance-word{color:inherit!important;filter:none!important}
@keyframes hero-once-background{from{background:#fff8ee}to{background:#ff3826}}
@keyframes hero-once-text{0%{color:#ff3826;filter:blur(0)}50%{filter:blur(7px)}100%{color:#fff;filter:blur(0)}}
@media(prefers-reduced-motion:reduce){main#top[data-effect="fade-once"] .hero-blurs{animation:none;background:#ff3826}main#top[data-effect="fade-once"] h1{animation:none;color:#fff}}

/* V7: hold white, quick red transition, then slowly reveal the V2 background. */
main#top[data-effect="fade-once"] .hero-blurs{background:#ff3826;animation:none}
main#top[data-effect="fade-once"] .hero-blurs::before{content:"";position:absolute;inset:0;z-index:2;background:#fff8ee;animation:v7-white-cover .7s ease-in-out 2s both}
main#top[data-effect="fade-once"] .hero-blurs span:nth-child(-n+3){display:block;animation-play-state:running;opacity:0}
main#top[data-effect="fade-once"] .hero-blurs span:nth-child(1){animation:blur-drift-one 19s ease-in-out infinite alternate,v7-glow-in 5s ease-in-out 2.7s both}
main#top[data-effect="fade-once"] .hero-blurs span:nth-child(2){animation:blur-drift-two 24s ease-in-out infinite alternate,v7-glow-in 5s ease-in-out 2.7s both}
main#top[data-effect="fade-once"] .hero-blurs span:nth-child(3){animation:blur-drift-three 16s ease-in-out infinite alternate,v7-glow-in 5s ease-in-out 2.7s both}
main#top[data-effect="fade-once"] .hero-blurs::after{display:block!important;animation:v7-grain-in 5s ease-in-out 2.7s both}
main#top[data-effect="fade-once"] h1{animation:hero-once-text .7s ease-in-out 2s both}
@keyframes v7-white-cover{from{opacity:1}to{opacity:0}}
@keyframes v7-glow-in{from{opacity:0}to{opacity:.65}}
@keyframes v7-grain-in{from{opacity:0}to{opacity:.5}}
@media(prefers-reduced-motion:reduce){main#top[data-effect="fade-once"] .hero-blurs::before{display:none}main#top[data-effect="fade-once"] .hero-blurs span{display:none!important}main#top[data-effect="fade-once"] h1{animation:none;color:#fff}}

/* Match the page canvas to the hero's white opening. */
html:has(main#top[data-effect="fade-once"]),
body:has(main#top[data-effect="fade-once"]){animation:v7-page-background .7s ease-in-out 2s both}
@keyframes v7-page-background{from{background-color:#fff8ee}to{background-color:#ff3826}}
@media(prefers-reduced-motion:reduce){html:has(main#top[data-effect="fade-once"]),body:has(main#top[data-effect="fade-once"]){animation:none;background-color:#ff3826}}

.client-no-preview{cursor:default!important}
.client-logo:has(.client-coming-soon){position:relative;overflow:visible}
.client-coming-soon{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%);font-size:11px;white-space:nowrap;opacity:.5}

/* Keep the idle client heading legible; preview artwork still hides it. */
.trusted h2,.trusted h2.light-reveal{color:#fff;background:none;animation:none;-webkit-text-fill-color:#fff}
section.section-six .integration-logos img[src$="partner-mariana.svg"]{transform:scale(1.1)}
/* Hidden overflow must not auto-scroll the logo row when a logo gets focus. */
.trusted .logo-marquee{overflow:clip;overflow-anchor:none}
.trusted .logo-speed-edge{pointer-events:none}
.hero-version-picker{display:none}

.trusted h2.light-reveal{animation:trusted-title-return 1.6s ease-out both}
@keyframes trusted-title-return{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.client-preview-message{display:none;position:absolute;inset:0;align-items:center;justify-content:center;z-index:1;font-size:clamp(44px,7vw,100px);letter-spacing:-.035em;color:white;pointer-events:none}
.trusted:is([data-active-client="nike"],[data-active-client="balanced body"]) .client-preview-message{display:flex}
.trusted[data-active-client="nike"] .client-preview-message::after{content:"ask us"}
.trusted[data-active-client="balanced body"] .client-preview-message::after{content:"coming soon"}
.trusted:is([data-active-client="nike"],[data-active-client="balanced body"]) .client-phone-art,
.trusted:is([data-active-client="nike"],[data-active-client="balanced body"]) .client-device-set{display:none!important}

/* Restore the original white title sweep and reveal. */
.trusted h2{color:#fff;-webkit-text-fill-color:initial}
.trusted h2.light-reveal{
 --headline-base:#fff;background:linear-gradient(110deg,#fff 0%,#fff 35%,#ffb59a 43%,#fff 49%,#ff6845 53%,#fff 61%,#fff 100%);
 background-size:300% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
 animation:headline-reveal 1.4s ease-out both,headline-light 1.4s ease-out both;
 mask-image:linear-gradient(to right,#000 0%,#000 40%,transparent 60%,transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 0%,#000 40%,transparent 60%,transparent 100%);
 mask-size:250% 100%;-webkit-mask-size:250% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;
}
@media(prefers-reduced-motion:reduce){.trusted h2.light-reveal{animation:none;mask-image:none;-webkit-mask-image:none;background:none;color:white;-webkit-text-fill-color:white}}
/* Restore deliberate marquee acceleration at the outer side zones. */
.trusted .logo-speed-edge{pointer-events:auto}

.xponential-brand-family{display:none;position:absolute;left:50%;bottom:150px;transform:translateX(-50%);width:min(660px,80vw);align-items:center;justify-content:space-between;gap:32px;z-index:2;pointer-events:none}
.xponential-brand-family img{width:70px;height:42px;object-fit:contain}
.trusted[data-active-client="xponential"] .xponential-brand-family{display:flex}
@media(max-width:700px){.xponential-brand-family{bottom:120px;gap:16px}.xponential-brand-family img{width:44px;height:30px}}

.xponential-brand-family{bottom:auto;top:75px}
.trusted .curated-set[data-curated-brand="instructrr"] .curated-original{width:110.5%!important;max-height:71.5vh}
.trusted .client-device-set .hardware-screen .device-slide{background:var(--screen-extension,#000)}
.trusted .client-device-set .hardware-screen{background:var(--screen-extension,#000)}
.trusted .client-device-set .hardware-screen img{background:transparent}

.trusted .curated-set[data-curated-brand="instructrr"] .curated-original{width:93.925%!important;max-height:60.775vh}
/* Match the product reveal to the background crossfade. */
@keyframes client-product-arrive{from{opacity:0}to{opacity:1}}
.trusted .client-device-set.is-active,
.trusted.is-equinox .client-device-set[data-client="equinox"],
.trusted.is-myodetox .client-device-set[data-client="myodetox"],
.trusted.is-lesmills .client-device-set[data-client="lesmills"],
.trusted.is-swerve .client-device-set[data-client="swerve"]{animation:client-product-arrive 1100ms cubic-bezier(.4,0,.2,1) both}
.trusted .client-phone-art.client-phone-trio .client-device{transition:opacity 1100ms cubic-bezier(.4,0,.2,1)}
@media(prefers-reduced-motion:reduce){.trusted .client-device-set{animation:none!important}.trusted .client-phone-art .client-device{transition:none!important}}

.trusted .skop-background{filter:blur(7px) brightness(.75);transform:scale(1.06)}
/* No fallback devices between client previews. */
.trusted:not(.has-selected-client) .client-phone-art.client-phone-trio{visibility:hidden!important}
/* Keep departing product layers mounted until their delayed fade finishes. */
.trusted .client-device-set{animation:none!important}
.trusted .client-device-set.product-visible{display:flex!important}
.trusted .client-phone-art.client-phone-trio.product-visible{visibility:visible!important}
.trusted .client-phone-art.client-phone-trio.product-visible .client-device{opacity:1!important}
/* Product visibility is controlled by the sequential fade controller. */
.trusted .client-device-set:not(.product-visible){display:none!important}
.trusted .client-phone-art.client-phone-trio:not(.product-visible){visibility:hidden!important}
/* Immediate product changes; retain independent background crossfades. */
.trusted .client-device-set.product-visible,
.trusted .client-phone-art.client-phone-trio.product-visible{opacity:1;transition:none!important;animation:none!important}
.trusted .client-phone-art.client-phone-trio .client-device{transition:none!important}
.trusted .instructrr-background{filter:blur(8px) brightness(.6);transform:scale(1.06)}
.xponential-brand-family{top:85px;width:min(500px,80vw);justify-content:center;gap:28px}
@media(max-width:700px){.xponential-brand-family{gap:16px}}

/* Bring the XPASS scene closer. */
.trusted .xpass-background{background-size:cover;transform:scale(1.18);filter:blur(3px)}

/* Client-specific background refinements. */
.trusted[data-active-client="gain"] .client-backgrounds{background:linear-gradient(110deg,#400525 0%,#400e21 48%,#401e16 100%)}
.trusted[data-active-client="gain"] .client-backgrounds .client-background{opacity:0!important}
.trusted[data-active-client="gain"] .client-backgrounds::after{background:transparent}
.trusted .instructrr-background{filter:blur(4px) brightness(.6)}

/* TRX uses the same device scale as Les Mills. */
.trusted .curated-set[data-curated-brand="trx"]{width:min(94vw,1300px)}
.trusted .curated-set[data-curated-brand="trx"] .hardware-iphone{width:11%!important;order:1}
.trusted .curated-set[data-curated-brand="trx"] .hardware-ipad{width:36%!important;order:2}
.trusted .curated-set[data-curated-brand="trx"] .hardware-macbook{width:49%!important;order:3}

/* Match WW display height to the Xponential phones. */
.trusted .curated-set[data-curated-brand="weightwatchers"] .hardware-iphone{width:calc(min(59.04svh,547.2px,48vw) * .403)!important}

/* Place the workout CTA relative to the visible phone viewport. */
.trusted .gain-workout-screen{container-type:inline-size}
.gain-workout-footer{position:absolute;z-index:4;left:0;right:0;bottom:0;height:25cqw;background:#f5f5f5}
.gain-workout-footer span{position:absolute;left:10%;right:10%;bottom:10cqw;height:16cqw;display:flex;align-items:center;justify-content:center;border-radius:6cqw;background:#1d1d1b;color:#fff;font-family:Arial,sans-serif;font-weight:600;font-size:4.2cqw;box-shadow:0 3cqw 5cqw #0003}

/* One shared iPhone scale and centered baseline for phone-only previews. */
.trusted{--solo-phone-width:min(24svh,221px,16.5vw);--solo-phone-gap:clamp(8px,1.5vw,22px)}
.trusted .client-device-set:not(:has(> .hardware-ipad,> .hardware-macbook,> .hardware-watch,> .curated-original)){
 width:max-content!important;aspect-ratio:auto;gap:var(--solo-phone-gap)!important;align-items:flex-end!important;
}
.trusted .client-device-set:not(:has(> .hardware-ipad,> .hardware-macbook,> .hardware-watch,> .curated-original)) > .hardware-iphone{
 width:var(--solo-phone-width)!important;flex:0 0 var(--solo-phone-width)!important;margin:0!important;
}
.trusted .client-phone-art.client-phone-trio{
 width:max-content!important;height:auto!important;grid-template-columns:repeat(3,var(--solo-phone-width))!important;gap:var(--solo-phone-gap);
}
.trusted.is-xponential .client-phone-art.client-phone-trio{grid-template-columns:repeat(4,var(--solo-phone-width))!important}
.trusted .client-phone-trio .client-device{
 width:var(--solo-phone-width);height:auto;aspect-ratio:1350/2760;transform:translateY(.905797%);
}
.trusted .client-phone-trio .device-frame{position:relative;z-index:2}
.trusted .client-phone-trio .client-device .device-display{left:4%;top:4%;width:92%;height:92%;border-radius:22px;z-index:1}
.trusted .client-phone-trio .device-camera{display:none}

/* ShapeLog: connected tablet, dashboard and watch experiences. */
.trusted .curated-set[data-curated-brand="shapelog"]{width:min(94vw,1300px)}
.trusted .curated-set[data-curated-brand="shapelog"] .hardware-ipad{order:1}
.trusted .curated-set[data-curated-brand="shapelog"] .hardware-macbook{order:2}
.trusted .curated-set[data-curated-brand="shapelog"] .hardware-watch{order:3}
.trusted .curated-set[data-curated-brand="shapelog"] .hardware-ipad .device-slide img{width:104.4%;height:auto;left:-2.2%;top:-3%}
.trusted .curated-set[data-curated-brand="shapelog"] .hardware-watch .device-slide img{width:128.7%;height:179.2%;left:-13.3%;top:-43.75%;object-fit:fill}
.trusted[data-active-client="shapelog"] .client-backgrounds{background:#101014}
.trusted[data-active-client="shapelog"] .client-backgrounds .client-background{opacity:0!important}
.trusted[data-active-client="shapelog"] .client-backgrounds::after{background:transparent}


/* Give the ShapeLog mark more presence in the client row. */
.trusted .client-logo img[src*="shapelog-logo.svg"]{transform:scale(1.05)}

/* ShapeLog gym scene, softly blurred and darkened behind the products. */
.trusted .shapelog-background{filter:blur(7px) brightness(.5);transform:scale(1.06)}
.trusted[data-active-client="shapelog"] .client-backgrounds .shapelog-background.active{opacity:1!important}
.trusted[data-active-client="shapelog"] .client-backgrounds::after{background:linear-gradient(#10101420,#10101430 55%,#101014a0)}

/* Darker Nike preview background. */
.trusted .nike-background{filter:brightness(.6)}

/* Shared supporting text uses the team section typography across every section. */
body .subtitle,
body .trusted .trusted-description,
body .section-four .scroll-story p,
body .section-five .team-title-description{
 font-family:HK,Arial,sans-serif!important;
 font-size:calc(clamp(15px,1.4vw,19px) + 1px)!important;
 font-weight:400!important;line-height:1.6!important;letter-spacing:0!important;
}
@media(max-width:700px){
 body .subtitle,body .trusted .trusted-description,
 body .section-four .scroll-story p,body .section-five .team-title-description{font-size:16px!important}
}

/* Techie a-team supporting copy is one pixel smaller than the shared size. */
body .section-four .scroll-story.story-team p{font-size:clamp(15px,1.4vw,19px)!important}
@media(max-width:700px){body .section-four .scroll-story.story-team p{font-size:15px!important}}

/* Phone layouts: readable preview galleries and no horizontal page drift. */
html,body{overflow-x:clip}
@media(max-width:700px){
 .trusted{--solo-phone-width:min(36vw,170px);--solo-phone-gap:16px}
 .trusted .client-device-set:not(:has(> .hardware-ipad,> .hardware-macbook,> .hardware-watch,> .curated-original)),
 .trusted .client-phone-art.client-phone-trio{
  width:94vw!important;max-width:94vw;height:calc(var(--solo-phone-width) * 2.04445 + 8px)!important;
  justify-content:flex-start!important;align-items:flex-start!important;
  overflow-x:auto;overflow-y:hidden;pointer-events:auto;touch-action:pan-x;
  padding:0 12px 8px;scrollbar-width:none;scroll-snap-type:x proximity;overscroll-behavior-x:contain;
 }
 .trusted .client-phone-art.client-phone-trio{display:flex!important}
 .trusted .client-phone-trio .client-device{flex:0 0 var(--solo-phone-width);scroll-snap-align:start}
 .trusted .client-device-set:not(:has(> .hardware-ipad,> .hardware-macbook,> .hardware-watch,> .curated-original)) > .hardware-iphone{scroll-snap-align:start}
 .trusted .client-device-set::-webkit-scrollbar,.trusted .client-phone-trio::-webkit-scrollbar{display:none}
 nav .brand{min-height:44px}
 nav .links a{min-height:36px;display:flex;align-items:center}
 nav .links{row-gap:0}
 .section-four .scroll-story.story-team::before{width:120vw}
}

@media(max-width:700px){
 .section-four .scroll-story:not(.story-team) p{left:24px;width:calc(100% - 48px);max-width:none;padding:0}
}

@media(max-width:700px){
 .trusted h2{position:absolute;left:50%;right:auto;top:43%;width:calc(100% - 48px);transform:translate(-50%,-50%)!important;text-align:center}
 .contact-invitation a{display:inline-flex;align-items:center;min-height:44px}
}

/* Keep flywheel copy white and preserve its desktop geometry on narrow screens. */
.services-next .detail-copy{color:#fff}
@media(max-width:700px){
 .services-next .services-layout{position:absolute;left:50%;top:50%;width:700px;height:700px;transform:translate(-50%,-50%) scale(var(--mobile-wheel-scale,.5));transform-origin:center}
 .services-next .service-list [role="tab"]{font-size:26px}
 .services-next .curved-service{width:240px;height:80px}
 .services-next .service-list [role="tab"]:nth-child(n)>span:not(.service-number):not(.service-arrow){width:240px;height:80px}
 .services-next .service-detail{width:320px;max-width:46%}
 .services-next .detail-copy{font-size:30px;line-height:1.5}
}

.services-next .service-list [role="tab"]:hover,
.services-next .service-list [role="tab"]:focus-visible{color:#fff!important}
.services-next .service-list [role="tab"]:hover .curved-service text,
.services-next .service-list [role="tab"]:focus-visible .curved-service text{fill:#fff!important}
@media(max-width:700px){.services-next .service-list [role="tab"]{width:100px;height:90px}}

/* Story-specific copy placement. */
body .section-four .scroll-story.story-team p{bottom:58px}
body .section-four .scroll-story:not(.story-team) .story-scene{gap:20px}
body .section-four .scroll-story:not(.story-team) p{position:static;top:auto;bottom:auto;left:auto;width:100%;max-width:900px;padding:0;margin:0;transform:none!important}
@media(max-width:700px){body .section-four .scroll-story.story-team p{bottom:40px}}

/* Final team copy placement and subdued white. */
body .section-four .scroll-story.story-team p{bottom:68px;color:rgba(255,255,255,.6)}
@media(max-width:700px){body .section-four .scroll-story.story-team p{bottom:50px}}

body .section-four .scroll-story:not(.story-team) p{transition:opacity 650ms ease-out 200ms,filter 650ms ease-out 200ms}

@media(max-width:700px){
 .trusted .logo-marquee.scrolling-away .client-logo{pointer-events:auto!important}
}


body .section-four .scroll-story.story-team p{color:rgba(255,255,255,.5);bottom:78px}
@media(max-width:700px){body .section-four .scroll-story.story-team p{bottom:60px}}

/* Client previews announce their interaction before the first selection. */
.trusted .client-preview-hint{position:absolute;left:50%;top:var(--client-hint-top,55%);width:calc(100% - 48px);max-width:560px;margin:0;transform:translateX(-50%);font:400 15px/1.6 HK,Arial,sans-serif;text-align:center;color:rgba(255,255,255,.65);z-index:2;pointer-events:none;transition:opacity 200ms ease}
.client-preview-hint .hint-touch{display:none}
.trusted.has-selected-client .client-preview-hint{opacity:0}
@media(hover:none),(max-width:700px){.client-preview-hint .hint-desktop{display:none}.client-preview-hint .hint-touch{display:inline}}
.client-logo:has(.client-myx-note){position:relative}
.client-logo .client-myx-note{white-space:nowrap}

/* Partner marks are complete, comfortably sized links. */
section.section-six .integration-logos a{display:flex;align-items:center;justify-content:center;flex:0 1 140px;min-width:0;min-height:53px}
section.section-six .integration-logos a img{width:100%;max-width:100%;height:53px}
section.section-six .integration-logos a:hover img{opacity:.75}
section.section-six .integration-logos a:focus-visible{outline:2px solid #ff3826;outline-offset:8px;border-radius:2px}
@media(max-width:700px){
 section.section-six{height:auto;min-height:40svh;padding:35px 25px}
 section.section-six .integration-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 30px;max-width:300px}
 section.section-six .integration-logos a{width:110px;max-width:100%;min-height:48px;justify-self:center}
 section.section-six .integration-logos a img{height:42px}
 section.section-six .integration-logos a:last-child{grid-column:1/-1}
}

.trusted .client-preview-hint{opacity:0}
.trusted.client-hint-ready:not(.client-hint-dismissed):not(.has-selected-client) .client-preview-hint{opacity:1;transition:opacity 650ms ease}

section.section-six .integration-logos a,section.section-six .integration-logos a img{cursor:pointer;pointer-events:auto}

/* Blend the team-title backdrop into the section rather than casting black. */
.section-four .story-team h2::before{background:rgba(16,16,20,.65);box-shadow:none;inset:-35px -65px}

/* CSS animations sleep outside their own visible section or in a hidden tab. */
[data-runtime-active="false"] .hero-blurs span,
[data-runtime-active="false"] .team-orbit,
[data-runtime-active="false"] .team-orbit-person img,
body.runtime-suspended .hero-blurs span,
body.runtime-suspended .team-orbit,
body.runtime-suspended .team-orbit-person img{animation-play-state:paused!important}

/* Clipping must never turn client focus into an internal scroll jump. */
.trusted{overflow:clip}
@media(max-width:700px){
 .trusted h2,.trusted h2.light-reveal{position:absolute;left:50%;right:auto;top:43%;width:calc(100% - 48px);transform:translate(-50%,-50%)!important}
}

/* Contain masked portrait paint; avoid transient GPU seams while scrolling. */
.section-four .scroll-story.story-team{overflow:clip}
.section-four .scroll-story.story-team::before{
 transform:translate(-50%,-50%);backface-visibility:visible;
 outline:0;border:0;box-shadow:none;
}