/* =============================================================================
   FINOM Group — animations.css
   Scroll-reveal states + progressive-enhancement gating.

   CORE PRINCIPLE: content is NEVER hidden by default, and once revealed it
   STAYS revealed (no recede). Pre-animation states are scoped under
   html.js-anim (added by boot.js only when JS runs) AND removed again under
   prefers-reduced-motion, so:
     • JS disabled     → nothing hidden, native layout, fully readable.
     • reduced-motion  → nothing hidden, native scroll, no transforms.
     • JS + motion     → a short, one-time fade-up as each block enters.
   ============================================================================= */

/* --- Reveal targets (fade up once, then stay) ------------------------------*/
html.js-anim [data-anim]:not([data-anim="pin-scene"]){
    opacity:0;
    transform:translateY(16px);
    will-change:opacity,transform;
}

/* --- Flip-card fallback -----------------------------------------------------*/
/* The scroll-driven flip reveals each card's back (project stats). When it
   can't run, stack both faces vertically so the stats are never lost. */
html:not(.js-anim) .flip-card{transform:none;aspect-ratio:auto;transform-style:flat}
html:not(.js-anim) .flip-face{position:relative;inset:auto;backface-visibility:visible;-webkit-backface-visibility:visible;transform:none;box-shadow:none}
html:not(.js-anim) .flip-back{transform:none;margin-top:22px}
html:not(.js-anim) .flip-pin{min-height:auto;display:block;padding:60px 6%}
html:not(.js-anim) .flip-front img{height:auto}

/* --- Reduced-motion master guard -------------------------------------------*/
/* Reveal everything, kill transitions/animations, flatten the flip scene. */
@media (prefers-reduced-motion: reduce){
    html.js-anim [data-anim],
    html.js-anim [data-anim]:not([data-anim="pin-scene"]){
        opacity:1 !important;
        transform:none !important;
        will-change:auto;
    }
    *,*::before,*::after{
        animation-duration:.001ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.001ms !important;
        scroll-behavior:auto !important;
    }
    .flip-card{transform:none !important;aspect-ratio:auto;transform-style:flat}
    .flip-face{position:relative;inset:auto;backface-visibility:visible;-webkit-backface-visibility:visible;transform:none !important;box-shadow:none}
    .flip-back{transform:none !important;margin-top:22px}
    .flip-pin{min-height:auto;display:block;padding:60px 6%}
    .flip-front img{height:auto}
    .hero-cue{display:none}
}

/* --- Perf: skip offscreen layout/paint work --------------------------------*/
.expertise-row,
.flip-scene,
.impact,
.card-grid,
.team-grid{content-visibility:auto;contain-intrinsic-size:1px 600px}