.transform-section{position:relative;height:var(--transform-scroll-length, 140vh);color:var(--transform-foreground, #131313);background:var(--transform-background, #fff)}.transform-section__sticky{position:sticky;top:0;display:flex;width:100%;height:100vh;height:100svh;height:100dvh;overflow:hidden;align-items:center;padding:48px 24px}.transform-section__inner{width:min(100%,1120px);margin-inline:auto}.transform-section__heading{margin:0;color:var(--transform-foreground, #131313);font-family:var(--font-family-display);font-size:clamp(50px,8vw,112px);font-weight:var(--font-weight-semibold);letter-spacing:-.045em;line-height:.97}.transform-section__cluster{position:relative;display:flex;flex-direction:column;gap:clamp(16px,2.4vw,26px);margin-top:min(7vw,76px)}.transform-section__row{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(16px,2.4vw,26px)}.transform-section__pill{animation:transform-pill-bob 6.5s ease-in-out var(--transform-delay, 0s) infinite}@keyframes transform-pill-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.transform-section__flip{display:inline-grid;transform:perspective(1100px) rotateX(0);transform-style:preserve-3d;transition:transform .55s cubic-bezier(.68,-.25,.22,1.2);will-change:transform}.transform-section__flip.is-transformed,.transform-section__row.is-transformed .transform-section__flip{transform:perspective(1100px) rotateX(180deg)}.transform-section__face{display:flex;grid-area:1 / 1;align-items:center;justify-content:center;padding:clamp(15px,2.2vw,22px) clamp(24px,3.8vw,44px);border:1.5px solid transparent;border-radius:var(--radius-full);-webkit-backface-visibility:hidden;backface-visibility:hidden;font-family:var(--font-family-body);font-size:clamp(17px,2vw,24px);font-weight:var(--font-weight-medium);letter-spacing:-.01em;line-height:1.15;white-space:nowrap}.transform-section__face--before{color:var(--transform-pill-foreground, #8f8f8a);background:var(--transform-pill-background, #e8e8e5)}.transform-section__face--after{border-color:var(--transform-outline, #141414);color:var(--transform-accent, #ff5c56);background:var(--transform-face-background, #fff);font-weight:var(--font-weight-semibold);transform:rotateX(180deg)}.transform-section__face--after.is-ringing{animation:transform-section-ring .5s ease-out}@keyframes transform-section-ring{0%{box-shadow:0 0 0 0 var(--transform-accent-ring)}to{box-shadow:0 0 0 22px var(--transform-accent-clear)}}.transform-section__capsule{position:absolute;z-index:2;top:0;left:0;display:flex;width:62px;height:26px;overflow:hidden;border:1.5px solid var(--transform-outline, #141414);border-radius:var(--radius-full);opacity:0;background:var(--transform-face-background, #fff);box-shadow:0 12px 26px var(--transform-accent-shadow);pointer-events:none;will-change:transform,opacity}.transform-section__capsule span{width:50%;height:100%}.transform-section__capsule span:first-child{background:var(--transform-accent, #ff5c56)}.transform-section__capsule span:last-child{border-left:1.5px solid var(--transform-outline, #141414);background:var(--transform-face-background, #fff)}.transform-section__hint{position:absolute;bottom:26px;left:50%;margin:0;color:var(--transform-hint, #9a9a96);font-family:var(--font-family-body);font-size:12px;font-weight:var(--font-weight-semibold);letter-spacing:.2em;line-height:1;text-transform:uppercase;transform:translate(-50%);transition:opacity .4s ease;white-space:nowrap}.transform-section__empty{max-width:34rem;margin:var(--space-8) 0 0;color:var(--transform-pill-foreground, #8f8f8a);font-size:var(--font-size-lead)}.transform-section--static,.no-js .transform-section{height:auto}.transform-section--static .transform-section__sticky,.no-js .transform-section .transform-section__sticky{position:relative;min-height:100vh;min-height:100svh;min-height:100dvh}.transform-section--static .transform-section__pill,.no-js .transform-section .transform-section__pill{animation:none}.transform-section--static .transform-section__flip,.no-js .transform-section .transform-section__flip{transform:perspective(1100px) rotateX(180deg);transition:none}.transform-section--static .transform-section__capsule,.transform-section--static .transform-section__hint,.no-js .transform-section .transform-section__capsule,.no-js .transform-section .transform-section__hint{display:none}@media(max-width:749px){.transform-section__sticky{padding:32px 14px}.transform-section__heading{font-size:clamp(46px,15vw,68px);line-height:.98}.transform-section__cluster{gap:clamp(12px,3.8vw,16px);margin-top:clamp(32px,10vw,48px)}.transform-section__row{gap:clamp(10px,3.8vw,16px)}.transform-section__face{padding:clamp(12px,4vw,15px) clamp(18px,5.4vw,24px);font-size:clamp(15px,4.5vw,17px)}.transform-section__capsule{width:54px;height:23px}.transform-section__hint{bottom:18px;font-size:10px}}@media(max-height:680px)and (min-width:750px){.transform-section__sticky{padding-block:28px}.transform-section__heading{font-size:clamp(44px,7.2vw,82px)}.transform-section__cluster{gap:14px;margin-top:30px}.transform-section__row{gap:14px}.transform-section__face{padding:13px 28px;font-size:18px}}@media(prefers-reduced-motion:reduce){.transform-section{height:auto}.transform-section__sticky{position:relative;min-height:100vh;min-height:100svh;min-height:100dvh}.transform-section__pill{animation:none}.transform-section__flip{transform:perspective(1100px) rotateX(180deg);transition:none}.transform-section__capsule,.transform-section__hint{display:none}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/transform-section.css.map */