/* ============================================================
   SENSE Personal Care — site styles
   Design tokens carried over from the original handoff.
   Mobile-first; desktop enhancements start at 760px / 1000px.
   ============================================================ */

/* ---------- fonts (self-hosted, from the original bundle) ---------- */
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:300 600; font-display:swap;
  src:url("9f42a1d5-5987-4134-954c-ef2aa75a646b.woff2") format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:300 600; font-display:swap;
  src:url("aa7d2999-affa-4c3d-8922-94203a01e008.woff2") format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Space Grotesk'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url("999edfeb-78b0-4b2f-bb86-fd7cfe6d70b1.woff2") format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Space Grotesk'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url("69b95001-74a7-4f70-a4dd-5c59766c97ae.woff2") format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

/* ---------- tokens ---------- */
:root{
  --bg:#F6F1EE; --ink:#153E35; --terra:#A05F43; --green:#006241;
  --muted:#6b7d76; --muted2:#4a5c56; --line:#EAEAEB;
  --sand:#EFE4D6; --sand2:#E8DFD3; --sand3:#E9DECF; --panel:#EFECE8;
  --wrap:1360px; --pad:20px; --r:20px;
  --sans:'DM Sans',system-ui,-apple-system,sans-serif;
  --disp:'Space Grotesk','DM Sans',system-ui,sans-serif;
}
@media (min-width:760px){ :root{ --pad:30px; } }

/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--sans); font-weight:300; color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased; overflow-x:hidden; line-height:1.55;
}
img{ max-width:100%; display:block; }
a{ color:var(--ink); text-decoration:none; transition:color .15s ease; }
a:hover{ color:var(--terra); }
::selection{ background:var(--terra); color:var(--bg); }
h1,h2,h3,h4,h5{ font-family:var(--disp); font-weight:500; letter-spacing:-.02em; margin:0; line-height:1.08; }
p{ margin:0; }
button{ font:inherit; cursor:pointer; }
.skip{ position:absolute; left:-9999px; }
.skip:focus{ left:12px; top:12px; z-index:200; background:var(--ink); color:var(--bg); padding:10px 16px; border-radius:8px; }
:focus-visible{ outline:2px solid var(--terra); outline-offset:3px; border-radius:4px; }

.wrap{ max-width:var(--wrap); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }
.eyebrow{ font-family:var(--sans); font-weight:600; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--terra); }
.lede{ font-size:clamp(15px,1.5vw,18px); line-height:1.65; color:var(--muted2); }
.muted{ color:var(--muted); }

/* ---------- buttons ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--sans); font-weight:500; font-size:15px; padding:15px 28px;
  border-radius:100px; border:1px solid transparent; text-align:center; }
.btn-terra{ background:var(--terra); color:var(--bg); }
.btn-terra:hover{ background:#8d5039; color:var(--bg); }
.btn-ink{ background:var(--ink); color:var(--bg); }
.btn-ink:hover{ background:#0d2b25; color:var(--bg); }
.btn-ghost{ border-color:rgba(21,62,53,.25); color:var(--ink); }
.btn-ghost:hover{ border-color:var(--ink); background:rgba(21,62,53,.04); color:var(--ink); }

/* ---------- top bar ---------- */
.topbar{ background:var(--ink); color:var(--bg); text-align:center;
  font-size:11.5px; letter-spacing:.05em; padding:8px 16px; line-height:1.4; }

/* ---------- header ---------- */
.hdr{ position:sticky; top:0; z-index:50; background:rgba(246,241,238,.94);
  backdrop-filter:saturate(140%) blur(10px); border-bottom:1px solid var(--line); }
.hdr-in{ max-width:var(--wrap); margin:0 auto; padding:12px var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:16px; }
.hdr-nav,.hdr-right{ display:none; }
.hdr-logo{ display:flex; align-items:center; }
.hdr-logo img{ height:26px; width:auto; }
.navlink{ font-family:var(--sans); font-weight:400; font-size:14px; color:var(--ink); white-space:nowrap; }
.navlink.is-active{ color:var(--green); }

.burger{ width:40px; height:40px; border:none; background:none; padding:8px;
  display:flex; flex-direction:column; justify-content:center; gap:5px; margin-right:-8px; }
.burger span{ display:block; height:1.5px; background:var(--ink); border-radius:2px; transition:transform .25s ease,opacity .2s ease; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* mobile drawer */
.mobnav{ display:none; flex-direction:column; background:var(--bg);
  border-bottom:1px solid var(--line); padding:6px var(--pad) 18px; }
.mobnav.is-open{ display:flex; }
.mobnav a{ font-family:var(--disp); font-weight:500; font-size:19px; padding:11px 0; border-bottom:1px solid var(--line); }
.mobnav-sep{ font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--terra); margin:20px 0 4px; }

/* mega menu (desktop only) */
.mega{ display:none; }

@media (min-width:1000px){
  .hdr-in{ display:grid; grid-template-columns:1fr auto 1fr; padding:16px var(--pad); }
  .hdr-nav{ display:flex; align-items:center; gap:24px; }
  .hdr-right{ display:flex; align-items:center; gap:20px; justify-self:end; }
  .hdr-logo{ justify-self:center; }
  .hdr-logo img{ height:34px; }
  .burger,.mobnav{ display:none !important; }

  .mega{ display:block; position:absolute; top:100%; left:0; right:0; background:var(--bg);
    border-bottom:1px solid var(--line); box-shadow:0 28px 44px -30px rgba(21,62,53,.45);
    opacity:0; transform:translateY(-10px); pointer-events:none;
    transition:opacity .24s ease,transform .24s ease; max-height:80vh; overflow:auto; }
  .hdr.mega-open .mega{ opacity:1; transform:translateY(0); pointer-events:auto; }
  .mega-in{ max-width:var(--wrap); margin:0 auto; padding:34px var(--pad) 42px;
    display:grid; grid-template-columns:220px 1fr; gap:44px; }
  .mega-cats{ display:flex; flex-direction:column; gap:2px; border-right:1px solid var(--line); padding-right:20px; }
  .mega-eyebrow{ font-family:var(--sans); font-weight:600; font-size:12px; letter-spacing:.12em;
    text-transform:uppercase; color:var(--terra); margin-bottom:14px; }
  .mega-cat{ font-family:var(--disp); font-weight:500; font-size:20px; padding:7px 0; }
  .mega-cat.is-on{ color:var(--green); }
  .mega-all{ margin-top:10px; font-size:15px; font-family:var(--sans); color:var(--muted); }
  .mega-pane{ display:none; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:24px 20px; align-content:start; }
  .mega-pane.is-on{ display:grid; }
  .mega-card{ display:flex; flex-direction:column; gap:10px; }
  .mega-thumb{ aspect-ratio:1/1; border-radius:16px; overflow:hidden; background:var(--panel); display:block; }
  .mega-thumb img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
  .mega-name{ font-size:13.5px; line-height:1.35; font-weight:400; }
  .mega-card:hover .mega-name{ color:var(--terra); }
}

/* ---------- hero ---------- */
.hero{ position:relative; display:flex; align-items:flex-end; min-height:86vh; background:var(--sand); overflow:hidden; }
.hero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% center; }
.hero::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(246,241,238,.98) 0%, rgba(246,241,238,.96) 52%, rgba(246,241,238,.70) 80%, rgba(246,241,238,.10) 100%); }
.hero-copy{ position:relative; z-index:2; width:100%; padding:52px var(--pad) 56px; display:flex; flex-direction:column; justify-content:flex-end; }
.hero-kicker{ display:inline-flex; align-items:center; gap:10px; font-size:13.5px; color:var(--green); margin-bottom:22px; }
.hero-kicker i{ width:24px; height:1px; background:var(--terra); display:block; }
.hero h1{ font-size:clamp(38px,9vw,92px); line-height:.99; letter-spacing:-.03em; margin-bottom:20px; }
.hero p{ font-size:clamp(15px,1.6vw,19px); line-height:1.6; color:var(--muted2); max-width:440px; margin-bottom:30px; }
.hero-cta{ display:flex; gap:12px; flex-wrap:wrap; }
@media (min-width:900px){
  .hero{ align-items:center; min-height:calc(100vh - 100px); }
  .hero-bg{ object-position:right center; }
  .hero::after{ background:linear-gradient(to right, rgba(246,241,238,.96) 0%, rgba(246,241,238,.93) 48%, rgba(246,241,238,.48) 72%, rgba(246,241,238,0) 92%); }
  .hero-copy{ justify-content:center; max-width:52%; padding:clamp(48px,6vw,110px); }
}

/* ---------- value band ---------- */
.values{ border-bottom:1px solid var(--line); }
.values-in{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; padding-top:26px; padding-bottom:26px; }
.values b{ display:block; font-family:var(--disp); font-weight:500; font-size:clamp(21px,2.4vw,32px); letter-spacing:-.01em; }
.values span{ font-size:13px; color:var(--muted); }
@media (min-width:760px){ .values-in{ grid-template-columns:repeat(4,1fr); padding-top:34px; padding-bottom:34px; } }

/* ---------- section heads ---------- */
.sec{ padding:64px 0 70px; }
@media (min-width:760px){ .sec{ padding:90px 0 96px; } }
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:34px; }
.sec-title{ display:flex; align-items:flex-start; gap:16px; }
.sec-title i{ font-family:var(--disp); font-style:normal; font-size:15px; color:var(--terra); margin-top:8px; }
.sec-title h2{ font-size:clamp(28px,4.6vw,54px); line-height:1; }
.sec-link{ font-weight:500; font-size:15px; color:var(--green); border-bottom:1px solid currentColor; padding-bottom:2px; }

/* ---------- product grid ---------- */
.pgrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px 16px; }
@media (min-width:640px){ .pgrid{ grid-template-columns:repeat(3,1fr); gap:34px 24px; } }
@media (min-width:1000px){ .pgrid{ grid-template-columns:repeat(4,1fr); } }

.card{ display:flex; flex-direction:column; }
.card-img{ position:relative; aspect-ratio:1/1; border-radius:var(--r); overflow:hidden; background:var(--panel);
  transition:transform .3s cubic-bezier(.2,.7,.2,1); }
.card-img img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.card:hover .card-img{ transform:translateY(-4px); }
.card-tag{ position:absolute; top:10px; left:10px; font-size:11px; font-weight:500;
  background:var(--bg); color:var(--ink); padding:5px 11px; border-radius:100px; }
.card-body{ margin-top:12px; display:flex; flex-direction:column; gap:4px; }
.card-name{ font-family:var(--disp); font-weight:500; font-size:15px; line-height:1.2; }
@media (min-width:640px){ .card-name{ font-size:16.5px; } }
.card-tagline{ font-size:12.5px; color:var(--muted); line-height:1.4; }
.card-price{ font-weight:500; font-size:14px; margin-top:2px; }

/* ---------- collection header ---------- */
.chead{ background:var(--sand3); padding:44px 0 48px; }
.chead h1{ font-size:clamp(32px,6.5vw,60px); margin:10px 0 12px; }
.chead p{ max-width:560px; }
.crumbs{ font-size:13px; color:var(--muted); display:flex; gap:8px; flex-wrap:wrap; }
.crumbs a{ color:var(--muted); }
.crumbs a:hover{ color:var(--terra); }

/* chips */
.chips{ display:flex; gap:9px; overflow-x:auto; padding:20px 0 4px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.chips::-webkit-scrollbar{ display:none; }
.chip{ flex:0 0 auto; font-size:13.5px; padding:9px 17px; border-radius:100px;
  border:1px solid rgba(21,62,53,.2); white-space:nowrap; }
.chip.is-on{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
.chip:hover{ border-color:var(--ink); color:var(--ink); }
.chip.is-on:hover{ color:var(--bg); }

/* ---------- product detail ---------- */
.pdp{ display:grid; grid-template-columns:1fr; gap:28px; padding-top:24px; }
@media (min-width:900px){ .pdp{ grid-template-columns:1.05fr 1fr; gap:56px; padding-top:38px; } }
.pdp-media{ display:flex; flex-direction:column; gap:12px; }
.pdp-main{ aspect-ratio:1/1; border-radius:26px; overflow:hidden; background:var(--panel); }
.pdp-main img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.pdp-thumbs{ display:flex; gap:10px; }
.pdp-thumb{ width:70px; height:70px; border-radius:14px; overflow:hidden; background:var(--panel);
  border:1.5px solid transparent; padding:0; }
.pdp-thumb.is-on{ border-color:var(--ink); }
.pdp-thumb img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }

.pdp-info h1{ font-size:clamp(26px,4.4vw,40px); margin:8px 0 10px; }
.pdp-tagline{ color:var(--terra); font-size:15px; margin-bottom:16px; }
.pdp-price{ font-family:var(--disp); font-weight:500; font-size:26px; margin-bottom:18px; }
.pdp-short{ font-size:15.5px; line-height:1.65; color:var(--muted2); margin-bottom:22px; }
.pdp-cta{ display:flex; flex-direction:column; gap:10px; margin-bottom:26px; }
@media (min-width:520px){ .pdp-cta{ flex-direction:row; } .pdp-cta .btn{ flex:1; } }
.pdp-block{ border-top:1px solid var(--line); padding:18px 0; }
.pdp-block h4{ font-family:var(--sans); font-weight:600; font-size:12px; letter-spacing:.11em;
  text-transform:uppercase; color:var(--terra); margin-bottom:10px; }
.pdp-benefits{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.pdp-benefits li{ display:flex; gap:10px; font-size:14.5px; color:var(--muted2); }
.pdp-benefits li::before{ content:''; flex:0 0 5px; height:5px; border-radius:50%; background:var(--terra); margin-top:8px; }
.pdp-meta{ font-size:13px; color:var(--muted); }

/* ---------- editorial pages ---------- */
.page-head{ background:var(--sand); padding:52px 0 56px; }
.page-head h1{ font-size:clamp(32px,6.5vw,62px); margin:12px 0 14px; }
.page-head p{ max-width:620px; }
.prose{ max-width:720px; padding:52px 0 64px; }
.prose h2{ font-size:clamp(22px,3vw,32px); margin:38px 0 14px; }
.prose h3{ font-size:19px; margin:28px 0 10px; }
.prose p{ font-size:16px; line-height:1.72; color:var(--muted2); margin-bottom:16px; }
.prose ul{ padding-left:20px; margin:0 0 18px; }
.prose li{ font-size:16px; line-height:1.7; color:var(--muted2); margin-bottom:8px; }
.prose a{ color:var(--green); border-bottom:1px solid currentColor; }

.tiles{ display:grid; grid-template-columns:1fr; gap:22px; }
@media (min-width:700px){ .tiles{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .tiles.t4{ grid-template-columns:repeat(4,1fr); } .tiles.t3{ grid-template-columns:repeat(3,1fr); } }
.tile{ background:var(--sand3); border-radius:var(--r); padding:26px 24px 28px; }
.tile i{ font-family:var(--disp); font-style:normal; font-size:14px; color:var(--terra); }
.tile h3{ font-size:20px; margin:8px 0 8px; }
.tile p{ font-size:14.5px; line-height:1.6; color:var(--muted2); }

.band{ background:var(--terra); color:var(--bg); }
.band .wrap{ padding-top:60px; padding-bottom:64px; }
.band h2{ font-size:clamp(26px,4vw,44px); margin-bottom:14px; }
.band p{ color:rgba(246,241,238,.82); max-width:560px; margin-bottom:26px; }
.band .btn-ink{ background:var(--bg); color:var(--terra); }
.band .btn-ink:hover{ background:#fff; color:var(--terra); }

/* ---------- search ---------- */
.searchbar{ display:flex; gap:10px; flex-wrap:wrap; margin:22px 0 6px; }
.searchbar input{ flex:1; min-width:200px; font:inherit; font-size:15px; padding:14px 20px;
  border-radius:100px; border:1px solid rgba(21,62,53,.22); background:#fff; color:var(--ink); }
.searchbar input:focus{ outline:none; border-color:var(--ink); }

/* ---------- footer ---------- */
.ftr{ background:var(--ink); color:var(--bg); overflow:hidden; margin-top:20px; }
.ftr-in{ max-width:var(--wrap); margin:0 auto; padding:56px var(--pad) 30px; }
.ftr-grid{ display:grid; grid-template-columns:1fr; gap:36px 28px; }
@media (min-width:640px){ .ftr-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .ftr-grid{ grid-template-columns:1.5fr 1fr 1fr 1fr 1fr; gap:48px 28px; } }
.ftr-join{ max-width:380px; }
.ftr-join h3{ font-size:27px; margin-bottom:12px; }
.ftr-join p{ font-size:14.5px; color:rgba(246,241,238,.7); margin-bottom:18px; }
.ftr-form{ display:flex; gap:9px; flex-wrap:wrap; }
.ftr-form input{ flex:1; min-width:170px; font:inherit; font-size:14px; padding:13px 18px;
  border-radius:100px; border:1px solid rgba(246,241,238,.28); background:rgba(246,241,238,.06); color:var(--bg); }
.ftr-form input::placeholder{ color:rgba(246,241,238,.5); }
.ftr-form input:focus{ outline:none; border-color:rgba(246,241,238,.6); }
.ftr-form button{ font-weight:500; font-size:14px; padding:13px 24px; border-radius:100px;
  border:none; background:var(--terra); color:var(--bg); }
.ftr-form button:hover{ background:#8d5039; }
.ftr-note{ font-size:13px; color:#9fc4b5; margin-top:10px; }
.ftr h5{ font-family:var(--sans); font-weight:600; font-size:12px; letter-spacing:.12em;
  text-transform:uppercase; color:#9fc4b5; margin-bottom:14px; }
.ftr-links{ display:flex; flex-direction:column; gap:10px; }
.ftr-links a,.ftr-social a{ font-size:14.5px; font-weight:300; color:rgba(246,241,238,.72); }
.ftr-links a:hover,.ftr-social a:hover{ color:var(--bg); }
.ftr-bottom{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap; margin-top:44px; font-size:13px; color:rgba(246,241,238,.55); }
.ftr-social{ display:flex; gap:18px; }
.ftr-word{ font-family:var(--disp); font-weight:700; font-size:clamp(74px,23vw,360px);
  line-height:.78; letter-spacing:-.02em; color:rgba(246,241,238,.1);
  text-align:center; user-select:none; padding:0 16px; }

/* ---------- cart ---------- */
.hdr-mob{ display:flex; align-items:center; gap:6px; }
@media (min-width:1000px){ .hdr-mob{ display:none; } }
.cart-btn{ background:none; border:none; padding:6px 4px; color:var(--ink); font-family:var(--sans); font-size:14px; }
.cart-btn:hover{ color:var(--terra); }

.card-add{ position:absolute; bottom:10px; right:10px; width:36px; height:36px; border-radius:50%;
  border:none; background:var(--ink); color:var(--bg); font-size:19px; line-height:1;
  display:flex; align-items:center; justify-content:center; transition:background .18s ease,transform .18s ease; }
.card-add:hover{ background:var(--terra); transform:scale(1.08); }
.card-add.is-added{ background:var(--green); }
@media (min-width:640px){ .card-add{ width:40px; height:40px; bottom:14px; right:14px; } }

.cart-veil{ position:fixed; inset:0; background:rgba(21,62,53,.4); z-index:98;
  opacity:0; transition:opacity .3s ease; }
.cart-veil.is-on{ opacity:1; }

.cart{ position:fixed; top:0; right:0; bottom:0; width:min(420px,100%); background:var(--bg);
  z-index:99; display:flex; flex-direction:column; transform:translateX(100%);
  transition:transform .34s cubic-bezier(.3,.8,.3,1); box-shadow:-20px 0 50px -30px rgba(21,62,53,.6); }
.cart.is-open{ transform:translateX(0); }
.cart-head{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:20px var(--pad); border-bottom:1px solid var(--line); flex:0 0 auto; }
.cart-head h3{ font-size:19px; }
.cart-x{ background:none; border:none; font-size:28px; line-height:1; color:var(--ink); padding:0 4px; }
.cart-x:hover{ color:var(--terra); }
.cart-body{ flex:1; overflow-y:auto; padding:16px var(--pad); }
.cart-empty{ color:var(--muted); font-size:15px; line-height:1.7; padding:30px 0; }
.cart-empty a{ color:var(--green); }

.cart-item{ display:grid; grid-template-columns:66px 1fr auto; gap:12px; align-items:start;
  padding:14px 0; border-bottom:1px solid var(--line); }
.cart-thumb{ width:66px; height:66px; border-radius:12px; overflow:hidden; background:var(--panel); }
.cart-thumb img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.cart-info{ min-width:0; }
.cart-name{ font-family:var(--disp); font-weight:500; font-size:14px; line-height:1.25; display:block; }
.cart-price{ font-size:13px; color:var(--muted); margin-top:3px; display:block; }
.cart-qty{ display:inline-flex; align-items:center; gap:2px; margin-top:8px;
  border:1px solid rgba(21,62,53,.2); border-radius:100px; padding:2px; }
.cart-qty button{ width:26px; height:26px; border:none; background:none; border-radius:50%;
  color:var(--ink); font-size:15px; line-height:1; }
.cart-qty button:hover{ background:rgba(21,62,53,.08); }
.cart-qty span{ min-width:24px; text-align:center; font-size:13.5px; font-weight:500; }
.cart-rm{ background:none; border:none; font-size:12px; color:var(--muted); text-decoration:underline; padding:2px 0; }
.cart-rm:hover{ color:var(--terra); }
.cart-line{ font-weight:500; font-size:13.5px; white-space:nowrap; }

.cart-foot{ flex:0 0 auto; border-top:1px solid var(--line); padding:16px var(--pad) 20px;
  display:flex; flex-direction:column; gap:10px; background:var(--bg); }
.cart-sum{ display:flex; align-items:baseline; justify-content:space-between; }
.cart-sum strong{ font-family:var(--disp); font-weight:500; font-size:21px; }
.cart-note{ font-size:12px; color:var(--muted); line-height:1.5; }
.cart-checkout{ width:100%; }
.cart-clear{ background:none; border:none; font-size:12.5px; color:var(--muted); text-decoration:underline; }
.cart-clear:hover{ color:var(--terra); }

.toast{ position:fixed; left:50%; bottom:22px; transform:translate(-50%,14px); z-index:120;
  background:var(--ink); color:var(--bg); font-size:14px; padding:12px 22px; border-radius:100px;
  opacity:0; transition:opacity .25s ease,transform .25s ease; pointer-events:none; max-width:88vw; text-align:center; }
.toast.is-on{ opacity:1; transform:translate(-50%,0); }

body.cart-lock{ overflow:hidden; }

/* ---------- reveal ---------- */
[data-reveal]{ opacity:0; transform:translateY(26px);
  transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1); }
[data-reveal].is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  [data-reveal]{ opacity:1 !important; transform:none !important; transition:none; }
  *{ scroll-behavior:auto !important; }
}
html{ scroll-behavior:smooth; }