/**
 * Golden Eagle GS — Reusable Animation System
 * Stage 2 — Global Design System
 *
 * CONTRACT: components opt into these effects via data attributes, not
 * bespoke per-page CSS. This is the concrete mechanism enforcing this
 * stage's "avoid page-specific animations" requirement — see
 * DESIGN_SYSTEM.md §6 for the full usage contract.
 *
 *   data-ge-animate="fade-up | fade-in | scale-in"   → which effect
 *   data-ge-stagger="1".."6"                         → optional delay step
 *
 * scroll-reveal.js (enqueued alongside this file) adds the `.ge-in-view`
 * class to an element carrying `data-ge-animate` once it crosses the
 * viewport threshold. The CSS below defines both the at-rest (hidden)
 * state and the revealed transition — JS only toggles one class.
 *
 * Every rule here is skipped entirely under prefers-reduced-motion —
 * elements are simply visible from the start, no motion, no exception.
 */

[data-ge-animate] {
  opacity: 0;
  will-change: opacity, transform;
}

[data-ge-animate="fade-up"] {
  transform: translateY(24px);
}

[data-ge-animate="fade-in"] {
  transform: none;
}

[data-ge-animate="scale-in"] {
  transform: scale(0.96);
}

[data-ge-animate].ge-in-view {
  opacity: 1;
  transform: none;
  transition:
    opacity var(--ge-duration-slow, 600ms) var(--ge-ease-emphasis, ease-out),
    transform var(--ge-duration-slow, 600ms) var(--ge-ease-emphasis, ease-out);
}

/* Stagger steps — applied by scroll-reveal.js as inline transition-delay
   is deliberately NOT used here (inline styles fight specificity with
   Elementor); instead these are fixed delay classes the JS toggles
   alongside .ge-in-view, capped at 6 steps per DESIGN_SYSTEM.md §6's
   performance guard (uniform timing beyond 6 staggered children). */
[data-ge-animate].ge-in-view.ge-stagger-1 { transition-delay: 80ms; }
[data-ge-animate].ge-in-view.ge-stagger-2 { transition-delay: 160ms; }
[data-ge-animate].ge-in-view.ge-stagger-3 { transition-delay: 240ms; }
[data-ge-animate].ge-in-view.ge-stagger-4 { transition-delay: 320ms; }
[data-ge-animate].ge-in-view.ge-stagger-5 { transition-delay: 400ms; }
[data-ge-animate].ge-in-view.ge-stagger-6 { transition-delay: 480ms; }

/* Hover/interaction utilities — reusable across Cards, Buttons, etc.
   per DESIGN_SYSTEM.md §4, instead of each component re-declaring its
   own lift/glow transition. */
.ge-hover-lift {
  transition:
    transform var(--ge-duration-base, 300ms) var(--ge-ease-standard, ease),
    box-shadow var(--ge-duration-base, 300ms) var(--ge-ease-standard, ease),
    border-color var(--ge-duration-base, 300ms) var(--ge-ease-standard, ease);
}

.ge-hover-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 0 24px rgba(201, 162, 75, 0.25);
}

/* Shimmer sweep — used once per page maximum (CTA gold band), per the
   Phase 3 UI spec's "plays once via IntersectionObserver + session flag"
   rule. The keyframe is defined once here; scroll-reveal.js applies the
   .ge-shimmer-play class only on first viewport entry per session. */
@keyframes ge-shimmer-sweep {
  from { background-position: -150% 0; }
  to { background-position: 250% 0; }
}

.ge-shimmer-play {
  background-image: linear-gradient(
    100deg,
    transparent 30%,
    rgba(255, 255, 255, 0.35) 45%,
    transparent 60%
  );
  background-size: 200% 100%;
  animation: ge-shimmer-sweep 1.5s var(--ge-ease-standard, ease) 1;
}

/* Reduced motion: every effect above collapses to instantly visible,
   no transform, no animation — matches the site-wide safety net in
   style.css but scoped explicitly to this file's own selectors so this
   file remains correct even if loaded in isolation. */
@media (prefers-reduced-motion: reduce) {
  [data-ge-animate] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .ge-hover-lift:hover {
    transform: none;
  }

  .ge-shimmer-play {
    animation: none !important;
    background-image: none !important;
  }
}