/* tokens.css — GENERADO DEL DISEÑO (Home Academia Democratica.pdf, artboard 1440).
   design.css y assets/css/modules/*.css solo usan estas variables. */

/* Albert Sans variable (300–700), subset latin: cubre español completo. */
@font-face {
  font-family: 'Albert Sans';
  src: url('../fonts/albert-sans-latin.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Color */
  --color-bg: #ffffff;
  --color-surface: #f5f5f5;
  --color-text: #323232;
  --color-primary: #732f86;          /* morado ADN */
  --color-primary-strong: #5c2570;   /* morado para hover */
  --color-accent: #eae74a;           /* amarillo ADN */
  --color-on-primary: #f1f0f0;       /* texto de navegación sobre morado */
  --color-on-dark: #ffffff;          /* texto sobre morado / fotos */
  --color-ink: #000000;              /* texto sobre amarillo (badge webinar) */
  --color-line: rgb(115 47 134 / .3);
  --color-line-on-primary: rgb(241 240 240 / .2);
  --color-divider: rgb(50 50 50 / .3);        /* separadores de listas y tarjetas */
  --color-divider-on-primary: #3d1b49;        /* separadores sobre morado */
  --color-card-border: #999999;

  /* Tipografía. El diseño usa Area (Adobe Fonts) en navegación y botones
     y Gotham Light en los números: si hay kit de Adobe, apuntar --font-ui. */
  --font-display: 'Albert Sans', system-ui, sans-serif;
  --font-body: 'Albert Sans', system-ui, sans-serif;
  --font-ui: var(--font-body);
  --weight-light: 300;
  --weight-ui: 450;                  /* Albert Sans a 450 ≈ peso visual de Area */
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  --text-xs: .77rem;                 /* badges (12.3px) */
  --text-sm: .875rem;                /* nav del header */
  --text-md: .9375rem;               /* pie de página */
  --text-btn: 1rem;                  /* botones y enlaces con flecha */
  --text-eyebrow: 1.03125rem;        /* antetítulos (16.5px) */
  --text-base: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);         /* 18px */
  --text-lg: clamp(1.125rem, 1rem + 0.5vw, 1.4375rem);         /* 23px: listas, títulos de tarjeta de agenda */
  --text-xl: clamp(1.3rem, 1.1rem + 0.8vw, 1.675rem);          /* 26.8px: títulos de tarjeta, frases destacadas */
  --text-2xl: clamp(2rem, 1.5rem + 1.6vw, 2.9rem);             /* 46px: números */
  --text-h2: clamp(2.25rem, 1.4rem + 3.3vw, 3.88rem);          /* 62.1px: títulos de sección */
  --text-display: clamp(2.25rem, 1.4rem + 3.4vw, 4rem);        /* 64px: título del hero */
  --text-mega: clamp(2.75rem, 1.6rem + 4.6vw, 5.05rem);        /* 80px: CTA final */

  --leading-tight: 1.02;             /* títulos grandes */
  --leading-snug: 1.3;               /* títulos de tarjeta, listas */
  --leading-body: 1.556;             /* 18/28 */
  --tracking-eyebrow: .225em;        /* medido en los antetítulos del PDF */
  --tracking-tight: -.02em;          /* tracking −20 del diseño: hero */
  --tracking-title: -.025em;         /* tracking −25 del diseño: títulos de sección */

  /* Espaciado y forma */
  --space-1: .5rem;  --space-2: 1rem;  --space-3: 1.5rem;
  --space-4: 2.25rem; --space-5: 3rem; --space-6: 4rem; --space-7: 6.5rem;
  --section-y: clamp(3.5rem, 1.5rem + 5vw, 5.25rem);          /* ritmo vertical de secciones (~84px) */
  --radius: .75rem;                  /* tarjetas (12px) */
  --radius-lg: 1.0625rem;            /* bloque comunidad (17px) */
  --radius-pill: 999px;
  --container-max: 80rem;

  /* Botones */
  --btn-h: 3.6875rem;                /* 59px */
  --btn-w: 18.0625rem;               /* 289px */

  /* Header / footer */
  --header-h: 8.75rem;
  --logo-h: 4.15rem;
  --logo-h-sm: 3rem;
  --logo-h-footer: 4.4rem;
  --icon-size: 1.45rem;

  /* Movimiento */
  --ease: cubic-bezier(.22, 1, .36, 1);
  --dur: .6s;
}