/* ==========================================================================
   VertigoCO — animations.css
   All @keyframes plus scroll-reveal states.
   ========================================================================== */

/* ---------- background / scenery ---------- */
@keyframes bg-breathe {
  0%, 100% { transform: scale(1.04) translate3d(0, 0, 0); }
  50%      { transform: scale(1.085) translate3d(-8px, -10px, 0); }
}

@keyframes float-slow {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50%      { transform: translate3d(0, -12px, 0); }
}

@keyframes crackle-pulse {
  0%, 100% { opacity: .18; filter: hue-rotate(0deg); }
  45%      { opacity: .46; filter: hue-rotate(-14deg); }
}

@keyframes lava-throb {
  0%, 100% { opacity: .38; filter: brightness(1); }
  50%      { opacity: .72; filter: brightness(1.35); }
}

@keyframes grain-shift {
  0%   { transform: translate3d(0, 0, 0); }
  25%  { transform: translate3d(-3%, 2%, 0); }
  50%  { transform: translate3d(2%, -3%, 0); }
  75%  { transform: translate3d(-2%, -2%, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

/* ---------- lightning ---------- */
@keyframes bolt-strike {
  0%, 100%      { opacity: 0; }
  1%            { opacity: .85; }
  2%            { opacity: 0; }
  3.5%          { opacity: .95; }
  5%            { opacity: .18; }
  6%            { opacity: .7; }
  8%            { opacity: 0; }
}

@keyframes sky-flash {
  0%, 100%   { opacity: 0; }
  1.2%       { opacity: .45; }
  2.4%       { opacity: .06; }
  3.6%       { opacity: .32; }
  6%         { opacity: 0; }
}

/* ---------- logo / emblem ---------- */
@keyframes logo-breathe {
  0%, 100% { filter: drop-shadow(0 0 12px rgba(150, 70, 255, .38)); }
  50%      { filter: drop-shadow(0 0 24px rgba(180, 100, 255, .70)); }
}

@keyframes ring-throb {
  0%, 100% { opacity: .5;  transform: translate(-50%, -50%) scale(.9); }
  50%      { opacity: 1;   transform: translate(-50%, -50%) scale(1.12); }
}

@keyframes emblem-glow {
  0%, 100% { opacity: 0; }
  50%      { opacity: .40; }
}

@keyframes sheen-sweep {
  0%       { background-position: -120% 0; }
  55%,100% { background-position: 220% 0; }
}

@keyframes spin-slow {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes title-glow {
  0%, 100% { filter: drop-shadow(0 0 12px rgba(170, 110, 255, .35)); }
  50%      { filter: drop-shadow(0 0 26px rgba(200, 150, 255, .70)); }
}

/* ---------- UI accents ---------- */
@keyframes ember-frame {
  0%, 100% { opacity: .75; filter: brightness(1); }
  50%      { opacity: 1;   filter: brightness(1.45); }
}

@keyframes pulse-dot {
  0%, 100% { transform: scale(.75); opacity: .65; }
  50%      { transform: scale(1);   opacity: 1; }
}

@keyframes neon-flicker {
  0%, 100%          { opacity: 1; }
  47%, 49%, 53%     { opacity: .72; }
  48%, 52%          { opacity: 1; }
}

@keyframes rule-shimmer {
  0%, 100% { opacity: .45; }
  50%      { opacity: 1; }
}

/* ---------- ENTRANCE / SCROLL REVEAL ---------- */
.reveal {
  opacity: 0;
  transform: translateY(26px) scale(.985);
  transition:
    opacity .85s var(--ease-out),
    transform .85s var(--ease-out);
  will-change: opacity, transform;
}

.reveal.is-in {
  opacity: 1;
  transform: none;
}

/* staggered children inside the feature row & info grid */
.features .reveal:nth-child(1),
.infogrid .reveal:nth-child(1) { transition-delay: .05s; }
.features .reveal:nth-child(2),
.infogrid .reveal:nth-child(2) { transition-delay: .14s; }
.features .reveal:nth-child(3),
.infogrid .reveal:nth-child(3) { transition-delay: .23s; }
.features .reveal:nth-child(4),
.infogrid .reveal:nth-child(4) { transition-delay: .32s; }
.features .reveal:nth-child(5) { transition-delay: .41s; }

/* first-paint intro for the hero */
.topbar,
.hero__center > * {
  animation: intro-up .95s var(--ease-out) both;
}

.topbar               { animation-delay: .10s; }
.hero__center .emblem { animation-delay: .16s; animation-duration: 1.25s; }
.hero__sub            { animation-delay: .46s; }
.hero__title          { animation-delay: .56s; }
.hero__tag            { animation-delay: .64s; }
.hero__center .btn-ember--lg { animation-delay: .74s; }

@keyframes intro-up {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: none; }
}

/* the emblem keeps its own idle animations after the intro */
.hero__center .emblem { animation-name: intro-scale; }

@keyframes intro-scale {
  from { opacity: 0; transform: translateY(18px) scale(.94); filter: blur(6px); }
  to   { opacity: 1; transform: none; filter: none; }
}

/* ---------- reduced motion ---------- */
@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 { opacity: 1; transform: none; }
  .fx-embers { display: none; }
}