@scope (.scroll-overview) {
.brand-intro{padding:24px 4vw 0}.brand-intro>div{display:flex;justify-content:space-between;align-items:end;gap:40px}.brand-intro h1{font-size:clamp(48px,5.8vw,84px);font-weight:500;line-height:1;letter-spacing:-.06em;margin:22px 0 25px}.brand-intro>div>p{font-size:14px;line-height:1.8;margin-bottom:30px}.brand-shortcuts{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;border-top:1px solid #25255c33}.brand-shortcuts a{display:flex;justify-content:space-between;padding:18px 0;font-size:12px}.brand-story{height:200svh}.brand-layout{flex:1;display:grid;grid-template-columns:37% 63%;align-items:center;min-height:0;gap:0}.brand-copy{padding:28px 40px 28px 0;z-index:3}.brand-copy>.eyebrow{color:var(--accent);font-size:9px}.brand-copy h2{font-size:clamp(48px,6vw,88px);font-weight:500;letter-spacing:-.06em;line-height:1;margin:15px 0 25px}.brand-copy h3{font-size:clamp(24px,2.6vw,38px);font-weight:400;line-height:1.3;letter-spacing:-.035em;margin:0 0 22px}.brand-copy .description{font-size:13px;line-height:1.85;max-width:340px}.brand-copy .material-actions{gap:19px}.brand-copy .tech-cta{font-size:11px;padding:14px 16px;gap:13px}.brand-copy .product-cta{font-size:11px}.material-credit{font-size:10px;color:#797e89;margin-top:22px}.brand-visual{height:85%;max-height:650px;min-height:350px;position:relative;margin-left:20px}.brand-photo{width:100%;height:100%;object-fit:cover;display:block;border-radius:3px;transform:scale(calc(1 + var(--p)*.025));transform-origin:center;will-change:transform}.brand-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#10121899,transparent 45%);pointer-events:none}.material-sample{position:absolute;left:-8%;top:6%;width:24%;margin:0;padding:8px;background:#f3f3eb;color:#25255c;border:1px solid #ffffff55;box-shadow:0 12px 45px #0005;z-index:4;transform-origin:center;transform:translate(calc(var(--p)*155%),calc(var(--p)*110%)) scale(calc(1 - var(--p)*.88));opacity:clamp(0,calc(1.4 - var(--p)*1.7),1);will-change:transform,opacity;pointer-events:none}.material-sample img{display:block;width:100%;height:95px;object-fit:cover;background:#14171d}.material-sample figcaption{padding:9px 3px 4px}.material-sample strong{display:block;font-size:16px;font-weight:600;letter-spacing:-.5px}.material-sample figcaption span{display:block;font-size:8px;line-height:1.5;margin-top:4px}.integration-point{position:absolute;left:43%;top:45%;display:flex;align-items:center;gap:8px;z-index:3;color:var(--accent);opacity:clamp(0,calc(var(--p)*4 - 2.5),1)}.integration-point i{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 7px #ffffff15}.integration-point span{font-size:8px;letter-spacing:1.2px;background:#101218cc;padding:7px}.integration-caption{position:absolute;bottom:22px;left:25px;right:25px;z-index:3;font-size:10px;color:#f3f3eb}.integration-caption>span:first-child{font-size:15px;color:var(--accent);display:block;margin-bottom:9px}.integration-before{display:block;opacity:calc(1 - var(--p))}.integration-after{display:block;position:absolute;bottom:0;opacity:var(--p)}#elecsuit .brand-photo{object-position:center}#wavewear .brand-photo{object-position:50% 40%}.brand-technology{padding:70px 4vw;background:#d9eb86;display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:center}.brand-technology h2{font-size:clamp(35px,4vw,60px);line-height:1.1;letter-spacing:-.05em;font-weight:500;margin:22px 0}.brand-technology>div>p:not(.eyebrow){font-size:16px;line-height:1.7;max-width:380px}.brand-technology a{display:inline-block;border-bottom:1px solid;padding-bottom:7px;margin-top:15px;font-size:13px}
@media(max-width:1100px) and (min-width:701px){.brand-layout{grid-template-columns:40% 60%}.brand-copy{padding-right:25px}.brand-copy .material-actions{gap:14px}.brand-copy .tech-cta,.brand-copy .product-cta{font-size:10px}.material-sample{width:27%}.material-sample img{height:75px}}
@media(max-width:700px){.brand-intro{padding:22px 6vw 0}.brand-intro>div{display:block}.brand-intro h1{font-size:49px;margin:24px 0 18px}.brand-intro>div>p{font-size:12px;margin-bottom:23px}.brand-shortcuts{gap:15px}.brand-shortcuts a{font-size:10px;padding:16px 0}.brand-story{height:190svh}.brand-layout{grid-template-columns:1fr;grid-template-rows:auto minmax(220px,1fr);padding-top:18px}.brand-copy{padding:0 0 18px}.brand-copy h2{font-size:43px;margin:8px 0 12px}.brand-copy h3{font-size:22px;line-height:1.2;margin:0 0 12px}.brand-copy h3 br{display:none}.brand-copy .description{font-size:11px;line-height:1.65;max-width:none;margin:0}.brand-copy .material-actions{margin-top:16px;gap:17px}.brand-copy .tech-cta{font-size:10px;padding:11px 12px}.brand-copy .product-cta{font-size:10px}.material-credit{display:none}.brand-visual{height:100%;min-height:0;margin:0 0 5px 18px}.material-sample{left:-6%;top:8%;width:28%;padding:5px}.material-sample img{height:48px}.material-sample figcaption{padding:5px 2px 2px}.material-sample strong{font-size:12px}.material-sample figcaption span{font-size:6px}.integration-caption{left:14px;right:14px;bottom:14px;font-size:8px}.integration-caption>span:first-child{font-size:12px}.integration-point span{font-size:6px}.brand-technology{padding:45px 6vw;grid-template-columns:1fr;gap:10px}.brand-technology h2{font-size:36px}.brand-technology>div>p:not(.eyebrow){font-size:14px}.story-top>span:nth-child(2){display:none}.story-top>span:last-child{font-size:7px}}
@media(prefers-reduced-motion:reduce){.brand-story{height:auto}.brand-photo{transform:none}.material-sample{transform:none;opacity:1}.integration-before{opacity:0}.integration-after{position:static;opacity:1}.integration-point{display:none}.brand-visual{height:430px}.brand-story .stage{min-height:720px}}
/* Floating material detail with an overlaid label. */
.material-sample{padding:0;background:#101218;border:0;border-radius:8px;overflow:hidden;box-shadow:0 10px 30px #0004;color:#fff;aspect-ratio:1.15}.material-sample img{width:100%;height:100%;object-fit:cover}.material-sample:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#090c13ed,transparent 80%);pointer-events:none}.material-sample figcaption{position:absolute;bottom:12px;left:13px;right:10px;padding:0;z-index:1}.material-sample strong{font-size:18px;font-weight:500;letter-spacing:-.5px;color:var(--accent)}.material-sample figcaption span{font-size:8px;color:#dedee5;margin-top:5px;line-height:1.4}
@media(max-width:700px){.material-sample{padding:0;border-radius:5px;aspect-ratio:1.05}.material-sample img{height:100%}.material-sample figcaption{left:8px;bottom:8px;right:6px;padding:0}.material-sample strong{font-size:13px}.material-sample figcaption span{font-size:6px;margin-top:3px}}
/* Product photography leads on the left; brand information follows on the right. */
@media(min-width:701px){.brand-layout{grid-template-columns:60% 40%}.brand-visual{grid-column:1;grid-row:1;margin-left:0;margin-right:25px}.brand-copy{grid-column:2;grid-row:1;padding:28px 0 28px 42px}.material-sample{left:auto;right:-5%;transform:translate(calc(var(--p)*-155%),calc(var(--p)*110%)) scale(calc(1 - var(--p)*.88))}.brand-copy .material-actions{gap:18px}}
@media(min-width:701px) and (max-width:1100px){.brand-layout{grid-template-columns:57% 43%}.brand-copy{padding-left:25px}.brand-visual{margin-right:15px}}
@media(max-width:700px){.brand-layout{grid-template-rows:minmax(220px,1fr) auto}.brand-visual{grid-row:1;margin:0 18px 16px 0}.brand-copy{grid-row:2;padding:0 0 12px}.material-sample{left:auto;right:-5%;transform:translate(calc(var(--p)*-155%),calc(var(--p)*110%)) scale(calc(1 - var(--p)*.88))}}
@media(prefers-reduced-motion:reduce){.material-sample{transform:none}}
/* Material detail enters the product from the left edge. */
.material-sample{left:-3%;right:auto;transform:translate(calc(var(--p)*155%),calc(var(--p)*110%)) scale(calc(1 - var(--p)*.88))}
@media(max-width:700px){.brand-visual{margin-left:10px;margin-right:0}.material-sample{left:-3%;right:auto}}
@media(prefers-reduced-motion:reduce){.material-sample{transform:none}}
/* Start the material swatch in the marked lower-left area of the product photo. */
.material-sample{left:3%;right:auto;top:55%;width:29%;aspect-ratio:1.65;transform:translate(calc(var(--p)*115%),calc(var(--p)*-90%)) scale(calc(1 - var(--p)*.88))}.material-sample figcaption{bottom:9px;left:11px}.material-sample strong{font-size:16px}.material-sample figcaption span{font-size:7px;margin-top:3px}
@media(max-width:700px){.material-sample{left:3%;top:55%;width:32%;aspect-ratio:1.65}.material-sample figcaption{bottom:6px;left:7px}.material-sample strong{font-size:11px}.material-sample figcaption span{font-size:5px;margin-top:2px}}
@media(prefers-reduced-motion:reduce){.material-sample{transform:none}}
/* Give the WaveWear athlete a stronger, centered presence. */
#wavewear .brand-visual{clip-path:inset(-1px round 3px)}
#wavewear .brand-photo{object-position:50% 38%;transform:scale(calc(1.3 + var(--p)*.025));transform-origin:50% 38%}
@media(prefers-reduced-motion:reduce){#wavewear .brand-photo{transform:scale(1.3)}}
/* Frame the athlete, rather than the center of the original photograph. */
#wavewear .brand-visual{background:#006474}
#wavewear .brand-photo{object-position:100% 45%;transform:translateX(-18%) scale(1.12);transform-origin:75% 50%}
#wavewear .integration-point{left:50%;top:76%}
#wavewear .material-sample{left:calc(3% + var(--p)*47%);top:calc(55% + var(--p)*21%);transform:translate(calc(var(--p)*-50%),calc(var(--p)*-50%)) scale(calc(1 - var(--p)*.88));transform-origin:center;opacity:clamp(0,calc((1 - var(--p))*5),1)}
@media(prefers-reduced-motion:reduce){#wavewear .material-sample{left:3%;top:55%;transform:none;opacity:1}}

/* Keep the absorption target registered to the knee in the displayed photo. */
#wavewear .brand-photo{mask-image:linear-gradient(to right,#000 80%,transparent 100%)}
#wavewear .integration-point{left:var(--knee-x,53%);top:var(--knee-y,82%)}
#wavewear .material-sample{left:calc(3%*(1 - var(--p)) + var(--knee-x,53%)*var(--p));top:calc(55%*(1 - var(--p)) + var(--knee-y,82%)*var(--p))}
@media(prefers-reduced-motion:reduce){#wavewear .material-sample{left:3%;top:55%}}

/* Register each material's destination to its actual garment application point. */
:is(#tracme,#elecsuit) .material-sample{left:calc(3%*(1 - var(--p)) + var(--target-x,50%)*var(--p));top:calc(55%*(1 - var(--p)) + var(--target-y,50%)*var(--p));transform:translate(calc(var(--p)*-50%),calc(var(--p)*-50%)) scale(calc(1 - var(--p)*.88));opacity:clamp(0,calc((1 - var(--p))*5),1)}
:is(#tracme,#elecsuit) .integration-point{left:var(--target-x,50%);top:var(--target-y,50%)}
@media(prefers-reduced-motion:reduce){:is(#tracme,#elecsuit) .material-sample{left:3%;top:55%;transform:none;opacity:1}}

/* Both overview introductions share the same headline scale and spacing. */
.brand-intro{padding:30px 4vw 38px}
.brand-intro>div{display:block}
.brand-intro>.eyebrow{margin-bottom:28px}
.brand-intro h1{max-width:1200px;font-size:clamp(46px,7.5vw,115px);font-weight:500;line-height:1.05;letter-spacing:-.06em;margin:0 0 24px}
.brand-intro>div>p{max-width:640px;margin:0;font-size:17px;line-height:1.7}
@media(max-width:700px){.brand-intro{padding:24px 4vw 28px}.brand-intro>.eyebrow{margin-bottom:22px}.brand-intro h1{font-size:clamp(36px,8.6vw,58px);margin:0 0 20px}.brand-intro>div>p{font-size:15px;margin:0}}

}