/* Recoup marketing site — shared stylesheet for welcome / features / pricing /
   contact / privacy. These pages are STANDALONE: no nav.js, no look.js, no app
   state, so nothing here can touch the app.
   LOOK (owner 3 Oct, from the mockup canvas: "C layout with B colours"): the
   app's Calm palette — white page, pale sage panels, accent #3A6E5B, ink
   #26352F — with Nunito headings over an Inter body. Layout from option C: a big
   headline beside a short lead, then the product on a Mac and an iPad in a sage
   panel. Money teal / owing red stay semantic, as in the app. */

:root {
  --ink:#26352F; --head-ink:#1E2B26; --muted:#46514B; --faint:#5F6B65;
  --line:#E2E8E1; --line-soft:#EEF2ED; --bg:#F3F6F2; --sage:#EEF4EF; --sage-2:#DCEBE2; --card:#FFFFFF;
  --accent:#3A6E5B; --accent-deep:#2E5A4A; --accent-ink:#2E6450;
  --teal:#0F9488; --teal-deep:#0B6B62; --teal-soft:#DDF1EC;
  --amber:#7A5600; --amber-soft:#FCF4D7; --red:#B81E4E; --red-soft:#FBE3EA;
  --font:'Inter',-apple-system,system-ui,"Segoe UI",sans-serif;
  --head:'Nunito','Inter',-apple-system,system-ui,sans-serif;
  --r:20px; --r-sm:12px;
  --shadow:0 30px 60px rgba(38,53,47,.14), 0 2px 6px rgba(38,53,47,.05);
  --shadow-sm:0 6px 18px rgba(38,53,47,.06);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { margin:0; background:#fff; color:var(--ink); font:17px/1.65 var(--font); -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4 { font-family:var(--head); font-weight:800; letter-spacing:-.015em; margin:0; text-wrap:balance; color:var(--head-ink); }
p { margin:0; }
img, svg { max-width:100%; display:block; }
a { color:var(--accent-ink); }
.wrap { max-width:1200px; margin:0 auto; padding:0 32px; }
.sr { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ---------- buttons: pills, as in the Calm look ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:12px 24px; border-radius:999px;
  font-weight:600; font-size:15px; text-decoration:none; border:1px solid transparent;
  cursor:pointer; font-family:var(--font); line-height:1.2; transition:background .15s, border-color .15s; white-space:nowrap; }
.btn.primary { background:var(--accent); color:#fff; }
.btn.primary:hover { background:var(--accent-deep); }
.btn.ghost, .btn.ghost.onDark { border-color:#D9E0D8; color:var(--ink); background:#fff; }
.btn.ghost:hover { border-color:var(--accent); }
.btn.lg { min-height:52px; padding:14px 28px; font-size:16px; }
.btn .arr { transition:transform .15s; }
.btn:hover .arr { transform:translateX(3px); }

/* ---------- header ---------- */
.site-head { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(12px); -webkit-backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--line-soft); }
.site-head .wrap { display:flex; align-items:center; height:74px; gap:26px; }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--head-ink); }
.brand img { width:30px; height:28px; object-fit:contain; }
.brand .word { font-family:var(--head); font-weight:800; font-size:25px; letter-spacing:-.015em; }
.nav { display:flex; align-items:center; gap:4px; margin-left:8px; }
.nav a { color:var(--ink); text-decoration:none; font-weight:500; font-size:15px; padding:8px 12px; border-radius:999px; }
.nav a:hover { background:var(--sage); }
.nav a.on { color:var(--accent-ink); background:var(--sage); font-weight:600; }
.nav a.mob { display:none; }
.head-cta { margin-left:auto; display:flex; align-items:center; gap:10px; }
.head-cta .signin { color:var(--ink); text-decoration:none; font-weight:500; font-size:15px; padding:8px 12px; }
.head-cta .btn { min-height:44px; padding:10px 20px; font-size:15px; }
.burger { display:none; margin-left:auto; width:44px; height:44px; border:1px solid var(--line); border-radius:12px;
  background:#fff; align-items:center; justify-content:center; cursor:pointer; }
.burger span, .burger span::before, .burger span::after { display:block; width:18px; height:2px; background:var(--ink); border-radius:2px; position:relative; content:""; }
.burger span::before { position:absolute; top:-6px; } .burger span::after { position:absolute; top:6px; }

/* ---------- opening: big headline beside a short lead (option C) ---------- */
.lede { padding:84px 0 52px; }
.lede .grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:56px; align-items:end; }
.lede.solo .grid { grid-template-columns:minmax(0,1fr); }
.eyebrow { display:inline-flex; align-items:center; gap:8px; max-width:100%; font-size:13px; font-weight:600;
  color:var(--accent-ink); background:var(--sage-2); padding:6px 14px; border-radius:999px; }
.eyebrow i { display:none; }
.lede h1 { font-size:clamp(36px,4.4vw,54px); line-height:1.06; margin-top:18px; }
.lede.big h1 { font-size:clamp(40px,5.4vw,66px); line-height:1.04; }
.lede .lead { font-size:18px; line-height:1.6; color:var(--muted); max-width:34em; }
.lede .ctas { display:flex; gap:12px; flex-wrap:wrap; margin-top:24px; }
.facts { display:flex; gap:10px 28px; flex-wrap:wrap; margin-top:24px; }
.facts div { display:flex; align-items:center; gap:8px; font-size:15px; color:var(--muted); }
.facts svg { width:20px; height:20px; color:var(--accent); flex:none; }

/* ---------- the product on a Mac and an iPad, in a sage panel ---------- */
.stage { background:var(--bg); border-radius:28px; padding:56px 56px 44px; }
.devices { display:flex; gap:40px; align-items:flex-end; flex-wrap:wrap; }
.mac { flex:1 1 560px; min-width:0; }
.mac .scr { background:#2a2c2b; border-radius:18px 18px 4px 4px; padding:12px 12px 14px; box-shadow:var(--shadow); }
.mac .notch { width:16%; height:6px; background:#b4b6b0; margin:0 auto; border-radius:0 0 6px 6px; }
.mac .base { height:14px; background:linear-gradient(#e2e3df,#c6c8c2); border-radius:0 0 14px 14px; margin:0 -4%; }
.ipad { flex:0 1 330px; min-width:240px; background:#2a2c2b; border-radius:28px; padding:12px; box-shadow:var(--shadow); }
.stage .facts { margin-top:28px; }

/* the screen inside a device — the app's Calm look, drawn in CSS with fictional data */
.ui { background:#FAFAF7; border-radius:6px; overflow:hidden; display:flex; color:var(--ink); font:12px/1.4 var(--font); }
.ui .uside { width:22%; min-width:124px; background:#fff; border-right:1px solid var(--line); padding:12px 10px; display:flex; flex-direction:column; gap:2px; }
.ui .uside span { font-size:11.5px; font-weight:500; padding:6px 9px; border-radius:8px; color:var(--ink); }
.ui .uside span.on { background:var(--sage-2); color:var(--accent-ink); font-weight:700; }
.ui .umain { flex:1; padding:16px 18px; display:flex; flex-direction:column; gap:11px; min-width:0; }
.ui .ut { font-family:var(--head); font-weight:800; font-size:17px; color:var(--head-ink); }
.ui .us { font-size:11px; color:var(--faint); margin-top:-6px; }
.ui .ukpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
.ui .k { background:#fff; border:1px solid var(--line); border-radius:12px; padding:9px 10px; min-width:0; }
.ui .k b { display:block; font-size:10px; color:var(--faint); font-weight:500; }
.ui .k i { display:block; font-style:normal; font-size:16px; font-weight:700; margin-top:2px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.ui .k i.t { color:var(--teal-deep); } .ui .k i.o { color:var(--red); }
.ui .uc { background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.ui .uc .h { font-family:var(--head); font-weight:800; font-size:12.5px; padding:9px 12px; border-bottom:1px solid var(--line-soft); }
.ui .r { display:grid; grid-template-columns:1.3fr .95fr .75fr 1.15fr; gap:8px; padding:7px 12px; border-bottom:1px solid #F1F3F0; align-items:center; font-size:11px; white-space:nowrap; }
.ui .r > * { overflow:hidden; text-overflow:ellipsis; }
.ui .r:last-child { border-bottom:0; }
.ui .r.hd { font-size:10px; color:var(--faint); font-weight:600; }
.ui .r .n { text-align:right; font-variant-numeric:tabular-nums; }
.ui.tab { flex-direction:column; min-height:400px; }
.ui.tab .umain { padding:14px 12px; }
.ui.tab .r { grid-template-columns:50px minmax(0,1.4fr) minmax(84px,1fr); padding:8px 10px; }
.ui .r .cl { overflow:visible; }
.ui .go { margin-top:auto; background:var(--accent); color:#fff; border-radius:999px; text-align:center; font-weight:600; font-size:11.5px; padding:10px; }
.ui .tag { color:var(--accent-ink); font-weight:600; }
.mac .ui { min-height:400px; }

/* status pills (also used by the smaller window mocks) */
.pill { display:inline-block; padding:2px 8px; border-radius:6px; font-size:10.5px; font-weight:600; border:1px solid transparent; line-height:1.5; }
.pill.paid { background:var(--teal-soft); color:var(--teal-deep); border-color:#BFE3DC; }
.pill.warn, .pill.draft { background:var(--amber-soft); color:var(--amber); border-color:#E8C258; }
.pill.bad { background:var(--red-soft); color:var(--red); border-color:#F2B8C9; }
.pill.neutral { background:#fff; color:var(--ink); border-color:var(--line); }
.cl { display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:700; color:var(--teal-deep); background:#F3FAF8; border:1px solid #BFE3DB; padding:2px 7px; border-radius:6px; }

/* ---------- smaller app window (feature splits) ---------- */
.app { background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); overflow:hidden; font-size:12.5px; }
.app-bar { height:38px; background:var(--sage); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:8px; padding:0 14px; }
.app-bar i { width:10px; height:10px; border-radius:50%; background:#CFD8CF; display:block; }
.app-bar .url { margin-left:10px; flex:1; height:22px; border-radius:999px; background:#fff; border:1px solid var(--line);
  display:flex; align-items:center; padding:0 12px; color:var(--faint); font-size:11.5px; }
.app-body { display:grid; grid-template-columns:172px minmax(0,1fr); min-height:380px; }
.app-side { background:#fff; border-right:1px solid var(--line); padding:14px 12px; }
.app-side a { display:block; color:var(--ink); font-weight:500; text-decoration:none; padding:7px 10px; border-radius:8px; font-size:12.5px; }
.app-side a.on { background:var(--sage-2); color:var(--accent-ink); font-weight:700; }
/* the brand block at the head of a drawn side menu: mark on a tile, wordmark, the practice under it */
.sbrand { display:flex; align-items:center; gap:9px; padding:4px 4px 12px; margin-bottom:10px; border-bottom:1px solid var(--line-soft); }
.sbrand .tile { width:30px; height:30px; border-radius:9px; background:linear-gradient(145deg,#0E3170,#07183C); display:flex; align-items:center; justify-content:center; flex:none; }
.sbrand .tile img { width:20px; height:19px; }
.sbrand b { display:block; font-family:var(--head); font-weight:800; font-size:16px; line-height:1.1; color:var(--head-ink); }
.sbrand small { display:block; font-size:10px; color:var(--muted); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ui .sbrand { padding:2px 2px 10px; margin-bottom:8px; }
.ui .sbrand .tile { width:26px; height:26px; border-radius:8px; } .ui .sbrand .tile img { width:17px; height:16px; }
.ui .sbrand b { font-size:14px; }
.app-main { padding:18px; background:#FAFAF7; min-width:0; }
.app-main h4 { font-size:16px; margin-bottom:12px; }
.app-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:12px; }
.kpi { background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.kpi b { display:block; font-size:11px; color:var(--faint); font-weight:500; }
.kpi .v { font-size:20px; font-weight:700; color:var(--head-ink); margin-top:4px; font-variant-numeric:tabular-nums; }
.kpi .v.t { color:var(--teal-deep); } .kpi .v.r { color:var(--red); }
.app-cards { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.acard { min-width:0; background:#fff; border:1px solid var(--line); border-radius:12px; overflow-x:auto; overflow-y:hidden; }
.acard .h { padding:10px 12px; border-bottom:1px solid var(--line-soft); font-family:var(--head); font-weight:800; font-size:12.5px; display:flex; justify-content:space-between; gap:10px; white-space:nowrap; }
.acard .h span:first-child { overflow:hidden; text-overflow:ellipsis; }
.acard .h span { color:var(--accent-ink); font-weight:700; }
.tbl { width:100%; border-collapse:collapse; }
.tbl th { text-align:left; font-size:11px; color:var(--faint); padding:8px 12px; border-bottom:1px solid var(--line-soft); font-weight:600; }
.tbl td { padding:8px 12px; border-bottom:1px solid var(--line-soft); vertical-align:middle; white-space:nowrap; }
.tbl tr:last-child td { border-bottom:none; }
.tbl td.wrap { white-space:normal; min-width:170px; line-height:1.6; }
.tbl td.wrap .pill { white-space:normal; }
.tbl .n { text-align:right; font-variant-numeric:tabular-nums; }
.tbl .mono { font-variant-numeric:tabular-nums; font-size:11.5px; }
.tbl a { color:var(--accent-ink); font-weight:600; text-decoration:none; }
.claimbox { display:inline-block; border:1px solid var(--line); border-radius:8px; padding:4px 8px; font-weight:700; font-size:11.5px; min-width:92px; }
.claimbox.set { color:var(--teal-deep); background:#F3FAF8; border-color:#BFE3DB; }
.claimbox.pick { color:var(--faint); font-weight:500; }
.abtn { display:inline-block; background:var(--accent); color:#fff; border-radius:999px; padding:6px 14px; font-weight:600; font-size:11.5px; }
.app.sm .app-body { grid-template-columns:1fr; min-height:0; }
.app.sm .app-main { padding:14px; }
.app .tbl th, .app .tbl td { padding:8px 9px; }
.app .tbl th:first-child, .app .tbl td:first-child { padding-left:12px; }

/* ---------- sections ---------- */
section { padding:88px 0; }
section.tint { background:var(--bg); }
.kicker { font-size:13px; font-weight:600; color:var(--accent-ink); margin-bottom:12px; }
h2 { font-size:clamp(30px,3.8vw,44px); line-height:1.08; }
.sub { color:var(--muted); max-width:38em; margin-top:16px; font-size:18px; }
.center { text-align:center; } .center .sub { margin-left:auto; margin-right:auto; }
/* option C's section heading: title left, a sentence beside it */
.shead { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; align-items:end; }
.shead .sub { margin-top:0; }

/* how it works */
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:44px; }
.step { background:#fff; border-radius:var(--r); padding:28px 26px; }
.tint .step, .panel .step { border:0; }
.step .num { font-family:var(--head); font-weight:800; font-size:15px; color:var(--accent-ink); margin-bottom:10px; }
.step h3 { font-size:21px; margin-bottom:8px; }
.step p { color:var(--muted); font-size:15.5px; }

/* feature grid: white cards on a sage panel */
.panel { background:var(--bg); border-radius:24px; padding:20px; margin-top:40px; }
.grid3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:40px; text-align:left; }
.panel .grid3 { margin-top:0; }
.fcard { background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:28px 26px; }
.panel .fcard, .tint .fcard { border-color:transparent; }
.fcard .ic { width:44px; height:44px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; background:var(--sage-2); color:var(--accent-ink); }
.fcard .ic svg { width:22px; height:22px; }
.ic.blue, .ic.teal, .ic.navy, .ic.amber { background:var(--sage-2); color:var(--accent-ink); }
.fcard h3 { font-size:21px; margin-bottom:8px; }
.fcard p { color:var(--muted); font-size:15.5px; }

/* split feature */
.split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:60px; align-items:center; margin-top:72px; }
.split.flip .copy { order:2; }
.split h3 { font-size:clamp(24px,2.8vw,32px); margin-bottom:14px; }
.split p { color:var(--muted); margin-bottom:16px; font-size:16.5px; }
.checks { list-style:none; margin:0; padding:0; }
.checks + .btn { margin-top:24px; }
.checks li, .plist li, .pc li { position:relative; padding:6px 0 6px 32px; font-size:15.5px; }
.checks li::before, .plist li::before, .pc li::before { content:""; position:absolute; left:0; top:9px; width:20px; height:20px; border-radius:50%; background:var(--sage-2);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='%232E6450' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size:14px; background-position:center; background-repeat:no-repeat; }
/* a sage panel holding a list of what moves across (home "switching") */
.movecard { background:var(--bg); border-radius:24px; padding:28px; display:grid; gap:12px; }
.movecard .mv { background:#fff; border-radius:16px; padding:16px 18px; display:flex; align-items:center; gap:14px; }
.movecard .mv svg { width:22px; height:22px; color:var(--accent-ink); flex:none; }
.movecard .mv b { display:block; font-size:15.5px; color:var(--head-ink); }
.movecard .mv span { display:block; font-size:14px; color:var(--muted); }

/* comparison */
.cmpwrap { margin-top:44px; background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow-x:auto; overflow-y:hidden; }
table.cmp { width:100%; border-collapse:collapse; min-width:600px; font-size:15px; }
.cmp th, .cmp td { padding:14px 20px; text-align:left; border-bottom:1px solid var(--line-soft); }
.cmp thead th { font-size:13px; font-weight:600; color:var(--faint); background:var(--bg); }
.cmp thead th:nth-child(2) { color:var(--accent-ink); }
.cmp tbody tr:last-child td { border-bottom:none; }
.cmp td.y { color:var(--accent-ink); font-weight:800; text-align:center; }
.cmp td.n { color:#B9C2BB; font-weight:700; text-align:center; }
.cmp th:nth-child(2), .cmp th:nth-child(3) { text-align:center; }
.cmp td:nth-child(2) { background:#F6FAF7; }
.cmpnote { color:var(--faint); font-size:13px; margin-top:12px; }

/* pricing */
.billrow { display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; margin:0 0 26px;
  background:var(--bg); border-radius:999px; padding:10px 10px 10px 26px; }
.gift { display:flex; align-items:center; gap:10px; font-size:16px; color:var(--accent-ink); font-weight:600; }
.gift svg { width:22px; height:22px; flex:none; }
.toggle { display:inline-flex; background:#fff; border:1px solid var(--line); border-radius:999px; padding:5px; }
.toggle button { min-height:44px; padding:10px 24px; border:none; border-radius:999px; background:transparent; font:600 15px var(--font); color:var(--muted); cursor:pointer; }
.toggle button.on { background:var(--accent); color:#fff; }
.toggle button:focus-visible { outline:3px solid rgba(58,110,91,.35); }
.cards3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.pc { position:relative; min-width:0; background:#fff; border:1px solid var(--line); border-radius:22px; padding:32px 30px 28px; display:flex; flex-direction:column; }
.pc .ic { display:none; }
.pc .who { font-family:var(--head); font-size:15px; font-weight:700; color:var(--muted); }
.pc .n { font-size:15px; color:var(--faint); margin-top:2px; }
.pc .price { font-family:var(--head); font-size:60px; font-weight:800; line-height:1; color:var(--head-ink); margin:22px 0 6px; display:flex; align-items:baseline; gap:4px; flex-wrap:wrap; }
.pc .price sup { font-size:26px; align-self:flex-start; margin-top:8px; }
.pc .price small { font-family:var(--font); font-size:15px; font-weight:500; color:var(--muted); margin-left:4px; }
.pc ul { list-style:none; padding:0; margin:18px 0 26px; flex:1; }
.pc .btn { justify-content:center; }
.pc.hi { background:var(--accent); color:#fff; border-color:var(--accent); }
.pc.hi .who, .pc.hi .n, .pc.hi .price small { color:#DCEBE2; } .pc.hi .price, .pc.hi li { color:#fff; }
.pc.hi li::before { background-color:rgba(255,255,255,.18);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.pc.hi .btn.primary { background:#fff; color:var(--accent-ink); }
.pc.hi .btn.primary:hover { background:var(--sage); }
.ribbon { position:absolute; top:18px; right:18px; background:rgba(255,255,255,.18); color:#fff; font-size:12.5px; font-weight:600; padding:5px 12px; border-radius:999px; white-space:nowrap; }
.ladder { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:10px; margin-top:28px; }
.rung { background:var(--bg); border-radius:16px; padding:16px 8px; text-align:center; min-width:0; }
.rung b { display:block; font-family:var(--head); font-size:23px; font-weight:800; color:var(--head-ink); }
.rung span { display:block; font-size:12.5px; color:var(--muted); margin-top:4px; }
.rung.hi { background:var(--sage-2); }
.rung.more b { font-size:17px; color:var(--accent-ink); padding-top:5px; }
.lnote { text-align:center; color:var(--muted); font-size:15px; margin-top:18px; }
.faq2 { max-width:820px; margin:36px auto 0; text-align:left; }
.faq2 details { background:#fff; border-radius:18px; padding:6px 24px; margin-bottom:12px; }
.faq2 summary { cursor:pointer; font-family:var(--head); font-weight:800; font-size:18px; padding:16px 0; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; color:var(--head-ink); }
.faq2 summary::-webkit-details-marker { display:none; }
.faq2 summary::after { content:"+"; font-size:26px; color:var(--accent); font-weight:400; flex:none; }
.faq2 details[open] summary::after { content:"–"; }
.faq2 details p { color:var(--muted); padding:0 0 18px; font-size:16px; }

/* trust */
.trust { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:44px; }
.trust div { background:var(--bg); border-radius:18px; padding:22px 22px 20px; }
.trust svg { width:22px; height:22px; color:var(--accent-ink); margin-bottom:12px; }
.trust b { display:block; font-family:var(--head); font-weight:800; font-size:16.5px; margin-bottom:5px; color:var(--head-ink); }
.trust span { color:var(--muted); font-size:14.5px; line-height:1.55; display:block; }

/* closing call to action: a sage panel, not a dark band */
.close { padding:24px 0 88px; }
.close .wrap > .in { background:var(--sage); border-radius:28px; padding:64px 40px; text-align:center; }
.close h2 { font-size:clamp(30px,3.8vw,44px); }
.close p { color:var(--muted); max-width:38em; margin:14px auto 28px; font-size:18px; }
.close .ctas { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.close .mail { margin-top:22px; color:var(--muted); font-size:15px; }
.close .mail a { font-weight:600; }

/* contact */
.cgrid { display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; margin-top:8px; align-items:start; }
.cinfo .item { display:flex; gap:14px; padding:18px 0; border-top:1px solid var(--line); }
.cinfo .item:last-child { border-bottom:1px solid var(--line); }
.cinfo .item svg { width:22px; height:22px; color:var(--accent-ink); flex:none; margin-top:2px; }
.cinfo .item b { display:block; font-size:15px; color:var(--head-ink); }
.cinfo .item span, .cinfo .item a { font-size:15px; color:var(--muted); }
.cinfo .item a.mail { color:var(--accent-ink); font-weight:700; text-decoration:none; font-size:16px; }
.form { background:var(--bg); border-radius:24px; padding:32px; }
.form .row2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.f { display:block; margin-bottom:16px; }
.f span { display:block; font-size:14px; font-weight:600; color:var(--ink); margin-bottom:7px; }
.f input, .f select, .f textarea { width:100%; font:15px var(--font); color:var(--ink); padding:12px 14px; border:1px solid #D9E0D8; border-radius:12px; background:#fff; min-height:48px; }
.f textarea { min-height:130px; resize:vertical; }
.f input:focus, .f select:focus, .f textarea:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px #E0EEE5; }
.form .foot { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:6px; }
.form .note { color:var(--faint); font-size:13px; }
.form .msg { margin-top:14px; font-size:15px; padding:12px 14px; border-radius:12px; display:none; }
.form .msg.ok { display:block; background:var(--teal-soft); color:var(--teal-deep); }
.form .msg.err { display:block; background:var(--red-soft); color:var(--red); }
.form .hp { position:absolute; left:-9999px; }
.thanks { display:none; text-align:center; padding:30px 10px; }
.thanks .tick { width:60px; height:60px; border-radius:50%; background:var(--sage-2); color:var(--accent-ink); display:flex; align-items:center; justify-content:center; margin:0 auto 16px; }
.thanks h3 { font-size:22px; margin-bottom:8px; }
.thanks p { color:var(--muted); }

/* prose (privacy) */
.prose { max-width:760px; }
.prose h2 { font-size:24px; margin:38px 0 10px; }
.prose p, .prose li { color:var(--muted); font-size:16.5px; }
.prose p { margin:0 0 12px; }
.prose ul { padding-left:22px; margin:0 0 12px; }
.prose ol.gsteps { padding-left:24px; margin:0 0 14px; }
.prose ol.gsteps li { margin:9px 0; padding-left:4px; }
.prose ol.gsteps li::marker { color:var(--accent-ink); font-weight:700; }
.prose li { margin:6px 0; }
.prose .updated { color:var(--faint); font-size:13.5px; }
.prose .updated a { color:var(--accent-ink); }
.prose a { color:var(--accent-ink); font-weight:600; }
.prose h2 { scroll-margin-top:90px; }
.callout { background:#FDF6E3; border:1px solid #EBD9A6; border-radius:16px; padding:16px 20px; margin:18px 0 14px; color:#5C4A12; font-size:16px; line-height:1.6; }
.callout b { color:#4A3A08; }
.resp { background:var(--head-ink); color:#E6EEEA; border-radius:18px; padding:22px 24px; margin:0 0 10px; }
.resp h3 { font-family:var(--font); font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:#9CD3BF; margin:0 0 8px; }
.prose .resp p { color:#E6EEEA; margin:0; }

/* footer */
footer { padding:48px 0 40px; border-top:1px solid var(--line-soft); background:#fff; }
.fgrid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:30px; }
footer .brand .word { font-size:21px; }
footer p { color:var(--muted); font-size:14px; margin-top:12px; max-width:28em; }
footer h4 { font-size:14px; color:var(--head-ink); margin-bottom:10px; }
footer ul { list-style:none; margin:0; padding:0; }
footer li { margin:8px 0; }
footer li a { color:var(--muted); text-decoration:none; font-size:14.5px; }
footer li a:hover { color:var(--accent-ink); }
.fbot { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:34px; padding-top:20px; border-top:1px solid var(--line-soft); color:var(--faint); font-size:13px; }
.fbot a { color:var(--faint); }

/* ---------- responsive ---------- */
@media (max-width:1100px) {
  .ui .uside { display:none; }
}
@media (max-width:980px) {
  .steps, .grid3 { grid-template-columns:1fr 1fr; }
  .ladder { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .pc { padding:28px 22px 24px; } .pc .price { font-size:50px; }
  .trust { grid-template-columns:1fr 1fr; }
  .split { gap:36px; }
  .fgrid { grid-template-columns:1fr 1fr; }
  .stage { padding:36px 28px 32px; }
}
@media (max-width:820px) {
  .nav, .head-cta .signin { display:none; }
  .burger { display:flex; }
  .head-cta { margin-left:0; }
  .site-head.open .nav { display:flex; position:absolute; left:0; right:0; top:74px; background:#fff; border-bottom:1px solid var(--line);
    flex-direction:column; align-items:stretch; padding:10px 16px 16px; gap:2px; box-shadow:var(--shadow-sm); }
  .site-head.open .nav a { padding:12px 10px; font-size:16px; border-radius:10px; }
  .site-head.open .nav a.mob { display:block; border-top:1px solid var(--line-soft); margin-top:6px; padding-top:14px; }
  .lede { padding:52px 0 36px; }
  .lede .grid, .shead { grid-template-columns:minmax(0,1fr); gap:20px; }
  .split, .split.flip { grid-template-columns:minmax(0,1fr); }
  .split.flip .copy { order:0; }
  .cgrid { grid-template-columns:minmax(0,1fr); gap:28px; }
  section { padding:60px 0; }
  .cards3 { grid-template-columns:minmax(0,1fr); }
  .devices { gap:24px; }
  .ipad { flex:1 1 100%; max-width:340px; margin:0 auto; }
  .app-body { grid-template-columns:minmax(0,1fr); }
  .app-side { display:none; }
  .app-kpis, .ui .ukpis { grid-template-columns:1fr 1fr; }
  .app-cards { grid-template-columns:minmax(0,1fr); }
  .app { font-size:12px; }
  .mac .ui { min-height:0; }
}
@media (max-width:560px) {
  .steps, .grid3, .trust, .fgrid { grid-template-columns:1fr; }
  .form .row2 { grid-template-columns:1fr; }
  .form { padding:22px 18px; }
  .lede .ctas .btn, .close .ctas .btn { width:100%; }
  .wrap { padding:0 18px; }
  .stage { padding:20px 14px 22px; border-radius:22px; }
  .panel { padding:12px; }
  .mac .scr { padding:7px 7px 9px; border-radius:12px 12px 3px 3px; }
  .ui .umain { padding:12px; }
  .ui .r { grid-template-columns:1.25fr .85fr 1.1fr; } .ui .r > :nth-child(2) { display:none; }
  .app .tbl td { white-space:normal; } .app .claimbox { min-width:0; } .app .tbl .pill { white-space:normal; } .tbl td.wrap { min-width:0; }
  .app .tbl th, .app .tbl td { padding:7px 6px; } .app .tbl th:first-child, .app .tbl td:first-child { padding-left:10px; }
  .ui.tab .r { grid-template-columns:minmax(54px,.7fr) 1.3fr minmax(84px,1.1fr); } .ui.tab .r > :nth-child(2) { display:block; }
  .tbl td, .tbl th { padding:7px 9px; }
  .kpi .v { font-size:17px; }
  .ladder { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .billrow { border-radius:20px; padding:16px; }
  .toggle button { padding:9px 18px; }
  .close .wrap > .in { padding:40px 20px; border-radius:22px; }
}

/* clinical mocks (features page): notes session, letter, patient phone */
.mk-head { display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--line); border-left:4px solid #5FB3D3; border-radius:12px; padding:10px 12px; }
.mk-head b { display:block; font-family:var(--head); font-weight:800; font-size:14px; color:var(--head-ink); }
.mk-head span { font-size:11px; color:var(--faint); }
.mk-head > div:nth-child(2) { flex:1; min-width:0; }
.mk-head .pill { flex:none; }
.mk-av { width:32px; height:32px; border-radius:50%; background:var(--sage-2); color:var(--accent-ink); font-weight:700; font-size:12px; display:flex; align-items:center; justify-content:center; flex:none; }
.mk-dx { font-size:11px; color:var(--muted); margin:8px 2px; line-height:1.45; }
.mk-rec { display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:8px 10px; }
.mk-clock { font-family:var(--head); font-weight:800; font-size:18px; font-variant-numeric:tabular-nums; }
.mk-live { color:var(--red); font-size:11px; font-weight:600; flex:1; }
.mk-btn, .mk-go { background:var(--accent); color:#fff; border-radius:999px; padding:5px 12px; font-size:11px; font-weight:600; white-space:nowrap; }
.mk-note { background:#fff; border:1px solid var(--line); border-radius:12px; padding:10px 12px; margin-top:8px; }
.mk-note h5 { font-size:10.5px; letter-spacing:.04em; color:#1F6FB8; margin:6px 0 2px; border-bottom:1px solid #E3ECF5; padding-bottom:2px; }
.mk-note h5:first-child { margin-top:0; }
.mk-note p { font-size:11.5px; color:var(--ink); line-height:1.45; }
.mk-foot { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:10px; font-size:11px; color:var(--faint); }
.mk-paper { background:#fff; border:1px solid var(--line); border-radius:8px; padding:14px 16px; font-size:11px; line-height:1.5; box-shadow:0 1px 0 rgba(0,0,0,.03); }
.mk-paper p { margin:8px 0 0; color:var(--ink); font-size:11px; line-height:1.5; }
.mk-lh { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:6px 12px; padding-bottom:10px; position:relative; }
.mk-lh::after { content:""; position:absolute; left:0; right:0; bottom:0; height:4px; border-radius:2px; background:linear-gradient(90deg,var(--accent) 0 38%,#9CC7B4 38% 100%); }
.mk-logo { display:flex; align-items:center; gap:9px; min-width:0; }
.mk-logo .seal { width:34px; height:34px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; flex:none; }
.mk-logo .seal svg { width:20px; height:20px; }
.mk-logo b { display:block; white-space:nowrap; font-family:var(--head); font-weight:800; font-size:15px; line-height:1.05; color:var(--head-ink); letter-spacing:-.01em; }
.mk-logo small { display:block; white-space:nowrap; font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-ink); font-weight:700; margin-top:3px; }
.mk-lh .addr { font-size:9.5px; line-height:1.45; color:var(--muted); text-align:right; margin-left:auto; }
.mk-meta, .mk-sig { color:var(--muted) !important; }
.mk-stage { background:var(--bg); border-radius:24px; padding:34px 20px; display:flex; justify-content:center; }
.tint .mk-stage { background:#fff; }
.mk-phone { width:270px; max-width:100%; background:#2a2c2b; border-radius:36px; padding:11px; box-shadow:var(--shadow); }
.mk-scr { background:#FAFAF7; border-radius:27px; padding:18px 16px 16px; font-size:11.5px; }
.mk-ph { text-align:center; margin-bottom:12px; }
.mk-ph b { display:block; font-family:var(--head); font-weight:800; font-size:15px; color:var(--head-ink); }
.mk-ph span { color:var(--faint); font-size:11px; }
.mk-f { margin-bottom:9px; }
.mk-f label { display:block; font-size:10.5px; font-weight:600; color:var(--muted); margin-bottom:3px; }
.mk-in { background:#fff; border:1px solid var(--line); border-radius:9px; padding:7px 9px; color:var(--ink); }
.mk-in.sel { color:var(--ink); }
.mk-yn { display:inline-flex; gap:4px; margin:0 6px 4px 0; }
.mk-yn span { border:1px solid var(--line); border-radius:999px; padding:2px 9px; font-size:10.5px; background:#fff; }
.mk-yn span.on { background:var(--sage-2); border-color:var(--sage-2); color:var(--accent-ink); font-weight:600; }
.mk-sign { background:#fff; border:1px dashed #C9D3C9; border-radius:9px; height:46px; display:flex; align-items:center; justify-content:center; }
.mk-sign svg { width:150px; height:38px; }
.mk-send { background:var(--accent); color:#fff; border-radius:999px; text-align:center; font-weight:600; padding:9px; margin-top:12px; }
.tbl small.code { display:inline-block; margin-top:2px; font-size:10px; font-weight:700; color:var(--muted); background:var(--bg); border:1px solid var(--line); border-radius:5px; padding:0 5px; }

/* All-revenue card (welcome + features #revenue) — every payer on one card */
.revcard { background:#fff; border:1px solid var(--line); border-radius:24px; padding:26px; box-shadow:var(--shadow-sm); }
.rvhead { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:18px; }
.rvhead b { font-family:var(--head); font-size:18px; color:var(--head-ink); }
.rvseg { display:inline-flex; background:var(--bg); border-radius:999px; padding:3px; }
.rvseg i { font-style:normal; font-size:13px; padding:5px 12px; border-radius:999px; color:var(--muted); }
.rvseg i.on { background:#fff; color:var(--head-ink); font-weight:600; box-shadow:0 1px 3px rgba(38,53,47,.12); }
.rvtot small { display:block; font-size:13px; color:var(--muted); }
.rvtot strong { font-family:var(--head); font-size:40px; color:var(--teal-deep); letter-spacing:-.5px; font-variant-numeric:tabular-nums; }
.rvbar { display:flex; height:14px; border-radius:999px; overflow:hidden; margin:14px 0 16px; background:var(--bg); }
.rvbar i, .revcard .dot { display:block; }
.rvbar .acc, .revcard .dot.acc { background:#0F9488; }
.rvbar .pt, .revcard .dot.pt { background:#4371B1; }
.rvbar .emp, .revcard .dot.emp { background:#C98A1B; }
.rvleg { display:grid; gap:8px; }
.rvleg div { display:flex; align-items:center; gap:10px; font-size:14.5px; color:var(--ink); }
.rvleg b, .rvorow b, .rvohead b { margin-left:auto; font-variant-numeric:tabular-nums; }
.revcard .dot { width:10px; height:10px; border-radius:3px; flex:none; }
.rvowe { margin-top:20px; background:var(--red-soft); border-radius:16px; padding:14px 16px; display:grid; gap:6px; }
.rvohead { display:flex; font-weight:600; color:var(--red); font-size:15px; }
.rvorow { display:flex; font-size:14px; color:var(--ink); }
@media (max-width:560px) { .revcard { padding:20px; } .rvtot strong { font-size:32px; } }

/* Product tour (welcome #tour): one video, a title card before each section */
.tour { scroll-margin-top:84px; padding:64px 0 56px; }
.tour > .wrap > .kicker, .tour > .wrap > h2 { text-align:center; }
.tour h2 { margin:6px 0 10px; }
.tour .g { color:var(--accent); }
.tour .tsub .g { font-weight:600; }
.tour .tsub { max-width:680px; margin:0 auto 22px; color:var(--muted); text-align:center; }
.tour .tsub.tend { margin:24px auto 0; }
.tvid { border-radius:18px; overflow:hidden; border:1px solid var(--line-soft); box-shadow:0 18px 50px rgba(20,40,35,.14); background:#0B3D37; aspect-ratio:16/9; max-width:1040px; margin:0 auto; }
.tvid video { display:block; width:100%; height:100%; }