/*
 * Design tokens — CETA
 * Colores puente desde la identidad visual histórica de la marca
 * (icono verde + wordmark teal del logo), reescalados a un sistema
 * de diseño 2026 con escalas completas para estados hover/focus/fondos.
 */
:root {
  /* Marca — teal (color principal histórico #007D89) */
  --ceta-teal-900: #003f45;
  --ceta-teal-800: #00565f;
  --ceta-teal-700: #006a75;
  --ceta-teal-600: #007d89; /* base histórica */
  --ceta-teal-500: #0f97a3;
  --ceta-teal-100: #e2f3f5;
  --ceta-teal-50:  #f2fafb;

  /* Marca — verde (icono del logo) */
  --ceta-green-700: #4d8a0a;
  --ceta-green-600: #6cb412;
  --ceta-green-500: #8fd302; /* base histórica B6DF09 reescalada */
  --ceta-green-100: #eef8dc;

  /* Acento cálido (histórico #DCA224) */
  --ceta-amber-600: #b9791a;
  --ceta-amber-500: #dca224;
  --ceta-amber-100: #fbf0dc;

  /* Neutros */
  --ceta-ink:        #10221f;
  --ceta-ink-muted:  #4c5c59;
  --ceta-ink-subtle: #6d7b78;
  --ceta-border:     #dde5e3;
  --ceta-surface:    #ffffff;
  --ceta-surface-2:  #f6f9f8;

  /* Semántico */
  --color-primary:      var(--ceta-teal-600);
  --color-primary-dark: var(--ceta-teal-800);
  --color-primary-light:var(--ceta-teal-100);
  --color-accent:       var(--ceta-green-500);
  --color-accent-dark:  var(--ceta-green-700);
  --color-warning:      var(--ceta-amber-500);
  --color-text:         var(--ceta-ink);
  --color-text-muted:   var(--ceta-ink-muted);
  --color-bg:           var(--ceta-surface);
  --color-bg-alt:       var(--ceta-surface-2);
  --color-border:       var(--ceta-border);

  /* Tipografía */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: Georgia, "Times New Roman", serif; /* guiño al acento serif histórico de .nombre_profe */

  --fs-base: 1rem;
  --fs-sm:   0.875rem;
  --fs-lg:   1.125rem;
  --fs-h1:   clamp(1.9rem, 1.6rem + 1.4vw, 2.75rem);
  --fs-h2:   clamp(1.5rem, 1.3rem + 0.9vw, 2rem);
  --fs-h3:   clamp(1.2rem, 1.1rem + 0.4vw, 1.4rem);
  --lh-base: 1.65;

  /* Espaciado */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.5rem;
  --space-6: 4rem;

  /* Forma / elevación */
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.25rem;
  --shadow-sm: 0 1px 2px rgba(16, 34, 31, 0.06), 0 1px 1px rgba(16, 34, 31, 0.04);
  --shadow-md: 0 8px 24px rgba(16, 34, 31, 0.08);
  --shadow-lg: 0 16px 40px rgba(16, 34, 31, 0.12);

  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
}