/* LocalMio base palette. The five named swatches match resources/brand/brand guide.png.
   Supporting ink, surfaces and state colors are implementation tokens, not new brand swatches. */
:root {
  --brand-clear-sky: #4da8e8;
  --brand-alpine-aqua: #bfe7f2;
  --brand-spring-green: #85cf6a;
  --brand-soft-cream: #fff6e5;
  --brand-apricot-glow: #ffc49b;
  --brand-deep-blue: #075674;
  --brand-white: #fffefa;

  --ink: var(--brand-deep-blue);
  --muted: #426a74;
  --cream: var(--brand-soft-cream);
  --aqua: var(--brand-alpine-aqua);
  --sky: var(--brand-clear-sky);
  --green: var(--brand-spring-green);
  --apricot: var(--brand-apricot-glow);
  --white: var(--brand-white);
  --surface-page: var(--brand-white);
  --surface-purpose: color-mix(in srgb, var(--green) 19%, var(--white));
  --surface-plan: color-mix(in srgb, var(--aqua) 65%, var(--white));
  /* Light sky-blue illustration tones, with a small logo-green accent.
     The five brand swatches above stay unchanged. */
  --art-mist: #edf7fc;
  --art-blue-light: #b9e0f6;
  --art-blue: #65b5e8;
  --art-blue-deep: #3897d4;
  --art-light: #fff2d8;
  --art-horizon: #d5ecfb;
  --surface-mission: linear-gradient(90deg, var(--art-mist) 12%, var(--aqua) 100%);
  --surface-participate: var(--cream);
  --surface-final: color-mix(in srgb, var(--sky) 20%, var(--white));
  --surface-header: color-mix(in srgb, var(--white) 97%, transparent);
  --wave-back: var(--art-blue);
  --wave-front: var(--art-blue-deep);
  --wave-base: var(--surface-participate);
  --input-border: #76959c;
  --error: #90332c;
  --shadow-menu: color-mix(in srgb, var(--ink) 4%, transparent);
  --shadow-modal: color-mix(in srgb, var(--ink) 25%, transparent);
  --backdrop: color-mix(in srgb, var(--ink) 44%, transparent);
  --hero-veil: var(--white);
  --ease: cubic-bezier(.16,1,.3,1);
}