/* Shared local design tokens. Font files can be added without changing templates. */
:root {
  --sea: #0d5c74;
  --sea-soft: #e6f2f5;
  --sunset: #f08a4b;
  --sunset-text: #9b4819;
  --olive: #4e672f;
  --olive-soft: #eef1e6;
  --ballot: #6a5aa8;
  --ink: #13222e;
  --secondary: #506270;
  --canvas: #f4f7f8;
  --border: #dfe6ea;
  --body-font: 'Manrope', system-ui, sans-serif;
  --heading-font: 'Unbounded', 'Manrope', system-ui, sans-serif;
}
html { font-family: var(--body-font); color: var(--ink); background: var(--canvas); }
body { font-family: var(--body-font); }
h1, .brand-copy strong, .desktop-brand strong, .ws-brand strong { font-family: var(--heading-font); }
button, input, select, textarea { font: inherit; }
button, input[type='submit'], input[type='button'], select { min-height: 44px; }
input, select, textarea { max-width: 100%; }
img { max-width: 100%; }
:where(h1, h2, h3, p, strong, small, label, a) { overflow-wrap: anywhere; }
:where(a, button, input, textarea, select, summary):focus-visible { outline: 3px solid var(--sea); outline-offset: 3px; }
svg { flex-shrink: 0; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}