/*
  TrikTraks site theme tokens.
  CSS custom properties for the marketing/site pages (Index, product pages, etc).
  Add new colors here instead of hardcoding hex/rgba values in page-level <style> blocks.
*/
:root {
    /* --- RGB triplets (for use inside rgba(var(--tt-x-rgb), alpha)) --- */
    --tt-ink-rgb: 15, 23, 42;           /* #0f172a slate-900 */
    --tt-slate-rgb: 148, 163, 184;      /* #94a3b8 slate-400 */
    --tt-border-rgb: 226, 232, 240;     /* #e2e8f0 slate-200 */
    --tt-blue-rgb: 59, 130, 246;        /* #3b82f6 blue-500 */
    --tt-blue-strong-rgb: 37, 99, 235;  /* #2563eb blue-600 */
    --tt-sky-rgb: 56, 189, 248;         /* #38bdf8 sky-400 */
    --tt-sky-soft-rgb: 147, 197, 253;   /* #93c5fd sky-300 */
    --tt-accent-glow-rgb: 96, 165, 250; /* #60a5fa blue-400 */
    --tt-shadow-deep-rgb: 8, 15, 28;    /* near-black navy shadow */
    --tt-white-rgb: 255, 255, 255;
    --tt-slate-50-rgb: 248, 250, 252;   /* #f8fafc slate-50 */

    /* --- Text --- */
    --tt-color-text: #334155;
    --tt-color-heading: #0f172a;
    --tt-color-body: #64748b;
    --tt-color-label: #94a3b8;
    --tt-color-on-dark: #ffffff;
    --tt-color-on-dark-muted: rgba(226, 232, 240, 0.86);

    /* --- Borders / surfaces --- */
    --tt-color-border: #cbd5e1;
    --tt-color-surface: #ffffff;
    --tt-color-surface-tint: #f8fbff;
    --tt-color-tint-blue: #eef6ff;
    --tt-color-accent-blue-soft: #eff6ff;
    --tt-color-page-bg-start: #f5f8fc;
    --tt-color-page-bg-end: #edf2f7;
    --tt-color-hero-stage-start: #edf5ff;
    --tt-color-hero-stage-end: #dcecff;

    /* --- Brand / navy scale (buttons, dark panels, gradients) --- */
    --tt-color-primary: #153b66;
    --tt-color-navy-900: #0f172a;
    --tt-color-navy-800: #152746;
    --tt-color-navy-700: #102b4d;
    --tt-color-navy-600: #17375d;
    --tt-color-navy-950: #0f2743;
    --tt-color-navy-cta-end: #0d3157;

    /* --- Accent scale (links, highlights, glows) --- */
    --tt-color-accent-blue: #3b82f6;
    --tt-color-accent-blue-strong: #2563eb;
    --tt-color-accent-sky: #38bdf8;
    --tt-color-accent-teal: #14b8a6;

    /* --- Capability / category colors (icon + soft background pairs) --- */
    --tt-cat-command: #2563eb;
    --tt-cat-command-soft: var(--tt-color-accent-blue-soft);
    --tt-cat-workflow: #16a34a;
    --tt-cat-workflow-soft: #ecfdf5;
    --tt-cat-intelligence: #7c3aed;
    --tt-cat-intelligence-soft: #f5f3ff;
    --tt-cat-expansion: #ea580c;
    --tt-cat-expansion-soft: #fff7ed;
}