/* ════════════════════════════════════════════════════════════════════
   Arkano — tokens.css | fonte ÚNICA de verdade visual
   Esquema: DOUBLE-SPLIT COMPLEMENTAR refinado.
   AZUL TROVÃO dominante (#2563EB/#60A5FA sobre #0F172A) · VIOLETA/LILÁS só
   subtom e sombra · OURO âmbar = faísca ritual pontual · sem verde. | 2026-06-10
   ════════════════════════════════════════════════════════════════════ */
:root {
  /* ── Superfícies (escala mono do azul base #0F172A) ──────────────── */
  --ark-bg:        #0A0F1C;   /* noite de tempestade (mono mais escuro) */
  --ark-bg-2:      #0F172A;   /* base fornecida */
  --ark-surface:   #1A2647;
  --ark-surface-2: #2A3D6E;
  --ark-border:    #2a3a66;
  --ark-border-2:  #3F5A9E;

  /* ── PRINCIPAL: azul trovão energizado (azuis da paleta base) ────── */
  --ark-blue:      #2563EB;   /* azul real — cor principal */
  --ark-blue-deep: #1E3A8A;   /* azul profundo */
  --ark-cyan:      #4d8df7;   /* accent elétrico (nome legado) */
  --ark-cyan-hi:   #60A5FA;   /* relâmpago — azul claro */

  /* ── SUBTONS / sombras (periférico, nunca protagonista) ──────────── */
  --ark-violet:    #7b5cff;
  --ark-lilac:     #9d8bff;
  --ark-shadow:    #1A0F2A;   /* sombra arcana (violeta escuro do análogo) */
  --ark-gold:      #d8b975;   /* faísca ritual (complementar âmbar), pontual */

  /* glows — azul dominante; camada externa do neon com leve violeta = sombra */
  --ark-glow-cyan: 0 0 0 1px rgba(37,99,235,.32), 0 8px 44px -8px rgba(37,99,235,.55);
  --ark-glow-soft: 0 8px 30px -10px rgba(30,58,138,.55);
  --ark-neon:      0 0 6px rgba(96,165,250,.95), 0 0 18px rgba(37,99,235,.70), 0 0 48px rgba(37,99,235,.55);
  --ark-neon-soft: 0 0 10px rgba(37,99,235,.60), 0 0 34px rgba(37,99,235,.42);
  --ark-neon-text: 0 0 8px rgba(150,190,255,.95), 0 0 22px rgba(37,99,235,.70), 0 0 66px rgba(123,92,255,.36);

  /* ── Texto (azul-branco, legível em fundo escuro) ────────────────── */
  --ark-text:      #e6ecfb;
  --ark-text-dim:  #a3acca;
  --ark-text-mut:  #7c86a6;

  /* ── Status ──────────────────────────────────────────────────────── */
  --ark-ok:        #4ade80;
  --ark-warn:      #fbbf24;
  --ark-danger:    #f87171;
  --ark-purple:    #a78bfa;

  /* ── Ritmo / forma ───────────────────────────────────────────────── */
  --ark-radius:    16px;
  --ark-radius-sm: 10px;
  --ark-radius-lg: 24px;
  --ark-gap:       clamp(16px, 3.2vw, 30px);
  --ark-maxw:      1120px;

  /* ── Container + escala de espaçamento (mobile-first) | 2026-06-11 ── */
  --ark-pad-x:        clamp(20px, 5vw, 72px);   /* padding lateral: mobile 20 → desktop 72 */
  --ark-section-y:    clamp(72px, 12vw, 144px); /* seção ↔ seção: 72 mobile → 144 desktop */
  --ark-title-sub:    clamp(12px, 2vw, 20px);   /* título → subtítulo */
  --ark-sub-content:  clamp(32px, 5vw, 56px);   /* subtítulo → conteúdo */
  --ark-card-pad:     clamp(20px, 4vw, 36px);   /* padding interno de card */
  --ark-panel-pad:    clamp(22px, 4.5vw, 42px); /* padding interno de painel grande */

  /* ── Tipografia (blend: editorial+humano+sistema) ────────────────── */
  --ark-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;   /* headlines — serifa com alma */
  --ark-font-body:    'Hanken Grotesk', system-ui, -apple-system, sans-serif;  /* corpo — humanista legível */
  --ark-font-mono:    'JetBrains Mono', ui-monospace, monospace;       /* rótulos de sistema/chips */

  /* ── Motion ──────────────────────────────────────────────────────── */
  --ark-ease:      cubic-bezier(.22, .61, .36, 1);
  --ark-ease-out:  cubic-bezier(.16, 1, .3, 1);
  --ark-dur:       .5s;
}