/* ============================================================================
   animations.css — restrained motion. One quiet entrance, nothing that
   competes with the content. All of it disabled under prefers-reduced-motion
   (handled globally in base.css).
   ========================================================================== */

@keyframes fade-in      { from { opacity: 0; } to { opacity: 1; } }
@keyframes rise-in      { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes pop-in       { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: none; } }

/* Page-load entrance for the hero content — the single orchestrated moment. */
.hero__inner > * { animation: rise-in var(--dur-slow) var(--ease) both; }
.hero .eyebrow      { animation-delay: 0.02s; }
.hero__title        { animation-delay: 0.08s; }
.hero__lead         { animation-delay: 0.16s; }
.hero__actions      { animation-delay: 0.24s; }
.hero__stats        { animation-delay: 0.32s; }

/* Opt-in reveal helper (JS can add .reveal to trigger on scroll later) */
.reveal { animation: rise-in var(--dur-slow) var(--ease) both; }
.fade   { animation: fade-in var(--dur) var(--ease) both; }

/* Feature cards settle in with a subtle stagger */
.feature-card { animation: rise-in var(--dur-slow) var(--ease) both; }
.feature-card:nth-child(1) { animation-delay: 0.04s; }
.feature-card:nth-child(2) { animation-delay: 0.10s; }
.feature-card:nth-child(3) { animation-delay: 0.16s; }
.feature-card:nth-child(4) { animation-delay: 0.22s; }

/* Dropdown / submenu already transition via components.css; this adds the
   "just mounted" pop for JS-controlled menus that toggle [data-open]. */
.lang-switch[data-open="true"] .lang-switch__menu,
.has-submenu[data-open="true"] .submenu { animation: pop-in var(--dur-fast) var(--ease) both; }

/* --------------------------------------------------------------------------
   React UI-kit animation classes (used by assets/jsx/icons.jsx primitives:
   Toast/Modal/Dropdown). Reuse the keyframes defined above.
   -------------------------------------------------------------------------- */
.anim-up   { animation: rise-in var(--dur) var(--ease) both; }
.anim-fade { animation: fade-in var(--dur) var(--ease) both; }
.anim-pop  { animation: pop-in var(--dur-fast) var(--ease) both; }

/* Toast auto-dismiss progress bar */
@keyframes toastbar { from { transform: scaleX(1); } to { transform: scaleX(0); } }
