/* Ad landing page (check.html): flat, compact, high-contrast lead-gen layout.
   Loaded AFTER styles.css and quiz.css, and only affects body.lp. */

body.lp {
  --lp-green: #138a74;
  --lp-green-dark: #0f6f5e;
  --lp-coral: #e85d4a;
  --lp-coral-dark: #d14a37;
  --lp-line: #d5dce0;
  background: var(--lp-green);
  color: var(--white);
  font-family: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 1.0625rem; /* 17px */
  line-height: 1.55;
}
body.lp h1, body.lp h2, body.lp h3, body.lp legend, body.lp .btn {
  font-family: "Public Sans", system-ui, sans-serif; letter-spacing: 0;
}

/* Decorative side shapes (desktop only) */
.lp-stage { position: relative; overflow: hidden; }
.lp-stage::before, .lp-stage::after {
  content: ""; position: absolute; top: 120px; width: 260px; height: 420px;
  background: rgba(255, 255, 255, 0.07); pointer-events: none;
}
.lp-stage::before { left: -90px; clip-path: polygon(0 0, 100% 50%, 0 100%); }
.lp-stage::after { right: -90px; clip-path: polygon(100% 0, 0 50%, 100% 100%); }

/* Top bar */
.lp-bar { position: relative; z-index: 1; }
.lp-bar .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 16px; padding-bottom: 16px; max-width: 1100px; }
.lp-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--white); text-decoration: none; font-weight: 800; font-size: 1.35rem; letter-spacing: -0.01em; }
.lp-logo .mark { width: 34px; height: 34px; border-radius: 50%; background: var(--white); display: grid; place-items: center; }
.lp-secure { display: inline-flex; align-items: center; gap: 8px; font-size: 0.95rem; font-weight: 600; color: rgba(255, 255, 255, 0.92); }

/* Hero */
.lp-hero2 { position: relative; z-index: 1; text-align: center; padding: 18px 0 40px; }
.lp-hero2 .wrap { max-width: 760px; }
.lp-hero2 h1 { color: var(--white); font-weight: 800; font-size: clamp(1.75rem, 3.6vw, 2.25rem); line-height: 1.2; margin: 0 0 8px; text-wrap: balance; }
.lp-hero2 .sub { color: rgba(255, 255, 255, 0.92); font-size: 1.05rem; margin: 0 0 22px; }

/* Card */
body.lp .quiz {
  max-width: 700px; margin: 0 auto; text-align: left; color: var(--ink);
  background: var(--white); border: 0; border-radius: 10px;
  box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.35);
  padding: 22px 28px 18px;
}
body.lp .quiz-top { margin-bottom: 8px; }
body.lp .quiz-step-label, body.lp .quiz-time { font-size: 0.85rem; font-weight: 600; color: #6b7280; }
body.lp .progress { height: 6px; margin-bottom: 20px; background: #edf2f1; }
body.lp .progress-bar { background: var(--lp-green); }

body.lp .step legend {
  display: block; width: 100%; text-align: center;
  font-size: 1.35rem; font-weight: 800; color: #1f2933; margin-bottom: 14px;
}
body.lp .q-help { text-align: center; font-size: 0.98rem; color: #6b7280; margin: -6px 0 14px; }

/* Answer rows */
body.lp .options { gap: 10px; }
body.lp .option span {
  min-height: 54px; padding: 12px 16px; gap: 14px;
  border: 1.5px solid var(--lp-line); border-radius: 6px;
  font-size: 1.05rem; font-weight: 600; color: #1f2933; box-shadow: none;
}
body.lp .option span::before { width: 22px; height: 22px; border: 2px solid #9aa5ae; }
body.lp .option:hover span { border-color: var(--lp-green); background: #f3faf8; }
body.lp .option input:checked + span { border-color: var(--lp-green); background: #ecf8f5; box-shadow: none; }
body.lp .option input:checked + span::before { border-color: var(--lp-green); background: var(--lp-green); }
body.lp .option.check input:checked + span::before { background-color: var(--lp-green); }

/* Inputs */
body.lp .field label { color: #1f2933; font-size: 1rem; }
body.lp .field input { border-radius: 6px; border-width: 1.5px; font-size: 1.1rem; padding: 13px 14px; }
body.lp .field input:focus { border-color: var(--lp-green); box-shadow: 0 0 0 3px rgba(19, 138, 116, 0.18); }
body.lp .postcode-input { max-width: none; text-align: center; font-size: 1.3rem; }
body.lp .consent { border-radius: 6px; background: #f6f8f9; font-size: 0.95rem; }

/* Buttons: full-width primary, small back link */
body.lp .quiz-nav { flex-direction: column-reverse; align-items: stretch; gap: 6px; margin-top: 18px; }
body.lp .btn-next, body.lp .btn-submit {
  width: 100%; min-width: 0; border-radius: 6px; padding: 16px 20px;
  background: var(--lp-coral); font-size: 1.15rem; font-weight: 800;
  box-shadow: 0 6px 14px -8px rgba(209, 74, 55, 0.8);
}
body.lp .btn-next:hover, body.lp .btn-submit:hover { background: var(--lp-coral-dark); }
body.lp .btn-back { align-self: center; padding: 6px; font-size: 0.95rem; }
body.lp .btn-back:not(.visible) { display: none; }

/* Card footer microcopy */
.card-foot2 {
  display: flex; justify-content: space-between; gap: 10px 18px; flex-wrap: wrap;
  margin-top: 14px; padding-top: 12px; border-top: 1px solid #eef1f3;
  font-size: 0.85rem; color: #6b7280;
}
.card-foot2 span { display: inline-flex; align-items: center; gap: 6px; }
.card-foot2 a { color: #374151; }

/* Benefits on green */
.lp-benefits { position: relative; z-index: 1; padding: 8px 0 44px; }
.lp-benefits .wrap { max-width: 930px; }
.lp-benefits h2 { color: var(--white); text-align: center; font-size: 1.25rem; font-weight: 800; margin: 0 0 22px; }
.lp-benefit-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 18px 40px; }
.lp-benefit-grid li { display: flex; align-items: flex-start; gap: 12px; color: var(--white); font-size: 1.05rem; }
.lp-benefit-grid .dot { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--lp-coral); display: grid; place-items: center; margin-top: 2px; }

/* Footer */
body.lp .site-footer { background: var(--lp-green-dark); color: rgba(255, 255, 255, 0.85); font-size: 0.88rem; padding: 22px 0; }
body.lp .site-footer .wrap { max-width: 930px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 20px; }

/* Thank-you / not-covered pages in the same style */
body.lp .status-page { background: transparent; padding: 10px 0 56px; min-height: 0; position: relative; z-index: 1; }
body.lp .status-card { color: var(--ink); border: 0; border-radius: 10px; box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.35); max-width: 700px; }
body.lp .status-card h1 { color: #1f2933; font-weight: 800; }
body.lp .status-card h2 { color: #1f2933; font-weight: 800; }
body.lp .status-icon { background: var(--lp-green); }
body.lp .next-num { background: var(--lp-green); font-family: "Public Sans", sans-serif; }
body.lp .status-note { text-align: center; margin-top: 22px; font-size: 0.95rem; color: rgba(255, 255, 255, 0.9); }
body.lp .status-note a { color: var(--white); }

@media (max-width: 760px) {
  .lp-stage::before, .lp-stage::after { display: none; }
  .lp-bar .wrap { padding-top: 12px; padding-bottom: 8px; }
  .lp-logo { font-size: 1.2rem; }
  .lp-logo .mark { width: 30px; height: 30px; }
  .lp-secure { font-size: 0.85rem; }
  .lp-hero2 { padding: 8px 0 28px; }
  .lp-hero2 h1 { font-size: 1.6rem; }
  .lp-hero2 .sub { font-size: 0.98rem; margin-bottom: 16px; }
  body.lp .quiz { padding: 18px 16px 14px; border-radius: 8px; }
  body.lp .step legend { font-size: 1.25rem; }
  .card-foot2 { flex-direction: column; align-items: center; text-align: center; }
  .lp-benefit-grid { grid-template-columns: 1fr; gap: 14px; }
}