/* Zelfde soort in-beeld-animaties als CarCleaning/Studio, aangepast aan de
 * (eenvoudigere, gecentreerde) hero-opbouw van deze introductiepagina. */
@media (prefers-reduced-motion: no-preference) {

  /* Hero: onderdelen rustig na elkaar infaden bij laden pagina */
  .hero-logo{animation:owHeroIn .8s ease both;}
  .hero .eyebrow{animation:owHeroIn .8s ease .12s both;}
  .hero h1{animation:owHeroIn .8s ease .22s both;}
  .hero p.lead{animation:owHeroIn .8s ease .32s both;}
  .hero-actions{animation:owHeroIn .8s ease .42s both;}
  @keyframes owHeroIn{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}

  /* Scroll-reveal: elementen komen rustig in beeld tijdens scrollen */
  .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease, transform .7s ease;}
  .reveal.in-view{opacity:1;transform:translateY(0);}
  .cards3 .card.reveal:nth-child(1){transition-delay:0s;}
  .cards3 .card.reveal:nth-child(2){transition-delay:.08s;}
  .cards3 .card.reveal:nth-child(3){transition-delay:.16s;}
  .cards2 .card.reveal:nth-child(1){transition-delay:0s;}
  .cards2 .card.reveal:nth-child(2){transition-delay:.08s;}

  /* Iets levendiger hover op kaarten en knoppen */
  .card{transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;}
  .card:hover{transform:translateY(-6px) scale(1.015);border-color:var(--purple);}
  .btn{transition:transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;}
  .btn-primary:hover{box-shadow:0 10px 24px rgba(121,49,183,0.35);}
}