/* Lead magnet site styles. Colours and fonts come from brand.css, generated from site.yaml brand. Do not put colours here. */
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);font-size:1.0625rem;line-height:1.6}
img{max-width:100%;height:auto}
a{color:var(--brand)}
a:hover{color:var(--brand-dark)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
h1,h2,h3{font-family:var(--display);color:var(--ink-strong);font-weight:500;margin:0;text-wrap:balance}
h1{font-size:clamp(2rem,5.5vw,3rem);line-height:1.1}
h2{font-size:clamp(1.35rem,3.4vw,1.7rem);line-height:1.2}
h3{font-size:1.1rem;line-height:1.3;font-weight:600}
p{margin:0}
.wrap{max-width:44rem;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.prose{display:grid;gap:1.25rem;padding-block:0 1.25rem}

header.site{background:var(--surface);border-bottom:3px solid var(--brand)}
header.site .wrap{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-block:.9rem}
header.site .logo img{display:block;width:180px}
header.site .phone{font-family:var(--display);font-weight:500;text-decoration:none;white-space:nowrap}

.hero{background:var(--surface);border-bottom:1px solid var(--line);margin-bottom:2rem}
.hero .wrap{display:grid;gap:1rem;padding-block:2.5rem 2.25rem}
.eyebrow,.step,.qnum{font-family:var(--display);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brand);font-weight:500}
.hero .lede{font-size:1.2rem;color:var(--ink-strong);max-width:36ch}
.hero .sub{color:var(--muted);max-width:62ch;display:grid;gap:.75rem}
.muted{color:var(--muted)}
.muted p+p,.panel p+p{margin-top:.6rem}
ul.magnets{list-style:none;margin:0;padding:0;display:grid;gap:1.25rem}
ul.magnets h2 a{color:inherit;text-decoration:none}
ul.magnets h2 a:hover{color:var(--brand)}
#leadform{display:grid;gap:1rem}

.card{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--brand);padding:1.5rem;display:grid;gap:1.25rem}
.card>header{display:grid;gap:.4rem}
.q{display:grid;gap:.6rem;padding-bottom:1.25rem;border-bottom:1px dashed var(--line)}
.q:last-of-type{border-bottom:0;padding-bottom:0}
.qtext{font-weight:600;color:var(--ink-strong);max-width:52ch}
.note{font-size:.92rem;color:var(--muted);max-width:60ch}
.choices{display:flex;gap:.6rem;flex-wrap:wrap}
button{font:inherit;cursor:pointer}
.choice{font-family:var(--display);font-weight:500;padding:.5rem 1.6rem;background:var(--surface);color:var(--ink-strong);border:1px solid var(--line-strong);border-radius:3px}
.choice:hover{border-color:var(--brand)}
.choice[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:#fff}

.panel{border-left:4px solid var(--brand);background:var(--brand-soft);padding:1.1rem 1.25rem;display:grid;gap:.6rem}
.panel.warn{border-left-color:var(--warn);background:var(--warn-soft)}
.panel p{max-width:62ch}

.fields{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr))}
label{display:grid;gap:.3rem;font-size:.9rem;color:var(--muted);min-width:0}
input[type=text],input[type=email],input[type=tel]{font:inherit;color:var(--ink-strong);background:var(--surface);border:1px solid var(--line-strong);border-radius:3px;padding:.6rem .7rem;width:100%;min-width:0}
.hp-field{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.privacy{font-size:.88rem;color:var(--muted);max-width:60ch}
.rowbtns{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center}
.cta{display:inline-block;font-family:var(--display);font-weight:500;font-size:1rem;background:var(--brand);color:#fff;border:1px solid var(--brand);border-radius:3px;padding:.7rem 1.5rem;text-decoration:none}
.cta:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}
.cta.ghost{background:transparent;color:var(--brand)}
.cta.ghost:hover{background:var(--brand-soft);color:var(--brand-dark)}
.cta[disabled]{opacity:.6;cursor:wait}
.msg{font-size:.92rem}
.msg.err{color:var(--warn)}

ol.list{counter-reset:item;margin:0;padding:0;display:grid;gap:1.1rem}
ol.list>li{list-style:none;display:grid;grid-template-columns:2.25rem 1fr;gap:.2rem .75rem;padding-bottom:1.1rem;border-bottom:1px solid var(--line)}
ol.list>li:last-child{border-bottom:0;padding-bottom:0}
ol.list>li::before{counter-increment:item;content:counter(item);font-family:var(--display);font-size:1.3rem;font-weight:500;color:var(--brand);line-height:1.2;grid-row:span 4}
.qq{font-weight:600;color:var(--ink-strong);max-width:54ch}
.why{font-size:.95rem;color:var(--muted);max-width:60ch}
.starred{font-family:var(--display);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--warn)}
.space{display:none}
.disclaim{font-size:.92rem;color:var(--muted);border-top:1px solid var(--line);padding-top:1rem;max-width:64ch}

footer.site{background:var(--surface);border-top:1px solid var(--line);margin-top:2.5rem}
footer.site .wrap{display:grid;gap:.75rem;padding-block:1.75rem}
footer.site p{font-size:.9rem;color:var(--muted);max-width:62ch}
footer.site .small{font-size:.8rem}

@media (max-width:30rem){
  .card{padding:1.15rem}
  header.site .logo img{width:140px}
}
@media print{
  @page{margin:16mm}
  body{background:#fff;font-size:11pt}
  header.site{border-bottom:2px solid var(--brand)}
  header.site .phone{color:var(--ink)}
  .hero{border:0;margin:0}
  .hero .wrap{padding-block:.5rem 1rem}
  .card{border:0;padding:0}
  .noprint,.panel.noprint{display:none!important}
  ol.list>li{break-inside:avoid}
  .space{display:block;grid-column:2;height:2.2rem;border-bottom:1px dotted var(--line-strong)}
  footer.site{border:0;margin-top:1rem}
  a{color:var(--ink);text-decoration:none}
}
.download .cta.big{font-size:1.15rem;padding:1rem 2rem}
.download .cta.big::before{content:"\2193\00a0"}
