/* =======================================================
   HEADER / NAV
   ======================================================= */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:1300;
  background:rgba(10,10,10,.65); -webkit-backdrop-filter:blur(12px) saturate(160%); backdrop-filter:blur(12px) saturate(160%);
  border-bottom:1px solid rgba(255,223,138,.14); transition:background .25s, box-shadow .25s, padding .25s;
}
.site-header::after{
  content:""; position:absolute; left:0; bottom:-1px; height:2px; width:var(--scroll,0%);
  background:linear-gradient(90deg,#b98a2c,#ffe29a 55%,#b98a2c); transition:width .12s linear;
}
.site-header.scrolled{background:rgba(10,10,10,.88); box-shadow:0 8px 22px rgba(0,0,0,.45)}
.header-inner{display:flex; align-items:center; justify-content:space-between; min-height:74px; transition:min-height .25s}
.site-header.scrolled .header-inner{min-height:64px}
.brand{display:flex; align-items:center; gap:10px; color:var(--text); text-decoration:none}
.brand-logo{width:60px; filter:drop-shadow(0 0 10px rgba(227,193,90,.22))}
@media (max-width:780px){.brand-logo{width:54px}}
.brand-text{font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:1.1rem}

.nav{display:block}
.nav ul{display:flex; gap:28px; list-style:none}
.nav a{
  position:relative; font-weight:600; color:#f0e6c7; text-decoration:none; opacity:.9;
  transition:opacity .2s, text-shadow .25s var(--ease-smooth);
}
.nav a:hover{opacity:1; text-shadow:0 0 10px rgba(232,199,103,.25)}
.nav a::after{
  content:""; position:absolute; left:0; bottom:-8px; height:2px; width:0; border-radius:2px;
  background:var(--gold-grad); transition:width .18s var(--ease-smooth), transform .18s var(--ease-smooth);
}
.nav a:hover::after,.nav a.is-active::after{width:100%}

.nav-toggle{display:none; background:none; border:0; cursor:pointer}
.nav-toggle span{display:block; width:26px; height:2px; background:var(--gold-2); margin:6px 0}

body.is-scrolling .site-header{backdrop-filter:none!important; -webkit-backdrop-filter:none!important; background:rgba(10,10,10,.85)}

/* Drawer mobile */
@media (max-width:760px){
  :root{--m-space:18px; --hdr:64px}
  .header-inner{min-height:var(--hdr)}
  .nav{
    position:fixed; top:0; bottom:0; left:0; width:min(78vw,360px); transform:translateX(-105%);
    background:#0b0b0b; border-right:1px solid rgba(255,223,138,.14); box-shadow:0 24px 60px rgba(0,0,0,.55);
    transition:transform .28s ease; z-index:1200; padding-top:calc(var(--hdr) + env(safe-area-inset-top,0px));
    padding-bottom:env(safe-area-inset-bottom,0px); overflow-y:auto; -webkit-overflow-scrolling:touch; isolation:isolate; will-change:transform; contain:paint;
  }
  .nav.open{transform:translateX(0)}
  .nav ul{flex-direction:column; gap:6px; padding:16px 18px 28px}
  .nav a{display:block; padding:13px 4px; font-weight:700; letter-spacing:.02em}
  .nav a.is-active{text-shadow:0 0 10px rgba(232,199,103,.18)}

  .nav-toggle{display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:8px}

  .nav-scrim{position:fixed; inset:0; z-index:1190; background:rgba(0,0,0,.45); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px)}
  body:not(.menu-open) .nav-scrim{display:none!important}
  body.menu-open{overflow:hidden}
}
