/* ═══════════════════════════════════════════════════
   RIFLOOP Belgium — Animations & Polish Layer
   ═══════════════════════════════════════════════════ */

/* ── Scroll Progress Bar ─────────────────────────── */
#scroll-progress {
  position: fixed; top: 0; left: 0; height: 2px;
  background: linear-gradient(90deg, #FF8F00, #FFC107, #FFD54F, #FFC107, #FF8F00);
  background-size: 300% 100%;
  animation: progressShimmer 2.5s linear infinite;
  z-index: 2000; width: 0%; transition: width 0.1s linear;
  box-shadow: 0 0 10px rgba(255,193,7,0.6);
}
@keyframes progressShimmer { 0% { background-position: 0% 50%; } 100% { background-position: 300% 50%; } }

/* ── Page Load ───────────────────────────────────── */
body { animation: pageReveal 0.7s ease forwards; }
@keyframes pageReveal { from { opacity: 0; } to { opacity: 1; } }

/* ── Premium Scrollbar ───────────────────────────── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #050505; }
::-webkit-scrollbar-thumb { background: linear-gradient(to bottom, #FFC107, #FF8F00); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #FFD54F; }

/* ── Hero Title Stagger ──────────────────────────── */
.hero-title-line { will-change: transform, opacity; }

/* ── Service Card Background Number ─────────────── */
.service-card::after {
  content: attr(data-num);
  position: absolute; bottom: 28px; right: 28px;
  font-family: 'Poppins', sans-serif;
  font-size: 5rem; font-weight: 900;
  color: rgba(255,193,7,0.04); line-height: 1;
  pointer-events: none; transition: color 0.4s; letter-spacing: -4px;
}
.service-card:hover::after { color: rgba(255,193,7,0.07); }

/* ── Counter Flash ───────────────────────────────── */
@keyframes counterGlow {
  0%, 100% { text-shadow: 0 0 30px rgba(255,193,7,0.3); }
  50% { text-shadow: 0 0 70px rgba(255,193,7,0.8), 0 0 120px rgba(255,193,7,0.3); }
}
.stat-number.counting { animation: counterGlow 0.15s ease; }

/* ── City Bar Animated Reset ─────────────────────── */
.city-bar-fill { width: 0 !important; }
.city-bar-fill.animated { transition: width 1.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important; }

/* ── Map tooltip ─────────────────────────────────── */
.map-tooltip {
  position: fixed;
  background: rgba(5,5,5,0.92); backdrop-filter: blur(12px);
  border: 1px solid rgba(255,193,7,0.28); color: #FFC107;
  padding: 7px 14px; border-radius: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.78rem; font-weight: 600;
  pointer-events: none; white-space: nowrap; z-index: 100;
  opacity: 0; transition: opacity 0.2s;
}
.map-tooltip.show { opacity: 1; }

/* ── Hamburger Transform ─────────────────────────── */
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; transform: translateX(-6px); }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }



/* ── Glassmorphism Testimonial Enhance ───────────── */
.testimonial-card {
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}

/* ── About Frame Glow ────────────────────────────── */
.about-img-frame {
  box-shadow: 0 0 0 1px rgba(255,193,7,0.08), 0 40px 120px rgba(0,0,0,0.6), 0 0 80px rgba(255,193,7,0.04);
}

/* ── Active Nav Indicator ────────────────────────── */
.nav-links a.active { color: #fff; }
.nav-links a.active::after { transform: scaleX(1); }

/* ── Form Button Loading ─────────────────────────── */
.btn-primary.loading { pointer-events: none; opacity: 0.7; }

/* ── Stat Block Hover Glow Enhancement ───────────── */
.stat-block:hover { box-shadow: 0 0 0 1px rgba(255,193,7,0.15), 0 24px 60px rgba(0,0,0,0.5), 0 0 60px rgba(255,193,7,0.04); }

/* ── Footer Glow Pulse ───────────────────────────── */
@keyframes footerGlow { 0%, 100% { opacity: 0.06; } 50% { opacity: 0.12; } }
.footer-glow { animation: footerGlow 6s ease infinite; }

/* ── Corner Badge Glow ───────────────────────────── */
.corner-inner::before {
  content: '';
  position: absolute; inset: -6px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,193,7,0.08) 0%, transparent 70%);
  animation: cornerGlow 3s ease infinite;
}
@keyframes cornerGlow { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } }

/* ── Smooth Scroll Hint ──────────────────────────── */
.hero-scroll-hint { animation: scrollHintIn 1s 1.8s ease both; }
@keyframes scrollHintIn { from { opacity: 0; transform: translateX(-50%) translateY(16px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }

/* ── Coverage City Animated Bars ─────────────────── */
.city-bar-fill { transition: none; }

/* ── Section Divider Utility ─────────────────────── */
.divider-gold {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,193,7,0.18), transparent);
  margin: 0;
}

/* ── Logo pulse ──────────────────────────────────── */
@keyframes logoPulse {
  0%, 100% { filter: drop-shadow(0 0 6px rgba(255,193,7,0.5)); }
  50% { filter: drop-shadow(0 0 18px rgba(255,193,7,0.95)); }
}
.logo-icon { animation: logoPulse 3.5s ease infinite; }

/* ── Hero badge shimmer ──────────────────────────── */
.hero-badge {
  background-size: 200% 100%;
  animation: badgeShimmer 4s linear infinite;
}
@keyframes badgeShimmer {
  0% { background-position: 100% 50%; }
  100% { background-position: -100% 50%; }
}

/* ── Marquee fade edges already in style.css, reinforce ── */
.marquee-wrap { position: relative; z-index: 5; }