:root { --ink:#21352f; --muted:#6d7d74; --cream:#f7f4ec; --paper:#fffdf8; --leaf:#32745b; --mint:#dcefe3; --coral:#e8795f; }
* { box-sizing:border-box; }
body { margin:0; background:var(--cream); color:var(--ink); font:15px/1.5 'DM Sans',sans-serif; }
.topbar { max-width:1120px; margin:auto; padding:28px 32px; display:flex; justify-content:space-between; align-items:center; }
.brand { color:var(--ink); font-weight:700; font-size:18px; text-decoration:none; letter-spacing:-.03em; }
.brand-mark { display:inline-grid; place-items:center; width:28px; height:28px; margin-right:8px; border-radius:9px 9px 9px 2px; color:white; background:var(--coral); font-weight:700; }
.privacy { color:var(--muted); font-size:12px; }.privacy:first-letter { color:var(--leaf); }
main { max-width:960px; margin:auto; padding:42px 32px 30px; }.hero { max-width:720px; margin:0 auto 52px; text-align:center; }
.eyebrow { margin:0 0 12px; color:var(--coral); font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
h1,h2,h3 { margin:0; line-height:1.05; letter-spacing:-.045em; } h1 { font:700 clamp(43px,7vw,76px)/.98 'Fraunces',serif; }
h1 em { color:var(--leaf); font-style:normal; } .intro { max-width:595px; margin:24px auto 0; color:#52645b; font-size:17px; }
.checkout-card { padding:30px; border:1px solid #e6e2d7; border-radius:24px; background:var(--paper); box-shadow:0 18px 50px #425c4d12; }
.card-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:23px; } h2 { font:600 30px 'Fraunces',serif; }.cart-count { color:var(--muted); font-size:13px; }
.choice-grid { display:grid; grid-template-columns:1fr 36px 1fr; align-items:center; }.swap { color:#a4aaa3; text-align:center; font:600 13px 'Fraunces',serif; }
.meal { position:relative; min-height:153px; padding:18px; border:1px solid #e7e4da; border-radius:17px; background:#fff; display:grid; grid-template-columns:74px 1fr; gap:15px; align-items:center; }
.meal.alternative { border:2px solid var(--leaf); background:#f4faf5; }.meal-photo { display:grid; place-items:center; width:74px; height:74px; border-radius:50%; background:#f5ddd1; font-size:38px; }.plant-photo { background:var(--mint); }
.label { color:#a27b70; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }.label.green { color:var(--leaf); } h3 { margin:6px 0 5px; font-size:19px; } .meal p { margin:0; color:var(--muted); font-size:13px; }
.radio { position:absolute; top:17px; right:17px; width:16px; height:16px; border:2px solid #cad0ca; border-radius:50%; }.radio.selected { border-color:var(--coral); box-shadow:inset 0 0 0 3px white; background:var(--coral); }
button { border:0; cursor:pointer; font:600 13px 'DM Sans',sans-serif; }.switch-button { margin-top:14px; padding:10px 15px; border-radius:8px; color:#fff; background:var(--leaf); }.switch-button:hover { background:#245c47; }
.card-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:22px; }.keep-button { padding:10px 0; color:var(--muted); background:transparent; text-decoration:underline; text-underline-offset:3px; }.event-note { color:#9aa39c; font-size:12px; }
.decision { margin-top:18px; padding:13px 15px; border-radius:10px; color:#285b45; background:var(--mint); font-weight:600; }.decision[hidden] { display:none; }
.proof { display:grid; grid-template-columns:repeat(3,1fr); gap:35px; padding:58px 15px 30px; }.proof div { position:relative; padding-left:37px; }.step { position:absolute; left:0; top:1px; color:var(--coral); font-size:11px; font-weight:700; }.proof strong { font-size:14px; }.proof p { margin:7px 0 0; color:var(--muted); font-size:13px; }.source { margin:15px auto; max-width:650px; color:#7d8981; font-size:12px; text-align:center; }.source a { color:var(--leaf); }
footer { display:flex; justify-content:space-between; max-width:960px; margin:20px auto 0; padding:24px 32px 36px; color:#89958d; font-size:12px; border-top:1px solid #e5e1d5; }
@media (max-width:680px) { .topbar { padding:22px 20px; }.privacy { font-size:0; }.privacy::after { content:'● private'; font-size:12px; } main { padding:35px 18px 20px; }.hero { margin-bottom:35px; }.intro { font-size:15px; }.checkout-card { padding:20px 15px; }.choice-grid { grid-template-columns:1fr; gap:12px; }.swap { padding:0; }.meal { min-height:128px; }.proof { grid-template-columns:1fr; gap:22px; padding:40px 5px 25px; }.card-footer { align-items:flex-start; flex-direction:column; gap:5px; } footer { padding:22px 20px 30px; flex-direction:column; gap:5px; } }