/* ==========================================================================
   CEICOTOL — Variables de diseño (design tokens)
   NOTA: El verde institucional parte del valor usado actualmente por el sitio.
   Debe validarse contra el Manual de Identidad Visual vigente del SENA antes
   de publicar en producción. Centralizar aquí cualquier ajuste de color.
   ========================================================================== */

:root {
  /* Color — marca */
  --color-brand: #138f2d;
  --color-brand-dark: #0f7a25;
  --color-brand-soft: #eaf6ed;
  --color-brand-border: #c9e6d1;

  /* Color — superficies y texto */
  --color-bg: #ffffff;
  --color-surface: #f5f7f6;
  --color-surface-dark: #283139;
  --color-border: #dfe4e1;
  --color-text: #20272d;
  --color-text-muted: #5f6870;
  --color-text-inverse: #ffffff;

  /* Color — estados */
  --color-success: #138f2d;
  --color-warning: #8a5a00;
  --color-danger: #b3261e;
  --color-focus: #0b5ed7;

  /* Tipografía */
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-heading: var(--font-body);

  --fs-xs: 0.8125rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: 2.25rem;
  --fs-4xl: 3rem;

  --lh-tight: 1.15;
  --lh-base: 1.6;

  /* Espaciado */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-8: 3rem;
  --space-10: 4rem;
  --space-12: 5rem;

  /* Radios */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;

  /* Sombras */
  --shadow-sm: 0 1px 2px rgba(16, 24, 20, 0.06);
  --shadow-card: 0 6px 18px rgba(20, 35, 28, 0.08);
  --shadow-float: 0 8px 22px rgba(16, 24, 20, 0.18);

  /* Layout y movimiento */
  --container-max: 1200px;
  --header-height: 76px;
  --transition-fast: 120ms ease;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0ms;
  }

  html {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}