:root{
    /* ---- BRAND COLOURS (edit these to re-skin for any client) ---- */
    --brand:      #0E5A34;   /* deep green (darker than the model funnel) */
    --brand-dark: #0A4527;   /* hover / darkest */
    --brand-600:  #12703F;   /* buttons */
    --accent:     #D9A441;   /* subtle gold — stars, ticks */
    --bg:         #F1F5F1;   /* subtle green-grey page background */
    --band:       #EAF1EA;   /* alternate section band */
    --surface:    #FFFFFF;
    --ink:        #14181F;   /* headings, near-black */
    --ink-2:      #4A5560;   /* body text grey */
    --line:       #DFE7DF;   /* borders */
    --radius:     14px;
    --shadow:     0 10px 30px rgba(14,90,52,.08);
    --maxw:       620px;
  }
  *{box-sizing:border-box}
  html,body{margin:0;padding:0}
  body{
    font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--ink); background:var(--bg); line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{line-height:1.15; margin:0}
  p{margin:0 0 1em}
  a{color:var(--brand)}
  img{max-width:100%}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 20px}
  .band{background:var(--band)}
  .white{background:var(--surface)}

  /* ---------- top bar ---------- */
  .topbar{
    background:#fff; border-bottom:1px solid var(--line);
    display:flex; align-items:center; justify-content:space-between;
    gap:14px; padding:12px 20px;
  }
  .brands{display:flex; align-items:center; gap:16px; min-width:0}
  .brandmark{font-weight:800; font-size:18px; letter-spacing:-.02em; color:var(--ink); white-space:nowrap}
  .client-logo{height:34px; width:auto}
  .client-logo-fallback{font-weight:800; color:var(--brand); font-size:15px; line-height:1.05}
  .client-logo-fallback small{display:block; font-weight:600; color:var(--ink-2); font-size:10px; letter-spacing:.14em}
  .phone-cta{text-align:right; white-space:nowrap}
  .phone-cta .label{font-size:10px; letter-spacing:.14em; color:var(--ink-2); font-weight:700}
  .phone-cta a{font-weight:800; font-size:19px; color:var(--brand); text-decoration:none; display:block; letter-spacing:-.01em}
  .phone-cta .sub{font-size:11px; color:var(--accent); font-weight:700}
  @media (max-width:560px){
    .phone-cta a{font-size:16px}
    .brandmark{font-size:16px}
    .client-logo{height:28px}
  }

  /* ---------- hero ---------- */
  .hero{padding:34px 0 30px}
  .headline{font-size:30px; font-weight:800; letter-spacing:-.02em; text-align:center; margin-bottom:22px}
  .headline .go{color:var(--brand)}
  @media (min-width:560px){ .headline{font-size:36px} }

  /* ---------- quiz card ---------- */
  .card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:24px 22px}
  .progress-top{display:flex; justify-content:space-between; font-size:13px; font-weight:700; color:var(--ink-2); margin-bottom:8px}
  .bar{height:7px; background:#E7EEE7; border-radius:99px; overflow:hidden; margin-bottom:20px}
  .bar > i{display:block; height:100%; background:var(--brand); border-radius:99px; transition:width .35s ease; width:20%}
  .q{font-size:21px; font-weight:800; letter-spacing:-.01em; margin-bottom:6px}
  .q-sub{color:var(--ink-2); font-size:14px; margin-bottom:16px}
  .options{display:flex; flex-direction:column; gap:12px}
  .opt{
    display:flex; align-items:center; justify-content:flex-start;
    text-align:left; width:100%; padding:18px 18px; font-size:17px; font-weight:700; color:var(--ink);
    background:#fff; border:1.5px solid var(--line); border-radius:12px; cursor:pointer;
    transition:border-color .15s, background .15s, transform .05s;
  }
  .opt:hover{border-color:var(--brand); background:#F6FBF7}
  .opt:active{transform:scale(.995)}
  .opt:focus-visible{outline:3px solid rgba(14,90,52,.35); outline-offset:2px}

  /* contact step */
  .field{margin-bottom:14px}
  .field label{display:block; font-weight:700; font-size:14px; margin-bottom:6px}
  .field input{
    width:100%; padding:15px 14px; font-size:16px; border:1.5px solid var(--line);
    border-radius:11px; font-family:inherit; color:var(--ink); background:#fff;
  }
  .field input:focus{outline:none; border-color:var(--brand); box-shadow:0 0 0 3px rgba(14,90,52,.12)}
  .row2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
  @media (max-width:460px){ .row2{grid-template-columns:1fr} }

  .btn{
    width:100%; padding:17px 18px; font-size:17px; font-weight:800; color:#fff;
    background:var(--brand-600); border:none; border-radius:12px; cursor:pointer;
    font-family:inherit; letter-spacing:.01em; transition:background .15s, transform .05s;
  }
  .btn:hover{background:var(--brand-dark)}
  .btn:active{transform:scale(.995)}
  .btn[disabled]{opacity:.6; cursor:not-allowed}
  .btn-ghost{background:transparent; color:var(--brand); font-weight:700; padding:10px; width:auto}

  .consent{display:flex; gap:10px; align-items:flex-start; margin:6px 0 16px; font-size:11.5px; color:var(--ink-2); line-height:1.45}
  .consent input{margin-top:3px; width:16px; height:16px; flex:0 0 auto}
  .err{color:#B42318; font-size:13.5px; font-weight:600; margin:8px 0 0}
  .muted{color:var(--ink-2)}
  .backlink{margin-top:14px; text-align:center}
  .backlink button{background:none;border:none;color:var(--ink-2);font-weight:700;cursor:pointer;font-size:13px}

  .otp-row{display:flex; gap:10px; align-items:center; margin-bottom:6px}
  .code-input{letter-spacing:.5em; font-size:22px; text-align:center; font-weight:800}
  .resend{font-size:13px; margin-top:8px}
  .sent-note{font-size:13.5px; color:var(--ink-2); margin-bottom:12px}

  .hero-blurb{max-width:520px; margin:20px auto 0; text-align:center; color:var(--ink-2); font-size:15px}
  .trustrow{display:flex; flex-wrap:wrap; gap:8px 22px; justify-content:center; margin-top:16px; font-weight:800; font-size:13.5px; color:var(--ink)}
  .trustrow .dot{color:var(--accent)}

  /* ---------- generic section ---------- */
  section{padding:44px 0}
  .sec-title{text-align:center; font-size:26px; font-weight:800; letter-spacing:-.01em; margin-bottom:8px}
  .sec-note{text-align:center; color:var(--ink-2); font-size:14px; max-width:520px; margin:0 auto 26px}

  /* case results — horizontal scroll */
  .scroller{display:flex; gap:14px; overflow-x:auto; padding:4px 20px 16px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch}
  .scroller::-webkit-scrollbar{height:6px}
  .scroller::-webkit-scrollbar-thumb{background:#cdd8cd; border-radius:99px}
  .result{flex:0 0 260px; scroll-snap-align:start; background:#fff; border:1px solid var(--line); border-top:3px solid var(--brand); border-radius:12px; padding:16px}
  .result .amt{font-size:22px; font-weight:800; color:var(--brand)}
  .result .type{font-weight:700; margin:2px 0 6px; font-size:15px}
  .result .detail{font-size:13px; color:var(--ink-2); margin:0 0 10px}
  .verified{display:flex; align-items:center; gap:6px; font-size:12px; font-weight:700; color:var(--ink-2)}
  .verified svg{width:14px;height:14px;color:var(--brand)}

  /* insurers */
  .insurers{display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:center; font-weight:800; color:var(--ink-2); font-size:16px}

  /* reviews */
  .reviews{display:grid; gap:16px}
  @media (min-width:620px){ .reviews{grid-template-columns:1fr 1fr} }
  .review{background:#fff; border:1px solid var(--line); border-radius:12px; padding:18px}
  .review .head{display:flex; align-items:center; justify-content:space-between; margin-bottom:8px}
  .review .who{display:flex; align-items:center; gap:10px}
  .avatar{width:36px;height:36px;border-radius:9px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}
  .name{font-weight:800; font-size:15px}
  .stars{color:var(--accent); letter-spacing:1px; font-size:14px}
  .review p{font-size:14px; color:#333; margin:0 0 10px}
  .gverify{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--ink-2)}
  .gverify svg{width:14px;height:14px;color:var(--brand)}

  /* comp grid */
  .grid{display:grid; grid-template-columns:1fr 1fr; gap:12px}
  @media (min-width:560px){ .grid{grid-template-columns:1fr 1fr 1fr 1fr} }
  .cell{background:#fff;border:1px solid var(--line);border-radius:11px;padding:14px}
  .cell b{display:block; font-size:15px; margin-bottom:4px}
  .cell span{font-size:12.5px; color:var(--ink-2)}

  /* faq */
  .faq{display:flex; flex-direction:column; gap:10px}
  .faq details{background:#fff;border:1px solid var(--line);border-radius:11px;padding:0}
  .faq summary{list-style:none; cursor:pointer; padding:16px 18px; font-weight:800; font-size:15px; display:flex; justify-content:space-between; align-items:center}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary .plus{color:var(--brand); font-size:22px; font-weight:400; line-height:1}
  .faq details[open] summary .plus{transform:rotate(45deg)}
  .faq .ans{padding:0 18px 16px; color:var(--ink-2); font-size:14px}

  .cta-final{text-align:center}
  .cta-final .btn{max-width:420px; margin:16px auto 0}

  /* footer */
  footer{background:#0C1512; color:#9FB0A6; font-size:12.5px; padding:30px 0 40px}
  footer .wrap{max-width:760px}
  footer b{color:#dfe9e2}
  footer a{color:#bcd2c6}
  .foot-links{margin-top:14px; display:flex; gap:18px; flex-wrap:wrap}

  .hidden{display:none !important}
  @media (prefers-reduced-motion:reduce){ *{transition:none !important} }

/* ---- state selector extras ---- */
.opt.state{justify-content:flex-start}
.selector-sub{color:var(--ink-2); font-size:14px; margin:-2px 0 16px}
