/* ---------- Mobile hamburger menu ---------- */
@media (max-width:68.749em){
  .nav{
    position:fixed;
    inset:var(--header-h) 0 0;
    width:100%;
    box-sizing:border-box;
    height:calc(100vh - var(--header-h));
    height:calc(100dvh - var(--header-h));
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-y;
    isolation:isolate;
    counter-reset:menu-item;
    align-content:start;
    gap:0;
    padding:clamp(2rem,7vh,4rem) var(--gutter) calc(var(--sp-4) + env(safe-area-inset-bottom));
    background:radial-gradient(ellipse at 92% 8%,rgba(56,182,255,.2),transparent 42%),linear-gradient(145deg,#0a4c86 0%,#062a4d 62%,#041d36 100%);
    color:#fff;
    clip-path:circle(0 at calc(100% - var(--gutter) - 1.45rem) 0);
    visibility:hidden;
    transition:clip-path .75s var(--ease-io),visibility 0s .75s;
  }
  .nav::before{
    content:"CHOOSE YOUR NEXT ESCAPE";
    position:relative;
    font:600 .65rem/1 var(--f-body);
    letter-spacing:.2em;
    color:rgba(255,255,255,.62);
    margin-bottom:clamp(2rem,7vh,4rem);
  }
  .nav::after{
    content:"BR";
    position:absolute;
    right:-.08em;
    bottom:-.3em;
    z-index:-1;
    font:500 min(68vw,24rem)/.8 var(--f-display);
    letter-spacing:-.08em;
    color:rgba(255,255,255,.045);
    pointer-events:none;
  }
  .nav.is-open{
    clip-path:circle(150vmax at calc(100% - var(--gutter) - 1.45rem) 0);
    visibility:visible;
    transition-delay:0s;
  }
  .nav__link{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    padding:.7rem 0;
    font-family:var(--f-display);
    font-size:clamp(2rem,7.5vw,3rem);
    font-weight:500;
    line-height:1.1;
    color:inherit;
    border-bottom:1px solid rgba(255,255,255,.2);
    counter-increment:menu-item;
    opacity:0;
    transform:translateY(1rem);
    transition:opacity .35s var(--ease),transform .5s var(--ease),color .25s;
  }
  .nav__link::before{
    content:"0" counter(menu-item);
    font:600 .65rem/1 var(--f-body);
    letter-spacing:.12em;
    color:var(--c-sky);
  }
  .nav__link::after{
    content:"";
    width:.55rem;
    height:.55rem;
    flex:none;
    border-top:1px solid currentColor;
    border-right:1px solid currentColor;
    transform:rotate(45deg);
    opacity:.55;
    transition:transform .3s var(--ease),opacity .3s;
  }
  .nav__link:hover{color:var(--c-sky)}
  .nav__link:hover::after{transform:translateX(.25rem) rotate(45deg);opacity:1}
  .nav__cta{
    align-self:flex-start;
    margin-top:var(--sp-3);
    opacity:0;
    transform:translateY(1rem);
    transition:opacity .35s var(--ease),transform .5s var(--ease);
  }
  .nav.is-open .nav__link,.nav.is-open .nav__cta{opacity:1;transform:none}
  .nav.is-open>:nth-child(1){transition-delay:.12s}
  .nav.is-open>:nth-child(2){transition-delay:.18s}
  .nav.is-open>:nth-child(3){transition-delay:.24s}
  .nav.is-open>:nth-child(4){transition-delay:.3s}
  .nav.is-open>:nth-child(5){transition-delay:.36s}
  .nav.is-open>:nth-child(6){transition-delay:.42s}
}

@supports not (clip-path:circle(0 at 0 0)){
  @media (max-width:68.749em){
    .nav{transform:translateY(-12px);opacity:0;transition:opacity .3s var(--ease),transform .3s var(--ease),visibility 0s .3s}
    .nav.is-open{transform:none;opacity:1;transition-delay:0s}
  }
}

@media (min-width:68.75em){
  .nav{clip-path:none}
  .nav::before,.nav::after,.nav__link::before{display:none}
}

@media (prefers-reduced-motion:reduce) and (max-width:68.749em){
  .nav{transition-duration:.01ms;transition-delay:0s}
  .nav__link,.nav__cta{transition-duration:.01ms;transition-delay:0s}
}