/* ============================================================
   CART · CHECKOUT · ACCOUNT · AUTH · ORDER
   ============================================================ */
.cartp{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(20px,2.6vw,56px);
  padding-bottom:var(--sec);align-items:start}
.cartp__main{grid-column:1/8}
.cartp__side{grid-column:8/13;position:sticky;top:calc(var(--bar-h-stuck) + 24px)}
.clines{border-top:1px solid var(--line)}
.cl{display:grid;grid-template-columns:110px 1fr;gap:clamp(14px,1.8vw,26px);padding:clamp(18px,2vw,26px) 0;
  border-bottom:1px solid var(--line-soft)}
.cl__img{border-radius:var(--radius-md);aspect-ratio:4/5;overflow:hidden;background:var(--ivory)}
.cl__img img{width:100%;height:100%;object-fit:cover}
.cl__b{display:grid;gap:6px;align-content:start}
.cl__top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}
.cl__brand{font-size:var(--t-label);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-45)}
.cl__n{font-size:clamp(1rem,.8vw + .84rem,1.125rem);font-weight:500;line-height:1.3}
.cl__v{font-size:var(--t-meta);color:var(--ink-45)}
.cl__p{font-size:var(--t-meta);font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.cl__row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:8px;flex-wrap:wrap}
.cl__actions{display:flex;gap:16px;align-items:center}
.cl__rm{font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-45);
  text-decoration:underline;text-underline-offset:3px;transition:color .3s}
.cl__rm:hover{color:var(--accent)}

.summ{background:var(--ivory);padding:clamp(20px,2.4vw,32px);display:grid;gap:14px}
.summ__h{font-size:var(--t-label);letter-spacing:.16em;text-transform:uppercase;font-weight:500}
.summ__row{display:flex;justify-content:space-between;gap:16px;font-size:var(--t-meta);color:var(--ink-70)}
.summ__row b{color:var(--ink);font-weight:500;font-variant-numeric:tabular-nums}
.summ__row--total{border-top:1px solid var(--line);padding-top:14px;margin-top:4px;
  font-size:var(--t-body);color:var(--ink)}
.summ__row--total b{font-size:1.25rem}
.summ__row--free b{color:#5B7A4F}
.promo{display:grid;grid-template-columns:1fr auto;gap:8px;padding-top:6px}
.promo input{height:46px;padding:0 14px;background:var(--milk);border:0;box-shadow:inset 0 0 0 1px var(--line);
  outline:none;font-size:var(--t-meta);width:100%}
.promo input:focus{box-shadow:inset 0 0 0 1px var(--ink)}
.promo button{height:46px;padding:0 18px;background:var(--ink);color:var(--milk);font-size:var(--t-label);
  letter-spacing:.14em;text-transform:uppercase;font-weight:500;transition:background .3s}
.promo button:hover{background:var(--accent)}
.promo__msg{font-size:var(--t-label);letter-spacing:.05em;min-height:1em}
.promo__msg.ok{color:#5B7A4F}
.promo__msg.err{color:#B4553F}
.summ__notes{display:grid;gap:10px;padding-top:6px;border-top:1px solid var(--line-soft);margin-top:4px}

/* checkout */
.co{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(20px,2.6vw,60px);padding-bottom:var(--sec);
  align-items:start}
.co__main{grid-column:1/8;display:grid;gap:clamp(22px,2.6vw,40px)}
.co__side{grid-column:8/13;position:sticky;top:calc(var(--bar-h-stuck) + 24px)}
/* three labelled steps do not fit one line on a 320px phone, so the row wraps */
.co__steps{display:flex;flex-wrap:wrap;gap:10px clamp(14px,2vw,30px);
  border-bottom:1px solid var(--line-soft);padding-bottom:16px}
.co__step{display:inline-flex;align-items:baseline;gap:9px;font-size:var(--t-label);letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-25)}
.co__step b{font-variant-numeric:tabular-nums}
.co__step.is-on{color:var(--ink)}
.co__step.is-done{color:var(--ink-45)}
.co__sec{display:grid;gap:14px}
.co__h{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.co__h h2{font-family:var(--display);font-weight:300;font-size:var(--d4);letter-spacing:-.015em}
.co__edit{font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-45);
  text-decoration:underline;text-underline-offset:3px}
.pick{display:grid;gap:8px}
.pick__o{display:flex;align-items:center;gap:14px;padding:16px;cursor:pointer;position:relative;
  box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .3s var(--ease),background .3s}
.pick__o:hover{box-shadow:inset 0 0 0 1px var(--ink-25)}
.pick__o input{position:absolute;opacity:0}
.pick__dot{width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);flex:none;
  display:grid;place-items:center;transition:box-shadow .3s}
.pick__dot::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--ink);transform:scale(0);
  transition:transform .3s var(--slow)}
.pick__o input:checked~.pick__dot{box-shadow:inset 0 0 0 1px var(--ink)}
.pick__o input:checked~.pick__dot::after{transform:scale(1)}
.pick__o:has(input:checked){box-shadow:inset 0 0 0 1px var(--ink);background:var(--ivory)}
.pick__o input:focus-visible~.pick__dot{outline:2px solid var(--accent);outline-offset:2px}
.pick__b{display:grid;gap:3px;flex:1}
.pick__b b{font-size:var(--t-meta);font-weight:500}
.pick__b span{font-size:var(--t-label);color:var(--ink-45);letter-spacing:.04em}
.pick__p{font-size:var(--t-meta);font-variant-numeric:tabular-nums;white-space:nowrap}
.co__msum{display:none}
.co__legal{font-size:var(--t-label);color:var(--ink-45);letter-spacing:.04em;line-height:1.6}

/* account + auth */
.auth{display:grid;grid-template-columns:repeat(12,1fr);min-height:calc(100svh - var(--bar-h))}
/* the auth screen runs edge to edge: square corners against the viewport and
   against the footer, and the photograph carries nothing over it */
.auth__fig{grid-column:1/7;position:relative;overflow:hidden;background:var(--ivory)}
.auth__fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.auth__body{grid-column:8/12;display:grid;align-content:center;gap:clamp(16px,2vw,26px);
  padding-block:clamp(40px,6vw,90px)}
.auth__t{font-family:var(--display);font-weight:300;font-size:var(--d1);line-height:1;letter-spacing:-.02em}
.auth__lede{color:var(--ink-70);font-size:var(--t-body);line-height:1.6;max-width:46ch;margin-top:-6px}
.auth__form{display:grid;gap:12px}
.auth__row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:var(--t-meta)}
.auth__alt{font-size:var(--t-meta);color:var(--ink-45)}
.auth__alt a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.auth__ben{display:grid;gap:10px;border-top:1px solid var(--line-soft);padding-top:18px}
.auth__ben li{display:flex;gap:11px;font-size:var(--t-meta);color:var(--ink-70);align-items:baseline}
.auth__ben i{width:3px;height:3px;border-radius:50%;background:var(--accent);flex:none;translate:0 -3px}
@media (max-width:900px){
  .auth{grid-template-columns:1fr;min-height:0}
  .auth__fig{grid-column:1/13;aspect-ratio:16/9}
  .auth__body{grid-column:1/13;padding-inline:var(--gutter);padding-block:clamp(30px,6vw,56px)}
}

.acc-layout{display:grid;grid-template-columns:230px 1fr;gap:clamp(24px,3vw,60px);padding-bottom:var(--sec);
  align-items:start}
.acc-nav{position:sticky;top:calc(var(--bar-h-stuck) + 24px);display:grid;gap:2px;border-top:1px solid var(--line-soft)}
.acc-nav a,.acc-nav button{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;
  border-bottom:1px solid var(--line-soft);font-size:var(--t-meta);color:var(--ink-70);
  transition:color .3s,padding-left .4s var(--slow)}
.acc-nav a:hover,.acc-nav button:hover{color:var(--ink);padding-left:8px}
.acc-nav a.is-on,.acc-nav button.is-on{color:var(--ink);font-weight:500}
.acc-nav a svg,.acc-nav button svg{width:12px;height:12px;opacity:0;transition:opacity .3s}
.acc-nav a.is-on svg,.acc-nav a:hover svg,.acc-nav button.is-on svg,.acc-nav button:hover svg{opacity:1}
.ocard{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(14px,2vw,30px);align-items:center;
  padding:clamp(18px,2vw,26px) 0;border-bottom:1px solid var(--line-soft)}
.ocard__id{grid-column:span 3;display:grid;gap:4px}
.ocard__id b{font-weight:500;font-size:var(--t-meta)}
.ocard__id span{font-size:var(--t-label);color:var(--ink-45);letter-spacing:.06em}
.ocard__status{grid-column:span 2}
.badge{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 11px;font-size:var(--t-label);
  letter-spacing:.1em;text-transform:uppercase;background:var(--ivory);color:var(--ink-70)}
.badge--ok{background:#E7EDE3;color:#43583A}
.badge--go{background:var(--clay-wash);color:var(--accent)}
.ocard__thumbs{grid-column:span 3;display:flex;gap:6px}
.ocard__thumbs img{width:42px;height:52px;object-fit:cover;background:var(--ivory)}
.ocard__tot{grid-column:span 2;font-size:var(--t-meta);font-weight:500;font-variant-numeric:tabular-nums}
.ocard__go{grid-column:span 2;justify-self:end}
.acc-stat{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line);
  margin-bottom:clamp(22px,2.6vw,40px)}
/* the same air on both sides of every rule, including the outer edges */
.acc-stat div{padding:clamp(22px,2.4vw,32px) var(--col-pad);
  border-right:1px solid var(--line-soft);display:grid;gap:10px;align-content:start}
.acc-stat div:last-child{border-right:0}
@media (max-width:640px){
  .acc-stat{grid-template-columns:1fr}
  .acc-stat div{border-right:0;border-bottom:1px solid var(--line-soft);padding-inline:0}
  .acc-stat div:last-child{border-bottom:0}
}
.acc-stat b{font-family:var(--display);font-weight:300;font-size:1.9rem;line-height:1;font-variant-numeric:tabular-nums}
.acc-stat span{font-size:var(--t-label);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-45)}
.addr{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.addr__c{padding:18px;box-shadow:inset 0 0 0 1px var(--line);display:grid;gap:6px;font-size:var(--t-meta);
  color:var(--ink-70)}
.addr__c b{color:var(--ink);font-weight:500}

@media (max-width:1024px){
  .cartp__main,.cartp__side,.co__main,.co__side{grid-column:1/13}
  .cartp__side,.co__side{position:static}
  .acc-layout{grid-template-columns:1fr}
  .acc-nav{position:static;display:flex;overflow-x:auto;gap:18px;border-top:0;
    border-bottom:1px solid var(--line-soft);scrollbar-width:none}
  .acc-nav::-webkit-scrollbar{display:none}
  .acc-nav a,.acc-nav button{border:0;white-space:nowrap;padding:10px 0;width:auto}
  .acc-nav a svg,.acc-nav button svg{display:none}
  .co__msum{display:block;margin-bottom:18px}
  .co__side{display:none}
  .ocard{grid-template-columns:1fr auto;gap:12px}
  .ocard__id,.ocard__status,.ocard__thumbs,.ocard__tot,.ocard__go{grid-column:auto}
  .ocard__thumbs{grid-column:1/3}
  .addr{grid-template-columns:1fr}
}
@media (max-width:560px){
  .cl{grid-template-columns:84px 1fr;gap:14px}
  .acc-stat{grid-template-columns:1fr;gap:0}
  .acc-stat div{border-right:0;border-bottom:1px solid var(--line-soft);
    display:flex;justify-content:space-between;align-items:baseline;padding-right:0}
}

/* ---------- minimal checkout chrome ---------- */
body.co-page .nav,
body.co-page .burger,
body.co-page .news,
body.co-page .util a[href="/wishlist/"],
body.co-page .util a[href="/account/"]{display:none}
body.co-page .bar__in{grid-template-columns:1fr auto}
body.co-page .foot{padding-top:clamp(30px,4vw,54px)}
body.co-page .co{padding-top:clamp(26px,3.4vw,52px)}
body.co-page .foot__grid{display:none}
body.co-page .foot__legal{margin-top:0;border-top:0}

/* ---------- order confirmation banner ---------- */
.placed{background:var(--dark);color:var(--on-dark)}
.placed__in{display:flex;align-items:center;gap:clamp(12px,1.6vw,22px);padding-block:clamp(14px,1.6vw,20px);flex-wrap:wrap}
.placed svg{width:17px;height:17px;stroke:var(--accent-soft);fill:none;stroke-width:1.6;flex:none}
.placed b{display:block;font-weight:500;font-size:var(--t-meta)}
.placed span{display:block;font-size:var(--t-label);letter-spacing:.04em;color:rgba(242,237,230,.64);margin-top:3px}
.placed .link{color:var(--on-dark);margin-left:auto}
