/* Voiceflow brand v2 — shared tokens (matches main site) */
:root {
  color-scheme: light;
  --blue: #2D6CDF; --blue-hover: #1F55B8; --blue-wash: #E3ECFB;
  --green: #27BA88; --green-dark: #16805C; --green-wash: #E9F8F1;
  --navy: #0F1C2E; --navy-2: #1B2B40;
  --ink: #17232D; --slate: #4A5866;
  --mist: #F4F7FA; --mist-2: #E6EDF4; --white: #FFFFFF; --line: #E6EBF0;
  --accent: #F28C38; --accent-hover: #E67E2C;
  --radius: 20px; --radius-btn: 999px;
  --font-display: 'Outfit', sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-family: var(--font-body);
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 1.5rem; }
body { margin: 0; color: var(--ink); background: var(--white); font-size: 1rem; line-height: 1.65; }
button, input { font: inherit; }
a { color: var(--blue); text-underline-offset: .2em; }
img { max-width: 100%; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; text-wrap: balance; overflow-wrap: break-word; }
h1 { letter-spacing: -.025em; line-height: 1.05; }
h2 { letter-spacing: -.02em; line-height: 1.15; }
h3 { letter-spacing: -.015em; line-height: 1.3; }
.shell { width: min(80rem, calc(100% - 3rem)); margin-inline: auto; }
.brand { display: inline-flex; align-items: center; flex-shrink: 0; text-decoration: none; }
.brand img { display: block; width: 10.5rem; height: auto; }
.eyebrow { margin: 0 0 .75rem; color: var(--blue); font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 3rem; padding: .75rem 1.4rem; border: 1px solid transparent; border-radius: var(--radius-btn); font-size: .9375rem; font-weight: 600; line-height: 1.4; text-align: center; text-decoration: none; transition: background .15s, border-color .15s; }
.button-primary { color: var(--navy); background: var(--accent); }
.button-primary:hover { color: var(--navy); background: var(--accent-hover); }
.button-secondary { color: var(--ink); background: var(--white); border-color: #C9D3DD; }
.button-secondary:hover { background: var(--mist); border-color: var(--slate); }
.text-link { display: inline-flex; align-items: center; gap: .5rem; font-size: .9375rem; font-weight: 600; text-decoration: none; }
.text-link:hover { text-decoration: underline; }
.skip-link { position: absolute; left: 1rem; top: -8rem; z-index: 30; padding: .7rem 1rem; color: var(--white); background: var(--navy); border-radius: 8px; }
.skip-link:focus { top: 1rem; }
.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; }
@media (max-width: 600px) { .shell { width: calc(100% - 2.5rem); } .brand img { width: 8.25rem; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }
