/* THE ONE PLACE for colours and fonts — a COPY of the tokens this site needs from the .app's app/static/theme.css
   (holisticbrain.app, app repo 9dd1613). Never add a colour here that the .app doesn't have; change them together.
   Contrast (WCAG) noted beside each text pairing, as in the .app. */

/* Fonts: local copies (Google Fonts, SIL Open Font License 1.1 — fonts/OFL-Montserrat.txt; Raleway is OFL 1.1 too).
   Variable files: one file carries 400 and 600. Montserrat = headings; Raleway = everything else (400; 600 =
   emphasis only). Raleway carries its own ʻokina (U+02BB). */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("fonts/montserrat-latin-var.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("fonts/raleway-latin-var.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("fonts/raleway-latin-italic-var.woff2") format("woff2"); }

:root {
  /* Brand palette */
  --navy: #08336D;          /* text, header, main buttons */
  --navy-deep: #06223F;
  --logo-turquoise: #1EACBA;/* highlights ONLY — never text on white (2.7:1) */
  --light-turquoise: #4CC6CF;
  --grey-light: #F6F6F6;
  --grey-warm: #F0EFEE;
  --logo-magenta: #C12776;  /* 5.5:1 on white */
  --logo-teal: #1B99AE;     /* 3.4:1 on white — large text / accents only */
  --logo-purple: #842C73;   /* brand purple; 8.1:1 on white */

  /* Roles */
  --color-bg: var(--grey-light);
  --color-surface: var(--grey-warm);
  --color-text: var(--navy);              /* 11.4:1 on bg */
  --color-muted: #4E5D73;                 /* 6.2:1 on bg */
  --color-border: #DDDBD7;
  --color-accent: var(--logo-turquoise);
  --color-header-bg: var(--navy);
  --color-header-text: #FFFFFF;           /* 12.3:1 on navy */
  --color-button-bg: var(--navy);
  --color-button-text: #FFFFFF;           /* 12.3:1 */
  --color-link: var(--navy);
  --color-error: #A33A3A;                 /* 6.0:1 on bg — the forms' red line */
  --color-card-bg: #FFFFFF;

  /* Founder control kit */
  --kit-radius: 16px;
  --kit-target: 44px;                            /* every button and tap target */

  --font-fallback: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-heading: "Montserrat", var(--font-fallback);
  --font-body: "Raleway", "Montserrat", var(--font-fallback);
}