/* Aishvika design system — storefront
   White is the room. The cloth supplies the colour. Gold is a line, never a fill. */
:root{
  --canvas:#fff; --ivory:#FBF9F5; --sand:#F4F0E7; --rule:#E6E1D6; --rule-soft:#F0ECE3;
  --ink:#16150F; --ink2:#4A463D; --ink3:#7C776C;
  --gold:#A06B28; --gold-deep:#7E5218; --gold-light:#C79A45; --gold-wash:#FAF4E8;
  --err:#8E2436;
  --serif:"Lora","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Lato","Helvetica Neue",Helvetica,Arial,sans-serif;
  --max:1440px; --pad:96px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--ink);font-family:var(--sans);
  font-size:15px;line-height:1.62;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:#fff;padding:10px 16px;z-index:99;border:1px solid var(--ink)}

/* type */
.d1{font-family:var(--serif);font-size:clamp(38px,5.4vw,84px);line-height:1.03;letter-spacing:-.022em;font-weight:400;margin:0}
.d2{font-family:var(--serif);font-size:clamp(30px,3.8vw,58px);line-height:1.07;letter-spacing:-.018em;font-weight:400;margin:0}
.d3{font-family:var(--serif);font-size:clamp(26px,2.9vw,42px);line-height:1.13;letter-spacing:-.014em;font-weight:400;margin:0}
.d4{font-family:var(--serif);font-size:clamp(21px,2.1vw,30px);line-height:1.2;font-weight:400;margin:0}
.d5{font-family:var(--serif);font-size:22px;line-height:1.3;font-weight:400;margin:0}
.d6{font-family:var(--serif);font-size:18px;line-height:1.36;font-weight:400;margin:0}
.lede{font-family:var(--serif);font-size:clamp(17px,1.5vw,21px);line-height:1.62;color:var(--ink2);margin:0}
.body{font-size:15.5px;line-height:1.72;color:var(--ink2);margin:0}
.small{font-size:13px;line-height:1.6;color:var(--ink3);margin:0}
.tiny{font-size:11.5px;line-height:1.5;color:var(--ink3);margin:0}
.eyebrow{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:700;margin:0}
.eyebrow.muted{color:var(--ink3);font-weight:600}
.label{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);font-weight:700;margin:0}
.serif{font-family:var(--serif)}

/* layout */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.row{display:flex}
.between{justify-content:space-between}
.center{align-items:center}
.hr{height:1px;background:var(--rule)}
.hr.gold{background:var(--gold);opacity:.55}
.sec{padding:88px 0}
.sec.ivory{background:var(--ivory)}
.sec.sand{background:var(--sand)}
.sec.ink{background:var(--ink);color:#EDE7DA}
.sec.ink .d3,.sec.ink .d2{color:#FBF9F5}
.sec.ink .body{color:#B9B2A4}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;padding-bottom:22px;flex-wrap:wrap}
.sec-head .t{max-width:860px}
.grid{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}

/* buttons */
.btn{display:inline-block;padding:15px 30px;background:var(--ink);color:#fff;border:1px solid var(--ink);
  font-size:11.5px;letter-spacing:.15em;text-transform:uppercase;font-weight:700;cursor:pointer;text-align:center}
.btn:hover{background:#000}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ivory)}
.btn.gold{background:var(--gold);border-color:var(--gold)}
.btn.block{display:block;width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.tlink{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  border-bottom:1px solid var(--gold);padding-bottom:5px;display:inline-block}
.chip{display:inline-block;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;
  color:var(--gold-deep);background:var(--gold-wash);padding:5px 9px;border:1px solid #EEE2CB}
.pill{display:inline-block;border:1px solid var(--rule);padding:10px 18px;font-size:12.5px;background:#fff}
.pill.on{border-color:var(--ink);background:var(--ink);color:#fff}

/* header */
.util{background:var(--ink);color:#EDE7DA;font-size:11px;letter-spacing:.1em}
.util .wrap{display:flex;justify-content:space-between;align-items:center;min-height:38px;gap:16px}
.nav{border-bottom:1px solid var(--rule);position:sticky;top:0;background:#fff;z-index:40}
.nav .wrap{display:flex;justify-content:space-between;align-items:center;min-height:88px;gap:20px}
.nav .logo{height:46px;width:auto}
.navlinks{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.navlinks a{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;white-space:nowrap;padding:6px 0;border-bottom:1px solid transparent}
.navlinks a:hover,.navlinks a[aria-current]{border-bottom-color:var(--gold)}
.navicons{display:flex;gap:18px;align-items:center}
.navicons a{font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;white-space:nowrap}
.burger{display:none;background:none;border:1px solid var(--rule);padding:9px 13px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700}

/* product card */
.card .ph{background:var(--sand);aspect-ratio:3/4;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:opacity .25s}
.card:hover .ph img{opacity:.9}
.card .nm{font-family:var(--serif);font-size:16.5px;line-height:1.34;margin:16px 0 0}
.card .mt{font-size:11.5px;color:var(--ink3);margin:6px 0 0}
.card .pr{font-size:14px;font-weight:700;margin:10px 0 0}
.card .soldout{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--err);font-weight:700;margin-top:8px}

/* spec rows */
.kv{display:flex;justify-content:space-between;gap:24px;padding:12px 0;border-bottom:1px solid var(--rule-soft)}
.kv .k{font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);font-weight:700}
.kv .v{font-size:14px;text-align:right}
.scale{display:flex;gap:5px}
.scale i{display:block;width:26px;height:4px;background:#EAE5DA}
.scale i.on{background:var(--gold)}

/* disclosure */
.disclosure{background:var(--gold-wash);border:1px solid #EEE2CB;padding:24px 26px}
.disclosure .body{color:#3C382F}

/* forms */
.field{display:block;margin-bottom:16px}
.field > span{display:block;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);font-weight:700;margin-bottom:7px}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],input[type=tel],select,textarea{
  width:100%;padding:13px 16px;border:1px solid #D9D3C6;background:#fff;font:inherit;font-size:14.5px;border-radius:0}
input:focus,select:focus,textarea:focus{border-color:var(--ink);outline:none}
textarea{min-height:120px;resize:vertical}
.help{font-size:12px;color:var(--ink3);margin-top:6px}
.error{color:var(--err);font-size:13px}
.notice{background:var(--gold-wash);border:1px solid #EEE2CB;padding:14px 18px;font-size:13.5px;margin-bottom:20px}
.notice.bad{background:#FDF3F4;border-color:#F0D9DC;color:var(--err)}

/* filters */
.facet{border-top:1px solid var(--rule-soft);padding:18px 0}
.facet a{display:flex;justify-content:space-between;padding:6px 0;font-size:13.5px;color:var(--ink2)}
.facet a:hover{color:var(--ink)}
.facet a.on{color:var(--ink);font-weight:700}
.swatches{display:flex;flex-wrap:wrap;gap:8px}
.swatches a{width:26px;height:26px;border:1px solid var(--rule);display:block}

/* editorial */
.prose{max-width:700px}
.prose p{font-size:17px;line-height:1.78;color:var(--ink2);margin:0 0 22px}
.prose h2{font-family:var(--serif);font-size:30px;font-weight:400;margin:44px 0 14px}
.prose h3{font-family:var(--serif);font-size:22px;font-weight:400;margin:34px 0 10px}
.prose blockquote{border-left:2px solid var(--gold);padding:6px 0 6px 26px;margin:38px 0;
  font-family:var(--serif);font-size:26px;line-height:1.34;color:var(--ink)}
.prose ul,.prose ol{color:var(--ink2);font-size:17px;line-height:1.78;padding-left:22px}
.prose a{border-bottom:1px solid var(--gold)}
.cap{font-size:11px;color:#9A948A;margin-top:9px}

/* footer */
.foot{background:var(--ink);color:#EDE7DA;padding:76px 0 0;margin-top:0}
.foot .cols{display:flex;justify-content:space-between;gap:40px;padding-bottom:60px;flex-wrap:wrap}
.foot a{font-size:13px;color:#B9B2A4;display:block;padding:7px 0}
.foot a:hover{color:#fff}
.foot .label{color:#8E887B;margin-bottom:12px}
.foot .rule{height:1px;background:#2C2A24}
.foot .base{display:flex;justify-content:space-between;gap:24px;padding:26px 0 44px;font-size:11.5px;color:#8E887B;flex-wrap:wrap}
.social{display:flex;gap:14px;margin-top:22px}
.social a{border:1px solid #3A372F;width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0}
.social a:hover{border-color:var(--gold)}
.social svg{width:17px;height:17px;fill:#EDE7DA}
.social a:hover svg{fill:var(--gold-light)}

/* misc */
.badge{display:inline-block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;padding:4px 8px;border:1px solid var(--rule);color:var(--ink3)}
.empty{border:1px dashed #D9D3C6;background:var(--ivory);padding:44px;text-align:center;color:var(--ink3)}
.tabs{display:flex;gap:26px;border-bottom:1px solid var(--rule);margin-bottom:28px;flex-wrap:wrap}
.tabs a{padding:14px 0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs a.on{border-bottom-color:var(--gold)}
table.data{width:100%;border-collapse:collapse;font-size:14px}
table.data th{text-align:left;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);padding:12px 10px;border-bottom:1px solid var(--rule)}
table.data td{padding:14px 10px;border-bottom:1px solid var(--rule-soft);vertical-align:top}

/* responsive */
@media (max-width:1200px){ :root{--pad:56px} .g4{grid-template-columns:repeat(3,1fr)} }
@media (max-width:900px){
  :root{--pad:24px}
  .g4,.g3{grid-template-columns:repeat(2,1fr)}
  .g2{grid-template-columns:1fr}
  .sec{padding:56px 0}
  .navlinks{display:none}
  .burger{display:inline-block}
  .nav .wrap{min-height:64px}
  .nav .logo{height:34px}
  .util .wrap{font-size:10px;min-height:32px}
  .util .wrap span:last-child{display:none}
  .stack-m{flex-direction:column}
  .prose p{font-size:16px}
}
@media (max-width:560px){
  .g4,.g3{grid-template-columns:repeat(2,1fr);gap:14px}
  .card .nm{font-size:14.5px}
  .foot .cols{gap:8px}
  .foot .cols > div{width:47%}
}

/* mobile sticky buy bar */
.buybar{display:none}
@media (max-width:900px){
  .buybar{display:flex;position:sticky;bottom:0;background:#fff;border-top:1px solid var(--rule);
    padding:12px 24px;justify-content:space-between;align-items:center;gap:14px;z-index:30}
  .buybar .btn{padding:14px 24px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}