:root{
  --bg:#0c0c11; --bg2:#13131b; --panel:#171720;
  --gold:#c9a24b; --gold-soft:#e6c878;
  --ivory:#f4efe6; --muted:#9c968b; --line:rgba(201,162,75,.20);
  --serif:"Cormorant Garamond",Georgia,serif; --sans:"Jost",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ivory);font-family:var(--sans);font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.08;letter-spacing:.3px}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.eyebrow{font-family:var(--sans);font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}

/* topbar */
.topbar{background:#08080c;color:var(--muted);text-align:center;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;padding:.6rem 1rem}

/* header */
.site-header{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem clamp(1.2rem,5vw,4rem);background:rgba(12,12,17,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:.6rem}
.brand-mark{color:var(--gold);font-size:1.1rem}
.brand-name{font-family:var(--serif);font-size:1.5rem;font-weight:600;letter-spacing:1px}
.brand-thin{font-weight:400;color:var(--gold-soft)}
.nav{display:flex;gap:2.2rem}
.nav a{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.nav a:hover{color:var(--gold-soft)}
.cart-btn{background:none;border:1px solid var(--line);color:var(--ivory);font-family:var(--sans);
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;padding:.6rem 1.1rem;cursor:pointer;transition:.2s;border-radius:2px}
.cart-btn:hover{border-color:var(--gold);color:var(--gold-soft)}
.cart-count{color:var(--gold);font-weight:500}

/* hero */
.hero{position:relative;min-height:92vh;display:flex;align-items:center;
  background:
    linear-gradient(90deg, rgba(9,9,14,.95) 0%, rgba(9,9,14,.78) 42%, rgba(9,9,14,.40) 100%),
    radial-gradient(ellipse 70% 60% at 78% 32%, rgba(201,162,75,.16), transparent 62%),
    url("https://images.unsplash.com/photo-1535632066927-ab7c9ab60908?w=1920&h=1200&fit=crop&q=80") center/cover no-repeat}
.hero-inner{max-width:820px;padding:0 clamp(1.2rem,5vw,4rem)}
.hero h1{font-size:clamp(2.8rem,7vw,5.6rem);margin:.4rem 0 1.4rem}
.hero-sub{font-size:1.12rem;color:#cfc9bd;max-width:560px;margin-bottom:2.4rem}
.hero-trust{display:flex;gap:2rem;flex-wrap:wrap;margin-top:2.6rem;color:var(--muted);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase}
.hero-trust span{color:var(--gold-soft)}
.btn-gold{display:inline-block;background:linear-gradient(180deg,#d9b45c,#b98e39);color:#1a1408;
  font-family:var(--sans);font-weight:500;font-size:.82rem;letter-spacing:.18em;text-transform:uppercase;
  padding:1rem 2.4rem;border:none;cursor:pointer;transition:.25s;border-radius:2px}
.btn-gold:hover{filter:brightness(1.08);box-shadow:0 8px 30px rgba(201,162,75,.25)}

/* sections */
section{padding:clamp(3.5rem,8vw,7rem) clamp(1.2rem,5vw,4rem)}
.section-head{text-align:center;max-width:720px;margin:0 auto 3.2rem}
.section-head h2{font-size:clamp(2rem,4.5vw,3.2rem)}
.section-sub{color:var(--muted);margin-top:.8rem;font-size:.95rem}

/* collections */
.collections{background:var(--bg2)}
.collection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;max-width:1200px;margin:0 auto;background:var(--line);border:1px solid var(--line)}
.collection-card{background:var(--bg2) center/cover no-repeat;position:relative;min-height:230px;
  padding:2.8rem 1.5rem;text-align:center;cursor:pointer;transition:.3s;display:flex;flex-direction:column;justify-content:center}
.collection-card::before{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(9,9,14,.5),rgba(9,9,14,.84));transition:.3s}
.collection-card:hover::before{background:linear-gradient(180deg,rgba(9,9,14,.32),rgba(9,9,14,.7))}
.collection-card>*{position:relative;z-index:1}
.collection-card .ic{font-size:1.7rem;color:var(--gold);margin-bottom:.8rem}
.collection-card h3{font-size:1.35rem;margin-bottom:.3rem}
.collection-card span{font-size:.76rem;color:var(--gold-soft);letter-spacing:.14em;text-transform:uppercase}

/* filters */
.filters{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center;margin-bottom:2.6rem}
.filter{background:none;border:1px solid var(--line);color:var(--muted);font-family:var(--sans);
  font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;padding:.5rem 1.1rem;cursor:pointer;transition:.2s;border-radius:2px}
.filter:hover{color:var(--ivory)}
.filter.active{background:var(--gold);border-color:var(--gold);color:#161006}

/* product grid */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2rem 1.6rem;max-width:1200px;margin:0 auto}
.card{background:var(--panel);border:1px solid rgba(255,255,255,.04);transition:.25s;display:flex;flex-direction:column}
.card:hover{border-color:var(--line);transform:translateY(-4px)}
.card-img{display:block;aspect-ratio:1;background:#0a0a0f;position:relative;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover;transition:.5s}
.card:hover .card-img img{transform:scale(1.05)}
.card-oos{position:absolute;top:.8rem;left:.8rem;background:rgba(8,8,12,.85);color:var(--muted);
  font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;padding:.3rem .6rem;border:1px solid var(--line)}
.card-body{padding:1.2rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.card-cat{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.card-name{font-family:var(--serif);font-size:1.28rem;line-height:1.15}
.card-price{color:var(--ivory);font-size:1.02rem;margin-top:auto}
.card-add{margin-top:.7rem;background:none;border:1px solid var(--line);color:var(--ivory);
  font-family:var(--sans);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;padding:.7rem;cursor:pointer;transition:.2s;border-radius:2px}
.card-add:hover:not(:disabled){background:var(--gold);border-color:var(--gold);color:#161006}
.card-add:disabled{opacity:.4;cursor:not-allowed}
.loading{grid-column:1/-1;text-align:center;color:var(--muted);padding:3rem}

/* craft */
.craft{background:var(--bg2)}
.craft-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2.4rem;max-width:1100px;margin:0 auto}
.craft-grid h3{font-size:1.4rem;color:var(--gold-soft);margin-bottom:.6rem}
.craft-grid p{color:var(--muted);font-size:.95rem}

/* visit */
.visit{text-align:center;background:
  radial-gradient(ellipse 70% 60% at 50% 0%, rgba(201,162,75,.08), transparent 60%),var(--bg)}
.visit p{color:#cfc9bd;margin-top:1rem;line-height:2}

/* footer */
.site-footer{background:#08080c;text-align:center;padding:2.6rem 1rem;border-top:1px solid var(--line)}
.foot-brand{font-family:var(--serif);font-size:1.4rem;color:var(--gold-soft);margin-bottom:.6rem}
.site-footer p{color:var(--muted);font-size:.8rem;line-height:1.9}
.site-footer a{color:var(--gold-soft);border-bottom:1px solid var(--line);padding-bottom:1px}

/* cart drawer */
.drawer-overlay{position:fixed;inset:0;background:rgba(4,4,8,.6);opacity:0;pointer-events:none;transition:.3s;z-index:50}
.drawer-overlay.open{opacity:1;pointer-events:auto}
.cart-drawer{position:fixed;top:0;right:0;height:100%;width:min(420px,92vw);background:var(--bg2);
  border-left:1px solid var(--line);transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);z-index:60;display:flex;flex-direction:column}
.cart-drawer.open{transform:translateX(0)}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:1.4rem;border-bottom:1px solid var(--line)}
.drawer-head h3{font-size:1.5rem}
.drawer-close{background:none;border:none;color:var(--muted);font-size:1.1rem;cursor:pointer}
.drawer-body{flex:1;overflow-y:auto;padding:1rem 1.4rem}
.drawer-foot{padding:1.4rem;border-top:1px solid var(--line)}
.line-item{display:flex;gap:1rem;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.05)}
.line-item img{width:64px;height:64px;object-fit:cover;background:#0a0a0f}
.li-info{flex:1;font-size:.9rem}
.li-name{font-family:var(--serif);font-size:1.05rem}
.li-price{color:var(--muted);font-size:.85rem;margin-top:.2rem}
.li-qty{display:flex;align-items:center;gap:.6rem;margin-top:.5rem}
.li-qty button{background:none;border:1px solid var(--line);color:var(--ivory);width:24px;height:24px;cursor:pointer;border-radius:2px}
.cart-empty{color:var(--muted);text-align:center;padding:3rem 0}
.summary-row{display:flex;justify-content:space-between;margin-bottom:.5rem;color:var(--muted);font-size:.88rem}
.summary-row.total{color:var(--ivory);font-size:1.15rem;font-family:var(--serif);margin:.8rem 0 1.2rem}
.checkout-form{display:flex;flex-direction:column;gap:.7rem;margin-top:1rem}
.checkout-form input{background:var(--bg);border:1px solid var(--line);color:var(--ivory);padding:.8rem;font-family:var(--sans);border-radius:2px}
.btn-checkout{width:100%;margin-top:.4rem}
.pay-note{color:var(--muted);font-size:.72rem;text-align:center;margin-top:.8rem}
.pay-ok{text-align:center;padding:2rem 0}
.pay-ok .tick{color:var(--gold);font-size:2.4rem}
.pay-ok h3{margin:.6rem 0}
.pay-ok p{color:var(--muted);font-size:.9rem}

/* product detail page */
.pdp{padding:clamp(2rem,5vw,4rem) clamp(1.2rem,5vw,4rem);max-width:1100px;margin:0 auto;min-height:70vh}
.pdp-crumb{margin-bottom:2rem}
.pdp-crumb a{color:var(--muted);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase}
.pdp-crumb a:hover{color:var(--gold-soft)}
.pdp-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.pdp-img{position:relative;aspect-ratio:1;background:#0a0a0f;overflow:hidden;border:1px solid var(--line)}
.pdp-img img{width:100%;height:100%;object-fit:cover}
.pdp-info h1{font-size:clamp(2rem,4vw,3rem);margin:.4rem 0 1rem}
.pdp-price{font-size:1.5rem;color:var(--ivory);margin-bottom:1.4rem}
.pdp-tax{font-size:.85rem;color:var(--muted)}
.pdp-desc{color:#cfc9bd;margin-bottom:2rem;line-height:1.9}
.pdp-info .btn-gold{margin-bottom:2rem}
.pdp-trust{list-style:none;display:flex;flex-direction:column;gap:.7rem;font-size:.9rem;border-top:1px solid var(--line);padding-top:1.6rem}
.pdp-trust li{color:var(--gold-soft)}
.shop-page{min-height:72vh}
.filter.active{background:var(--gold);border-color:var(--gold);color:#161006}

@media(max-width:760px){ .nav{display:none} .hero-trust{gap:1rem} .pdp-grid{grid-template-columns:1fr} }