/* Off-canvas navigation for tablet and mobile screens. */
.brand-school-type { font-size: 13px !important; letter-spacing: .08em !important; }

@media (max-width: 1024px) {
  .menu-toggle { position: relative; display: block; z-index: 12; }

  .menu-toggle span:not(.sr-only) { transition: transform .25s ease, opacity .2s ease; }
  .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

  .nav-links {
    position: fixed;
    inset: 0 0 0 auto;
    width: min(390px, 100%);
    min-height: 100dvh;
    background: var(--navy);
    padding: 115px 32px 36px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 21px;
    transform: translateX(101%);
    visibility: hidden;
    pointer-events: none;
    transition: transform .35s ease, visibility 0s linear .35s;
    box-shadow: -18px 0 38px #0003;
    z-index: 11;
  }

  .nav-links.open {
    transform: translateX(0);
    visibility: visible;
    pointer-events: auto;
    transition: transform .35s ease;
  }

  .nav-links > a { font: 500 23px var(--serif); }
  .nav-links .nav-contact { font: 600 14px var(--sans); margin-top: 10px; }
}