/* ============================================================
   TOKENS
   ============================================================ */
:root{
  --lilac:#EFEDF4;        /* page ground — cool, so saree colour comes forward */
  --lilac-2:#E5E2EE;      /* alternate band */
  --lilac-3:#F7F6FA;      /* card wash */
  --paper:#FFFFFF;
  --ink:#333333;          /* body + headings */
  --ink-2:#1C1C1C;        /* deepest text */
  --mute:#6E6A78;
  --gold:#A4863D;
  --gold-2:#C9AE72;       /* gold on dark */
  --forest:#0E300E;
  --madder:#7A2E3A;       /* live / limited states only */
  --line:#D9D5E4;
  --line-2:#C9C3DA;

  --shell:1320px;
  --gut:clamp(20px,4.2vw,56px);

  --dsp:"Marcellus",Georgia,serif;
  --sc:"Marcellus SC",Georgia,serif;
  --ui:"Karla",system-ui,-apple-system,sans-serif;

  --ease:cubic-bezier(.22,.61,.36,1);

  /* the zari band — gold motif on charcoal, used as every section divider */
  --zari:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='14' viewBox='0 0 26 14'%3E%3Crect width='26' height='14' fill='%23333333'/%3E%3Cpath d='M13 2.6l3.4 4.4-3.4 4.4-3.4-4.4z' fill='none' stroke='%23A4863D' stroke-width='.9'/%3E%3Cpath d='M0 .8h26M0 13.2h26' stroke='%23A4863D' stroke-width='.8'/%3E%3Ccircle cx='0' cy='7' r='1.1' fill='%23A4863D'/%3E%3Ccircle cx='26' cy='7' r='1.1' fill='%23A4863D'/%3E%3C/svg%3E");
}

/* ============================================================
   BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--lilac);color:var(--ink);
  font-family:var(--ui);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{font-family:var(--dsp);font-weight:400;margin:0;line-height:1.08;letter-spacing:-.01em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}

:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.sr{position:absolute;left:-9999px;top:0}
.sr:focus{left:12px;top:12px;z-index:999;background:var(--ink);color:#fff;padding:10px 16px}

.wrap{width:100%;max-width:var(--shell);margin:0 auto;padding:0 var(--gut)}
.sec{padding:clamp(56px,7.2vw,108px) 0}
.sec--tight{padding:clamp(40px,5vw,68px) 0}

/* ---- shared type ---- */
.eyb{
  font-family:var(--sc);font-size:12px;letter-spacing:.16em;
  color:var(--gold);display:inline-block;
}
.h-xl{font-size:clamp(44px,6.6vw,88px)}
.h-lg{font-size:clamp(30px,3.9vw,50px)}
.h-md{font-size:clamp(22px,2.4vw,30px)}
.lede{font-size:clamp(15px,1.15vw,17px);color:var(--mute);max-width:52ch}

.shead{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:24px;flex-wrap:wrap;margin-bottom:clamp(26px,3vw,44px);
}
.shead h2{margin-top:8px}
.more{
  font-family:var(--sc);font-size:12px;letter-spacing:.14em;
  border-bottom:1px solid var(--gold);padding-bottom:4px;
  transition:color .25s var(--ease),border-color .25s var(--ease);
}
.more:hover{color:var(--gold)}

/* ---- buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 30px;background:var(--ink);color:#fff;
  font-family:var(--sc);font-size:12.5px;letter-spacing:.14em;
  border:1px solid var(--ink);transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
}
.btn:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn--ghost:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.btn--light{background:#fff;color:var(--ink);border-color:#fff}
.btn--light:hover{background:var(--gold-2);border-color:var(--gold-2);color:var(--ink-2)}

/* ============================================================
   SIGNATURE — the zari border
   ============================================================ */
.zari{height:14px;background-image:var(--zari);background-repeat:repeat-x;background-size:auto 14px}
.zari--edge{height:10px;background-size:auto 10px}

/* ============================================================
   HEADER
   ============================================================ */
.topbar{background:var(--ink);color:#EDE9E0;font-size:12px;letter-spacing:.04em}
.topbar .wrap{display:flex;align-items:center;justify-content:center;gap:28px;height:38px;text-align:center}
.topbar b{color:var(--gold-2);font-weight:500}

.site-top{position:sticky;top:0;z-index:60}
.hdr{
  background:rgba(239,237,244,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);transition:padding .3s var(--ease);
}
.hdr__bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:18px 0;transition:padding .3s var(--ease)}
.site-top.is-stuck .hdr__bar{padding:11px 0}

.brand{text-align:center;line-height:1}
.brand__name{display:block;font-family:var(--dsp);font-size:clamp(19px,2vw,26px);letter-spacing:.24em;text-indent:.24em}
.brand__tag{display:block;margin-top:7px;font-family:var(--sc);font-size:10px;letter-spacing:.15em;color:var(--mute)}
.site-top.is-stuck .brand__tag{display:none}

.hdr__l,.hdr__r{display:flex;align-items:center;gap:20px}
.hdr__r{justify-content:flex-end}
.hdr__l a,.hdr__r a,.hdr__l button,.hdr__r button{
  font-family:var(--sc);font-size:11.5px;letter-spacing:.13em;transition:color .25s var(--ease)
}
.hdr__l a:hover,.hdr__r a:hover{color:var(--gold)}
.bag{display:inline-flex;align-items:center;gap:8px}
.bag i{
  font-style:normal;display:inline-grid;place-items:center;min-width:20px;height:20px;
  border-radius:50%;background:var(--ink);color:#fff;font-family:var(--ui);font-size:11px;padding:0 5px
}
.burger{display:none;align-items:center;gap:9px}
.burger svg{display:block}

/* ---- primary nav (two axes: occasion, garment) ---- */
.pnav{border-bottom:1px solid var(--line);background:rgba(239,237,244,.94);backdrop-filter:blur(10px)}
.pnav__list{display:flex;align-items:center;justify-content:center;gap:clamp(18px,2.4vw,38px)}
.pnav__list > li > a{
  display:block;padding:13px 0;font-family:var(--sc);font-size:12px;letter-spacing:.13em;
  position:relative;transition:color .25s var(--ease)
}
.pnav__list > li > a::after{
  content:"";position:absolute;left:0;right:100%;bottom:8px;height:1px;background:var(--gold);
  transition:right .35s var(--ease)
}
.pnav__list > li > a:hover::after{right:0}
.pnav__list a.is-accent{color:var(--madder)}

.has-mega{position:static}
.mega{
  position:absolute;left:0;right:0;top:100%;background:var(--paper);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .28s var(--ease),transform .28s var(--ease),visibility .28s;
  box-shadow:0 24px 48px -32px rgba(28,28,28,.4)
}
.has-mega:hover .mega,.has-mega:focus-within .mega{opacity:1;visibility:visible;transform:none}
.mega__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,.85fr);gap:clamp(20px,3vw,48px);padding:38px 0 42px}
.mega__col h3{font-family:var(--sc);font-size:11.5px;letter-spacing:.15em;color:var(--gold);margin-bottom:14px}
.mega__col li a{display:block;padding:6px 0;font-size:14.5px;color:var(--ink);transition:color .2s var(--ease),padding-left .25s var(--ease)}
.mega__col li a:hover{color:var(--gold);padding-left:6px}
.mega__promo{margin:0}
.mega__promo img{aspect-ratio:4/3;object-fit:cover;width:100%}
.mega__promo figcaption{margin-top:10px;font-size:12.5px;color:var(--mute)}

/* ---- mobile drawer nav ---- */
.mnav{
  position:fixed;inset:0 0 0 auto;width:min(90vw,380px);background:var(--paper);z-index:90;
  transform:translateX(100%);transition:transform .4s var(--ease);
  display:flex;flex-direction:column;overflow-y:auto
}
.mnav.is-open{transform:none}
.mnav__head{display:flex;align-items:center;justify-content:space-between;padding:20px var(--gut);border-bottom:1px solid var(--line)}
.mnav__head span{font-family:var(--sc);font-size:12px;letter-spacing:.15em}
.mnav__body{padding:14px var(--gut) 40px}
.mnav__body h4{font-family:var(--sc);font-size:11px;letter-spacing:.16em;color:var(--gold);margin:24px 0 8px}
.mnav__body a{display:block;padding:9px 0;border-bottom:1px solid var(--line);font-size:15px}

.scrim{position:fixed;inset:0;background:rgba(28,28,28,.5);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s;z-index:80}
.scrim.is-open{opacity:1;visibility:visible}

/* ============================================================
   HERO — asymmetric drape: panel / type / offset panel
   ============================================================ */
.hero{padding:clamp(34px,4.4vw,66px) 0 clamp(20px,3vw,40px)}
.hero__grid{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.06fr) minmax(0,.68fr);
  gap:clamp(16px,2.6vw,44px);align-items:start
}
.hero__panel{position:relative;overflow:hidden;background:var(--lilac-2)}
.hero__panel img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1.4s var(--ease)}
.hero__panel--a{aspect-ratio:3/4.35}
.hero__panel--b{aspect-ratio:3/4.1;margin-top:clamp(48px,9vw,140px)}
.hero.is-in .hero__panel img{transform:none}

.hero__copy{padding-top:clamp(0px,2vw,28px);text-align:center}
.hero__rule{display:block;width:1px;height:clamp(28px,4vw,54px);background:var(--gold);margin:18px auto}
.hero h1{margin:0}
.hero h1 em{font-style:italic;font-family:Georgia,serif;color:var(--gold)}
.hero__lede{margin:22px auto 0;color:var(--mute);font-size:15.5px;max-width:38ch}
.hero__actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.hero__note{
  margin-top:clamp(26px,3.4vw,44px);padding-top:20px;border-top:1px solid var(--line-2);
  display:flex;gap:18px;justify-content:center;flex-wrap:wrap;
  font-family:var(--sc);font-size:11px;letter-spacing:.12em;color:var(--mute)
}
.hero__note span{display:inline-flex;align-items:center;gap:9px}
.hero__note span::before{content:"";width:4px;height:4px;background:var(--gold);transform:rotate(45deg)}

/* ============================================================
   MARQUEE — craft vocabulary
   ============================================================ */
.mq{background:var(--ink);color:#EDE9E0;overflow:hidden;padding:15px 0}
.mq__track{display:flex;gap:44px;white-space:nowrap;width:max-content;animation:slide 42s linear infinite}
.mq__track span{font-family:var(--sc);font-size:12.5px;letter-spacing:.18em;display:inline-flex;align-items:center;gap:44px}
.mq__track span::after{content:"";width:5px;height:5px;background:var(--gold);transform:rotate(45deg)}
@keyframes slide{to{transform:translateX(-50%)}}
.mq:hover .mq__track{animation-play-state:paused}

/* ============================================================
   OCCASION
   ============================================================ */
.occ{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,1.3vw,18px)}
.occ__card{position:relative;overflow:hidden;aspect-ratio:3/4.5;background:var(--lilac-2);display:block}
.occ__card img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.occ__card:hover img{transform:scale(1.06)}
.occ__card::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(28,28,28,.78) 0%,rgba(28,28,28,.12) 46%,transparent 70%)
}
.occ__label{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:20px 18px;color:#fff}
.occ__label h3{font-size:clamp(17px,1.5vw,21px)}
.occ__label span{display:block;margin-top:6px;font-family:var(--sc);font-size:10.5px;letter-spacing:.13em;color:var(--gold-2)}

/* ============================================================
   SIGNATURE MODULE — shop by colour (dye names)
   ============================================================ */
.dye{background:var(--lilac-2)}
.dye__inner{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.6fr);gap:clamp(28px,4vw,72px);align-items:center}
.dye__chips{display:flex;flex-wrap:wrap;gap:clamp(12px,1.6vw,22px)}
.dye__chip{display:flex;flex-direction:column;align-items:center;gap:11px;width:clamp(72px,9vw,96px)}
.dye__swatch{
  width:100%;aspect-ratio:1;border-radius:50%;position:relative;
  box-shadow:inset 0 0 0 1px rgba(28,28,28,.12);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)
}
.dye__chip:hover .dye__swatch{transform:translateY(-5px);box-shadow:inset 0 0 0 1px rgba(28,28,28,.12),0 0 0 1px var(--gold),0 10px 22px -12px rgba(28,28,28,.55)}
.dye__chip b{font-family:var(--dsp);font-weight:400;font-size:14.5px;line-height:1.2}
.dye__chip small{font-size:11px;color:var(--mute);letter-spacing:.03em}

/* ============================================================
   PRODUCTS
   ============================================================ */
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.8vw,30px)}
.card figure{margin:0;position:relative;overflow:hidden;background:var(--lilac-3);aspect-ratio:3/4.1}
.card figure img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.card:hover figure img{transform:scale(1.05)}
.card__flag{
  position:absolute;top:12px;left:12px;z-index:2;background:var(--paper);color:var(--ink);
  font-family:var(--sc);font-size:10px;letter-spacing:.12em;padding:6px 11px
}
.card__flag--limited{background:var(--madder);color:#fff}
.card__quick{
  position:absolute;left:12px;right:12px;bottom:12px;z-index:2;text-align:center;
  background:rgba(255,255,255,.95);color:var(--ink);padding:12px;
  font-family:var(--sc);font-size:11px;letter-spacing:.13em;
  opacity:0;transform:translateY(10px);transition:opacity .3s var(--ease),transform .3s var(--ease)
}
.card:hover .card__quick,.card:focus-within .card__quick{opacity:1;transform:none}
.card__body{padding-top:14px}
.card__name{font-size:17px}
.card__name a{transition:color .25s var(--ease)}
.card__name a:hover{color:var(--gold)}
.card__meta{margin-top:5px;font-size:12.5px;color:var(--mute)}
.card__price{margin-top:9px;font-family:var(--dsp);font-size:16px}
.card__dots{display:flex;gap:6px;margin-top:11px}
.card__dots i{width:11px;height:11px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(28,28,28,.16)}

/* ============================================================
   GROUP ORDER CAMPAIGN
   ============================================================ */
.camp{background:var(--forest);color:#EFEDE4}
.camp__inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.88fr);gap:clamp(28px,4.4vw,80px);align-items:center}
.camp h2{color:#fff}
.camp .eyb{color:var(--gold-2)}
.camp p{color:rgba(239,237,228,.74);margin-top:18px;max-width:46ch;font-size:15.5px}
.camp__clock{display:flex;gap:12px;margin-top:28px}
.camp__unit{
  min-width:74px;padding:13px 8px;text-align:center;
  border:1px solid rgba(201,174,114,.36);background:rgba(0,0,0,.16)
}
.camp__unit b{display:block;font-family:var(--dsp);font-size:28px;line-height:1;color:var(--gold-2)}
.camp__unit span{display:block;margin-top:7px;font-family:var(--sc);font-size:10px;letter-spacing:.14em;color:rgba(239,237,228,.6)}
.camp__bar{margin-top:26px}
.camp__bar > div{height:3px;background:rgba(255,255,255,.16);position:relative;overflow:hidden}
.camp__bar > div > i{position:absolute;inset:0 auto 0 0;width:0;background:var(--gold-2);transition:width 1.6s var(--ease)}
.camp__bar p{display:flex;justify-content:space-between;gap:16px;margin-top:11px;font-family:var(--sc);font-size:11px;letter-spacing:.11em;color:rgba(239,237,228,.68);max-width:none}
.camp__media{position:relative;overflow:hidden;aspect-ratio:4/4.4}
.camp__media img{width:100%;height:100%;object-fit:cover}
.camp__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}

/* ============================================================
   COMPLETE THE LOOK
   ============================================================ */
.look{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,3.4vw,60px);align-items:center}
.look__media{position:relative;aspect-ratio:4/4.6;overflow:hidden;background:var(--lilac-2)}
.look__media img{width:100%;height:100%;object-fit:cover}
.look__pin{
  position:absolute;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.92);
  display:grid;place-items:center;font-size:15px;line-height:1;color:var(--ink);
  box-shadow:0 4px 14px -6px rgba(28,28,28,.6);
  animation:pulse 2.6s var(--ease) infinite
}
@keyframes pulse{0%,100%{box-shadow:0 4px 14px -6px rgba(28,28,28,.6),0 0 0 0 rgba(164,134,61,.45)}50%{box-shadow:0 4px 14px -6px rgba(28,28,28,.6),0 0 0 9px rgba(164,134,61,0)}}
.look__list{margin-top:24px;border-top:1px solid var(--line-2)}
.look__row{display:grid;grid-template-columns:64px 1fr auto;gap:16px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line-2)}
.look__row img{width:64px;height:78px;object-fit:cover;background:var(--lilac-2)}
.look__row h3{font-size:16px}
.look__row small{display:block;margin-top:4px;color:var(--mute);font-size:12.5px}
.look__row b{font-family:var(--dsp);font-weight:400;font-size:15px}

/* ============================================================
   SOURCING BAND
   ============================================================ */
.src{position:relative;overflow:hidden;background:var(--ink)}
.src__bg{position:absolute;inset:0}
.src__bg img{width:100%;height:100%;object-fit:cover;opacity:.34}
.src__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,28,28,.9),rgba(28,28,28,.45))}
.src__inner{position:relative;z-index:2;max-width:62ch;color:#EFEDE4;padding:clamp(56px,7vw,110px) 0}
.src h2{color:#fff}
.src p{color:rgba(239,237,228,.76);margin-top:18px;font-size:15.5px}
.src__stats{display:flex;gap:clamp(24px,4vw,60px);flex-wrap:wrap;margin-top:34px;padding-top:26px;border-top:1px solid rgba(201,174,114,.34)}
.src__stats div b{display:block;font-family:var(--dsp);font-size:clamp(28px,3.4vw,42px);color:var(--gold-2);line-height:1}
.src__stats div span{display:block;margin-top:8px;font-family:var(--sc);font-size:10.5px;letter-spacing:.14em;color:rgba(239,237,228,.62)}

/* ============================================================
   LOOKBOOK
   ============================================================ */
.lb{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(10px,1.3vw,18px)}
.lb figure{margin:0;overflow:hidden;background:var(--lilac-2);position:relative}
.lb figure img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.lb figure:hover img{transform:scale(1.05)}
.lb figcaption{
  position:absolute;left:14px;bottom:12px;z-index:2;color:#fff;
  font-family:var(--sc);font-size:10.5px;letter-spacing:.13em;text-shadow:0 1px 12px rgba(0,0,0,.7)
}
.lb__a{grid-column:span 5;aspect-ratio:4/5}
.lb__b{grid-column:span 3;aspect-ratio:3/5;margin-top:clamp(20px,3vw,52px)}
.lb__c{grid-column:span 4;aspect-ratio:4/5}
.lb__d{grid-column:span 4;aspect-ratio:4/3.4}
.lb__e{grid-column:span 8;aspect-ratio:16/8}

/* ============================================================
   REVIEWS
   ============================================================ */
.rev{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,28px)}
.rev article{background:var(--paper);padding:clamp(24px,2.6vw,34px);border:1px solid var(--line);display:flex;flex-direction:column}
.rev__stars{color:var(--gold);letter-spacing:.22em;font-size:13px}
.rev blockquote{margin:16px 0 0;font-family:var(--dsp);font-size:18px;line-height:1.45}
.rev footer{margin-top:auto;padding-top:20px;display:flex;align-items:center;gap:12px}
.rev footer i{
  width:34px;height:34px;border-radius:50%;background:var(--lilac-2);display:grid;place-items:center;
  font-style:normal;font-family:var(--sc);font-size:12px;color:var(--ink)
}
.rev footer b{display:block;font-weight:500;font-size:14px}
.rev footer small{display:block;color:var(--mute);font-size:12px}

/* ============================================================
   CUSTOM REQUEST
   ============================================================ */
.req{background:var(--lilac-2)}
.req__inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(26px,4vw,72px);align-items:center}
.req__media{aspect-ratio:4/3.2;overflow:hidden;background:var(--lilac-3)}
.req__media img{width:100%;height:100%;object-fit:cover}
.req__form{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.req__form input{
  flex:1 1 240px;padding:14px 16px;border:1px solid var(--line-2);background:var(--paper);
  font-family:var(--ui);font-size:14.5px;color:var(--ink)
}
.req__form input::placeholder{color:#9A95A6}
.req__hint{margin-top:12px;font-size:12.5px;color:var(--mute)}

/* ============================================================
   SERVICE STRIP
   ============================================================ */
.svc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,32px)}
.svc div{padding-top:18px;border-top:1px solid var(--line-2)}
.svc h3{font-size:16px}
.svc p{margin-top:7px;font-size:13.5px;color:var(--mute)}

/* ============================================================
   NEWSLETTER + FOOTER
   ============================================================ */
.nl{background:var(--ink);color:#EFEDE4;text-align:center}
.nl h2{color:#fff}
.nl .eyb{color:var(--gold-2)}
.nl p{color:rgba(239,237,228,.7);margin:16px auto 0;max-width:44ch;font-size:15px}
.nl__form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.nl__form input{
  width:min(360px,100%);padding:14px 16px;background:transparent;color:#fff;
  border:1px solid rgba(239,237,228,.32);font-family:var(--ui);font-size:14.5px
}
.nl__form input::placeholder{color:rgba(239,237,228,.5)}

.ftr{background:var(--ink);color:rgba(239,237,228,.76);padding:clamp(44px,5vw,72px) 0 0}
.ftr__grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,56px);padding-bottom:44px}
.ftr__brand span{display:block;font-family:var(--dsp);font-size:22px;letter-spacing:.24em;color:#fff}
.ftr__brand p{margin-top:16px;font-size:13.5px;max-width:34ch}
.ftr h3{font-family:var(--sc);font-size:11px;letter-spacing:.15em;color:var(--gold-2);margin-bottom:14px}
.ftr li a{display:block;padding:5px 0;font-size:13.5px;transition:color .2s var(--ease)}
.ftr li a:hover{color:var(--gold-2)}
.ftr__base{
  border-top:1px solid rgba(239,237,228,.16);padding:20px 0 26px;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px
}

/* ============================================================
   CART DRAWER
   ============================================================ */
.cart{
  position:fixed;inset:0 0 0 auto;width:min(92vw,420px);background:var(--paper);z-index:95;
  transform:translateX(100%);transition:transform .4s var(--ease);display:flex;flex-direction:column
}
.cart.is-open{transform:none}
.cart__head{display:flex;align-items:center;justify-content:space-between;padding:22px var(--gut);border-bottom:1px solid var(--line)}
.cart__head h2{font-size:21px}
.cart__body{flex:1;overflow-y:auto;padding:8px var(--gut)}
.cart__row{display:grid;grid-template-columns:70px 1fr auto;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.cart__row img{width:70px;height:88px;object-fit:cover;background:var(--lilac-2)}
.cart__row h3{font-size:15px}
.cart__row small{display:block;margin-top:4px;color:var(--mute);font-size:12.5px}
.cart__row b{font-family:var(--dsp);font-weight:400;font-size:15px}
.cart__foot{padding:20px var(--gut) 28px;border-top:1px solid var(--line)}
.cart__line{display:flex;justify-content:space-between;font-size:14px;padding:5px 0}
.cart__line--total{font-family:var(--dsp);font-size:19px;padding-top:14px;margin-top:10px;border-top:1px solid var(--line)}
.cart__foot .btn{width:100%;margin-top:18px}
.cart__note{margin-top:12px;text-align:center;font-size:12px;color:var(--mute)}
.iconbtn{font-family:var(--sc);font-size:11px;letter-spacing:.13em}

/* ============================================================
   REVEAL
   ============================================================ */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.is-in{opacity:1;transform:none}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(14px,2.4vw,28px)}
  .hero__copy{grid-column:1/-1;order:-1;padding-bottom:8px}
  .hero__panel--b{margin-top:clamp(20px,5vw,52px)}
  .occ{grid-template-columns:repeat(3,minmax(0,1fr))}
  .occ__card:nth-child(4),.occ__card:nth-child(5){aspect-ratio:3/3.4}
  .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mega__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mega__promo{display:none}
  .dye__inner,.camp__inner,.look,.req__inner{grid-template-columns:1fr}
  .camp__media,.req__media{order:-1}
  .look__media{aspect-ratio:4/3.6}
  .svc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ftr__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:880px){
  .pnav{display:none}
  .burger{display:inline-flex}
  .hdr__l a.search-open{display:none}
  .topbar .wrap{gap:0}
    .rev{grid-template-columns:1fr}
  .lb__a,.lb__c,.lb__d{grid-column:span 6}
  .lb__b{grid-column:span 6;margin-top:0}
  .lb__e{grid-column:span 12}
}
@media (max-width:640px){
  .hero__grid{grid-template-columns:1fr}
  .hero__panel--b{display:none}
  .hero__panel--a{aspect-ratio:4/4.2}
  .occ{grid-template-columns:repeat(2,minmax(0,1fr))}
  .occ__card{aspect-ratio:3/4}
  .occ__card:nth-child(5){grid-column:span 2;aspect-ratio:16/9}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .svc{grid-template-columns:1fr}
  .camp__clock{flex-wrap:wrap}
  .camp__unit{min-width:64px}
  .ftr__grid{grid-template-columns:1fr}
  .lb__a,.lb__b,.lb__c,.lb__d,.lb__e{grid-column:span 12;aspect-ratio:4/4.4;margin-top:0}
  .lb__e{aspect-ratio:16/10}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .rv{opacity:1;transform:none}
  .mq__track{animation:none}
}

/* ============================================================
   SHARED PAGE FURNITURE (catalogue / product / cart)
   ============================================================ */
.pagehead{padding:clamp(26px,3.4vw,48px) 0 clamp(20px,2.6vw,34px);border-bottom:1px solid var(--line)}
.crumb{display:flex;flex-wrap:wrap;gap:8px;font-size:12.5px;color:var(--mute)}
.crumb a{transition:color .2s var(--ease)}
.crumb a:hover{color:var(--gold)}
.crumb span{color:var(--line-2)}
.pagehead h1{margin-top:14px;font-size:clamp(30px,4vw,52px)}
.pagehead p{margin-top:12px;color:var(--mute);font-size:15px;max-width:60ch}

.qty{display:inline-flex;align-items:center;border:1px solid var(--line-2);background:var(--paper)}
.qty button{width:38px;height:40px;display:grid;place-items:center;font-size:16px;color:var(--ink);transition:background .2s var(--ease)}
.qty button:hover{background:var(--lilac-2)}
.qty button[disabled]{opacity:.35;cursor:not-allowed}
.qty span{min-width:34px;text-align:center;font-size:14.5px}

.pill{
  display:inline-flex;align-items:center;gap:8px;padding:7px 12px;background:var(--paper);
  border:1px solid var(--line-2);font-size:12.5px;line-height:1
}
.pill button{font-size:15px;line-height:1;color:var(--mute);transition:color .2s var(--ease)}
.pill button:hover{color:var(--madder)}

.note{
  display:flex;gap:12px;align-items:flex-start;padding:14px 16px;
  background:var(--lilac-2);border-left:2px solid var(--gold);font-size:13.5px;color:var(--ink)
}
.note b{font-weight:600}

/* ============================================================
   CATALOGUE
   ============================================================ */
.shop{display:grid;grid-template-columns:262px minmax(0,1fr);gap:clamp(22px,3vw,52px);align-items:start;padding:clamp(28px,3.4vw,48px) 0 clamp(56px,7vw,100px)}

/* ---- filter rail ---- */
.filters{position:sticky;top:132px}
.filters__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--line-2)}
.filters__head h2{font-family:var(--sc);font-size:12px;letter-spacing:.15em}
.clearall{font-size:12.5px;color:var(--mute);border-bottom:1px solid var(--line-2);transition:color .2s var(--ease),border-color .2s var(--ease)}
.clearall:hover{color:var(--madder);border-color:var(--madder)}

.fgroup{border-bottom:1px solid var(--line)}
.fgroup__head{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:15px 0;font-family:var(--sc);font-size:11.5px;letter-spacing:.13em;text-align:left
}
.fgroup__head i{font-style:normal;color:var(--gold);font-size:13px;transition:transform .3s var(--ease)}
.fgroup[open] .fgroup__head i,.fgroup.is-open .fgroup__head i{transform:rotate(45deg)}
.fgroup__body{padding-bottom:16px;display:none}
.fgroup.is-open .fgroup__body{display:block}

.fcheck{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:14px;cursor:pointer}
.fcheck input{
  appearance:none;-webkit-appearance:none;width:15px;height:15px;flex:none;
  border:1px solid var(--line-2);background:var(--paper);position:relative;cursor:pointer;
  transition:border-color .2s var(--ease),background .2s var(--ease)
}
.fcheck input:checked{background:var(--ink);border-color:var(--ink)}
.fcheck input:checked::after{
  content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;
  border:solid #fff;border-width:0 1.4px 1.4px 0;transform:rotate(42deg)
}
.fcheck em{margin-left:auto;font-style:normal;font-size:12px;color:var(--mute)}
.fcheck:hover{color:var(--gold)}

/* multi-level: parent row + nested children */
.fnode__kids{margin:2px 0 8px 25px;padding-left:12px;border-left:1px solid var(--line);display:none}
.fnode.is-open .fnode__kids{display:block}
.fnode__kids .fcheck{font-size:13.5px;color:var(--mute)}
.fnode__kids .fcheck:hover{color:var(--gold)}
.fnode__toggle{
  margin-left:auto;width:20px;height:20px;display:grid;place-items:center;flex:none;
  font-size:12px;color:var(--mute);transition:transform .3s var(--ease),color .2s var(--ease)
}
.fnode.is-open .fnode__toggle{transform:rotate(90deg);color:var(--gold)}
.fnode__row{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:14px}
.fnode__row > label{display:flex;align-items:center;gap:10px;cursor:pointer;flex:1}

/* colour swatch filter */
.fswatch{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 8px;padding-top:4px}
.fswatch label{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;text-align:center}
.fswatch input{position:absolute;opacity:0;pointer-events:none}
.fswatch i{
  width:30px;height:30px;border-radius:50%;display:block;
  box-shadow:inset 0 0 0 1px rgba(28,28,28,.14);transition:box-shadow .25s var(--ease),transform .25s var(--ease)
}
.fswatch label:hover i{transform:translateY(-2px)}
.fswatch input:checked + i{box-shadow:inset 0 0 0 1px rgba(28,28,28,.14),0 0 0 2px var(--paper),0 0 0 3.5px var(--ink)}
.fswatch small{font-size:10.5px;color:var(--mute);line-height:1.2}

/* size grid filter */
.fsize{display:flex;flex-wrap:wrap;gap:7px;padding-top:4px}
.fsize label{cursor:pointer}
.fsize input{position:absolute;opacity:0;pointer-events:none}
.fsize span{
  display:grid;place-items:center;min-width:44px;height:34px;padding:0 9px;
  border:1px solid var(--line-2);background:var(--paper);font-size:12.5px;
  transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)
}
.fsize label:hover span{border-color:var(--ink)}
.fsize input:checked + span{background:var(--ink);border-color:var(--ink);color:#fff}
.fsub{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line-2)}
.fsub h4{font-family:var(--sc);font-size:10.5px;letter-spacing:.14em;color:var(--mute);margin:0 0 9px}

/* price range */
.frange{padding-top:8px}
.frange__track{position:relative;height:26px}
.frange input[type=range]{
  position:absolute;left:0;right:0;top:9px;width:100%;height:3px;margin:0;
  appearance:none;-webkit-appearance:none;background:none;pointer-events:none
}
.frange__track::before{content:"";position:absolute;left:0;right:0;top:11px;height:2px;background:var(--line-2)}
.frange__fill{position:absolute;top:11px;height:2px;background:var(--gold)}
.frange input[type=range]::-webkit-slider-thumb{
  appearance:none;-webkit-appearance:none;width:15px;height:15px;border-radius:50%;
  background:var(--ink);border:2px solid var(--paper);box-shadow:0 1px 5px rgba(28,28,28,.4);
  pointer-events:auto;cursor:pointer
}
.frange input[type=range]::-moz-range-thumb{
  width:15px;height:15px;border-radius:50%;background:var(--ink);border:2px solid var(--paper);
  pointer-events:auto;cursor:pointer
}
.frange__out{display:flex;justify-content:space-between;font-size:12.5px;color:var(--mute);margin-top:8px}

/* ---- results column ---- */
.toolbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-bottom:16px;border-bottom:1px solid var(--line)
}
.toolbar__count{font-size:13.5px;color:var(--mute)}
.toolbar__count b{color:var(--ink);font-weight:600}
.toolbar__right{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.selectwrap{position:relative}
.selectwrap::after{content:"⌄";position:absolute;right:12px;top:8px;pointer-events:none;color:var(--mute);font-size:13px}
.selectwrap select{
  appearance:none;-webkit-appearance:none;padding:10px 34px 10px 14px;
  border:1px solid var(--line-2);background:var(--paper);font-family:var(--ui);font-size:13.5px;
  color:var(--ink);cursor:pointer
}
.viewtog{display:flex;border:1px solid var(--line-2);background:var(--paper)}
.viewtog button{width:38px;height:39px;display:grid;place-items:center;color:var(--mute);transition:background .2s var(--ease),color .2s var(--ease)}
.viewtog button.is-on{background:var(--ink);color:#fff}
.fopen{display:none}

.chips{display:flex;flex-wrap:wrap;gap:8px;padding:16px 0 0}
.chips:empty{padding:0}

.plist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,28px);padding-top:24px}
.plist--list{grid-template-columns:1fr;gap:0}
.plist--list .card{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:22px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}
.plist--list .card figure{aspect-ratio:3/3.8}
.plist--list .card__quick{opacity:1;transform:none;position:static;background:none;padding:0;margin-top:12px;text-align:left}
.plist--list .card__body{padding-top:0}
.plist--list .card__desc{display:block;margin-top:9px;font-size:13.5px;color:var(--mute);max-width:56ch}
.plist--list .card__right{text-align:right}
.card__desc{display:none}

.empty{padding:70px 0;text-align:center}
.empty h3{font-size:24px}
.empty p{margin-top:12px;color:var(--mute);font-size:14.5px}
.empty .btn{margin-top:22px}

.pager{display:flex;align-items:center;justify-content:center;gap:7px;padding-top:44px}
.pager button{
  min-width:38px;height:38px;padding:0 12px;border:1px solid var(--line-2);background:var(--paper);
  font-size:13.5px;transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)
}
.pager button:hover:not([disabled]){border-color:var(--ink)}
.pager button.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.pager button[disabled]{opacity:.35;cursor:not-allowed}

/* mobile filter sheet */
.fsheet__head{display:none}
@media (max-width:980px){
  .shop{grid-template-columns:1fr}
  .fopen{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border:1px solid var(--line-2);background:var(--paper);font-size:13.5px}
  .filters{
    position:fixed;inset:auto 0 0 0;max-height:86vh;z-index:96;background:var(--paper);
    transform:translateY(100%);transition:transform .4s var(--ease);
    display:flex;flex-direction:column;overflow:hidden
  }
  .filters.is-open{transform:none}
  .fsheet__head{display:flex;align-items:center;justify-content:space-between;padding:18px var(--gut);border-bottom:1px solid var(--line)}
  .fsheet__head span{font-family:var(--sc);font-size:12px;letter-spacing:.15em}
  .filters__scroll{overflow-y:auto;padding:0 var(--gut)}
  .filters__foot{padding:16px var(--gut) 22px;border-top:1px solid var(--line)}
  .filters__foot .btn{width:100%}
  .plist{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plist--list .card{grid-template-columns:110px minmax(0,1fr);gap:16px}
  .plist--list .card__right{grid-column:2;text-align:left}
}
@media (max-width:560px){
  .plist{gap:12px}
  .toolbar{gap:10px}
  .toolbar__right{width:100%;justify-content:space-between}
}

/* ============================================================
   PRODUCT DETAIL
   ============================================================ */
.pdp{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(26px,3.6vw,64px);align-items:start;padding:clamp(26px,3.4vw,44px) 0 clamp(50px,6vw,86px)}

.gal{display:grid;grid-template-columns:78px minmax(0,1fr);gap:14px;align-items:start}
.gal__thumbs{display:flex;flex-direction:column;gap:10px}
.gal__thumbs button{
  aspect-ratio:3/4;overflow:hidden;background:var(--lilac-2);border:1px solid transparent;
  transition:border-color .25s var(--ease),opacity .25s var(--ease);opacity:.72
}
.gal__thumbs button img{width:100%;height:100%;object-fit:cover}
.gal__thumbs button.is-on{border-color:var(--ink);opacity:1}
.gal__thumbs button:hover{opacity:1}
.gal__main{position:relative;overflow:hidden;background:var(--lilac-2);aspect-ratio:3/4}
.gal__main img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.gal__main.is-zoom img{transform:scale(1.9)}
.gal__zoomhint{
  position:absolute;right:12px;bottom:12px;background:rgba(255,255,255,.92);
  font-family:var(--sc);font-size:10.5px;letter-spacing:.12em;padding:7px 11px
}
.gal__flag{position:absolute;top:14px;left:14px;background:var(--paper);font-family:var(--sc);font-size:10px;letter-spacing:.12em;padding:6px 11px}

.pdp__info .eyb{display:block}
.pdp__info h1{margin-top:10px;font-size:clamp(28px,3.2vw,42px)}
.pdp__rate{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:13px;color:var(--mute)}
.pdp__rate span{color:var(--gold);letter-spacing:.2em}
.pdp__price{margin-top:18px;font-family:var(--dsp);font-size:28px}
.pdp__price small{font-family:var(--ui);font-size:12.5px;color:var(--mute);margin-left:10px}
.pdp__lede{margin-top:16px;color:var(--mute);font-size:15px;line-height:1.68}

.opt{margin-top:26px}
.opt__label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:11px}
.opt__label h3{font-family:var(--sc);font-size:11px;letter-spacing:.14em}
.opt__label span{font-size:13px;color:var(--mute)}
.opt__label a{font-size:12.5px;border-bottom:1px solid var(--line-2);transition:color .2s var(--ease)}
.opt__label a:hover{color:var(--gold)}

.swrow{display:flex;gap:12px;flex-wrap:wrap}
.swrow label{cursor:pointer;display:block}
.swrow input{position:absolute;opacity:0;pointer-events:none}
.swrow i{
  display:block;width:32px;height:32px;border-radius:50%;
  box-shadow:inset 0 0 0 1px rgba(28,28,28,.14);transition:box-shadow .25s var(--ease)
}
.swrow input:checked + i{box-shadow:inset 0 0 0 1px rgba(28,28,28,.14),0 0 0 2px var(--lilac),0 0 0 3.5px var(--ink)}

.szrow{display:flex;gap:8px;flex-wrap:wrap}
.szrow label{cursor:pointer}
.szrow input{position:absolute;opacity:0;pointer-events:none}
.szrow span{
  display:grid;place-items:center;min-width:52px;height:42px;padding:0 12px;
  border:1px solid var(--line-2);background:var(--paper);font-size:13.5px;
  transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)
}
.szrow label:hover span{border-color:var(--ink)}
.szrow input:checked + span{background:var(--ink);border-color:var(--ink);color:#fff}
.szrow input:disabled + span{opacity:.4;cursor:not-allowed;text-decoration:line-through}

.pdp__buy{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:28px}
.pdp__buy .btn{flex:1 1 220px}
.pdp__stock{margin-top:14px;font-size:13px;color:var(--madder)}
.pdp__ship{margin-top:20px;display:grid;gap:9px;font-size:13.5px;color:var(--mute)}
.pdp__ship div{display:flex;gap:10px;align-items:flex-start}
.pdp__ship div::before{content:"";width:4px;height:4px;margin-top:8px;background:var(--gold);transform:rotate(45deg);flex:none}
.pdp__ship b{color:var(--ink);font-weight:500}

.accord{margin-top:30px;border-top:1px solid var(--line-2)}
.accord__item{border-bottom:1px solid var(--line-2)}
.accord__head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0;text-align:left;font-family:var(--sc);font-size:11.5px;letter-spacing:.13em}
.accord__head i{font-style:normal;color:var(--gold);transition:transform .3s var(--ease)}
.accord__item.is-open .accord__head i{transform:rotate(45deg)}
.accord__body{display:none;padding-bottom:18px;font-size:14px;color:var(--mute);line-height:1.7}
.accord__item.is-open .accord__body{display:block}
.accord__body dl{display:grid;grid-template-columns:auto 1fr;gap:6px 20px;margin:0}
.accord__body dt{color:var(--ink);font-weight:500}
.accord__body dd{margin:0}

/* size guide drawer */
.guide{
  position:fixed;inset:0 0 0 auto;width:min(92vw,440px);background:var(--paper);z-index:95;
  transform:translateX(100%);transition:transform .4s var(--ease);display:flex;flex-direction:column
}
.guide.is-open{transform:none}
.guide__head{display:flex;align-items:center;justify-content:space-between;padding:22px var(--gut);border-bottom:1px solid var(--line)}
.guide__head h2{font-size:20px}
.guide__body{overflow-y:auto;padding:20px var(--gut) 40px}
.guide table{width:100%;border-collapse:collapse;font-size:13.5px}
.guide th,.guide td{padding:10px 8px;text-align:left;border-bottom:1px solid var(--line)}
.guide th{font-family:var(--sc);font-size:10.5px;letter-spacing:.12em;color:var(--mute)}
.guide p{margin-top:18px;font-size:13.5px;color:var(--mute);line-height:1.7}

/* reviews block */
.rbd{display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(24px,3vw,52px);align-items:start}
.rbd__score b{display:block;font-family:var(--dsp);font-size:52px;line-height:1}
.rbd__score span{color:var(--gold);letter-spacing:.2em;display:block;margin-top:6px}
.rbd__score small{display:block;margin-top:8px;color:var(--mute);font-size:13px}
.rbd__bars{display:grid;gap:8px;max-width:420px}
.rbd__bar{display:grid;grid-template-columns:34px 1fr 38px;gap:12px;align-items:center;font-size:12.5px;color:var(--mute)}
.rbd__bar i{height:4px;background:var(--line-2);display:block;position:relative;overflow:hidden}
.rbd__bar i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w,0);background:var(--gold)}

@media (max-width:980px){
  .pdp{grid-template-columns:1fr;gap:30px}
  .gal{position:static}
  .rbd{grid-template-columns:1fr}
}
@media (max-width:560px){
  .gal{grid-template-columns:1fr}
  .gal__thumbs{flex-direction:row;order:2;overflow-x:auto}
  .gal__thumbs button{width:66px;flex:none}
}

/* ============================================================
   CART PAGE
   ============================================================ */
.cartpg{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.85fr);gap:clamp(26px,3.6vw,60px);align-items:start;padding:clamp(26px,3.4vw,44px) 0 clamp(56px,7vw,100px)}

.progress{margin-bottom:26px}
.progress p{font-size:13.5px;color:var(--mute);margin-bottom:9px}
.progress p b{color:var(--ink);font-weight:600}
.progress div{height:3px;background:var(--line-2);position:relative;overflow:hidden}
.progress div i{position:absolute;inset:0 auto 0 0;background:var(--gold);transition:width .6s var(--ease)}

.clines{border-top:1px solid var(--line-2)}
.cline{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:20px;padding:22px 0;border-bottom:1px solid var(--line-2);align-items:start}
.cline__img{aspect-ratio:3/3.7;overflow:hidden;background:var(--lilac-2)}
.cline__img img{width:100%;height:100%;object-fit:cover}
.cline h3{font-size:17px}
.cline h3 a:hover{color:var(--gold)}
.cline__meta{margin-top:7px;font-size:13px;color:var(--mute);display:grid;gap:3px}
.cline__acts{display:flex;align-items:center;gap:16px;margin-top:14px;flex-wrap:wrap}
.cline__acts button{font-size:12.5px;color:var(--mute);border-bottom:1px solid var(--line-2);transition:color .2s var(--ease),border-color .2s var(--ease)}
.cline__acts button:hover{color:var(--madder);border-color:var(--madder)}
.cline__price{text-align:right}
.cline__price b{font-family:var(--dsp);font-weight:400;font-size:18px;display:block}
.cline__price small{display:block;margin-top:6px;font-size:12px;color:var(--mute)}
.cline__flag{
  display:inline-block;margin-top:10px;padding:5px 10px;background:var(--forest);color:#EFEDE4;
  font-family:var(--sc);font-size:10px;letter-spacing:.12em
}

.summary{position:sticky;top:132px;background:var(--paper);border:1px solid var(--line);padding:clamp(22px,2.4vw,30px)}
.summary h2{font-size:22px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.sline{display:flex;justify-content:space-between;gap:14px;padding:9px 0;font-size:14px}
.sline span:last-child{font-variant-numeric:tabular-nums}
.sline--muted span{color:var(--mute)}
.sline--total{font-family:var(--dsp);font-size:21px;padding-top:15px;margin-top:12px;border-top:1px solid var(--line)}
.summary .btn{width:100%;margin-top:20px}
.summary__note{margin-top:14px;font-size:12px;color:var(--mute);text-align:center;line-height:1.6}
.promo{display:flex;gap:8px;margin:18px 0 6px}
.promo input{flex:1;min-width:0;padding:12px 14px;border:1px solid var(--line-2);background:var(--lilac-3);font-family:var(--ui);font-size:13.5px;color:var(--ink)}
.promo button{padding:0 16px;border:1px solid var(--ink);background:var(--ink);color:#fff;font-family:var(--sc);font-size:11px;letter-spacing:.12em}
.promo__msg{font-size:12.5px;margin-top:2px}
.promo__msg.is-ok{color:var(--forest)}
.promo__msg.is-bad{color:var(--madder)}

.saved{padding-top:34px}
.saved h2{font-size:22px;margin-bottom:16px}
.saved__row{display:grid;grid-template-columns:74px minmax(0,1fr) auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.saved__row img{width:74px;height:90px;object-fit:cover;background:var(--lilac-2)}
.saved__row h3{font-size:15px}
.saved__row small{display:block;margin-top:4px;color:var(--mute);font-size:12.5px}
.saved__row b{font-family:var(--dsp);font-weight:400;font-size:15px}

.cart-empty{text-align:center;padding:70px 0}
.cart-empty h2{font-size:28px}
.cart-empty p{margin-top:12px;color:var(--mute)}
.cart-empty .btn{margin-top:24px}

@media (max-width:980px){
  .cartpg{grid-template-columns:1fr}
  .summary{position:static}
}
@media (max-width:560px){
  .cline{grid-template-columns:84px minmax(0,1fr);gap:14px}
  .cline__price{grid-column:2;text-align:left;margin-top:10px}
  .cline__price small{margin-top:3px}
}