:root{
/* --- Brand greens (measured from logo SVG + brochure PDF) --- */
--st-verde:#004438;            /* Verde Santo Tomás — primary, logo colour */
--st-bosque:#19822A;
--st-bandera:#0AB14B;
--st-turquesa:#09A28D;
--st-oliva:#B0D732;
--st-lima:#87CF2C;             /* accent — KPI blocks, CTA banners */
--st-cian:#00E5D4;            /* restricted: text over darkened photography */

/* --- Derived tints/shades (NOT in source pieces; generated in oklch for UI states) --- */
--st-verde-950:#002D25;
--st-verde-800:#0A5747;
--st-verde-700:#136B58;
--st-verde-100:#DCE8E4;
--st-verde-50:#EFF5F2;
--st-lima-700:#5F9A16;
--st-lima-600:#6FB61F;
--st-lima-100:#E8F6D5;
--st-turquesa-100:#DAF0EC;

/* --- Neutrals --- */
--st-white:#FFFFFF;
--st-black:#000000;           /* site topbar + footer */
--st-gray-900:#1A1A1A;
--st-gray-800:#333333;        /* body copy on web */
--st-gray-600:#6B6B6B;
--st-gray-400:#A8A8A8;
--st-gray-300:#D9DBD9;
--st-gray-200:#E8EAE8;
--st-gray-100:#F2F4F2;
--st-gray-50:#F8F9F8;

/* --- Semantic aliases --- */
--surface-page:var(--st-white);
--surface-muted:var(--st-gray-100);
--surface-card:var(--st-white);
--surface-brand:var(--st-verde);
--surface-brand-soft:var(--st-verde-50);
--surface-accent:var(--st-lima);
--surface-accent-soft:var(--st-lima-100);
--surface-inverse:var(--st-black);
--surface-veil:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.35) 45%,rgba(0,0,0,.78) 100%);
--surface-veil-side:linear-gradient(90deg,rgba(0,26,21,.85) 0%,rgba(0,26,21,.45) 55%,rgba(0,26,21,0) 100%);

--text-body:var(--st-gray-800);
--text-strong:var(--st-verde);
--text-muted:var(--st-gray-600);
--text-on-brand:var(--st-white);
--text-on-accent:var(--st-white);
--text-inverse:var(--st-white);
--text-link:var(--st-verde);
--text-link-hover:var(--st-lima-700);
--text-over-photo:var(--st-cian);

--border-subtle:var(--st-gray-200);
--border-default:var(--st-gray-300);
--border-brand:var(--st-verde);
--border-accent:var(--st-lima);

--focus-ring:var(--st-lima);

/* --- Area colour coding (programme areas / centros) --- */
--area-salud:var(--st-turquesa);
--area-mineria:var(--st-verde);
--area-liderazgo:var(--st-lima);
--area-educacion:var(--st-bandera);
--area-otros:var(--st-bosque);

/* --- Process step ramp (numbered circles, dark to light) --- */
--step-1:var(--st-verde);
--step-2:var(--st-bosque);
--step-3:var(--st-bandera);
--step-4:var(--st-oliva);
--step-5:var(--st-lima);
}