/* ==========================================================================
   Dutt Academy — Responsive Rules
   Breakpoints tested for: 1920 / 1440 / 1280 / 1024 / 768 / 480 / 428 / 414 /
   412 / 390 / 375 / 360 / 340 / 320 (incl. mobile menu open + modal open)
   ========================================================================== */

/* ---------- Large desktop refinement ---------- */
@media (min-width: 1440px) {
  .container { max-width: 1280px; }
}

/* ---------- Laptop / small desktop ---------- */
@media (max-width: 1280px) {
  .hero__inner { gap: var(--space-8); }
  .students__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); }
}

/* ---------- Tablet landscape ---------- */
@media (max-width: 1024px) {
  :root { --navbar-height: 76px; }

  .navbar__nav { display: none; }
  .navbar__toggle { display: flex; }

  .hero__inner { grid-template-columns: 1fr; text-align: left; }
  .hero__visual { height: 340px; order: -1; margin-bottom: var(--space-6); }
  .hero__lede { max-width: 100%; }

  .not-found__inner { grid-template-columns: 1fr; gap: var(--space-6); min-height: 0; }
  .not-found__content { text-align: center; }
  .not-found__message { margin-left: auto; margin-right: auto; }
  .not-found__rule { margin-left: auto; margin-right: auto; }
  .not-found__illustration { order: -1; height: 330px; max-width: 560px; }
  .not-found__post { height: 220px; bottom: 46px; }
  .not-found__sun { width: 240px; height: 240px; top: 24px; }
  .not-found__sign--top { top: 89px; }
  .not-found__sign--bottom { top: 146px; }
  .not-found__book--top { bottom: 66px; }
  .not-found__book--middle { bottom: 43px; }
  .not-found__book--bottom { bottom: 22px; }
  .not-found__ground { bottom: 17px; }

  .about__grid { grid-template-columns: 1fr; }

  .feature-list { grid-template-columns: 1fr; }

  .special-batches__grid { grid-template-columns: 1fr; }

  .courses__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .students__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .approach__grid { grid-template-columns: 1fr; gap: var(--space-6); }

  .contact__grid { grid-template-columns: 1fr; }

  .map-card { grid-template-columns: 1fr; }
  .map-card__frame { height: 240px; }

  .footer__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .footer__brand { grid-column: 1 / -1; }
}

/* ---------- Tablet portrait ---------- */
@media (max-width: 768px) {
  .stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6) var(--space-4); }

  .courses__filter-bar {
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 8px;
    margin-bottom: var(--space-6);
    scrollbar-width: none;
  }
  .courses__filter-bar::-webkit-scrollbar { display: none; }

  .courses__grid { grid-template-columns: 1fr; }

  .course-modal { padding: var(--space-6); }
  .course-modal__facts { grid-template-columns: 1fr; }

  .students__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .results__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .footer__grid { grid-template-columns: 1fr; }

  .student-modal { padding: var(--space-6); }
  .student-modal__facts { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

/* ---------- Mobile ---------- */
@media (max-width: 480px) {
  :root { --navbar-height: 68px; }

  .container { padding: 0 18px; }

  .navbar__logo-img { height: 26px; }
  .navbar__wordmark-name { font-size: 0.92rem; }
  .navbar__cta { display: none; }

  .hero { padding-top: calc(var(--navbar-height) + 32px); }
  .hero__actions { flex-direction: column; align-items: stretch; }
  .hero__actions .btn { width: 100%; }
  .hero__visual { height: 260px; }
  .hero__card { padding: 10px 14px; }
  .hero__card-value { font-size: 0.95rem; }

  .not-found { padding-top: calc(var(--navbar-height) + var(--space-6)); }
  .not-found__illustration { height: 270px; border-radius: var(--radius-md); }
  .not-found__code { font-size: 5.5rem; }
  .not-found__title { font-size: 2rem; }
  .not-found__message { font-size: 0.95rem; }
  .not-found__sign { width: 140px; height: 42px; font-size: 0.58rem; }
  .not-found__sign--top { left: calc(50% - 126px); top: 72px; }
  .not-found__sign--bottom { left: calc(50% - 10px); top: 119px; }
  .not-found__post { width: 17px; height: 175px; bottom: 36px; }
  .not-found__sun { width: 195px; height: 195px; top: 16px; }
  .not-found__book { left: calc(50% - 106px); width: 138px; height: 21px; border-width: 4px; box-shadow: 7px 6px 0 var(--color-gold); }
  .not-found__book--top { bottom: 49px; }
  .not-found__book--middle { bottom: 30px; left: calc(50% - 96px); box-shadow: 7px 6px 0 var(--color-primary); }
  .not-found__book--bottom { bottom: 14px; left: calc(50% - 87px); }
  .not-found__ground { bottom: 10px; }
  .not-found__help { font-size: 0.9rem; }

  .special-batch-card { grid-template-columns: minmax(0, 1fr) 34%; min-height: 220px; }
  .special-batch-card__content { padding: var(--space-4); }
  .special-batch-card__title { font-size: 1.18rem; }
  .special-batch-card__image { min-height: 220px; }

  .stats__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }

  .courses__grid { grid-template-columns: 1fr; max-width: 380px; margin: 0 auto; }

  .students__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    max-width: 100%;
    margin: 0;
  }
  .student-card {
    border-radius: var(--radius-sm);
  }
  .student-card__badge {
    top: 6px;
    left: 6px;
    font-size: 0.52rem;
    padding: 3px 6px;
    letter-spacing: 0.02em;
  }
  .student-card__body {
    padding: 10px;
    gap: 3px;
  }
  .student-card__name {
    font-size: 0.88rem;
    line-height: 1.25;
  }
  .student-card__stream {
    font-size: 0.72rem;
    line-height: 1.3;
  }
  .student-card__score-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    margin: 4px 0 6px;
  }
  .student-card__score {
    font-size: 0.92rem;
    line-height: 1.2;
  }
  .student-card__year {
    font-size: 0.68rem;
    line-height: 1.2;
  }
  .student-card__highlight {
    font-size: 0.72rem;
    line-height: 1.35;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .student-card__cta {
    padding: 7px 6px;
    font-size: 0.76rem;
    min-height: 36px;
  }

  .results__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .results__value--percentile { font-size: 1.5rem; }

  .form-row--split { flex-direction: column; }

  .student-modal__facts { grid-template-columns: 1fr; }
  .student-modal__header { flex-direction: column; text-align: center; }

  .footer__bottom { flex-direction: column; text-align: center; }
  .footer__legal-links { justify-content: center; }
}

@media (max-width: 375px) {
  .container { padding: 0 12px; }
  .students__grid { gap: 10px; }
  .student-card__body { padding: 8px; }
  .student-card__name { font-size: 0.82rem; }
  .student-card__stream { font-size: 0.68rem; }
  .student-card__score { font-size: 0.88rem; }
  .student-card__highlight { font-size: 0.68rem; }
  .student-card__cta { font-size: 0.72rem; padding: 6px 4px; min-height: 34px; }
  .hero__headline { font-size: 1.9rem; }
  .section-title { font-size: 1.6rem; }
  .results__value--percentile { font-size: 1.3rem; }
}
