:root {
  --ground:#F7F4EC; --linen:#F3EEE3; --card:#FFFCF6; --parchment:#E9E1D2;
  --ink:#2B2926; --ink2:#6E675C; --ink3:#9A9184;
  --terracotta:#C2603E; --terracotta-deep:#B25638; --ember:#EE8C22; --peach:#F28063;
  --gold:#C98A2B; --pink:#E4739C; --fuchsia:#C453A8; --seafoam:#45B8BE; --moss:#6BA857;
  --coffee:#8A6B52; --slate:#5A7290;
  --lo:rgba(43,41,38,.16); --hi:rgba(255,255,255,.9);
  --r-lg:18px; --r-md:13px; --r-sm:10px;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { font-family:'Hanken Grotesk', system-ui, sans-serif; background:var(--ground); color:var(--ink);
  line-height:1.5; font-size:17px; }
.display { font-family:'Fraunces', serif; font-weight:600; }
.sunny-word { font-family:'Bagel Fat One', 'Fraunces', serif; font-weight:400;
  background:linear-gradient(115deg, #C98A2B 0%, #EE8C22 26%, #C2603E 58%, #C453A8 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; }

.wrap { max-width:680px; margin:0 auto; padding:0 22px; }

/* hero */
.hero { position:relative; overflow:hidden; padding:56px 0 40px; text-align:center; }
.hero .art { width:190px; height:190px; margin:0 auto 26px; }
.eyebrow { font-weight:600; font-size:13px; letter-spacing:.22em; color:var(--terracotta); }
h1 { font-family:'Fraunces', serif; font-weight:600; font-size:clamp(34px, 7vw, 52px); line-height:1.12; margin-top:12px; }
.hero p.sub { margin:16px auto 0; max-width:480px; font-size:19px; color:var(--ink2); }

/* capture card */
.capture { background:var(--card); border-radius:var(--r-lg); padding:28px 26px 26px; margin-top:30px;
  box-shadow:0 6px 20px var(--lo), inset 0 1px 0 var(--hi); text-align:left; }
.capture h2 { font-family:'Fraunces', serif; font-weight:600; font-size:24px; }
.capture .promise { margin-top:8px; color:var(--ink2); font-size:16px; }
form { display:flex; gap:12px; margin-top:18px; flex-wrap:wrap; }
input[type=email] { flex:1 1 220px; min-width:0; font:inherit; padding:14px 16px; border-radius:var(--r-md);
  border:1.5px solid var(--parchment); background:var(--ground); color:var(--ink);
  box-shadow:inset 0 2px 4px rgba(43,41,38,.07); }
input[type=email]:focus { outline:none; border-color:var(--pink); box-shadow:inset 0 2px 4px rgba(43,41,38,.07), 0 0 0 3px rgba(228,115,156,.25); }
button.cta { font:inherit; font-weight:600; width:fit-content; padding:14px 26px; border:0; cursor:pointer;
  border-radius:var(--r-md); color:#FFFCF6; background:var(--terracotta);
  box-shadow:0 3px 10px rgba(194,96,62,.35), inset 0 1px 0 rgba(255,255,255,.25);
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease; }
button.cta:hover { background:var(--terracotta-deep); transform:translateY(-1px);
  box-shadow:0 5px 14px rgba(194,96,62,.45), inset 0 1px 0 rgba(255,255,255,.25); }
button.cta:active { transform:translateY(0); }
.fineprint { margin-top:12px; font-size:13px; color:var(--ink3); }

/* receipts strip */
.receipts { display:flex; gap:14px; justify-content:center; margin-top:34px; flex-wrap:wrap; }
.receipt { background:var(--card); border-radius:var(--r-sm); padding:10px 10px 8px; width:104px; flex:none;
  box-shadow:0 3px 9px var(--lo), inset 0 1px 0 var(--hi); position:relative; }
.receipt .swatch { height:52px; border-radius:7px; }
.receipt .amt { text-align:center; font-weight:600; font-size:15px; margin-top:6px;
  font-variant-numeric:tabular-nums; }
.receipt .pin-dot { position:absolute; left:50%; top:-7px; transform:translateX(-50%);
  width:14px; height:14px; border-radius:50%; background:var(--pink);
  box-shadow:0 1px 3px rgba(43,41,38,.3); }
.receipts-cap { text-align:center; margin-top:12px; font-size:14px; color:var(--ink3); }

/* sections */
section { padding:44px 0 0; }
section:last-of-type { padding-bottom:64px; }
h3 { font-family:'Fraunces', serif; font-weight:600; font-size:26px; text-align:center; }
.cards { display:grid; gap:16px; margin-top:22px; grid-template-columns:1fr; }
@media (min-width:620px) { .cards { grid-template-columns:1fr 1fr; } }
.tile { background:var(--linen); border-radius:var(--r-md); padding:18px 18px 16px;
  box-shadow:0 2px 6px var(--lo), inset 0 1px 0 var(--hi); }
.tile .dot { width:13px; height:13px; border-radius:50%; display:inline-block; margin-right:9px; vertical-align:baseline; }
.tile b { font-size:16.5px; }
.tile p { margin-top:6px; color:var(--ink2); font-size:15px; }

/* honest note */
.note { background:var(--card); border-radius:var(--r-lg); padding:24px 26px; margin-top:24px;
  box-shadow:0 4px 14px var(--lo), inset 0 1px 0 var(--hi); }
.note p { color:var(--ink2); font-size:16.5px; }
.note p + p { margin-top:10px; }
.note .sig { margin-top:14px; font-family:'Fraunces', serif; font-weight:600; color:var(--ink); }

/* repeat cta */
.cta-again { text-align:center; margin-top:30px; }

footer { border-top:1px solid var(--parchment); padding:22px 0 40px; margin-top:20px;
  text-align:center; font-size:13.5px; color:var(--ink3); }
footer a { color:var(--ink3); }
