/* ==========================================================================
   Stahltek · Design Tokens
   Fonte única de verdade para cor, tipografia, espaçamento, raio e sombra.
   Base: skill ui-ux-pro-max → estilo "Trust & Authority" (neutros slate),
   com o azul institucional da Stahltek preservado como cor de marca.
   Ver design-system/stahltek-rotuladoras/MASTER.md
   ========================================================================== */

:root{
  /* --- Marca ------------------------------------------------------------ */
  --brand:#2E4C9B;            /* azul do logo Stahltek */
  --brand-deep:#1E356E;
  --brand-soft:#EEF1F9;
  --brand-on:#FFFFFF;
  --silver:#C7D2EC;           /* rotulos sobre o azul  5.3:1 sobre --brand */

  /* --- Neutros (light) -------------------------------------------------- */
  --bg:#FFFFFF;
  --bg-soft:#F8FAFC;
  --bg-inverse:#0F172A;
  --surface:#FFFFFF;
  --surface-2:#F1F5F9;

  --ink:#0F172A;              /* títulos            17.8:1 sobre --bg */
  --ink-2:#334155;            /* corpo              10.4:1 sobre --bg */
  --muted:#5B6472;            /* apoio               5.9:1 sobre --bg */
  --on-inverse:#F8FAFC;
  --on-inverse-muted:#B6C0CE; /*                     8.4:1 sobre --bg-inverse */

  --line:#E2E8F0;
  --line-2:#CBD5E1;
  --line-strong:#94A3B8;

  /* --- Estados ---------------------------------------------------------- */
  --success:#15803D;
  --danger:#DC2626;
  --focus:#2E4C9B;
  --whatsapp:#25D366;
  --whatsapp-deep:#128C4A;

  /* --- Tipografia ------------------------------------------------------- */
  --font-display:'Archivo', 'Segoe UI', system-ui, sans-serif;
  --font-body:'Inter', 'Segoe UI', system-ui, sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, 'Cascadia Mono', monospace;

  --text-xs:0.75rem;     /* 12px: apenas rótulos/mono, nunca corpo */
  --text-sm:0.875rem;    /* 14px */
  --text-base:1rem;      /* 16px: corpo mínimo */
  --text-lg:1.0625rem;   /* 17px */
  --text-xl:1.375rem;    /* 22px */
  --text-2xl:clamp(1.75rem, 3.4vw, 2.625rem);
  --text-3xl:clamp(2.375rem, 5.2vw, 3.875rem);

  --leading-tight:1.1;
  --leading-snug:1.35;
  --leading-normal:1.6;
  --tracking-wide:0.12em;

  /* --- Espaçamento (escala 4pt, densidade "marketing") ------------------ */
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --space-9:96px;
  --section-y:clamp(64px, 8vw, 104px);

  /* --- Forma ------------------------------------------------------------ */
  --radius-sm:4px;
  --radius:6px;
  --radius-lg:10px;
  --radius-full:999px;

  /* --- Elevação --------------------------------------------------------- */
  --shadow-sm:0 1px 2px rgba(15,23,42,.06);
  --shadow:0 4px 14px rgba(15,23,42,.08);
  --shadow-lg:0 12px 32px rgba(15,23,42,.14);

  /* --- Layout ----------------------------------------------------------- */
  --container:1200px;
  --gutter:32px;
  --header-h:69px;
  --tap:44px;                 /* alvo de toque mínimo (WCAG 2.5.5) */

  /* --- Movimento -------------------------------------------------------- */
  --ease:cubic-bezier(.2,.6,.3,1);
  --dur-fast:150ms;
  --dur:220ms;
  --dur-slow:420ms;

  color-scheme:light;
}

@media (max-width:640px){
  :root{ --gutter:20px; --header-h:65px; }
}
