/* ============================================================================
 * Debrix Brand System v2.1 — CSS custom properties (the consumable token layer)
 * Single source of truth: docs/brand/tokens.json. This file mirrors it for the
 * web. Consumed by debrix-site (marketing) and debrix-app/web (portal) so the
 * two match. Do NOT hard-code brand hexes anywhere — reference these vars.
 * See docs/brand/brand-system.md for usage + the logo/iconography rules.
 * ==========================================================================*/
/* Self-hosted fonts (latin woff2) — removes the render-blocking Google Fonts chain (Lighthouse perf).
   URLs are relative to this file → /brand/fonts/. Vendored from @fontsource. */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/inter-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/inter-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/inter-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/inter-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/plus-jakarta-sans-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/plus-jakarta-sans-latin-700-normal.woff2') format('woff2')}

:root {
  /* — Brand (authoritative, from Brand Package v2.1) — */
  --teal: #00C2C7;          /* primary — shield, highlights, links */
  --navy: #0A0F1C;          /* canvas / background */
  --white: #FFFFFF;
  --slate: #2E3A4B;         /* secondary text, dividers */
  --cta: #FF8A00;           /* Accent Orange — ALL call-to-action buttons */
  --cta-hover: #FF9D2B;
  --cta-ink: #1A1205;       /* text on orange CTA */
  --grad-from: #00C2C7;     /* airflow gradient start (illustrations) */
  --grad-to: #007BFF;       /* airflow gradient end */

  /* — Derived UI scale (extended from the brand geometry; Q5: ratify w/ branding agent) — */
  --bg: #0A0F1C;
  --surface: #121829;       /* raised panels/cards */
  --surface-2: #172033;     /* nested surfaces */
  --line: #243049;          /* borders / dividers */
  --text: #FFFFFF;          /* primary text */
  --muted: #A9B6CA;         /* secondary text */
  --muted-2: #73839B;       /* tertiary / captions */
  --success: #15C47E;
  --danger: #F05D5E;
  --warning: #F5A524;

  /* — Typography — */
  --font-body: Inter, Arial, Helvetica, sans-serif;
  --font-display: "Plus Jakarta Sans", Inter, sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;

  /* — Shape / depth / rhythm — */
  --radius: 6px;            /* buttons (Brand Package) */
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;
  --shadow: 0 1px 3px rgba(0, 0, 0, .1);     /* soft (Brand Package) */
  --shadow-lg: 0 18px 50px rgba(0, 0, 0, .35);
  --space: 8px;             /* 8px baseline grid */
}