/* ============================================================
   RESPONSIVE — mobile nav, breakpoints, compact footer
   ============================================================ */

/* Desktop ≥ 1024 — handled by base */

/* Tablet & below: collapse nav into drawer */
@media (max-width: 1024px) {
  :root { --header-h: 72px; }

  .nav-toggle {
    display: inline-flex;
    color: var(--text, #E8ECF7);
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.10);
  }
  .nav-toggle:hover { background: rgba(255,255,255,.08); }

  .header-actions { gap: var(--sp-2); }
  .header-actions .lang-switch button { padding: 4px 9px; font-size: .72rem; }

  .nav {
    position: fixed;
    inset: 0;
    top: var(--header-h);
    background: rgba(11,16,36,0.98);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    flex-direction: column;
    align-items: stretch;
    padding: var(--sp-6) clamp(1.25rem, 6vw, 3rem) var(--sp-8);
    transform: translateX(100%);
    opacity: 0; visibility: hidden;
    transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease), visibility var(--dur) var(--ease);
    overflow-y: auto;
    z-index: 99;
  }
  html[dir="rtl"] .nav { transform: translateX(-100%); }
  .nav.is-open { transform: translateX(0); opacity: 1; visibility: visible; }

  .nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    width: 100%;
  }

  .nav__link {
    color: #cfd5e6;
    padding: 16px 12px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    border-radius: 0;
    font-size: 1.05rem;
    white-space: normal;
  }
  .nav__link:hover { background: transparent; color: #fff; }
  .site-header .nav__link.is-active,
  .site-header .nav__link.has-active-child {
    color: var(--nav-active-fg) !important;
    background: var(--nav-active-bg) !important;
    box-shadow: 0 2px 14px var(--nav-active-shadow);
  }

  .nav__menu {
    position: static;
    background: transparent;
    border: 0;
    box-shadow: none;
    opacity: 1; visibility: visible; transform: none;
    padding: 6px 0 14px;
    min-width: 0;
  }
  .nav__menu-item { padding: 12px 16px; }
  .nav__menu-item:hover { background: rgba(255,255,255,0.06); }
  .nav__menu-item strong { color: #fff; }
  .nav__menu-item span { color: #aeb6cb; }
  .site-header .nav__menu-item.is-active {
    color: var(--nav-active-fg) !important;
    font-weight: 700;
    background: var(--nav-active-bg) !important;
  }
  .site-header .nav__menu-item.is-active strong { color: var(--nav-active-fg) !important; }
  .site-header .nav__menu-item.is-active span:not(.dot) { color: var(--nav-active-muted) !important; }
  .nav__menu--schools .nav__menu-item strong { color: #fff; }

  body.nav-open { overflow: hidden; }

  /* Mobile-style compact topbar at tablet too */
  .topbar__meta:first-child { display: none; }
}

/* General responsiveness for grids */
@media (max-width: 980px) {
  .grid-3 { grid-template-columns: 1fr 1fr !important; }
  .grid-4 { grid-template-columns: 1fr 1fr !important; }
}

/* ---- Compact footer @ tablet ---- */
@media (max-width: 1024px) {
  .site-footer__top {
    grid-template-columns: 1fr 1fr;
    gap: clamp(1.25rem, 3vw, 2rem);
    padding-block: clamp(2.25rem, 5vw, 3.5rem) clamp(1.25rem, 3vw, 2rem);
  }
  .footer-brand p { max-width: none; font-size: .88rem; }
  .footer-brand img { width: 48px; height: 48px; }
}

/* ---- Compact footer @ mobile ---- */
@media (max-width: 640px) {
  .grid-2,
  .grid-3,
  .grid-4 { grid-template-columns: 1fr !important; }

  .header-actions .btn { display: none; }
  .brand__tag { display: none; }
  .brand__name { font-size: .95rem; }
  .brand img { width: 40px; height: 40px; }
  .brand__logo-wrap::before { inset: -3px; }

  .topbar { font-size: .72rem; }
  .topbar__inner { min-height: 34px; }
  .topbar__meta { gap: var(--sp-3); }

  .site-footer__top {
    grid-template-columns: 1fr;
    gap: var(--sp-5);
    padding-block: var(--sp-6) var(--sp-4);
  }
  .site-footer h4 { margin-bottom: var(--sp-2); font-size: .72rem; }
  .site-footer ul { gap: .35rem; }
  .site-footer p, .site-footer a, .site-footer li { font-size: .88rem; }
  .footer-brand { gap: var(--sp-3); }
  .footer-brand p { display: none; }
  .footer-social { margin-top: var(--sp-3); gap: .4rem; }
  .footer-social a { width: 34px; height: 34px; }
  .footer-newsletter { margin-top: var(--sp-2); }
  .footer-newsletter input { padding: 7px 12px; font-size: .88rem; }
  .site-footer__bottom {
    flex-direction: column;
    text-align: center;
    gap: var(--sp-2);
    padding-block: var(--sp-4);
    font-size: .76rem;
  }
  .site-footer__legal { justify-content: center; transform: none; }
}

/* Hide on small */
@media (max-width: 720px) {
  .hide-sm { display: none !important; }
}