/* ==========================================================================
   Mobile design system (10 Sep 2026). Loaded by page() AFTER base.css, PAGE_CSS and each page's
   extra CSS, so every rule here is the final word on phones. Desktop is untouched: everything
   below the token block sits inside @media (max-width:820px).

   Reference viewport 390–393px; verified 320–430. Tokens first, then primitives (type, buttons,
   inputs, pills, cards), then the coordinated fixed surfaces (header, tab bar), then components.
   ========================================================================== */

/* Tokens: spacing (8px scale), page geometry, touch + control geometry, radii, borders, semantic
   colour (brand tokens flip with the theme; card heads keep white text so they stay fixed), the two
   fixed surfaces, and the mobile type scale. */
/* Token values live in base.css :root so every page (and the audit) sees them first. */
@media (min-width:402px){:root{--gutter:20px}}

/* ---- shared, all widths: bits the phone layout adds to the DOM ---- */
.tabbar{display:none}

/* ==== Shared list system (every width, 10 Sep 2026): Filters button + quick pills, folded panel, card grid ==== */
.frm-row--ph{display:grid}
.ftop{display:block;margin:0 0 var(--space-4)}
.fbtn{width:auto;min-height:var(--ctl-h);padding:0 var(--space-5);border:0;font-size:var(--fs-body)}
.fbtn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.fbtn.is-on{filter:brightness(.9)}
.fquick{display:flex;flex-wrap:wrap;margin-top:var(--space-3)}
.filters{display:none;position:static;margin:0 0 var(--space-4);border-radius:var(--r-card)}
.filters.is-open{display:block}
.listwrap{display:block}

.fquick--areas{align-items:center}
.fq-pill--area[aria-pressed="true"]{font-weight:600}
.fq-lab{font-family:"Inter","Inter Fallback","Inter Fallback 2",sans-serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-right:var(--space-1)}
.ftop .count{margin:var(--space-3) 0 0;font-size:var(--fs-caption);color:var(--ink-2)}
.ftop .count:empty{display:none}
.farea-link{margin:var(--space-2) 0 0;font-size:var(--fs-small);color:var(--ink-2)}
.farea-link a{color:var(--link);font-weight:600}

/* firm cards: coloured head, labeled rows, pills at the foot */
.frm,.frm-enh,.frm-feat,.frm[data-side],.frms--near .frm,.frms--near .frm.frm-enh,.frms--near .frm[data-side]{display:flex;flex-direction:column;align-items:stretch;padding:0;border-radius:var(--r-card);border:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);overflow:hidden;background:var(--surface);box-shadow:0 1px 2px rgba(0,0,0,.04) !important;cursor:pointer}
.frm:hover{background:var(--surface)}
.frm[hidden]{display:none !important}
.frm-head{display:grid;width:100%;grid-template-columns:48px 1fr;gap:var(--space-3);align-items:center;padding:var(--space-4);background:var(--head-basic);color:var(--head-ink)}
.frm-enh .frm-head{background:var(--head-enh)}
.frm-feat .frm-head{background:var(--head-feat)}
.frm .frm-av,.frm.frm-enh .frm-av,.frm.frm-feat .frm-av{width:48px;height:48px;border:0;border-radius:var(--r-ctl);background:#fff;color:var(--head-basic);font-size:17px}
.frm.frm-enh .frm-av{color:var(--head-enh)}
.frm-title{min-width:0}
.frm-head h3{margin:0;font-size:var(--fs-title);line-height:1.2;font-weight:600;overflow-wrap:anywhere}
.frm-head h3 a,.frm.frm-enh h3 a,.frm.frm-feat h3 a{color:var(--head-ink)}
.frm-rate{margin-top:var(--space-1);font-size:var(--fs-caption);color:rgba(255,255,255,.85)}
.frm-rate .stars{color:var(--star)}
.frm-rate b{color:var(--head-ink)}
.frm-rate-none{color:rgba(255,255,255,.7)}
.frm-lvl{grid-column:1/-1;margin-top:var(--space-1)}
.frm-lvl:empty,.frm-lvl .badge-basic{display:none}
.frm-lvl .tb-give{background:rgba(255,255,255,.14);color:#fff;border-color:transparent}
.frm .frm-body{flex:1 1 auto;padding:var(--space-3) var(--space-4) var(--space-4)}
.frm-meta{display:none}
.frm-focus{margin:0 0 var(--space-2);font-size:var(--fs-small);color:var(--ink-2)}
.frm-rows{display:grid;gap:var(--space-1);margin:0}
.frm-row,.frm-row--ph{display:grid;grid-template-columns:88px 1fr;gap:var(--space-3);align-items:start;padding:var(--space-2) 0 var(--space-2) var(--space-3);border-left:2px solid var(--border-subtle)}
.frm-rows dt{display:block;font-family:"Inter","Inter Fallback","Inter Fallback 2",sans-serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);padding-top:3px}
.frm-rows dd{margin:0;font-size:var(--fs-body);color:var(--ink)}
.frm-row--offers{display:block;border-left:0;padding:var(--space-3) 0 0;margin-top:var(--space-2);border-top:1px solid var(--border-subtle)}
.frm-row--offers:not(:has(.pill)){display:none}
.frm-row--offers dt{display:none}
.frm-tags{margin:0;gap:var(--space-2)}
.frm-tags .vbadge,.frm-tags .pill--lang{display:none}
.frm-contact{margin:var(--space-2) 0 0;font-size:var(--fs-small)}

/* desktop list: two columns of the same cards, filter panel as a row, actions in a card footer */
@media (min-width:821px){
  .frms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5);border-top:0}
  .frms--near{border-top:0}
  .frm-head{grid-template-columns:52px 1fr;padding:var(--space-4) var(--space-5)}
  .frm .frm-body{padding:var(--space-3) var(--space-5) var(--space-4)}
  .frm .frm-act{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:var(--space-3);grid-column:auto;grid-row:auto;padding:var(--space-3) var(--space-5);border-top:1px solid var(--border-subtle)}
  .frm .frm-cta,.frm .frm-cta--view{margin:0;padding:0;min-height:0;background:none;color:var(--link);font-size:var(--fs-small);font-weight:600;border:0}
  .frm .frm-cta:hover{text-decoration:underline;filter:none}
  .frm-pick{font-size:var(--fs-caption)}
  .filters.is-open{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-2) var(--space-6);align-items:start;padding:var(--space-5)}
  .filters .fgroup{border:0;padding:0}
  .filters .fnote,.filters .fclear{grid-column:1 / -1}
  .filters .fclear{width:auto;justify-self:end;margin-top:var(--space-2)}
  .fquick{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}
  .fq-pill{display:inline-flex;align-items:center;min-height:40px;padding:0 var(--space-4);border:1px solid var(--border-default);border-radius:var(--r-pill);background:var(--surface);color:var(--ink);font:inherit;font-size:var(--fs-small);cursor:pointer}
  .fq-pill[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
  .fbtn{display:inline-flex;align-items:center;gap:var(--space-2);min-height:44px;padding:0 var(--space-5);border:0;border-radius:var(--r-ctl);background:var(--brand);color:var(--brand-ink);font:inherit;font-size:var(--fs-ui);font-weight:600;cursor:pointer}
  .fbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
  .fpills{margin:0 0 var(--space-3)}
  .alsoserve{grid-column:1 / -1}
}
/* county, town and state pages: results directly under the hero at every width */
main{display:flex;flex-direction:column}
main > *{order:0}
main > .crumbs{order:-3}
main > .phero,main > .hero{order:-2}
main > #attorneys,main > #cmpwrap{order:-1}

@media (max-width:820px){
  /* ---------- page geometry ---------- */
  body{font-size:var(--fs-body);line-height:1.55;padding-bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px) + var(--space-4))}
  /* focus scrolling stays clear of the bottom tab bar (sections already carry scroll-margin-top for the sticky header) */
  html{scroll-padding-bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px) + 16px)}
  .wrap{width:calc(100% - 2 * var(--gutter))}
  .sec,.phero,.hero,.cover,.jur,.index,.method,.tiers,.claim,.quizsec{padding-top:var(--space-10);padding-bottom:var(--space-10)}
  .phero--tight{padding-top:var(--space-8);padding-bottom:var(--space-6)}
  .quizsec--page{padding-top:var(--space-4)}
  .sec-head{margin-bottom:var(--space-5)}
  .crumbs{padding:var(--space-3) 0;font-size:12px}
  [id]{scroll-margin-top:calc(var(--hdr-h) + var(--space-3))}

  /* ---------- type scale ---------- */
  h1{font-size:var(--fs-h1);line-height:1.15}
  h2{font-size:var(--fs-h2);line-height:1.2}
  h3{font-size:var(--fs-h3);line-height:1.25}
  .lede{font-size:var(--fs-lead);line-height:1.5}
  .eyebrow{font-size:11px}
  .phead h1{font-size:var(--fs-page-h1);line-height:1.15}
  .phead h1 span{display:block;font-size:var(--fs-body);font-weight:500;color:var(--ink-2);margin-top:var(--space-2)}
  .pcard h2,.sidecard h2,.aside-card h3,.court h3,.fl-body b{font-size:var(--fs-h3);line-height:1.25}
  .qh{font-size:24px;line-height:1.2}
  .qsub{font-size:var(--fs-ui)}


  /* ---------- bottom tab bar: 60px + safe area, 24px icons, 12px labels ---------- */
  .tabbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--surface);border-top:1px solid var(--border-subtle);padding:0 0 env(safe-area-inset-bottom,0px);box-shadow:0 -6px 20px rgba(0,0,0,.06)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);height:var(--tab-h);padding:0;font-size:12px;font-weight:600;letter-spacing:.01em;color:var(--ink-3);text-decoration:none}
  .tabbar a span{display:block;max-width:100%;padding:0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
  .tabbar svg{flex:0 0 auto;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .tabbar a[aria-current="page"]{color:var(--brand)}

  /* ---------- fixed and sticky surfaces: only the header and the tab bar stay fixed ---------- */
  .findcta,.totop,.gm-pill,#gmPill{display:none !important}
  /* Compare works on phones (owner phone test, 25 Sep 2026): the tray was hidden here while the card tick-boxes still showed.
     It sits in the list, sticks under the header once a firm is ticked, and the table scrolls sideways in its own box. */
  .cmpbar{position:sticky;top:calc(var(--hdr-h) + 8px);z-index:30;flex-wrap:wrap;gap:8px 12px;padding:10px 12px}
  .cmpbar .btn,.cmpbar-clear{min-height:var(--tap)}
  .cmpbar-n{flex-basis:100%}
  .cmpinline{padding:14px 12px 12px}
  .cmptable{width:max-content;min-width:100%}
  .cmptable th[scope=row]{position:sticky;left:0;z-index:1;width:96px;min-width:96px;max-width:96px;padding-right:10px;background:var(--surface);white-space:normal}
  .citeban.is-stuck{top:var(--hdr-h)}
  .side,.courtmap,.gv2-sticky{position:static}

  /* ---------- buttons ---------- */
  .btn,.fbtn,.pv-btn,.cpanel-btn,.hero #zipGo,.btn-gold{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--btn-h);padding:0 var(--space-5);border-radius:var(--r-ctl);font-size:17px;font-weight:600;line-height:1.2}
  .btn-line{border:1px solid var(--border-default)}
  .btn-solid,.fbtn{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}
  .btn-gold{background:var(--gold);color:var(--gold-ink);border-color:var(--gold)}
  .finder .btn,.quiz-nav .btn,.consult-form .btn,.cf .btn,.cform .btn,.qlead .btn,.phead-act .btn,.cpanel .btn,.hero #zipGo,.bigsearch-btn{width:100%}
  .quiz-nav .btn{flex:1 1 auto}
  .linkbtn{display:inline-flex;align-items:center;min-height:var(--tap);padding:0;font-size:var(--fs-ui)}
  .btn[disabled]{opacity:.45}

  /* ---------- inputs and selects ---------- */
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),select,textarea,.hero #f-zip,.bigsearch #f-zip,.qtown{width:100%;box-sizing:border-box;min-height:var(--ctl-h);padding:0 var(--space-4);font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--border-default);border-radius:var(--r-ctl)}
  textarea{min-height:120px;padding:var(--space-3) var(--space-4);line-height:1.5}
  .hero #f-zip{letter-spacing:.04em}
  .bigsearch{display:flex;flex-direction:column;gap:var(--space-3);margin:var(--space-5) auto 0;padding:0;background:transparent;border:0;box-shadow:none}
  .bigsearch #f-zip{font-family:"Inter","Inter Fallback","Inter Fallback 2","Helvetica Neue",Arial,sans-serif;letter-spacing:0;padding-left:48px}
  .bigsearch-ico{top:14px;left:16px;transform:none}
  .bigsearch-hint{margin-top:var(--space-2);font-size:var(--fs-small)}
  select:not([multiple]){padding-right:40px}
  label.qtown-l,.field label,.qlead label,.cf label{display:block;margin:0 0 var(--space-2);font-size:var(--fs-ui);font-weight:600}
  input[type="checkbox"],input[type="radio"]{width:22px;height:22px;margin:0;accent-color:var(--brand)}
  .qlead-consent,.qcheck,.fbox{gap:var(--space-3);font-size:var(--fs-small);line-height:1.45}
  .fbox{padding:var(--space-2) 0;min-height:var(--tap);font-size:var(--fs-ui)}

  /* ---------- pills: interactive chips are 44px, tags are compact ---------- */
  .fq-pill,.chips a,.fpill,.cf-pill,.cform .pills .qstate,.qstates.pills .qstate,.cty-chip,.fclear,.fswitch,.cmpclose{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--pill-h);margin:0;padding:0 var(--space-4);border:1px solid var(--border-default);border-radius:var(--r-pill);background:var(--surface);color:var(--ink);font-size:var(--fs-ui);font-weight:500;line-height:1.2}
  .chips{gap:var(--space-2)}
  .fquick{gap:var(--space-2)}
  .fq-pill[aria-pressed="true"],.cform .pills .qstate:has(input:checked),.qstates.pills .qstate:has(input:checked){background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-weight:600}
  .cform .pills .qstate:has(input:checked) span,.qstates.pills .qstate:has(input:checked) span{color:var(--brand-ink)}
  .cform .pills .qstate:has(input:checked) span::before{border-color:var(--brand-ink);background:var(--brand-ink);box-shadow:inset 0 0 0 3px var(--brand)}
  .pill,.badge,.vbadge,.tb,.frm-tags .pill{display:inline-flex;align-items:center;gap:var(--space-1);padding:6px var(--space-3);border:1px solid var(--border-default);border-radius:var(--r-pill);font-size:var(--fs-caption);font-weight:500;line-height:1.2}
  .badge,.vbadge{border-radius:var(--r-tag);font-size:11px;letter-spacing:.08em}
  .tb{font-size:11px}
  .pill--yes{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-weight:600}
.pill--side{border-color:var(--head-basic);color:var(--head-basic)}
  .pills{gap:var(--space-2)}
  .fpills{gap:var(--space-2);margin:0 0 var(--space-4)}
  .fpills:empty{display:none}

  /* ---------- cards: one radius, one border, one padding ---------- */
  .frm,.court,.pcard,.sidecard,.finder,.aside-card,.fl,.filters,.getmatched--below,.cform,.findfirm,.upsell,.lp-stage,.consult-form,.fstep,.finderbox,.done-next,.enhblock,.about,.cf-ok,.price-note,.reassure div,.why{border-radius:var(--r-card)}
  .court,.pcard,.sidecard,.finder,.aside-card,.fl,.filters,.getmatched--below,.cform,.findfirm,.upsell,.consult-form,.fstep,.done-next,.about,.why{padding:var(--space-5) var(--space-4)}
  .pcard,.sidecard,.court,.finder,.aside-card,.fl,.filters,.getmatched--below,.cform,.findfirm{border:1px solid var(--border-subtle)}
  .pcard--locked{border-style:dashed}
  .pwrap{grid-template-columns:1fr;gap:var(--space-4);padding:var(--space-4) 0 var(--space-8)}
  .pmain{gap:var(--space-4)}
  .frms{gap:var(--space-5);border-top:0}
  .frms--near{border-top:0}
  .qopt-b{padding:var(--space-4);border-radius:var(--r-ctl);border:1px solid var(--border-default)}
  .qopt-b b{font-size:var(--fs-body)}
  .qopt-b em{font-size:var(--fs-small)}
  .qopts{gap:var(--space-3)}
  .finder{box-shadow:none}

  /* ---------- firm profile head ---------- */
  .phead{grid-template-columns:auto minmax(0,1fr);gap:var(--space-3);align-items:start;padding-bottom:var(--space-5)}
  .pav{width:44px;height:44px;border-radius:var(--r-ctl);font-size:16px;margin-top:2px}
  .phead h1{font-size:var(--fs-page-h1);line-height:1.15;margin-bottom:var(--space-2)}
  .phead > div{min-width:0}
  .phead .vbadge{display:none}
  .pcard .deflist div{display:grid;grid-template-columns:1fr;gap:var(--space-1);padding:var(--space-3) 0}
  .pcard .deflist dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
  .pcard .deflist dd{font-size:var(--fs-body);color:var(--ink);margin:0}
  .pcard .svcgrid,.pcard .svcgrid--on{display:flex;flex-wrap:wrap;gap:var(--space-2);grid-auto-rows:auto}
  .pcard .svct{display:inline-flex;flex-direction:row;align-items:center;width:auto;min-height:40px;padding:0 var(--space-4);border-radius:var(--r-pill);text-align:left}
  .pcard .svct b{font-size:var(--fs-small);font-weight:600}
  /* Coverage & courts pills read like the Services pills: the words stay for screen readers, a served pill keeps its check */
  .pcard .svct.crt .crt-st-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .pcard .svct.crt .crt-st--on{margin-left:6px}
  .pcard .svct em{display:none}
  .svct--off{opacity:.7}
  .pcard--locked .locked-list{display:none}
  .backlink{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--tap);font-size:var(--fs-ui);color:var(--ink-2)}
  .faq summary{font-size:var(--fs-body);padding:var(--space-4) 28px var(--space-4) 0}
  .consult-grid,.cgrid{grid-template-columns:1fr;gap:var(--space-4)}

  .frm .frm-act{display:none !important}
  .frm-head{grid-template-columns:48px 1fr;padding:var(--space-4)}
  .frm .frm-body{padding:var(--space-3) var(--space-4) var(--space-4)}

  /* ---------- home hero: step badge beside its heading, then the ZIP box, then the button ---------- */
  .hero{padding-bottom:var(--space-12);border-bottom:0}
  .hero .steprow{margin-top:var(--space-6);gap:0}
  .hero .zipcol{display:grid !important;grid-template-columns:52px minmax(0,1fr) !important;grid-template-areas:"dot head" "zip zip" "go go" "msg msg";column-gap:var(--space-3);row-gap:var(--space-3);align-items:center;padding:0}
  .hero .zipcol::before,.hero .zipcol::after{display:none}
  .hero .zipcol .stepdot{position:static;grid-area:dot;display:grid;width:52px;height:52px;margin:0}
  .hero .zipcol .step-text{grid-area:head;padding:0;align-self:center}
  .hero .zipcol-h{margin:0;font-size:var(--fs-lead);line-height:1.25}
  .hero .zipcol .zip-row{display:contents !important}
  .hero .zipcol #f-zip{grid-area:zip;width:100%;margin:0;height:auto;min-height:var(--ctl-h)}
  .hero .zipcol #zipGo{grid-area:go;width:100%;margin:0;height:auto;min-height:var(--btn-h)}
  .hero .zipcol .zipmsg{grid-area:msg;margin:0}
  .hero .zipcol .zipnext{grid-column:1 / -1;margin:0}
  .hero .steprow .step1-sub,.hero .zipcol .zipcol-sub{min-height:0}
  .qstates{grid-template-columns:1fr}
  .quiz-head{margin-bottom:var(--space-3)}
  .quiz-nav{flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-5)}

  /* ---------- quiz results and lead form ---------- */
  .quiz-results{gap:var(--space-3)}
  .qres{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"txt pick" "pills pills" "go go";gap:var(--space-3);align-items:start;padding:var(--space-4);border-radius:var(--r-card)}
  .qres .qres-txt{grid-area:txt}
  .qres .qres-pick{grid-area:pick;min-height:var(--tap);padding:0 var(--space-3);border-radius:var(--r-pill);font-size:var(--fs-caption)}
  .qres .qres-pills{grid-area:pills;grid-column:auto;gap:var(--space-2)}
  .qres .pill{font-size:12px;padding:5px 10px}
  .qres a.qres-go{grid-area:go;grid-column:auto;display:inline-flex;align-items:center;min-height:var(--tap);justify-self:start;font-size:var(--fs-ui);font-weight:600}
  .qres .qres-name{display:block;font-size:var(--fs-body);line-height:1.3}
  .qres .qres-meta{display:block;margin-top:2px;font-size:var(--fs-small)}
  .qres[data-more]{display:none}
  .quiz-results.is-all .qres[data-more]{display:grid}
  .qmore{width:100%;margin:var(--space-2) 0 var(--space-3)}
  .qall{display:grid;gap:var(--space-2)}
  .qall-btn{white-space:normal;width:100%;text-align:center}
  .qall-note{font-size:var(--fs-small)}
  .qsel{flex-direction:column;align-items:stretch;gap:var(--space-2);padding:var(--space-4);border-radius:var(--r-card)}
  .qsel-n{margin:0}
  .qsel .btn{width:100%}
  .quiz-done,.quiz-results,.qres,.qlead{max-width:100%;min-width:0}
  .qres .qres-txt{min-width:0;overflow-wrap:anywhere}
  .quiz-results.is-all + .qmore{display:none}
  .qlead-grid,.qlead-grid.qlead-grid--2{grid-template-columns:1fr;gap:var(--space-3)}
  .qlead label{display:block}

  /* ---------- folded sections: one row each on phones, task sections first ---------- */
  [data-fold].is-folded > :not(.fold-btn){display:none}
  [data-fold]{padding-top:var(--space-2);padding-bottom:var(--space-2);background:var(--ground)}
  [data-fold].is-folded{padding-top:var(--space-2) !important;padding-bottom:var(--space-2) !important}
  [data-fold]:not(.is-folded){padding-bottom:var(--space-8)}
  [data-fold]:not(.is-folded) .fold-btn{margin-bottom:var(--space-5)}
  [data-fold] + [data-fold]{padding-top:0}
  .fold-btn{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);width:calc(100% - 2 * var(--gutter));margin:0 auto;min-height:56px;padding:0 var(--space-4);border:1px solid var(--border-subtle);border-radius:var(--r-card);background:var(--surface);color:var(--ink);font:inherit;font-size:var(--fs-body);font-weight:600;line-height:1.3;text-align:left;cursor:pointer}
  .fold-btn i{flex:0 0 auto;width:24px;height:24px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;font-style:normal;font-size:18px;line-height:1;color:var(--brand)}
  .fold-btn i::before{content:"+"}
  .fold-btn[aria-expanded="true"] i::before{content:"\2212"}
  article[data-fold],div[data-fold]{padding:0;border:0;background:transparent}
  article[data-fold]:not(.is-folded),div[data-fold]:not(.is-folded){padding:0 0 var(--space-4)}
  article[data-fold] .fold-btn,div[data-fold] .fold-btn{width:100%}
  main > #start,main > #quiz{order:-1}
  .pcard--glance .deflist div[data-row]:not([data-keep]){display:none}

  /* ---------- misc phone-only ---------- */
  .hero .cpviz{display:none}
  .svc-more>summary{display:list-item;min-height:var(--tap);padding:var(--space-2) 0}
  .covstats{grid-template-columns:1fr 1fr}
  .getmatched{max-width:none;text-align:left;justify-items:start}
  .getmatched--below{text-align:center;justify-items:center}
  .cmptable td{min-width:140px}
}
