/* ==========================================================================
   ANIMATIONS
   ========================================================================== */

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
}

/* Reveal base states — activated by IntersectionObserver adding .in-view */
[data-reveal]{opacity:0;transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
[data-reveal="up"]{transform:translateY(36px)}
[data-reveal="left"]{transform:translateX(-46px)}
[data-reveal="right"]{transform:translateX(46px)}
[data-reveal="zoom"]{transform:scale(.9)}
[data-reveal].in-view{opacity:1;transform:none}

/* Stagger children */
[data-reveal-group] > *{opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
[data-reveal-group].in-view > *{opacity:1;transform:none}
[data-reveal-group].in-view > *:nth-child(1){transition-delay:.05s}
[data-reveal-group].in-view > *:nth-child(2){transition-delay:.15s}
[data-reveal-group].in-view > *:nth-child(3){transition-delay:.25s}
[data-reveal-group].in-view > *:nth-child(4){transition-delay:.35s}
[data-reveal-group].in-view > *:nth-child(5){transition-delay:.45s}
[data-reveal-group].in-view > *:nth-child(6){transition-delay:.55s}

/* Text reveal (line mask) */
.text-reveal{overflow:hidden;display:block}
.text-reveal span{display:inline-block;transform:translateY(110%);transition:transform .9s var(--ease-out)}
.text-reveal.in-view span{transform:translateY(0)}

@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* Floating shapes */
@keyframes floatY{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-22px) rotate(3deg)}}
@keyframes floatX{0%,100%{transform:translateX(0)}50%{transform:translateX(18px)}}
@keyframes floatSlow{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(16px) rotate(-4deg)}}
.float-1{animation:floatY 7s var(--ease-inout) infinite}
.float-2{animation:floatSlow 9s var(--ease-inout) infinite}
.float-3{animation:floatX 8s var(--ease-inout) infinite}

/* Animated line draw (SVG) */
.line-draw{stroke-dasharray:1000;stroke-dashoffset:1000;animation:drawLine 2.6s var(--ease-out) forwards}
@keyframes drawLine{to{stroke-dashoffset:0}}

/* Grid pulse for blueprint backgrounds */
@keyframes gridPulse{0%,100%{opacity:.5}50%{opacity:1}}
.grid-pulse{animation:gridPulse 5s var(--ease-inout) infinite}

/* Rotate slow (rings, gears) */
@keyframes rotateSlow{to{transform:rotate(360deg)}}
.rotate-slow{animation:rotateSlow 30s linear infinite;transform-origin:center}
.rotate-slow-rev{animation:rotateSlow 24s linear infinite reverse;transform-origin:center}

/* Glow pulse */
@keyframes glowPulse{0%,100%{opacity:.35}50%{opacity:.8}}
.glow-pulse{animation:glowPulse 4s var(--ease-inout) infinite}

/* Card reveal on hover elevation defined in style.css already */

/* Underline sweep for links */
.link-sweep{position:relative;display:inline-block}
.link-sweep::after{content:'';position:absolute;left:0;bottom:-2px;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease-out)}
.link-sweep:hover::after{transform:scaleX(1);transform-origin:left}

/* Number counter uses JS to set text, subtle pop-in via CSS */
.counter-pop{display:inline-block;transition:transform .3s var(--ease-out)}

/* Page transition veil */
#page-veil{position:fixed;inset:0;background:var(--navy);z-index:9998;transform:scaleY(0);transform-origin:top;pointer-events:none}
#page-veil.leaving{animation:veilOut .55s var(--ease-inout) forwards}
@keyframes veilOut{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
