/* Mobile navigation uses the same rows for links and disclosure buttons.
   Loaded after the shared styles; desktop dropdowns remain unchanged. */
@media (max-width:700px) {
  .header #navigation {
    left:0;
    right:0;
    top:calc(100% + 1px);
    display:none;
    align-items:stretch;
    gap:0;
    margin:0;
    padding:6px 18px 10px;
    max-height:calc(100svh - 118px);
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#fff;
    border:1px solid #e5dcea;
    border-top:0;
    border-radius:0 0 8px 8px;
    box-shadow:0 14px 28px #351c4c12;
    color:var(--ink);
    font-size:14px;
    font-weight:650;
  }
  .header #navigation.open {
    display:flex;
    flex-direction:column;
  }
  .header #navigation > .nav-group,
  .header #navigation > .nav-group > .nav-group-top {
    display:block;
    width:100%;
    min-width:0;
    margin:0;
    padding:0;
  }
  .header #navigation > a,
  .header #navigation > .nav-group > .nav-group-top > .submenu-toggle {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    width:100%;
    min-height:50px;
    margin:0;
    padding:13px 2px;
    background:transparent;
    color:var(--ink);
    border:0;
    border-bottom:1px solid #e8e0ed;
    border-radius:0;
    box-shadow:none;
    font:inherit;
    line-height:1.5;
    letter-spacing:0;
    text-align:left;
    text-decoration:none;
    transform:none;
    -webkit-tap-highlight-color:transparent;
  }
  .header #navigation > a:last-child {
    border-bottom:0;
  }
  .header #navigation .submenu-toggle::after {
    content:'';
    flex:none;
    width:7px;
    height:7px;
    margin-right:5px;
    border-right:1.5px solid currentColor;
    border-bottom:1.5px solid currentColor;
    transform:rotate(45deg);
    transition:transform .18s ease;
  }
  .header #navigation .submenu-toggle[aria-expanded=true]::after {
    transform:rotate(225deg);
  }
  .header #navigation .nav-dropdown {
    position:static;
    min-width:0;
    width:auto;
    margin:3px 0 8px 8px;
    padding:2px 0 2px 15px;
    background:transparent;
    border:0;
    border-left:1px solid #e8e0ed;
    border-radius:0;
    box-shadow:none;
  }
  .header #navigation .nav-dropdown a {
    display:flex;
    align-items:center;
    min-height:44px;
    margin:0;
    padding:11px 2px;
    background:transparent;
    color:var(--muted);
    border:0;
    border-bottom:1px solid #f0eaf4;
    border-radius:0;
    box-shadow:none;
    font-size:13px;
    font-weight:500;
    line-height:1.6;
    text-decoration:none;
    transform:none;
    -webkit-tap-highlight-color:transparent;
  }
  .header #navigation .nav-dropdown a:last-child {
    border-bottom:0;
  }
  .header #navigation > a[aria-current=page],
  .header #navigation > .nav-group > .nav-group-top > .submenu-toggle.is-current,
  .header #navigation .nav-dropdown a[aria-current=page] {
    background:transparent;
    color:var(--blue);
    font-weight:750;
  }
  .header #navigation a:focus-visible,
  .header #navigation button:focus-visible {
    outline:2px solid #8d55b5;
    outline-offset:-3px;
  }
}
/* Hover is an optional pointer affordance, never a persistent page marker. */
@media (max-width:700px) and (hover:hover) and (pointer:fine) {
  .header #navigation > a:not([aria-current=page]):hover,
  .header #navigation .submenu-toggle:not(.is-current):hover,
  .header #navigation .nav-dropdown a:not([aria-current=page]):hover {
    background:#f8f3fc;
    color:var(--ink);
    box-shadow:none;
    transform:none;
  }
}
@media (max-width:700px) and (hover:none), (max-width:700px) and (pointer:coarse) {
  .header #navigation > a:not([aria-current=page]):hover,
  .header #navigation .submenu-toggle:not(.is-current):hover,
  .header #navigation .nav-dropdown a:not([aria-current=page]):hover {
    background:transparent;
    color:var(--ink);
    border-bottom-color:#e8e0ed;
    box-shadow:none;
    transform:none;
  }
  .header #navigation > a:not([aria-current=page]):active,
  .header #navigation .submenu-toggle:not(.is-current):active,
  .header #navigation .nav-dropdown a:not([aria-current=page]):active {
    background:#f8f3fc;
  }
}
@media (max-width:700px) and (prefers-reduced-motion:reduce) {
  .header #navigation .submenu-toggle::after {
    transition:none;
  }
}