/* ============================================================
   COMPAÑÍA NATURAL S.A.S. — Animations
   ============================================================ */

/* ── Scroll Reveal Observer Setup ─────────────────────────── */
/* Handled in animations.js via IntersectionObserver          */

/* ── Page Fade-In ─────────────────────────────────────────── */
@keyframes pageEnter {
  from { opacity: 0; }
  to   { opacity: 1; }
}

body {
  animation: pageEnter 0.45s var(--ease-smooth) both;
}

/* ── Stagger children ──────────────────────────────────────── */
.stagger-children > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s var(--ease-smooth),
              transform 0.5s var(--ease-smooth);
}

.stagger-children.visible > *:nth-child(1) { opacity:1; transform:translateY(0); transition-delay: 0ms; }
.stagger-children.visible > *:nth-child(2) { opacity:1; transform:translateY(0); transition-delay: 100ms; }
.stagger-children.visible > *:nth-child(3) { opacity:1; transform:translateY(0); transition-delay: 200ms; }
.stagger-children.visible > *:nth-child(4) { opacity:1; transform:translateY(0); transition-delay: 300ms; }
.stagger-children.visible > *:nth-child(5) { opacity:1; transform:translateY(0); transition-delay: 400ms; }

/* ── Shine Effect ─────────────────────────────────────────── */
@keyframes shine {
  from { background-position: -200% center; }
  to   { background-position: 200% center; }
}

.btn--primary:active {
  transform: scale(0.97) translateY(0);
}

/* ── Ticker ───────────────────────────────────────────────── */
@keyframes ticker {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

.ticker-track {
  display: flex;
  gap: var(--space-12);
  animation: ticker 28s linear infinite;
  will-change: transform;
}

.ticker-track:hover { animation-play-state: paused; }

/* ── Loader Bar ───────────────────────────────────────────── */
.progress-bar {
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  background: var(--gradient-accent);
  z-index: 9999;
  transition: width 0.2s linear;
  border-radius: 0 var(--radius-full) var(--radius-full) 0;
}

/* ── Scale on hover (individual override) ─────────────────── */
.hover-scale {
  transition: transform var(--duration-normal) var(--ease-bounce) !important;
}
.hover-scale:hover { transform: scale(1.05); }

/* ── Glow ring for featured items ──────────────────────────── */
@keyframes glowPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(237,112,92,0.3); }
  50%  { box-shadow: 0 0 0 8px rgba(237,112,92,0); }
}

.glow-pulse { animation: glowPulse 2.5s ease-in-out infinite; }

/* ── Number counter animation ──────────────────────────────── */
.count-up { transition: all 0.05s linear; }