/* ══════════════════════════════════
   ANIMATIONS
══════════════════════════════════ */

/* ── KEYFRAMES ── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeDown {
  from { opacity: 0; transform: translateY(-20px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeLeft {
  from { opacity: 0; transform: translateX(30px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes fadeRight {
  from { opacity: 0; transform: translateX(-30px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.9); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes pulse {
  0%,100% { transform: scale(1); }
  50%      { transform: scale(1.05); }
}
@keyframes rotateSun {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes float {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-12px); }
}
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}
@keyframes ripple {
  0%   { transform: scale(0.8); opacity: 1; }
  100% { transform: scale(2.4); opacity: 0; }
}
@keyframes slideInRight {
  from { opacity: 0; transform: translateX(60px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes countUp {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── SCROLL REVEAL ── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.65s cubic-bezier(0.4,0,0.2,1),
              transform 0.65s cubic-bezier(0.4,0,0.2,1);
}
.reveal.from-left  { transform: translateX(-28px); }
.reveal.from-right { transform: translateX(28px); }
.reveal.from-scale { transform: scale(0.92); }
.reveal.visible {
  opacity: 1;
  transform: translateY(0) translateX(0) scale(1);
}

/* Stagger children — unlimited items, no child left behind */
.stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s cubic-bezier(0.4,0,0.2,1),
              transform 0.5s cubic-bezier(0.4,0,0.2,1);
}
/* SAFETY: when container is visible, ALL children show — no limit */
.stagger.visible > * {
  opacity: 1 !important;
  transform: none !important;
}
.stagger.visible > *:nth-child(1)  { transition-delay: 0.04s; }
.stagger.visible > *:nth-child(2)  { transition-delay: 0.10s; }
.stagger.visible > *:nth-child(3)  { transition-delay: 0.16s; }
.stagger.visible > *:nth-child(4)  { transition-delay: 0.22s; }
.stagger.visible > *:nth-child(5)  { transition-delay: 0.28s; }
.stagger.visible > *:nth-child(6)  { transition-delay: 0.34s; }
.stagger.visible > *:nth-child(7)  { transition-delay: 0.40s; }
.stagger.visible > *:nth-child(8)  { transition-delay: 0.46s; }
.stagger.visible > *:nth-child(9)  { transition-delay: 0.52s; }
.stagger.visible > *:nth-child(10) { transition-delay: 0.58s; }
.stagger.visible > *:nth-child(11) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(12) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(13) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(14) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(15) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(16) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(17) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(18) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(19) { transition-delay: 0.62s; }
.stagger.visible > *:nth-child(20) { transition-delay: 0.62s; }

/* ── HERO ANIMATIONS ── */
.hero-animate {
  animation: fadeUp 0.8s cubic-bezier(0.4,0,0.2,1) both;
}
.hero-animate-d1 { animation-delay: 0.1s; }
.hero-animate-d2 { animation-delay: 0.25s; }
.hero-animate-d3 { animation-delay: 0.4s; }
.hero-animate-d4 { animation-delay: 0.55s; }

/* ── SUN DECORATION ── */
.sun-deco {
  display: inline-block;
  animation: rotateSun 20s linear infinite;
}
.float-deco {
  animation: float 4s ease-in-out infinite;
}

/* ── HOVER LIFT ── */
.hover-lift { transition: transform 0.3s, box-shadow 0.3s; }
.hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 48px rgba(0,0,0,0.14);
}

/* ── IMAGE ZOOM ── */
.img-zoom { overflow: hidden; border-radius: var(--radius); }
.img-zoom img { transition: transform 0.5s cubic-bezier(0.4,0,0.2,1); }
.img-zoom:hover img { transform: scale(1.06); }

/* ── SHIMMER BUTTON ── */
.btn-shimmer {
  background: linear-gradient(90deg,
    var(--accent) 0%,
    #e8c44a 40%,
    var(--accent) 60%,
    var(--btn-hover) 100%);
  background-size: 200% auto;
  animation: shimmer 2.5s linear infinite;
}

/* ── PULSE DOT ── */
.pulse-dot {
  position: relative;
}
.pulse-dot::after {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid var(--accent);
  animation: ripple 1.8s ease-out infinite;
}

/* ── PAGE LOAD ── */
.page-load-mask {
  position: fixed;
  inset: 0;
  background: var(--primary-dark);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.5s, visibility 0.5s;
}
.page-load-mask.done {
  opacity: 0;
  visibility: hidden;
}
.loader-sun {
  width: 60px; height: 60px;
  border: 4px solid rgba(255,255,255,0.1);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: rotateSun 0.8s linear infinite;
}

/* ── NUMBER COUNTER ── */
.counter-num { animation: countUp 0.3s ease both; }

/* ── CARD HOVER GLOW ── */
.card-glow:hover {
  box-shadow: 0 0 0 3px rgba(201,162,39,0.15),
              0 20px 48px rgba(0,0,0,0.12);
}