:root{
  --bg:#0E0E0E;
  --bg-2:#1A1A1A;
  --line:#262626;
  --text:#E8E8E8;
  --muted:#BEBEBE;
  --gold:#D4AF37;
  --gold-2:#E2C760;
  --copper:#C49B63;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans";
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:"Playfair Display", Georgia, serif; margin:0 0 .6rem}
h1{font-size:clamp(34px,6vw,60px)}
h2{font-size:clamp(22px,3vw,32px)}
h3{font-size:clamp(18px,2.4vw,26px)}
a{color:var(--text); text-decoration:none}
a:hover,.link:hover{color:var(--gold)}

.container{width:min(1180px,92%); margin-inline:auto}

.site-header{position:sticky; top:0; z-index:50; background:rgba(23,23,23,.72); backdrop-filter:saturate(140%) blur(6px); border-bottom:1px solid var(--line)}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0}
.brand .custom-logo{max-height:42px; height:auto; width:auto}
.brand-text{font-weight:700; letter-spacing:.04em}
.primary-nav .menu, .menu-footer{list-style:none; padding:0; margin:0; display:flex; gap:22px}
.primary-nav .menu a{color:#d8d8d8; font-weight:500; letter-spacing:.02em; padding:6px 2px; border-bottom:2px solid transparent}
.primary-nav .menu a:hover{color:var(--gold); border-bottom-color:var(--gold)}

.header-actions{display:flex; align-items:center; gap:16px}
.cart-link{display:inline-flex; align-items:center; gap:6px; position:relative}
.cart-icon{font-size:18px}
.cart-count{background:var(--gold); color:#111; font-weight:800; border-radius:999px; padding:2px 8px; font-size:12px; box-shadow:0 4px 12px rgba(212,175,55,.25)}
.menu-toggle{display:none; background:transparent; border:1px solid #3a3a3a; color:#ddd; padding:6px 10px; border-radius:8px}

.mobile-menu{background:#111; border-top:1px solid var(--line); padding:10px 0; transition:max-height .25s ease; overflow:hidden}
.menu-mobile{list-style:none; margin:0; padding:10px 16px; display:flex; flex-direction:column; gap:10px}
.menu-mobile a{padding:12px 10px; border-radius:10px; background:#1b1b1b}
.menu-mobile a:hover{background:#222; color:var(--gold); transform:translateX(2px)}

/* Hero with gold lines + grain */
.hero{position:relative; border-bottom:1px solid #1f1f1f; background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,0))}
.hero:before{content:""; position:absolute; inset:0; background-image:url('../patterns/gold-lines.svg'); opacity:.28; pointer-events:none}
.hero:after{content:""; position:absolute; inset:0; background:url('../patterns/grain.svg'); opacity:.18; pointer-events:none}
.hero-inner{padding:88px 0 72px}
.hero-title{font-size:clamp(38px,7vw,72px)}
.hero-sub{color:#cfcfcf; max-width:720px; margin:12px 0 26px}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:12px 22px; border-radius:12px; font-weight:700; letter-spacing:.02em; transition:transform .22s ease, filter .22s ease, box-shadow .22s ease}
.btn-primary{background:linear-gradient(135deg, var(--gold), var(--gold-2)); color:#111; box-shadow:0 8px 22px rgba(212,175,55,.20)}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 14px 34px rgba(212,175,55,.28)}
.btn-ghost{border:1px solid var(--gold); color:var(--gold); background:transparent}
.btn-ghost:hover{background:#181818; box-shadow:0 6px 18px rgba(212,175,55,.16)}

.section-head{display:flex; align-items:baseline; justify-content:space-between; padding:26px 0 12px}
.link{color:#cfcfcf}
.link::after{content:"→"; margin-left:8px; opacity:.7}

.grid-products{display:grid; gap:16px}
.grid-products .products{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:16px; list-style:none; padding:0; margin:0}

/* Product cards */
.products .product{background:var(--bg-2); border:1px solid var(--line); border-radius:16px; overflow:hidden; transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease}
.products .product a img{width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; display:block; background:#111}
.products .product:hover{transform:translateY(-3px); box-shadow:0 14px 32px rgba(0,0,0,.35); border-color:#3A3A3A}
.products .woocommerce-loop-product__title{font-size:15.5px; line-height:1.5; padding:0 14px; margin:10px 0 6px; min-height:48px; font-weight:600; letter-spacing:.01em}
.products .price{padding:0 14px 14px; color:var(--gold); font-weight:700; letter-spacing:.01em}
.products .button{margin:0 14px 16px; display:inline-flex; background:linear-gradient(135deg, var(--gold), var(--gold-2)); color:#111; padding:10px 14px; border-radius:10px; box-shadow:0 6px 18px rgba(212,175,55,.14)}
.products .button:hover{filter:brightness(1.03); transform:translateY(-1px)}
.products .onsale{position:absolute; top:10px; left:10px; background:linear-gradient(135deg, var(--gold), var(--gold-2)); color:#111; font-weight:800; padding:6px 10px; border-radius:999px; font-size:12px}

.shop-hero{padding:28px 0 10px}
.shop-title{font-weight:700; letter-spacing:.02em}

.site-footer{margin-top:56px; border-top:1px solid #1b1b1b; background:#0C0C0C}
.footer-inner{padding:34px 0}
.footer-cols{display:grid; grid-template-columns:1.2fr .8fr; gap:20px; align-items:start}
.footer-brand{font-family:"Playfair Display", serif; font-size:22px; color:var(--gold); letter-spacing:.03em}
.muted{color:#b0b0b0; font-size:14px}

.entry{padding:20px 0; border-bottom:1px solid #2b2b2b}
.entry-title a:hover{color:var(--gold)}

input, select, textarea{accent-color:var(--gold)}
:focus-visible{outline:2px solid rgba(226,199,96,.55); outline-offset:2px}

@media (max-width:920px){
  .primary-nav{display:none}
  .menu-toggle{display:inline-flex}
  .footer-cols{grid-template-columns:1fr}
}


/* Offcanvas filters */
.filters-trigger{display:none}
@media (max-width:920px){
  .filters-trigger{display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); padding:8px 12px; border-radius:10px; background:#151515}
}
#filters-overlay[hidden], #filters-panel[hidden]{display:none}
#filters-overlay{position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:80}
#filters-panel{position:fixed; top:0; right:0; width:min(92%, 360px); height:100vh; background:#111; border-left:1px solid var(--line); z-index:90; padding:16px; overflow:auto; box-shadow:-12px 0 32px rgba(0,0,0,.4)}
#filters-close{display:inline-flex; border:1px solid var(--line); padding:6px 10px; border-radius:8px; background:#151515}

/* Sticky purchase panel on single product */
.single-product .summary{position:sticky; top:84px}

/* Micro-animations */
.fade-in{animation:fade .4s ease both}
@keyframes fade{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}


/* v3.0.0 layout polish */
.container{width:min(1180px,92%);margin-inline:auto}
h1,h2,h3{letter-spacing:.01em}
.section-head{display:flex;align-items:baseline;justify-content:space-between;padding:24px 0 12px}
.hero-title{margin-bottom:.3rem}
.hero-sub{opacity:.92}
.hero-mission{color:#d8d8d8;margin:.2rem 0 1rem}
@media (max-width: 720px){
  .section-head{flex-direction:column;gap:6px;align-items:flex-start}
}
