/* Shared motion styles for the example sites. Pre-hides only when motion is active. */
.w{text-indent:0;display:inline-block;overflow:hidden;vertical-align:top;padding:0 .06em .14em;margin:0 -.06em -.14em}
.w__in{display:inline-block;will-change:transform}
.motion:not(.motion-failed) [data-split]:not(.is-split){visibility:hidden}
.motion:not(.motion-failed) [data-fade]:not([data-stagger]),
.motion:not(.motion-failed) [data-fade][data-stagger]>*,
.motion:not(.motion-failed) [data-load]{opacity:0;visibility:hidden}
.motion:not(.motion-failed) [data-reveal-img]{clip-path:inset(100% 0 0 0)}
.motion:not(.motion-failed) [data-line]{transform:scaleX(0);transform-origin:left}
.motion-failed [data-intro]{display:none}
html:not(.motion) [data-intro]{display:none}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-stopped{overflow:clip}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}

/* Intro curtain */
[data-intro]{position:fixed;inset:0;z-index:200;display:grid;place-items:center;pointer-events:none}
[data-intro] .intro__mask{overflow:hidden;display:block}
[data-intro] [data-intro-in]{display:block}
[data-intro] [data-intro-bar]{transform:scaleX(0);transform-origin:left}

/* Cursor */
.cursor{position:fixed;left:0;top:0;z-index:300;pointer-events:none;width:0;height:0;opacity:0;transition:opacity .3s}
.cursor.is-on{opacity:1}
.cursor::before{content:"";position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:var(--cursor,#111);transition:transform .45s cubic-bezier(.2,.8,.2,1),background .3s}
.cursor.is-link::before{transform:scale(3.2);background:var(--cursor-link,rgba(0,0,0,.14))}
.cursor.is-label::before{transform:scale(9);background:var(--cursor,#111)}
.cursor__label{position:absolute;left:0;top:0;transform:translate(-50%,-50%) scale(.6);font:600 12px/1 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--cursor-text,#fff);white-space:nowrap;opacity:0;transition:opacity .25s,transform .45s cubic-bezier(.2,.8,.2,1)}
.cursor.is-label .cursor__label{opacity:1;transform:translate(-50%,-50%) scale(1)}
@media (hover:none),(pointer:coarse){.cursor{display:none}}
