/* OFFICIAL2 mobile menu v2 — calm, elegant and intentionally lightweight. */
@keyframes official2-menu-v2-in {
  from { opacity: 0; transform: translate3d(.75rem, 0, 0) scale(.99); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 980px) {
  html body[data-page][data-page] .mobile-map-trigger {
    min-height: 46px;
    gap: .58rem;
    padding: .58rem .88rem .58rem .72rem;
    color: #002657;
    border: 1px solid rgba(0, 38, 87, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 8px 22px rgba(0, 31, 72, .12), inset 0 1px #fff;
    font-size: .78rem;
    font-weight: 760;
    letter-spacing: .025em;
    text-transform: none;
  }

  html body[data-page][data-page] .mobile-map-trigger::after { display: none; content: none; }

  html body[data-page][data-page] .mobile-map-trigger .menu-glyph {
    width: 1.25rem;
    display: grid;
    gap: .22rem;
  }

  html body[data-page][data-page] .mobile-map-trigger .menu-glyph i {
    height: 1.5px;
    border-radius: 3px;
    background: #002657;
  }

  html body[data-page][data-page] .mobile-map-trigger .menu-glyph i:nth-child(2) {
    width: .82rem;
    background: #b8892f;
  }

  html body[data-page][data-page] .mobile-map-trigger:is(:hover, :focus-visible) {
    color: #002657;
    border-color: rgba(0, 38, 87, .38);
    background: #fff;
    box-shadow: 0 10px 25px rgba(0, 31, 72, .16), inset 0 -2px #d5aa56;
  }

  html body[data-page][data-page] .mobile-map {
    place-items: center end;
    padding: clamp(.35rem, 2vw, .7rem);
    background: rgba(0, 22, 52, .58);
    -webkit-backdrop-filter: blur(10px) saturate(108%);
    backdrop-filter: blur(10px) saturate(108%);
  }

  html body[data-page][data-page] .mobile-map-panel {
    width: min(24rem, 100%);
    height: auto;
    max-height: calc(100dvh - clamp(.7rem, 4vw, 1.4rem));
    margin: 0;
    padding: 0 0 max(.8rem, env(safe-area-inset-bottom));
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid rgba(255, 255, 255, .78);
    border-radius: 1.5rem;
    background: linear-gradient(180deg, #fbfdff 0%, #f5f9fc 100%);
    box-shadow: 0 30px 80px rgba(0, 19, 47, .35), 0 2px 8px rgba(0, 19, 47, .15);
    animation: official2-menu-v2-in .24s cubic-bezier(.2, .72, .2, 1) both;
  }

  html body[data-page][data-page] .mobile-map-head {
    position: sticky;
    top: 0;
    z-index: 3;
    min-height: 5.25rem;
    margin: 0;
    padding: max(.82rem, env(safe-area-inset-top)) .9rem .8rem 1.05rem;
    overflow: visible;
    border: 0;
    border-bottom: 1px solid rgba(0, 38, 87, .09);
    border-radius: 1.5rem 1.5rem 0 0;
    background: rgba(251, 253, 255, .96);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }

  html body[data-page][data-page] .mobile-map-head::after {
    inset: auto 1rem 0;
    height: 2px;
    background: linear-gradient(90deg, #d5aa56 0 22%, rgba(0, 38, 87, .08) 22% 100%);
  }

  html body[data-page][data-page] .mobile-map-head img {
    width: min(9.25rem, calc(100% - 4rem));
    max-height: 2.9rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  html body[data-page][data-page] .mobile-map-close {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
    color: #002657;
    border: 1px solid rgba(0, 38, 87, .14);
    border-radius: 50%;
    background: #eef5fa;
    box-shadow: none;
  }

  html body[data-page][data-page] .mobile-map-close:is(:hover, :focus-visible) {
    color: #fff;
    border-color: #002657;
    background: #002657;
  }

  html body[data-page][data-page] .mobile-map-panel > .wayfinder-label {
    display: block;
    margin: 1rem 1.15rem .45rem;
    color: #8a671f;
    font-size: .64rem;
    font-weight: 780;
    letter-spacing: .13em;
    text-transform: uppercase;
  }

  html body[data-page][data-page] .mobile-route-list {
    gap: .15rem;
    margin: .28rem .72rem 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  html body[data-page][data-page] .mobile-route-list a:not(.mobile-join) {
    position: relative;
    min-height: 52px;
    display: grid;
    grid-template-columns: .22rem minmax(0, 1fr) 1rem;
    gap: .72rem;
    padding: .65rem .72rem;
    color: #183a57;
    border: 1px solid transparent;
    border-bottom-color: rgba(0, 38, 87, .08);
    border-radius: .82rem;
    background: transparent;
  }

  html body[data-page][data-page] .mobile-route-list a:not(.mobile-join)::before {
    width: .16rem;
    height: 1.15rem;
    align-self: center;
    border: 0;
    border-radius: 999px;
    background: rgba(0, 38, 87, .16);
    box-shadow: none;
  }

  html body[data-page][data-page] .mobile-route-list a:not(.mobile-join)::after {
    width: .42rem;
    height: .42rem;
    border-width: 1.5px;
    border-color: #8496a5;
    border-style: solid;
    border-left: 0;
    border-bottom: 0;
  }

  html body[data-page][data-page] .mobile-route-list a span {
    font-family: var(--v6-display);
    font-size: .98rem;
    font-weight: 660;
    letter-spacing: -.012em;
  }

  html body[data-page][data-page] .mobile-route-list a:not(.mobile-join):is(:hover, :focus-visible) {
    color: #002657;
    border-color: rgba(0, 38, 87, .11);
    background: #fff;
    box-shadow: 0 8px 18px rgba(0, 38, 87, .07);
  }

  html body[data-page][data-page] .mobile-route-list a[aria-current="page"]:not(.mobile-join) {
    margin: .08rem 0;
    padding: .65rem .72rem;
    color: #002657;
    border-color: rgba(0, 38, 87, .12);
    background: #fff;
    box-shadow: 0 9px 22px rgba(0, 38, 87, .09);
  }

  html body[data-page][data-page] .mobile-route-list a[aria-current="page"]:not(.mobile-join)::before {
    border: 0;
    background: #d2a34a;
    box-shadow: none;
  }

  html body[data-page][data-page] .mobile-route-list .mobile-join,
  html body[data-page][data-page] .mobile-route-list .mobile-join[aria-current="page"] {
    min-height: 54px;
    margin: .75rem 0 .1rem;
    padding: .8rem .95rem;
    color: #fff;
    border: 1px solid #002657;
    border-radius: 1rem;
    background: linear-gradient(135deg, #002657, #075b96);
    box-shadow: 0 12px 25px rgba(0, 38, 87, .2);
  }

  html body[data-page][data-page] .mobile-route-list .mobile-join::after {
    border-color: #f0ca7b;
  }

  html body[data-page][data-page] .mobile-route-list .mobile-join:is(:hover, :focus-visible) {
    color: #fff;
    border-color: #0b6dab;
    background: linear-gradient(135deg, #00336d, #0b70b6);
    box-shadow: 0 14px 28px rgba(0, 38, 87, .24);
  }

  html body[data-page][data-page] .mobile-language-wrap {
    margin: .72rem .95rem 0;
    padding: .72rem 0 0;
    border-top: 1px solid rgba(0, 38, 87, .1);
  }

  html body[data-page][data-page] .mobile-language-wrap > .language-button {
    color: #002657;
    border-color: rgba(0, 38, 87, .14);
    background: #fff;
  }

  html body[data-page][data-page] .mobile-language-wrap > .language-button:is(:hover, :focus-visible) {
    color: #fff;
    border-color: #002657;
    background: #002657;
  }

  html body[data-page][data-page] .mobile-language-wrap .language-menu-mobile {
    border-color: rgba(0, 38, 87, .13);
    box-shadow: 0 16px 32px rgba(0, 31, 72, .15);
  }
}

@media (max-width: 380px) {
  html body[data-page][data-page] .mobile-map { padding: .25rem; }
  html body[data-page][data-page] .mobile-map-panel {
    width: 100%;
    max-height: calc(100dvh - .5rem);
    border-radius: 1.2rem;
  }
  html body[data-page][data-page] .mobile-map-head { border-radius: 1.2rem 1.2rem 0 0; }
  html body[data-page][data-page] .mobile-route-list { margin-inline: .5rem; }
}

@media (max-height: 620px) and (max-width: 980px) {
  html body[data-page][data-page] .mobile-map-head {
    min-height: 4.65rem;
    padding-block: max(.62rem, env(safe-area-inset-top)) .6rem;
  }
  html body[data-page][data-page] .mobile-map-panel > .wayfinder-label { margin-block: .58rem .3rem; }
  html body[data-page][data-page] .mobile-route-list a:not(.mobile-join) { min-height: 48px; padding-block: .48rem; }
  html body[data-page][data-page] .mobile-route-list .mobile-join { min-height: 48px; margin-top: .5rem; padding-block: .62rem; }
}

@media (prefers-reduced-motion: reduce) {
  html body[data-page][data-page] .mobile-map-panel { animation: none; }
}

@media (prefers-reduced-transparency: reduce) {
  html body[data-page][data-page] .mobile-map {
    background: rgba(0, 22, 52, .92);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  html body[data-page][data-page] .mobile-map-panel,
  html body[data-page][data-page] .mobile-map-head { background: #f8fbfd; }
}

@media (forced-colors: active) {
  html body[data-page][data-page] .mobile-map-panel,
  html body[data-page][data-page] .mobile-map-head,
  html body[data-page][data-page] .mobile-route-list,
  html body[data-page][data-page] .mobile-route-list a,
  html body[data-page][data-page] .mobile-map-trigger {
    color: CanvasText;
    border-color: CanvasText;
    background: Canvas;
    box-shadow: none;
  }
}