/* PlainTalkMortgage — Concept B production design system (Whip III).
   Mobile-first: designed at 375-390px, expanded deliberately.
   One accent (#1D4ED8); teal (#0F766E) reserved for the reverse path.
   All text pairs >= 4.5:1; footer pairs >= 10.69:1 (see DESIGN_SYSTEM.md). */
:root{
  --ink:#0B1220; --muted:#475569; --accent:#1D4ED8; --accent-d:#1E40AF;
  --teal:#0F766E; --bg:#F4F7FB; --card:#FFFFFF; --line:#D7E0EC; --soft:#EAF0FB;
  --err:#B91C1C; --focus:#B45309; --foot:#0B1220; --foot-t:#E6EDF7; --foot-m:#B8C5D6;
  --radius:16px; --maxw:1180px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:auto}
html.fs-plus{font-size:20px}
html.fs-max{font-size:22px}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:1rem;line-height:1.55;color:var(--ink);background:var(--bg)}
body.senior{font-size:1.125rem;line-height:1.65}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 16px}
h1{font-size:clamp(1.9rem,7vw,2.9rem);line-height:1.08;letter-spacing:-.03em;font-weight:850;margin:.3em 0 .5em;color:var(--ink)}
h2{font-size:clamp(1.4rem,5vw,2rem);letter-spacing:-.015em;margin:1.2em 0 .5em;color:var(--ink)}
/* Visual-depth pass (D5 signature + M2 system): one ownable motif — a short
   accent keyline under every H2 — plus the in-house section-icon set.
   Both are hierarchy devices: they mark where a new section starts in
   long guides. Senior pages use the teal register. */
h2::after{content:"";display:block;width:44px;height:3px;border-radius:2px;background:var(--accent);margin-top:8px}
body.senior h2::after{background:var(--teal)}
.secicon{width:21px;height:21px;vertical-align:-3px;margin-right:9px;color:var(--accent);flex:none}
body.senior .secicon{color:var(--teal)}
.page-eyebrow{display:flex;align-items:center;gap:8px;margin:14px 0 0}
.eyebrow-icon{width:17px;height:17px;color:var(--accent-d);flex:none}
/* D5: oversized tabular numerals for key figures (limits band, pull-stats). */
.bignum{font-size:clamp(1.35rem,4.6vw,1.9rem);font-weight:850;letter-spacing:-.03em;line-height:1.05;font-variant-numeric:tabular-nums;color:var(--ink)}
h3{font-size:1.12rem;margin:1em 0 .35em;color:var(--ink)}
p,li{max-width:72ch}
a{color:var(--accent-d);text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-9999px;top:0;background:#fff;color:var(--ink);padding:12px 18px;z-index:99;border:2px solid var(--accent)}
.skip:focus{left:8px;top:8px}
.preview-banner{background:#FFF7E6;color:#6d3b00;padding:10px 16px;text-align:center;font-weight:650;border-bottom:1px solid var(--line)}
/* Header + drawer nav */
header.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line)}
.headrow{display:flex;align-items:center;gap:10px;min-height:64px;padding:6px 0}
.brandbox{line-height:1.12;min-width:0}
.logo{font-size:1.32rem;font-weight:800;letter-spacing:-.02em;color:var(--ink);text-decoration:none;white-space:nowrap}
.logo span{color:var(--accent)}
.sitesub{display:block;color:var(--muted);font-size:.8rem;font-weight:600}
.headcall{margin-left:auto;display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;background:var(--accent);color:#fff;border-radius:12px;font-weight:750;text-decoration:none;white-space:nowrap}
.burger{margin-left:8px;background:#fff;border:1px solid var(--line);border-radius:10px;min-height:44px;min-width:48px;font-size:1.25rem;cursor:pointer;color:var(--ink);flex:none}
nav.primary{position:relative}
nav.primary ul{list-style:none;margin:0;padding:0}
nav.primary a{display:flex;align-items:center;min-height:48px;padding:10px 12px;color:var(--ink);font-weight:650;text-decoration:none;border-radius:10px}
nav.primary a:hover{background:var(--soft);color:var(--accent-d)}
nav.primary a.applylink{color:var(--accent-d);font-weight:800}
@media (max-width:767px){
  nav.primary ul{display:none;position:absolute;top:6px;left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px;box-shadow:0 12px 30px rgba(11,18,32,.16);z-index:60}
  nav.primary.open ul{display:block}
  /* Corrective pass #2: ONE-row compact header (brand + Call + burger),
     sticky in this compact form; total height stays <=120px (measured
     ~76px at 390px). The senior toolbar lives in <main>, never in the
     sticky header element. */
  .headrow{min-height:56px;padding:8px 0;gap:8px;flex-wrap:nowrap}
  .brandbox{flex:1 1 auto}
  .logo{font-size:1.08rem}
  .sitesub{font-size:.7rem}
  .headcall{font-size:.88rem;padding:8px 10px;margin-left:0}
  .burger{margin-left:0}
}
@media (max-width:360px){
  /* Micro-fix B2: the one-row lockup is designed for 320px — smaller
     wordmark, tighter Call button and burger — so logo, Call and burger
     share the row with measured clearance instead of overlapping. */
  .headrow{gap:5px}
  .logo{font-size:.8rem;letter-spacing:-.03em}
  .sitesub .tagline{display:none}
  .headcall{font-size:.78rem;padding:8px 5px}
  .burger{min-width:42px;font-size:1.05rem}
}
/* Micro-fix A4: at the largest senior text setting (A++, root 22px) the
   sticky lockup and the senior toolbar chrome stop scaling with the
   root, so the Key Facts block's first fact line stays readable inside
   the first 390px viewport. Body copy itself still scales to 24.75px;
   only the header/toolbar/heading chrome is capped, in px. */
html.fs-max body.senior .headrow{min-height:52px;padding:4px 0;gap:6px}
html.fs-max body.senior .logo{font-size:17px}
html.fs-max body.senior .sitesub .tagline{display:none}
html.fs-max body.senior .headcall{font-size:14px;padding:8px 10px}
html.fs-max body.senior .burger{font-size:18px;min-width:44px}
html.fs-max body.senior .crumbs{font-size:14px;padding-top:6px}
html.fs-max body.senior .seniortools{padding:12px;margin:10px 0}
html.fs-max body.senior .seniortools .callbig{font-size:20px}
html.fs-max body.senior .keyfacts{padding:12px;margin:10px 0}
html.fs-max body.senior .keyfacts h2{font-size:24px;margin:0 0 6px}
@media (min-width:768px){
  .burger{display:none}
  nav.primary ul{display:flex;flex-wrap:wrap;gap:2px;padding:2px 0 10px}
  nav.primary a{min-height:44px}
  .headrow{min-height:68px}
}
.crumbs{font-size:.92rem;color:var(--muted);padding-top:10px}
.crumbs a{color:var(--muted)}
/* Hero / cards / pathways */
.hero{padding:26px 0 8px}
.eyebrow{font-size:.8rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-d)}
.lede{font-size:1.1rem;line-height:1.5;color:var(--muted);max-width:62ch}
/* Visual-depth D1: the desktop copy column's designed middle — the year's
   real loan limits (claims-ledger figures only, HOME-06/07/08) rendered as
   a data component between the lede and the identity chip, so the column
   is content-driven instead of a chip pinned across empty ground. */
.limitsband{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin:16px 0 4px;box-shadow:0 1px 3px rgba(11,18,32,.06)}
.limitsband-title{font-weight:800;margin:0 0 10px}
.limitsrow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.limitstat{display:flex;flex-direction:column;gap:3px;min-width:0}
.limitlabel{font-size:.82rem;color:var(--muted);line-height:1.35}
.limitsband .micro{margin:10px 0 0}
@media (max-width:480px){
  .limitstat .bignum{font-size:1.08rem}
  .limitlabel{font-size:.76rem}
}
.chip{display:inline-flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px 8px 8px;font-weight:650;margin-top:12px;max-width:100%}
.avatar{width:40px;height:40px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;flex:none}
.grid,.grid2,.cards{display:grid;gap:18px;margin:16px 0}
.card,.cards>section{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:0 1px 3px rgba(11,18,32,.06)}
.cards>section{border-top:6px solid var(--accent);display:flex;flex-direction:column}
/* Visual-depth M3/D3: card content distributes — the CTA row is anchored
   to the card foot, so no card holds a dead empty bottom. */
.cards>section .cardfoot{margin-top:auto;padding-top:10px}
.pathcard p{margin:.4em 0}
.pathcard h3{margin:.45em 0 .3em}
@media (max-width:767px){
  .cards>section{padding:16px}
  .pathcard .cardicon{margin-bottom:5px}
}
.card.green{background:var(--soft)}
.pathcard{border-top:6px solid var(--accent)}
.pathcard.rev{border-top-color:var(--teal)}
.tag{display:inline-block;background:var(--soft);color:var(--accent-d);border-radius:999px;padding:3px 10px;font-size:.8rem;font-weight:800}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 20px;border-radius:12px;background:var(--accent);color:#fff;text-decoration:none;font-weight:750;border:1px solid var(--accent);cursor:pointer;font-size:1rem;margin:4px 8px 4px 0}
.btn:hover{background:var(--accent-d)}
.btn.ghost,.btn.light{background:#fff;color:var(--accent-d);border-color:var(--accent)}
.btn.teal{background:var(--teal);border-color:var(--teal)}
.micro,.disc{font-size:.88rem;color:var(--muted)}
.note{background:var(--soft);border-left:5px solid var(--accent);padding:12px 16px;margin:16px 0;border-radius:0 var(--radius) var(--radius) 0}
.warn{background:#FBF3E4;border-left:5px solid #92400E;padding:12px 16px;margin:16px 0;border-radius:0 var(--radius) var(--radius) 0}
.trustbar{background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);padding:12px 16px;margin:14px 0}
.tablewrap{overflow-x:auto}
main a{overflow-wrap:anywhere}
main p,main li,main dd,main dt,main summary{overflow-wrap:anywhere}
table{width:100%;border-collapse:collapse;margin:14px 0;font-size:1rem;font-variant-numeric:tabular-nums;table-layout:fixed}
th,td{overflow-wrap:anywhere}
caption{text-align:left;font-weight:700;padding-bottom:8px}
th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{background:var(--soft)}
/* Visual-depth D4/M5: tables as designed data components. The generator
   wraps every content table in .datacard (containment + header treatment +
   row striping), right-aligns figure cells (.num), emphasises the
   key-numbers tables (.keynums), and renders Source columns compactly
   (.srctable) — a small citation chip instead of a multi-line underlined
   ribbon at phone widths. Numbers are this site's differentiator; the
   component now looks like it. */
.tablewrap.datacard{border:1px solid var(--line);border-radius:12px;background:#fff;padding:2px 14px;margin:16px 0;box-shadow:0 1px 3px rgba(11,18,32,.06)}
.datacard table{margin:0}
.datacard tbody tr:nth-child(even){background:var(--bg)}
.datacard tbody tr:last-child td{border-bottom:none}
td.num{text-align:right;font-variant-numeric:tabular-nums}
.keynums td.num{font-weight:800;font-size:1.06rem}
.srctable .col-item{width:30%}
.srctable .col-fig{width:34%}
.srctable .col-src{width:36%}
/* Figure cells never break mid-number: wrapping happens at spaces, so a
   figure reads as whole tokens ("$541,287 to" / "$1,249,125"). */
td.num{overflow-wrap:normal}
/* R4 fix (borrower-trust panel): the global th,td overflow-wrap:anywhere
   let Item labels split mid-word at phone widths ("Conformin g") inside
   the 30% first column. Inside datacards, words break only at spaces
   (break-word permits a break only when one word alone cannot fit),
   and at phone widths the first column gets room to hold its labels. */
.datacard th,.datacard td{overflow-wrap:break-word}
@media (max-width:560px){
  .srctable .col-item{width:36%}
  .srctable .col-fig{width:32%}
  .srctable .col-src{width:32%}
  .datacard th,.datacard td{padding:10px 6px}
  .keynums td.num{font-size:1rem}
}
.srctable td:last-child{font-size:.84rem;color:var(--muted);line-height:1.4}
.srctable td:last-child a{display:block;background:var(--soft);color:var(--accent-d);border-radius:8px;padding:4px 8px;text-decoration:none;font-weight:650}
.srctable td:last-child a:hover{text-decoration:underline}
.result td{text-align:right;font-variant-numeric:tabular-nums}
details{border:1px solid var(--line);border-radius:12px;padding:6px 16px 12px;background:#fff;margin:12px 0}
summary{font-weight:750;cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--ink)}
/* Byline / CTA band */
.byline{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px;margin:18px 0}
.byline .avatar{width:48px;height:48px;font-size:1.05rem}
.ctaband{background:var(--foot);color:var(--foot-t);border-radius:var(--radius);padding:24px;margin:26px 0}
.ctaband h2{color:#fff;margin-top:0}
.ctaband p{color:var(--foot-m)}
.ctaband .btn.light{background:#fff;color:var(--accent-d)}
/* Senior toolbar + summary */
.seniortools{background:#fff;border:1px solid var(--line);border-top:6px solid var(--teal);border-radius:var(--radius);padding:18px;margin:16px 0}
.seniortools .callbig{font-size:1.3rem;font-weight:800}
.sizebtns button{min-height:48px;min-width:52px;border-radius:10px;border:1.5px solid var(--accent-d);background:#fff;color:var(--accent-d);font-weight:800;cursor:pointer;margin-right:6px}
.sizebtns button[aria-pressed="true"]{background:var(--accent);color:#fff}
.keyfacts{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin:16px 0}
.keyfacts h2{margin-top:0}
/* Corrective pass #10: senior tables render at the senior body size
   (was .97rem of the 16px root = 15.52px against an 18px body). */
body.senior table{font-size:1.125rem}
/* Visual-depth: the key-numbers emphasis never drops a senior table
   below the senior body size. */
body.senior .keynums td.num{font-size:1.125rem}
.pathcard>p:last-child{margin-top:auto}
/* Corrective pass #4: plain-words summary ahead of the statutory block. */
.plainwords{background:#fff;border:1px solid var(--line);border-left:5px solid var(--teal);border-radius:0 var(--radius) var(--radius) 0;padding:14px 18px;margin:18px 0}
.plainwords h3{margin-top:0}
/* Micro-fix A3: one protection per line — the box is a short list, not
   one unbroken paragraph. */
.plainwords ul{margin:8px 0;padding-left:22px}
.plainwords li{margin:7px 0}
/* Calculators */
.calc{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin:18px 0;box-shadow:0 1px 3px rgba(11,18,32,.06)}
.calc h2{margin-top:0}
/* Corrective pass #9 kept the legend clear of the card border;
   micro-fix B6 finishes the job: fieldset/legend semantics are
   unchanged, but the legend is floated so it renders INSIDE the
   fieldset's padding zone as an inset heading — the fieldset border
   runs continuously around it and the legend never touches it. */
fieldset{border:1px solid var(--line);border-radius:12px;margin:22px 0 14px;padding:18px 16px 14px}
legend{float:left;width:100%;font-weight:700;font-size:1.08rem;padding:0;margin:0 0 8px;background:transparent}
label{display:block;font-weight:700;margin:14px 0 6px}
input[type="text"],input[type="number"],input[type="email"],input[type="tel"],input[type="search"],select,textarea{width:100%;min-height:48px;padding:10px 12px;font-size:1rem;border:1.5px solid #64748B;border-radius:10px;background:#fff;color:var(--ink);font-family:inherit}
input[type="radio"]{width:22px;height:22px;min-height:22px;accent-color:var(--accent);flex:none;margin:0}
input[type="checkbox"]{width:26px;height:26px;min-height:26px;accent-color:var(--accent);flex:none;margin:0}
label:has(> input[type="radio"]),label:has(> input[type="checkbox"]){display:flex;gap:10px;align-items:flex-start;font-weight:600;min-height:48px;padding:8px 4px;margin:4px 0}
textarea{min-height:110px}
.result{display:none;background:var(--soft);border-radius:var(--radius);padding:16px 20px;margin-top:16px;min-height:120px}
.result.show{display:block}
/* Visual-depth motion (spec: at most a result-update emphasis, transform/
   opacity only so layout never moves and CLS stays 0; the reduced-motion
   block below disables it wholesale). */
@keyframes resultIn{from{opacity:.35;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
.result.show{animation:resultIn .35s ease}
.result .big{font-size:clamp(1.9rem,6vw,2.6rem);font-weight:850;letter-spacing:-.02em;line-height:1.05;font-variant-numeric:tabular-nums;color:var(--ink)}
.result table{font-size:1rem}
.bar{display:flex;height:22px;border-radius:8px;overflow:hidden;margin:14px 0 6px;border:1px solid var(--line);background:#fff}
.bar i{display:block;height:100%}
/* Micro-fix C1: PITI segment colours live in the stylesheet (the CSP
   blocks inline style attributes in production); segment WIDTHS are
   applied by calculators-ui.js through CSSOM after insertion. */
.bar i.seg-pi{background:#1D4ED8}
.bar i.seg-tax{background:#0F766E}
.bar i.seg-ins{background:#B45309}
.bar i.seg-hoa{background:#64748B}
.bar i.seg-pmi{background:#BE185D}
.legend{list-style:none;padding:0;margin:8px 0}
.legend li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.err{display:none;background:#FDECEC;border:1px solid var(--err);color:#6d1414;border-radius:12px;padding:10px 14px;margin-top:12px;font-weight:600}
.err.show{display:block}
.field-err{color:var(--err);font-weight:650;font-size:.92rem;display:block;margin-top:4px}
[aria-invalid="true"]{border-color:var(--err)!important}
.honeypot{position:absolute;left:-9999px;height:0;overflow:hidden}
/* Intent cards */
.intents{display:grid;gap:18px;margin:16px 0}
.intentcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column}
.intentcard p:last-child{margin-top:auto;padding-top:8px}
.intentcard.applycard{border-top:6px solid var(--accent)}
/* Footer */
footer{background:var(--foot);color:var(--foot-t);padding:34px 0 40px;margin-top:40px}
footer a{color:#C7D7F5}
footer p,footer li{color:var(--foot-t);font-size:.95rem}
footer .disc{color:var(--foot-m)}
footer .fcols{display:grid;gap:22px}
footer ul{list-style:none;padding:0;margin:6px 0}
footer li{margin:4px 0}
footer li a{display:inline-flex;align-items:center;min-height:32px}
footer .eh{display:flex;align-items:center;gap:12px;margin:14px 0 4px}
footer .ehlogo{width:47px;height:auto;display:block}
.stickycta{display:none}
/* Corrective pass #1: hero composition restored from the approved
   Concept B prototype — eyebrow, identity chip, and (at >=1024px) a
   two-column hero with the live-estimate card on the right. */
/* Micro-fix B1/B3: the home hero is one grid. DOM order is copy →
   pathways → estimate → steps, which is the mobile order (the approved
   prototype's order: copy/chip, then pathways, then the estimate).
   At >=1024px grid areas restore the two-column hero (copy | estimate)
   with the steps strip as a full-width row under both columns and the
   pathways full-width below that — the desktop hero columns are
   unchanged. The copy column is a flex column whose chip is pinned to
   the bottom edge, aligned with the estimate card's bottom, so the
   copy spans the hero row instead of floating at its top. */
.hero-grid{display:grid;gap:20px;margin:10px 0 4px;grid-template-areas:"copy" "paths" "calc" "steps"}
.hero-copy{grid-area:copy}
.hero-paths{grid-area:paths}
.hero-paths h2{margin-top:0}
.hero-calc{grid-area:calc;margin:0}
.hero-steps{grid-area:steps}
.hero-steps h2{margin-top:0}
.steps{display:grid;gap:18px}
.steps .card h3{margin-top:0}
.hero-calc{margin:0}
.cardicon{width:30px;height:30px;color:var(--accent);display:block;margin-bottom:8px}
.cards>section.rev{border-top-color:var(--teal)}
.cards>section.rev .cardicon{color:var(--teal)}
.tag.teal{background:#E7F4F1;color:#0B5A52}
.pathcard ul{margin:8px 0;padding-left:20px}
.pathcard li{margin:4px 0}
/* Visual-depth D3: hub intros are composed, not flowed — a lead block plus
   a designed "which group fits you" panel. A composed block cannot break
   mid-sentence across a column the way the old column-count flow did. */
.hubintro-lead{font-size:1.08rem;line-height:1.55;max-width:72ch;margin:.4em 0}
.fitpanel{background:var(--soft);border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0;padding:14px 18px;margin:14px 0 6px}
.fitpanel p{margin:.3em 0}
.fitlabel{font-size:.8rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-d)}
.btn.sm{min-height:44px;padding:9px 16px;font-size:.95rem}
.hubcard.rev .btn.ghost{color:#0B5A52;border-color:var(--teal)}
@media (min-width:1024px){
  /* Visual-depth D2: desktop order matches mobile/prototype — pathways
     directly after the top row, steps after. */
  .hero-grid{grid-template-columns:1.02fr .98fr;gap:28px;grid-template-areas:"copy calc" "paths paths" "steps steps";align-items:start}
  /* Visual-depth D1: the copy column is content-driven — eyebrow, H1,
     lede, limits band, chip in flow. The chip is NOT bottom-pinned
     across empty ground (the R3 void); the column ends where its
     content ends. */
  .hero-copy{display:flex;flex-direction:column}
  .hero-copy .chip{margin-top:18px;align-self:flex-start}
  /* Visual-depth M4/D2: the hero estimate card is compact (tighter field
     spacing; inputs keep their 48px touch height) so its live result
     numeral clears the 900px fold. */
  .hero-calc{padding-top:16px}
  .hero-calc h2{margin-bottom:.3em}
  .hero-calc h3{margin-top:.2em}
  .hero-calc fieldset{margin:6px 0;padding:10px 14px}
  .hero-calc label{margin:5px 0 4px}
  .hero-calc legend{margin-bottom:2px}
  .hero-calc .btn{margin-top:0;margin-bottom:0}
  .hero-calc .result{padding:13px 16px;margin-top:8px}
  .hero-calc .result th,.hero-calc .result td{padding:6px 8px}
  /* Corrective pass #1e: calculator pages go side-by-side — inputs in
     one column, the result sticky in the other — instead of one
     full-width column. The home hero calculator is excluded: it is
     already the narrow right column of the hero split. */
  .calc:not(.hero-calc) form{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,1fr);gap:6px 22px;align-items:start}
  .calc:not(.hero-calc) form fieldset{grid-column:1;grid-row:1/span 3;margin-top:6px}
  .calc:not(.hero-calc) form .btn{grid-column:1;justify-self:start}
  .calc:not(.hero-calc) form .err{grid-column:1}
  .calc:not(.hero-calc) form .result{grid-column:2;grid-row:1;position:sticky;top:96px;margin-top:6px}
}
/* Micro-fix B4: hub cards share the home card anatomy — icon, title,
   existing text, and an arrow CTA link. */
.hubcard h3{margin-top:0}
.hubcard .cardcta{font-weight:750}
.hubcard .cardcta::after{content:" \2192";color:var(--accent)}
/* Micro-fix A6: the About advisor disc sits in a flex row with the
   lede, aligned with the text block at every width. */
.advisor{display:flex;gap:14px;align-items:center;margin:16px 0}
.advisor p{margin:0}
.advisor .avatar{width:48px;height:48px;font-size:1.05rem}
@media (min-width:768px){
  .wrap{padding:0 20px}
  .grid,.cards,.steps{grid-template-columns:repeat(3,1fr)}
  .grid2,.intents{grid-template-columns:repeat(2,1fr)}
  footer .fcols{grid-template-columns:2fr 1fr 1fr}
  .card,.cards>section{padding:22px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
}
[id]{scroll-margin-top:96px}
.comparetool{border-top:3px solid var(--line);margin-top:32px;padding-top:8px}
.familynav{margin:0 0 16px}
@media print{
  header.site,nav.primary,.burger,.ctaband,.seniortools .sizebtns,.seniortools .sizerow,[data-print],.no-print{display:none!important}
  /* Micro-fix A2: screen-only lines (e.g. the plain-words box's
     "The full legal wording follows below", whose target block is
     itself print-hidden) never print — the handout must not promise
     content the paper does not contain. Screen rendering unchanged. */
  .screenonly{display:none!important}
  body{background:#fff;font-size:12pt}
  .card,.cards>section,.calc,.keyfacts,.datacard{box-shadow:none;border-color:#999;break-inside:avoid}
  footer{background:#fff;color:#000}
  footer a,footer p,footer li,footer .disc{color:#000}
  /* Corrective pass #5: senior pages print a short summary only —
     Key facts + phone/contact block (senior tools) + the plain-words
     statutory summary + the disclosure footer. The long-form guide
     body, byline, family nav callout and footer link columns do not
     print. */
  body.senior main article>*:not(h1):not(.seniortools):not(.keyfacts):not(.plainwords){display:none!important}
  body.senior .byline,body.senior .familynav{display:none!important}
  body.senior footer .fcols>div:not(:first-child){display:none!important}
  body.senior .seniortools,body.senior .keyfacts,body.senior .plainwords{break-inside:avoid;border-color:#999;box-shadow:none}
}

/* ---- SEO + conversion pass (2026-10-15) ---- */
html{scroll-padding-top:120px}
html.fs-plus,html.fs-max{scroll-padding-top:150px}
:focus{scroll-margin-top:120px}
.sitesub .lf{color:var(--ink);font-weight:750}
.headshot{display:block;border-radius:50%;object-fit:cover;flex:none;background:#E2E8F0}
.chip .headshot{width:40px;height:40px}
.byline .headshot{width:56px;height:56px}
.headshot.md{width:72px;height:72px}
.headshot.lg{width:96px;height:96px;border:3px solid #fff;box-shadow:0 4px 14px rgba(15,23,42,.18)}
.headshot.xl{width:160px;height:160px;float:left;margin:0 20px 12px 0}
.advisor .headshot.xl{float:none;margin:0 0 14px}
.whobox{display:block}.whobox picture{display:block;margin-bottom:10px}
.ctaband .ctaperson{display:flex;gap:22px;align-items:flex-start}
@media (max-width:640px){.ctaband .ctaperson{flex-direction:column;gap:12px}.headshot.xl{float:none;margin:0 0 12px}}
.herocta{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 4px}
.rateprompt{margin:0;font-weight:600;color:var(--ink)}
.result.show:has(.rateprompt){animation:none}
@media (max-width:520px){.advisor{flex-direction:column;align-items:flex-start}.advisor .headshot.xl{width:120px;height:120px}}
a.ctx{text-decoration-thickness:1px}
.cf-turnstile{margin:14px 0}
.related{margin:28px 0 8px;border-top:1px solid var(--line);padding-top:18px}.related h2{font-size:1.15rem;margin:0 0 8px}.related ul{margin:0;padding-left:1.1em;columns:2;column-gap:28px}.related li{margin:6px 0;break-inside:avoid}@media (max-width:640px){.related ul{columns:1}}
.chip .headshot.md{width:48px;height:48px}
.toc{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px 18px;margin:18px 0}.toc summary{font-weight:750;cursor:pointer;min-height:44px;display:flex;align-items:center}.toc ol{margin:6px 0 4px;padding-left:1.3em;columns:2;column-gap:32px}.toc li{margin:5px 0;break-inside:avoid}@media (max-width:640px){.toc ol{columns:1}}
