/* ===========================================================================
   CTRL Labs — Design Tokens
   --------------------------------------------------------------------------
   Single source of truth for color, type, space, radius, motion.
   =========================================================================== */

:root {
  /* ─── Brand ──────────────────────────────────────────────────────────── */
  --brand-blue:        #1E6FFF;     /* primário, do logo */
  --brand-blue-deep:   #0B47B8;
  --brand-blue-soft:   #4A90FF;
  --brand-blue-tint:   #E8F0FF;

  --accent:            #00FFA3;     /* neon — IA, dados, highlights */
  --accent-deep:       #00C97D;
  --accent-tint:       #E0FFF0;

  /* ─── Neutros — escuros ──────────────────────────────────────────────── */
  --ink:               #0A0E1A;     /* preto-azulado, hero */
  --ink-soft:          #131826;
  --ink-line:          #1F2533;
  --ink-line-strong:   #2C3344;
  --ink-muted:         #8B92A8;
  --ink-muted-soft:    #5A6178;

  /* ─── Neutros — claros ───────────────────────────────────────────────── */
  --paper:             #FAFAF7;     /* off-white quente */
  --paper-soft:        #F4F4EF;
  --paper-deep:        #ECECE5;
  --line:              #E5E5DE;
  --line-strong:       #D1D1C7;
  --muted:             #6B7280;
  --muted-soft:        #9CA3AF;

  /* ─── Tipografia ─────────────────────────────────────────────────────── */
  --font-display: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Scale (modular, 1.25 desktop) */
  --t-xs:    12px;
  --t-sm:    14px;
  --t-base:  16px;
  --t-md:    18px;
  --t-lg:    20px;
  --t-xl:    24px;
  --t-2xl:   30px;
  --t-3xl:   38px;
  --t-4xl:   48px;
  --t-5xl:   64px;
  --t-6xl:   84px;
  --t-7xl:   112px;

  /* ─── Spacing (4px base) ─────────────────────────────────────────────── */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  24px;
  --s-6:  32px;
  --s-7:  48px;
  --s-8:  64px;
  --s-9:  96px;
  --s-10: 128px;
  --s-11: 160px;

  /* ─── Radius ─────────────────────────────────────────────────────────── */
  --r-1: 4px;
  --r-2: 8px;
  --r-3: 12px;
  --r-4: 16px;
  --r-5: 24px;
  --r-full: 999px;

  /* ─── Shadow ─────────────────────────────────────────────────────────── */
  --sh-1: 0 1px 2px rgba(10, 14, 26, 0.05);
  --sh-2: 0 4px 12px rgba(10, 14, 26, 0.06), 0 1px 2px rgba(10, 14, 26, 0.04);
  --sh-3: 0 12px 32px rgba(10, 14, 26, 0.08), 0 2px 6px rgba(10, 14, 26, 0.04);
  --sh-glow: 0 0 0 1px rgba(30, 111, 255, 0.20), 0 8px 24px rgba(30, 111, 255, 0.15);
  --sh-accent: 0 0 0 1px rgba(0, 255, 163, 0.30), 0 8px 24px rgba(0, 255, 163, 0.18);

  /* ─── Motion ─────────────────────────────────────────────────────────── */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-in:  cubic-bezier(0.6, 0.0, 0.8, 0.2);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 140ms;
  --dur:      220ms;
  --dur-slow: 420ms;

  /* ─── Layout ─────────────────────────────────────────────────────────── */
  --container: 1280px;
  --container-tight: 1080px;
  --container-wide: 1440px;
}

/* ─── Tweakable overrides (Home only) ──────────────────────────────────── */
:root[data-primary="blue"]   { --brand-blue: #1E6FFF; --brand-blue-deep: #0B47B8; --brand-blue-soft: #4A90FF; --brand-blue-tint: #E8F0FF; }
:root[data-primary="violet"] { --brand-blue: #6C5BFF; --brand-blue-deep: #4A38D8; --brand-blue-soft: #8E80FF; --brand-blue-tint: #ECE9FF; }
:root[data-primary="orange"] { --brand-blue: #FF6B3D; --brand-blue-deep: #C94A20; --brand-blue-soft: #FF8E6A; --brand-blue-tint: #FFEDE5; }
:root[data-primary="green"]  { --brand-blue: #1FB36A; --brand-blue-deep: #0F7E47; --brand-blue-soft: #4AD08C; --brand-blue-tint: #E3F8EB; }