/* =========================================================================
   ERMIS responsive layer (mobile-first breakpoints)
   - 600px  : small tablets
   - 900px  : tablets / small laptops
   - 1100px : desktop navigation
   ========================================================================= */

@media (max-width: 420px) {
  .brand__full { display: none; }
  .brand__emblem { width: 42px; height: 42px; }
  .gov-strip__right { display: none; }
  .hero__headline { font-size: 1.625rem; }
  .nav-toggle__text { display: none; }
}

@media (min-width: 600px) {
  h1 { font-size: var(--fs-2xl); }
  h2 { font-size: var(--fs-xl); }
  .glance { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .explore-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pub-item { grid-template-columns: 48px minmax(0, 1fr) auto; align-items: start; }
  .partner-entry { grid-template-columns: 120px minmax(0, 1fr); gap: var(--sp-5); }
  .partner-entry__logo { justify-content: center; }
  .partner-entry dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .partner-entry dl > div.span-2 { grid-column: span 2; }
  .toolbar { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: end; }
  .toolbar--pubs { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); }
  .toolbar__row { grid-column: 1 / -1; }
  .support-fab__label { display: inline; }
  .cta-band { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
}

@media (min-width: 900px) {
  .section { padding-block: var(--sp-8); }
  .hero__track { min-height: 520px; }
  .hero__headline { font-size: 2.75rem; }
  .intro-grid { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: var(--sp-7); }
  .resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-top { grid-template-columns: 1.4fr repeat(3, 1fr); }
  .about-layout { grid-template-columns: 220px minmax(0, 1fr); gap: var(--sp-7); }
  .toc { display: block; position: sticky; top: 120px; align-self: start; }
  .login-wrap { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: calc(100vh - 110px); }
  .login-intro { order: 1; display: grid; align-content: center; }
  .login-intro__inner { padding: var(--sp-8) var(--sp-7); margin-left: auto; }
  .login-form-col { order: 2; padding: var(--sp-8) var(--sp-7); }
  .page-banner__inner { padding-block: var(--sp-8); }
}

@media (min-width: 1100px) {
  .resource-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .explore-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .explore-tile { grid-template-columns: 44px 1fr; }
  .explore-tile > svg { display: none; }

  /* Desktop horizontal navigation */
  .nav-toggle { display: none; }
  .primary-nav,
  .primary-nav:not(.is-open) {
    display: block;
    position: static;
    padding: 0;
    border: 0;
    box-shadow: none;
    background: none;
    max-height: none;
    overflow: visible;
  }
  .nav-list { display: flex; align-items: center; gap: 4px; }
  .nav-link, .nav-sub-toggle {
    width: auto;
    min-height: 72px;
    padding: 0 14px;
    border-radius: 0;
    font-size: var(--fs-sm);
    position: relative;
    background: none;
  }
  .nav-link:hover, .nav-sub-toggle:hover { background: none; color: var(--c-blue); }
  .nav-link[aria-current="page"], .nav-sub-toggle.is-active { background: none; color: var(--c-blue); }
  .nav-link[aria-current="page"]::after, .nav-sub-toggle.is-active::after {
    content: "";
    position: absolute;
    left: 14px; right: 14px; bottom: -1px;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: var(--c-blue);
  }
  .has-sub { position: relative; }
  .sub-menu {
    position: absolute;
    top: calc(100% - 6px);
    left: 0;
    min-width: 260px;
    padding: var(--sp-2);
    background: var(--c-white);
    border: 1px solid var(--c-line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
  }
  .nav-login { margin: 0 0 0 var(--sp-3); }
  .btn-login { width: auto; min-height: 40px; }
}