/* ============================================================
   RAMANI KALI — ANIMATIONS
   ============================================================ */

/* ── Keyframe ── */
@keyframes rk-fade-up {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0);    }
}

/* ── Header: slides in on every page load ── */
header {
  animation: rk-fade-up 0.32s cubic-bezier(0.4, 0, 0.2, 1) both;
  transition: background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow       0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Navbar: solid background after scroll ── */
header.rk-scrolled {
  background: rgba(255, 255, 255, 0.97) !important;
  box-shadow: 0 2px 24px rgba(29, 54, 131, 0.09);
}
.dark header.rk-scrolled {
  background: rgba(11, 11, 26, 0.97) !important;
}

/* ── Hero content: staggered entrance ── */
.rk-hero-item {
  animation: rk-fade-up 0.4s cubic-bezier(0.4, 0, 0.2, 1) both;
}
.rk-hero-item:nth-child(1) { animation-delay: 0.04s; }
.rk-hero-item:nth-child(2) { animation-delay: 0.10s; }
.rk-hero-item:nth-child(3) { animation-delay: 0.17s; }
.rk-hero-item:nth-child(4) { animation-delay: 0.24s; }
.rk-hero-item:nth-child(5) { animation-delay: 0.31s; }
.rk-hero-item:nth-child(6) { animation-delay: 0.38s; }

/* ── Scroll reveal: invisible until in view ── */
.rk-reveal {
  opacity: 0;
  transform: translateY(26px);
}
.rk-reveal.rk-visible {
  animation: rk-fade-up 0.36s cubic-bezier(0.4, 0, 0.2, 1) both;
}

/* ── Card hover: subtle lift + shadow ── */
.rk-card {
  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow  0.2s cubic-bezier(0.4, 0, 0.2, 1),
              border-color 0.2s ease;
}
.rk-card:hover {
  transform: translateY(-5px) scale(1.012);
  box-shadow: 0 24px 48px rgba(29, 54, 131, 0.14) !important;
}

/* ── Smooth transitions for all .group hover effects ── */
.group {
  transition: box-shadow       0.2s cubic-bezier(0.4, 0, 0.2, 1),
              border-color     0.2s ease,
              background-color 0.18s ease,
              color             0.18s ease;
}

/* ── Button transitions ── */
.rk-btn {
  transition: transform        0.16s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow       0.16s cubic-bezier(0.4, 0, 0.2, 1),
              background-color 0.16s ease,
              color            0.16s ease,
              border-color     0.16s ease;
}
.rk-btn:active {
  transform: scale(0.97) !important;
  transition-duration: 0.08s;
}

/* ── Input / select focus ring ── */
.rk-input {
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
}
.rk-input:focus {
  box-shadow: 0 0 0 3px rgba(255, 165, 0, 0.15) !important;
  outline: none;
}

/* ── Respect prefers-reduced-motion ── */
@media (prefers-reduced-motion: reduce) {
  .rk-hero-item,
  .rk-reveal,
  .rk-reveal.rk-visible,
  header {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .rk-card, .rk-btn, .rk-input, .group, header {
    transition: none !important;
  }
}