/* ==========================================================================
   SaanjhCare — Keyframe Animations & View Transitions
   ========================================================================== */

@keyframes float-slow {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(14px, -22px) scale(1.05); }
}

@keyframes float-card {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-14px) rotate(0.6deg); }
}

@keyframes spin-slow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes pulse-dot {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.6); opacity: 0.5; }
}

@keyframes shine {
  from { transform: translateX(-120%); }
  to { transform: translateX(120%); }
}

@keyframes pop-in {
  0% { opacity: 0; transform: scale(0.85); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes fade-up {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes ring-pop {
  0% { transform: scale(0.6); opacity: 0; }
  60% { transform: scale(1.08); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

.hero-badge, .float-card, .intro-card { animation: fade-up 0.9s var(--ease-out) both; }
.float-card.card-1 { animation: fade-up 0.9s var(--ease-out) 0.1s both, float-card 6s ease-in-out 1s infinite; }
.float-card.card-2 { animation: fade-up 0.9s var(--ease-out) 0.28s both, float-card 6s ease-in-out 1.4s infinite; }
.float-card.card-3 { animation: fade-up 0.9s var(--ease-out) 0.46s both, float-card 6s ease-in-out 2.6s infinite; }

.hero h1 { animation: fade-up 0.9s var(--ease-out) 0.05s both; }
.hero .lead { animation: fade-up 0.9s var(--ease-out) 0.16s both; }
.hero-ctas { animation: fade-up 0.9s var(--ease-out) 0.26s both; }
.hero-stats { animation: fade-up 0.9s var(--ease-out) 0.36s both; }
.hero-badge { animation: fade-up 0.9s var(--ease-out) 0s both; }

/* ---------------------------------------------------------------
   Native cross-document View Transitions (progressive enhancement)
   Supported in Chromium 111+. Falls back silently elsewhere; the
   JS fade-transition in main.js covers all browsers.
--------------------------------------------------------------- */

::view-transition-old(root) {
  animation: vt-out 0.38s var(--ease-soft) both;
}
::view-transition-new(root) {
  animation: vt-in 0.5s var(--ease-out) both;
}

@keyframes vt-out {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(-14px) scale(0.99); }
}

@keyframes vt-in {
  from { opacity: 0; transform: translateY(14px) scale(0.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}
