/* Temporary entrance only; the final hero keeps its original layout. */
.hero-origin{position:fixed;z-index:20;pointer-events:none;--intro-distance:28px;--intro-line:64px;animation:hero-origin-gesture 2200ms cubic-bezier(.22,.61,.36,1) both}
.hero-origin-square{position:absolute;inset:0;background:#71283C}
.hero-origin-line{position:absolute;left:100%;top:50%;width:var(--intro-line);height:1px;background:#b78845;transform-origin:left center;animation:hero-line-reveal 2200ms cubic-bezier(.22,.61,.36,1) both}
.hero-intro-pending .home-stage h1{clip-path:inset(0 100% 0 0)}
.hero-intro-active .home-stage h1{animation:hero-title-reveal 800ms cubic-bezier(.22,.61,.36,1) 900ms both}
.hero-intro-pending #hero-copy .cta-mark::after{opacity:0}
.hero-intro-active #hero-copy .cta-mark::after{animation:hero-cta-arrival 600ms cubic-bezier(.22,.61,.36,1) 1600ms both}
@keyframes hero-origin-gesture{
 0%,18%{opacity:0;transform:translate(0,0)}
 20%{opacity:1;transform:translate(0,0)}
 36%,72%{opacity:1;transform:translate(var(--intro-distance),0)}
 86%,100%{opacity:0;transform:translate(var(--intro-distance),8px)}
}
@keyframes hero-line-reveal{
 0%,31%{transform:scaleX(0)}
 59%,100%{transform:scaleX(1)}
}
@keyframes hero-title-reveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes hero-cta-arrival{from{opacity:0;translate:-10px -3px}to{opacity:1;translate:0 0}}
@media(max-width:900px){.hero-origin{--intro-distance:20px;--intro-line:36px}}
@media(prefers-reduced-motion:reduce){
 .hero-origin{display:none}
 .hero-intro-pending .home-stage h1,.hero-intro-active .home-stage h1{animation:none;clip-path:none}
 .hero-intro-pending #hero-copy .cta-mark::after,.hero-intro-active #hero-copy .cta-mark::after{animation:none;opacity:1;translate:none}
}
