/* =========================================================
   MEDSONET PHARMACY — Animations
   ========================================================= */

@keyframes fadeUp{
  from{ opacity:0; transform:translateY(26px); }
  to{ opacity:1; transform:translateY(0); }
}
@keyframes fadeIn{
  from{ opacity:0; }
  to{ opacity:1; }
}
@keyframes floatSlow{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-10px); }
}
@keyframes countPulse{
  0%{ opacity:0; transform:scale(.9); }
  100%{ opacity:1; transform:scale(1); }
}

.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }
.d1.in{ transition-delay:.05s; }
.d2.in{ transition-delay:.14s; }
.d3.in{ transition-delay:.23s; }
.d4.in{ transition-delay:.32s; }

.hl-1{ animation:floatSlow 6s ease-in-out infinite; }
.hl-2{ animation:floatSlow 7s ease-in-out infinite 1s; }

.h-title, .h-eyebrow, .h-desc, .h-btns, .h-stats{ animation:fadeUp .8s ease both; }
.h-eyebrow{ animation-delay:.05s; }
.h-title{ animation-delay:.14s; }
.h-desc{ animation-delay:.22s; }
.h-btns{ animation-delay:.3s; }
.h-stats{ animation-delay:.38s; }
.h-photo{ animation:fadeIn 1s ease .3s both; }

@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; }
  .hl-1,.hl-2{ animation:none; }
}
