@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/plus-jakarta-sans-400.woff2) format('woff2');
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  /* 500 and 600 both resolve here. Two near-identical weights were being
     downloaded for a difference nobody can see at body size. */
  font-weight: 500 600;
  font-display: swap;
  src: url(fonts/plus-jakarta-sans-600.woff2) format('woff2');
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 700 800;
  font-display: swap;
  src: url(fonts/plus-jakarta-sans-800.woff2) format('woff2');
}

/* ============================================================================
   Hello World Funding — design system
   One stylesheet for the whole site. Loaded by every page via partials/head.html.

   Structure:
     1. Tokens            8. Cards & grids
     2. Reset & base      9. Steps / process
     3. Layout           10. Comparison table
     4. Nav              11. FAQ accordion
     5. Buttons          12. Forms
     6. Hero             13. Testimonials
     7. Sections         14. Footer + misc + responsive
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
  /* surfaces */
  --paper:#F3F8F8;
  --paper-2:#FAFDFD;
  --card:#FFFFFF;
  --navy:#08202B;
  --navy-2:#0D3040;

  /* ink */
  --ink:#0B1E27;
  --ink-soft:#4E6773;
  --ink-faint:#8AA0AA;

  /* brand — clinical teal. Reads pharmacy without the cartoon green cross,
     and stays legible next to the navy the legal audience expects. */
  --brand:#0B7C8C;
  --brand-dark:#065F6D;
  --brand-soft:#45C3D2;
  --brand-tint:rgba(11,124,140,.10);
  --brand-tint-2:rgba(11,124,140,.05);

  /* accent — "no cost / approved / paid at settlement" affordances */
  --accent:#12A65C;
  --accent-dark:#0C8449;
  --accent-tint:rgba(18,166,92,.12);

  --warn:#C2452F;
  --warn-tint:#FCF0ED;

  /* lines */
  --line:rgba(11,30,39,.11);
  --line-2:rgba(11,30,39,.055);
  --line-dark:rgba(255,255,255,.10);

  /* type */
  --sans:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;

  /* elevation */
  --shadow:0 20px 54px -30px rgba(11,30,39,.28);
  --shadow-soft:0 12px 32px -24px rgba(11,30,39,.20);
  --shadow-lift:0 2px 5px rgba(11,30,39,.04),0 14px 30px -16px rgba(11,30,39,.18),0 36px 66px -40px rgba(11,30,39,.26);

  --radius:16px;
  --radius-lg:20px;
  --nav-h:78px;
}

/* ---------- 2. Reset & base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);background:var(--paper);color:var(--ink);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  /* iOS otherwise re-flows text on rotate, and flashes a grey box on every tap. */
  -webkit-text-size-adjust:100%;
  -webkit-tap-highlight-color:rgba(11,124,140,.14);
}
/* Long unbroken strings on this site are real: email addresses, the Wilshire
   address, statute cites. On a 320px phone they are what pushes a layout wide. */
p,li,dd,h1,h2,h3,td,th{overflow-wrap:break-word}
img{max-width:100%;display:block}
a{color:inherit}
button{font-family:inherit}
:focus-visible{outline:3px solid var(--brand-soft);outline-offset:2px;border-radius:4px}

h1,h2,h3,h4{letter-spacing:-.025em;line-height:1.1;font-weight:800}
h1{font-size:clamp(2.35rem,5.4vw,4rem);line-height:1.03;letter-spacing:-.032em}
h2{font-size:clamp(1.95rem,3.5vw,2.85rem)}
h3{font-size:1.28rem;letter-spacing:-.018em}
h1 em,h2 em,h3 em{font-style:normal;color:var(--brand)}
p{text-wrap:pretty}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* subtle paper grain, matches the Kingdom Homes feel without the warmth */
body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.55;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
}

/* ---------- 3. Layout ---------- */
.wrap{max-width:1240px;margin:0 auto;padding:0 5vw}
.wrap-narrow{max-width:820px;margin:0 auto;padding:0 5vw}
section{position:relative;z-index:1;padding:4.6rem 0}
section.tight{padding:3.2rem 0}
.band{background:var(--paper-2);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.band-dark{background:var(--navy);color:#fff}
.band-dark h2,.band-dark h3{color:#fff}
.band-dark p{color:rgba(255,255,255,.76)}
.band-dark em{color:var(--brand-soft)}

.section-head{margin-bottom:2.4rem;max-width:64ch}
.section-head.center{text-align:center;margin-left:auto;margin-right:auto}
.tag{
  display:inline-flex;align-items:center;gap:.5rem;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;font-weight:800;color:var(--brand);margin-bottom:.9rem;
}
.band-dark .tag{color:var(--brand-soft)}
.lead{font-size:1.05rem;color:var(--ink-soft);line-height:1.7;margin-top:1rem;max-width:62ch}
.section-head.center .lead{margin-left:auto;margin-right:auto}

/* ---------- 4. Nav ---------- */
.topbar{
  position:relative;z-index:120;background:var(--navy);color:rgba(255,255,255,.82);
  font-size:.78rem;letter-spacing:.01em;
}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:.5rem;padding-bottom:.5rem}
.topbar a{color:#fff;text-decoration:none;font-weight:700}
.topbar a:hover{color:var(--brand-soft)}
.topbar-note{display:inline-flex;align-items:center;gap:.45rem}
.topbar-note svg{width:14px;height:14px;stroke:var(--accent);fill:none;stroke-width:2.2}
@media(max-width:760px){.topbar-note{display:none}.topbar .wrap{justify-content:center}}

/* The site header only.

   This block was a bare `nav{}` selector until the mobile drawer and the
   mobile action bar became <nav> elements for accessibility. They then
   inherited `position:sticky;top:0` from here — and because .mobile-bar sets
   `bottom:0`, a fixed element with both top and bottom stretched to the full
   viewport height. The homepage rendered as three full-height pills.

   Scoped to the id so adding another <nav> can never do that again. */
#siteNav{
  position:sticky;top:0;z-index:110;
  background:rgba(250,252,255,.86);backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--line-2);transition:.25s;
}
#siteNav.scrolled{background:rgba(250,252,255,.97);border-bottom-color:var(--line);box-shadow:0 6px 24px -20px rgba(11,30,39,.4)}
#siteNav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;height:var(--nav-h)}
#siteNav.scrolled .wrap{height:66px}

/* Blue rule + wordmark, matching the printed collateral. The rule is a border
   rather than an element so it scales with the type and never needs its own
   markup. */
.brand{
  display:inline-flex;align-items:center;text-decoration:none;flex-shrink:0;
  border-left:4px solid var(--brand);padding-left:.72rem;min-width:0;
}
.brand-wm{display:flex;flex-direction:column;line-height:1.02;min-width:0}
.brand-name{font-size:1.32rem;font-weight:800;letter-spacing:-.028em;color:var(--ink);white-space:nowrap}

/* The line under the wordmark.
   Its string is set once in entity.json (`wordmarkTag`) and it has a hard
   width budget: it must measure NARROWER than the wordmark above it. The
   original copy — "Beverly Hills · Injury & Post-Op Pharmacy" — rendered
   361px against a 259px wordmark, which overhung the lockup by 100px and
   pushed the whole desktop nav past the viewport edge. Location moved to the
   topbar instead. If this string is ever lengthened, re-measure. */
.brand-tag{
  font-size:.545rem;letter-spacing:.148em;text-transform:uppercase;font-weight:800;
  color:var(--brand);margin-top:.3rem;white-space:nowrap;
}
#siteNav.scrolled .brand-name{font-size:1.2rem;transition:font-size .25s}

.nav-links{list-style:none;display:flex;align-items:center;gap:1.7rem;margin-left:auto}
.nav-links > li{position:relative}
.nav-links a{
  font-size:.87rem;font-weight:600;color:var(--ink-soft);text-decoration:none;
  transition:color .18s;white-space:nowrap;display:inline-flex;align-items:center;gap:.3rem;
}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--brand)}
.nav-links .caret{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .2s}
.nav-links li:hover .caret,.nav-links li:focus-within .caret{transform:rotate(180deg)}

.dropdown{
  position:absolute;top:calc(100% + .5rem);left:50%;transform:translateX(-50%) translateY(-6px);
  background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);
  padding:.6rem;min-width:290px;list-style:none;opacity:0;visibility:hidden;transition:.18s;
}
.nav-links li:hover .dropdown,.nav-links li:focus-within .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dropdown::before{content:'';position:absolute;bottom:100%;left:0;right:0;height:.6rem}
.dropdown li a{
  display:block;padding:.55rem .8rem;border-radius:9px;font-size:.88rem;font-weight:600;color:var(--ink);
}
.dropdown li a:hover{background:var(--brand-tint-2);color:var(--brand)}
.dropdown .dd-all{border-top:1px solid var(--line-2);margin-top:.35rem;padding-top:.35rem}
.dropdown .dd-all a{color:var(--brand);font-size:.82rem}

.nav-phone{font-weight:800!important;color:var(--ink)!important;font-variant-numeric:tabular-nums}
.nav-phone:hover{color:var(--brand)!important}
.nav-phone svg{width:15px;height:15px;stroke:var(--brand);fill:none;stroke-width:2}

.nav-cta{
  background:var(--brand);color:#fff!important;padding:.72rem 1.35rem;border-radius:999px;
  font-size:.85rem!important;font-weight:700;box-shadow:0 10px 22px -12px rgba(11,124,140,.65);transition:.2s;
}
.nav-cta:hover{background:var(--brand-dark);transform:translateY(-1px);color:#fff!important}

.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:.5rem;color:var(--ink)}
.nav-toggle svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:2}

/* mobile drawer */
.mobile-menu{
  display:none;position:fixed;inset:0;z-index:200;background:var(--paper);
  padding:1.1rem 6vw 2.5rem;overflow-y:auto;
}
.mobile-menu.open{display:block}
.mm-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.8rem;height:var(--nav-h)}
.mm-list{list-style:none;display:flex;flex-direction:column}
.mm-list > li{border-bottom:1px solid var(--line-2)}
.mm-list a{display:block;padding:1rem 0;font-size:1.12rem;font-weight:700;color:var(--ink);text-decoration:none}
.mm-list .mm-sub{list-style:none;padding:0 0 .8rem .9rem}
.mm-list .mm-sub a{font-size:.95rem;font-weight:600;color:var(--ink-soft);padding:.42rem 0}
.mm-actions{display:flex;flex-direction:column;gap:.8rem;margin-top:1.8rem}

/* sticky mobile action bar */
.mobile-bar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:105;
  background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-top:1px solid var(--line);
  padding:.6rem .8rem calc(.6rem + env(safe-area-inset-bottom));gap:.6rem;
}
.mobile-bar a{flex:1;text-align:center;padding:.9rem .35rem;border-radius:999px;font-size:.82rem;font-weight:800;text-decoration:none;white-space:nowrap}
.mobile-bar .mb-apply{flex:1.25}
@media(max-width:360px){.mobile-bar a{font-size:.75rem;padding:.85rem .25rem}}
.mobile-bar .mb-call{background:var(--card);border:1.5px solid var(--brand);color:var(--brand)}
.mobile-bar .mb-apply{background:var(--brand);color:#fff}

/* ---------- 5. Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-size:.92rem;font-weight:700;letter-spacing:-.01em;padding:1.02rem 1.9rem;
  border:none;border-radius:999px;cursor:pointer;text-decoration:none;transition:.2s;white-space:nowrap;
}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 14px 28px -14px rgba(11,124,140,.6)}
.btn-primary:hover{background:var(--brand-dark);transform:translateY(-2px);box-shadow:0 18px 34px -16px rgba(11,124,140,.65)}
.btn-accent{background:var(--accent);color:#04291B;box-shadow:0 14px 28px -14px rgba(18,166,92,.6)}
.btn-accent:hover{background:var(--accent-dark);color:#fff;transform:translateY(-2px)}
.btn-ghost{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--brand);color:var(--brand)}
.btn-on-dark{background:#fff;color:var(--navy)}
.btn-on-dark:hover{background:var(--brand-soft);color:#fff}
.btn-outline-dark{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.3)}
.btn-outline-dark:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-lg{padding:1.15rem 2.3rem;font-size:1rem}
.btn-block{width:100%}
.btn-link{color:var(--brand);font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:.35rem}
.btn-link:hover{text-decoration:underline}
.btn-link svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .2s}
.btn-link:hover svg{transform:translateX(3px)}
.actions{display:flex;gap:.9rem;align-items:center;flex-wrap:wrap}

/* ---------- 6. Hero ---------- */
.hero{
  position:relative;z-index:1;padding:3.4rem 0 3rem;
}
.hero::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(70% 60% at 78% -8%,rgba(11,124,140,.09),transparent 62%),
    radial-gradient(50% 50% at 8% 6%,rgba(18,166,92,.07),transparent 60%);
}
/* Desktop: copy left, form right. Mobile (see the 960px block): headline, then
   the form, then the supporting points — so the form is reachable without a
   long scroll on a phone, which is where most of this traffic lands. */
.hero .wrap{
  display:grid;grid-template-columns:1.05fr 456px;gap:1.8rem 3rem;align-items:start;
  grid-template-areas:"lead form" "rest form";
}
.hero-lead{grid-area:lead}
.hero-rest{grid-area:rest}
.hero-lead > *,.hero-rest > *{opacity:0;transform:translateY(16px);animation:rise .75s cubic-bezier(.2,.7,.3,1) forwards}
.hero-lead > *:nth-child(1){animation-delay:.04s}
.hero-lead > *:nth-child(2){animation-delay:.12s}
.hero-lead > *:nth-child(3){animation-delay:.2s}
.hero-rest > *:nth-child(1){animation-delay:.3s}
.hero-rest > *:nth-child(2){animation-delay:.38s}
.hero-rest > *:nth-child(3){animation-delay:.46s}
@keyframes rise{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .hero-lead > *,.hero-rest > *,.hero-form-wrap{animation:none!important;opacity:1!important;transform:none!important}
  .reveal,.js .reveal{opacity:1!important;transform:none!important;transition:none}
  html{scroll-behavior:auto}
}

.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;background:var(--brand-tint);
  color:var(--brand-dark);font-size:.75rem;font-weight:800;letter-spacing:.05em;
  padding:.42rem .9rem;border-radius:999px;margin-bottom:1.25rem;
}
.eyebrow svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.4}
.hero-sub{font-size:1.16rem;color:var(--ink-soft);max-width:47ch;margin-bottom:1.5rem;line-height:1.6}

.checks{list-style:none;display:flex;flex-direction:column;gap:.62rem;margin-bottom:1.7rem;max-width:50ch}
h1 + .checks,h2 + .checks,h3 + .checks,p + .checks{margin-top:1.2rem}
.checks li{position:relative;padding-left:1.85rem;font-size:.98rem;color:var(--ink-soft);line-height:1.5}
.checks li b{color:var(--ink);font-weight:700}
.checks li::before{
  content:'';position:absolute;left:0;top:.14rem;width:1.25rem;height:1.25rem;border-radius:50%;
  background-color:var(--accent);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E");
  background-size:.78rem;background-position:center;background-repeat:no-repeat;
}
.band-dark .checks li{color:rgba(255,255,255,.8)}
.band-dark .checks li b{color:#fff}

.hero-trust{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.rating-badge{
  display:inline-flex;align-items:center;gap:.55rem;background:var(--card);border:1px solid var(--line);
  border-radius:12px;padding:.5rem .85rem;box-shadow:var(--shadow-soft);
}
.rating-badge .rb-text{display:flex;flex-direction:column;line-height:1.12}
.rating-badge .rb-top{display:flex;align-items:center;gap:.35rem}
.rating-badge .rb-top b{font-size:1rem;font-weight:800}
.stars{color:#F5A524;font-size:.85rem;letter-spacing:.06em}
.rating-badge small{font-size:.62rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);font-weight:700}
.trust-text{font-size:.88rem;color:var(--ink-soft)}
.trust-text b{color:var(--ink);font-weight:700}

/* hero form card */
.hero-form-wrap{grid-area:form;opacity:0;transform:translateY(18px);animation:rise .85s cubic-bezier(.2,.7,.3,1) .26s forwards;position:sticky;top:calc(var(--nav-h) + 1.2rem)}
.form-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lift)}
.fc-head{background:var(--navy);color:#fff;padding:1.4rem 1.75rem}
.fc-head h2{font-size:1.42rem;font-weight:800;letter-spacing:-.025em;color:#fff}
.fc-head p{font-size:.83rem;color:rgba(255,255,255,.68);margin-top:.3rem}
.fc-body{padding:1.5rem 1.75rem 1.7rem}
.fc-note{font-size:.72rem;color:var(--ink-faint);text-align:center;margin-top:.85rem;line-height:1.55}
.fc-secure{display:flex;align-items:center;justify-content:center;gap:.4rem;margin-top:.9rem;font-size:.71rem;color:var(--ink-faint);font-weight:600}
.fc-secure svg{width:13px;height:13px;stroke:var(--accent-dark);fill:none;stroke-width:2.2}

/* ---------- 7. Stats bar ---------- */
.stats-bar{position:relative;z-index:1;background:var(--navy);color:#fff}
.stats-bar .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding-left:0;padding-right:0}
.stat{padding:1.9rem 1.4rem;text-align:center;border-right:1px solid var(--line-dark)}
.stat:last-child{border-right:none}
.stat b{display:block;font-size:2.35rem;font-weight:800;letter-spacing:-.04em;color:var(--brand-soft);line-height:1;margin-bottom:.4rem}
.stat span{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.55);font-weight:700}

/* logo / association strip */
.logo-strip{padding:1.9rem 0;border-bottom:1px solid var(--line-2);background:var(--paper-2)}
.logo-strip .wrap{display:flex;align-items:center;justify-content:center;gap:2.6rem;flex-wrap:wrap}
.logo-strip .ls-label{font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;font-weight:800;color:var(--ink-faint)}
.logo-strip .ls-item{display:inline-flex;align-items:center;gap:.5rem;font-size:.86rem;font-weight:700;color:var(--ink-soft)}
.logo-strip .ls-item svg{width:19px;height:19px;stroke:var(--brand);fill:none;stroke-width:1.9}

/* ---------- 8. Cards & grids ---------- */
.grid{display:grid;gap:1.35rem}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}

.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.9rem 1.75rem;transition:.22s;
  display:flex;flex-direction:column;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft)}
/* a card's trailing link sits on the baseline of the row, whatever the copy length */
.card > .btn-link{margin-top:auto;padding-top:1rem;align-self:flex-start}
.card h3{margin-bottom:.5rem}
.card p{font-size:.93rem;color:var(--ink-soft);line-height:1.7}
.ico{
  width:2.9rem;height:2.9rem;border-radius:12px;background:var(--brand-tint);
  display:flex;align-items:center;justify-content:center;margin-bottom:1.15rem;flex-shrink:0;
}
.ico svg{width:1.4rem;height:1.4rem;stroke:var(--brand);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ico.accent{background:var(--accent-tint)}
.ico.accent svg{stroke:var(--accent-dark)}
.band-dark .card{background:var(--navy-2);border-color:var(--line-dark)}
.band-dark .card p{color:rgba(255,255,255,.72)}
.band-dark .ico{background:rgba(69,195,210,.16)}
.band-dark .ico svg{stroke:var(--brand-soft)}

/* case-type tiles */
.tile{
  display:flex;align-items:center;gap:.9rem;background:var(--card);border:1px solid var(--line);
  border-radius:13px;padding:1.05rem 1.2rem;text-decoration:none;color:var(--ink);
  font-weight:700;font-size:.95rem;transition:.2s;
}
.tile:hover{border-color:var(--brand);box-shadow:var(--shadow-soft);transform:translateY(-2px)}
.tile .ico{width:2.3rem;height:2.3rem;border-radius:9px;margin:0}
.tile .ico svg{width:1.15rem;height:1.15rem}
.tile .t-arrow{margin-left:auto;width:16px;height:16px;stroke:var(--ink-faint);fill:none;stroke-width:2.4;transition:.2s}
.tile:hover .t-arrow{stroke:var(--brand);transform:translateX(3px)}

/* split feature */
.split{display:grid;grid-template-columns:1fr 1fr;gap:3.4rem;align-items:center}
.split-visual{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:2rem;box-shadow:var(--shadow-soft)}
/* Article + sidebar variant. This lived as an inline style on 17 pages,
   which meant it beat the mobile media query below on specificity and the
   two columns never collapsed — the rail overflowed the viewport on every
   phone. A class can be overridden; an inline style cannot. */
.split-aside{grid-template-columns:1.18fr .82fr;gap:2.6rem;align-items:start}

/* callout / note box */
.callout{
  background:var(--brand-tint-2);border:1px solid var(--brand-tint);border-left:4px solid var(--brand);
  border-radius:12px;padding:1.3rem 1.5rem;
}
.callout h2,.callout h3{font-size:1.06rem;margin-bottom:.4rem;letter-spacing:-.018em}
.callout p{font-size:.93rem;color:var(--ink-soft);line-height:1.7}
.callout.accent{background:var(--accent-tint);border-color:rgba(18,166,92,.2);border-left-color:var(--accent)}

/* ---------- 9. Steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.35rem;counter-reset:step}
.step{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.9rem 1.75rem;transition:.22s}
.step:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft)}
.step-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.95rem}
.step-num{font-size:1.9rem;font-weight:800;color:var(--brand);opacity:.28;line-height:1;letter-spacing:-.05em}
.step h3{margin-bottom:.45rem}
.step p{font-size:.93rem;color:var(--ink-soft);line-height:1.7}
.step-time{
  display:inline-block;margin-top:.9rem;font-size:.72rem;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;color:var(--accent-dark);background:var(--accent-tint);padding:.3rem .65rem;border-radius:999px;
}

/* vertical timeline variant */
.timeline{list-style:none;position:relative;padding-left:2.6rem}
.timeline::before{content:'';position:absolute;left:.95rem;top:.6rem;bottom:.6rem;width:2px;background:var(--line)}
.timeline li{position:relative;padding-bottom:1.9rem}
.timeline li:last-child{padding-bottom:0}
.timeline li::before{
  content:'';position:absolute;left:-2.6rem;top:.15rem;width:1.9rem;height:1.9rem;border-radius:50%;
  background:var(--brand);border:4px solid var(--paper);
}
.band .timeline li::before{border-color:var(--paper-2)}
.timeline li h3{font-size:1.1rem;margin-bottom:.3rem}
.timeline li p{font-size:.93rem;color:var(--ink-soft);line-height:1.7}

/* ---------- 10. Comparison table ---------- */
.compare{
  max-width:900px;margin:0 auto;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-soft);
}
.cmp-head,.cmp-row{display:grid;grid-template-columns:.9fr 1fr 1fr;align-items:stretch}
.cmp-head{background:var(--navy);color:#fff}
.cmp-head > div{display:flex;align-items:center;padding:1.05rem 1.15rem;font-size:.92rem;font-weight:800;line-height:1.2}
.cmp-head .cmp-us{background:var(--brand);color:#fff}
.cmp-row{border-top:1px solid var(--line-2)}
.cmp-row > div{display:flex;align-items:center;gap:.45rem;padding:.9rem 1.15rem;font-size:.9rem;line-height:1.45}
.cmp-lbl{font-weight:700}
.cmp-them{color:var(--ink-soft)}
.cmp-us{background:var(--brand-tint-2);font-weight:700;box-shadow:inset 3px 0 0 var(--brand)}
.mk{font-weight:900;flex-shrink:0}
.mk.ok{color:var(--accent-dark)}
.mk.no{color:var(--warn)}

/* ---------- 11. FAQ accordion ---------- */
.faq{max-width:840px;margin:0 auto}
.faq details{
  background:var(--card);border:1px solid var(--line);border-radius:13px;
  margin-bottom:.75rem;overflow:hidden;transition:.2s;
}
.faq details[open]{border-color:var(--brand-tint);box-shadow:var(--shadow-soft)}
.faq summary{
  list-style:none;cursor:pointer;padding:1.15rem 3.2rem 1.15rem 1.4rem;position:relative;
  font-size:1.01rem;font-weight:700;color:var(--ink);line-height:1.45;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:'';position:absolute;right:1.3rem;top:1.35rem;width:.85rem;height:.85rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231256E0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-size:contain;background-repeat:no-repeat;transition:transform .22s;
}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq .faq-body{padding:0 1.4rem 1.3rem;font-size:.95rem;color:var(--ink-soft);line-height:1.75}
.faq .faq-body p + p{margin-top:.8rem}
.faq .faq-body a{color:var(--brand);font-weight:600}
.faq .faq-body ul{margin:.7rem 0 0 1.1rem}
.faq .faq-body li{margin-bottom:.4rem}

/* ---------- 12. Forms ---------- */
.field{display:flex;flex-direction:column;margin-bottom:1rem}
.field > label{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--ink-soft);margin-bottom:.42rem}
.field input,.field select,.field textarea{
  background:var(--paper-2);border:1.5px solid var(--line);color:var(--ink);
  font-family:var(--sans);font-size:1rem;padding:.95rem 1rem;border-radius:11px;
  outline:none;transition:.18s;width:100%;appearance:none;-webkit-appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D9DB2' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;background-size:1rem;padding-right:2.6rem;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand);background:#fff;box-shadow:0 0 0 3px var(--brand-tint)}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-faint)}
.field textarea{resize:vertical;min-height:96px;line-height:1.55}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.field .hint{font-size:.75rem;color:var(--ink-faint);margin-top:.4rem;line-height:1.5}
.req{color:var(--warn);font-weight:800;margin-left:.1rem}
.field-err{display:none;color:var(--warn);font-size:.75rem;font-weight:700;margin-top:.4rem}
.field.error input,.field.error select,.field.error textarea{border-color:var(--warn);background:var(--warn-tint)}
.field.error .field-err{display:block}

/* radio / choice cards */
.choices{display:grid;gap:.6rem;grid-template-columns:1fr 1fr}
.choice{position:relative}
.choice input{position:absolute;opacity:0;width:0;height:0}
.choice span{
  display:flex;align-items:center;gap:.55rem;padding:.85rem 1rem;border:1.5px solid var(--line);
  border-radius:11px;background:var(--paper-2);font-size:.92rem;font-weight:600;cursor:pointer;transition:.16s;
}
.choice input:checked + span{border-color:var(--brand);background:var(--brand-tint);color:var(--brand-dark);font-weight:700}
.choice input:focus-visible + span{outline:3px solid var(--brand-soft);outline-offset:2px}

.consent{
  display:flex;align-items:flex-start;gap:.65rem;margin-top:1.2rem;padding:1rem 1.1rem;
  background:var(--paper-2);border:1px solid var(--line);border-radius:12px;
}
.consent input[type=checkbox]{
  appearance:auto;-webkit-appearance:auto;width:1.1rem;height:1.1rem;margin-top:.14rem;
  accent-color:var(--brand);flex-shrink:0;cursor:pointer;
}
.consent label{font-size:.74rem;color:var(--ink-soft);line-height:1.6;cursor:pointer}
.consent label a{color:var(--brand);text-decoration:underline}

/* progress + success */
.progress{display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem}
.progress .pg-bar{display:block;flex:1;height:5px;background:var(--line);border-radius:999px;overflow:hidden}
.progress .pg-fill{display:block;height:100%;background:var(--brand);border-radius:999px;transition:width .4s cubic-bezier(.2,.7,.3,1)}
.progress .pg-lbl{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);white-space:nowrap}

.success{text-align:center;padding:1.8rem .5rem 1rem}
.success .s-check{
  width:66px;height:66px;margin:0 auto 1.15rem;border-radius:50%;background:var(--accent);
  color:#fff;display:flex;align-items:center;justify-content:center;
}
.success .s-check svg{width:32px;height:32px;stroke:currentColor;fill:none;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.success h3{font-size:1.6rem;margin-bottom:.6rem}
.success p{color:var(--ink-soft);line-height:1.7;max-width:40ch;margin:0 auto}

/* dark trust rail beside a form */
.rail{background:var(--navy);color:#fff;border-radius:var(--radius-lg);padding:2rem 1.9rem;position:sticky;top:calc(var(--nav-h) + 1.2rem)}
.rail h2{font-size:1.5rem;color:#fff;margin-bottom:1.2rem}
.rail .checks li{color:rgba(255,255,255,.85)}
.rail .checks li b{color:#fff}
.rail-proof{border-top:1px solid var(--line-dark);padding-top:1.35rem;margin-top:1.35rem;display:flex;flex-direction:column;gap:1.1rem}
.rail-stats{display:flex;gap:1.8rem}
.rail-stats b{display:block;font-size:1.5rem;font-weight:800;color:var(--brand-soft);line-height:1;letter-spacing:-.03em}
.rail-stats span{font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:.3rem;display:block;font-weight:700}
.rail-call{display:flex;align-items:center;gap:.6rem;font-size:1.05rem;font-weight:800;color:#fff;text-decoration:none}
.rail-call svg{width:18px;height:18px;stroke:var(--accent);fill:none;stroke-width:2}
.rail-call:hover{color:var(--brand-soft)}

/* ---------- 13. Testimonials ---------- */
.tcards{display:flex;gap:1.15rem;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:.4rem}
.tcards::-webkit-scrollbar{display:none}
.tcard{
  flex:0 0 calc((100% - 2.3rem)/3);scroll-snap-align:start;background:var(--card);
  border:1px solid var(--line);border-radius:14px;padding:1.4rem 1.45rem;
  display:flex;flex-direction:column;gap:.7rem;box-shadow:var(--shadow-soft);
}
.tcard .stars{font-size:.95rem;letter-spacing:.1em}
.tcard p{font-size:.92rem;line-height:1.65;flex:1;color:var(--ink)}
.tmeta{display:flex;align-items:center;justify-content:space-between;gap:.6rem;border-top:1px solid var(--line-2);padding-top:.75rem}
.tname{font-weight:800;font-size:.95rem}
.tcase{font-size:.72rem;color:var(--ink-faint);font-weight:600;white-space:nowrap}
.car-nav{display:flex;gap:.55rem;justify-content:center;margin-top:1.3rem}
.car-btn{
  width:2.7rem;height:2.7rem;border-radius:50%;border:1px solid var(--line);background:var(--card);
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;
}
.car-btn:hover{background:var(--brand);border-color:var(--brand)}
.car-btn svg{width:1.05rem;height:1.05rem;stroke:var(--ink);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.car-btn:hover svg{stroke:#fff}

/* ---------- 14. CTA band, footer, misc ---------- */
.cta-band{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.cta-band::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 90% at 85% 20%,rgba(11,124,140,.30),transparent 62%),
             radial-gradient(45% 70% at 10% 90%,rgba(18,166,92,.16),transparent 60%);
}
.cta-band .wrap{position:relative;text-align:center}
.cta-band h2{color:#fff;max-width:20ch;margin:0 auto .9rem}
.cta-band p{color:rgba(255,255,255,.76);max-width:56ch;margin:0 auto 1.9rem;font-size:1.05rem}
.cta-band .actions{justify-content:center}

footer{position:relative;z-index:1;background:var(--navy);color:rgba(255,255,255,.62);padding:3.4rem 0 2rem;border-top:1px solid var(--line-dark)}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2.4rem;padding-bottom:2.4rem;border-bottom:1px solid var(--line-dark)}
.foot-brand .brand-name{color:#fff;font-size:1.36rem}
.foot-brand .brand{border-left-color:var(--brand-soft)}
.foot-brand .brand-tag{color:var(--brand-soft)}
.foot-blurb{font-size:.87rem;line-height:1.7;margin-top:1rem;max-width:36ch}
.foot-contact{display:flex;flex-direction:column;gap:.6rem;margin-top:1.3rem}
.foot-contact a{display:inline-flex;align-items:center;gap:.55rem;color:#fff;text-decoration:none;font-size:.93rem;font-weight:700}
.foot-contact a:hover{color:var(--brand-soft)}
.foot-contact svg{width:16px;height:16px;stroke:var(--accent);fill:none;stroke-width:2}
.foot-hours{font-size:.78rem;color:rgba(255,255,255,.5);margin-top:.3rem}
.foot-col .foot-col-label{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:1rem;font-weight:800}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.foot-col a{font-size:.87rem;color:rgba(255,255,255,.62);text-decoration:none;transition:.18s}
.foot-col a:hover{color:var(--brand-soft)}
.foot-legal{padding-top:1.8rem;font-size:.76rem;line-height:1.8;color:rgba(255,255,255,.42)}
.foot-legal a{color:rgba(255,255,255,.6)}
.foot-legal p + p{margin-top:.8rem}
.foot-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1.4rem;padding-top:1.4rem;border-top:1px solid var(--line-dark);font-size:.78rem}
.foot-bottom ul{list-style:none;display:flex;gap:1.3rem;flex-wrap:wrap}
.foot-bottom a{color:rgba(255,255,255,.55);text-decoration:none}
.foot-bottom a:hover{color:#fff}

/* legal / long-form prose pages */
.prose{max-width:76ch}
.prose h2{font-size:1.5rem;margin:2.4rem 0 .8rem}
.prose h3{font-size:1.12rem;margin:1.6rem 0 .5rem}
.prose p,.prose li{font-size:.97rem;color:var(--ink-soft);line-height:1.8}
.prose p{margin-bottom:1rem}
.prose ul,.prose ol{margin:0 0 1.2rem 1.3rem}
.prose li{margin-bottom:.5rem}
.prose a{color:var(--brand);font-weight:600}
.prose strong{color:var(--ink);font-weight:700}
.prose table{width:100%;border-collapse:collapse;margin-bottom:1.4rem;font-size:.92rem}
.prose th,.prose td{text-align:left;padding:.7rem .8rem;border-bottom:1px solid var(--line-2)}
.prose th{font-weight:800;color:var(--ink);background:var(--paper-2)}
.prose-meta{font-size:.82rem;color:var(--ink-faint);margin-bottom:2rem}

/* page hero (interior pages) */
.page-hero{padding:3.2rem 0 2.6rem;background:var(--paper-2);border-bottom:1px solid var(--line-2)}
.page-hero h1{font-size:clamp(2.05rem,4.2vw,3.1rem);margin-bottom:.85rem}
.page-hero p{font-size:1.08rem;color:var(--ink-soft);max-width:62ch;line-height:1.6}
.page-hero .actions{margin-top:1.7rem}
.crumbs{font-size:.78rem;color:var(--ink-faint);margin-bottom:1rem;font-weight:600}
.crumbs a{color:var(--ink-faint);text-decoration:none}
.crumbs a:hover{color:var(--brand)}
.crumbs span{margin:0 .4rem;opacity:.6}

/* glossary */
.gloss-nav{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:2rem}
.gloss-nav a{
  display:inline-flex;align-items:center;justify-content:center;min-width:2rem;height:2rem;padding:0 .5rem;
  border-radius:8px;background:var(--card);border:1px solid var(--line);font-size:.8rem;font-weight:800;
  color:var(--ink-soft);text-decoration:none;transition:.16s;
}
.gloss-nav a:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.gloss-group{margin-bottom:2.4rem}
.gloss-group > h2{font-size:1.4rem;color:var(--brand);border-bottom:2px solid var(--line);padding-bottom:.5rem;margin-bottom:1.2rem;scroll-margin-top:110px}
.gloss-item{margin-bottom:1.3rem}
.gloss-item dt{font-weight:800;font-size:1rem;margin-bottom:.25rem}
.gloss-item{scroll-margin-top:110px}
.gloss-item dd{font-size:.93rem;color:var(--ink-soft);line-height:1.7}
.gloss-item:target dt{color:var(--brand)}
.gloss-item:target{background:var(--brand-tint-2);border-radius:8px;padding:.6rem .8rem;margin-left:-.8rem}
.gloss-perma{opacity:0;color:var(--ink-faint);text-decoration:none;font-weight:700;padding-left:.3rem;transition:.15s}
.gloss-item:hover .gloss-perma,.gloss-perma:focus-visible{opacity:1;color:var(--brand)}

/* reveal-on-scroll — only hidden when JS is present to un-hide it, so a broken
   or blocked script can never leave a section invisible */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}
.js .reveal.in{opacity:1;transform:none}

/* disclaimer strip */
.disclaimer{font-size:.76rem;color:var(--ink-faint);line-height:1.7;max-width:90ch}
.disclaimer strong{color:var(--ink-soft)}

/* ---------- 15. Pharmacy-specific components ---------- */

/* Keyboard users land here first. Off-screen until focused. */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--brand);color:#fff;padding:.7rem 1.1rem;border-radius:0 0 8px 0;
  font-size:.85rem;font-weight:800;text-decoration:none;
}
.skip-link:focus{left:0}

.brand-mark{width:34px;height:34px;flex-shrink:0;margin-right:.6rem;border-radius:8px}
#siteNav.scrolled .brand-mark{width:30px;height:30px;transition:.25s}
/* The wordmark sets "on Liens" in brand colour. `em` because it is a semantic
   emphasis inside the name, not a decorative span. */
.brand-name em{font-style:normal;color:var(--brand);font-weight:800}
.foot-brand .brand-name em{color:var(--brand-soft)}
@media(max-width:420px){.brand-mark{width:28px;height:28px;margin-right:.45rem}}

/* Audience picker — the three-door split that does most of the homepage's work.
   Cards, but bigger, linked, and ordered by who actually pays us. */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:1.35rem}
.door{
  display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:2rem 1.85rem;text-decoration:none;transition:.22s;
  border-top:4px solid var(--brand);
}
.door:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft);border-color:var(--line)}
.door .ico{margin-bottom:1rem}
.door h3{margin-bottom:.5rem;font-size:1.32rem}
.door p{font-size:.94rem;color:var(--ink-soft);line-height:1.7;flex:1}
.door .door-cta{
  margin-top:1.2rem;color:var(--brand);font-weight:800;font-size:.9rem;
  display:inline-flex;align-items:center;gap:.35rem;
}
.door:hover .door-cta svg{transform:translateX(3px)}
.door .door-cta svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4;transition:.2s}

/* NAP block. A real address is this business's biggest asset over the national
   card networks, so it gets its own component rather than a paragraph. */
.nap{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1.4rem;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.7rem 1.8rem;box-shadow:var(--shadow-soft);
}
.nap-item{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.nap-item .nap-lbl{
  font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--ink-faint);
}
.nap-item a,.nap-item strong{
  font-size:1.02rem;font-weight:800;color:var(--ink);text-decoration:none;letter-spacing:-.01em;
  overflow-wrap:anywhere;
}
.nap-item a:hover{color:var(--brand)}
.nap-item small{font-size:.82rem;color:var(--ink-soft);font-weight:500;line-height:1.5}

/* Two-column "them vs us" prose block, for the pages where the differentiator
   is a contrast rather than a table. */
.versus{display:grid;grid-template-columns:1fr 1fr;gap:1.35rem}
.versus > div{border-radius:var(--radius);padding:1.7rem 1.7rem;border:1px solid var(--line)}
.versus .v-them{background:var(--paper-2)}
.versus .v-us{background:var(--brand-tint-2);border-color:var(--brand-tint);box-shadow:inset 3px 0 0 var(--brand)}
.versus h3{font-size:1.05rem;margin-bottom:.75rem}
.versus .v-them h3{color:var(--ink-soft)}
.versus .v-us h3{color:var(--brand-dark)}
.versus ul{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.versus li{font-size:.92rem;line-height:1.6;color:var(--ink-soft);padding-left:1.5rem;position:relative}
.versus li::before{position:absolute;left:0;font-weight:900}
.versus .v-them li::before{content:'\2715';color:var(--warn)}
.versus .v-us li::before{content:'\2713';color:var(--accent-dark)}

/* Objection / answer pairs. Reads as a conversation, which is the point —
   these are the sentences an attorney says out loud. */
.objections{display:flex;flex-direction:column;gap:1.1rem;max-width:840px}
.objection{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.5rem 1.6rem;
}
.objection .obj-q{
  font-size:1.04rem;font-weight:800;color:var(--ink);margin-bottom:.6rem;
  padding-left:1.6rem;position:relative;letter-spacing:-.015em;
}
.objection .obj-q::before{
  content:'\201C';position:absolute;left:0;top:-.35rem;
  font-size:1.9rem;color:var(--brand);opacity:.5;line-height:1;
}
.objection p{font-size:.94rem;color:var(--ink-soft);line-height:1.75}
.objection p + p{margin-top:.7rem}

/* Turnaround / hours strip, used where the promise is a time rather than a fact. */
.clockrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1.1rem}
.clock{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.35rem 1.4rem;
}
.clock b{display:block;font-size:1.5rem;font-weight:800;color:var(--brand);letter-spacing:-.03em;line-height:1.1}
.clock span{display:block;margin-top:.4rem;font-size:.85rem;color:var(--ink-soft);line-height:1.5}

/* Inline pill for "we will not do this" statements. The restraint is the sell. */
.no-pill{
  display:inline-flex;align-items:center;gap:.4rem;background:var(--warn-tint);
  color:var(--warn);border-radius:999px;padding:.3rem .75rem;font-size:.78rem;font-weight:800;
}

/* Anchor-nav chip row, reused by /faq/ and /glossary/. */
.chipnav{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:2rem}
.chipnav a{
  display:inline-flex;align-items:center;padding:.4rem .85rem;border-radius:999px;
  background:var(--card);border:1px solid var(--line);font-size:.82rem;font-weight:700;
  color:var(--ink-soft);text-decoration:none;transition:.16s;
}
.chipnav a:hover{background:var(--brand);border-color:var(--brand);color:#fff}


/* Headline deck.
   The H1 carries the category term so the page is findable; the deck carries
   the line that actually makes a case manager keep reading. Splitting them was
   the only way to have both — every H1 on this site used to be an aphorism with
   no searchable term in it. */
.deck{
  font-size:clamp(1.35rem,2.6vw,1.9rem);font-weight:800;letter-spacing:-.022em;
  line-height:1.18;color:var(--ink);margin:.85rem 0 0;max-width:24ch;
}
.deck em{font-style:normal;color:var(--brand)}
.page-hero .deck{max-width:30ch}
.hero .deck{margin-bottom:1.1rem}
@media(max-width:680px){.deck{font-size:1.3rem;max-width:none}}

/* Audience chips — the three-door router, compressed to a single row so it can
   sit in the first screen on a phone rather than five screens down. */
.chips{display:flex;flex-wrap:wrap;gap:.55rem;margin:1.2rem 0 1.4rem}
.chips a{
  display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1rem;border-radius:999px;
  background:var(--card);border:1.5px solid var(--line);font-size:.86rem;font-weight:700;
  color:var(--ink);text-decoration:none;transition:.16s;min-height:44px;
}
.chips a:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-1px)}
.chips a svg{width:15px;height:15px;stroke:var(--brand);fill:none;stroke-width:2.2}

/* ---------- Responsive ---------- */
/* The nav carries more than HWF's did — five items, a phone number and a CTA,
   plus a wordmark with a mark beside it. It runs out of room well above the
   mobile breakpoint, so it sheds weight in two stages before the burger. */
@media(max-width:1400px){
  .nav-links{gap:1.25rem}
  .nav-links a{font-size:.83rem}
  .nav-cta{padding:.62rem 1.05rem!important}
}
@media(max-width:1240px){
  /* The number stays reachable in the topbar and the footer; losing it here
     buys the CTA the room it needs. */
  .nav-phone{display:none}
  .nav-links{gap:1.02rem}
  .nav-links a{font-size:.81rem}
}
/* Collapse to the drawer at 1080, not 960.
   Between the two the five nav items plus the CTA still did not fit — an iPad
   in landscape (1024) pushed "Refer a Patient" 20px past the viewport edge and
   the whole page scrolled sideways. A burger at tablet width is also simply
   better than six 13px links. */
@media(max-width:1080px){
  :root{--nav-h:66px}
  .nav-links,.topbar-note{display:none}
  .nav-toggle{display:block}
  .nav-cta{display:none}
  .mobile-bar{display:flex}
  /* Clears the fixed action bar. The safe-area term is the home indicator on
     a notched iPhone — without it the last line of the footer sits underneath
     the bar and cannot be scrolled into view. */
  body{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .mobile-menu{padding-bottom:calc(2.5rem + env(safe-area-inset-bottom))}
  /* Tap targets. Apple's minimum is 44pt square and the drawer's submenu links
     were landing at 37–38px — reachable with a mouse, a coin-flip with a thumb.
     Footer links had the same problem at 22px. */
  .mm-list .mm-sub a{padding:.68rem 0}
  .foot-col ul{gap:.1rem}
  .foot-col a{display:block;padding:.72rem 0}
  .foot-bottom ul{gap:.2rem 1.3rem}
  .foot-bottom a{display:inline-block;padding:.75rem 0}
  .foot-contact{gap:.15rem}
  .foot-contact a{padding:.62rem 0}
  .foot-brand .brand{padding-top:.3rem;padding-bottom:.3rem}
  /* The glossary's letter chips carry a fixed height:2rem, which padding alone
     cannot beat — hence the explicit min-height/min-width. Single-character
     targets are the easiest thing on the site to miss with a thumb. */
  .chipnav a,.gloss-nav a{padding:.55rem .9rem;min-height:44px;min-width:44px;height:auto}
  .gloss-nav{gap:.5rem}
  .hero .wrap{grid-template-columns:1fr;grid-template-areas:"lead" "form" "rest";gap:1.8rem}
  /* Centred rather than left-aligned: once the hero stacks, a 520px card
     pinned left leaves an obvious dead column on a tablet. */
  .hero-form-wrap{position:static;max-width:560px;margin-left:auto;margin-right:auto;width:100%}
  .hero-sub{margin-bottom:0}
  .stats-bar .wrap{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:none}
  .stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line-dark)}
  .grid-3,.grid-4,.steps,.doors{grid-template-columns:repeat(2,1fr)}
  .split,.split-aside{grid-template-columns:1fr;gap:2.4rem}
  .rail{position:static}
  .foot-grid{grid-template-columns:1fr 1fr;gap:2rem}
  .tcard{flex-basis:calc((100% - 1.15rem)/2)}
}
@media(max-width:680px){
  section{padding:3.4rem 0}
  .grid-2,.grid-3,.grid-4,.steps,.doors,.versus{grid-template-columns:1fr}
  .choices{grid-template-columns:1fr}
  .door,.nap{padding:1.6rem 1.4rem}
  .field-row{grid-template-columns:1fr}
  .tcard{flex-basis:88%}
  .cmp-head > div,.cmp-row > div{padding:.72rem .6rem;font-size:.79rem}
  .cmp-head,.cmp-row{grid-template-columns:1fr .9fr .9fr}
  .foot-grid{grid-template-columns:1fr}
  .logo-strip .wrap{gap:1.2rem}
  .hero{padding-top:2.2rem}
  .fc-head{padding:1.15rem 1.3rem}
  .fc-body{padding:1.25rem 1.3rem 1.4rem}
  .rail{padding:1.6rem 1.4rem}
  .card,.step{padding:1.6rem 1.4rem}
  .actions .btn{width:100%}
}
/* Large phones — 6.7" iPhones report 428–430px, which used to fall through
   every small-screen rule and render the header at full desktop metrics. */
@media(max-width:520px){
  .brand{border-left-width:3px;padding-left:.6rem}
  .brand-name{font-size:1.16rem}
  .brand-tag{font-size:.48rem;letter-spacing:.115em}
}
@media(max-width:400px){
  .brand-name{font-size:1.04rem}
  .brand-tag{font-size:.43rem;letter-spacing:.09em}
  .stat b{font-size:1.9rem}
  .page-hero{padding:2.4rem 0 2rem}
}
/* 5.4"/SE-class devices, 375px and below. */
@media(max-width:360px){
  .brand-name{font-size:.98rem}
  .brand-tag{font-size:.4rem;letter-spacing:.07em}
  .wrap,.wrap-narrow{padding:0 4.5vw}
}
@media print{
  nav,.topbar,.mobile-bar,.cta-band,footer .foot-grid{display:none}
  body{background:#fff}
}

/* ---------- call-or-text chooser ---------- */
.choice-modal{
  /* A dialog centres itself via `margin:auto` against inset:0. Setting a
     percentage width without that pins it to the top-left corner. */
  position:fixed;inset:0;margin:auto;height:fit-content;
  width:min(92vw,360px);max-width:none;
  border:none;padding:0;background:transparent;color:var(--ink);
}
.choice-modal::backdrop{background:rgba(8,32,43,.55);backdrop-filter:blur(3px)}
.choice-modal .cm-body{
  position:relative;
  background:var(--card);border-radius:var(--radius-lg);padding:1.9rem 1.7rem 1.5rem;
  box-shadow:0 30px 70px -24px rgba(11,30,39,.45);text-align:center;
}
.choice-modal .cm-x{
  position:absolute;top:.7rem;right:.7rem;width:2rem;height:2rem;display:flex;
  align-items:center;justify-content:center;border:0;border-radius:50%;
  background:transparent;color:var(--ink-faint);cursor:pointer;transition:.16s;
}
.choice-modal .cm-x:hover{background:var(--paper);color:var(--ink)}
.choice-modal .cm-x svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4}
.choice-modal h3{font-size:1.3rem;margin-bottom:.5rem;padding:0 1.4rem}
.choice-modal .cm-number{
  font-size:1.5rem;font-weight:800;letter-spacing:-.03em;color:var(--brand);
  font-variant-numeric:tabular-nums;margin-bottom:.55rem;
}
.choice-modal .cm-note{font-size:.8rem;color:var(--ink-soft);line-height:1.6;margin-bottom:1.4rem}
.choice-modal .cm-actions{display:flex;flex-direction:column;gap:.65rem}
.choice-modal .cm-actions .btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2}
.choice-modal .cm-close{
  margin-top:1rem;background:none;border:0;cursor:pointer;font-size:.83rem;font-weight:700;
  color:var(--ink-faint);padding:.4rem;
}
.choice-modal .cm-close:hover{color:var(--ink-soft)}
/* no <dialog> support: render inline rather than showing it always-open */
.choice-modal:not([open]){display:none}
@media(prefers-reduced-motion:no-preference){
  .choice-modal[open]{animation:cmIn .18s ease-out}
  @keyframes cmIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
}

/* California cross-link line on case-type pages. Links inherit the accent so
   the sentence reads as prose rather than as a row of buttons. */
.ca-cross a { color: var(--brand); font-weight: 600; }

/* Glossary deep links. Underlined on hover only — a paragraph with six
   permanently-underlined terms reads like a Wikipedia stub, and these are
   there to be available rather than to pull the eye off the sentence. */
.gloss-link {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px dotted var(--brand);
}
.gloss-link:hover,
.gloss-link:focus-visible { color: var(--brand); border-bottom-style: solid; }

/* Authorship strip on pages that state law. Small and quiet — it is there to
   be checkable, not to be read first. */
.byline {
  margin: 1.1rem 0 0;
  font-size: .84rem;
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 60ch;
}
.byline a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.byline a:hover { color: var(--brand); }