:root {
    color-scheme: light;

    /* ─── Paleta corporativa C2 Grupo Empresarial ───────── */

    /* Primarios */
    --brand-green:       #A8CF45;   /* PANTONE 2299C — color principal */
    --brand-green-hover: #97bd39;   /* versión oscurecida para hover   */
    --brand-dark:        #5A5B5F;   /* K:80 — texto oscuro / íconos    */

    /* Secundarios (grises corporativos) */
    --gray-60: #87868A;   /* K:60 — texto secundario / muted */
    --gray-20: #D8D9DD;   /* K:20 — bordes suaves / fondos   */

    /* Alias semánticos — usar estos en los componentes */
    --green-600:       var(--brand-green);
    --green-600-hover: var(--brand-green-hover);
    --green-800:       #2a3411;   /* verde muy oscuro para títulos */
    --green-200:       #dbeaa7;
    --mint-100:        #f2f7e6;
    --cream:           #f7faf9;

    /* Neutros */
    --text:        #1c2125;
    --text-subtle: var(--brand-dark);   /* #5A5B5F — K:80  */
    --muted:       var(--gray-60);      /* #87868A — K:60  */
    --border:      var(--gray-20);      /* #D8D9DD — K:20  */
    --shadow:      rgba(16, 36, 27, 0.12);

    /* Superficies */
    --surface-page:  #f8fbf9;   /* fondo de inputs, checkboxes, file fields */
    --surface-card:  #ffffff;   /* tarjetas y modales */
    --surface-hover: #f4f9ea;   /* hover en file fields */
    --surface-focus: #ffffff;   /* fondo al enfocar un input */

    /* Error */
    --error-text:   #8f1d2c;
    --error-border: #e2a3a6;
    --error-bg:     #fff4f4;
    --error-shadow: rgba(226, 163, 166, 0.18);

    /* ─── Tipografía ─────────────────────────────────────── */
    --text-xs:   12px;
    --text-sm:   13px;
    --text-base: 14px;
    --text-md:   15px;
    --text-lg:   16px;
    --text-xl:   20px;
    --text-2xl:  clamp(20px, 2.2vw, 28px);

    /* ─── Espaciado ──────────────────────────────────────── */
    --space-1:  4px;
    --space-2:  8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-5:  20px;
    --space-6:  24px;
    --space-7:  28px;
    --space-8:  32px;
    --space-10: 40px;
    --space-11: 44px;

    /* ─── Radios ─────────────────────────────────────────── */
    --radius-sm:   6px;
    --radius-md:   10px;
    --radius-lg:   12px;
    --radius-full: 999px;

    /* ─── Transiciones ───────────────────────────────────── */
    --transition: all 0.2s ease;
}