:root {
  --ink:#171717; --grey:#6b6b6b; --rule:#d6d6d6;
  --review:#d92d20; --review-dark:#a91f16; --review-tint:#fdf1ef;
  --bonus:#1d4ed8; --bonus-dark:#15317f; --bonus-tint:#eef2fc;
}
* { box-sizing:border-box; }
body {
  margin:0; padding:44px 22px 80px;
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  color:var(--ink); background:#fff; max-width:660px; margin-inline:auto;
  -webkit-text-size-adjust:100%;
}
h1 { font-size:23px; letter-spacing:.01em; margin:0 0 6px; line-height:1.25; }
h2 { font-size:15px; margin:0 0 8px; }
h3 { font-size:15px; margin:0 0 6px; }
.sub, .subtitle { font-size:11px; letter-spacing:.13em; text-transform:uppercase;
       color:var(--grey); margin:0 0 14px; }
/* Hero */
.hero { margin-bottom:30px; }

/* Buttons, shared */
.btn {
  display:block; text-align:center; text-decoration:none;
  padding:18px 24px; font-size:16.5px; font-weight:800; letter-spacing:.01em;
  font-family:inherit; border-radius:3px; cursor:pointer; margin:14px 0 18px;
  border:2px solid transparent; transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.btn:hover { transform:translateY(-1px); }
.btn-review {
  background:var(--review); color:#fff;
  box-shadow:0 6px 0 var(--review-dark), 0 10px 18px rgba(217,45,32,.28);
}
.btn-review:hover { background:var(--review-dark); }
.btn-review:active { transform:translateY(2px); box-shadow:0 3px 0 var(--review-dark); }

/* Step labels — the badge that names Step 1 / Step 2 */
.step-label {
  display:inline-block; font-size:12.5px; font-weight:800; letter-spacing:.09em;
  text-transform:uppercase; color:#fff; padding:7px 14px; margin:0 0 16px;
  border-radius:3px;
}
.label-review { background:var(--review); }
.label-bonus  { background:var(--bonus); }

/* Step sections (feedback / bonuses) — boxed + tinted so the two funnel steps read as separate */
.step {
  margin:0 0 34px; scroll-margin-top:20px; padding:28px 24px 24px;
  border-radius:6px; border-top:5px solid transparent;
}
.step-review { background:var(--review-tint); border-top-color:var(--review); }
.step-bonus  { background:var(--bonus-tint); border-top-color:var(--bonus); }
.step p { margin:0 0 14px; font-size:14.5px; color:var(--ink); }
.step .prompt {
  font-size:13px; color:var(--grey); font-style:italic; margin:0 0 14px;
}
.step .fine { font-size:12.5px; color:var(--grey); margin:0; }
.section-heading { font-size:19px; line-height:1.3; margin:0 0 14px; }

/* Bonus pack name bars */
.bar { background:var(--bonus-dark); color:#fff; font-size:11px; font-weight:700;
       letter-spacing:.16em; padding:9px 12px; margin:0 0 10px; }
.pack { margin:0 0 22px; }
.pack p { color:var(--grey); font-size:14.5px; margin:0; }

/* Email opt-in */
.form-container { background:#fff; border:1px solid var(--rule); padding:22px; margin:22px 0 0; border-radius:4px; }
.form-lead { margin:0 0 8px; font-size:14.5px; font-weight:700; }
.field-label { margin:0 0 6px; font-size:12px; color:var(--grey); text-transform:uppercase; letter-spacing:.08em; }
.form-note { font-size:12.5px; color:var(--grey); margin-top:12px; }

/* Footer */
.footer-section { margin-top:44px; padding-top:18px; border-top:2px solid var(--ink); font-size:14.5px; }
.footer-section p { margin:0 0 6px; }
.author { margin-top:44px; font-size:10.5px; letter-spacing:.09em;
         text-transform:uppercase; color:var(--grey); }

a { color:var(--ink); }
a.plain { text-decoration:none; border-bottom:2px solid var(--ink); font-weight:700; }

/* --- MailerLite embedded form: strip its chrome, inherit the page --- */
.ml-embedded { margin:0; }
.ml-embedded .ml-form-embedContainer,
.ml-embedded .ml-form-embedWrapper,
.ml-embedded .ml-form-embedBody {
  background:transparent !important; border:0 !important;
  box-shadow:none !important; padding:0 !important; max-width:none !important;
}
.ml-embedded input[type=email] {
  width:100% !important; padding:12px 14px !important;
  border:1px solid var(--rule) !important; border-radius:0 !important;
  font-size:16px !important; font-family:inherit !important;
}
.ml-embedded button, .ml-embedded .primary {
  width:100% !important; background:var(--bonus) !important; color:#fff !important;
  border:0 !important; border-radius:3px !important; padding:16px !important;
  font-size:16.5px !important; font-weight:800 !important; font-family:inherit !important;
  letter-spacing:.01em !important; cursor:pointer;
  box-shadow:0 6px 0 var(--bonus-dark), 0 10px 18px rgba(21,128,61,.28) !important;
}
.ml-embedded button:hover, .ml-embedded .primary:hover { background:var(--bonus-dark) !important; }
.ml-embedded .ml-form-embedPermissions,
.ml-embedded .ml-form-embedContent { font-size:12.5px !important; color:var(--grey) !important; }
.ml-embedded * { font-family:inherit !important; }

@media (max-width:480px) {
  .quick-choice { flex-direction:column; }
  .quick-choice .btn { flex:1 1 auto; }

  /* Tighten vertical rhythm so Step 1 + the review button land with minimal scrolling on phones */
  body { padding:24px 18px 60px; }
  .hero { margin-bottom:16px; }
  h1 { font-size:20px; }
  .subtitle { margin-bottom:0; }
  .step { padding:18px 18px 16px; margin-bottom:26px; }
  .step-label { margin-bottom:10px; }
  .step p { margin-bottom:10px; font-size:14px; }
  .btn { margin:8px 0 12px; padding:16px 20px; font-size:15.5px; }
}