:root{
/* --- Base: 60% blanco / hueso --- */
--white:#FFFFFF;
--hueso:#F7F5F1;
--hueso-2:#FCFBF9;

/* --- Base: 30% tinta --- */
--tinta:#17150F;
--tinta-80:#3D3831;
--tinta-60:#57524A;
--muted:#8B857B;
--muted-2:#A39C90;

/* --- Acento: 10% barro --- */
--barro:#C25634;
--barro-press:#A8452A;
--barro-tint:#F6E7E0;

/* --- Acento secundario, solo secciones completas ("Destacados") --- */
--amarillo:#F2C94C;

/* --- Bordes --- */
--border:#EDE9E2;
--border-strong:#E7E2DA;
--border-input:#DCD6CC;
--border-frame:#E0DBD2;

/* --- Relleno de placeholder / skeleton --- */
--skeleton:#EFEBE4;

/* --- Alias semánticos --- */
--bg-page:var(--white);
--bg-alt:var(--hueso);
--surface-card:var(--white);
--surface-sunken:var(--hueso);
--surface-inverse:var(--tinta);
--surface-featured:var(--amarillo);

--text-strong:var(--tinta);
--text-body:var(--tinta-80);
--text-secondary:var(--tinta-60);
--text-muted:var(--muted);
--text-faint:var(--muted-2);
--text-on-inverse:var(--white);
--text-link:var(--barro);
--text-link-hover:var(--barro-press);

--accent:var(--barro);
--accent-press:var(--barro-press);

--focus-ring:var(--barro);

--btn-solid-bg:var(--tinta);
--btn-solid-fg:var(--white);
--btn-solid-bg-hover:var(--barro);
--btn-outline-border:var(--tinta);
}