/* ==========================================
   FATHER & SONS
   Animation Styles
========================================== */

.hero-content{animation:heroEnter 1s ease forwards;}
@keyframes heroEnter{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:translateY(0);}}

.eyebrow{animation:fadeIn .8s ease .2s both;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}

.btn{position:relative;overflow:hidden;}
.btn::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:rgba(255,255,255,.18);transition:.4s;}
.btn:hover::before{left:100%;}

.badge{animation:badgeRise .8s ease forwards;}
.badge:nth-child(1){animation-delay:.4s;}
.badge:nth-child(2){animation-delay:.6s;}
.badge:nth-child(3){animation-delay:.8s;}
@keyframes badgeRise{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}

.scroll-indicator span{animation:scrollPulse 2s infinite;}
@keyframes scrollPulse{0%{opacity:.3;transform:scaleY(.6);}50%{opacity:1;transform:scaleY(1);}100%{opacity:.3;transform:scaleY(.6);}}

.hero{animation:heroZoom 12s ease infinite alternate;}
@keyframes heroZoom{from{background-size:100%;}to{background-size:110%;}}

.nav-button,.btn{transition:transform .3s ease,box-shadow .3s ease;}
.nav-button:hover,.btn:hover{box-shadow:0 10px 30px rgba(207,230,47,.25);}

.service-card{
  animation:serviceReveal .8s ease forwards;
  opacity:0;
  transform:translateY(20px);
}
.service-card:nth-child(1){animation-delay:.1s;}
.service-card:nth-child(2){animation-delay:.2s;}
.service-card:nth-child(3){animation-delay:.3s;}
.service-card:nth-child(4){animation-delay:.4s;}
.service-card:nth-child(5){animation-delay:.5s;}
.service-card:nth-child(6){animation-delay:.6s;}

@keyframes serviceReveal{to{opacity:1;transform:translateY(0);}}

.stat-card,.review-card{animation:fadeUp .8s ease both;}
.stat-card:nth-child(1),.review-card:nth-child(1){animation-delay:.1s;}
.stat-card:nth-child(2),.review-card:nth-child(2){animation-delay:.2s;}
.stat-card:nth-child(3),.review-card:nth-child(3){animation-delay:.3s;}
.stat-card:nth-child(4){animation-delay:.4s;}

@keyframes fadeUp{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:translateY(0);}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;}
}

@media (max-width: 768px) {
  .service-card {
    opacity: 1;
    transform: none;
    animation: none;
  }
}
