/* XL Athlete homepage. Layout, scale and motion modeled on a 120rem editorial canvas. */
:root{
  --white:#f2f2f2; --white-01:#e0e0e0; --white-02:#bbb;
  --grey:#979797; --grey-01:#727272; --grey-03:#292929;
  --black:#171717; --red:#e3263b;
  --display:"Inter Tight",ui-sans-serif,system-ui,Arial,sans-serif;
  --mono:"Geist Mono",ui-monospace,Menlo,monospace;
  --e-out:cubic-bezier(.22,1,.36,1);
  --e-cta:cubic-bezier(.4,0,.2,1);
  --e-expo:cubic-bezier(.16,1,.3,1);
}
html{font-size:clamp(6px,calc((100vw - var(--sbw,0px)) / 120),20px);-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{background:#fff;color:var(--black);font-family:var(--display);font-weight:500;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{display:block;max-width:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul{list-style:none}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
::selection{background:var(--red);color:#fff}

/* type */
.t-h1{font-size:11.25rem;font-weight:500;line-height:.8;letter-spacing:-.04em}
.t-h2{font-size:5rem;font-weight:500;line-height:1;letter-spacing:-.04em}
.t-bl{font-size:2rem;font-weight:500;line-height:1;letter-spacing:-.04em}
.t-bs{font-size:1rem;font-weight:400;line-height:1.4;letter-spacing:-.01em}
.t-mono{font-family:var(--mono);font-size:.875rem;font-weight:400;line-height:1.2;letter-spacing:-.02em;text-transform:uppercase}
.c-02{color:var(--white-02)} .c-g1{color:var(--grey-01)}

/* logo as mask, so it can be any color; XL keeps its gradient */
.logo-mask{position:relative;display:block;background:currentColor;-webkit-mask:url(/assets/img/xl-athlete-logo.png) left center/contain no-repeat;mask:url(/assets/img/xl-athlete-logo.png) left center/contain no-repeat;aspect-ratio:600/86}
.logo-mask .logo-xl{position:absolute;inset:0;background:linear-gradient(90deg,var(--red) 0%,#a23a8e 20%,#3a6fd8 36%);clip-path:inset(0 63% 0 0)}

/* ---------- animated CTA ---------- */
.cta{position:relative;display:inline-flex;align-items:stretch;gap:.25rem;overflow:hidden;--bg:var(--red);--fg:#fff}
.cta-white{--bg:var(--white);--fg:var(--black)}
.cta__label{display:inline-flex;align-items:center;justify-content:center;height:4.25rem;padding:0 1.25rem;background:var(--bg);color:var(--fg);white-space:pre;transition:transform .45s var(--e-cta);will-change:transform}
.cta__sq{position:relative;overflow:hidden;width:4.25rem;height:4.25rem;flex:none;transition:transform .45s var(--e-cta)}
.cta__a1,.cta__a2{position:absolute;inset:0;display:grid;place-items:center;background:var(--bg);color:var(--fg);transition:transform .45s var(--e-cta);will-change:transform}
.cta__a1{transform-origin:0 0}
.cta__sq2{position:absolute;left:0;top:0;width:4.25rem;height:4.25rem;overflow:hidden;pointer-events:none}
.cta__a2{transform-origin:100% 100%;transform:rotate(-90deg)}
.cta svg{width:1.25rem;height:1.25rem}
.cta.is-on .cta__label,.cta.is-on .cta__sq{transform:translate3d(var(--shift,4.5rem),0,0)}
.cta.is-on .cta__a1{transform:rotate(-90deg)}
.cta.is-on .cta__a2{transform:rotate(0)}

.sqbtn{display:grid;place-items:center;width:4.25rem;height:4.25rem;background:var(--white);color:var(--black);transition:filter .2s}
.sqbtn:hover{filter:brightness(.92)}
.sqbtn svg{width:1.25rem;height:1.25rem}
.sqbtn--prev svg{transform:rotate(180deg)}

/* plus corners */
.pl{position:absolute;z-index:10;display:grid;place-items:center;width:2rem;height:2rem;background:#fff}
.pl svg{width:1.21rem;height:1.21rem}
.pl-red{color:var(--red)} .pl-grey{color:var(--white-01)}
.pl-tl{left:-1rem;top:-1rem}.pl-tr{right:-1rem;top:-1rem}.pl-bl{left:-1rem;bottom:-1rem}.pl-br{right:-1rem;bottom:-1rem}

/* ---------- header ---------- */
.hd{position:fixed;inset:0 0 auto;z-index:50;height:5.25rem;--fg:var(--white);--bg:transparent;--btn-bg:var(--white);--btn-fg:var(--black);background:var(--bg);color:var(--fg);transition:height .6s var(--e-out),background-color .6s var(--e-out),color .6s var(--e-out),border-color .6s;border-bottom:1px solid transparent}
.hd.is-scrolled{height:2.75rem;--bg:#fff;--fg:var(--black);--btn-bg:var(--black);--btn-fg:#fff;border-bottom-color:var(--white-01)}
.hd.is-scrolled.is-dark{--bg:var(--black);--fg:var(--white);border-bottom-color:var(--grey-03)}
.hd__logo{position:absolute;left:1.75rem;top:50%;transform:translateY(-50%);width:11.3125rem;height:2.5rem;color:var(--fg)}
.hd__mark{position:absolute;left:1.25rem;top:50%;width:2.5rem;height:2.5rem;transform:translate(-50%,-50%) rotate(180deg);transition:left .6s var(--e-out),width .6s var(--e-out),height .6s var(--e-out),transform .6s var(--e-out),opacity .6s;color:var(--fg)}
.hd__mark svg{width:100%;height:100%}
.hd__word{position:absolute;left:0;top:50%;width:11.3125rem;transform:translateY(-50%);opacity:0;color:var(--fg);transition:opacity .6s var(--e-out)}
.hd.is-scrolled .hd__mark{left:.4rem;width:.75rem;height:.75rem;transform:translate(-50%,-50%) rotate(0);opacity:0}
.hd.is-scrolled .hd__word{opacity:1}
.hd__nav{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;gap:1.75rem}
.hd__nav a,.hd__more{color:var(--fg);transition:color .25s;white-space:pre}
.hd__nav a:hover,.hd__more:hover{color:var(--red)}
.hd__more{position:absolute;left:calc(50% + 21rem);top:50%;transform:translateY(-50%)}
.hd__plus{display:inline-block;margin-left:.15rem}
.hd__btn{position:absolute;right:1.75rem;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;height:4.25rem;padding:0 1.25rem;background:var(--btn-bg);color:var(--btn-fg);overflow:hidden;white-space:pre;transition:height .6s var(--e-out),padding .6s var(--e-out),background-color .6s var(--e-out),color .6s var(--e-out),gap .6s var(--e-out)}
.hd__btn:hover{background:var(--red);color:#fff}
.hd__btn-ar{display:inline-flex;width:0;opacity:0;overflow:hidden;transition:width .6s var(--e-out),opacity .6s var(--e-out)}
.hd__btn-ar svg{width:10px;height:10px;transform:rotate(-45deg)}
.hd.is-scrolled .hd__btn{height:1rem;padding:0;gap:.25rem;background:transparent;color:var(--red)}
.hd.is-scrolled .hd__btn-ar{width:10px;opacity:1}
.hd__menu{display:none}
.mm{display:none}

/* ---------- hero ---------- */
.hero{position:relative;height:100vh;min-height:50rem;overflow:hidden;isolation:isolate;color:var(--white)}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero__shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,transparent 18%,transparent 55%,rgba(0,0,0,.6) 100%)}
.hero__title{position:absolute;left:0;bottom:0;color:var(--white);white-space:nowrap}
.hero__side{position:absolute;right:1.75rem;bottom:1.75rem;display:flex;flex-direction:column;align-items:flex-end;gap:4rem}
.hero__copy{width:max-content;color:var(--white)}
.hero__cta{display:flex;width:100%;justify-content:flex-start}

/* ---------- marquee ---------- */
.mq{position:relative;z-index:10;height:7.375rem;overflow:hidden;background:var(--white);color:var(--black)}
.mq__track{position:absolute;inset:0 auto 0 0;display:flex;align-items:center;gap:6rem;will-change:transform}
.mq__group{display:flex;align-items:center;gap:6rem;flex:none}
.mq__brand{width:17.1875rem;flex:none;color:var(--black)}
.mq__item{font-size:2rem;font-weight:500;letter-spacing:-.04em;text-transform:uppercase;white-space:nowrap;color:var(--black)}

/* ---------- canvas helper ---------- */
.canvas{position:relative;width:120rem;margin:0 auto;height:100%}

/* ---------- what is ---------- */
.wi{position:relative;height:109.75rem;background:#fff;overflow-x:clip}
.px{position:absolute}
.px__o{position:absolute;inset:0;overflow:hidden;will-change:transform}
.px__i{position:absolute;inset:0;will-change:transform}
.px__img{position:absolute;left:0;width:100%;height:200%}
.px__img img{width:100%;height:100%;object-fit:cover}
.wi__tag{position:absolute;left:52.9375rem;top:20.1875rem;white-space:nowrap}
.wi__h{position:absolute;left:25.25rem;top:21.9375rem;width:69.5rem;text-align:center}
.wi__card{position:absolute;left:31.125rem;top:39.5rem;width:57.75rem;height:57.75rem}
.wi__box{position:absolute;inset:0;background:#fff;border:1px solid var(--white-01);overflow:hidden}
.wi__big{position:absolute;white-space:nowrap;color:var(--white-01);pointer-events:none;user-select:none}
.wi__b1{left:calc(50% - 29.375rem);top:30.4375rem}
.wi__b2{left:-2.875rem;top:39.3125rem}
.wi__b3{left:calc(50% + 15.875rem);top:39.3125rem}
.wi__b4{left:-3.625rem;top:48.1875rem}
.wi__text{position:absolute;left:1.25rem;top:1.25rem;width:47.75rem;display:flex;flex-direction:column;gap:1.75rem}
.wi__text>p:first-child{margin-bottom:-1rem}
.wi__btn{position:absolute;left:1.25rem;top:20.5rem}
.wi__spin{position:absolute;left:24.5rem;top:39.875rem;width:7.8125rem;height:7.8125rem;color:var(--red);will-change:transform}
.wi__spin svg{width:100%;height:100%}

/* ---------- services ---------- */
.sv{position:relative;background:#fff;padding:4rem 0 9rem;overflow-x:clip}
.sv__in{position:relative;max-width:120rem;margin:0 auto;padding:0 1.75rem}
.sv__head{position:relative;width:116.5rem;min-height:25rem}
.sv__tag{position:absolute;left:0;top:3.4375rem}
.sv__fill{text-indent:16.6667rem}
.sv__fill .fw{color:var(--white-01);transition:color .15s}
.sv__fill .fw.on{color:var(--black)}
.sv__grid{position:relative;margin-top:5rem;width:116.5rem;display:grid;grid-template-columns:repeat(2,58.25rem);grid-template-rows:repeat(2,48rem)}
.sv__cell{position:relative;will-change:transform}
.svc{position:relative;width:58.25rem;height:48rem}
.svc__box{position:absolute;inset:0;background:#fff;border:1px solid var(--white-01);overflow:hidden;padding:1.5rem;display:flex;flex-direction:column;justify-content:space-between}
.svc__top{display:flex;flex-direction:column;gap:1.5rem}
.svc__meta{display:flex;justify-content:space-between;align-items:center}
.svc__name{width:47rem;display:flex;justify-content:space-between}
.svc__img{position:relative;display:block;height:26.875rem;overflow:hidden;background:var(--white)}
.svc__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--e-out)}
.svc:hover .svc__img img{transform:scale(1.04)}
.svc__bot{display:flex;flex-direction:column;gap:1.75rem;align-items:flex-start}
.svc__desc{width:36.6875rem}

/* ---------- team / numbers ---------- */
.tm{position:relative;background:#fff;overflow-x:clip}
.tm__panel{position:relative;margin:0 auto;width:calc(100% - 56px);background:var(--black);color:var(--white);overflow-x:clip}
.tm__in{position:relative;width:116.5rem;margin:0 auto}
.tm__h{position:absolute;left:-1.3125rem;top:1.75rem;width:68.5625rem;font-size:11.25rem;font-weight:500;line-height:.8;letter-spacing:-.04em;text-transform:uppercase}
.tm__right{position:absolute;left:68.25rem;top:1.75rem;width:46.5rem;display:flex;flex-direction:column;gap:.75rem}
.tm__copy{display:flex;flex-direction:column;gap:1.25rem;font-size:2rem;line-height:1;letter-spacing:-.04em}
.tm__small{position:absolute;left:68.25rem;top:36.875rem;width:27.5rem;font-size:1rem;font-weight:400;line-height:1.4;letter-spacing:-.01em}
.tm__cta{position:absolute;left:68.25rem;top:42.75rem}
.tm__nums{position:absolute;left:50%;top:55rem;transform:translateX(-50%);text-align:center;white-space:nowrap}
.stat{position:absolute;left:0;width:116.5rem;height:27rem;z-index:10}
.stat .ln{position:absolute;overflow:hidden;margin:-1.75rem 0}
.stat [data-li]{padding:1.75rem 0;transform:translate3d(0,100%,0);will-change:transform}
.stat__label{font-size:11.25rem;font-weight:500;line-height:.8;letter-spacing:-.04em;text-transform:uppercase}
.stat__label span{display:block}
.stat--number .stat__label span{display:inline}
.stat__val{font-size:11.25rem;font-weight:500;line-height:.8;letter-spacing:-.04em;white-space:nowrap}
.stat__ar{width:8.1875rem;height:8.1875rem;color:var(--white)}
.stat__mark{display:block;width:7.9375rem;height:7.9375rem;color:var(--red)}
.stat__mark svg{width:100%;height:100%}
.pills{position:relative;height:2.5rem}
.pill{position:absolute;top:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid #4e4e4e;padding:.625rem;font-size:2rem;font-weight:400;line-height:1;letter-spacing:-.04em}
.stat__li{display:block;text-align:right;font-size:2rem;line-height:1;letter-spacing:-.04em;white-space:nowrap}
.stat__note{font-size:2rem;line-height:1.1;letter-spacing:-.04em;white-space:pre-line;text-align:right}
.tm__banner{position:absolute;left:0;top:139.6875rem;width:116.5rem;height:13.5625rem;overflow:hidden;z-index:1}
.tm__banner img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.tm__banner i{position:absolute;inset:0;background:linear-gradient(to right,var(--black) 0%,transparent 5%,transparent 95%,var(--black) 100%)}
.tm__floor{position:absolute;left:-1.1875rem;top:159.8125rem;width:118.9375rem;bottom:0;overflow:hidden;z-index:1}
.tm__floor img{width:100%;height:100%;object-fit:cover;object-position:top;filter:grayscale(1)}
.tm__floor i{position:absolute;inset:0;pointer-events:none}
.tm__floor .f1{height:101.8125rem;bottom:auto;background:linear-gradient(180deg,rgba(23,23,23,.4) 0%,rgba(23,23,23,.2) 46%,rgba(23,23,23,.2) 81.5%,var(--black) 100%)}
.tm__floor .f2{background:linear-gradient(to bottom,var(--black) 0%,rgba(23,23,23,0) 8%)}
.tm__floor .f3{background:linear-gradient(to right,var(--black) 0%,transparent 5%,transparent 95%,var(--black) 100%)}
.tm__end{position:absolute;left:-2.8125rem;top:201.375rem;font-size:17.125rem;font-weight:500;line-height:.8;letter-spacing:-.04em;white-space:pre;z-index:20}
.tm__end2{position:absolute;right:0;top:228.83rem;font-size:17.125rem;font-weight:500;line-height:.8;letter-spacing:-.04em;text-align:right;z-index:20}
.tm__endcta{position:absolute;left:50%;top:233.5625rem;transform:translateX(-50%);z-index:20}
.tm__spacer{height:242.5rem}

/* ---------- process ---------- */
.pr{position:relative;background:#fff;height:calc(111.75rem + 88px);overflow-x:clip}
.pr__in{position:relative;width:120rem;margin:0 auto;display:flow-root}
.pr__sticky{position:sticky;top:6rem;margin-left:1.75rem;margin-top:9.75rem;width:47.9375rem;display:flex;flex-direction:column}
.pr__h{width:47.9375rem;margin-top:.9375rem}
.pr__cta{align-self:flex-start;margin-top:20.625rem}
.pr__copy{margin-top:1.75rem;width:46.5rem;display:flex;flex-direction:column;gap:1.25rem}
.pr__cards{position:absolute;left:59.875rem;top:9.75rem;display:flex;flex-direction:column}
.step{position:relative;width:38.1875rem;background:#fff;border:1px solid var(--white-01);will-change:transform,opacity}
.step+.step{margin-top:-1px}
.step__in{padding:2.25rem 2.25rem 1.1875rem}
.step__meta{display:flex;align-items:center}
.step__lab{width:7.5rem;flex:none}
.step__label{white-space:nowrap}
.step__num{margin-left:auto}
.step__t{margin-top:7.1875rem}
.step__b{margin-top:2.75rem;width:28.5rem}

/* ---------- featured ---------- */
.ft{position:relative;height:97.5625rem;background:var(--black);color:var(--white);overflow:hidden}
.ft__in{position:relative;width:120rem;height:100%;margin:0 auto}
.ft__q{position:absolute;left:1.625rem;top:5.25rem;display:flex;gap:5.5625rem;z-index:2}
.ft__left{width:53.5625rem;display:flex;flex-direction:column;gap:7.5rem}
.ft__name{display:flex;align-items:center;gap:1.375rem}
.ft__title{width:47.9375rem;display:block;transition:opacity .45s ease}
.ft__title:hover{color:var(--red)}
.ft__right{width:46.5rem;display:flex;flex-direction:column;gap:2.25rem;transition:opacity .45s ease}
.ft__quote{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden}
.ft__timer{position:relative;width:4.25rem;height:4.25rem;flex:none}
.ft__timer span{position:absolute;inset:0}
.ft__timer svg{width:100%;height:100%}
.ft__t0{color:var(--grey-03)}
.ft__t1{color:var(--white);clip-path:inset(0 100% 0 0)}
.ft__timer.run .ft__t1{animation:fillLogo var(--dur,9850ms) linear forwards}
.ft__timer.run{animation:compassTurn 650ms cubic-bezier(.7,0,.3,1) var(--dur,9850ms) forwards}
@keyframes fillLogo{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes compassTurn{from{transform:rotate(0)}to{transform:rotate(1turn)}}
.wsp{display:inline-block;opacity:0;transform:translateY(.5em);transition:opacity .6s ease,transform .6s var(--e-expo)}
.wsp.in{opacity:1;transform:none}
.ft__big{position:absolute;font-size:17.125rem;font-weight:500;line-height:.8;letter-spacing:-.04em;text-transform:uppercase;white-space:nowrap;pointer-events:none;user-select:none;color:var(--white)}
.ft__cards{position:absolute;left:1.625rem;top:39.6875rem;display:flex;gap:1.25rem;z-index:2;transition:transform .7s var(--e-expo);will-change:transform}
.fcard{position:relative;display:block;width:77.0625rem;height:45.125rem;overflow:hidden;flex:none;background:var(--grey-03)}
.fcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.fcard>i{position:absolute;inset:0;background:rgba(23,23,23,.4)}
.fcard__txt{position:absolute;inset:0;pointer-events:none;will-change:transform}
.fcard__txt span{position:absolute;top:21.5625rem;color:var(--white)}
.fcard__txt span:first-child{left:2.25rem}
.fcard__txt span:last-child{right:2.25rem;text-align:right}
.ft__nav{position:absolute;left:109.125rem;top:88.5625rem;display:flex;gap:.5rem;z-index:3}

/* ---------- footer ---------- */
.fo{background:#fff}
.fo__in{width:120rem;margin:0 auto;padding:1.75rem;display:flex;flex-direction:column;gap:1rem}
.fo__panel{position:relative;background:var(--white);overflow:hidden}
.fo__news{height:26rem}
.fo__ghost{position:absolute;left:50%;top:13.75rem;transform:translateX(-50%);font-size:13rem;font-weight:500;line-height:.8;letter-spacing:-.04em;text-transform:uppercase;color:var(--white-01);white-space:nowrap;pointer-events:none}
.fo__news-row{position:absolute;top:1.5rem;left:1.5rem;display:flex;gap:28rem;align-items:flex-start}
.fo__news-l{display:flex;flex-direction:column;gap:1rem;width:38rem}
.fo__news-r{display:flex;flex-direction:column;gap:.625rem;width:38.125rem}
.fo__picks{display:flex;gap:.25rem}
.fo__picks a{flex:1;display:flex;align-items:center;justify-content:center;height:3.25rem;padding:0 .75rem;background:#fff;font-size:.75rem;transition:background .2s,color .2s}
.fo__picks a:hover{background:var(--red);color:#fff}
.fo__fine{font-size:.75rem;color:var(--white-02)}
.fo__main{height:60rem}
.fo__photo{position:absolute;top:1.75rem;left:1.75rem;width:46rem;height:33.375rem;overflow:hidden;background:#e8e8e8}
.fo__photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.fo__links{position:absolute;top:1.75rem;left:68.5625rem;display:flex;flex-direction:column;gap:2rem;font-size:2rem;line-height:1;letter-spacing:-.04em}
.fo__links>div{display:flex;flex-direction:column;gap:1rem}
.fo__row{display:flex;gap:2rem;flex-wrap:wrap;align-items:baseline}
.fo__row a{position:relative;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.3rem;transition:color .2s}
.fo__row a:hover{color:var(--red)}
.fo__word{position:absolute;left:1.75rem;right:1.75rem;top:39.5rem;height:19rem}
.fo__bar{position:absolute;left:1.5rem;right:1.5rem;height:4px;background:var(--black)}
.fo__bar-t{top:0}.fo__bar-b{bottom:0}
.fo__x{position:absolute;width:38px;height:38px}
.fo__x::before,.fo__x::after{content:"";position:absolute;background:var(--black)}
.fo__x::before{left:50%;top:0;bottom:0;width:4px;transform:translateX(-50%)}
.fo__x::after{top:50%;left:0;right:0;height:4px;transform:translateY(-50%)}
.fo__x-tl{left:0;top:-17px}.fo__x-tr{right:0;top:-17px}.fo__x-bl{left:0;bottom:-17px}.fo__x-br{right:0;bottom:-17px}
.fo__logo{position:absolute;left:4.5rem;right:4.5rem;top:50%;transform:translateY(-50%);width:auto;color:var(--black);-webkit-mask-position:center;mask-position:center}
.fo__bottom{display:flex;justify-content:space-between;padding:.5rem 0 0;font-size:.75rem;color:var(--grey-01)}
.fo__bl{display:flex;gap:1.5rem}
.fo__bl a:hover{color:var(--red)}

/* ---------- page wipe ---------- */
.wipe{position:fixed;inset:0;z-index:100;pointer-events:none;visibility:hidden}
.wipe i{position:absolute;top:0;height:100%;left:calc(100% / 6 * var(--i) - 1px);width:calc(100% / 6 + 2px);background:var(--black);transform:scaleX(0);transform-origin:left;transition:transform .33s var(--e-expo) calc(var(--i) * 55ms)}
.wipe.on{visibility:visible}
.wipe.on i{transform:scaleX(1)}
.wipe__mark{position:absolute;left:1.5rem;top:50%;width:6rem;height:6rem;transform:translateY(-50%);color:var(--white);opacity:0;transition:opacity .15s ease-out .5s}
.wipe__mark svg{width:100%;height:100%}
.wipe.on .wipe__mark{opacity:1}

/* ======================= MOBILE (< 768px) ======================= */
@media (max-width:767px){
  html{font-size:min(16px,calc(100vw / 26.875))}
  .t-h2{font-size:2.25rem}
  .t-bl{font-size:1.5rem}
  .t-bs{font-size:.875rem;line-height:1.3}
  .t-mono{font-size:.75rem}
  .br-d{display:none}

  .hd{height:3.5rem}
  .hd.is-scrolled{height:3.5rem}
  .hd__nav,.hd__more,.hd__btn{display:none}
  .hd__logo{left:1rem;width:2rem;height:2rem}
  .hd__mark{left:50%;width:2rem;height:2rem}
  .hd.is-scrolled .hd__logo{width:8rem}
  .hd.is-scrolled .hd__word{width:8rem}
  .hd__menu{display:block;position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:var(--fg)}
  .mm{display:flex;flex-direction:column;align-items:center;gap:.5rem;position:fixed;inset:3.5rem 0 0;z-index:40;background:#fff;color:var(--black);padding:2rem 1rem;opacity:0;pointer-events:none;transition:opacity .3s ease-out}
  .mm.open{opacity:1;pointer-events:auto}
  .mm a:not(.cta){font-size:2.25rem;letter-spacing:-.04em;padding:.35rem 0}
  .mm .cta{margin-top:1.5rem}
  body.menu-open .hd{--bg:#fff;--fg:var(--black)}

  .hero{height:100svh;min-height:40rem}
  .hero__title{font-size:3.6rem;left:.5rem;bottom:12rem;white-space:normal;line-height:.85}
  .hero__side{left:1rem;right:1rem;bottom:1.5rem;align-items:stretch;gap:1.5rem}
  .hero__copy{width:auto}
  .mq{height:5.125rem}
  .mq__group,.mq__track{gap:2.5rem}
  .mq__brand{width:12.5rem}
  .mq__item{font-size:1.4rem}

  .canvas{width:auto;height:auto}
  .wi{height:auto;padding:2.5rem 1rem 3rem}
  .wi__canvas{display:flex;flex-direction:column}
  .px{display:none}
  .wi__tag,.wi__h,.wi__card,.wi__text,.wi__btn,.wi__big,.wi__spin{position:static}
  .wi__h{width:auto;text-align:left;margin-top:.75rem}
  .wi__card{position:relative;width:auto;height:auto;margin-top:2.5rem}
  .wi__box{position:relative;padding:1rem;display:flex;flex-direction:column;gap:1.5rem}
  .wi__text{width:auto;gap:1rem}
  .wi__text>p:first-child{margin-bottom:0}
  .wi__big{display:none}
  .wi__spin{width:4rem;height:4rem;align-self:flex-end}
  .pl{width:1.5rem;height:1.5rem}.pl-tl{left:-.75rem;top:-.75rem}.pl-tr{right:-.75rem;top:-.75rem}.pl-bl{left:-.75rem;bottom:-.75rem}.pl-br{right:-.75rem;bottom:-.75rem}

  .sv{padding:2.5rem 0 4.25rem}
  .sv__in{padding:0}
  .sv__head{width:auto;min-height:0;padding:0 1rem}
  .sv__tag{position:static;margin-bottom:.75rem}
  .sv__fill{text-indent:0}
  .sv__grid{width:auto;display:block;margin-top:2.75rem}
  .sv__cell{transform:none!important}
  .svc{width:auto;height:auto}
  .svc__box{position:relative;border-left:0;border-right:0;border-bottom:0;padding:1rem;gap:1.25rem}
  .sv__cell:last-child .svc__box{border-bottom:1px solid var(--white-01)}
  .svc__name{width:auto;flex:1;margin-left:1.25rem}
  .svc__img{height:12.5rem}
  .svc__desc{width:auto}
  .svc .pl-bl,.svc .pl-br{display:none}
  .sv__cell:last-child .svc .pl-bl,.sv__cell:last-child .svc .pl-br{display:grid}
  .svc .pl-tl{left:.25rem}.svc .pl-tr{right:.25rem}.svc .pl-bl{left:.25rem}.svc .pl-br{right:.25rem}

  .tm__panel{width:100%!important}
  .tm__in{width:auto;padding:0 1rem 3rem;display:flex;flex-direction:column}
  .tm__h,.tm__right,.tm__small,.tm__cta,.tm__nums,.stat,.tm__end,.tm__end2,.tm__endcta,.stat .ln{position:static;transform:none}
  .tm__h{width:auto;font-size:4.2rem;margin:0 -.5rem;padding-top:1rem}
  .tm__right{width:auto;margin-top:2rem}
  .tm__copy{font-size:1.5rem}
  .tm__small{width:auto;margin-top:1.5rem}
  .tm__cta{margin-top:1.5rem}
  .tm__nums{margin:4rem 0 1rem}
  .stat{width:auto;height:auto;display:grid;grid-template-columns:1fr auto;align-items:end;gap:.5rem 1rem;padding:1.5rem 0;border-top:1px solid var(--grey-03)}
  .stat .ln{margin:0;width:auto!important;overflow:visible}
  .stat [data-li]{padding:0;transform:none}
  .stat .ln:first-child{grid-column:1/3}
  .stat__label{font-size:2.6rem}
  .stat__val{font-size:5rem}
  .stat__ar,.stat__mark{display:none}
  .stat .ln:has(.stat__ar),.stat .ln:has(.stat__mark){display:none}
  .pills{display:flex;flex-wrap:wrap;gap:.4rem;height:auto}
  .pill{position:static;font-size:1.2rem;padding:.4rem}
  .stat__li,.stat__note{font-size:1.1rem;text-align:left}
  .stat--list .ln:not(:first-child):not(:has(.stat__val)){display:inline-block}
  .tm__banner,.tm__floor{display:none}
  .tm__end{font-size:5.4rem;margin:4rem -.5rem 0;white-space:normal}
  .tm__end2{font-size:5.4rem;text-align:left;margin:0 -.5rem}
  .tm__endcta{margin-top:1.5rem}
  .tm__spacer{display:none}

  .pr{height:auto;padding:2.5rem 0 3rem}
  .pr__in{width:auto}
  .pr__sticky{position:static;margin:0;width:auto;padding:0 1rem}
  .pr__h{width:auto}
  .pr__cta{margin-top:1.5rem}
  .pr__copy{width:auto;margin-top:1.5rem;font-size:.875rem;line-height:1.3;letter-spacing:-.01em;font-weight:400}
  .pr__cards{position:static;margin-top:2.75rem}
  .step{width:auto;border-left:0;border-right:0;transform:none!important;opacity:1!important}
  .step__in{padding:1rem}
  .step__lab{width:auto;margin-right:1.25rem}
  .step__t{margin-top:4rem}
  .step__b{width:auto;margin-top:1.25rem}
  .step .pl-tl,.step .pl-bl{left:.25rem}.step .pl-tr,.step .pl-br{right:.25rem}

  .ft{height:auto}
  .ft__in{width:auto;padding:2rem 1rem 3rem;display:flex;flex-direction:column}
  .ft__q,.ft__cards,.ft__nav,.ft__big{position:static}
  .ft__q{flex-direction:column;gap:1.25rem}
  .ft__left{width:auto;gap:1rem}
  .ft__title{width:auto}
  .ft__timer{width:2.25rem;height:2.25rem}
  .ft__right{width:auto;gap:1.25rem}
  .ft__big{font-size:5.6rem;margin-left:-.4rem}
  .ft__big:nth-of-type(1){margin-top:3rem}
  .ft__cards{margin-top:1.25rem;gap:.25rem}
  .fcard{width:calc(100vw - 2rem);height:12.5rem}
  .fcard__txt span{top:auto;bottom:.75rem;font-size:1.25rem}
  .fcard__txt span:first-child{left:.75rem}.fcard__txt span:last-child{right:.75rem}
  .ft__nav{margin-top:1rem;align-self:flex-start}
  .sqbtn{width:3.25rem;height:3.25rem}

  .fo__in{width:auto;padding:1rem;gap:.5rem}
  .fo__news{height:auto;padding:1.25rem 1rem 6rem}
  .fo__ghost{font-size:4.6rem;top:auto;bottom:.5rem}
  .fo__news-row{position:static;flex-direction:column;gap:1.5rem}
  .fo__news-l,.fo__news-r{width:auto}
  .fo__picks{flex-direction:column}
  .fo__main{height:auto;padding:1rem 1rem 2rem;display:flex;flex-direction:column;gap:2rem}
  .fo__photo,.fo__links,.fo__word{position:static;width:auto}
  .fo__photo{height:14rem}
  .fo__links{font-size:1.5rem}
  .fo__word{position:relative;height:7rem;margin:1rem 0}
  .fo__logo{left:1.5rem;right:1.5rem}
  .fo__bottom{flex-direction:column;gap:.5rem}
}
@media (prefers-reduced-motion:reduce){
  .stat [data-li]{transform:none!important}
  .sv__cell,.step{transform:none!important;opacity:1!important}
  .sv__fill .fw{color:var(--black)}
}