/* ==========================================================
   MOBILE MOTION — phones have no mouse "hover", so the card
   effects you see on a laptop never played there.
   On phones / tablets / narrow windows, the card that scrolls
   into the MIDDLE of the screen comes alive (lift, glow, coloured
   top edge, icon wiggle + pulse ring), and a tap gives a quick
   "press". Driven by js/mobile-motion.js (class "is-focus").
   ========================================================== */
@keyframes mm-ring {
  0%   { box-shadow: 0 0 0 0 rgba(249,115,22,.45); }
  70%  { box-shadow: 0 0 0 16px rgba(249,115,22,0); }
  100% { box-shadow: 0 0 0 0 rgba(249,115,22,0); }
}
@keyframes mm-pop {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.18) rotate(-8deg); }
  70%  { transform: scale(.96) rotate(5deg); }
  100% { transform: scale(1.06) rotate(0); }
}

@media (hover: none), (max-width: 768px) {
  .feature-card, .academic-card, .achievement-card, .news-card, .testimonial-card,
  .gallery-item, .iitm-course, .iitm-step, .iitm-stat {
    transition: transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease, background .5s ease, border-color .5s ease;
  }
  .feature-icon, .academic-icon, .achievement-icon, .iitm-course .ic, .iitm-step i { transition: transform .4s ease; }

  /* About — "Why choose us" cards */
  .feature-card.is-focus { transform: translateY(-10px) scale(1.03); box-shadow: 0 18px 40px rgba(30,64,175,.18); border-top-color: var(--accent); }
  .feature-card.is-focus .feature-icon { animation: mm-pop .7s ease-out forwards, mm-ring 1.6s ease-out .3s infinite; }
  .feature-card.is-focus h3 { color: var(--accent-dark, #ea580c); transition: color .4s ease; }

  /* Academics */
  .academic-card.is-focus { transform: translateY(-10px) scale(1.03); border-color: var(--accent); box-shadow: 0 18px 40px rgba(30,64,175,.18); }
  .academic-card.is-focus::before { transform: scaleX(1); }
  .academic-card.is-focus .academic-icon { background: linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%); animation: mm-pop .7s ease-out forwards, mm-ring 1.6s ease-out .3s infinite; }
  .academic-card:nth-child(1).is-focus .grades { background: rgba(236, 72, 153, 0.15); color: #be185d; }
  .academic-card:nth-child(2).is-focus .grades { background: rgba(16, 185, 129, 0.15);  color: #047857; }
  .academic-card:nth-child(3).is-focus .grades { background: rgba(59, 130, 246, 0.15);  color: #1d4ed8; }
  .academic-card:nth-child(4).is-focus .grades { background: rgba(249, 115, 22, 0.15);  color: #c2410c; }

  /* Achievements (dark section) */
  .achievement-card.is-focus { transform: translateY(-8px) scale(1.02); background: rgba(255,255,255,0.14); border-color: var(--accent); box-shadow: 0 16px 36px rgba(0,0,0,.25); }
  .achievement-card.is-focus .achievement-icon { animation: mm-pop .7s ease-out forwards, mm-ring 1.6s ease-out .3s infinite; }
  .achievement-card .read-more-hint { opacity: 1; }          /* was only shown on hover — invisible on phones */
  .achievement-card.is-focus .read-more-hint { gap: 10px; }

  .news-card.is-focus { transform: translateY(-8px) rotate(-0.6deg) scale(1.02); box-shadow: 0 18px 40px rgba(30,64,175,.18); }
  .testimonial-card.is-focus { transform: translateY(-8px) scale(1.02); box-shadow: 0 18px 40px rgba(30,64,175,.18); }

  .gallery-item.is-focus { transform: translateY(-4px) scale(1.03); box-shadow: var(--shadow-lg); }
  .gallery-item.is-focus img { transform: scale(1.08); }
  .gallery-item.is-focus .gallery-overlay { opacity: 1; }

  .iitm-course.is-focus { transform: translateY(-6px) scale(1.02); box-shadow: 0 14px 30px rgba(30,64,175,.16); }
  .iitm-course.is-focus .ic { animation: mm-pop .7s ease-out forwards; }
  .iitm-step.is-focus { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(30,64,175,.12); }
  .iitm-step.is-focus i { animation: mm-pop .7s ease-out forwards, mm-ring 1.6s ease-out .3s infinite; }
  .iitm-stat.is-focus { background: rgba(255,255,255,.18); transform: scale(1.04); }

  /* tap = quick press */
  .feature-card:active, .academic-card:active, .achievement-card:active, .news-card:active,
  .testimonial-card:active, .gallery-item:active, .iitm-course:active, .btn:active {
    transform: scale(.96); transition: transform .08s ease;
  }
}
@media (prefers-reduced-motion: reduce) {
  .is-focus, .is-focus * { animation: none !important; }
}
