@media (max-width: 1100px) {
  .nav__links {
    gap: 14px;
  }

  .selector__results {
    grid-template-columns: repeat(3, 1fr);
  }

  .mountain-story,
  .mountain-story--reverse {
    grid-template-columns: 1fr 1fr;
  }

  .quiz__grid {
    grid-template-columns: 1fr 1fr;
  }

  .quiz__grid .section-heading {
    grid-column: 1 / -1;
  }
}

@media (max-width: 860px) {
  .section {
    padding: 84px 0;
  }

  .nav {
    min-height: 68px;
  }

  .nav__toggle {
    display: block;
  }

  .nav__links {
    position: fixed;
    inset: 68px 16px auto;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: rgba(121, 28, 9, 0.96);
    box-shadow: var(--shadow);
  }

  .nav__links.is-open {
    display: flex;
  }

  .nav__links a {
    padding: 12px;
  }

  .nav__links .button {
    margin-top: 8px;
  }

  .hero {
    min-height: 100svh;
  }

  .hero__content {
    padding-top: 90px;
  }

  .hero__stat {
    right: auto;
    left: 20px;
    bottom: 86px;
  }

  .intro__grid,
  .about__grid {
    grid-template-columns: 1fr;
  }

  .intro,
  .altitude {
    background-attachment: scroll;
  }

  .selector__results {
    grid-template-columns: repeat(2, 1fr);
  }

  .mountain-story,
  .mountain-story--reverse {
    min-height: auto;
    grid-template-columns: 1fr;
    padding-top: 76px;
    padding-bottom: 76px;
  }

  .mountain-story--reverse .mountain-story__media {
    order: 0;
  }

  .mountain-story__media {
    min-height: 320px;
    height: 52vh;
  }

  .mountain-detail {
    padding-top: 22px;
  }

  .mountain-detail__hero,
  .mountain-detail__grid {
    grid-template-columns: 1fr;
  }

  .mountain-detail__hero {
    min-height: auto;
  }

  .mountain-detail__hero h2 {
    font-size: clamp(2rem, 7.5vw, 3.25rem);
  }

  .video-slot--large {
    min-height: 360px;
  }

  .altitude__stage {
    min-height: 540px;
    grid-template-columns: repeat(5, minmax(96px, 1fr));
    overflow-x: auto;
    align-items: end;
  }

  .altitude__ridge {
    height: 50%;
    min-width: 620px;
    opacity: 0.45;
  }

  .altitude-mountain {
    height: 390px;
    min-width: 96px;
  }

  .mountain-shape {
    width: 130px;
  }

  .altitude-mountain__height {
    font-size: 0.7rem;
  }

  .altitude-mountain strong {
    font-size: 0.78rem;
  }

  .quiz__grid,
  .footer__inner {
    grid-template-columns: 1fr;
  }

  .footer nav {
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .section__inner,
  .hero__content,
  .footer__inner {
    width: min(100% - 28px, 1120px);
  }

  h1 {
    font-size: clamp(3rem, 15vw, 4.4rem);
  }

  h2 {
    font-size: clamp(2rem, 11vw, 3.4rem);
  }

  .section-title--compact {
    font-size: clamp(2rem, 9.5vw, 3rem);
    white-space: normal;
  }

  .hero__lead {
    max-width: 100%;
    font-size: 1.25rem;
  }

  .hero__actions,
  .selector__controls {
    align-items: stretch;
    flex-direction: column;
  }

  .button,
  .selector__button {
    width: 100%;
  }

  .intro__metrics,
  .selector__results {
    grid-template-columns: 1fr;
  }

  .data-list div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .detail-image img {
    height: 260px;
  }

  .video-slot--large {
    min-height: 300px;
  }

  .about__profile {
    padding-right: 0;
  }

  .about__photo {
    width: min(100%, 360px);
    min-height: 480px;
    justify-self: center;
  }
}