/* Homenique — full-site theme layer (loads everywhere in full-site mode).
   Overrides the Hello Elementor theme's defaults, colours and fonts, and
   styles the global top bar, header/menus and footer. Component tokens come
   from front.css (.ns-scope); this file adds the site shell + global type. */

:root{ --hq-body:'Inter',system-ui,-apple-system,sans-serif; --hq-display:'Spectral',Georgia,serif; }
html{ scroll-behavior:smooth; }

/* ---- Override Hello defaults globally ---- */
body.homenique-fullsite{
  font-family:var(--hq-body) !important;
  -webkit-font-smoothing:antialiased;
  background:#FFFFFF; color:#1A1E1C; margin:0;
}
body.homenique-fullsite h1,
body.homenique-fullsite h2,
body.homenique-fullsite h3,
body.homenique-fullsite h4,
body.homenique-fullsite h5{ font-family:var(--hq-display) !important; letter-spacing:-.01em; }
/* Hide Hello's own header / footer / page title — we render our own. */
body.homenique-fullsite > header.site-header,
body.homenique-fullsite .site-header,
body.homenique-fullsite footer.site-footer,
body.homenique-fullsite .site-footer,
body.homenique-fullsite .page-header,
body.homenique-fullsite .entry-header .page-title{ display:none !important; }
/* Let our content area breathe inside Hello's wrapper. */
body.homenique-fullsite .site-main,
body.homenique-fullsite .page-content,
body.homenique-fullsite main.site-main{ margin:0 !important; padding:0 !important; max-width:none !important; }

html.ns-dark body.homenique-fullsite{ background:#0F1416; color:#ECEFEC; }
@media(prefers-color-scheme:dark){ html:not(.ns-light):not(.ns-dark) body.homenique-fullsite{ background:#0F1416; color:#ECEFEC; } }

/* ---- Site shell carriers ---- */
.ns-shell{ display:block; }
.ns-shell-top{ position:relative; z-index:90; }

/* ---- Top bar ---- */
.ns-topbar{ background:#12161A; color:#D7CDB4; font-size:12.5px; }
.ns-topbar-in{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:9px 0; }
.ns-topbar-msg{ letter-spacing:.02em; opacity:.92; }
.ns-topbar-links{ display:flex; gap:18px; flex:none; }
.ns-topbar-links a{ color:#D7CDB4; text-decoration:none; font-weight:600; }
.ns-topbar-links a:hover{ color:var(--gold-bright); }

/* ---- Header: clean white floating bar (contained, rounded, bordered) ---- */
.ns-header{ width:min(88%,1480px); margin:14px auto 0; background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:0 10px 30px -22px rgba(20,30,25,.30); position:relative; }
.ns-header .ns-container{ width:100%; max-width:none; margin:0; padding:0 26px; }
.ns-header.ns-sticky{ z-index:200; }
.ns-header-in{ display:flex; align-items:center; gap:20px; padding:14px 0; transition:padding .2s; }
.ns-header.ns-sticky .ns-header-in{ padding:11px 0; }
.ns-logo{ display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); flex:none; }
.ns-logo-mark{ width:32px; height:32px; border-radius:10px; background:linear-gradient(140deg,var(--gold),#7a5f1f); box-shadow:0 8px 18px -8px var(--gold); }
.ns-logo-tx{ font-family:var(--display); font-weight:700; font-size:21px; letter-spacing:-.015em; }
.ns-nav{ display:flex; align-items:center; gap:2px; margin:0 0 0 10px; }
.ns-nav>a,.ns-nav-dropbtn{ display:inline-flex; align-items:center; gap:5px; font-weight:600; font-size:14.5px; color:var(--graphite); text-decoration:none; padding:9px 13px; border-radius:10px; background:transparent; border:0; cursor:pointer; font-family:inherit; line-height:1; }
.ns-nav>a:hover,.ns-nav-dropbtn:hover{ color:var(--ink); background:var(--mist); }
.ns-nav>a[aria-current="page"]{ color:var(--ink); }
.ns-nav-drop{ position:relative; }
.ns-nav-menu{ position:absolute; top:calc(100% + 12px); left:0; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 30px 70px -30px rgba(0,0,0,.5); padding:14px; display:none; z-index:90; }
.ns-nav-drop:hover .ns-nav-menu,.ns-nav-drop.open .ns-nav-menu{ display:block; }
.ns-mega{ width:600px; min-width:600px; max-width:92vw; }
.ns-mega-all{ font-weight:700; color:var(--green); text-decoration:none; font-size:14px; }
.ns-mega-all:hover{ color:var(--gold); }
.ns-mega-grid{ display:grid; grid-template-columns:1fr 1fr; gap:6px 16px; margin-top:12px; }
.ns-mega-grid a{ display:flex; flex-direction:row; align-items:center; gap:11px; padding:9px 12px; border-radius:10px; text-decoration:none; color:var(--ink); }
.ns-mega-grid a:hover{ background:var(--mist); }
.ns-mega-grid b{ font-size:14px; font-weight:600; }
.ns-mega-grid small{ font-family:var(--mono); font-size:11px; color:var(--graphite); }
.ns-header-actions{ margin-left:auto; display:flex; align-items:center; gap:8px; flex:none; }

/* ---- Footer ---- */
.ns-footer{ background:var(--paper); border-top:1px solid var(--line); padding:60px 0 26px; }
.ns-foot-top{ display:grid; grid-template-columns:1.5fr 1fr; gap:36px; padding-bottom:34px; border-bottom:1px solid var(--line); align-items:start; }
.ns-foot-brand .ns-logo{ margin-bottom:12px; }
.ns-foot-brand p{ color:var(--graphite); font-size:14px; max-width:42ch; margin:0; line-height:1.6; }
.ns-foot-social{ display:flex; gap:10px; margin-top:16px; }
.ns-foot-social a{ width:36px; height:36px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; color:var(--ink); text-decoration:none; }
.ns-foot-social a:hover{ border-color:var(--gold); color:var(--gold); }
.ns-foot-news h5{ font-family:var(--display); font-size:18px; margin:0 0 6px; }
.ns-foot-news p{ color:var(--graphite); font-size:14px; margin:0 0 12px; }
.ns-foot-form{ display:flex; gap:8px; max-width:430px; }
.ns-foot-form input{ flex:1; border:1px solid var(--line); border-radius:999px; padding:12px 16px; font:inherit; background:var(--white); color:var(--ink); }
.ns-foot-form input:focus{ outline:none; border-color:var(--gold); }
.ns-foot-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:28px; padding:34px 0; }
.ns-foot-col h5{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--graphite); margin:0 0 12px; }
.ns-foot-col a{ display:block; color:var(--ink); text-decoration:none; font-size:14px; padding:5px 0; }
.ns-foot-col a:hover{ color:var(--gold); }
.ns-foot-bottom{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding-top:22px; border-top:1px solid var(--line); font-size:12px; color:var(--graphite); font-family:var(--mono); }
.ns-totop{ color:var(--graphite); text-decoration:none; }
.ns-totop:hover{ color:var(--ink); }
.ns-pay{ letter-spacing:.06em; }

@media(max-width:860px){
  .ns-topbar-links a:last-child{ display:none; }
  .ns-foot-top{ grid-template-columns:1fr; gap:24px; }
  .ns-foot-grid{ grid-template-columns:1fr 1fr; }
  .ns-mega{ min-width:0; }
  .ns-mega-grid{ grid-template-columns:1fr; }
}
@media(max-width:480px){
  .ns-foot-grid{ grid-template-columns:1fr; }
  .ns-foot-bottom{ flex-direction:column; align-items:flex-start; gap:8px; }
}

/* Header action buttons (account, wishlist, compare, cart, theme) */
.ns-header-actions .ns-act,
.ns-header-actions .ns-act-wrap > .ns-act{ position:relative; display:inline-grid; place-items:center; width:42px; height:42px; border:1px solid var(--line); border-radius:999px; color:var(--ink); text-decoration:none; background:#fff; cursor:pointer; transition:border-color .15s, color .15s, background .15s; }
.ns-header-actions .ns-act:hover{ border-color:var(--gold); color:var(--gold); background:#fff; }
.ns-header-actions .ns-act .ns-ic{ width:19px; height:19px; }
.ns-badge{ position:absolute; top:-5px; right:-5px; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--gold); color:#241B05; font:700 11px/18px var(--mono); text-align:center; pointer-events:none; }
.ns-comp-count, .ns-wish-count{ background:var(--green); color:#fff; }
/* dark-mode toggle shows exactly one glyph */
.ns-dark-toggle .ns-i-sun{ display:none; }
.ns-dark-toggle .ns-i-moon{ display:inline-grid; }
html.ns-dark .ns-dark-toggle .ns-i-sun{ display:inline-grid; }
html.ns-dark .ns-dark-toggle .ns-i-moon{ display:none; }
.ns-dark-toggle .ns-i-sun, .ns-dark-toggle .ns-i-moon{ place-items:center; }

/* Currency switcher (top bar) */
.ns-currency{ background:transparent; color:#D7CDB4; border:1px solid rgba(255,255,255,.22); border-radius:7px; padding:3px 8px; font:600 12px/1 var(--mono); cursor:pointer; }
.ns-currency option{ color:#222; }

/* ===== hover panels, mega images, mobile drawer ===== */
.ns-ic{ display:block; }
.ns-header-actions{ gap:8px; }
.ns-act-wrap{ position:relative; display:inline-block; }

/* hover mini-panels (wishlist / compare / cart) — solid, premium */
.ns-pop{ position:absolute; top:100%; right:0; margin-top:12px; width:320px; background:#ffffff; border:1px solid var(--line); border-radius:16px; box-shadow:0 28px 64px -26px rgba(20,30,25,.5); padding:0 12px 12px; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .16s, transform .16s, visibility .16s; z-index:120; overflow:hidden; }
.ns-pop::before{ content:""; position:absolute; top:-14px; left:0; right:0; height:16px; } /* hover bridge */
.ns-act-wrap:hover .ns-pop, .ns-act-wrap.open .ns-pop{ opacity:1; visibility:visible; transform:none; }
.ns-pop-head{ background:var(--green); color:#fff; font-family:var(--display); font-weight:700; font-size:15px; margin:0 -12px 8px; padding:12px 16px; letter-spacing:.01em; }
.ns-pop-body{ max-height:320px; overflow:auto; }
.ns-pop-empty{ color:var(--graphite); font-size:13px; padding:18px 4px; text-align:center; }
.ns-pop-row{ display:flex; gap:10px; align-items:center; padding:9px 4px; border-top:1px solid var(--line); }
.ns-pop-row:first-child{ border-top:0; }
.ns-pop-thumb{ width:46px; height:46px; border-radius:9px; background:#fff center/cover no-repeat; border:1px solid var(--line); flex:none; }
.ns-pop-info{ flex:1; min-width:0; }
.ns-pop-name{ font-size:13px; font-weight:600; color:var(--ink); text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; }
.ns-pop-name:hover{ color:var(--green); }
.ns-pop-meta{ font-size:12px; color:var(--graphite); }
.ns-pop-x{ background:none; border:0; color:var(--graphite); cursor:pointer; font-size:17px; line-height:1; padding:2px 4px; }
.ns-pop-x:hover{ color:var(--gold); }
.ns-pop-foot{ display:block; text-align:center; margin-top:10px; padding:12px; border-radius:11px; background:var(--gold); color:#241B05; text-decoration:none; font-weight:700; font-size:13px; letter-spacing:.02em; }
.ns-pop-foot:hover{ background:var(--green); color:#fff; }

/* mega menu: remove gap, add images */
.ns-nav-menu{ margin-top:6px; }
.ns-nav-drop .ns-nav-menu::before{ content:""; position:absolute; top:-12px; left:0; right:0; height:14px; }
.ns-mega-grid a{ display:flex; align-items:center; gap:11px; }
.ns-mega-img{ width:44px; height:44px; border-radius:10px; background:var(--mist) center/cover no-repeat; flex:none; }
.ns-mega-tx{ display:flex; flex-direction:column; }

/* ---- Mobile drawer ---- */
.ns-drawer{ position:fixed; top:0; left:0; height:100%; width:min(86vw,360px); background:var(--white); color:var(--ink); transform:translateX(-100%); transition:transform .3s cubic-bezier(.2,.8,.2,1); z-index:300; display:flex; flex-direction:column; box-shadow:0 0 60px rgba(0,0,0,.3); }
body.ns-drawer-open .ns-drawer{ transform:none; }
.ns-drawer-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.5); opacity:0; visibility:hidden; transition:.3s; z-index:290; }
body.ns-drawer-open .ns-drawer-backdrop{ opacity:1; visibility:visible; }
body.ns-drawer-open{ overflow:hidden; }
.ns-drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--line); }
.ns-drawer-close{ background:none; border:0; font-size:28px; line-height:1; cursor:pointer; color:var(--ink); }
.ns-drawer-panels{ position:relative; flex:1; overflow:hidden; }
.ns-drawer-panel{ position:absolute; inset:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:8px 0; transition:transform .28s ease; }
.ns-dp-cats{ transform:translateX(100%); }
.ns-drawer.show-cats .ns-dp-main{ transform:translateX(-100%); }
.ns-drawer.show-cats .ns-dp-cats{ transform:translateX(0); }
.ns-dl{ display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:14px 18px; font:600 16px var(--hq-body,sans-serif); color:var(--ink); text-decoration:none; background:none; border:0; cursor:pointer; }
.ns-dl:hover{ background:var(--mist); }
.ns-dl-expand{ justify-content:space-between; }
.ns-dl-expand span{ color:var(--graphite); font-size:24px; line-height:1; }
.ns-dl-back{ color:var(--graphite); font-weight:600; border-bottom:1px solid var(--line); }
.ns-dl-thumb{ width:40px; height:40px; border-radius:9px; background:var(--mist) center/cover no-repeat; flex:none; }
.ns-dl small{ margin-left:auto; color:var(--graphite); font-family:var(--mono); font-size:12px; }
.ns-drawer-actions{ display:grid; grid-template-columns:repeat(5,1fr); gap:2px; padding:12px; border-top:1px solid var(--line); }
.ns-drawer-actions a, .ns-drawer-actions button{ display:flex; flex-direction:column; align-items:center; gap:5px; padding:8px 2px; border:0; background:none; cursor:pointer; color:var(--ink); text-decoration:none; font-size:10.5px; position:relative; }
.ns-drawer-actions a:hover{ color:var(--gold); }
.ns-drawer-actions .ns-badge{ position:absolute; top:-2px; left:calc(50% + 6px); }

/* visibility rules */
@media(min-width:861px){ .ns-drawer, .ns-drawer-backdrop{ display:none !important; } }
@media(max-width:860px){
  .ns-nav{ display:none !important; }
  .ns-burger{ display:flex !important; order:-1; margin-left:0; }
  .ns-header-actions .ns-hide-mobile{ display:none !important; }
  .ns-pop{ display:none !important; }
  .ns-header{ width:92%; margin-top:10px; border-radius:16px; }
  .ns-header .ns-container{ padding:0 16px; }
  .ns-header-in{ gap:10px; padding:10px 0; }
  .ns-logo-tx{ font-size:18px; }
  .ns-header-actions{ gap:6px; }
  .ns-header-actions .ns-act{ width:40px; height:40px; }
  body.ns-headfixed .ns-header.ns-sticky{ width:100%; top:0; left:0; transform:none; border:0; border-radius:0 0 16px 16px; }
  body.ns-headfixed .ns-header.ns-sticky .ns-navbar{ border-radius:0 0 16px 16px; }
}
@media(max-width:380px){
  .ns-logo-tx{ display:none; }
  .ns-header-actions .ns-act{ width:38px; height:38px; }
}

/* Keep sticky working in full-site mode even if the base theme set overflow-x:hidden */
body.homenique-fullsite{ overflow-x:clip; }

/* ============================================================
   Header v2 — search bar, labeled actions, nav row, black round icons
   ============================================================ */
/* Round BLACK borders on the circular icon buttons */
.ns-header-actions .ns-act,
.ns-header-actions .ns-act-item .ns-act{ border:1.6px solid var(--ink); color:var(--ink); background:#fff; }
.ns-header-actions .ns-act:hover{ border-color:var(--gold); color:var(--gold); }
.ns-burger{ border:1.6px solid var(--ink); border-radius:12px; background:#fff; }

/* Inline search */
.ns-search{ position:relative; flex:1 1 auto; max-width:560px; display:flex; align-items:center; margin:0 6px; }
.ns-search-ic{ position:absolute; left:14px; color:var(--graphite); pointer-events:none; }
.ns-search-input{ width:100%; height:46px; border:1.6px solid var(--ink); border-radius:999px; padding:0 18px 0 42px; font:inherit; font-size:14.5px; background:#fff; color:var(--ink); transition:box-shadow .15s, border-color .15s; }
.ns-search-input::placeholder{ color:var(--graphite); }
.ns-search-input:focus{ outline:0; border-color:var(--green); box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 16%, transparent); }

/* Labeled action items (account, cart) */
.ns-act-item{ display:inline-flex; align-items:center; gap:9px; text-decoration:none; color:var(--ink); }
.ns-act-item .ns-act{ pointer-events:none; }
.ns-act-tx{ display:flex; flex-direction:column; line-height:1.18; }
.ns-act-tx b{ font-size:13.5px; font-weight:700; color:var(--ink); }
.ns-act-tx small{ font-size:11.5px; color:var(--graphite); }
.ns-act-cart .ns-act-tx b{ color:var(--green); }
.ns-msearch-btn{ display:none; }

/* Mobile search bar */
.ns-msearch{ padding:10px 0 4px; }
.ns-msearch[hidden]{ display:none; }
.ns-msearch .ns-search{ max-width:none; margin:0; }

/* Nav row */
.ns-navbar{ border-top:1px solid var(--line); }
.ns-navbar-in{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:4px 0; }
.ns-navbar .ns-nav{ margin:0; }
.ns-navcta{ display:inline-flex; align-items:center; gap:7px; flex:none; background:var(--green); color:#fff; text-decoration:none; font-weight:700; font-size:13.5px; padding:9px 16px; border-radius:999px; }
.ns-navcta:hover{ background:var(--gold); color:#241B05; }

/* Dark mode */
html.ns-dark .ns-header-actions .ns-act,
html.ns-dark .ns-burger,
html.ns-dark .ns-search-input{ border-color:rgba(255,255,255,.7); color:#ECEFEC; background:#1B2226; }
html.ns-dark .ns-act-tx b{ color:#ECEFEC; }
html.ns-dark .ns-navbar{ border-top-color:rgba(255,255,255,.12); }

/* Responsive */
@media(max-width:980px){
  .ns-act-tx{ display:none; } /* icons only when tight */
  .ns-search{ max-width:none; }
}
@media(max-width:860px){
  .ns-search{ display:none; }            /* inline search hidden; use toggle */
  .ns-msearch-btn{ display:inline-grid; }
  .ns-navbar{ display:none; }            /* nav lives in the drawer on mobile */
}
@media(min-width:861px){
  .ns-msearch{ display:none !important; }
}

/* ============================================================
   HEADER POLISH v3 — alignment, distinct bordered icons, nav strip
   (appended last so it wins) ================================ */
.ns-header{ overflow:visible; }
.ns-header .ns-header-in{ display:flex; align-items:center; gap:18px; padding:14px 0; }

/* Brand mark — always visible monogram badge */
.ns-logo{ gap:12px; }
.ns-logo-mark{ display:inline-grid !important; place-items:center; width:40px; height:40px; border-radius:12px;
  background:linear-gradient(140deg,var(--gold),#8a6a1e); color:#fff; font:800 19px/1 var(--display);
  border:1.5px solid rgba(0,0,0,.12); box-shadow:0 8px 18px -8px rgba(184,144,31,.8); flex:none; }
.ns-logo-tx{ font-size:21px; font-weight:700; color:var(--ink); }

/* Inline search — distinct field */
.ns-search{ flex:1 1 auto; max-width:560px; margin:0 4px; }
.ns-search-input{ height:46px; border:1.6px solid var(--ink); border-radius:999px; background:#fff; }

/* EVERY header icon button: consistent round, visible border */
.ns-header-actions{ display:flex; align-items:center; gap:10px; margin-left:auto; }
.ns-header-actions .ns-act,
.ns-header-actions .ns-msearch-btn,
.ns-header-actions .ns-dark-toggle,
.ns-header-actions .ns-act-item .ns-act{
  display:inline-grid !important; place-items:center; width:44px; height:44px; flex:none;
  border:1.7px solid var(--ink); border-radius:999px; background:#fff; color:var(--ink);
  cursor:pointer; position:relative; transition:border-color .15s, color .15s, background .15s, box-shadow .15s;
}
.ns-header-actions .ns-act:hover,
.ns-header-actions .ns-act-item:hover .ns-act{ border-color:var(--green); color:var(--green); box-shadow:0 6px 16px -10px rgba(27,94,68,.7); }
.ns-header-actions .ns-act .ns-ic,
.ns-header-actions .ns-msearch-btn svg,
.ns-header-actions .ns-dark-toggle .ns-ic{ width:20px; height:20px; }

/* Labeled account / cart */
.ns-act-item{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.ns-act-tx{ display:flex; flex-direction:column; line-height:1.2; }
.ns-act-tx b{ font-size:13.5px; font-weight:700; color:var(--ink); }
.ns-act-tx small{ font-size:11px; color:var(--graphite); text-transform:uppercase; letter-spacing:.04em; }
.ns-act-cart .ns-act-tx b{ color:var(--green); }
.ns-badge{ top:-6px; right:-6px; }

/* ---- Nav strip: full-width, visible divider, UPPERCASE, neat ---- */
.ns-navbar{ border-top:2px solid rgba(20,30,25,.14); border-radius:0 0 17px 17px; background:#FAF8F2; }
.ns-navbar-in{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:2px 0; }
.ns-navbar .ns-nav{ display:flex; align-items:center; gap:2px; margin:0; }
.ns-navbar .ns-nav>a,
.ns-navbar .ns-nav-dropbtn{ text-transform:uppercase; letter-spacing:.06em; font-weight:700; font-size:12.5px; color:var(--ink); padding:14px 16px; border-radius:0; position:relative; background:transparent; }
.ns-navbar .ns-nav>a:hover,
.ns-navbar .ns-nav-dropbtn:hover{ color:var(--green); background:transparent; }
.ns-navbar .ns-nav>a::after{ content:""; position:absolute; left:16px; right:16px; bottom:8px; height:2px; background:var(--green); transform:scaleX(0); transform-origin:left; transition:transform .18s; }
.ns-navbar .ns-nav>a:hover::after,
.ns-navbar .ns-nav>a[aria-current="page"]::after{ transform:scaleX(1); }
.ns-navcta{ display:inline-flex; align-items:center; gap:7px; flex:none; background:var(--green); color:#fff; text-decoration:none; font-weight:700; text-transform:uppercase; letter-spacing:.04em; font-size:12px; padding:10px 18px; border-radius:999px; }
.ns-navcta:hover{ background:var(--gold); color:#241B05; }

/* Light-mode distinctness for the announcement top bar */
.ns-topbar{ background:#15181A; }

/* Dark mode */
html.ns-dark .ns-header-actions .ns-act,
html.ns-dark .ns-header-actions .ns-msearch-btn,
html.ns-dark .ns-header-actions .ns-dark-toggle,
html.ns-dark .ns-header-actions .ns-act-item .ns-act,
html.ns-dark .ns-search-input{ border-color:rgba(255,255,255,.65); color:#ECEFEC; background:#1B2226; }
html.ns-dark .ns-act-tx b, html.ns-dark .ns-logo-tx{ color:#ECEFEC; }
html.ns-dark .ns-navbar{ background:#11171A; border-top-color:rgba(255,255,255,.14); }
html.ns-dark .ns-navbar .ns-nav>a, html.ns-dark .ns-navbar .ns-nav-dropbtn{ color:#E7EAE6; }

/* Mobile tidy */
@media(max-width:980px){ .ns-act-tx{ display:none; } }
@media(max-width:860px){
  .ns-header .ns-header-in{ gap:12px; }
  .ns-header-actions{ gap:8px; }
  .ns-header-actions .ns-act, .ns-header-actions .ns-act-item .ns-act, .ns-header-actions .ns-msearch-btn, .ns-header-actions .ns-dark-toggle{ width:42px; height:42px; }
}

/* keep the mobile-search button hidden on desktop (icon rule re-enabled display) */
@media(min-width:861px){ .ns-header-actions .ns-msearch-btn{ display:none !important; } }

/* ============================================================
   HEADER FIT + CONTRAST v4  (appended last — wins)
   Keep all elements INSIDE the card; distinct black borders.
   ============================================================ */
.ns-header{ overflow:visible; }
.ns-header .ns-container{ box-sizing:border-box; max-width:100%; padding-left:20px; padding-right:20px; }

/* Single row, never wraps, children may shrink */
.ns-header .ns-header-in{ display:flex; align-items:center; flex-wrap:nowrap; gap:12px; min-width:0; padding:12px 0; }
.ns-logo{ flex:none; min-width:0; gap:10px; }
.ns-logo-tx{ font-size:19px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:40vw; }

/* Search grows to fill but can shrink; small, tidy gap to the icons */
.ns-search{ flex:1 1 auto; min-width:0; max-width:none; margin:0; }
.ns-search-input{ min-width:0; width:100%; height:44px; border:1.9px solid #111; border-radius:999px; background:#fff; color:#16110b; }
.ns-search-input::placeholder{ color:#7a756e; }

/* Actions hug the right edge, compact */
.ns-header-actions{ flex:none; display:flex; align-items:center; gap:8px; margin-left:8px; }

/* All icon buttons: compact, distinct BLACK round border */
.ns-header-actions .ns-act,
.ns-header-actions .ns-msearch-btn,
.ns-header-actions .ns-dark-toggle,
.ns-header-actions .ns-act-item .ns-act{
  width:42px; height:42px; flex:none; display:inline-grid !important; place-items:center;
  border:1.9px solid #111 !important; border-radius:999px; background:#fff; color:#111;
  box-shadow:0 1px 0 rgba(0,0,0,.04);
}
.ns-header-actions .ns-act:hover,
.ns-header-actions .ns-act-item:hover .ns-act{ border-color:var(--green) !important; color:var(--green); }
.ns-header-actions .ns-act svg,
.ns-header-actions .ns-msearch-btn svg,
.ns-header-actions .ns-dark-toggle svg{ width:19px; height:19px; }

/* Labeled account / cart text */
.ns-act-item{ gap:9px; }
.ns-act-tx b{ color:#15110b; font-size:13px; line-height:1.15; }
.ns-act-tx small{ color:#6f6a63; font-size:10.5px; }
.ns-act-cart .ns-act-tx b{ color:var(--green); }

/* Brand monogram — solid, bordered, unmistakable */
.ns-logo-mark{ width:40px; height:40px; border:1.9px solid #111 !important; color:#fff;
  background:linear-gradient(140deg,var(--gold),#8a6a1e); }

/* Hide the text labels earlier so mid-size screens never overflow */
@media(max-width:1180px){ .ns-act-tx{ display:none; } }
@media(max-width:860px){
  .ns-header .ns-header-in{ gap:10px; }
  .ns-header-actions{ gap:7px; margin-left:6px; }
  .ns-header-actions .ns-act, .ns-header-actions .ns-act-item .ns-act,
  .ns-header-actions .ns-msearch-btn, .ns-header-actions .ns-dark-toggle{ width:40px; height:40px; }
}

/* ---------------- DARK MODE (robust, nothing washed out) -------------- */
html.ns-dark .ns-header .ns-search-input,
html.ns-dark .ns-header-actions .ns-act,
html.ns-dark .ns-header-actions .ns-msearch-btn,
html.ns-dark .ns-header-actions .ns-dark-toggle,
html.ns-dark .ns-header-actions .ns-act-item .ns-act{
  border-color:rgba(255,255,255,.85) !important; color:#F3F5F2 !important; background:#1B2226 !important;
}
html.ns-dark .ns-header-actions .ns-act:hover,
html.ns-dark .ns-header-actions .ns-act-item:hover .ns-act{ border-color:var(--gold) !important; color:var(--gold) !important; }
html.ns-dark .ns-search-input{ color:#F3F5F2 !important; }
html.ns-dark .ns-search-input::placeholder{ color:#9aa39b; }
html.ns-dark .ns-logo-tx{ color:#F3F5F2; }
html.ns-dark .ns-act-tx b{ color:#F3F5F2; }
html.ns-dark .ns-act-tx small{ color:#9aa39b; }
html.ns-dark .ns-act-cart .ns-act-tx b{ color:#7FD7AE; }
html.ns-dark .ns-logo-mark{ border-color:rgba(255,255,255,.5) !important; }
html.ns-dark .ns-navbar .ns-nav>a, html.ns-dark .ns-navbar .ns-nav-dropbtn{ color:#E7EAE6; }
html.ns-dark .ns-navcta{ color:#fff; }

/* ============================================================
   HEADER FIT v5 — shorter search, everything inside the card
   (appended last, wins) ====================================== */
.ns-header .ns-header-in{ display:flex; align-items:center; flex-wrap:nowrap; min-width:0; gap:10px; }

/* Search: about half width, fixed, can shrink on small screens, never grows */
.ns-search{ flex:0 1 340px; width:340px; max-width:340px; min-width:0; margin:0 6px 0 2px; }

/* Actions pushed to the right edge, compact, never overflow */
.ns-header-actions{ flex:none; margin-left:auto; gap:8px; }
.ns-header-actions .ns-act,
.ns-header-actions .ns-msearch-btn,
.ns-header-actions .ns-dark-toggle,
.ns-header-actions .ns-act-item .ns-act{ width:42px; height:42px; }

/* Drop the Account/Cart text earlier so they never spill */
@media(max-width:1280px){ .ns-act-tx{ display:none; } }
@media(max-width:1040px){ .ns-search{ flex-basis:280px; width:280px; max-width:280px; } }
@media(max-width:860px){
  .ns-search{ display:none; }            /* mobile uses the tap-to-open search */
  .ns-header-actions{ gap:7px; }
  .ns-header-actions .ns-act,
  .ns-header-actions .ns-act-item .ns-act,
  .ns-header-actions .ns-msearch-btn,
  .ns-header-actions .ns-dark-toggle{ width:40px; height:40px; }
}

/* ============================================================
   HEADER OVERFLOW GUARD v6 — keep the action cluster (esp. cart)
   strictly inside the card border. (appended last, wins)
   ============================================================ */
/* A little breathing room on the right so nothing touches the border */
.ns-header .ns-header-in{ padding-right:6px; }
.ns-header-actions{ flex:none; }

/* Pull the count badges INWARD so they can't poke past the edge */
.ns-header-actions .ns-badge{ top:-4px; right:-2px; min-width:17px; height:17px; line-height:15px; padding:0 4px; font-size:10px; }

/* The last action (cart) must never overhang */
.ns-header-actions .ns-act-cart{ margin-right:0; }
.ns-header-actions .ns-act-cart .ns-act-item{ max-width:100%; }

/* Cap label text width and ellipsize, so a long total can't widen the bar */
.ns-act-tx{ max-width:118px; overflow:hidden; }
.ns-act-tx b, .ns-act-tx small, .ns-cart-total{
  display:block; max-width:118px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* Drop the Account/Cart labels a touch earlier to guarantee a clean fit */
@media(max-width:1320px){ .ns-act-tx{ display:none; } }

/* ============================================================
   HEADER LAYOUT v7 — no standalone search icon; search bar kept;
   Account sits before Cart; cart total always visible; clean fit.
   (appended last, wins) ====================================== */
/* Search bar: slightly shorter, shrinks to fit, never grows past 300 */
.ns-search{ flex:0 1 300px; width:300px; max-width:300px; min-width:0; margin:0 8px 0 2px; }

/* Keep the CART TOTAL visible at every width */
.ns-header-actions .ns-act-cart .ns-act-tx{ display:flex !important; }
.ns-header-actions .ns-act-cart .ns-cart-total{ max-width:130px; }

/* The Account label may collapse on tighter screens (cart total stays) */
@media(max-width:1200px){ .ns-header-actions > .ns-act-item .ns-act-tx{ display:none; } }

/* Mobile: drop the inline search to its own full-width row, still visible */
@media(max-width:860px){
  .ns-header .ns-header-in{ flex-wrap:wrap; }
  .ns-search{ display:flex !important; order:9; flex:1 1 100%; width:auto; max-width:none; margin:8px 0 2px; }
  .ns-header-actions{ order:5; }
}

/* ============================================================
   HEADER FINAL v8 — single source of truth (appended last, wins)
   • search fills with a sane cap, icons grouped right after it
   • icons pushed inside the card (not on the border)
   • cart TOTAL always visible
   • counters: dark pill, white border + number, shadow (light mode);
     inverted in dark mode; responsive on all devices
   ============================================================ */
.ns-header .ns-header-in{ display:flex; align-items:center; gap:10px; padding-right:14px; }

/* Search fills the space (small gap to icons) but never gets silly-wide */
.ns-search{ flex:1 1 auto !important; min-width:0; width:auto !important; max-width:680px !important; margin:0 8px 0 2px !important; }

/* Icons sit immediately after the search, with a right buffer so the
   whole cluster (incl. the cart total) stays comfortably inside the card */
.ns-header-actions{ margin-left:0 !important; gap:8px !important; padding-right:2px; flex:none; }

/* CART TOTAL — always visible at every width */
.ns-header-actions .ns-act-cart .ns-act-tx{ display:flex !important; flex-direction:column; }
.ns-header-actions .ns-act-cart .ns-act-tx small{ display:block !important; }
.ns-header-actions .ns-act-cart .ns-act-tx b,
.ns-header-actions .ns-act-cart .ns-cart-total{ display:block !important; max-width:150px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Account label may collapse first on tighter screens (cart total stays) */
@media(max-width:1180px){ .ns-header-actions > .ns-act-item .ns-act-tx{ display:none !important; } }
/* Very small phones: cart shows icon only to avoid crowding */
@media(max-width:560px){ .ns-header-actions .ns-act-cart .ns-act-tx{ display:none !important; } }

/* ---- VISIBLE COUNTERS / BADGES ---- */
.ns-header-actions .ns-act{ position:relative; overflow:visible; }
.ns-header-actions .ns-badge{
  position:absolute !important; top:-7px; right:-7px;
  min-width:19px; height:19px; padding:0 5px; display:grid !important; place-items:center;
  border-radius:999px; background:#15181A !important; color:#fff !important;
  border:2px solid #fff !important; box-shadow:0 2px 8px rgba(0,0,0,.45) !important;
  font:800 10.5px/1 var(--mono,monospace) !important; letter-spacing:0 !important;
  pointer-events:none; z-index:6;
}
html.ns-dark .ns-header-actions .ns-badge{
  background:#ffffff !important; color:#15181A !important; border-color:#15181A !important;
  box-shadow:0 2px 8px rgba(0,0,0,.6) !important;
}

/* ---- Responsive ---- */
@media(max-width:860px){
  .ns-header .ns-header-in{ flex-wrap:wrap; padding-right:8px; }
  .ns-search{ order:9; flex:1 1 100% !important; max-width:none !important; margin:8px 0 2px !important; }
  .ns-header-actions{ order:5; margin-left:auto !important; }
}

/* ============================================================
   HEADER FINAL v9 — icons far right, clean spacing, round counters
   (appended last, wins) ====================================== */
/* Shorter search (doesn't grow); icons pushed to the far right edge */
.ns-search{ flex:0 1 440px !important; width:440px !important; max-width:440px !important; min-width:0; margin:0 8px 0 2px !important; }
.ns-header-actions{ margin-left:auto !important; gap:14px !important; padding-right:2px; flex:none; }

/* Cart total stays visible; Account is now the last item */
.ns-header-actions .ns-act-cart .ns-act-tx{ display:flex !important; }

/* ---- COUNTERS: clean, neat, PERFECT circle (not oval/cornered) ---- */
.ns-header-actions .ns-act{ position:relative; overflow:visible; }
.ns-header-actions .ns-badge{
  position:absolute !important; top:-6px; right:-6px;
  width:18px !important; height:18px !important; min-width:18px !important; padding:0 !important;
  display:grid !important; place-items:center; border-radius:50% !important; aspect-ratio:1 / 1;
  background:#16191B !important; color:#fff !important; border:1.5px solid #fff !important;
  box-shadow:0 1px 4px rgba(0,0,0,.30) !important;
  font:700 10px/1 var(--mono,monospace) !important; letter-spacing:0 !important;
  pointer-events:none; z-index:6;
}
html.ns-dark .ns-header-actions .ns-badge{
  background:#fff !important; color:#16191B !important; border-color:#16191B !important;
  box-shadow:0 1px 5px rgba(0,0,0,.55) !important;
}

/* Responsive */
@media(max-width:1024px){ .ns-search{ flex:0 1 360px !important; width:360px !important; max-width:360px !important; } }
@media(max-width:860px){
  .ns-header .ns-header-in{ flex-wrap:wrap; }
  .ns-search{ order:9; flex:1 1 100% !important; width:auto !important; max-width:none !important; margin:8px 0 2px !important; }
  .ns-header-actions{ order:5; gap:12px !important; }
}

/* ============================================================
   v10 — keep brand tokens on the header after the sticky JS
   relocates it out of .ns-scope (fixes invisible monogram, etc.)
   ============================================================ */
.ns-shell, .ns-header, .ns-topbar, .ns-drawer{
  --gold:#C8A24A; --gold-bright:#E2BC57; --gold-soft:#F3E9CC;
  --green:#1B6B4F; --green-bright:#239A6E;
  --black:#0E1110; --ink:#1A1E1C; --graphite:#4A524E;
  --white:#FFFFFF; --paper:#F7F8F6; --mist:#EEF0EC; --line:rgba(14,17,16,.10);
  --display:'Spectral',Georgia,serif; --body:'Inter',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
}
html.ns-dark .ns-shell, html.ns-dark .ns-header, html.ns-dark .ns-topbar, html.ns-dark .ns-drawer{
  --white:#161A1C; --paper:#0F1416; --mist:#222926; --ink:#ECEFEC; --graphite:#9FA7A1; --line:rgba(255,255,255,.14);
}

/* Monogram: literal colours so it is ALWAYS visible (independent of vars) */
.ns-logo-mark{
  display:inline-grid !important; place-items:center !important;
  width:40px !important; height:40px !important; flex:none !important;
  border-radius:11px !important;
  background:linear-gradient(140deg,#C8A24A,#8a6a1e) !important;
  color:#ffffff !important; border:1.7px solid #15110b !important;
  font:800 18px/1 'Spectral',Georgia,serif !important;
  box-shadow:0 8px 18px -10px rgba(184,144,31,.85) !important;
}
html.ns-dark .ns-logo-mark{ border-color:rgba(255,255,255,.5) !important; }

/* ============================================================
   v11 — fix mega-menu hover gap + dark mode for the dropdown
   ============================================================ */
/* Keep a small visual gap but make the whole area hoverable */
.ns-nav-menu{ top:calc(100% + 8px) !important; margin-top:0 !important; }
/* Always-present hover bridge on the dropdown itself (not the hidden menu),
   so moving the cursor from the button to the panel never drops :hover */
.ns-nav-drop::after{ content:""; position:absolute; left:0; top:100%; width:100%; height:16px; background:transparent; z-index:80; }
/* A tiny open delay on close so it doesn't flicker */
.ns-nav-drop:hover .ns-nav-menu, .ns-nav-drop.open .ns-nav-menu{ display:block !important; }

/* ---- Dark mode for the mega menu / dropdown panel ---- */
html.ns-dark .ns-nav-menu{
  background:#161B1D !important; border-color:rgba(255,255,255,.14) !important;
  box-shadow:0 30px 70px -28px rgba(0,0,0,.75) !important;
}
html.ns-dark .ns-mega-all{ color:#7FD7AE !important; }
html.ns-dark .ns-mega-all:hover{ color:var(--gold,#C8A24A) !important; }
html.ns-dark .ns-mega-grid a{ color:#ECEFEC !important; }
html.ns-dark .ns-mega-grid a:hover{ background:rgba(255,255,255,.07) !important; }
html.ns-dark .ns-mega-grid b{ color:#F3F5F2 !important; }
html.ns-dark .ns-mega-grid small{ color:#9aa39b !important; }
html.ns-dark .ns-mega-img{ background:#222926 !important; }

/* Hover bridge for the header pop panels too (icon → panel gap) */
.ns-act-wrap[data-pop]{ position:relative; }
.ns-act-wrap[data-pop]::after{ content:""; position:absolute; left:0; right:0; top:100%; height:16px; background:transparent; }
/* Ensure the pop panels are fully dark in dark mode */
html.ns-dark .ns-pop{ background:#161B1D !important; border-color:rgba(255,255,255,.14) !important; }
html.ns-dark .ns-pop-head{ background:var(--green,#1B6B4F) !important; color:#fff !important; }
html.ns-dark .ns-pop-name{ color:#ECEFEC !important; }
html.ns-dark .ns-pop-meta, html.ns-dark .ns-pop-empty{ color:#9aa39b !important; }
html.ns-dark .ns-pop-row{ border-top-color:rgba(255,255,255,.10) !important; }

/* ============================================================
   v12 — Two-line logo + responsive mobile header
   ============================================================ */
.ns-logo{ display:inline-flex; align-items:center; gap:11px; text-decoration:none; }
.ns-logo-tx{ display:flex; flex-direction:column; justify-content:center; line-height:1; }
.ns-logo-1{ font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:19px; letter-spacing:.6px; color:var(--ink); }
.ns-logo-2{ font-family:var(--display); font-weight:300; text-transform:uppercase; font-size:10px; letter-spacing:4px; color:var(--graphite); margin-top:3px; }
html.ns-dark .ns-logo-1{ color:#F3F5F2; }
html.ns-dark .ns-logo-2{ color:#AEB7B1; }

/* Search toggle is desktop-hidden (inline search is shown on desktop). */
.ns-search-toggle{ display:none; }
.ns-header-in{ position:relative; }

@media (max-width:900px){
  /* Dark-mode toggle removed on mobile. Account stays as the LAST icon. */
  .ns-header-actions .ns-dark-toggle{ display:none !important; }

  /* Search: remove the inline bar, keep only a tap-to-open icon. */
  .ns-header .ns-search{ display:none; }
  .ns-search-toggle{ display:inline-grid; place-items:center; }

  /* All header actions become uniform circular icon buttons. */
  .ns-header-actions{ gap:8px; align-items:center; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{
    width:42px; height:42px; border:1px solid var(--line); border-radius:999px;
    background:#fff; color:var(--ink); display:inline-grid; place-items:center; cursor:pointer; position:relative;
  }
  html.ns-dark .ns-search-toggle,
  html.ns-dark .ns-header-actions .ns-act-cart .ns-act,
  html.ns-dark .ns-header-actions .ns-act-account .ns-act{ background:#16191B; color:#ECEFEC; border-color:rgba(255,255,255,.14); }

  /* Icon-only: hide the "Your cart / My account" text labels on mobile. */
  .ns-header-actions .ns-act-cart .ns-act-tx,
  .ns-header-actions .ns-act-account .ns-act-tx{ display:none !important; }
  .ns-header-actions .ns-act-account{ display:inline-flex !important; align-items:center; }
  .ns-header-actions .ns-act-cart .ns-cart-link,
  .ns-header-actions .ns-act-account{ gap:0; }

  /* Revealed search drops below the header bar full-width. */
  .ns-header.ns-search-open .ns-search{ display:flex; position:absolute; left:0; right:0; top:100%; margin-top:10px; padding:10px 14px; background:var(--white); border:1px solid var(--line); border-radius:14px; box-shadow:0 18px 40px -22px rgba(0,0,0,.4); z-index:60; }
  html.ns-dark .ns-header.ns-search-open .ns-search{ background:#101517; border-color:rgba(255,255,255,.12); }
  .ns-header.ns-search-open .ns-search-toggle{ border-color:var(--green); color:var(--green); }

  .ns-logo-1{ font-size:17px; }
  .ns-logo-2{ font-size:9px; letter-spacing:3px; }
}
@media (max-width:480px){
  .ns-header-actions{ gap:6px; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:38px; height:38px; }
  .ns-logo-mark{ width:36px; height:36px; }
}

/* ============================================================
   v13 — Authoritative mobile header (wins over all earlier blocks)
   ============================================================ */
@media (max-width:900px){
  /* Tighten the side gaps so icons have room to breathe. */
  .ns-header .ns-container{ padding-left:12px !important; padding-right:12px !important; }
  .ns-header .ns-header-in{ display:flex !important; flex-wrap:nowrap !important; align-items:center; gap:9px !important; padding-left:0 !important; padding-right:0 !important; min-width:0; }

  /* Burger left, logo flexible, actions pinned right. */
  .ns-burger{ order:-1; flex:none; }
  .ns-logo{ flex:0 1 auto; min-width:0; }
  .ns-logo-tx{ min-width:0; overflow:hidden; }
  .ns-header-actions{ display:flex !important; flex-wrap:nowrap !important; align-items:center; gap:7px !important; margin-left:auto !important; flex:none; }

  /* Search BAR removed on phones; only the icon remains. */
  .ns-header .ns-search{ display:none !important; }
  .ns-search-toggle{ display:inline-grid !important; place-items:center; flex:none; }
  .ns-header.ns-search-open .ns-search{
    display:flex !important; position:absolute; left:0; right:0; top:100%;
    width:auto !important; max-width:none !important; flex:none !important; order:0;
    margin:10px 0 0 !important; padding:10px 12px; background:var(--white);
    border:1px solid var(--line); border-radius:14px; box-shadow:0 18px 40px -22px rgba(0,0,0,.4); z-index:60;
  }

  /* Uniform, compact circular icons. */
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:40px !important; height:40px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:19px; height:19px; }
}

@media (max-width:560px){
  .ns-header .ns-container{ padding-left:10px !important; padding-right:10px !important; }
  .ns-header .ns-header-in{ gap:7px !important; }
  .ns-header-actions{ gap:5px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:36px !important; height:36px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:18px; height:18px; }
  .ns-burger{ width:38px; height:38px; }
  .ns-logo-1{ font-size:15px !important; }
  .ns-logo-2{ font-size:8px !important; letter-spacing:2.5px !important; }
}

@media (max-width:380px){
  .ns-header .ns-container{ padding-left:8px !important; padding-right:8px !important; }
  .ns-header-actions{ gap:4px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:33px !important; height:33px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:16px; height:16px; }
  .ns-burger{ width:34px; height:34px; }
  .ns-logo-mark{ width:32px !important; height:32px !important; }
  .ns-logo-tx{ display:flex !important; }      /* keep the brand, override legacy hide */
  .ns-logo-1{ font-size:14px !important; letter-spacing:.3px !important; }
  .ns-logo-2{ display:none !important; }        /* drop "DECOR" subline on very small phones */
  .ns-badge{ min-width:15px; height:15px; font-size:9px; line-height:15px; top:-4px; right:-4px; }
}

/* ============================================================
   v14 — Mobile header fit: no overflow, tidy spacing
   ============================================================ */
@media (max-width:900px){
  .ns-header,
  .ns-header .ns-container,
  .ns-header .ns-header-in,
  .ns-header-actions{ box-sizing:border-box; }

  /* Left padding tight; a touch more on the right so the account icon
     keeps a clean margin from the edge. */
  .ns-header .ns-container{ padding-left:12px !important; padding-right:14px !important; }
  .ns-header .ns-header-in{ display:flex !important; flex-wrap:nowrap !important; align-items:center; gap:8px !important; min-width:0; padding-left:0 !important; padding-right:0 !important; }

  /* Brand may shrink/truncate so the icons always fit on one row. */
  .ns-logo{ flex:0 1 auto !important; min-width:0 !important; overflow:hidden; margin-right:6px; }
  .ns-logo-tx{ min-width:0; overflow:hidden; }
  .ns-logo-1{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:44vw; }

  /* Icons sit together on the right, tight gap, never overflowing. */
  .ns-header-actions{ flex:0 0 auto !important; margin-left:auto !important; gap:6px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:38px !important; height:38px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:18px; height:18px; }
}

@media (max-width:560px){
  .ns-header .ns-container{ padding-left:10px !important; padding-right:12px !important; }
  .ns-header .ns-header-in{ gap:6px !important; }
  .ns-header-actions{ gap:5px !important; }
  .ns-logo-1{ max-width:40vw; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:35px !important; height:35px !important; }
}

@media (max-width:400px){
  .ns-header .ns-container{ padding-left:9px !important; padding-right:11px !important; }
  .ns-header-actions{ gap:4px !important; }
  .ns-logo-2{ display:none !important; }   /* keep HOMENIQUE, drop subline */
  .ns-logo-1{ font-size:14px !important; max-width:34vw; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:32px !important; height:32px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:16px; height:16px; }
  .ns-burger{ width:34px; height:34px; }
}

/* ============================================================
   v15 — Mobile header stretches to the edges, full brand, no squeeze
   ============================================================ */
@media (max-width:900px){
  /* Stretch the card to the edges with only a small visible border. */
  .ns-header{ width:96% !important; margin-left:auto !important; margin-right:auto !important; }
  .ns-header .ns-container{ padding-left:12px !important; padding-right:14px !important; }
  .ns-header .ns-header-in{ gap:10px !important; padding-top:11px !important; padding-bottom:11px !important; }

  /* Show the brand in full — no truncation. */
  .ns-logo{ overflow:visible !important; flex:0 1 auto !important; min-width:0 !important; }
  .ns-logo-tx{ overflow:visible !important; }
  .ns-logo-1{ max-width:none !important; overflow:visible !important; text-overflow:clip !important; white-space:nowrap; font-size:18px !important; }
  .ns-logo-2{ display:flex !important; font-size:9px !important; letter-spacing:3px !important; }

  /* Comfortable, non-squeezed icons. */
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:38px !important; height:38px !important; }
  .ns-header-actions{ gap:7px !important; }
}

@media (max-width:560px){
  .ns-header{ width:97% !important; }
  .ns-header .ns-container{ padding-left:10px !important; padding-right:12px !important; }
  .ns-logo-1{ font-size:17px !important; }
  .ns-header-actions{ gap:6px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:36px !important; height:36px !important; }
}

@media (max-width:400px){
  .ns-header{ width:98% !important; }
  .ns-header .ns-container{ padding-left:9px !important; padding-right:11px !important; }
  .ns-logo-2{ display:flex !important; }   /* keep "DECOR" — the two lines don't add width */
  .ns-logo-1{ font-size:16px !important; }
  .ns-header-actions{ gap:5px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:34px !important; height:34px !important; }
  .ns-burger{ width:36px; height:36px; }
}

/* Sticky state also stretches edge-to-edge (flush), already full width. */
@media (max-width:900px){
  body.ns-headfixed .ns-header.ns-sticky{ width:100% !important; }
}

/* ============================================================
   v16 — Mobile header: left group + right group, smaller, spaced
   ============================================================ */
@media (max-width:900px){
  .ns-header .ns-header-in{ display:flex !important; align-items:center; flex-wrap:nowrap !important; gap:8px !important; }

  /* LEFT group: burger + logo + brand, kept together; the auto margin after
     the logo pushes the icons to the far right, creating a real centre gap. */
  .ns-burger{ order:-1; flex:none; width:34px !important; height:34px !important; }
  .ns-burger span{ width:17px; }
  .ns-logo{ flex:0 1 auto !important; min-width:0; margin-right:auto !important; }
  .ns-logo-mark{ width:30px !important; height:30px !important; border-radius:9px; }
  .ns-logo-1{ font-size:15px !important; letter-spacing:.4px !important; }
  .ns-logo-2{ display:flex !important; font-size:8px !important; letter-spacing:2.5px !important; margin-top:2px !important; }

  /* RIGHT group: icons, smaller and on the far right. */
  .ns-header-actions{ flex:none !important; margin-left:0 !important; gap:8px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:34px !important; height:34px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:17px !important; height:17px !important; }
}

@media (max-width:480px){
  .ns-burger{ width:32px !important; height:32px !important; }
  .ns-burger span{ width:16px; }
  .ns-logo-mark{ width:28px !important; height:28px !important; }
  .ns-logo-1{ font-size:14px !important; }
  .ns-header-actions{ gap:7px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:32px !important; height:32px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:16px !important; height:16px !important; }
}

@media (max-width:380px){
  .ns-burger{ width:30px !important; height:30px !important; }
  .ns-logo-mark{ width:26px !important; height:26px !important; }
  .ns-logo-1{ font-size:13px !important; }
  .ns-logo-2{ font-size:7.5px !important; letter-spacing:2px !important; }
  .ns-header-actions{ gap:6px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:30px !important; height:30px !important; }
}

/* ============================================================
   v17 — Mobile header: tiny edge padding, slightly bigger elements
   ============================================================ */
@media (max-width:900px){
  /* Very small space between burger/account and the header edge. */
  .ns-header .ns-container{ padding-left:8px !important; padding-right:8px !important; }
  .ns-header .ns-header-in{ gap:9px !important; }

  /* A bit bigger again. */
  .ns-burger{ width:40px !important; height:40px !important; }
  .ns-burger span{ width:19px; }
  .ns-logo-mark{ width:34px !important; height:34px !important; }
  .ns-logo-1{ font-size:17px !important; letter-spacing:.5px !important; }
  .ns-logo-2{ display:flex !important; font-size:9px !important; letter-spacing:3px !important; }

  .ns-header-actions{ gap:9px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:40px !important; height:40px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:20px !important; height:20px !important; }
}

@media (max-width:480px){
  .ns-header .ns-container{ padding-left:7px !important; padding-right:7px !important; }
  .ns-header .ns-header-in{ gap:7px !important; }
  .ns-burger{ width:37px !important; height:37px !important; }
  .ns-logo-mark{ width:31px !important; height:31px !important; }
  .ns-logo-1{ font-size:16px !important; }
  .ns-header-actions{ gap:7px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:37px !important; height:37px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:19px !important; height:19px !important; }
}

@media (max-width:380px){
  .ns-header .ns-container{ padding-left:6px !important; padding-right:6px !important; }
  .ns-header .ns-header-in{ gap:6px !important; }
  .ns-burger{ width:34px !important; height:34px !important; }
  .ns-logo-mark{ width:29px !important; height:29px !important; }
  .ns-logo-1{ font-size:15px !important; }
  .ns-logo-2{ font-size:8px !important; letter-spacing:2px !important; }
  .ns-header-actions{ gap:6px !important; }
  .ns-search-toggle,
  .ns-header-actions .ns-act-cart .ns-act,
  .ns-header-actions .ns-act-account .ns-act{ width:34px !important; height:34px !important; }
  .ns-search-toggle svg,
  .ns-header-actions .ns-act svg{ width:17px !important; height:17px !important; }
}

/* ============================================================
   v18 — Mobile: move currency into drawer, drop top-bar links
   ============================================================ */
@media (max-width:900px){
  .ns-topbar-currency,
  .ns-topbar-account{ display:none !important; }
}
/* Currency control inside the drawer */
.ns-drawer-currency{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 18px; border-top:1px solid var(--line); }
.ns-drawer-currency-l{ font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--graphite); }
.ns-drawer-currency .ns-currency{
  appearance:auto; min-width:120px; height:42px; padding:0 12px;
  border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink);
  font:inherit; font-weight:600; cursor:pointer;
}
html.ns-dark .ns-drawer-currency{ border-top-color:rgba(255,255,255,.12); }
html.ns-dark .ns-drawer-currency .ns-currency{ background:#16191B; color:#ECEFEC; border-color:rgba(255,255,255,.14); }
