/* === HERO ENTRANCE ANIMATIONS (auto-play on load) === */
@keyframes heroUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes heroLeft{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}}
@keyframes heroFade{from{opacity:0}to{opacity:1}}

.hero-badge{animation:heroLeft .55s ease .15s both}
.hero h1{animation:heroUp .75s cubic-bezier(.22,1,.36,1) .28s both}
.hero-sub{animation:heroUp .75s cubic-bezier(.22,1,.36,1) .42s both}
.hero-desc{animation:heroUp .75s cubic-bezier(.22,1,.36,1) .54s both}
.hero-actions{animation:heroUp .75s cubic-bezier(.22,1,.36,1) .66s both}
.hero-features{animation:heroFade .75s ease .85s both}

/* Page hero (service & contact pages) */
.page-hero-content h1{animation:heroUp .7s cubic-bezier(.22,1,.36,1) .18s both}
.page-hero-content p{animation:heroUp .7s cubic-bezier(.22,1,.36,1) .32s both}
.breadcrumb{animation:heroFade .6s ease .1s both}

/* === PAGE TRANSITION (enter / exit) === */
@keyframes pgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes pgOut{to{opacity:0;transform:translateY(-8px)}}

body{animation:pgIn .38s cubic-bezier(.22,1,.36,1) both}
body.is-leaving{animation:pgOut .26s ease forwards}

/* === SCROLL REVEAL BASE === */
.reveal{
  opacity:0;
  transform:translateY(32px);
  transition:opacity .65s cubic-bezier(.4,0,.2,1),transform .65s cubic-bezier(.4,0,.2,1);
  will-change:opacity,transform;
}
.reveal.rv-left{transform:translateX(-28px)}
.reveal.rv-right{transform:translateX(28px)}
.reveal.rv-scale{transform:scale(.95) translateY(14px)}
.reveal.rv-fade{transform:none}
.reveal.visible{opacity:1;transform:none}

/* Stagger delays */
.rd1{transition-delay:.05s}
.rd2{transition-delay:.12s}
.rd3{transition-delay:.19s}
.rd4{transition-delay:.26s}
.rd5{transition-delay:.33s}
.rd6{transition-delay:.40s}
.rd7{transition-delay:.47s}
.rd8{transition-delay:.54s}
.rd9{transition-delay:.61s}
.rd10{transition-delay:.68s}

/* === RESPECT REDUCED MOTION === */
@media(prefers-reduced-motion:reduce){
  body,
  .hero-badge,.hero h1,.hero-sub,.hero-desc,.hero-actions,.hero-features,
  .page-hero-content h1,.page-hero-content p,.breadcrumb{
    animation:none
  }
  .reveal{opacity:1;transform:none;transition:none}
}
