/* _fonts.css */
/* Self-hosted latin subsets (SIL Open Font License), so no third-party font requests block rendering. */
@font-face {
  font-display: swap;
  font-family: "Bricolage Grotesque";
  font-style: normal;
  font-weight: 700 800;
  src: url("/assets/bricolage-grotesque-latin-78692770.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: Figtree;
  font-style: normal;
  font-weight: 400 700;
  src: url("/assets/figtree-latin-f7c28c58.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  src: url("/assets/ibm-plex-mono-400-latin-d13bb5b4.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  src: url("/assets/ibm-plex-mono-500-latin-deab9c2b.woff2") format("woff2");
}

/* _reset.css */
*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, p, figure, blockquote, dl, dd, ul, ol { margin: 0; }
img, svg { display: block; max-inline-size: 100%; }
input, button, textarea, select { font: inherit; }

/* band.css */
.vl-band { background: var(--yellow); color: var(--navy); }
.vl-band__inner { align-items: center; display: flex; flex-wrap: wrap; gap: 40px; justify-content: space-between; padding-block: var(--space-7); }
.vl-band__copy { flex: 1 1 520px; min-inline-size: 0; }
.vl-band h2 { font: 700 clamp(30px, 4.5vw, 40px)/1.1 var(--font-display); letter-spacing: -0.02em; }
.vl-band p { color: var(--ink-soft); font-size: 19px; margin-block-start: var(--space-3); max-inline-size: 600px; }

/* base.css */
body {
  background: var(--concrete);
  color: var(--navy);
  font: 400 17px/1.55 var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--navy); }

:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }

/* A navy ring disappears on navy, so dark sections use yellow. */
.section--dark :focus-visible, .vl-closing :focus-visible, .vl-footer :focus-visible {
  outline-color: var(--yellow);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
}

.skip-link {
  position: absolute;
  inset-inline-start: var(--space-3);
  inset-block-start: -100px;
  background: var(--yellow);
  padding: var(--space-2) var(--space-3);
  z-index: 10;

  &:focus { inset-block-start: var(--space-3); }
}

.container {
  margin-inline: auto;
  max-inline-size: var(--container);
  padding-inline: var(--space-5);
}

.section { padding-block: var(--space-8); }
.section--white { background: var(--white); border-block: 1px solid var(--border); }
.section--ruled { border-block: 1px solid var(--border); }
.section--dark { background: var(--navy); color: var(--concrete); }

.vl-display-xl, .vl-display-l, .vl-heading-l {
  font-family: var(--font-display);
  letter-spacing: -0.02em;
}
.vl-display-xl { font-size: clamp(40px, 7vw, 64px); font-weight: 800; letter-spacing: -0.025em; line-height: 1.02; }
.vl-display-l { font-size: clamp(34px, 5vw, 48px); font-weight: 800; line-height: 1.05; }
.vl-heading-l { font-size: clamp(30px, 4.5vw, 44px); font-weight: 700; line-height: 1.1; }

.vl-label {
  font: 500 14px/1.4 var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.vl-intro { font-size: 20px; color: var(--ink-soft); max-inline-size: 560px; }

.vl-link { color: var(--navy); font-weight: 600; }

/* broker.css */
.vl-broker { display: flex; flex-wrap: wrap; gap: var(--space-6); }
.vl-broker__copy { flex: 1 1 480px; min-inline-size: 0; }
.vl-broker__copy h2 { margin-block-start: 14px; }
.vl-broker__copy p { color: var(--ink-soft); font-size: 18px; margin-block-start: 20px; }
.vl-broker__actions { display: flex; flex-wrap: wrap; font-weight: 600; gap: 20px; margin-block-start: var(--space-4); }
.vl-broker__actions a { align-items: center; display: inline-flex; min-block-size: var(--tap-target); }
.vl-broker__next { border: 2px dashed var(--line); border-radius: var(--radius-lg); flex: 1 1 380px; min-inline-size: 0; padding: 28px; }
.vl-broker__label { color: var(--slate); font: 400 13px var(--font-mono); }
.vl-broker__next ul { display: flex; flex-direction: column; gap: var(--space-3); list-style: none; margin-block: var(--space-3); padding: 0; }

/* buttons.css */
.vl-btn {
  align-items: center;
  border: 0;
  border-radius: var(--radius-sm);
  cursor: pointer;
  display: inline-flex;
  font: 600 16px/1.2 var(--font-sans);
  justify-content: center;
  min-block-size: var(--tap-target);
  padding: 0 20px;
  text-decoration: none;
}
.vl-btn--primary { background: var(--yellow); color: var(--navy); }
.vl-btn--dark { background: var(--navy); color: var(--white); }
.vl-btn--lg { border-radius: var(--radius-md); font-size: 18px; font-weight: 700; min-block-size: 52px; padding: 0 28px; }

/* cards.css */
.vl-cards { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-block-start: 40px; }
.vl-card {
  background: var(--white);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-lg);
  color: var(--navy);
  display: flex;
  flex: 1 1 260px;
  flex-direction: column;
  gap: var(--space-1);
  padding: 28px;
  text-decoration: none;
}
.vl-card__title { font-size: 20px; font-weight: 700; }
.vl-card__text { color: var(--slate); font-size: 16px; }
.vl-card--feature { background: var(--navy); border-color: var(--navy); flex-basis: 360px; }
.vl-card--feature .vl-card__eyebrow { color: var(--yellow); font: 400 13px var(--font-mono); }
.vl-card--feature .vl-card__title { color: var(--white); font: 700 26px/1.2 var(--font-display); }
.vl-card--feature .vl-card__text { color: var(--on-navy-soft); }
.vl-audiences__heading { margin-block-start: 14px; }

/* checker.css */
.vl-checker { background: var(--white); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-4); }
.vl-checker fieldset { border: 0; display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin: 0; padding: 0; }
.vl-checker legend { font-weight: 600; inline-size: 100%; margin-block-end: var(--space-1); padding: 0; }
.vl-checker label { align-items: center; cursor: pointer; display: inline-flex; gap: var(--space-1); min-block-size: var(--tap-target); }
.vl-checker input { accent-color: var(--navy); block-size: 20px; inline-size: 20px; }
.vl-checker__results > * + * { margin-block-start: var(--space-2); }
.vl-checker__results p { background: var(--yellow-tint); border: 1px solid var(--yellow-edge); padding: var(--space-3) 18px; }

/* closing.css */
.vl-closing { background: var(--navy); color: var(--white); }
.vl-closing__inner { align-items: center; display: flex; flex-wrap: wrap; gap: var(--space-5); justify-content: space-between; padding-block: 88px; }
.vl-closing h2 { max-inline-size: 640px; }
.vl-closing__secondary { color: var(--on-navy-soft); margin-block-start: var(--space-3); }
.vl-closing__secondary a { color: var(--white); }
.vl-closing__actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--space-4); }
.vl-closing__link { align-items: center; color: var(--white); display: inline-flex; font-weight: 600; min-block-size: var(--tap-target); }

/* consent.css */
.vl-consent { background: var(--white); border-block-start: 1px solid var(--border); inset-inline: 0; inset-block-end: 0; position: fixed; z-index: 20; }
.vl-consent__inner { align-items: center; display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); justify-content: space-between; padding-block: var(--space-3); }
.vl-consent p { color: var(--ink-soft); flex: 1 1 420px; font-size: 14px; }
.vl-consent__actions { display: flex; gap: var(--space-2); }
.vl-consent__decline { background: var(--white); border: 1px solid var(--border-strong); color: var(--navy); }

/* Keep the fixed banner from covering the footer while it's showing. */
body:has(.vl-consent:not([hidden])) { padding-block-end: 120px; }

/* cost.css */
.vl-cost { align-items: start; display: flex; flex-wrap: wrap; gap: var(--space-6); }
.vl-cost__answer { flex: 1 1 560px; min-inline-size: 0; }
.vl-cost__lead { font-size: 21px; margin-block-start: 28px; max-inline-size: 640px; }
.vl-cost__card { flex: 0 1 360px; min-inline-size: 0; }
.vl-cost__checked { color: var(--slate); font: 400 13px var(--font-mono); letter-spacing: 0.04em; margin-block-start: var(--space-3); text-transform: uppercase; }


.vl-cost__section { margin-block-start: 80px; }

.vl-cost__split { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.vl-cost__split > * { flex: 1 1 360px; min-inline-size: 0; }
.vl-cost__factors { display: flex; flex-direction: column; gap: 18px; list-style: none; margin-block-start: 20px; padding: 0; }
.vl-cost__boxes { display: flex; flex-direction: column; gap: var(--space-3); }

.vl-box { background: var(--white); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); padding: var(--space-4); }
.vl-box--dashed { background: none; border: 2px dashed var(--line); }
.vl-box h3 { font-size: 20px; }
.vl-box ul, .vl-box p { color: var(--ink-soft); margin-block-start: 10px; }
.vl-box ul { padding-inline-start: 20px; }

.vl-heading-m { font: 700 clamp(28px, 4vw, 36px)/1.15 var(--font-display); letter-spacing: -0.02em; }

/* cover-table.css */
.vl-cover { align-items: flex-start; display: flex; flex-wrap: wrap; gap: 56px; }
.vl-cover__table { flex: 1 1 620px; min-inline-size: 0; }
.vl-cover__table .vl-table-wrap { margin-block-start: var(--space-5); }

.vl-table-wrap { overflow-x: auto; }
.vl-table { background: var(--white); border-collapse: collapse; inline-size: 100%; min-inline-size: 420px; }
.vl-table thead tr { background: var(--navy); color: var(--white); text-align: start; }
.vl-table th, .vl-table td { padding: 14px 18px; }
.vl-table thead th { font-weight: 600; text-align: start; }
.vl-table tbody tr { border-block-end: 1px solid var(--border-soft); }
.vl-table tbody tr:last-child { border-block-end: 0; }
.vl-table tbody th { font-weight: 500; text-align: start; }
.vl-table td, .vl-table .vl-table__num { font-weight: 700; text-align: end; white-space: nowrap; }

.vl-note { background: var(--yellow-tint); border: 1px solid var(--yellow-edge); font-size: 16px; margin-block-start: 20px; padding: var(--space-3) 18px; }
.vl-cover__more { margin-block-start: var(--space-4); }
.vl-table--light thead tr { background: var(--parcel); color: var(--navy); }
.vl-table .vl-table__plain { font-weight: 400; }

/* faq-page.css */
.vl-faq-page { max-inline-size: 880px; }
.vl-faq-page__toc { display: flex; flex-wrap: wrap; gap: 0 var(--space-4); margin-block-start: var(--space-4); }
.vl-faq-page__toc a { align-items: center; display: inline-flex; font-weight: 600; min-block-size: var(--tap-target); }
.vl-faq-page section { margin-block-start: var(--space-7); scroll-margin-block-start: var(--space-4); }

/* faq.css */
.vl-faq { margin-block-start: var(--space-5); }
.vl-faq details { border-block-end: 1px solid var(--border); padding-block: 20px; }
.vl-faq summary {
  cursor: pointer;
  display: flex;
  font-size: 19px;
  font-weight: 600;
  gap: var(--space-3);
  justify-content: space-between;
  list-style: none;

  &::-webkit-details-marker { display: none; }
  &::after { content: "+"; font-weight: 400; }
}
.vl-faq details[open] summary::after { content: "–"; }
.vl-faq details > :not(summary) { color: var(--ink-soft); margin-block-start: var(--space-2); }

.container--narrow { max-inline-size: 880px; }
.vl-faq__more { margin-block-start: var(--space-4); }

/* footer.css */
.vl-footer { background: var(--navy); color: var(--on-navy-muted); font-size: 14px; }
.vl-footer__inner { display: flex; flex-direction: column; gap: var(--space-4); padding-block: 56px; }
.vl-footer__links { display: flex; flex-wrap: wrap; gap: 0 40px; }
.vl-footer__links a { align-items: center; color: var(--concrete); display: inline-flex; min-block-size: var(--tap-target); }
.vl-footer p { max-inline-size: 900px; }

/* form.css */
.vl-plans { background: var(--white); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); margin-block-start: var(--space-6); padding: var(--space-4); scroll-margin-block-start: var(--space-4); }
.vl-plans h2 { margin-block-start: 0; }
.vl-form { display: flex; flex-direction: column; gap: 20px; margin-block-start: 20px; }
.vl-form__field { border: 0; display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; }
.vl-form__field label, .vl-form__field legend { font-weight: 600; padding: 0; }
.vl-form__field label span { color: var(--slate); font-weight: 400; }
.vl-form__field input[type=text], .vl-form__field input[type=email], .vl-form__field input[type=tel] {
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  min-block-size: var(--tap-target);
  padding: 0 var(--space-2);

  &[aria-invalid=true] { border: 2px solid var(--navy); }
}
.vl-form__choices { display: flex; flex-wrap: wrap; gap: 0 var(--space-4); }
.vl-form__choices label { align-items: center; cursor: pointer; display: inline-flex; font-weight: 400; gap: var(--space-1); min-block-size: var(--tap-target); }
.vl-form__choices input { accent-color: var(--navy); block-size: 20px; inline-size: 20px; }
.vl-form .vl-btn { align-self: flex-start; }
.vl-form__privacy { color: var(--slate); font-size: 14px; margin: 0; }
.vl-form__errors { background: var(--yellow-tint); border: 1px solid var(--yellow-edge); padding: var(--space-3) 18px; }
.vl-form__errors ul { margin-block-start: var(--space-1); }
.vl-form__trap { block-size: 1px; inline-size: 1px; overflow: hidden; position: absolute; inset-inline-start: -10000px; }

/* header.css */
.vl-header { background: var(--concrete); border-block-end: 1px solid var(--border); }
.vl-header__inner {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  justify-content: space-between;
  padding-block: 18px;
}

.vl-brand { align-items: center; color: var(--navy); display: flex; gap: 12px; text-decoration: none; }
.vl-brand img { block-size: 34px; inline-size: 34px; }
.vl-brand__name { display: block; font: 800 20px/1.1 var(--font-display); letter-spacing: -0.01em; }
.vl-brand__by { color: var(--slate); display: block; font-size: 13px; line-height: 1.2; }

.vl-nav { align-items: center; display: flex; flex-wrap: wrap; font-size: 16px; font-weight: 500; gap: var(--space-1) 28px; }
.vl-nav a:not(.vl-btn) { align-items: center; color: var(--navy); display: inline-flex; min-block-size: var(--tap-target); text-decoration: none; }

.vl-menu-toggle { display: none; }

@media (max-width: 899px) {
  .vl-menu-toggle {
    align-items: center;
    background: none;
    border: 0;
    color: var(--navy);
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    min-block-size: var(--tap-target);
    min-inline-size: var(--tap-target);
  }
  .vl-menu-toggle__bars,
  .vl-menu-toggle__bars::before,
  .vl-menu-toggle__bars::after { background: currentColor; block-size: 2px; display: block; inline-size: 22px; position: relative; }
  .vl-menu-toggle__bars::before,
  .vl-menu-toggle__bars::after { content: ""; position: absolute; }
  .vl-menu-toggle__bars::before { inset-block-start: -7px; }
  .vl-menu-toggle__bars::after { inset-block-start: 7px; }
  [aria-expanded="true"] .vl-menu-toggle__bars { background: transparent; }
  [aria-expanded="true"] .vl-menu-toggle__bars::before { inset-block-start: 0; transform: rotate(45deg); }
  [aria-expanded="true"] .vl-menu-toggle__bars::after { inset-block-start: 0; transform: rotate(-45deg); }

  .vl-nav { align-items: stretch; display: none; flex-basis: 100%; flex-direction: column; }
  .vl-menu-toggle[aria-expanded="true"] + .vl-nav { display: flex; }
}

/* hero.css */
.vl-hero {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 56px;
  padding-block: var(--space-7) 64px;
}
.vl-hero__copy { flex: 1 1 520px; min-inline-size: 0; }
.vl-hero__copy .vl-label { margin-block-end: 20px; }
.vl-hero__copy .vl-intro { margin-block-start: 28px; }
.vl-hero__actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--space-3); margin-block-start: 36px; }
.vl-hero__actions .vl-link { align-items: center; display: inline-flex; min-block-size: var(--tap-target); }
.vl-hero .vl-trust { margin-block-start: 40px; }

.vl-hero__visual { flex: 1 1 440px; min-inline-size: 0; position: relative; }
.vl-hero__visual .vl-price { inset-block-end: -24px; inset-inline-start: 0; position: absolute; }

@media (max-width: 640px) {
  .vl-hero__visual .vl-price { margin-block-start: calc(-1 * var(--space-6)); position: relative; inset: auto; }
}

/* page.css */
.vl-page { padding-block: 64px var(--space-8); }

.vl-breadcrumbs ol { color: var(--slate); display: flex; flex-wrap: wrap; font-size: 14px; list-style: none; padding: 0; }
.vl-breadcrumbs li + li::before { content: "/"; padding-inline: var(--space-1); }
.vl-breadcrumbs li { align-items: center; display: inline-flex; min-block-size: var(--tap-target); }
.vl-breadcrumbs a { align-items: center; color: var(--slate); display: inline-flex; min-block-size: var(--tap-target); }
.vl-breadcrumbs + * { margin-block-start: var(--space-2); }

.vl-reviewed { color: var(--slate); font: 400 13px var(--font-mono); letter-spacing: 0.04em; margin-block-start: var(--space-6); }

/* price-card.css */
.vl-price {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  inline-size: 360px;
  max-inline-size: 100%;
  padding: 22px var(--space-4);
}
.vl-price__label { color: var(--slate); font-size: 14px; }
.vl-price__amount { align-items: baseline; display: flex; gap: var(--space-1); margin-block-start: var(--space-3); }
.vl-price__amount strong { font: 800 44px/1 var(--font-display); }
.vl-price__amount span { color: var(--slate); font-size: 15px; }
.vl-price__note { color: var(--slate); font-size: 13px; line-height: 1.45; margin-block: 6px var(--space-3); }
.vl-price .vl-btn { inline-size: 100%; }

.vl-toggle { display: flex; gap: var(--space-1); margin-block-start: 14px; }
.vl-toggle button {
  background: var(--white);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  color: var(--navy);
  cursor: pointer;
  flex: 1;
  font: 600 16px var(--font-sans);
  min-block-size: var(--tap-target);

  &[aria-pressed="true"] { background: var(--navy); border-color: var(--navy); color: var(--white); }
}

/* prose.css */
.prose { max-inline-size: 760px; }
.prose > * + * { margin-block-start: var(--space-3); }
.prose h1 { font: 800 clamp(34px, 5vw, 48px)/1.05 var(--font-display); letter-spacing: -0.02em; }
.prose h2 { font: 700 clamp(26px, 3.5vw, 32px)/1.15 var(--font-display); margin-block-start: var(--space-6); }
.prose h3 { font-size: 21px; line-height: 1.3; margin-block-start: var(--space-5); }
.prose ul, .prose ol { padding-inline-start: 1.25em; }
.prose li + li { margin-block-start: var(--space-1); }
.prose table { background: var(--white); border-collapse: collapse; inline-size: 100%; }
.prose th, .prose td { border-block-end: 1px solid var(--border-soft); padding: var(--space-2) var(--space-3); text-align: start; }
.prose thead th { background: var(--navy); color: var(--white); }

/* scenarios.css */
.vl-scenarios { display: flex; flex-wrap: wrap; gap: 20px; margin-block-start: var(--space-6); }
.vl-scenario { border: 1px solid var(--navy-raised); border-radius: var(--radius-lg); flex: 1 1 260px; padding: 28px; }
.vl-scenario__num { color: var(--yellow); font: 400 13px var(--font-mono); }
.vl-scenario h3 { font-size: 21px; line-height: 1.3; margin-block-start: var(--space-2); }
.vl-scenario p:last-child { color: var(--on-navy-muted); margin-block-start: 10px; }

.section--dark .vl-label { color: var(--line); }
.section--dark .vl-heading-l { margin-block-start: 14px; max-inline-size: 760px; }
.section--dark .vl-intro { color: var(--on-navy-soft); font-size: 19px; margin-block-start: 20px; max-inline-size: 680px; }
.vl-problem__close { margin-block-start: var(--space-6); }

/* sidebar.css */
.vl-page__layout { align-items: start; display: flex; flex-wrap: wrap; gap: var(--space-6) var(--space-7); }
.vl-page__layout > .prose { flex: 1 1 560px; min-inline-size: 0; }

.vl-sidebar { display: flex; flex: 0 1 320px; flex-direction: column; gap: var(--space-4); }
@media (max-width: 959px) { .vl-sidebar { flex-basis: 100%; } }
@media (min-width: 960px) { .vl-sidebar { inset-block-start: var(--space-4); position: sticky; } }

.vl-sidebar__nav { background: var(--white); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); padding: var(--space-4); }
.vl-sidebar__label { font: 400 13px var(--font-mono); letter-spacing: 0.04em; text-transform: uppercase; }
.vl-sidebar__label a { color: var(--slate); }
.vl-sidebar__nav ul { list-style: none; margin-block-start: var(--space-1); padding: 0; }
.vl-sidebar__nav li { border-block-start: 1px solid var(--border-soft); }
.vl-sidebar__nav li:first-child { border-block-start: 0; }
.vl-sidebar__nav a, .vl-sidebar__nav [aria-current] {
  align-items: center;
  color: var(--navy);
  display: flex;
  min-block-size: var(--tap-target);
  padding-block: var(--space-1);
  text-decoration: none;
}
.vl-sidebar__nav a:hover { text-decoration: underline; }
.vl-sidebar__nav [aria-current] { font-weight: 700; }
.vl-sidebar__nav [aria-current]::before { background: var(--yellow); block-size: 1.1em; content: ""; inline-size: 4px; margin-inline-end: 10px; }

.vl-sidebar__help { background: var(--yellow-tint); border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); }
.vl-sidebar__title { font: 700 20px/1.2 var(--font-display); }
.vl-sidebar__help a:not(.vl-btn) { color: var(--navy); font-weight: 600; white-space: nowrap; }
.vl-sidebar__help .vl-btn { align-self: start; margin-block-start: var(--space-1); }

/* steps.css */
.vl-steps { display: flex; flex-wrap: wrap; gap: var(--space-5); list-style: none; margin-block-start: 40px; padding: 0; }
.vl-steps li { border-block-start: 2px dashed var(--navy); flex: 1 1 280px; padding-block-start: 20px; }
.vl-steps__n { font: 500 14px var(--font-mono); letter-spacing: 0.06em; }
.vl-steps h3 { font-size: 22px; line-height: 1.3; margin-block-start: var(--space-1); }
.vl-steps p { color: var(--slate); margin-block-start: var(--space-1); }
.vl-steps + .vl-btn { margin-block-start: 40px; }

/* survey-plan.css */
.vl-plan { background: var(--concrete); border: 1px solid var(--line); flex: 1 1 440px; min-inline-size: 0; padding: var(--space-4); }
.vl-plan figcaption { color: var(--ink-soft); font-size: 15px; margin-block-start: 14px; }
.vl-plan text, .vl-lot text { font-family: var(--font-mono); }

/* tokens.css */
/* Values from docs/design-system/tokens.json */
:root {
  --navy: #12223c;
  --navy-raised: #2a3a55;
  --yellow: #fedb59;
  --yellow-tint: #fff5cc;
  --yellow-edge: #e8c33f;
  --concrete: #f6f6f6;
  --white: #ffffff;
  --parcel: #e4e7ec;
  --ink-soft: #2b3447;
  --slate: #545e70;
  --on-navy-soft: #d3d9e3;
  --on-navy-muted: #b8c0ce;
  --line: #c8cdd6;
  --border-strong: #c8ccd4;
  --border: #dcdcdc;
  --border-soft: #e4e4e4;

  --font-display: "Bricolage Grotesque", "Helvetica Neue", sans-serif;
  --font-sans: Figtree, "Helvetica Neue", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 72px;
  --space-8: 96px;

  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --shadow-card: 0 1px 0 #dcdcdc;

  --container: 1240px;
  --tap-target: 44px;

  @media (max-width: 640px) {
    --space-5: 20px;
    --space-7: 48px;
    --space-8: 64px;
  }
}

/* trust.css */
.vl-trust { color: var(--ink-soft); display: flex; flex-wrap: wrap; font-size: 15px; gap: var(--space-2) 28px; list-style: none; padding: 0; }