/* Feedback follows real interaction; the original layout remains unchanged. */
.site-nav > a:not(.button),
.footer-main nav a {
  position: relative;
  text-decoration: none;
  transition: color 160ms ease;
}
.site-nav > a:not(.button)::after,
.footer-main nav a::after {
  content: "";
  position: absolute;
  inset: auto 0 6px;
  height: 1px;
  background: var(--blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 240ms cubic-bezier(.22, 1, .36, 1);
}
.site-nav > a:not(.button):is(:hover, :focus-visible),
.footer-main nav a:is(:hover, :focus-visible) {
  color: var(--button);
}
.site-nav > a:not(.button):is(:hover, :focus-visible)::after,
.footer-main nav a:is(:hover, :focus-visible)::after {
  transform: scaleX(1);
}
.button {
  transition: background-color 180ms ease, transform 200ms var(--ease-out), box-shadow 200ms ease;
}
.button:focus-visible {
  background: #006993;
  box-shadow: 0 4px 14px rgb(0 125 179 / 16%);
}
.button:focus-visible .icon,
.text-link:focus-visible .icon,
.map-link:focus-visible .icon {
  transform: translateX(4px);
}
.button:active {
  transform: translateY(0) scale(.985);
  box-shadow: none;
}
.text-link,
.map-link {
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
  transition: color 180ms ease;
}
.benefit-icon .icon {
  transition: transform 260ms var(--ease-out);
}
.learning-screen,
.learning-sheet,
.learning-card {
  transition: translate 420ms cubic-bezier(.22, 1, .36, 1);
}
.learning-section:has(.button:focus-visible) .learning-screen { translate: 0 -3px; }
.learning-section:has(.button:focus-visible) .learning-sheet { translate: 0 -6px; }
.learning-section:has(.button:focus-visible) .learning-card { translate: 3px -1px; }

@media (hover: hover) and (pointer: fine) {
  .button:hover { box-shadow: 0 5px 16px rgb(0 125 179 / 17%); }
  .button:hover .icon,
  .text-link:hover .icon,
  .map-link:hover .icon { transform: translateX(4px); }
  .benefits li:hover .benefit-icon { transform: translateY(-3px); }
  .benefits li:hover .benefit-icon .icon { transform: scale(1.08); }
  .summit-photo:hover img { transform: scale(1.025); }
  .learning-art:hover .learning-screen { translate: 0 -3px; }
  .learning-art:hover .learning-sheet { translate: 0 -6px; }
  .learning-art:hover .learning-card { translate: 3px -1px; }
}

@media (max-width: 900px) {
  .menu-toggle { transition: color 180ms ease; }
  .menu-toggle:is(:hover, :focus-visible) { color: var(--button); }
  /* Three strokes keep the original middle line's 10.5px offset when closed. */
  .menu-lines {
    height: 1.5px;
    margin-block: 5.25px;
    border: 0;
    background: currentColor;
    transform: translateX(10.5px);
    transition: transform 280ms cubic-bezier(.22, 1, .36, 1), background-color 140ms ease;
  }
  .menu-lines::before,
  .menu-lines::after {
    content: "";
    position: absolute;
    inset: 0;
    width: 21px;
    height: 1.5px;
    background: currentColor;
    transition: transform 280ms cubic-bezier(.22, 1, .36, 1);
  }
  .menu-lines::before { transform: translate(-10.5px, -5.25px); }
  .menu-lines::after { transform: translate(-10.5px, 5.25px); }
  .menu-toggle[aria-expanded="true"] .menu-lines {
    background: transparent;
    transform: translateX(0);
  }
  .menu-toggle[aria-expanded="true"] .menu-lines::before { transform: rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-lines::after { transform: rotate(-45deg); }

  .menu-toggle:not([hidden]) + .site-nav,
  .menu-toggle:not([hidden])[aria-expanded="false"] + .site-nav {
    --nav-display: flex;
    display: var(--nav-display);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-10px);
    transition: opacity 180ms ease, transform 220ms cubic-bezier(.22, 1, .36, 1), visibility 0s 220ms;
  }
  .menu-toggle:not([hidden])[aria-expanded="true"] + .site-nav {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
    transition: opacity 220ms ease, transform 320ms cubic-bezier(.22, 1, .36, 1), visibility 0s;
  }
  .menu-toggle:not([hidden]) + .site-nav > a {
    opacity: 0;
    transform: translateY(-5px);
    transition: opacity 120ms ease, transform 160ms var(--ease-out), color 160ms ease, background-color 180ms ease;
  }
  .site-nav > a:nth-child(2) { --link-delay: 30ms; }
  .site-nav > a:nth-child(3) { --link-delay: 60ms; }
  .site-nav > a:nth-child(4) { --link-delay: 90ms; }
  .site-nav > a:nth-child(5) { --link-delay: 120ms; }
  .menu-toggle:not([hidden])[aria-expanded="true"] + .site-nav > a {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 240ms ease var(--link-delay, 0ms), transform 300ms var(--ease-out) var(--link-delay, 0ms), color 160ms ease, background-color 180ms ease;
  }
}
@media (max-width: 600px) {
  .menu-toggle:not([hidden]) + .site-nav,
  .menu-toggle:not([hidden])[aria-expanded="false"] + .site-nav { --nav-display: grid; }
}
@media (prefers-reduced-motion: reduce) {
  .menu-toggle, .menu-lines, .menu-lines::before, .menu-lines::after,
  .site-nav, .site-nav > a, .site-nav > a::after, .footer-main nav a::after,
  .button, .button .icon, .text-link .icon, .map-link .icon, .benefit-icon .icon,
  .learning-screen, .learning-sheet, .learning-card { transition: none !important; }
  .button:is(:hover, :active, :focus-visible),
  .button:is(:hover, :focus-visible) .icon,
  .text-link:is(:hover, :focus-visible) .icon,
  .map-link:is(:hover, :focus-visible) .icon,
  .benefits li:hover .benefit-icon,
  .benefits li:hover .benefit-icon .icon,
  .summit-photo:hover img { transform: none; }
  .learning-art:hover :is(.learning-screen, .learning-sheet, .learning-card),
  .learning-section:has(.button:focus-visible) :is(.learning-screen, .learning-sheet, .learning-card) { translate: none; }
}