/* Brand: neutral (public demo build).
   Today's teal and coral system, lifted from src/css/site.css (commit e3db031)
   and given semantic names. Every other brand file carries the same variable names,
   so a brand is swapped by swapping this file and nothing else.
   Contrast ratios (WCAG 2.x) are recorded next to every text pairing.
   This file must stay free of any real client's name, colours or typefaces. */
:root {
  /* raw palette (reference only; components use the semantic tokens below) */
  --palette-1: #0d5c63;   /* teal */
  --palette-2: #0a474d;   /* teal dark */
  --palette-3: #12263a;   /* deep */
  --palette-4: #1b3550;   /* deep 2 */
  --palette-5: #e07a5f;   /* coral */
  --palette-6: #f0957c;   /* coral light */
  --palette-7: #a8482f;   /* coral dark */
  --palette-8: #fde5dd;   /* coral tint */
  --palette-9: #e3f0ef;   /* mist */
  --palette-10: #f7f5ef;  /* cream */

  /* surfaces */
  --color-surface: #ffffff;
  --color-surface-alt: #f7f5ef;          /* cards, asides, path p2 */
  --color-surface-tint: #e3f0ef;         /* path p1, menu hover */
  --color-surface-inverse: #12263a;      /* hero plate, footer, demo bar, path p3 */
  --color-surface-inverse-2: #1b3550;

  /* text on light surfaces */
  --color-text: #1f2328;                 /* 15.80 on surface, 14.49 on surface-alt */
  --color-text-muted: #4f5662;           /* 7.39 on surface, 6.78 on surface-alt, 6.33 on surface-tint */
  --color-heading: #12263a;              /* 15.40 on surface, 13.18 on surface-tint */
  --color-heading-2: #0d5c63;            /* h2: 7.70 on surface */
  --color-link: #0d5c63;                 /* 7.70 on surface, 7.06 on surface-alt */
  --color-link-hover: #12263a;           /* 15.40 on surface */
  --color-kicker: #0d5c63;               /* 6.59 on surface-tint */
  --color-tag-text: #0a474d;             /* 10.39 on surface */

  /* text on inverse surfaces */
  --color-text-on-inverse: #ffffff;      /* 15.40 on surface-inverse */
  --color-text-on-inverse-muted: #c9d6da;/* 10.35 on surface-inverse */
  --color-text-on-inverse-soft: #d5e4e6; /* hero and path p3 body: 11.78 on surface-inverse */

  /* brand and accent */
  --color-brand: #0d5c63;                /* icons, avatar, docs glyph; white on it 7.70 */
  --color-brand-strong: #0a474d;
  --color-accent: #e07a5f;               /* primary button fill */
  --color-accent-hover: #f0957c;
  --color-on-accent: #12263a;            /* 5.22 on accent, 6.81 on accent-hover */
  --color-accent-text: #a8482f;          /* "How to take part" link: 5.30 on surface-alt */
  --color-accent-on-inverse: #f0957c;    /* eyebrows on inverse: 6.81 */
  --color-accent-tint: #fde5dd;          /* :target ring */
  --color-accent-rule: #cc6246;          /* current-page bar, selected-paper rule: 3.89 on surface (was #e07a5f, 2.95, fails 1.4.11) */

  /* lines */
  --color-line: #d9e2e4;
  --color-line-strong: #b9c7ca;

  /* focus */
  --color-focus: #0d5c63;                /* 7.70 on surface */
  --color-focus-on-inverse: #f4b9a8;     /* 9.06 on surface-inverse */

  /* header and navigation */
  --nav-bg: #ffffff;
  --nav-text: #1f2328;                   /* 15.80 */
  --nav-text-current: #0d5c63;           /* 7.70 */
  --nav-current-bar: #cc6246;            /* 3.89 */
  --nav-hover-bar: #b9c7ca;
  --nav-focus: #0d5c63;
  --nav-border: #d9e2e4;
  --demo-bar-bg: #12263a;
  --demo-bar-text: #c9d6da;              /* 10.35 */
  --demo-tag-bg: #e07a5f;
  --demo-tag-text: #12263a;              /* 5.22 */

  /* footer */
  --footer-bg: #12263a;

  /* hero */
  --hero-bg: linear-gradient(120deg, #12263a, #0d5c63);
  --hero-scrim: linear-gradient(90deg, rgba(18, 38, 58, .55), rgba(18, 38, 58, 0) 70%);
  --hero-art-opacity: .5;
  --hero-plate-bg: #12263a;

  /* illustrations: how uploaded artwork sits on a brand colour */
  --art-bg: #12263a;
  --art-blend: normal;                   /* a brand may set luminosity to recolour art to its own colour */

  /* avatar (initials tile) */
  --avatar-bg: linear-gradient(135deg, #0d5c63, #12263a);
  --avatar-text: #ffffff;                /* 7.70 worst case */

  /* status badges */
  --status-recruiting-bg: #fde5dd;
  --status-recruiting-fg: #973f28;       /* 5.70 */
  --status-progress-bg: #e3f0ef;
  --status-progress-fg: #0a474d;         /* 8.89 */
  --status-completed-bg: #eceef1;
  --status-completed-fg: #4a515c;        /* 6.89 */

  /* notice (unapproved wording) */
  --notice-bg: #fff6e0;
  --notice-border: #e6c56a;
  --notice-text: #4a3b0c;                /* 10.15 */

  /* type */
  /* Source Serif 4 and Source Sans 3 from Google Fonts (brand.json "fonts"),
     so the demo looks the same on every device; fallbacks as before. */
  --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --font-sans: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-heading: var(--font-serif);
  --font-body: var(--font-sans);
  --weight-heading: 400;
  --weight-strong: 700;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1.0625rem;
  --text-md: 1.15rem;
  --text-lg: 1.3rem;
  --text-xl: clamp(1.5rem, 2.6vw, 2rem);
  --text-2xl: clamp(2rem, 4.2vw, 3rem);
  --leading: 1.65;
  --leading-snug: 1.4;
  --leading-tight: 1.2;
  --tracking-caps: .16em;
  --measure: 68ch;
  --measure-lede: 60ch;

  /* spacing (4 px base, 8 px rhythm from step 2 up) */
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --section: clamp(2.5rem, 5vw, 4rem);

  /* shape and depth */
  --radius: 12px;
  --radius-sm: 6px;
  --pill: 999px;
  --shadow: 0 1px 2px rgba(18, 38, 58, .06), 0 8px 24px rgba(18, 38, 58, .08);
  --shadow-hover: 0 2px 4px rgba(18, 38, 58, .08), 0 14px 32px rgba(18, 38, 58, .14);
  --shadow-plate: 0 20px 40px rgba(0, 0, 0, .18);

  /* layout */
  --wrap: 1140px;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --tap: 44px;

  /* logo slot */
  --logo-height: 40px;
  --logo-height-narrow: 34px;
  --logo-clear: 0px;                     /* neutral mark needs no clear space beyond the gap */

  /* motion */
  --duration: .15s;
  --easing: ease;

  /* breakpoints (reference values: custom properties cannot be read inside @media,
     so site.css uses these numbers literally) */
  --bp-narrow: 600px;
  --bp-medium: 820px;
}