/* ============================================================
   PRIME TEAMS — Design Tokens compartidos
   Incluir con <link rel="stylesheet" href="brand.css"> antes
   del bloque <style> local en cada página.
   El :root local puede sobrescribir cualquier variable.
   ============================================================ */

:root {
  /* ── Brand colours ── */
  --color-navy:        #0b2233;
  --color-navy-deep:   #0f172a;
  --color-ice:         #cde5ef;
  --color-ice-light:   #e8f4f9;

  /* ── Neutral palette ── */
  --color-slate-100:   #e2e8f0;
  --color-slate-300:   #cbd5e1;
  --color-slate-400:   #94a3b8;
  --color-slate-500:   #64748b;
  --color-slate-600:   #475569;   /* scroll indicator SVG, caption-role aprox. */
  --color-slate-700:   #334155;
  --color-white:       #ffffff;
  --color-surface:     #f8fafc;

  /* ── App-specific ── */
  --color-link:        #1E80A5;   /* cf-check-text links en formulario */
  --color-claridad:    #1f2937;   /* Slider Claridad — NO usar var() en JS (hex concat ${c}0d) */
  --color-ejecucion:   #0369a1;   /* Slider Ejecución — NO usar var() en JS (hex concat ${c}0d) */
  --color-placeholder-bg: #EAEAEA; /* fondo img-wrapper antes de cargar imagen */

  /* ── Semantic ── */
  --color-error:       #c2410c;
  --color-error-dark:  #b91c1c;
  --color-warning:     #f59e0b;
  --color-amber:       #b45309;
  --color-success:     #047857;

  /* ── Easing ── */
  --ease-out:          cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring:       cubic-bezier(0.16, 1, 0.3, 1);
  --ease-premium:      cubic-bezier(0.16, 1, 0.3, 1);   /* alias de ease-spring */
  --ease-bounce:       cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-smooth:       cubic-bezier(0.22, 0.68, 0, 1.2);
  --ease-scroll:       cubic-bezier(0.15, 0.41, 0.69, 0.94);
  --ease-gentle:       cubic-bezier(0.25, 1, 0.25, 1);

  /* ── Escala tipográfica ── */
  --text-2xs:          0.5rem;       /*  8px — error micro */
  --text-xs:           0.5625rem;    /*  9px — eyebrow ALL CAPS */
  --text-sm:           0.625rem;     /* 10px — micro labels */
  --text-caption:      0.6875rem;    /* 11px — footer, caption, button */
  --text-support:      0.8rem;       /* 12.8px — small body */
  --text-body:         0.875rem;     /* 14px — body, inputs */
  --text-md:           0.9375rem;    /* 15px — body enfatizado */
  --text-base:         1rem;         /* 16px — estándar */
  --text-lg:           1.1rem;       /* 17.6px — UI labels */
  --text-xl:           1.375rem;     /* 22px — títulos */
  --text-2xl:          2.1875rem;    /* 35px — display */
  --text-hero:         5rem;         /* 80px — hero */

  /* ── Tracking (letter-spacing) ── */
  --tracking-tight:    -0.01em;
  --tracking-body:      0.02em;
  --tracking-open:      0.07em;
  --tracking-caps-sm:   0.18em;
  --tracking-caps:      0.30em;
  --tracking-eyebrow:   0.38em;

  /* ── Tipografías ── */
  --font-heading:      'Playfair Display', Georgia, serif;
  --font-body:         'Inter', system-ui, -apple-system, sans-serif;
}