/* Shared catalog navigation. Native disclosure controls also work without JS. */
.js-header { position:relative; z-index:20; }
.js-header__nav>.wrap { gap:clamp(.8rem,1.5vw,1.5rem); flex-wrap:wrap; overflow:visible; }
.js-header__nav a,.js-shop-dropdown summary { font:700 .9rem/1.5 var(--body); letter-spacing:.09em; text-transform:uppercase; }
.js-header__nav>.wrap>a { display:flex; align-items:center; min-height:44px; }
.js-shop-dropdown { position:relative; }
.js-shop-dropdown summary { display:flex; align-items:center; min-height:44px; gap:.6rem; color:#392b1e; cursor:pointer; list-style:none; white-space:nowrap; padding:.3rem 0; }
.js-shop-dropdown summary::-webkit-details-marker { display:none; }
.js-shop-dropdown summary::after { content:''; width:5px; height:5px; border-right:1px solid currentColor; border-bottom:1px solid currentColor; transform:translateY(-2px) rotate(45deg); }
.js-shop-dropdown[open] summary::after { transform:translateY(2px) rotate(225deg); }
.js-shop-dropdown summary:hover { color:#8d6f46; }
.js-shop-dropdown summary:focus-visible,.js-shop-dropdown a:focus-visible { outline:2px solid #8d6f46; outline-offset:4px; }
.js-browse-links { list-style:none; padding:0; margin:0; }
.js-shop-panel { position:absolute; top:calc(100% + .7rem); left:0; z-index:30; width:560px; max-width:calc(100vw - 40px); padding:1.25rem; border:1px solid #c2ac82; border-radius:3px; background:var(--jungle-paper); box-shadow:0 14px 30px rgba(7,30,20,.14); }
.js-shop-panel__groups { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.js-shop-panel__group { min-width:0; }
.js-shop-panel__group h3 { margin:0 0 .5rem; padding:.5rem .8rem; color:#392b1e; font:700 .95rem/1.4 var(--body); letter-spacing:0; }
.js-header__nav .js-shop-panel__all { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.7rem; padding:.3rem .8rem 1rem; border-bottom:1px solid #c2ac82; font:600 .9rem/1.4 var(--body); letter-spacing:0; text-transform:none; white-space:normal; }
.js-shop-panel__all span { font-size:1.25rem; }
.js-shop-dropdown .js-browse-links a { display:flex; align-items:center; gap:.65rem; padding:.7rem .8rem; color:#392b1e; font:500 .95rem/1.35 var(--body); letter-spacing:0; text-transform:none; text-decoration:none; }
.js-shop-dropdown .js-browse-links a:hover { background:#e9edde; color:#392b1e; }
.js-vein-swatch { display:inline-block; flex:0 0 9px; width:9px; height:9px; border-radius:50%; background:#c5ccad; box-shadow:inset 0 0 0 1px rgba(0,0,0,.12); }
.js-vein-swatch--green-vein { background:#8aad6d; }
.js-vein-swatch--red-vein { background:#c78370; }
.js-vein-swatch--white-vein { background:#f2efdf; }
.js-vein-swatch--yellow-vein { background:#d7bd6e; }
@media(max-width:950px) {
  .js-header__nav>.wrap { justify-content:flex-start; gap:.4rem 1.1rem; }
}
@media(max-width:650px) {
  .js-header__nav>.wrap { gap:.35rem 1rem; padding-top:.7rem; padding-bottom:.7rem; }
  .js-header__nav a,.js-shop-dropdown summary { font-size:.78rem; letter-spacing:.06em; }
  .js-shop-dropdown[open] { flex-basis:100%; }
  .js-shop-panel { position:static; width:100%; max-width:none; padding:.8rem .3rem; margin:.7rem 0 .3rem; box-shadow:none; }
  .js-shop-panel__groups { gap:.4rem; }
  .js-shop-panel__group h3 { padding:.5rem; font-size:.88rem; }
  .js-shop-dropdown .js-browse-links a { white-space:normal; font-size:.875rem; padding:.65rem .5rem; }
}