/* THE WORD FOR ALL THE WORLD: the design tokens, and nothing else.
 *
 * Brand system v8.0, messaging v2.0, updated 2026-08-25.
 * GENERATED by tools/build_ai.py from the Brand Guide. Do not edit by hand.
 *
 * Custom properties only, so this can be dropped under an existing stylesheet
 * without changing how anything renders. For the components as well, link
 * brand.css instead: it carries these same tokens and the component layer.
 */

:root {
  /* Palette */
  --midnight: #0B1A2D;
  --word-blue: #023D6F;
  --parchment: #F7F3EC;
  --flame: #F85842;
  --ember: #C13A24;
  --white: #FFFFFF;

  /* Neutrals, derived from Midnight and Parchment */
  --ink: #0B1A2D;
  --ink-muted: rgba(11,26,45,.80);
  --ink-soft: rgba(11,26,45,.60);
  --ink-faint: rgba(11,26,45,.38);
  --rule: rgba(11,26,45,.18);
  --rule-soft: rgba(11,26,45,.10);
  --wash: rgba(11,26,45,.05);
  --ink-reversed: #F7F3EC;
  --ink-reversed-muted: rgba(247,243,236,.75);
  --ink-reversed-soft: rgba(247,243,236,.55);
  --ink-reversed-faint: rgba(247,243,236,.38);
  --rule-light: rgba(247,243,236,.22);
  --wash-light: rgba(247,243,236,.08);

  /* Type stacks */
  --serif-display: 'DM Serif Display', Georgia, 'Times New Roman', serif;
  --serif-text: 'DM Serif Text', Georgia, 'Times New Roman', serif;
  --sans: 'DM Sans', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* Type scale */
  --text-label: 12px;
  --leading-label: 1.4;
  --text-caption: 13px;
  --leading-caption: 1.6;
  --text-body-small: 15px;
  --leading-body-small: 1.65;
  --text-body: 17px;
  --leading-body: 1.7;
  --text-body-large: 19px;
  --leading-body-large: 1.65;
  --text-title-small: 22px;
  --leading-title-small: 1.35;
  --text-title: 28px;
  --leading-title: 1.25;
  --text-title-large: 34px;
  --leading-title-large: 1.18;
  --text-display-small: 40px;
  --leading-display-small: 1.12;
  --text-display: 52px;
  --leading-display: 1.08;
  --text-display-large: 72px;
  --leading-display-large: 1.04;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* Radius */
  --radius-button: 3px;
  --radius-card: 4px;
  --radius-frame: 6px;

  /* Elevation */
  --elevation-flat: none;
  --elevation-raised: 0 2px 6px rgba(11,26,45,.06);
  --elevation-lifted: 0 10px 30px rgba(11,26,45,.10);
  --elevation-overlay: 0 24px 60px rgba(11,26,45,.18);

  /* Motion */
  --duration-fast: 120ms;
  --duration-base: 150ms;
  --duration-slow: 300ms;
  --easing: cubic-bezier(.2,.6,.2,1);

  /* Breakpoints, for scripts and tooling: CSS media queries cannot read a variable */
  --breakpoint-email: 600px;
  --breakpoint-page: 720px;
  --breakpoint-wide: 1080px;

  /* States */
  --button-hover: #A62F1B;
  --success-state: #5FAD56;
  --error-state: #8C1D13;
  --warning-state: #8A5B12;
  --success-on-dark: #7FC177;
  --error-on-dark: #F0968A;
  --warning-on-dark: #E0B25C;
  --surface-on-dark: #172537;
  --accent-on-dark: #F85842;

  /* Outcomes */
  --outcome-ministered-light: #005F5E;
  --outcome-ministered-dark: #00DDDB;
  --outcome-salvation-light: #007D4C;
  --outcome-salvation-dark: #00C479;
  --outcome-healing-light: #3B4100;
  --outcome-healing-dark: #B2BE2C;
  --outcome-baptism-water-light: #0070BD;
  --outcome-baptism-water-dark: #9CC3FF;
  --outcome-baptism-spirit-light: #4C3DAF;
  --outcome-baptism-spirit-dark: #A98FFF;
  --outcome-raised-light: #860048;
  --outcome-raised-dark: #FF83B2;

  /* Progression */
  --progression-1-light: #F8E4D7;
  --progression-1-dark: #5C412F;
  --progression-2-light: #FAD5BF;
  --progression-2-dark: #6D462F;
  --progression-3-light: #FBC6A9;
  --progression-3-dark: #7F4B2F;
  --progression-4-light: #FBB694;
  --progression-4-dark: #924F30;
  --progression-5-light: #FBA680;
  --progression-5-dark: #A55231;
  --progression-6-light: #FB956E;
  --progression-6-dark: #B95534;
  --progression-7-light: #FA825E;
  --progression-7-dark: #CD5737;
  --progression-8-light: #F96E4F;
  --progression-8-dark: #E2583C;
  --progression-9-light: #F85842;
  --progression-9-dark: #F85842;
}
