:root{

/* colores principales */

--color-primary:#2563eb;
--color-primary-dark:#1d4ed8;

--color-text:#1e293b;
--color-text-soft:#475569;

--color-bg:#f8fbff;
--color-border:#e2e8f0;
--color-white:#ffffff;

/* layout */

--container-width:1200px;
--radius:12px;
--radius-lg:20px;
--header-height:90px;

/* sombras */

--shadow-soft:0 12px 30px rgba(0,0,0,0.08);
--shadow-cta:0 12px 30px rgba(37,99,235,0.25);
--shadow-card:0 14px 34px rgba(15,23,42,0.06);
--shadow-card-hover:0 22px 48px rgba(15,23,42,0.10);

/* motion */

--transition-fast:0.22s ease;
--transition-base:0.32s ease;
--transition-slow:0.45s ease;
--focus-ring:0 0 0 4px rgba(37,99,235,0.16);

/* header */

--header-height:90px;
--header-height-compact:78px;
--header-bg:rgba(255,255,255,0.78);
--header-bg-scrolled:rgba(255,255,255,0.92);
--header-border:rgba(148,163,184,0.16);
--header-border-strong:rgba(148,163,184,0.24);

/* layout refined */

--hero-text-max:620px;
--content-text-max:760px;

/* shadows refined */

--shadow-header:0 8px 24px rgba(15,23,42,0.04);
--shadow-header-scrolled:0 14px 34px rgba(15,23,42,0.08);
--shadow-image-hover:0 28px 64px rgba(15,23,42,0.16);

}