/* Memory Store, second look: bright page, black outlines, yellow price tags.
   Yellow is for price tags alone; everything you click uses --act, the ink colour.
   Every colour is a token so the light and dark modes and the Winhance page
   (which swaps the tokens in winhance.css) share these rules. */
:root{
  --page:#f3f3ef; --panel:#ffffff; --ink:#111112; --ink-2:#4b4b4f; --ink-3:#78787d; --line:#d8d8d2;
  --edge:#111112; --tag:#ffd400; --tag-ink:#111112; --act:var(--ink); --act-ink:var(--page); --act-hover:color-mix(in srgb,var(--ink) 80%,var(--page)); --field:#ffffff; --good:#0a7a45; --bad:#b3261e;
  --wrap:1280px; --edge-w:2px; --r:18px;
  --display:"Archivo",system-ui,sans-serif; --sans:"Overpass",system-ui,sans-serif;
  color-scheme:light;
}
[data-theme="dark"]{
  --page:#0e0e0f; --panel:#18181b; --ink:#f6f6f5; --ink-2:#b9b9bd; --ink-3:#85858b; --line:#2a2a2f;
  --edge:#f6f6f5; --field:#141416; --good:#55d694; --bad:#ff8a80;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{background:var(--page);color:var(--ink);font:400 17px/1.55 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img{max-width:100%}
:focus-visible{outline:3px solid var(--act);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(18px,4vw,40px)}
h1,h2,h3,h4{font-family:var(--display);font-weight:800;font-stretch:118%;letter-spacing:-.02em;line-height:1.05}

/* header */
.site-header{position:sticky;top:0;z-index:40;background:var(--page);border-bottom:var(--edge-w) solid var(--edge)}
.site-header .nav{display:flex;align-items:center;justify-content:space-between;gap:28px;height:62px;font-size:15.5px;font-weight:600}
.nav-left,.nav-right,.menu{display:flex;align-items:center}
.nav-left{gap:30px}.menu{gap:26px}.nav-right{gap:8px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:900;font-stretch:122%;font-size:19px;letter-spacing:-.01em}
.brand-logo{width:36px;height:36px;display:block;flex:none}
.menu a:hover,.nav-drop-btn:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
.nav-drop{position:relative}
.nav-drop-btn{display:flex;align-items:center;gap:6px;border:0;background:none;font-weight:600}
.nav-drop-btn svg{width:14px;height:14px}
.nav-drop-menu{display:none;position:absolute;left:-14px;top:calc(100% + 14px);min-width:250px;padding:8px;background:var(--panel);border:var(--edge-w) solid var(--edge);border-radius:12px}
.nav-drop.open .nav-drop-menu{display:block}
.nav-drop-menu a{display:block;padding:10px 12px;border-radius:7px}
.nav-drop-menu a:hover{background:var(--act);color:var(--act-ink);text-decoration:none}
.nav-ic{position:relative;width:40px;height:40px;display:grid;place-items:center;border:var(--edge-w) solid transparent;border-radius:9px;background:none}
.nav-ic:hover,.nav-ic.mode{border-color:var(--edge);background:var(--panel)}
.nav-ic svg{width:19px;height:19px;stroke:var(--ink);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mode .moon,[data-theme="dark"] .mode .sun{display:none}
[data-theme="dark"] .mode .moon{display:block}
.cart-count{position:absolute;right:-5px;top:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--act);color:var(--act-ink);font-size:12px;font-weight:700;line-height:19px;text-align:center}
.cart-count.is-empty{display:none}
.search-bar{border-top:1px solid var(--line);background:var(--panel)}
.search-bar form{display:flex;align-items:center;gap:12px;height:58px}
.search-bar svg{width:19px;height:19px;stroke:var(--ink-3);fill:none;stroke-width:2;flex:none}
.search-bar input[type=search]{flex:1;border:0;background:none;outline:none;font-size:17px}

/* buttons and the price tag */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:10px;font-family:var(--display);font-weight:800;font-stretch:110%;background:var(--ink);color:var(--page);border:var(--edge-w) solid var(--ink);text-align:center}
.btn:hover{background:var(--act-hover);color:var(--act-ink)}
.btn.line{background:none;color:var(--ink)}
.btn.line:hover{background:var(--act);color:var(--act-ink)}
.tag{display:inline-flex;align-items:center;gap:10px;padding:10px 18px 10px 14px;background:var(--tag);color:var(--tag-ink);font-family:var(--display);font-weight:900;font-stretch:112%;font-size:26px;letter-spacing:-.02em;border-radius:6px;box-shadow:0 10px 18px -10px rgba(0,0,0,.55)}
.tag::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--page);box-shadow:inset 0 1px 2px rgba(0,0,0,.35)}
.tag small{font-family:var(--sans);font-weight:600;font-size:13.5px;letter-spacing:0}

/* names the shared page templates (index.php, 404.php) still use */
:root{--muted:var(--ink-2);--faint:var(--ink-3);--txt:var(--ink);--gold:var(--ink)}
.disp{font-family:var(--display);font-weight:900;font-stretch:125%;letter-spacing:-.03em;line-height:1}
.lead{color:var(--ink-2);font-size:18.5px;margin-top:14px}
body>section{padding:48px 0 0}
.wrap[style] article a:not(.wc-block-components-button):not(.button):not(.btn){text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px;text-decoration-color:color-mix(in srgb,var(--ink) 35%,transparent)}
.wrap[style] article h2{font-size:26px;margin:32px 0 12px;color:var(--ink)}
.wrap[style] article h3{font-size:20px;margin:26px 0 10px;color:var(--ink)}
.wrap[style] article p,.wrap[style] article li{margin-bottom:14px}
.wrap[style] article ul,.wrap[style] article ol{padding-left:22px}
.btn-gold{background:var(--ink);color:var(--page)}
.btn-ghost{background:none;color:var(--ink);margin-left:8px}
.hero h1.disp{font-size:clamp(42px,6vw,90px)}

/* plain pages: policies, about, contact, search results */
.page-main{padding:56px 0 20px}
.page-main .wrap{max-width:860px}
.page-main h1{font-size:clamp(34px,4.6vw,58px);font-weight:900;margin-bottom:26px}
.page-main h2{font-size:26px;margin:36px 0 12px}
.page-main h3{font-size:20px;margin:28px 0 10px}
.page-main p,.page-main li{color:var(--ink-2);margin-bottom:14px}
.page-main ul,.page-main ol{padding-left:22px}
.page-main a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px;text-decoration-color:color-mix(in srgb,var(--ink) 35%,transparent)}

/* footer */
.site-footer{margin-top:110px;border-top:var(--edge-w) solid var(--edge);padding:34px 0 56px;font-size:15px}
.foot-links{display:flex;flex-wrap:wrap;gap:8px 26px;font-weight:600;margin-bottom:14px}
.foot-links a:hover{text-decoration:underline;text-underline-offset:4px}
.foot-links-eco{font-weight:400;color:var(--ink-2)}
.foot-line,.foot-identity{color:var(--ink-3);margin-top:8px}
.foot-identity a{text-decoration:underline;text-underline-offset:3px}
.foot-line .sep,.foot-identity .sep{margin-right:.3em}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
@media (max-width:760px){
  .brand span{display:none}.nav-left{gap:16px}.menu{gap:16px}.site-header .nav{gap:10px}
}