/* ============================================================
   Data-Trust design tokens (Design 02 · teal-trust)
   Source of truth: designs/02-teal-trust.html
   Loaded BEFORE site.css on every public page.
   These tokens are scoped to the public marketing pages — the
   authenticated app, admin panel and shared header/footer are
   unaffected.
   ============================================================ */

:root {
    /* ---------- Brand (teal) ---------- */
    --color-brand-50:  #f0fdfa;
    --color-brand-100: #ccfbf1;
    --color-brand-200: #99f6e4;
    --color-brand-500: #14b8a6;
    --color-brand-600: #0d9488;   /* primary action colour */
    --color-brand-700: #0f766e;
    --color-brand-900: #134e4a;
    --color-brand-fg:  #ffffff;

    /* ---------- Neutrals (slate) ---------- */
    --color-fg:        #0f172a;   /* slate-900 — body text */
    --color-fg-muted:  #475569;   /* slate-600 — secondary text */
    --color-fg-faint:  #94a3b8;   /* slate-400 — tertiary text */
    --color-bg:        #ffffff;
    --color-surface:   #f8fafc;   /* slate-50 — section bg */
    --color-border:    #e2e8f0;   /* slate-200 */
    --color-border-2:  #cbd5e1;   /* slate-300 */

    /* ---------- Spacing scale ---------- */
    --space-1:  4px;
    --space-2:  8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-6:  24px;
    --space-8:  32px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;

    /* ---------- Radius ---------- */
    --radius-sm:   6px;
    --radius:      10px;
    --radius-lg:   14px;
    --radius-xl:   20px;
    --radius-full: 9999px;

    /* ---------- Shadow ---------- */
    --shadow-sm: 0 1px 2px rgba(15,23,42,.04);
    --shadow:    0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.06);
    --shadow-lg: 0 1px 2px rgba(15,23,42,.04), 0 24px 48px rgba(13,148,136,.12);

    /* ---------- Layout ---------- */
    --header-height: 68px;
    --container-max: 1200px;

    /* ---------- Typography ---------- */
    --font-sans: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-mono: ui-monospace, "JetBrains Mono", Menlo, Consolas, monospace;
}