/* Motion uses native observers and compositor transforms; scrolling stays native. */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;background:var(--lime);transform:scaleX(0);transform-origin:left;z-index:80;pointer-events:none}
.site-header{transition:box-shadow .4s,background .4s}
.site-header.is-scrolled{background:rgba(251,251,248,.94);backdrop-filter:blur(16px);box-shadow:0 5px 30px #1019150a}
.motion-ribbon{overflow:hidden;background:var(--ink);color:var(--lime);padding:24px 0;position:relative}
.ribbon-track{display:flex;width:max-content;animation:padel-marquee var(--marquee-duration,35s) linear infinite}
.ribbon-group{display:flex;align-items:center;flex-shrink:0;gap:42px;padding-right:42px;font:700 clamp(48px,6.7vw,100px)/1 Barlow,Impact,sans-serif;letter-spacing:-1px}
.ribbon-outline{color:transparent;-webkit-text-stroke:1px #d8fa48b3}
.ribbon-star{font:400 .7em/1 Inter,sans-serif;display:inline-block;color:var(--lime)}
.motion-ribbon:hover .ribbon-track{animation-play-state:paused}
@keyframes padel-marquee{to{transform:translateX(-50%)}}
.motion-active .hero-image{inset:-4% 0;transform:translate3d(0,var(--hero-drift,0px),0) scale(1.015);will-change:transform;animation:hero-picture-in 1.8s cubic-bezier(.16,1,.3,1) both}
.motion-active .hero-content{transform:translate3d(0,var(--hero-copy-drift,0px),0);opacity:var(--hero-copy-opacity,1)}
.motion-active .hero h1{animation:hero-copy-in 1.15s .12s cubic-bezier(.16,1,.3,1) both}
.motion-active .hero-eyebrow{animation:hero-copy-in .9s .03s cubic-bezier(.16,1,.3,1) both}
.motion-active .hero-description{animation:hero-copy-in 1s .3s cubic-bezier(.16,1,.3,1) both}
.motion-active .hero .button{animation:hero-copy-in 1s .42s cubic-bezier(.16,1,.3,1) both}
.motion-active .hero-bottom{animation:hero-copy-in 1s .5s cubic-bezier(.16,1,.3,1) both}
@keyframes hero-copy-in{from{opacity:0;translate:0 35px;filter:blur(3px)}to{opacity:1;translate:0 0;filter:blur(0)}}
@keyframes hero-picture-in{from{filter:brightness(.65);scale:1.055}to{filter:brightness(1);scale:1}}
.scroll-reveal{opacity:0;transform:translate3d(0,38px,0);transition:opacity .85s var(--reveal-delay,0s),transform 1.05s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0s)}
.scroll-reveal.is-visible{opacity:1;transform:translate3d(0,0,0)}
.heading-line{display:block;overflow:hidden;padding:.08em 0;margin:-.08em 0}
.heading-line>span{display:block;transform:translate3d(0,112%,0) rotate(2deg);transform-origin:left;transition:transform 1.15s cubic-bezier(.16,1,.3,1) var(--line-delay,0s)}
.motion-heading.is-visible .heading-line>span{transform:translate3d(0,0,0) rotate(0)}
.product-card{transition:opacity .85s var(--reveal-delay,0s),transform 1.05s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0s)}
.product-visual{transition:box-shadow .45s,border-color .45s}
.product-card:hover .product-visual{box-shadow:0 12px 36px #1823150b;border-color:#cbd4bb}
.product-card:hover .product-open{background:var(--lime);border-color:var(--lime);transform:rotate(45deg)}
.product-open{transition:background .25s,transform .4s cubic-bezier(.16,1,.3,1)}
.product-image-button .product-image{transition:transform .8s cubic-bezier(.16,1,.3,1)}
.product-image-button:hover .product-image{transform:scale(calc(var(--image-scale,1)*1.09)) rotate(-4deg)}
.playstyle-section{position:relative;isolation:isolate}
.playstyle-section:before{content:"IN PLAY.";position:absolute;left:-2%;bottom:-.23em;font:700 29vw/1 Barlow,sans-serif;letter-spacing:-.04em;color:#d8fa4806;transform:translate3d(calc(var(--play-progress,0)*-60px),0,0);pointer-events:none;z-index:-1}
.playstyle-layout{position:relative}
.motion-active .court-graphic{transform:skew(-25deg) translateX(calc(var(--play-progress,0)*35px))}
.playstyle-option>.icon{transition:transform .4s cubic-bezier(.16,1,.3,1)}
.playstyle-option:hover>.icon{transform:translate(5px,-5px)}
.contact-circle{position:relative}
.contact-circle:after{content:"";position:absolute;inset:-8px;border:1px solid #10191522;border-radius:50%;transform:scale(.85);opacity:0;transition:transform .5s,opacity .5s}
.contact-circle:hover:after{transform:scale(1);opacity:1}
.button-lime{position:relative;overflow:hidden}
.button-lime:after{content:"";position:absolute;inset:-70% auto -70% -50%;width:22%;background:#ffffff4a;transform:rotate(25deg);transition:left .7s cubic-bezier(.16,1,.3,1);pointer-events:none}
.button-lime:hover:after{left:130%}
.product-dialog[open]{animation:dialog-arrive .4s cubic-bezier(.16,1,.3,1)}
.product-dialog[open]::backdrop{animation:backdrop-arrive .3s ease}
@keyframes dialog-arrive{from{opacity:0;transform:translateY(24px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes backdrop-arrive{from{opacity:0}to{opacity:1}}
@media(max-width:800px){.motion-ribbon{padding:20px 0}.ribbon-group{gap:26px;padding-right:26px}.scroll-reveal{transform:translate3d(0,25px,0)}.motion-active .hero-image{will-change:auto}}
@media(prefers-reduced-motion:reduce){.ribbon-track{animation:none}.scroll-reveal{opacity:1;transform:none;transition:none}.heading-line>span{transform:none;transition:none}.motion-active .hero-image{inset:0;transform:none;animation:none}.motion-active .hero-content{transform:none;opacity:1}.motion-active .hero h1,.motion-active .hero-eyebrow,.motion-active .hero-description,.motion-active .hero .button,.motion-active .hero-bottom{animation:none}.product-dialog[open],.product-dialog[open]::backdrop{animation:none}.playstyle-section:before,.motion-active .court-graphic{translate:none}.scroll-progress{display:none}}