/* ============================================
   AMG SAFARIS — ANIMATIONS CSS
   ============================================ */

/* ---- Hero Text Animation ---- */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes slideInRight {
  from { opacity: 0; transform: translateX(32px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-32px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ---- Gold Shimmer ---- */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}
.shimmer-text {
  background: linear-gradient(90deg, var(--primary) 0%, var(--primary-light) 50%, var(--primary) 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 3s linear infinite;
}

/* ---- Counter ---- */
@keyframes counter-appear {
  from { opacity: 0; transform: translateY(8px) scale(0.9); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ---- Card Hover ---- */
@keyframes card-lift {
  to { transform: translateY(-6px); box-shadow: 0 20px 60px rgba(0,0,0,0.16); }
}

/* ---- Pulse ---- */
@keyframes pulse-ring {
  0%   { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(1.5); opacity: 0; }
}

/* ---- Image Lazy Load ---- */
@keyframes blur-in {
  from { filter: blur(12px); opacity: 0.5; }
  to   { filter: blur(0); opacity: 1; }
}
img.loaded { animation: blur-in 0.4s ease forwards; }

/* ---- Button Ripple ---- */
.btn { position: relative; overflow: hidden; }
.btn::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(255,255,255,0.15);
  opacity: 0;
  transform: scale(0);
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.btn:active::after { transform: scale(2); opacity: 0; transition: none; }

/* ---- Stagger children ---- */
.stagger-children > *:nth-child(1) { animation-delay: 0.05s; }
.stagger-children > *:nth-child(2) { animation-delay: 0.1s; }
.stagger-children > *:nth-child(3) { animation-delay: 0.15s; }
.stagger-children > *:nth-child(4) { animation-delay: 0.2s; }
.stagger-children > *:nth-child(5) { animation-delay: 0.25s; }
.stagger-children > *:nth-child(6) { animation-delay: 0.3s; }

/* ============================================
   PHASE 6 — PREMIUM MOTION ADDITIONS
   ============================================ */

/* Hero entrance — staggered fade up */
.hero-eyebrow{animation:fadeInUp 0.7s var(--t-smooth) both}
.hero-title{animation:fadeInUp 0.8s var(--t-smooth) 0.1s both}
.hero-subtitle{animation:fadeInUp 0.8s var(--t-smooth) 0.2s both}
.hero-actions{animation:fadeInUp 0.8s var(--t-smooth) 0.3s both}
.hero-stats{animation:fadeInUp 0.8s var(--t-smooth) 0.4s both}
.hero-visual{animation:scaleIn 1s var(--t-smooth) 0.2s both}

/* Section heading underline sweep on reveal */
.section-label{position:relative}

/* Card lift refinement — handled in components, ensure GPU compositing */
.tour-card,.day-trip-card,.testi-card,.dest-card,.team-card{will-change:transform}

/* Button shine sweep */
.btn-primary::after{content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,0.35),transparent);transform:skewX(-20deg);transition:left 0.6s var(--t-smooth);pointer-events:none}
.btn-primary:hover::after{left:140%}

/* Image zoom containers (decorative) */
.zoom-on-hover{overflow:hidden}
.zoom-on-hover img{transition:transform 0.7s var(--t-smooth)}
.zoom-on-hover:hover img{transform:scale(1.06)}

/* Nav link underline grow */
.nav-link::after{content:'';position:absolute;bottom:0.3rem;left:50%;width:0;height:2px;background:var(--primary);border-radius:2px;transition:width 0.28s var(--t-smooth),left 0.28s var(--t-smooth)}
.nav-link:hover::after{width:calc(100% - 2rem);left:1rem}
.nav-link.active::after{width:calc(100% - 2rem);left:1rem}

/* Light parallax float for hero badge */
@keyframes floatSoft{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.hero-badge{animation:floatSoft 4.5s ease-in-out infinite}

/* Dropdown menu entrance handled via transition; refine item stagger */
.nav-dropdown-menu a{transition:background var(--t-fast),color var(--t-fast),padding-left var(--t-fast)}
.nav-dropdown-menu a:hover{padding-left:calc(var(--sp-4) + 4px)}

/* Counter pop */
@keyframes counterPop{0%{transform:scale(0.96);opacity:0.6}100%{transform:scale(1);opacity:1}}
[data-counter]{display:inline-block}

/* Smooth modal scale already handled. Add backdrop fade */
.booking-success-backdrop{transition:opacity 0.3s ease}

/* Respect reduced motion */
@media (prefers-reduced-motion:reduce){
  .hero-eyebrow,.hero-title,.hero-subtitle,.hero-actions,.hero-stats,.hero-visual,.hero-badge{animation:none!important}
  .btn-primary::after{display:none}
}
