.site-header{position:sticky;top:0;z-index:50;background:rgb(250 249 246 / .94);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border)}
.site-header__inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:var(--header-h)}
.brand{display:inline-flex;align-items:center;gap:.85rem;justify-self:start}
.brand__icon{height:48px;width:auto}
.brand__word{height:15px;width:auto}

.nav__list{display:flex;gap:clamp(1.25rem,2.4vw,2.6rem)}
.nav__link{position:relative;display:inline-block;padding:.5rem 0;font-size:var(--fs-ui);font-weight:600;letter-spacing:var(--track-ui);text-transform:uppercase}
.nav__link::after{content:"";position:absolute;left:0;right:0;bottom:.15rem;height:1px;background:var(--color-gold);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-fast) var(--ease)}
.nav__link:hover::after,.nav__link:focus-visible::after,.nav__link[aria-current="page"]::after{transform:scaleX(1)}

.tools{display:flex;align-items:center;justify-content:flex-end;gap:.25rem}
.tools__btn{display:grid;place-items:center;width:2.5rem;height:2.5rem;transition:color var(--dur-fast)}
.tools__btn:hover{color:var(--color-gold-text)}
.tools .btn{margin-left:.9rem}
.menu-toggle{display:none;width:2.5rem;height:2.5rem;place-items:center}
.menu-toggle__bars{position:relative;width:22px;height:9px;border-block:1px solid currentColor}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars{border-color:transparent}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars::before,.menu-toggle[aria-expanded="true"] .menu-toggle__bars::after{content:"";position:absolute;left:0;right:0;top:4px;height:1px;background:currentColor}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars::before{transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars::after{transform:rotate(-45deg)}

/* ---------- Collections menu ---------- */
.nav__item{position:relative}
.menu-arrow{display:none}
.menu{position:absolute;left:-1.5rem;top:100%;z-index:60;min-width:23.5rem;padding:1.5rem 1.5rem 1.65rem;background:var(--color-bg);border:1px solid var(--color-border);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease),visibility 0s linear var(--dur-fast)}
.has-menu:hover>.menu,.has-menu:focus-within>.menu,.has-menu.is-open>.menu{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.menu__list{display:flex;flex-direction:column;gap:1.05rem}
.menu__link{display:inline-block;font-family:var(--font-serif);font-weight:300;font-size:1.3rem;line-height:1.2;transition:color var(--dur-fast)}
.menu__link:hover,.menu__link:focus-visible{color:var(--color-gold-text)}
.menu__sub{display:flex;flex-wrap:wrap;gap:.15rem .85rem;margin-top:.4rem}
.menu__sub a{font-size:.6875rem;letter-spacing:.12em;white-space:nowrap;text-transform:uppercase;color:var(--color-muted);transition:color var(--dur-fast)}
.menu__sub a:hover,.menu__sub a:focus-visible{color:var(--color-gold-text)}

/* Desktop: nav items span the header height so the panel meets the header edge directly under COLLECTIONS */
@media (min-width:1181px){
  .nav,.nav__list{height:var(--header-h)}
  .nav__list{align-items:stretch}
  .nav__list>li{display:flex;align-items:center}
  .nav__list:has(.has-menu:hover,.has-menu:focus-within,.has-menu.is-open) .nav__link[aria-current="page"]::after{transform:scaleX(0)}
  .has-menu:hover>.nav__link::after,.has-menu:focus-within>.nav__link::after,.has-menu.is-open>.nav__link::after{transform:scaleX(1)}
}