/* ══════════════════════════════════════════
   CART PAGE
══════════════════════════════════════════ */
.cart-page{padding:80px 40px 64px}
.page-head{margin-bottom:48px}
.cart-layout{display:grid;grid-template-columns:1fr 360px;gap:40px;align-items:start}
.cart-item{
  display:grid;grid-template-columns:88px 1fr auto;
  gap:20px;align-items:start;
  padding:20px 0;border-bottom:1px solid var(--cream3);
}
.ci-img{width:88px;height:108px;object-fit:cover;border-radius:var(--r);background:var(--cream2)}
.ci-name{font-family:var(--f-display);font-size:16px;font-weight:700;color:var(--navy);margin-bottom:4px}
.ci-meta{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--navy-dim);margin-bottom:12px}
.ci-qty{display:flex;align-items:center}
.ci-qty button{
  width:30px;height:30px;background:#fff;
  border:1.5px solid var(--cream3);
  color:var(--navy);font-size:14px;
  border-radius:var(--r);
  transition:all .2s;
}
.ci-qty button:hover{background:var(--gold);color:#fff;border-color:var(--gold)}
.ci-qty span{
  width:40px;height:30px;
  border-top:1.5px solid var(--cream3);border-bottom:1.5px solid var(--cream3);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;color:var(--navy);
}
.ci-price{font-size:15px;font-weight:700;color:var(--gold);margin-bottom:6px}
.ci-rm{background:none;border:none;font-size:18px;color:var(--navy-dim);transition:color .2s}
.ci-rm:hover{color:#c0392b}
.cart-sum{
  background:var(--cream2);
  padding:28px;border:1px solid var(--cream3);
  border-radius:calc(var(--r)*2);
  position:sticky;top:100px;
}
.cs-title{
  font-family:var(--f-display);
  font-size:18px;font-weight:800;color:var(--navy);
  margin-bottom:20px;padding-bottom:14px;
  border-bottom:1px solid var(--cream3);
}
.cs-row{display:flex;justify-content:space-between;font-size:13px;color:var(--navy);margin-bottom:10px}
.cs-row.tot{
  font-weight:700;font-size:15px;
  padding-top:14px;margin-top:6px;
  border-top:2px solid var(--navy);
}
.cs-row.tot .val{color:var(--gold)}
.cs-free{font-size:11px;color:var(--gold);margin-top:8px;text-align:center;font-weight:600}

/* ══════════════════════════════════════════
   CHECKOUT PAGE
══════════════════════════════════════════ */
.co-page{padding:80px 40px 64px}
.co-layout{display:grid;grid-template-columns:1fr 360px;gap:48px;align-items:start;margin-top:40px}
.co-sect{margin-bottom:32px;padding-bottom:32px;border-bottom:1px solid var(--cream3)}
.co-sect-title{
  font-family:var(--f-display);
  font-size:16px;font-weight:800;color:var(--navy);
  margin-bottom:18px;
}
.co-meths{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.co-meth{
  display:flex;align-items:center;gap:10px;
  padding:14px 12px;background:#fff;
  border:1.5px solid var(--cream3);
  border-radius:var(--r);
  font-size:12px;font-weight:500;color:var(--navy-dim);
  cursor:pointer;transition:all .2s;
}
.co-meth:hover{border-color:var(--navy-dim2);color:var(--navy)}
.co-meth-on{border-color:var(--gold) !important;color:var(--navy) !important;background:var(--gold-light)}
.co-meth-on svg{stroke:var(--gold)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.form-g{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.form-label{font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--navy-dim)}
.form-inp{
  background:#fff;border:1.5px solid var(--cream3);
  color:var(--navy);font-size:14px;
  padding:12px 14px;border-radius:var(--r);
  outline:none;transition:border-color .2s;
}
.form-inp:focus{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-light)}
textarea.form-inp{resize:vertical;min-height:80px}
select.form-inp{appearance:none;cursor:pointer}
.co-summary{
  background:var(--cream2);
  border:1px solid var(--cream3);
  border-radius:calc(var(--r)*2);
  padding:28px;position:sticky;top:100px;
}
.co-sum-title{
  font-family:var(--f-display);
  font-size:18px;font-weight:800;color:var(--navy);
  margin-bottom:20px;padding-bottom:14px;
  border-bottom:1px solid var(--cream3);
}
.co-sum-total{
  display:flex;justify-content:space-between;
  font-weight:700;font-size:16px;color:var(--navy);
  padding-top:14px;margin-top:6px;
  border-top:2px solid var(--navy);
}
.co-sum-note{font-size:11px;color:var(--gold);margin-top:14px;text-align:center;font-weight:600}