/* ── Zorg Alliantie Nederland — Subtiele animaties ── */

/* Keyframe: rustige fade omhoog */
@keyframes za-fadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Hero: inlaad-animatie bij openen pagina ── */
.ph-ey   { animation: za-fadeUp .5s .05s ease both; }
.ph-h1   { animation: za-fadeUp .5s .13s ease both; }
.ph-desc { animation: za-fadeUp .5s .21s ease both; }
.ph-btns { animation: za-fadeUp .5s .29s ease both; }
.ph-badges { animation: za-fadeUp .5s .35s ease both; }

/* Index.html afwijkende hero */
.hero-l { animation: za-fadeUp .55s .1s  ease both; }
.hero-r { animation: za-fadeUp .55s .24s ease both; }

/* ── Scroll-reveal: beginstatus (JS voegt .za-visible toe) ── */
.za-anim {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .45s ease, transform .45s ease;
}
.za-anim.za-visible {
  opacity: 1;
  transform: none;
}

/* Stagger voor broer/zus-elementen in een grid */
.za-anim:nth-child(2) { transition-delay: .07s; }
.za-anim:nth-child(3) { transition-delay: .14s; }
.za-anim:nth-child(4) { transition-delay: .21s; }
.za-anim:nth-child(5) { transition-delay: .28s; }

/* ── Knop hover-lift ── */
.nl.cta,
.nl.cta2 {
  transition: background .15s ease, transform .15s ease !important;
}
.nl.cta:hover  { transform: translateY(-1px); }
.nl.cta2:hover { transform: translateY(-1px); }

.btn-submit {
  transition: background .15s ease, transform .15s ease !important;
}
.btn-submit:hover { transform: translateY(-1px); }

.btn-g {
  transition: background .15s ease, transform .15s ease !important;
}
.btn-g:hover { transform: translateY(-1px); }

/* ── Kaart hover-lift (aanvullend op bestaande hover) ── */
.fi-block {
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.fi-block:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(26,46,74,.07);
}

.mv-card {
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}
.mv-card:hover { transform: translateY(-2px); }

.func-card {
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}
.func-card:hover { transform: translateY(-2px); }

.cc-card {
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}
.cc-card:hover { transform: translateY(-2px); }

/* ── Toegankelijkheid: geen animaties bij voorkeur ── */
@media (prefers-reduced-motion: reduce) {
  .ph-ey, .ph-h1, .ph-desc, .ph-btns, .ph-badges,
  .hero-l, .hero-r {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .za-anim {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .nl.cta, .nl.cta2, .btn-submit, .btn-g,
  .fi-block, .mv-card, .func-card, .cc-card {
    transition: background .15s ease !important;
    transform: none !important;
  }
}
