:root{
  --ink:#1a1814;
  --bone:#f7f4ee;
  --storefront-bg:#fffdf5;
  --champagne:#c8a96a;
  --champagne-dim:#a98c52;
  --stone:#8c857a;
  --line:#e3ddd2;
  --white:#ffffff;
  --shadow:0 24px 60px -28px rgba(26,24,20,.28);
  --serif:'Fraunces',Georgia,serif;
  --sans:'Outfit',system-ui,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--storefront-bg);line-height:1.6;font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--serif);font-weight:300;line-height:1.08;letter-spacing:-.01em}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:100%;object-fit:cover}
.eyebrow{font-family:var(--sans);font-size:.72rem;font-weight:400;letter-spacing:.28em;text-transform:uppercase;color:var(--champagne-dim)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;font-family:var(--sans);font-size:.8rem;font-weight:400;letter-spacing:.16em;text-transform:uppercase;padding:1.05em 2.4em;border:1px solid var(--ink);background:var(--ink);color:var(--bone);transition:all .5s var(--ease);cursor:pointer}
.btn:hover{background:transparent;color:var(--ink)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:var(--bone)}
.btn--light{border-color:var(--bone);background:var(--bone);color:var(--ink)}
.btn--light:hover{background:transparent;color:var(--bone)}

.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* announcement + header (identical to homepage) */
.announce{background:var(--ink);color:var(--bone);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;text-align:center;padding:.7em 32px}
.announce span{opacity:.85}
.header{position:sticky;top:0;z-index:50;background:rgba(255,253,245,.82);backdrop-filter:blur(14px);transition:border-color .4s,background .4s}
.nav{display:flex;align-items:center;justify-content:space-between;height:84px}
.logo{font-family:var(--serif);font-size:1.5rem;letter-spacing:.04em}
.logo b{font-weight:500}
.nav-links{display:flex;gap:2.4rem;list-style:none}
.nav-links a{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;position:relative;padding:.3em 0}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--champagne);transition:width .4s var(--ease)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-icons{display:flex;gap:1.5rem;align-items:center}
.nav-icons svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:1.3;cursor:pointer;transition:stroke .3s}
.nav-icons svg:hover{stroke:var(--champagne-dim)}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer}
.burger span{width:24px;height:1.5px;background:var(--ink)}

/* page header */
.page-head{padding:clamp(3rem,7vw,5.5rem) 0 clamp(2.5rem,5vw,3.5rem);text-align:center;border-bottom:1px solid var(--line)}
.crumbs{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);margin-bottom:1.6rem}
.crumbs a{color:var(--stone);transition:color .3s}
.crumbs a:hover{color:var(--champagne-dim)}
.crumbs span{color:var(--ink);margin:0 .6em;opacity:.4}
.page-head h1{font-size:clamp(2.6rem,5.4vw,4.2rem);margin-bottom:1rem}
.page-head h1 em{font-style:italic;color:var(--champagne-dim)}
.page-head p{color:var(--stone);font-size:1.04rem;max-width:440px;margin:0 auto}

/* shop layout */
.shop{padding:clamp(2.5rem,5vw,3.5rem) 0 clamp(4rem,8vw,6rem)}
.shop-wrap{max-width:100%;padding-inline:var(--page-gutter,clamp(20px,4vw,72px))}
.shop .wrap.shop-wrap{padding-inline:var(--page-gutter,clamp(20px,4vw,72px))}
.shop-grid{display:grid;grid-template-columns:248px 1fr;gap:clamp(2rem,4vw,3.5rem);align-items:start}

/* sidebar filters */
.filters{position:sticky;top:108px}
.filter-block{padding-bottom:2rem;margin-bottom:2rem;border-bottom:1px solid var(--line)}
.filter-block:last-child{border-bottom:none}
.filter-block h4{font-family:var(--sans);font-size:.74rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--champagne-dim);margin-bottom:1.3rem}
.filter-list{list-style:none}
.filter-list li{margin-bottom:.95rem}
.filter-list button,.filter-list a{background:none;border:none;font-family:var(--sans);font-size:.96rem;font-weight:300;color:var(--ink);cursor:pointer;padding:0;display:flex;justify-content:space-between;width:100%;align-items:center;transition:color .3s;letter-spacing:.01em}
.filter-list button:hover,.filter-list a:hover{color:var(--champagne-dim)}
.filter-list button.active,.filter-list a.active{color:var(--champagne-dim);font-weight:400}
.filter-list .count{font-size:.78rem;color:var(--stone)}
.price-range{font-size:.9rem;color:var(--stone);display:flex;justify-content:space-between;margin-top:.4rem}
.range-input{width:100%;margin-top:1rem;accent-color:var(--champagne-dim)}

/* toolbar */
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.4rem;flex-wrap:wrap;gap:1rem}
.result-count{font-size:.86rem;color:var(--stone);letter-spacing:.04em}
.result-count b{color:var(--ink);font-weight:400}
.toolbar-right{display:flex;align-items:center;gap:1.4rem}
.filter-toggle{display:none;align-items:center;gap:.6em;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--line);background:transparent;padding:.85em 1.4em;cursor:pointer}
.filter-toggle svg{width:16px;height:16px;stroke:var(--ink);fill:none;stroke-width:1.4}
.sort{position:relative}
.sort-label{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);cursor:pointer;display:flex;align-items:center;gap:.6em;border:1px solid var(--line);padding:.85em 1.4em;background:transparent;transition:border-color .3s}
.sort-label:hover{border-color:var(--ink)}
.sort-label svg{width:13px;height:13px;stroke:var(--ink);fill:none;stroke-width:1.5;transition:transform .3s}
.sort.open .sort-label svg{transform:rotate(180deg)}
.sort-menu{position:absolute;top:calc(100% + 8px);right:0;background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow);min-width:220px;padding:.6rem 0;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.35s var(--ease);z-index:20}
.sort.open .sort-menu{opacity:1;visibility:visible;transform:none}
.sort-menu button{display:block;width:100%;text-align:left;background:none;border:none;font-family:var(--sans);font-size:.9rem;font-weight:300;color:var(--ink);padding:.7em 1.4em;cursor:pointer;transition:background .25s,color .25s}
.sort-menu button:hover{background:var(--bone);color:var(--champagne-dim)}
.sort-menu button.active{color:var(--champagne-dim)}

/* active chips */
.chips{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1.8rem;min-height:1px}
.chip{display:inline-flex;align-items:center;gap:.6em;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;background:var(--white);border:1px solid var(--line);padding:.5em 1em;color:var(--ink)}
.chip button{background:none;border:none;cursor:pointer;display:grid;place-items:center;color:var(--stone);transition:color .3s}
.chip button:hover{color:var(--ink)}
.chip svg{width:11px;height:11px;stroke:currentColor;stroke-width:1.8}
.chip-clear{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--champagne-dim);background:none;border:none;cursor:pointer;align-self:center;border-bottom:1px solid transparent;transition:border-color .3s}
.chip-clear:hover{border-color:var(--champagne)}

/* product grid */
.products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.25rem,2vw,2rem);column-gap:clamp(.74rem,1vw,1.1rem);align-items:start}
.shop .products>.product{height:auto;align-self:start}

/* load more */
.load-zone{text-align:center;margin-top:clamp(3rem,6vw,4.5rem)}
.load-progress{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--stone);margin-bottom:1rem}
.load-bar{width:160px;height:2px;background:var(--line);margin:0 auto 2rem;position:relative;overflow:hidden}
.load-bar i{position:absolute;left:0;top:0;height:100%;background:var(--champagne);transition:width .6s var(--ease)}

/* trust strip (identical styling to homepage trust bar) */
.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--white)}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.trust-item{padding:2.2rem 1.5rem;text-align:center;border-right:1px solid var(--line)}
.trust-item:last-child{border-right:none}
.trust-item svg{width:26px;height:26px;stroke:var(--champagne-dim);fill:none;stroke-width:1.2;margin:0 auto .8rem}
.trust-item h4{font-family:var(--sans);font-size:.8rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.3rem}
.trust-item p{font-size:.82rem;color:var(--stone)}

/* footer (identical to homepage) */
.footer{background:var(--ink);color:var(--bone);padding:5rem 0 2.5rem}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.5rem;padding-bottom:4rem;border-bottom:1px solid rgba(247,244,238,.12)}
.foot-brand .logo{color:var(--bone);margin-bottom:1.2rem;display:inline-block}
.foot-brand p{color:rgba(247,244,238,.6);font-size:.9rem;max-width:30ch;margin-bottom:1.6rem}
.foot-social{display:flex;gap:1rem}
.foot-social a{width:38px;height:38px;border:1px solid rgba(247,244,238,.25);border-radius:50%;display:grid;place-items:center;transition:.4s}
.foot-social a:hover{background:var(--bone);border-color:var(--bone)}
.foot-social svg{width:17px;height:17px;stroke:var(--bone);fill:none;stroke-width:1.4;transition:.4s}
.foot-social a:hover svg{stroke:var(--ink)}
.foot-col h4{font-family:var(--sans);font-size:.76rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--champagne);margin-bottom:1.4rem}
.foot-col ul{list-style:none}
.foot-col li{margin-bottom:.8rem}
.foot-col a{font-size:.9rem;color:rgba(247,244,238,.7);transition:color .3s}
.foot-col a:hover{color:var(--bone)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:2rem;flex-wrap:wrap;gap:1rem}
.foot-bottom p{font-size:.78rem;color:rgba(247,244,238,.45);letter-spacing:.04em}
.foot-bottom .pay{display:flex;gap:1rem;font-size:.78rem;color:rgba(247,244,238,.45);letter-spacing:.1em}

/* filter drawer scrim */
.scrim{position:fixed;inset:0;background:rgba(26,24,20,.4);opacity:0;visibility:hidden;transition:.4s;z-index:60}
.scrim.open{opacity:1;visibility:visible}

/* responsive */
@media(max-width:1024px){
  .products{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .nav-links{display:none}
  .burger{display:flex}
  .shop-grid{grid-template-columns:1fr}
  .filter-toggle{display:inline-flex}
  .filters{position:fixed;top:0;left:0;bottom:0;width:min(86vw,340px);background:var(--bone);z-index:70;padding:2rem 1.6rem;overflow-y:auto;transform:translateX(-100%);transition:transform .45s var(--ease);box-shadow:18px 0 42px -32px rgba(26,24,20,.45)}
  .filters.open{transform:none}
  .filters-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}
  .filters-head h3{font-size:1.4rem}
  .filters-close{background:none;border:none;cursor:pointer;width:34px;height:34px;display:grid;place-items:center}
  .filters-close svg{width:18px;height:18px;stroke:var(--ink);stroke-width:1.5}
  .trust-grid{grid-template-columns:repeat(2,1fr)}
  .trust-item:nth-child(2){border-right:none}
  .trust-item:nth-child(1),.trust-item:nth-child(2){border-bottom:1px solid var(--line)}
}
.filters-head{display:none}
@media(max-width:900px){.filters-head{display:flex}}
@media(max-width:560px){
  .products{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem .8rem}
  .foot-grid{grid-template-columns:1fr;gap:2.5rem}
  .foot-brand{grid-column:span 1}
}

/* refined shared storefront header */
.header .search{display:none!important}
.nav{display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(150px,1fr);align-items:center;gap:1.75rem}
.nav .logo{justify-self:start}
.nav-menu{display:flex;align-items:center;justify-content:center;gap:2.1rem;margin:0}
.nav-menu a{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);transition:color .2s ease;position:relative;padding:.55em 0 .7em;line-height:1}
.nav-menu a::after{content:"";position:absolute;left:0;right:0;bottom:.25em;height:1px;background:var(--champagne);transform:scaleX(0);transform-origin:center;transition:transform .2s ease,height .2s ease}
.nav-menu a:hover,.nav-menu a.active{color:var(--champagne-dim)}
.nav-menu a:hover::after,.nav-menu a.active::after{transform:scaleX(1)}
.nav-menu a.active::after{height:2px}
.nav-icons{justify-content:flex-end;gap:1.15rem}
.nav-icons button,.nav-icons a{background:none;border:none;cursor:pointer;position:relative;display:grid;place-items:center;width:24px;height:24px;padding:0}
@media(max-width:900px){
  .nav{position:relative;grid-template-columns:auto 1fr auto;gap:1rem}
  .nav-menu{position:absolute;left:0;right:0;top:100%;display:grid;gap:0;margin:0;background:rgba(255,253,245,.98);border:1px solid var(--line);box-shadow:var(--shadow-sm);padding:.65rem 0;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.3s var(--ease);z-index:60}
  .nav-menu.open{opacity:1;visibility:visible;transform:none}
  .nav-menu a{display:block;padding:.9rem 1rem}
  .nav-menu a::after{display:none}
}

/* Shared storefront chrome normalization */
.nav{display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(150px,1fr);align-items:center;height:72px;gap:1.75rem}
.header .logo{font-size:1.7rem;white-space:nowrap}
.nav-menu{display:flex;align-items:center;justify-content:center;gap:2.1rem;margin:0}
.nav-menu a{font-size:.88rem;font-weight:500;letter-spacing:.08em;transition:color .2s ease,font-weight .2s ease}
.nav-menu a:hover,.nav-menu a.active{font-weight:600}
.nav-icons{justify-content:flex-end;gap:1.15rem}
.nav-icons button,.nav-icons a{width:24px;height:24px;padding:0}
@media(max-width:900px){
  .nav{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:1rem}
  .logo{justify-self:start}
  .nav-menu{position:absolute;left:0;right:0;top:100%;display:grid;gap:0;margin:0;background:rgba(255,253,245,.98);border:1px solid var(--line);box-shadow:var(--shadow-sm);padding:.65rem 0;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.3s var(--ease);z-index:60}
  .nav-menu.open{opacity:1;visibility:visible;transform:none}
  .nav-menu a{display:block;padding:.9rem 1rem}
  .nav-menu a::after{display:none}
}
