/* By Maram — selected Salt Atelier finish for the complete storefront. */
:root{
  --ink:#0b0705;
  --basalt:#120b07;
  --stone:#28170f;
  --clay:#6e4029;
  --mud:#9b6847;
  --sand:#d5ae67;
  --bronze:#d8b363;
  --bronze-ink:#8d6428;
  --dune:#f1dcaa;
  --linen:#f7ead4;
  --salt:#fffaf0;
  --sea:#17484c;
  --haze:#c9dad8;
  --display:"Optima","Optima Nova","Tenor Sans","Candara",sans-serif;
}

body.store-page{
  background:
    radial-gradient(80rem 48rem at 82% -15%,rgba(216,179,99,.12),transparent 60%),
    var(--basalt);
}

body.store-page::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:499;
  pointer-events:none;
  opacity:.14;
  background:
    linear-gradient(112deg,transparent 32%,rgba(255,239,194,.12) 48%,transparent 62%),
    radial-gradient(circle at 74% 22%,rgba(255,225,151,.13),transparent 23%);
  mix-blend-mode:screen;
}

.display,
.coll-hero h1,
.coll__name,
.pdp-hero__h,
.pdp-hero__tag,
.narr h2,
.ing__head h2,
.ing__card h3,
.steps__item h3,
.buybar__name,
.rel__card h3,
.brand-hero__h,
.founder blockquote{
  font-family:var(--display);
  font-style:normal;
  font-weight:400;
  letter-spacing:.025em;
}

.chrome__mark{
  width:clamp(150px,15vw,220px);
  filter:drop-shadow(0 6px 18px rgba(4,2,1,.32));
}
.chrome__mark img{ width:100%; height:auto; object-fit:contain }
.chrome[data-mode="dark"] .chrome__mark img{ filter:sepia(.12) saturate(1.1) }

.grain{ opacity:.055; mix-blend-mode:soft-light }
.loader{
  background:
    radial-gradient(58rem 32rem at 50% 43%,rgba(210,160,70,.16),transparent 64%),
    #100906;
}
.loader__mark{ color:#f3d995; filter:drop-shadow(0 0 26px rgba(220,176,85,.18)) }
.loader__mark path{ stroke:#e8c87d }
.loader__bar i{ background:linear-gradient(90deg,#7e5623,#efd58f 50%,#9d6a24) }
.curtain__panel{ background:linear-gradient(180deg,#25140d,#100906) }

.coll-hero,
.coll{
  background:
    radial-gradient(62rem 38rem at 86% 8%,rgba(177,112,53,.17),transparent 66%),
    radial-gradient(48rem 34rem at 10% 90%,rgba(78,157,156,.08),transparent 68%),
    #120b07;
}
.coll-hero h1{
  text-transform:uppercase;
  letter-spacing:.07em;
  text-shadow:0 20px 80px rgba(0,0,0,.35);
}
.coll__item{
  isolation:isolate;
  transition:background .55s var(--e-out),padding-inline .55s var(--e-out);
}
.coll__item::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:0;
  background:linear-gradient(90deg,rgba(216,179,99,.04),rgba(216,179,99,.13),rgba(216,179,99,.03));
  transition:opacity .55s var(--e-out);
}
.coll__item:hover::before{ opacity:1 }
.coll__item:hover .coll__name{ color:#f1d38c; text-shadow:0 0 24px rgba(216,179,99,.12) }
.coll__peek{
  border:1px solid rgba(235,204,132,.42);
  box-shadow:0 30px 80px rgba(0,0,0,.46),0 0 42px rgba(216,179,99,.08);
}

.pdp-hero__bg::after{
  background:
    linear-gradient(90deg,rgba(12,5,2,.62) 0%,rgba(12,5,2,.18) 54%,rgba(12,5,2,.32) 100%),
    linear-gradient(0deg,rgba(12,5,2,.62),transparent 48%,rgba(12,5,2,.18));
}
.pdp-hero__bg img{ filter:saturate(1.08) contrast(1.035) }
.pdp-hero__h{
  text-transform:uppercase;
  letter-spacing:.055em;
  text-shadow:0 8px 38px rgba(0,0,0,.5);
}
.pdp-hero__tag{ color:#f7e6bd; letter-spacing:.035em }
.pdp-hero__eyebrow{ color:#f0d187 }

.bene,.spec,.pair{ background:#fffaf0 }
.narr,.rel{ background:linear-gradient(135deg,#faeed9,#f2dfc1) }
.ing{
  background:
    radial-gradient(50rem 34rem at 78% 15%,rgba(216,179,99,.13),transparent 66%),
    #120b07;
}
.steps{ background:linear-gradient(145deg,#78482e,#3a2117) }
.ing__card,.steps__item{ transition:transform .55s var(--e-out),border-color .55s }
.ing__card:hover{ transform:translateY(-7px); border-color:#d8b363 }
.steps__item:hover{ border-color:rgba(241,211,140,.62) }

.btn,
.buybar .btn{
  border-color:color-mix(in srgb,var(--bronze) 76%,transparent);
  letter-spacing:.2em;
}
.btn--solid{
  color:#1b0f08;
  background:linear-gradient(110deg,#9b6d2c,#f0d38e 48%,#a97731);
  border-color:#efd58f;
  box-shadow:0 10px 32px rgba(90,54,16,.18);
}
.btn--solid::before{ background:linear-gradient(110deg,#efd58f,#b17a30) }
.buybar{
  background:color-mix(in srgb,#fffaf0 88%,transparent);
  border-color:rgba(147,101,39,.22);
  backdrop-filter:blur(20px) saturate(1.2);
  -webkit-backdrop-filter:blur(20px) saturate(1.2);
}

.drawer{
  background:linear-gradient(160deg,#fffaf0,#f3dfbc);
  box-shadow:-30px 0 90px rgba(8,4,2,.32);
}
.drawer__scrim{ backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px) }
.cart-item{ border-color:rgba(91,55,24,.18) }

.brand-hero__bg img{ opacity:.8; filter:saturate(1.1) contrast(1.04) }
.brand-hero__bg::after{
  background:linear-gradient(0deg,rgba(12,6,3,.62),transparent 58%,rgba(12,6,3,.2));
}
.brand-hero__h{ text-transform:uppercase; letter-spacing:.08em; text-shadow:0 12px 50px rgba(0,0,0,.5) }

.footer{
  background:
    radial-gradient(50rem 24rem at 16% 0%,rgba(216,179,99,.13),transparent 66%),
    #100906;
}
.footer__mark svg{ color:rgba(228,194,117,.34) }

/* Request checkout: intentionally enquiry-only until payment/shipping credentials exist. */
.checkout{
  min-height:100svh;
  padding:clamp(9rem,17vh,13rem) var(--gut) clamp(7rem,12vh,10rem);
  color:var(--salt);
  background:
    radial-gradient(54rem 38rem at 90% 8%,rgba(216,179,99,.16),transparent 64%),
    radial-gradient(46rem 34rem at 0% 100%,rgba(41,119,122,.1),transparent 66%),
    #120b07;
}
.checkout__head{ max-width:64rem; margin:0 auto clamp(3rem,7vh,5rem) }
.checkout__head h1{
  max-width:11ch;
  margin:.8rem 0 1.4rem;
  font:400 clamp(2.7rem,7vw,7rem)/.96 var(--display);
  letter-spacing:.055em;
  text-transform:uppercase;
}
.checkout__head p{ max-width:48ch; color:rgba(255,250,240,.72) }
.checkout__grid{ max-width:64rem; margin:auto; display:grid; grid-template-columns:minmax(0,1fr) minmax(18rem,.72fr); gap:clamp(2rem,6vw,6rem) }
.checkout__summary,.checkout__form{
  border:1px solid rgba(235,204,132,.24);
  background:rgba(255,250,240,.045);
  box-shadow:0 26px 80px rgba(0,0,0,.2);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.checkout__summary{ padding:clamp(1.4rem,3vw,2.4rem) }
.checkout__items{ display:grid; gap:1rem }
.checkout__item{ display:grid; grid-template-columns:64px 1fr auto; gap:1rem; align-items:center; padding-bottom:1rem; border-bottom:1px solid rgba(255,250,240,.13) }
.checkout__item img{ width:64px; aspect-ratio:1; object-fit:cover }
.checkout__item h2{ font:400 1rem/1.25 var(--display); letter-spacing:.03em }
.checkout__item p,.checkout__empty{ color:rgba(255,250,240,.62); font-size:.8rem }
.checkout__total{ display:flex; justify-content:space-between; margin-top:1.5rem; padding-top:1.2rem; border-top:1px solid rgba(235,204,132,.32); letter-spacing:.14em; text-transform:uppercase }
.checkout__form{ padding:clamp(1.4rem,3vw,2.4rem); display:grid; gap:1rem }
.checkout__field{ position:relative; display:grid; gap:.45rem }
.checkout__field label{ font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:#e5c77f }
.checkout__field input,.checkout__field textarea{
  width:100%; border:0; border-bottom:1px solid rgba(255,250,240,.3); border-radius:0;
  padding:.72rem 0; background:transparent; color:var(--salt); font:300 1rem var(--sans); outline:0;
}
.checkout__field textarea{ min-height:6rem; resize:vertical }
.checkout__field input:focus,.checkout__field textarea:focus{ border-color:#efd58f }
.checkout__actions{ display:flex; gap:.8rem; flex-wrap:wrap; margin-top:.8rem }
.checkout__note{ font-size:.72rem; color:rgba(255,250,240,.58); line-height:1.55 }
.checkout__status{ min-height:1.4em; color:#f1d38c; font-size:.75rem }

@media (max-width:860px){
  .coll-hero h1,.pdp-hero__h,.brand-hero__h,.checkout__head h1{ letter-spacing:.045em }
  .checkout__grid{ grid-template-columns:1fr }
  .chrome__mark{ width:138px }
}

@media (prefers-reduced-motion:reduce){
  body.store-page::before{ display:none }
  .grain{ display:none }
}