.page-intro{--intro-open-ease:cubic-bezier(.76,0,.24,1);position:fixed;inset:0;z-index:10000;overflow:hidden;color:#fff;pointer-events:none}
.page-intro::before{content:"";position:absolute;inset:0;background:#0a0a0a;transform-origin:50% 0;will-change:transform;animation:intro-curtain .8s 1.75s var(--intro-open-ease) both}
.page-intro-position{position:absolute;left:50%;top:50%;animation:intro-arrive 1.75s cubic-bezier(.65,0,.2,1) both}
.page-intro-word{display:flex;position:relative;font-family:Inter,Arial,sans-serif;font-size:38px;font-weight:600;letter-spacing:-.04em;line-height:1.1;animation:intro-depart .8s 1.75s var(--intro-open-ease) both}
.page-intro-word span{display:block;animation:intro-letter .45s cubic-bezier(.76,0,.24,1) both;animation-delay:calc(var(--letter)*.1s + .45s)}
.page-intro-word .page-intro-mark{align-self:center;margin-right:10px;width:36px;height:36px;flex:none}
.page-intro-mark img{display:block;width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1)}
html.intro-pending{overflow:hidden;background:#0a0a0a}
html.intro-pending body::after{content:"";position:fixed;inset:0;background:#0a0a0a;z-index:9999;pointer-events:none}
html.intro-pending .brand-display,html.intro-pending .wordmark-sub,html.intro-pending .services>span,html.intro-pending .sand-scroll .hero h1,html.intro-pending .sand-scroll .founder-card{animation-play-state:paused}
html.intro-running body::after{display:none}
html.intro-running .sand-scroll .hero{will-change:transform,opacity;animation:intro-hero 1.1s 2s cubic-bezier(.22,1,.36,1) both}
@keyframes intro-letter{from{opacity:.001;filter:blur(5px);transform:translateY(270px)}to{opacity:1;filter:blur(0);transform:none}}
/* Continuous curves avoid velocity corners between sampled reference positions.
   Curtain and word share one departure curve; hero settles underneath. */
@keyframes intro-arrive{
0%{opacity:.001;transform:translate(-50%,-50%) translateY(640px)}
100%{opacity:1;transform:translate(-50%,-50%)}
}
@keyframes intro-curtain{from{transform:scaleY(1)}to{transform:scaleY(0)}}
@keyframes intro-depart{from{transform:translateY(0)}to{transform:translateY(calc(-50vh - 220px))}}
@keyframes intro-hero{from{opacity:0;transform:translateY(300px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.page-intro{display:none!important}html.intro-pending{overflow:auto}html.intro-pending body::after{display:none}html.intro-running .sand-scroll .hero{animation:none}}