/* ============================================================
   DESIGN TOKENS — BMSC Digital Playbook
   Colores institucionales sin modificar (Lineamientos BMSC-SAMY).
   El verde es SOLO color de acción — nunca fondo dominante.
   ============================================================ */
:root{

  /* ---- Colores institucionales (no modificar) ---- */
  --brand-green:  #386345;   /* acción: botones, links, estado activo */
  --brand-guinda: #6F263D;   /* acento puntual */
  --brand-gold:   #B9975B;   /* acento puntual */
  --brand-warmgray:#D7D2CB;  /* acento neutro puntual */
  --brand-amber:  #FFAD00;   /* alerta / destacado puntual */
  --brand-blue:   #0084D4;   /* acento digital puntual */

  /* ---- Superficie: modo claro, casi todo blanco ---- */
  --surface-0: #FFFFFF;
  --surface-1: #FAFAF8;
  --surface-2: #F4F3F0;
  --border:    #E9E7E2;

  /* ---- Texto ---- */
  --ink-900: #14151A;
  --ink-700: #3A3C42;
  --ink-500: #6B6D74;
  --ink-300: #A2A4AA;

  /* ---- Acción (verde institucional, único uso dominante) ---- */
  --action: var(--brand-green);
  --action-hover: #2C4E37;
  --action-tint: #EAF1EC;

  /* ---- Tipografía ---- */
  --font-display: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-text: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "SF Mono", Menlo, Consolas, monospace;

  --fs-display-xl: clamp(2.8rem, 6vw, 5.6rem);
  --fs-display-l:  clamp(2.2rem, 4vw, 3.6rem);
  --fs-display-m:  clamp(1.6rem, 2.6vw, 2.2rem);
  --fs-body-l: 1.125rem;
  --fs-body: 1rem;
  --fs-body-s: 0.875rem;
  --fs-caption: 0.75rem;

  --lh-tight: 1.05;
  --lh-snug: 1.25;
  --lh-normal: 1.55;

  /* ---- Espaciado (generoso, mucho blanco) ---- */
  --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;
  --space-10: 140px;

  /* ---- Radios / sombras (sutiles) ---- */
  --radius-s: 8px;
  --radius-m: 14px;
  --radius-l: 24px;
  --shadow-soft: 0 1px 2px rgba(20,21,26,.04), 0 8px 24px rgba(20,21,26,.06);
  --shadow-card-hover: 0 4px 10px rgba(20,21,26,.06), 0 18px 40px rgba(20,21,26,.10);

  /* ---- Layout ---- */
  --sidebar-w: 272px;
  --content-max: 1180px;

  --ease: cubic-bezier(.2,.7,.3,1);
}