/* tailored-tec · tokens (ver DESIGN.md) */
:root {
  color-scheme: dark;

  /* Color */
  --bg: #030E1F;
  --surface: #071A33;
  --surface-2: #0B2444;
  --line: #15304F;
  --line-strong: #21456F;
  --ink: #EAF2FF;
  --ink-2: #A9BCD6;
  --ink-3: #7F94B2;
  --navy: #011832;
  --primary: #0070E8;
  --primary-hover: #0064D2;
  --link: #4DA3FF;
  --accent: #00C2FD;
  --brand-blue: #007DFE;
  --success: #2ED3A0;
  --warning: #FFB547;
  --error: #FF7A7A;

  /* Tipografía */
  --font-sans: "Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --fs-mono: 13px;
  --fs-sm: 15px;
  --fs-body: 17px;
  --fs-lead: 20px;
  --fs-h3: 22px;
  --fs-h2: clamp(30px, 2.2rem + 1vw, 44px);
  --fs-h1: clamp(40px, 1.6rem + 4.2vw, 68px);

  /* Espaciado */
  --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;
  --section-y: clamp(72px, 11vw, 136px);
  --content: 1160px;
  --gutter: 16px;

  /* Forma */
  --r-px: 3px;
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --glow: 0 10px 30px -10px rgba(0, 112, 232, 0.55);

  /* Movimiento */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

@media (min-width: 768px) {
  :root { --gutter: 32px; }
}