/* Version 115 — fourth-wave mobile refinements.
   Desktop and tablet layouts remain unchanged. */

@media (max-width: 700px) {
  /* Keep the mobile navigation compact without sacrificing tap comfort. */
  .menu-panel {
    top: 60px;
    right: 16px;
    width: min(258px, calc(100vw - 32px));
    min-width: 0;
    max-width: calc(100vw - 32px);
    max-height: calc(100svh - 76px);
    padding: 11px 14px 13px;
    border-radius: 2px 2px 24px 24px;
    overflow-y: auto;
  }

  .menu-panel::before {
    font-size: 0.48rem;
    line-height: 1;
  }

  .menu-panel::after {
    width: 64%;
    margin-top: 5px;
  }

  .menu-panel a {
    display: grid;
    min-height: 40px;
    padding: 6px;
    place-items: center;
    font-size: 0.78rem;
    letter-spacing: 0.09em;
    line-height: 1.18;
  }

  .menu-panel a:last-child {
    max-width: 214px;
    margin-inline: auto;
    white-space: normal;
  }

  /* About Us — remove the vacant band left above the story on mobile. */
  .about-page {
    padding-top: 62px;
  }

  .about-story {
    padding-top: 22px;
  }
}

@media (max-width: 360px) {
  .menu-panel {
    right: 12px;
    width: min(248px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
  }
}
