/* ALP Collective: slick floating nav
   Transparent over the hero, frosted slim bar once scrolled, hides on scroll down.
   Load after site-luxe.css. Needs nav-slick.js. */

#nav{
  background:transparent;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  border-bottom:1px solid transparent;
  box-shadow:none;
  transition:background .45s ease,backdrop-filter .45s ease,border-color .45s ease,transform .5s cubic-bezier(.2,.7,.2,1);
}
/* soft scrim so the links stay legible over photography */
#nav::before{
  content:"";position:absolute;left:0;right:0;top:0;height:150px;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(22,10,19,.72),rgba(22,10,19,0));
  transition:opacity .45s ease;
}
#nav.scrolled{
  background:rgba(22,10,19,.74);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);
  border-bottom-color:rgba(243,235,221,.07);
  box-shadow:none;
}
#nav.scrolled::before{opacity:0}
#nav.nav-hide{transform:translateY(-100%)}
#nav:focus-within{transform:none}

#nav .nav-inner{position:relative;z-index:2;max-width:1320px;padding:30px 44px;transition:padding .45s ease}
#nav.scrolled .nav-inner{padding:15px 44px}

/* wordmark */
#nav .nav-logo{text-decoration:none;color:#F3EBDD;gap:12px}
#nav .nav-logo img{height:34px}
#nav .nav-logo span{
  font:600 12px/1 'Manrope','Work Sans',-apple-system,'Segoe UI',Arial,sans-serif;
  letter-spacing:.34em;text-transform:uppercase;
}

/* links */
#nav .nav-links{gap:38px}
#nav .nav-links a.nav-btn{
  position:relative;padding:10px 0;background:none;border-radius:0;
  font:600 11.5px/1 'Manrope','Work Sans',-apple-system,'Segoe UI',Arial,sans-serif;
  letter-spacing:.24em;text-transform:uppercase;color:rgba(243,235,221,.82);
  transition:color .3s ease;
}
#nav .nav-links a.nav-btn::after{
  content:"";position:absolute;left:0;right:.24em;bottom:2px;height:1px;
  background:linear-gradient(90deg,#E2702F,#B8344F);
  transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.2,.7,.2,1);
}
#nav .nav-links a.nav-btn:hover,
#nav .nav-links a.nav-btn:focus-visible,
#nav .nav-links a.nav-btn.active{color:#fff;background:none}
#nav .nav-links a.nav-btn:hover::after,
#nav .nav-links a.nav-btn:focus-visible::after,
#nav .nav-links a.nav-btn.active::after{transform:scaleX(1)}
#nav .nav-links a.nav-btn:focus-visible,#nav .nav-logo:focus-visible,#nav .nav-ig:focus-visible,#nav .nav-toggle:focus-visible{outline:2px solid #CB5D25;outline-offset:6px}
/* keep the brand's lowercase "ha" (shown as small caps) */
#nav .nav-links a[data-page="alpha"]{text-transform:none;font-variant-caps:small-caps;font-size:13px}
/* the logo is the home link on desktop */
#nav .nav-links a[data-page="home"]{display:none}

#nav .nav-ig{background:none;border:0;color:rgba(243,235,221,.82)}
#nav .nav-ig:hover{background:none;color:#fff}

/* mid widths: tighten before switching to the menu */
@media (max-width:1180px){
  #nav .nav-inner,#nav.scrolled .nav-inner{padding-left:28px;padding-right:28px}
  #nav .nav-links{gap:26px}
  #nav .nav-links a.nav-btn{letter-spacing:.17em;font-size:11px}
  #nav .nav-logo span{letter-spacing:.26em}
}

/* menu mode: full-screen overlay */
@media (max-width:1000px){
  #nav .nav-inner{padding:20px 22px}
  #nav.scrolled .nav-inner{padding:12px 22px}
  #nav .nav-logo span{font-size:11px;letter-spacing:.26em}
  #nav .nav-logo,#nav .nav-ig,#nav .nav-toggle{position:relative;z-index:3}
  #nav .nav-ig{margin-left:auto;margin-right:20px}
  #nav .nav-toggle{
    display:block;font-size:0;background:none;border:0;padding:10px 0;color:#F3EBDD;cursor:pointer;
  }
  #nav .nav-toggle::after{
    content:"Menu";font:600 11.5px/1 'Manrope','Work Sans',-apple-system,'Segoe UI',Arial,sans-serif;
    letter-spacing:.28em;text-transform:uppercase;
  }
  #nav .nav-toggle[aria-expanded="true"]::after{content:"Close"}
  #nav .nav-links{
    display:flex;position:fixed;top:0;left:0;right:0;bottom:0;height:100vh;height:100dvh;z-index:1;
    flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;
    padding:96px 32px 48px;border:0;
    background:radial-gradient(120% 80% at 85% 100%,rgba(203,93,37,.24),rgba(22,10,19,0) 60%),#160A13;
    opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s;
  }
  #nav .nav-links.open{opacity:1;visibility:visible}
  #nav .nav-links a.nav-btn,#nav .nav-links a[data-page="home"]{
    display:block;width:auto;padding:6px 0;
    font:300 clamp(2rem,8vw,2.7rem)/1.22 'Fraunces','Playfair Display',Georgia,serif;
    letter-spacing:-.01em;text-transform:none;font-variant-caps:normal;color:#F3EBDD;
  }
  #nav .nav-links a.nav-btn::after{display:none}
  #nav .nav-links a.nav-btn.active{color:#E2702F}
  /* fixed children need the nav to stop creating its own containing block */
  #nav.menu-open{transform:none !important;background:transparent !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;border-bottom-color:transparent !important}
  #nav.menu-open::before{opacity:0}
}
/* pages with content directly under the nav (map pages) keep a solid bar */
body.nav-solid #nav{background:rgba(22,10,19,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom-color:rgba(243,235,221,.08)}
body.nav-solid #nav::before{display:none}
body.nav-solid #nav.nav-hide{transform:none}
body.nav-solid #nav .nav-inner,body.nav-solid #nav.scrolled .nav-inner{padding-top:16px;padding-bottom:16px}
html.nav-lock{overflow:hidden}
@media (prefers-reduced-motion:reduce){#nav,#nav *{transition:none !important}}
