/* Zorglane — bold color-block system */
:root {
  --bg: #F4F1FF;
  --ink: #111111;
  --ink-soft: #4A4A4A;
  --card: #FFFFFF;
  --line: #E3DEF7;
  --danger: #B3261E;
  --danger-bg: #FBE9E8;
  --warn: #8A5A00;
  --warn-bg: #FDF2DD;

  --spec: #FF7A1A;       --spec-text: #111111; --spec-strong: #C85A00;
  --after: #2E5BFF;      --after-text: #FFFFFF; --after-strong: #2E5BFF;
  --move: #B8F0D0;       --move-text: #0B2E1C; --move-strong: #1B7A4D;
  --dental: #FFB8D9;     --dental-text: #3D0A22; --dental-strong: #C2185B;
  --plan: #FFD23F;       --plan-text: #111111; --plan-strong: #8A6D00;
  --cover: #2EC4B6;      --cover-text: #06302C; --cover-strong: #157A70;

  --nl-red: #AE1C28;
  --nl-white: #FFFFFF;
  --nl-blue: #21468B;
  --nl-orange: #F36C21;

  --font-display: "Anton", "Archivo Black", Impact, sans-serif;
  --font-body: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --radius-card: 26px;
  --radius-pill: 999px;
  --max: 1160px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.6;
}
img { max-width: 100%; height: auto; }

a { color: var(--ink); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--spec-strong); outline-offset: 2px; border-radius: 2px; }

h1, h2, h3 { font-family: var(--font-display); line-height: 1; font-weight: 400; letter-spacing: -0.01em; }

.wrap { max-width: var(--max); margin: 0 auto; padding: 0 1.5rem; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font-body); font-weight: 700; font-size: 1rem;
  background: var(--ink); color: #fff;
  padding: .8rem 1.5rem; border-radius: var(--radius-pill);
  text-decoration: none; border: 0; cursor: pointer; white-space: nowrap;
}
.btn:hover { background: #2b2b2b; color: #fff; text-decoration: none; }

/* Header */
.site-header { background: var(--bg); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; padding-top: 1.4rem; padding-bottom: 1.4rem; flex-wrap: wrap; }
.wordmark {
  font-family: var(--font-display); text-transform: uppercase;
  font-size: 1.6rem; letter-spacing: .01em; color: var(--ink); text-decoration: none;
}
.site-nav { display: flex; align-items: center; gap: 1.6rem; font-family: var(--font-body); font-weight: 600; font-size: 1rem; margin-left: auto; margin-right: 1.6rem; }
.site-nav a { color: var(--ink); text-decoration: none; }
.site-nav a:hover, .site-nav a[aria-current="page"] { text-decoration: underline; }

/* Hero */
.hero { padding: 2rem 0; display: flex; align-items: center; }
.hero-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 2.5rem; align-items: center; width: 100%; }
.hero-text { min-width: 0; }
.display-xl {
  font-family: var(--font-display); text-transform: uppercase;
  font-size: clamp(2.1rem, 4.1vw, 3.75rem); line-height: 1.02; margin: 0 0 1rem;
  overflow-wrap: anywhere; text-wrap: balance;
}
.hero-sub { font-size: 1.15rem; max-width: 46ch; margin: 0 0 1.6rem; color: var(--ink); }
.hero-ctas { display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; margin-bottom: 1.3rem; }
.hero-link { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.trust-line { color: var(--ink-soft); font-size: .88rem; margin: 0; }

/* Hero route illustration */
.hero-route { width: 100%; height: auto; max-height: 70vh; }
.route-ribbon { stroke-linecap: round; }
.route-ribbon-red { stroke: var(--nl-red); stroke-width: 7; }
.route-ribbon-blue { stroke: var(--nl-blue); stroke-width: 7; }
.route-ribbon-white-outline { stroke: var(--ink); stroke-width: 7.5; }
.route-ribbon-white { stroke: var(--nl-white); stroke-width: 7; }
.route-dot { fill: #FFFFFF; stroke: var(--ink); stroke-width: 6; }
.route-dot-1 { fill: var(--nl-orange); }
.route-label { font-family: var(--font-display); text-transform: uppercase; font-size: 26px; fill: var(--ink); }

/* Lanes section (tool mount) */
.lanes-section { background: var(--card); padding: 4.5rem 0 4rem; }

@media (max-width: 900px) {
  .hero { min-height: auto; padding: 2rem 0 2.5rem; }
  .hero-grid { grid-template-columns: 1fr; gap: 2rem; }
  .hero-route { max-width: 280px; margin: 0 auto; }
}
@media (min-width: 901px) {
  .hero { min-height: 85vh; }
}

/* Sections */
.section { padding: 4.5rem 0; }
.section h2 { font-family: var(--font-display); text-transform: uppercase; font-size: clamp(1.6rem, 3vw, 2.1rem); margin: 0 0 .5rem; }
.section .lead { color: var(--ink-soft); margin: 0 0 2rem; max-width: 60ch; font-size: 1.05rem; }
.section-white { background: var(--card); }

/* Wave divider between sections — one consistent shape, reused with swapped fills */
.wave-divider { display: block; line-height: 0; }
.wave-divider svg { display: block; width: 100%; height: 56px; }

.guide-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1.1rem; }
.guide-list li { display: grid; grid-template-columns: 1fr auto; gap: .3rem 2rem; background: var(--card); border-radius: var(--radius-card); padding: 1.6rem 1.8rem; }
.guide-list h3 { font-family: var(--font-body); font-weight: 700; font-size: 1.3rem; margin: 0; }
.guide-list h3 a { color: var(--ink); text-decoration: none; }
.guide-list h3 a:hover { text-decoration: underline; }
.guide-list p { grid-column: 1; margin: 0; color: var(--ink-soft); max-width: 62ch; }
.guide-list .status { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-family: var(--font-body); font-weight: 700; font-size: .9rem; color: var(--ink-soft); }
.guide-list .status.live { color: var(--spec-strong); }

/* ---------- Waitlist section ---------- */
.waitlist-section { background: var(--nl-orange); color: var(--ink); padding: 4.5rem 0; }
.waitlist-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 3rem; align-items: start; }
.waitlist-text h2 { font-family: var(--font-display); text-transform: uppercase; font-size: clamp(1.8rem, 3.4vw, 2.6rem); margin: 0 0 .9rem; }
.waitlist-text > p { font-size: 1.1rem; max-width: 48ch; margin: 0 0 1.8rem; }

.waitlist-form { background: #fff; border-radius: var(--radius-card); padding: 1.8rem 2rem; max-width: 460px; }
.waitlist-form label { display: block; font-weight: 700; margin-bottom: .4rem; }
.waitlist-form input[type="email"] { width: 100%; font: inherit; font-size: 1rem; padding: .8rem 1rem; border: 2px solid var(--ink); border-radius: var(--radius-pill); background: #fff; color: var(--ink); margin-bottom: 1.2rem; }
.waitlist-field { margin-bottom: 1.2rem; }
.waitlist-radio { display: flex; flex-direction: column; gap: .5rem; }
.waitlist-radio label { display: flex; align-items: center; gap: .6rem; font-weight: 500; cursor: pointer; }
.waitlist-consent { display: flex; align-items: flex-start; gap: .6rem; font-size: .95rem; font-weight: 500; cursor: pointer; }
.waitlist-consent input { margin-top: .2rem; }
.waitlist-form .btn { width: 100%; justify-content: center; background: var(--ink); }
.waitlist-foot { font-size: .85rem; color: var(--ink-soft); margin: .9rem 0 0; }
.waitlist-bot-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.waitlist-thanks { background: #fff; border-radius: var(--radius-card); padding: 1.8rem 2rem; max-width: 460px; }
.waitlist-thanks > p:first-child { font-weight: 700; font-size: 1.15rem; margin: 0 0 1.2rem; }
.waitlist-refine-label { font-weight: 700; margin: 0 0 .7rem; }
.waitlist-refine-options { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.waitlist-refine-options label { display: inline-flex; align-items: center; gap: .4rem; border: 2px solid var(--ink); border-radius: var(--radius-pill); padding: .5rem 1rem; font-size: .92rem; font-weight: 600; cursor: pointer; }
.waitlist-share { margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.waitlist-share p { font-weight: 700; margin: 0 0 .7rem; }

.notif-label { font-weight: 700; margin: 0 0 1rem; }

.notif-tabs { display: flex; gap: .5rem; overflow-x: auto; margin-bottom: 1.3rem; -webkit-overflow-scrolling: touch; }
.notif-tab { flex: none; white-space: nowrap; background: #fff; border: 2px solid transparent; border-radius: var(--radius-pill); padding: .55rem 1.1rem; font: inherit; font-weight: 700; font-size: .88rem; color: var(--ink); cursor: pointer; }
.notif-tab[aria-selected="true"] { border-color: var(--ink); }
.notif-tab:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }

.notif-list { display: flex; flex-direction: column; }
.notif-list[hidden] { display: none; }
.notif-item { position: relative; padding-left: 1.4rem; margin-bottom: .9rem; }
.notif-item:last-child { margin-bottom: 0; }
.notif-item::before { content: ""; position: absolute; left: 3px; top: 1.35rem; width: 8px; height: 8px; border-radius: 50%; background: var(--ink); }
.notif-item:not(:last-child)::after { content: ""; position: absolute; left: 6.5px; top: 1.55rem; bottom: -.9rem; width: 1.5px; background: rgba(17,17,17,.3); }
.notif-card { background: #fff; border-radius: 18px; padding: 1rem 1.2rem; box-shadow: 0 6px 16px rgba(0,0,0,.08); }
.notif-top { display: flex; align-items: center; gap: .5rem; margin-bottom: .4rem; }
.notif-icon { width: 20px; height: 20px; flex: none; color: var(--ink); }
.notif-app { font-weight: 700; font-size: .82rem; }
.notif-stage { color: var(--ink-soft); font-size: .78rem; margin-left: auto; font-weight: 700; }
.notif-body { margin: 0; font-size: .95rem; line-height: 1.4; }
.notif-tag { display: inline-block; margin-top: .6rem; background: var(--bg); color: var(--ink); font-weight: 700; font-size: .78rem; padding: .3rem .7rem; border-radius: var(--radius-pill); }

.js-fade { opacity: 0; transform: translateY(14px); transition: opacity .5s ease, transform .5s ease; }
.js-fade.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .js-fade { transition: none; opacity: 1; transform: none; }
}

.waitlist-compact { margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.waitlist-compact p { margin: 0 0 .8rem; color: var(--ink-soft); }

@media (max-width: 860px) {
  .waitlist-grid { grid-template-columns: 1fr; gap: 2rem; }
  .waitlist-grid { display: flex; flex-direction: column; align-items: stretch; }
  .waitlist-notifs { order: 1; min-width: 0; }
  .waitlist-text { order: 2; min-width: 0; }
  .waitlist-form, .waitlist-thanks { max-width: none; }
}

/* Footer */
.site-footer { background: var(--card); padding: 2.5rem 0 3rem; font-size: .95rem; color: var(--ink-soft); }
.site-footer .wrap { display: flex; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.site-footer p { margin: 0; max-width: 60ch; }
.site-footer a { color: var(--ink-soft); }

/* Article (guide / about pages) */
.article-head { padding: 3.5rem 0 2rem; }
.article-head h1 { font-family: var(--font-display); text-transform: uppercase; font-size: clamp(2.2rem, 5vw, 3.6rem); margin: 0 0 1rem; max-width: 20ch; }
.article-head .standfirst { font-size: 1.2rem; color: var(--ink-soft); max-width: 58ch; margin: 0 0 1rem; }
.article-head .meta { font-weight: 700; font-size: .95rem; color: var(--ink-soft); margin: 0; }

.article-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 3.5rem; padding-bottom: 4rem; }
.toc { position: sticky; top: 1.5rem; align-self: start; font-size: .95rem; background: #fff; border-radius: var(--radius-card); padding: 1.3rem 1.4rem; }
.toc p { font-weight: 700; margin: 0 0 .6rem; }
.toc ol { margin: 0; padding-left: 1.2rem; }
.toc li { margin-bottom: .5rem; }
.toc a { color: var(--ink); text-decoration: none; }
.toc a:hover { text-decoration: underline; }

.prose { max-width: 70ch; font-size: 1.125rem; line-height: 1.7; }
.prose h2 { font-family: var(--font-display); text-transform: uppercase; font-size: 1.5rem; margin: 2.8rem 0 .9rem; scroll-margin-top: 1.5rem; }
.prose h2:first-child { margin-top: 0; }
.prose ul, .prose ol { padding-left: 1.3rem; }
.prose li { margin-bottom: .6rem; }
.prose strong { font-weight: 700; }

.table-scroll { overflow-x: auto; margin: 1.5rem 0; }
.prose table { width: 100%; border-collapse: collapse; font-size: 1rem; min-width: 520px; }
.prose th, .prose td { text-align: left; padding: .8rem .9rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.prose th { font-weight: 700; background: #fff; }

.prose .disclaimer { background: #fff; padding: 1.3rem 1.5rem; border-radius: var(--radius-card); margin-top: 3rem; font-size: 1rem; }

/* Facts still to fact-check — remove the class once verified */
mark.verify { background: #FDE49A; color: inherit; padding: 0 .15em; border-radius: 2px; }
mark.verify::after { content: " (to verify)"; font-weight: 700; font-size: .78em; color: #6B4E00; }

/* Inline source citation under a verified fact */
.prose p.src { font-size: .85rem; color: var(--ink-soft); margin: -0.6rem 0 1.1rem; }
.prose p.src a { color: var(--ink-soft); }

/* ---------- Medicine checker ---------- */
.checker { max-width: 720px; margin-bottom: 3rem; }
.checker-card { background: var(--card); border-radius: var(--radius-card); padding: 2rem 2.2rem 2.2rem; }
.checker-card label { display: block; font-weight: 700; margin-bottom: .5rem; }
.checker-card select, .checker-card input[type="text"] {
  display: block; width: 100%; font: inherit; font-size: 1.05rem;
  padding: .85rem 1rem; border-radius: 14px; border: 2px solid var(--line);
  background: var(--bg); color: var(--ink);
}
.checker-card select:focus, .checker-card input[type="text"]:focus { border-color: var(--ink); outline: none; }
.checker-card input:disabled { opacity: .5; cursor: not-allowed; }
.checker-card .help { margin: .5rem 0 0; font-size: .9rem; }

.cc-result { background: var(--bg); border-radius: 18px; padding: 1.4rem 1.6rem; margin-top: 1.2rem; }
.cc-result.cc-nomatch { text-align: left; }
.cc-ingredient { font-size: 1.1rem; margin: 0 0 .3rem; }
.cc-caveat { font-size: .88rem; color: var(--ink-soft); margin: 0 0 1rem; }
.cc-row { font-size: 1rem; padding: .6rem 0; border-top: 1px solid var(--line); }
.cc-row:first-of-type { border-top: 0; }
.cc-row-warn { color: var(--warn); }
.cc-row-danger { color: var(--danger); }
.cc-note { font-size: .92rem; color: var(--ink-soft); margin: 0 0 .6rem; }
.cc-sources { margin-top: .8rem; font-size: .85rem; color: var(--ink-soft); }
.cc-sources summary { cursor: pointer; font-weight: 700; }
.cc-sources ul { margin: .5rem 0 0; padding-left: 1.2rem; }
.cc-sources a { color: var(--ink-soft); }
.cc-feedback { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: .8rem; }
.cc-feedback input { flex: 1 1 200px; font: inherit; padding: .7rem .9rem; border-radius: var(--radius-pill); border: 2px solid var(--ink); }
.cc-feedback-done { color: var(--ink-soft); margin-top: .8rem; }

/* ---------- "How Dutch healthcare works" guide components ---------- */

/* Journey / transit-map overview */
.journey { padding: 1rem 0 3rem; max-width: 70ch; }
.journey-stop { display: flex; gap: 1.1rem; position: relative; padding-bottom: 1.8rem; }
.journey-stop::before { content: ""; position: absolute; left: 11px; top: 26px; bottom: 0; width: 2px; background: var(--line); }
.journey-stop-last::before { display: none; }
.journey-dot { width: 24px; height: 24px; border-radius: 50%; flex: none; border: 4px solid var(--bg); }
.journey-dot-1 { background: var(--plan-strong); }
.journey-dot-2 { background: var(--spec-strong); }
.journey-dot-3 { background: var(--after); }
.journey-dot-4 { background: var(--move-strong); }
.journey-dot-5 { background: var(--dental-strong); }
.journey-stop-body b { font-family: var(--font-display); text-transform: uppercase; font-size: 1.15rem; display: block; }
.journey-stop-body p { margin: .3rem 0 0; color: var(--ink-soft); }

/* Scenario cards */
.scenario-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.1rem; margin: 1.5rem 0 1rem; }
.scenario-card { border-radius: var(--radius-card); padding: 1.5rem 1.6rem; background: var(--card); }
.scenario-q { font-weight: 700; margin: 0 0 .5rem; }
.scenario-a { color: var(--ink-soft); margin: 0 0 1rem; }
.scenario-card a { font-weight: 700; white-space: nowrap; }
.scenario-plan   { background: var(--plan); }
.scenario-spec   { background: var(--spec); }
.scenario-move   { background: var(--move); }
.scenario-meds   { background: var(--card); }
.scenario-dental { background: var(--dental); }
.scenario-preg   { background: var(--card); }
.scenario-child  { background: var(--card); }
.scenario-mental { background: var(--card); }
.scenario-plan .scenario-a, .scenario-spec .scenario-a, .scenario-move .scenario-a, .scenario-dental .scenario-a { color: inherit; opacity: .85; }

/* Expectation vs reality */
.compare-grid { display: flex; flex-direction: column; gap: 1rem; margin: 1.5rem 0 1rem; }
.compare-card { background: var(--card); border-radius: var(--radius-card); padding: 1.4rem 1.7rem; }
.compare-expect { margin: 0 0 .5rem; color: var(--ink-soft); text-decoration: line-through; text-decoration-color: var(--line); }
.compare-reality { margin: 0; font-weight: 600; }

/* Money strip */
.money-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin: 1.5rem 0 1rem; }
.money-item { background: var(--card); border-radius: var(--radius-card); padding: 1.3rem 1.4rem; }
.money-item b { font-family: var(--font-display); font-size: 1.7rem; display: block; }
.money-item span { color: var(--ink-soft); font-size: .92rem; }

/* Expandable "how this works" sections */
.howitworks-item { background: var(--card); border-radius: var(--radius-card); padding: 1.2rem 1.6rem; margin-bottom: 1rem; }
.howitworks-item summary { cursor: pointer; font-family: var(--font-display); text-transform: uppercase; font-size: 1.15rem; padding: .3rem 0; }
.howitworks-item .prose { max-width: none; font-size: 1.0625rem; padding-top: .8rem; }
.howitworks-item .prose p:first-of-type { margin-top: 0; }

.journey, .scenarios, .compare, .money-strip-section, .howitworks { margin-bottom: 2.5rem; }
.journey h2, .scenarios h2, .compare h2, .money-strip-section h2, .howitworks h2 { font-family: var(--font-display); text-transform: uppercase; font-size: 1.5rem; margin: 0 0 .3rem; }

@media (max-width: 680px) {
  .scenario-grid { grid-template-columns: 1fr; }
}

/* ---------- Insurance guide components ---------- */
.outcome-badge { border-radius: var(--radius-card); padding: 1.8rem 2rem; margin: 1.5rem 0; }
.outcome-badge .outcome-label { font-family: var(--font-display); text-transform: uppercase; font-size: 1.6rem; display: block; margin-bottom: .4rem; }
.outcome-badge p { margin: 0; }
.outcome-badge.outcome-likely   { background: var(--spec);  color: var(--spec-text); }
.outcome-badge.outcome-depends  { background: var(--plan);  color: var(--plan-text); }
.outcome-badge.outcome-unlikely { background: var(--move);  color: var(--move-text); }

.svb-box { background: var(--card); border-radius: var(--radius-card); padding: 1.6rem 1.8rem; margin: 1.5rem 0; }
.svb-box p:first-child { margin-top: 0; }

.path-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.1rem; margin: 1.5rem 0 1rem; }
.path-card { background: var(--card); border-radius: var(--radius-card); padding: 1.5rem 1.6rem; }
.path-card h3 { font-family: var(--font-display); text-transform: uppercase; font-size: 1.1rem; margin: 0 0 .6rem; }
.path-card p { margin: 0 0 .6rem; color: var(--ink-soft); }
.path-card p:last-child { margin-bottom: 0; }

@media (max-width: 680px) {
  .path-grid { grid-template-columns: 1fr; }
}

/* Responsive (site) */
@media (max-width: 860px) {
  .two-col { grid-template-columns: 1fr; gap: 1.5rem; }
  .article-layout { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .toc { position: static; }
}
@media (max-width: 520px) {
  .site-nav { gap: 1rem; margin-right: 0; order: 3; width: 100%; }
  .guide-list li { grid-template-columns: 1fr; }
  .guide-list .status { grid-column: 1; grid-row: auto; }
}
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
}

/* ---------- Find your lane tool ---------- */
#lane-tool {
  --tool-accent: var(--ink);
  --tool-accent-strong: var(--ink);
  --tool-fill: transparent;
  --tool-fill-text: var(--ink);
  font-family: var(--font-body);
}
#lane-tool[data-lane="spec"]   { --tool-accent: var(--spec);   --tool-accent-strong: var(--spec-strong);   --tool-fill: var(--spec);   --tool-fill-text: var(--spec-text); }
#lane-tool[data-lane="after"]  { --tool-accent: var(--after);  --tool-accent-strong: var(--after-strong);  --tool-fill: var(--after);  --tool-fill-text: var(--after-text); }
#lane-tool[data-lane="move"]   { --tool-accent: var(--move);   --tool-accent-strong: var(--move-strong);   --tool-fill: var(--move);   --tool-fill-text: var(--move-text); }
#lane-tool[data-lane="dental"] { --tool-accent: var(--dental); --tool-accent-strong: var(--dental-strong); --tool-fill: var(--dental); --tool-fill-text: var(--dental-text); }
#lane-tool[data-lane="plan"]   { --tool-accent: var(--plan);   --tool-accent-strong: var(--plan-strong);   --tool-fill: var(--plan);   --tool-fill-text: var(--plan-text); }
#lane-tool[data-lane="cover"]  { --tool-accent: var(--cover);  --tool-accent-strong: var(--cover-strong);  --tool-fill: var(--cover);  --tool-fill-text: var(--cover-text); }

/* Card shell — every view except the homepage grid */
#lane-tool { background: var(--card); border-radius: var(--radius-card); padding: 2.2rem 2.4rem 2.4rem; }
#lane-tool[data-view="home"] { background: transparent; border-radius: 0; padding: 0; }

.tool-top { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; min-height: 1.6rem; }
#lane-tool[data-view="home"] .tool-top { display: none; }
.linkbtn { background: none; border: 0; padding: 0; font: inherit; font-weight: 700; font-size: .98rem; color: var(--ink); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; display: inline-flex; align-items: center; gap: .35rem; }
.linkbtn.urgent { color: var(--danger); }
#lane-tool h2 { font-family: var(--font-display); text-transform: uppercase; font-size: 1.7rem; margin: 0 0 .4rem; color: var(--ink); }
#lane-tool .help { color: var(--ink-soft); margin: 0 0 1.4rem; font-size: 1rem; }

/* Home: lane grid */
#lane-tool[data-view="home"] h2 { font-size: 1.3rem; margin-bottom: .4rem; }
#lane-tool[data-view="home"] .help { margin-bottom: 1.8rem; }
.lane-btn {
  display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start;
  text-align: left; width: 100%; min-height: 230px;
  background: var(--ink); color: #fff;
  border: 0; border-radius: var(--radius-card);
  padding: 1.75rem; margin: 0; cursor: pointer; font: inherit;
}
.lane-btn i { display: none; }
.lane-btn b { font-family: var(--font-display); text-transform: uppercase; font-size: clamp(1.6rem, 2.6vw, 2.5rem); line-height: 1; display: block; }
.lane-btn small { display: block; font-size: 1rem; margin-top: .7rem; opacity: .9; }
.lane-btn::after { content: "→"; font-size: 1.6rem; margin-top: 1.2rem; }
.lane-btn[data-go="spec"]   { background: var(--spec);   color: var(--spec-text); }
.lane-btn[data-go="after"]  { background: var(--after);  color: var(--after-text); }
.lane-btn[data-go="move"]   { background: var(--move);   color: var(--move-text); }
.lane-btn[data-go="dental"] { background: var(--dental); color: var(--dental-text); }
.lane-btn[data-go="plan"]   { background: var(--plan);   color: var(--plan-text); }
.lane-btn[data-go="cover"]  { background: var(--cover);  color: var(--cover-text); }
.lane-btn:hover { transform: translateY(-2px); }
.lane-btn:focus-visible { outline-offset: 4px; }

.lane-grid-wrap { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; margin-bottom: 2rem; }

.chips-label { color: var(--ink-soft); font-weight: 700; font-size: .95rem; margin: 0 0 .7rem; }
.chip {
  display: inline-flex; gap: .5rem; align-items: center;
  background: transparent; border: 2px solid var(--ink); border-radius: var(--radius-pill);
  padding: .55rem 1.1rem; margin: 0 .5rem .6rem 0; font: inherit; font-weight: 600; font-size: .95rem;
  color: var(--ink); cursor: pointer;
}
.chip:hover { background: var(--ink); color: #fff; }
.chip.urgent { display: none; }
.tool-foot { margin-top: 1.5rem; padding-top: 1.2rem; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: .88rem; }

/* Questions */
.progress-text { color: var(--ink-soft); font-weight: 700; font-size: .9rem; margin: 0 0 .5rem; }
.progress { height: 8px; background: var(--bg); border-radius: var(--radius-pill); margin-bottom: 1.6rem; overflow: hidden; }
.progress div { height: 8px; background: var(--tool-accent-strong); border-radius: var(--radius-pill); transition: width .2s; }
.opt {
  display: block; width: 100%; text-align: left;
  background: var(--bg); border: 2px solid transparent; border-radius: 16px;
  padding: 1.1rem 1.3rem; margin-bottom: .7rem; font: inherit; font-size: 1.08rem; font-weight: 600;
  color: var(--ink); cursor: pointer;
}
.opt:hover { border-color: var(--tool-accent-strong); }
.opt.chosen { border-color: var(--tool-accent-strong); background: var(--tool-fill); color: var(--tool-fill-text); }
.back { margin-top: .8rem; }
.crisis { background: var(--danger-bg); color: var(--danger); border-radius: 16px; padding: .9rem 1.1rem; margin-bottom: 1.4rem; font-size: .97rem; font-weight: 600; }

/* Result */
.result-grid { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 2.5rem; }
.stop { display: flex; gap: .9rem; position: relative; padding-bottom: 1.3rem; }
.stop .line { position: absolute; left: 11px; top: 28px; bottom: 2px; width: 2px; background: var(--line); }
.stop .line.done { background: var(--tool-accent-strong); }
.dot { width: 24px; height: 24px; border-radius: 50%; flex: none; display: flex; align-items: center; justify-content: center; border: 2px solid var(--line); background: var(--card); color: #fff; font-size: .85rem; }
.dot.done { background: var(--tool-accent-strong); border-color: var(--tool-accent-strong); }
.dot.here { border-color: var(--tool-accent-strong); }
.dot.here::after { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--tool-accent-strong); }
.stop b { display: block; font-weight: 700; }
.stop small { display: block; color: var(--ink-soft); font-size: .88rem; }
.here-tag { display: inline-block; background: var(--bg); color: var(--ink); font-weight: 700; font-size: .78rem; padding: .15rem .55rem; border-radius: var(--radius-pill); margin: .2rem 0; }
.steps-label { color: var(--ink-soft); font-weight: 700; font-size: .9rem; margin: 0 0 .4rem; }
.step { display: flex; gap: .9rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.step:last-child { border-bottom: 0; }
.step i { font-size: 1.3rem; color: var(--tool-accent-strong); margin-top: .1rem; }
.step.warn i { color: var(--warn); }
.step.danger i, .step.danger b { color: var(--danger); }
.step.info i { color: var(--after); }
.step b { display: block; font-weight: 700; }
.step p { margin: .2rem 0 0; color: var(--ink-soft); font-size: .98rem; line-height: 1.6; }
.step a { font-size: .93rem; color: var(--ink); }
.unsure-note { background: var(--warn-bg); color: var(--warn); border-radius: 12px; padding: .8rem 1rem; margin: 0 0 .7rem; font-size: .95rem; font-weight: 600; }

.terms { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.terms li { padding: 1.2rem 1.3rem; background: var(--bg); border-radius: var(--radius-card); }
.terms dfn { font-style: normal; font-family: var(--font-display); text-transform: uppercase; font-size: 1.2rem; display: block; margin-bottom: .3rem; }
.terms span { color: var(--ink-soft); font-size: .97rem; }

@media (max-width: 680px) {
  #lane-tool { padding: 1.5rem 1.2rem 1.7rem; }
  .result-grid { grid-template-columns: 1fr; gap: 1.4rem; }
}

/* Lane grid responsiveness */
@media (max-width: 860px) {
  .lane-grid-wrap { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .lane-grid-wrap { grid-template-columns: 1fr; }
  .lane-btn { min-height: 180px; }
}

/* ---------- Moving checklist ---------- */
.btn.secondary { background: #fff; color: var(--ink); border: 2px solid var(--ink); }
.btn.secondary:hover { background: var(--bg); color: var(--ink); }

.checklist-q { margin-bottom: 1.4rem; }
.checklist-q > p.q-label { font-weight: 700; margin: 0 0 .5rem; }
.checklist-q .help { color: var(--ink-soft); font-size: .9rem; margin: 0 0 .5rem; }
.checklist-date input[type="date"] { font: inherit; font-size: 1rem; padding: .7rem 1rem; border: 2px solid var(--ink); border-radius: var(--radius-pill); background: #fff; color: var(--ink); }

.checklist-section { margin-bottom: 2rem; }
.checklist-section h3 { font-family: var(--font-display); text-transform: uppercase; font-size: 1.2rem; margin: 0 0 1rem; }
.checklist-item { display: flex; gap: .8rem; padding: .9rem 0; border-top: 1px solid var(--line); }
.checklist-item:first-child { border-top: 0; }
.checklist-item input[type="checkbox"] { margin-top: .3rem; flex: none; width: 18px; height: 18px; }
.checklist-item label { font-weight: 700; cursor: pointer; display: block; }
.checklist-item p { margin: .2rem 0 0; color: var(--ink-soft); font-size: .92rem; }
.checklist-item.checked label, .checklist-item.checked p { text-decoration: line-through; opacity: .55; }

.checklist-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin: 1.8rem 0; }

.letter-fields { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.letter-fields label { display: block; font-weight: 700; margin-bottom: .3rem; font-size: .9rem; }
.letter-fields input { font: inherit; font-size: .95rem; padding: .6rem .9rem; border: 2px solid var(--ink); border-radius: var(--radius-pill); }
.letter-box textarea { width: 100%; min-height: 340px; font: inherit; font-size: .92rem; line-height: 1.6; padding: 1.2rem; border: 2px solid var(--line); border-radius: 14px; background: #fff; color: var(--ink); }

.checklist-end-waitlist { margin-top: 2.5rem; padding-top: 1.6rem; border-top: 1px solid var(--line); }
.checklist-end-waitlist p { color: var(--ink-soft); margin: 0 0 .8rem; }

@media print {
  .site-header, .site-footer, .checklist-actions, .checklist-q-form, .wave-divider, .checklist-end-waitlist, .btn { display: none !important; }
  body { background: #fff; }
  .checklist-result, .letter-box { background: #fff; }
}
