/* ============================================================
   AWE Dealer Drive — the co-branded service-lane page.
   Ported from Sean's mockup (docs/mockups/dealerdrive-coverage-desk.html), Sep 2026.
   Palette inherited from the AWE customer site; every colour is declared on bare :root first,
   then redefined for the OS dark preference and for an explicit [data-theme] choice, so the page
   is readable in both themes whichever way the viewer's device is set.
   ============================================================ */
  :root{
    color-scheme:light;
    --ink:#191A20;
    --body:#4B4F58;
    --muted:#7A7F8A;
    --paper:#FFFFFF;
    --alt:#F6F7F9;
    --alt-2:#EEF0F4;
    --line:#E3E6EB;
    --line-soft:#EEF0F3;
    --green:#2BAB0D;
    --green-dk:#23900B;
    --green-deep:#01493E;
    --green-soft:#EAF7E5;
    --green-edge:#CFE9C6;
    --red:#EB2C47;
    --red-soft:#FDECEF;
    --teal:#0ACDA1;
    --dark-ground:#191A20;
    --dark-ink:#FFFFFF;
    --dark-body:#D9DCE3;
    --dark-muted:#9EA4B0;
    --shadow:0 1px 2px rgba(25,26,32,.06),0 14px 36px -20px rgba(25,26,32,.45);
    --shadow-lift:0 30px 60px -30px rgba(0,0,0,.55);
    --r:14px;
  }
  @media (prefers-color-scheme:dark){
    :root:not([data-theme="light"]){
      color-scheme:dark;
      --ink:#F2F4F7;
      --body:#B9C0CB;
      --muted:#8B93A1;
      --paper:#14161B;
      --alt:#1A1D24;
      --alt-2:#21252E;
      --line:#2C313B;
      --line-soft:#242932;
      --green:#3FC61C;
      --green-dk:#34AF16;
      --green-deep:#7EE8C4;
      --green-soft:rgba(63,198,28,.13);
      --green-edge:rgba(63,198,28,.38);
      --red:#FF5C73;
      --red-soft:rgba(255,92,115,.12);
      --teal:#22E3B4;
      --dark-ground:#0D0F13;
      --dark-ink:#FFFFFF;
      --dark-body:#C8CED8;
      --dark-muted:#8B93A1;
      --shadow:0 1px 2px rgba(0,0,0,.4),0 14px 36px -20px rgba(0,0,0,.7);
      --shadow-lift:0 30px 60px -30px rgba(0,0,0,.85);
    }
  }
  :root[data-theme="dark"]{
    color-scheme:dark;
    --ink:#F2F4F7;
    --body:#B9C0CB;
    --muted:#8B93A1;
    --paper:#14161B;
    --alt:#1A1D24;
    --alt-2:#21252E;
    --line:#2C313B;
    --line-soft:#242932;
    --green:#3FC61C;
    --green-dk:#34AF16;
    --green-deep:#7EE8C4;
    --green-soft:rgba(63,198,28,.13);
    --green-edge:rgba(63,198,28,.38);
    --red:#FF5C73;
    --red-soft:rgba(255,92,115,.12);
    --teal:#22E3B4;
    --dark-ground:#0D0F13;
    --dark-ink:#FFFFFF;
    --dark-body:#C8CED8;
    --dark-muted:#8B93A1;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 14px 36px -20px rgba(0,0,0,.7);
    --shadow-lift:0 30px 60px -30px rgba(0,0,0,.85);
  }

  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{transition:none!important;animation:none!important}
  }
  body{
    margin:0;background:var(--paper);color:var(--body);
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased;
    padding-bottom:78px;
  }
  @media (min-width:760px){body{padding-bottom:0}}
  h1,h2,h3,h4{font-family:Archivo,Inter,sans-serif;color:var(--ink);letter-spacing:-.012em;text-wrap:balance;margin:0}
  p{margin:0 0 1em}
  a{color:var(--green-deep)}
  :focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:4px}
  .wrap{max-width:1080px;margin:0 auto;padding:0 20px}
  .narrow{max-width:720px;margin:0 auto;padding:0 20px}
  .kicker{font-family:Archivo,sans-serif;font-size:12px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--red);margin:0 0 10px}
  h2.sec{font-size:clamp(26px,3.3vw,36px);line-height:1.14;font-weight:700;margin:0 0 12px}
  p.dek{font-size:17.5px;color:var(--body);margin:0 0 28px;max-width:62ch}
  section.s{padding:56px 0}
  @media (min-width:760px){section.s{padding:72px 0}}
  section.s.alt{background:var(--alt);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .num{font-variant-numeric:tabular-nums}

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    background:var(--green);color:#fff;font-family:Inter,sans-serif;font-weight:700;
    text-decoration:none;padding:14px 26px;border:0;border-radius:100px;font-size:16px;
    cursor:pointer;line-height:1.15;transition:background .15s,transform .15s;
  }
  .btn:hover{background:var(--green-dk);transform:translateY(-1px)}
  .btn.sm{padding:11px 20px;font-size:14.5px}
  .btn.deep{background:var(--green-deep);color:#fff}
  :root[data-theme="dark"] .btn.deep,
  :root:not([data-theme="light"]) .btn.deep{color:#0D0F13}
  @media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .btn.deep{color:#fff}}

  /* ---------- masthead ---------- */
  header.site{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
  .bar{display:flex;align-items:center;gap:14px;padding:11px 0}
  .logo{display:inline-flex;align-items:center;line-height:0;flex:none}
  .logo img{height:38px;width:auto;display:block}
  :root[data-theme="dark"] .logo img,
  :root:not([data-theme="light"]) .logo img{background:#fff;border-radius:6px;padding:3px 5px}
  @media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .logo img{background:none;padding:0}}
  .cobrand{
    display:flex;flex-direction:column;gap:1px;padding-left:14px;
    border-left:1px solid var(--line);min-width:0;
  }
  .cobrand .lbl{font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
  .cobrand .store{font-family:Archivo,sans-serif;font-size:15px;font-weight:700;color:var(--ink);white-space:nowrap}
  .bar .btn{margin-left:auto;flex:none}
  @media (max-width:520px){
    .logo img{height:30px}
    .cobrand{padding-left:10px}
    .cobrand .store{font-size:13.5px}
    .bar .btn{display:none}
  }

  /* ---------- hero: the overheard line ---------- */
  .hero{background:var(--dark-ground);color:var(--dark-body);padding:32px 0 44px;position:relative;overflow:hidden}
  .hero::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(620px 240px at 12% 108%,rgba(10,205,161,.15),transparent 70%);
  }
  .hero .wrap{position:relative;display:grid;gap:26px}
  @media (min-width:940px){
    .hero{padding:52px 0 60px}
    .hero .wrap{grid-template-columns:1.02fr .98fr;gap:52px;align-items:center}
  }
  .lane-tag{
    display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.16);border-radius:100px;padding:6px 13px;
    font-size:11.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
    color:var(--dark-body);margin-bottom:20px;
  }
  .lane-tag i{width:7px;height:7px;border-radius:50%;background:var(--teal);flex:none}
  /* the thesis: the sentence the advisor just said */
  .overheard{
    font-family:Archivo,sans-serif;font-weight:600;font-style:italic;
    font-size:clamp(19px,4.4vw,25px);line-height:1.3;color:var(--dark-muted);
    margin:0 0 6px;padding-left:20px;position:relative;text-wrap:balance;
  }
  .overheard::before{
    content:"\201C";position:absolute;left:-2px;top:-4px;
    font-family:Archivo,sans-serif;font-size:44px;font-weight:800;line-height:1;
    color:var(--teal);opacity:.5;
  }
  .hero h1{
    font-size:clamp(31px,6.2vw,50px);line-height:1.06;font-weight:700;
    color:var(--dark-ink);margin:0 0 14px;
  }
  .hero h1 em{font-style:normal;color:var(--teal)}
  .hero .lead{font-size:17px;line-height:1.55;color:var(--dark-body);margin:0;max-width:44ch}
  @media (min-width:760px){.hero .lead{font-size:18.5px}}

  /* the co-brand promise — the one thing this page has that awe.ca doesn't */
  .waive{
    margin-top:24px;background:rgba(10,205,161,.1);border:1px solid rgba(10,205,161,.3);
    border-left:4px solid var(--teal);border-radius:12px;padding:16px 18px;
  }
  .waive .amt{font-family:Archivo,sans-serif;font-weight:800;font-size:23px;color:var(--dark-ink);line-height:1.1;font-variant-numeric:tabular-nums}
  .waive p{margin:5px 0 0;font-size:14.5px;color:var(--dark-body);line-height:1.5}
  .waive p b{color:var(--dark-ink);font-weight:600}

  /* ---------- quote card ---------- */
  .quote{
    background:var(--paper);color:var(--ink);border-radius:var(--r);
    padding:20px 18px 16px;box-shadow:var(--shadow-lift);border:1px solid var(--line);
  }
  @media (min-width:760px){.quote{padding:24px 24px 18px}}
  #quote{scroll-margin-top:96px}
  .prog{display:flex;gap:6px;margin:0 0 12px}
  .prog i{flex:1;height:4px;border-radius:2px;background:var(--alt-2);transition:background .2s}
  .prog i.on{background:var(--green)}
  .steplbl{font-family:Archivo,sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 5px}
  .quote h2{font-size:20px;font-weight:700;margin:0 0 4px}
  .quote .small{margin:0 0 14px;color:var(--muted);font-size:13.5px;line-height:1.5}
  .st[hidden]{display:none}
  .field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
  .field label{font-size:13px;font-weight:600;color:var(--ink)}
  .field label .req{font-weight:400;color:var(--muted)}
  .field input,.field select,.field textarea{
    font:inherit;font-size:16px;padding:12px 14px;border:1.5px solid var(--line);
    border-radius:10px;background:var(--paper);color:var(--ink);width:100%;
  }
  .field textarea{resize:vertical}
  .field input::placeholder,.field textarea::placeholder{color:var(--muted);opacity:.85}
  .field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--green);outline-offset:1px;border-color:var(--green)}
  .field.bad input,.field.bad select{border-color:var(--red)}
  .err{color:var(--red);font-size:12.5px;font-weight:600;margin:0}
  .hint{font-size:12.5px;color:var(--muted);margin:-4px 0 12px;line-height:1.45}
  .ymm{display:grid;grid-template-columns:1fr;gap:8px}
  .row2{display:grid;grid-template-columns:1fr;gap:8px}
  .row3{display:grid;grid-template-columns:1fr;gap:8px}
  @media (min-width:440px){
    .ymm{grid-template-columns:.8fr 1fr 1.1fr}
    .row2{grid-template-columns:1fr 1fr}
    .row3{grid-template-columns:1.4fr .7fr .9fr}
  }
  .radios{display:flex;flex-direction:column;gap:8px}
  .radios label{display:flex;gap:10px;align-items:center;border:1.5px solid var(--line);border-radius:10px;padding:11px 12px;font-size:15px;font-weight:500;color:var(--ink);cursor:pointer}
  .radios label:has(input:checked){border-color:var(--green);background:var(--green-soft)}
  .radios input{accent-color:var(--green);margin:0;width:18px;height:18px;flex:none}
  .consent{display:flex;gap:11px;align-items:flex-start;background:var(--alt);border:1.5px solid var(--line);border-radius:10px;padding:13px 14px;margin:2px 0 12px}
  .consent.bad{border-color:var(--red)}
  .consent input{accent-color:var(--green);margin:2px 0 0;width:19px;height:19px;flex:none}
  .consent span{font-size:13px;line-height:1.5;color:var(--body)}
  .suffix{position:relative}
  .suffix span{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:14px;pointer-events:none}
  .quote .go{width:100%;font-size:17px;padding:15px 24px;margin-top:2px}
  .nav2{display:flex;gap:8px;align-items:center;margin-top:4px}
  .nav2 .back{background:none;border:0;color:var(--body);font:600 14.5px Inter,sans-serif;cursor:pointer;padding:12px 10px;border-radius:100px;white-space:nowrap}
  .nav2 .back:hover{background:var(--alt)}
  .nav2 .btn{flex:1}
  .fine{font-size:12px;color:var(--muted);margin:10px 0 0;text-align:center;line-height:1.5}
  .fine b{color:var(--ink);font-weight:600}
  .okbig{width:50px;height:50px;border-radius:50%;background:var(--green-soft);border:1px solid var(--green-edge);display:flex;align-items:center;justify-content:center;margin:0 0 13px}
  .ref{font-family:Archivo,sans-serif;font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--green-deep);background:var(--green-soft);border:1px solid var(--green-edge);border-radius:8px;padding:7px 11px;display:inline-block;margin:0 0 14px;font-variant-numeric:tabular-nums}
  .extra{background:var(--alt);border:1px solid var(--line);border-radius:12px;padding:14px 14px 6px;margin-top:6px}
  .extra .field{margin-bottom:10px}
  .extra .btn{font-size:15px;padding:12px 20px;margin:2px 0 8px}

  /* ---------- trust strip ---------- */
  .strip{background:var(--paper);border-bottom:1px solid var(--line)}
  .strip .wrap{display:flex;flex-wrap:wrap;gap:10px 30px;padding:14px 20px;justify-content:center;font-size:13.5px;font-weight:600;color:var(--ink)}
  .strip span{display:inline-flex;align-items:center;gap:8px}
  .strip svg{flex:none}

  /* ---------- the estimate reckoner ---------- */
  .costs{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper)}
  .costs .row{display:flex;align-items:baseline;gap:14px;padding:14px 18px;border-bottom:1px solid var(--line-soft)}
  .costs .row:last-child{border-bottom:0}
  .costs .row .part{font-weight:600;color:var(--ink);font-size:15.5px;flex:1;min-width:0}
  .costs .row .part small{display:block;font-weight:400;color:var(--muted);font-size:12.5px;line-height:1.4;margin-top:2px}
  .costs .row .amt{font-family:Archivo,sans-serif;font-weight:700;font-size:17px;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
  .costs .head{background:var(--alt);border-bottom:1px solid var(--line)}
  .costs .head .part,.costs .head .amt{font-family:Archivo,sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
  .costnote{font-size:13px;color:var(--muted);margin:12px 0 0;line-height:1.55}

  /* ---------- covered / steps / faq ---------- */
  .grid{display:grid;gap:16px}
  @media (min-width:700px){.grid.g2{grid-template-columns:1fr 1fr}.grid.g3{grid-template-columns:repeat(3,1fr)}}
  @media (min-width:980px){.grid.g4{grid-template-columns:repeat(4,1fr)}}
  @media (min-width:700px) and (max-width:979px){.grid.g4{grid-template-columns:1fr 1fr}}
  .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px 20px}
  section.s.alt .card{background:var(--paper)}
  .card h3{font-size:18px;font-weight:700;margin:0 0 7px}
  .card p{margin:0;font-size:15px;line-height:1.55}
  .ico{width:42px;height:42px;border-radius:11px;background:var(--green-soft);border:1px solid var(--green-edge);display:flex;align-items:center;justify-content:center;margin:0 0 14px}

  /* claim sequence — genuinely ordered, so it is numbered */
  .seq{list-style:none;margin:0;padding:0;counter-reset:sq}
  .seq li{counter-increment:sq;position:relative;padding:16px 0 16px 54px;border-bottom:1px solid var(--line-soft)}
  .seq li:last-child{border-bottom:0}
  .seq li::before{
    content:counter(sq);position:absolute;left:0;top:15px;width:34px;height:34px;
    border-radius:9px;background:var(--green-soft);border:1px solid var(--green-edge);
    color:var(--green-deep);font-family:Archivo,sans-serif;font-weight:700;font-size:16px;
    display:flex;align-items:center;justify-content:center;
  }
  .seq li b{display:block;color:var(--ink);font-size:16.5px;font-family:Archivo,sans-serif;font-weight:700;margin-bottom:3px}
  .seq li span{font-size:15px;line-height:1.55;display:block}

  details{border-top:1px solid var(--line);padding:15px 0}
  details:last-of-type{border-bottom:1px solid var(--line)}
  summary{cursor:pointer;font-family:Archivo,sans-serif;font-weight:700;font-size:16.5px;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:14px}
  summary::-webkit-details-marker{display:none}
  summary::after{content:"+";color:var(--green);font-weight:700;font-size:21px;line-height:1;flex:none}
  details[open] summary::after{content:"\2013"}
  details p{margin:10px 0 0;font-size:15.5px}

  .cta{background:var(--dark-ground);color:var(--dark-body);border-radius:18px;padding:32px 26px;position:relative;overflow:hidden}
  .cta::after{content:"";position:absolute;right:-70px;top:-70px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(43,171,13,.32),transparent 70%)}
  .cta > *{position:relative}
  .cta h2{color:var(--dark-ink);font-size:clamp(23px,3vw,30px);margin:0 0 8px}
  .cta p{color:var(--dark-body);margin:0 0 20px;max-width:52ch}

  footer.site{background:var(--dark-ground);color:var(--dark-muted);padding:40px 0 36px;font-size:13.5px;border-top:1px solid var(--line)}
  footer.site .fg{display:grid;gap:22px;margin-bottom:24px}
  @media (min-width:760px){footer.site .fg{grid-template-columns:1.5fr 1fr 1fr}}
  footer.site h4{font-family:Inter,sans-serif;color:var(--dark-ink);font-size:12px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;margin:0 0 11px}
  footer.site a{color:var(--dark-body);text-decoration:none;display:block;padding:3px 0}
  footer.site a:hover{color:var(--dark-ink);text-decoration:underline}
  footer.site .legal{border-top:1px solid rgba(255,255,255,.13);padding-top:16px;font-size:12px;line-height:1.6;color:var(--dark-muted)}
  footer.site .legal p{max-width:96ch}
  .dealerlink{display:inline-block;margin-top:10px;font-size:12.5px;color:var(--dark-muted)}
  .dealerlink a{display:inline;color:var(--teal);text-decoration:underline}

  /* sticky thumb CTA — every visitor arrives on a phone */
  .mcta{
    position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;gap:12px;
    align-items:center;justify-content:space-between;padding:10px 16px;
    background:var(--paper);border-top:1px solid var(--line);
    box-shadow:0 -6px 24px -12px rgba(0,0,0,.3);
  }
  .mcta small{font-size:11.5px;color:var(--body);line-height:1.3}
  .mcta small b{display:block;color:var(--ink);font-size:13.5px;font-family:Archivo,sans-serif;font-weight:700}
  .mcta.off{display:none}
  @media (min-width:760px){.mcta{display:none}}


/* ---------- review flags: staging only, never for the public ---------- */
.flag{display:none}
html.review .flag{
  display:inline-block;background:#FEF6E7;border:1px dashed #B47D18;color:#7A5410;
  font-size:12.5px;font-weight:600;line-height:1.45;padding:3px 9px;border-radius:6px;margin:4px 0;
}
html.review .flag[data-kind="VERIFY"]{background:#FDECEF;border-color:#C2384C;color:#8E1B2C}
.revbar{
  position:fixed;left:0;right:0;bottom:0;z-index:90;background:#7A5410;color:#fff;
  font:600 12.5px Inter,sans-serif;text-align:center;padding:7px 12px;
}
.revbar[hidden]{display:none}

/* ---------- honeypot: off-screen, never announced ---------- */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- the Turnstile widget sits above the submit button ---------- */
.cf-turnstile{margin:2px 0 12px;min-height:65px}

/* ---------- root page (awedealerdrive.ca/) ---------- */
.plain{max-width:640px;margin:0 auto;padding:56px 20px 72px}
.plain h1{font-size:clamp(28px,5vw,40px);line-height:1.1;margin:0 0 14px}
.plain p{font-size:17px;color:var(--body)}
.plain .storecard{
  display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:18px 20px;margin:10px 0;text-decoration:none;box-shadow:var(--shadow);
}
.plain .storecard b{display:block;font-family:Archivo,sans-serif;font-size:18px;color:var(--ink)}
.plain .storecard span{font-size:14.5px;color:var(--muted)}
