/* ════════════════════════════════════════════════════════
   RESPONSIVE — loaded last on every page.
   Breakpoints: 1180 · 1080 (nav → drawer) · 900 · 640 · 420
   Mobile-first behaviour for touch: hover-only content is
   always visible on devices without hover.
════════════════════════════════════════════════════════ */

/* ── Generic helpers (replace old inline grids) ── */
.rg { display: grid; }
.rg-2 { grid-template-columns: 1fr 1fr; }
.rg-3 { grid-template-columns: repeat(3, 1fr); }
.rg-4 { grid-template-columns: repeat(4, 1fr); }
.rg-5 { grid-template-columns: repeat(5, 1fr); }

html { -webkit-text-size-adjust: 100%; }
img, svg, video, iframe { max-width: 100%; }
.prog-cards-grid { grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); }
.hero { min-height: 100vh; min-height: 100svh; }

/* ═════════ ≤1180 ═════════ */
@media (max-width: 1180px) {
  .fac-grid { grid-template-columns: repeat(3, 1fr); }
  .footer-grid { gap: 2rem; }
  .pc-body-inner { gap: 3rem; grid-template-columns: 1fr 310px; }
}

/* ═════════ ≤1080 — nav becomes a drawer ═════════ */
@media (max-width: 1080px) {
  .nav-toggle { display: inline-flex; }
  .nav-cta { margin-left: auto; padding: 9px 18px; }
  .nav-links {
    position: fixed; top: 72px; left: 0; right: 0;
    max-height: calc(100vh - 72px); max-height: calc(100dvh - 72px);
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    flex-direction: column; align-items: stretch; gap: 0; margin: 0;
    padding: 0.5rem 1.25rem 2.5rem;
    background: rgba(5,10,38,0.99);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    box-shadow: 0 30px 60px rgba(0,0,0,0.5);
    opacity: 0; visibility: hidden; transform: translateY(-10px);
    transition: opacity 0.25s, transform 0.3s var(--ease), visibility 0.25s;
  }
  .nav.menu-open .nav-links { opacity: 1; visibility: visible; transform: none; }
  .nav-links > li { border-bottom: 1px solid rgba(255,255,255,0.07); }
  .nav-links > li > a, .nav-links > li > button.nav-drop-btn {
    display: flex; width: 100%; justify-content: space-between;
    font-size: 16px; padding: 16px 4px;
  }
  .nav-links > li > a::after, .nav-links > li > button::after { display: none; }
  .nav-sub {
    position: static; opacity: 1; visibility: visible; transform: none;
    display: none; min-width: 0; background: transparent; border: 0; box-shadow: none;
    padding: 0 0 0.75rem 0.75rem;
  }
  .nav-sub::before { display: none; }
  .has-sub:hover .nav-sub { display: none; }
  .has-sub.open .nav-sub { display: block; }
  .has-sub:hover .nav-caret { transform: none; }
  .has-sub.open .nav-caret { transform: rotate(180deg); }
  .nav-sub a { font-size: 15px; padding: 12px 10px; }
  .nav-links .nav-cta-li { border-bottom: 0; padding-top: 1.25rem; display: block; }
  .nav-links .nav-cta-li a {
    justify-content: center; background: var(--red); color: var(--white);
    border-radius: 6px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; font-size: 13.5px;
  }
}

/* ═════════ ≤1000 ═════════ */
@media (max-width: 1000px) {
  /* Hero */
  .hero { min-height: 0; }
  .hero-inner { grid-template-columns: 1fr; padding: 118px 2rem 130px; gap: 2.5rem; }
  .hero-sub { max-width: 560px; }
  .hero-quiz { max-width: 560px; }
  .hero-angle { height: 70px; }

  /* Journey → single-column runway */
  .journey-inner { padding: 5rem 1.5rem; }
  .journey-top { margin-bottom: 3rem; }
  .journey-runway-road, .journey-runway-dashes { left: 22px; transform: none; top: 90px; height: calc(100% - 130px); }
  .journey-runway-plane { text-align: left; padding-left: 8px; font-size: 30px; }
  .journey-step { display: flex; align-items: flex-start; gap: 1.1rem; }
  .journey-step-empty { display: none; }
  .journey-step-node { order: 0; padding-top: 12px; flex-shrink: 0; width: 44px; }
  .journey-step-card { order: 1; flex: 1; min-width: 0; padding: 1.4rem; grid-column: auto !important; }
  .journey-steps { gap: 1.75rem; }

  /* Team */
  .team-section { padding: 5.5rem 0; }
  .team-head { grid-template-columns: 1fr; gap: 1.25rem; margin-bottom: 3rem; }
  .people-mgmt { grid-template-columns: 1fr 1fr; }
  .people-mgmt .pm-card:last-child { grid-column: 1 / -1; }
  .people-fac { grid-template-columns: 1fr 1fr; }

  /* Programmes (home) */
  .prog-section { padding: 5.5rem 0; }
  .prog-head { grid-template-columns: 1fr; gap: 1.5rem; margin-bottom: 2.5rem; }
  .ph-right { align-items: flex-start; text-align: left; }
  .prog-tracks { grid-template-columns: 1fr; gap: 12px; }
  .ptrack { min-height: 0; }
  .ptrack .pt-content { position: relative; inset: auto; padding: 5.5rem 1.75rem 1.75rem; }
  .pt-courses { max-height: none; opacity: 1; }
  .pt-link { opacity: 1; transform: none; }
  .ptrack:hover .pt-bg { transform: none; filter: none; }

  /* Why */
  .why-section { padding: 5.5rem 0; }
  .why-head { margin-bottom: 3rem; }
  .why-bento { grid-template-columns: 1fr 1fr; }
  .wb-navy, .wb-tall { grid-column: auto; grid-row: auto; }
  .wb-wide, .wb-partners, .wb-cta-card { grid-column: 1 / -1; }
  .wb-inner { padding: 2rem; }

  /* Final CTA */
  .fcta-inner { padding: 6rem 1.5rem; }

  /* Footer */
  footer { padding: 3.5rem 1.5rem 2rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem 2rem; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-desc { max-width: 420px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 1rem; }

  /* Inner pages */
  .pg-hero { padding: 8rem 1.5rem 4.5rem; }
  .pg-section { padding: 4.5rem 1.5rem; }
  .pg-section-head-split { grid-template-columns: 1fr; gap: 1.25rem; margin-bottom: 2.5rem; }
  .pg-section-head-split > div[style*="align-items:flex-end"] { align-items: flex-start !important; }
  .story-grid { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 250px; }
  .story-card.tall { grid-row: auto; grid-column: 1 / -1; min-height: 340px; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: none; grid-auto-rows: 170px; }
  .gallery-grid.single { grid-template-rows: none; }
  .values-grid { grid-template-columns: 1fr 1fr; }
  .vm-grid { grid-template-columns: 1fr; }
  .people-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-grid { grid-template-columns: 1fr 1fr; }
  .blog-card.featured { grid-template-columns: 1fr; }
  .blog-card.featured .blog-img { min-height: 240px; height: 240px; }
  .blog-card.featured .blog-body { padding: 1.75rem; }
  .contact-wrap { grid-template-columns: 1fr; gap: 3rem; }
  .rg-2 { grid-template-columns: 1fr; gap: 1.25rem !important; }
  .rg-3 { grid-template-columns: 1fr 1fr; }
  .rg-4 { grid-template-columns: 1fr 1fr; }
  .rg-5 { grid-template-columns: repeat(2, 1fr); }
  .rg-5 > :last-child { grid-column: 1 / -1; }
  .statbar { padding: 1.5rem 1.25rem; }
  [style*="rem 4rem"] { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
  .photo-strip { grid-template-columns: 1fr 1fr; }
  .photo-strip figure:first-child { grid-column: 1 / -1; min-height: 260px; }
  .mou-grid { grid-template-columns: repeat(2, 1fr); }

  /* Programme detail pages */
  .pc-hero { padding: 8rem 1.5rem 3.5rem; }
  .pc-body { padding: 4rem 1.5rem; }
  .pc-body-inner { grid-template-columns: 1fr; gap: 3rem; }
  .pc-sidebar { position: static !important; }
  .prog-ov-hero { padding: 8.5rem 1.5rem 5rem; }
  .prog-ov-grid-section { padding: 4.5rem 1.5rem; }
  .prog-ov-section-head { margin-bottom: 3rem; }
  .prog-pathway-bar { padding: 1.5rem; row-gap: 1rem; }
  .prog-pw-step { flex: 0 1 auto; min-width: 0; }
}

/* ═════════ ≤820 ═════════ */
@media (max-width: 820px) {
  .fac-grid { grid-template-columns: repeat(2, 1fr); }
  .pc-modules, .pc-outcomes { grid-template-columns: 1fr; }
}

/* ═════════ ≤640 — phones ═════════ */
@media (max-width: 640px) {
  .nav { height: 64px; padding: 0 1rem; gap: 0.75rem; }
  .nav-logo { height: 40px; }
  .nav-links { top: 64px; max-height: calc(100vh - 64px); max-height: calc(100dvh - 64px); }
  .nav-cta { padding: 8px 14px; font-size: 11.5px; }

  .hero-inner { padding: 100px 1.25rem 100px; }
  .hero h1 { font-size: clamp(38px, 11vw, 50px); }
  .hero-sub { font-size: 15px; margin-bottom: 2rem; }
  .hero-btns { flex-direction: column; margin-bottom: 2.5rem; }
  .hero-btn-primary, .hero-btn-secondary { justify-content: center; width: 100%; }
  .hero-stats { gap: 1.25rem; padding-top: 1.75rem; justify-content: space-between; }
  .hero-hstat-n { font-size: 30px; }
  .hero-hstat-l { font-size: 9.5px; letter-spacing: 0.08em; }
  .hero-quiz { padding: 1.75rem 1.5rem; }
  .hero-quiz-title { font-size: 27px; }
  .hero-angle { height: 44px; }

  .journey-inner { padding: 4rem 1.25rem; }
  .journey-step-card { padding: 1.2rem; }
  .journey-step-title { font-size: 19px; }

  .team-wrap, .prog-wrap, .why-wrap { padding: 0 1.25rem; }
  .team-section, .prog-section, .why-section { padding: 4.5rem 0; }
  .mgmt-grid { grid-template-columns: 1fr; gap: 16px; margin-bottom: 3rem; }
  .mgmt-card { aspect-ratio: 4 / 4.4; }
  .fac-grid { gap: 12px; }
  .fac-card .t-body { padding: 1rem; }
  .fac-card .t-name { font-size: 16px; }
  .fac-card .t-bio { font-size: 12px; -webkit-line-clamp: 5; }
  .team-controls { flex-direction: column; align-items: stretch; }
  .team-btn-ghost, .team-btn-red { justify-content: center; }
  .people-mgmt { grid-template-columns: 1fr; }
  .people-fac { grid-template-columns: 1fr; }

  .ptrack .pt-content { padding: 5rem 1.4rem 1.5rem; }
  .pt-title { font-size: 26px; }
  .prog-cta-red { width: 100%; justify-content: center; padding: 16px 20px; }

  .why-bento { grid-template-columns: 1fr; }
  .wb-wide .wb-inner { flex-direction: column !important; align-items: flex-start !important; gap: 1.5rem !important; }
  .wb-wide .wb-inner > div[style*="flex-direction:column"] { flex-direction: row !important; gap: 2rem !important; }
  .wb-inner, .wb-partners, .wb-cta-card { padding: 1.6rem; }
  .wb-title { font-size: 22px; }
  .partner-chip { font-size: 11px; padding: 9px 12px; }

  .fcta-inner { padding: 4.5rem 1.25rem; }
  .fcta-btns { flex-direction: column; align-items: stretch; }
  .fcta-btns a { justify-content: center; }

  .footer-grid { grid-template-columns: 1fr; }
  .footer-logo { height: 54px; }
  .footer-bottom-badges { flex-wrap: wrap; }

  .pg-hero { padding: 7rem 1.25rem 3.5rem; }
  .pg-hero-sub, .pc-subtitle, .prog-ov-sub { font-size: 15px; }
  .pg-section { padding: 3.75rem 1.25rem; }
  .story-grid { grid-template-columns: 1fr; grid-auto-rows: 260px; }
  .story-card.tall { min-height: 380px; }
  .gallery-grid { grid-auto-rows: 130px; gap: 8px; }
  .values-grid, .blog-grid, .people-grid { grid-template-columns: 1fr; }
  .rg-3 { grid-template-columns: 1fr; }
  .rg-4 { grid-template-columns: 1fr 1fr; gap: 1.25rem !important; }
  .form-row { grid-template-columns: 1fr; }
  .form-submit { width: 100%; align-self: stretch; }
  .contact-info-card { padding: 1.5rem; }
  .video-placeholder { min-height: 260px; }
  .vm-card { padding: 1.75rem; }
  .vm-text { font-size: 18px; }
  .photo-strip { grid-template-columns: 1fr; }
  .photo-strip figure { min-height: 220px; }
  .mou-grid { gap: 8px; }
  .faq-q { font-size: 14.5px; padding: 1.25rem 0; }
  .statbar-in { justify-content: space-between; }
  .statbar-in > div { flex: 0 0 44%; }

  .pc-hero { padding: 7rem 1.25rem 3rem; }
  .pc-breadcrumb { flex-wrap: wrap; font-size: 10.5px; margin-bottom: 1.5rem; }
  .pc-meta-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem 1rem; }
  .pc-meta-sep { display: none; }
  .pc-body { padding: 3rem 1.25rem; }
  .pc-h2, .pc-h2.small { font-size: 24px; }
  .pc-pathway { padding: 1.25rem; }
  .prog-ov-hero { padding: 7.5rem 1.25rem 4rem; }
  .prog-ov-btns { flex-direction: column; }
  .prog-ov-btn-red, .prog-ov-btn-outline { justify-content: center; }
  .prog-ov-grid-section { padding: 3.5rem 1.25rem; }
  .prog-pathway-bar { display: none; }
  .prog-card { padding: 1.5rem; }
  .prog-cat-block { margin-bottom: 3rem; }

  .quiz-box { padding: 1.75rem 1.4rem; }
  .quiz-q { font-size: 24px; }
  .wa-float { height: 54px; padding: 0 15px; }
}

/* ═════════ ≤420 ═════════ */
@media (max-width: 420px) {
  .fac-grid { grid-template-columns: 1fr; }
  .fac-card .t-photo { aspect-ratio: 4 / 3.4; }
  .hero-stats { flex-wrap: wrap; }
  .rg-4 { grid-template-columns: 1fr; }
  .nav-cta { display: none; }
}

/* ═════════ Touch devices: nothing depends on hover ═════════ */
@media (hover: none) {
  .prog-card-arrow { opacity: 1 !important; transform: none !important; }
  .pt-courses { max-height: none; opacity: 1; }
  .pt-link { opacity: 1; transform: none; }
  .gallery-item figcaption { transform: none; }
  .ptrack:hover .pt-bg { transform: none; filter: none; }
  .wb:hover, .fac-card:hover, .mgmt-card:hover, .pm-card:hover, .blog-card:hover, .value-card:hover, .story-card:hover { transform: none; }
}

/* ═════════ Very short landscape phones ═════════ */
@media (max-height: 520px) and (orientation: landscape) {
  .hero { min-height: 0; }
  .hero-inner { padding-top: 96px; padding-bottom: 90px; }
  .nav-links { max-height: calc(100vh - 72px); }
}

/* ═════════ Reduced motion ═════════ */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .ticker-track { animation: none; }
  [data-reveal], .hero-reveal, .journey-reveal, .fcta-reveal { opacity: 1 !important; transform: none !important; }
}