@media (max-width: 1360px) {
  .nav__links { gap: .7rem; }
  .nav__links a { font-size: .8rem; }
  .nav__right { gap: .8rem; }
  .brand__name { font-size: .86rem; }
  .brand__sub { font-size: .5rem; }
}

/* responsive.css — breakpoints (loaded last) */

@media (max-width: 1240px) {
  .nav__links { gap: .85rem; }
  .nav__links a { font-size: .82rem; }
  .footer__grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer__grid > div:last-child { grid-column: span 3; }
}

@media (max-width: 980px) {
  .nav__links { display: none; }
  .nav__toggle { display: grid; }
  .drawer { display: block; }
  .nav__cta .btn--apply { display: none; }

  .hero__grid { grid-template-columns: 1fr; }
  .hero__media { order: -1; }
  .hero__media .ph { aspect-ratio: 16/11; }
  .hero__badge { left: 12px; bottom: 12px; }

  .split, .programme { grid-template-columns: 1fr; }
  .split--reverse > *:first-child,
  .programme:nth-child(even) .programme__media { order: -1; }
  .programme__media, .split > .ph { order: -1; }

  .grid--4, .impact-stats, .partner-logos { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .grid--3, .values-grid, .support-tiers { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .cta-band { grid-template-columns: 1fr; }
  .flow { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 640px) {
  :root { --header-h: 68px; }
  .brand img { width: 40px; height: 40px; }
  .brand__name { font-size: .84rem; }
  .brand__sub { font-size: .52rem; letter-spacing: .16em; }
  .nav__cta .btn { padding: .6rem 1rem; font-size: .8rem; }

  .grid--2, .grid--3, .grid--4,
  .values-grid, .impact-stats, .support-tiers, .partner-logos, .flow {
    grid-template-columns: 1fr;
  }
  .btn-row .btn { flex: 1 1 100%; }
  .bar { grid-template-columns: 1fr; gap: .35rem; }
  .bar__value { text-align: left; }
  .hero__meta { gap: 1.1rem; }
  .footer__grid { grid-template-columns: 1fr; }
  .footer__grid > div:last-child { grid-column: auto; }
  .bank-row { grid-template-columns: 1fr; }
  .modal__dialog { padding: 1.3rem; }
  .timeline__item { padding-left: 52px; }
}

@media (min-width: 981px) {
  .drawer { display: none !important; }
}