diff --git a/components/sections/Cierre.tsx b/components/sections/Cierre.tsx
index 7c1ea6c..9b3e4af 100644
--- a/components/sections/Cierre.tsx
+++ b/components/sections/Cierre.tsx
@@ -18,7 +18,7 @@ export function Cierre() {
className="flex flex-col items-center">
+ className="mt-12 font-sans font-black text-ancla max-w-3xl">
{cierre.quote}
diff --git a/components/sections/ComoEmpezar.tsx b/components/sections/ComoEmpezar.tsx
index 8ac28aa..9597cf1 100644
--- a/components/sections/ComoEmpezar.tsx
+++ b/components/sections/ComoEmpezar.tsx
@@ -15,11 +15,11 @@ export function ComoEmpezar() {
const waHref = `${cierre.contact.whatsapp.href}?text=${encodeURIComponent(comoEmpezar.whatsappText)}`;
const { active, setActive, hoverProps } = useAutoStep(comoEmpezar.steps.length, 3200);
return (
-
+
{comoEmpezar.eyebrow}
- {comoEmpezar.title}
+ {comoEmpezar.title}
{comoEmpezar.steps.map((step, i) => (
diff --git a/components/sections/Disciplinas.tsx b/components/sections/Disciplinas.tsx
index f2b573e..5bc1d79 100644
--- a/components/sections/Disciplinas.tsx
+++ b/components/sections/Disciplinas.tsx
@@ -17,7 +17,7 @@ export function Disciplinas() {
{disciplinas.eyebrow}
{disciplinas.title}
+ className="mt-4 font-sans font-black text-seccion text-azul-profundo">{disciplinas.title}
{disciplinas.lead}
diff --git a/components/sections/Dolores.tsx b/components/sections/Dolores.tsx
index 4632bf4..8eba47d 100644
--- a/components/sections/Dolores.tsx
+++ b/components/sections/Dolores.tsx
@@ -16,7 +16,7 @@ export function Dolores() {
{dolores.eyebrow}
{dolores.title}
+ className="mt-4 font-sans font-black text-seccion text-azul-profundo max-w-3xl">{dolores.title}
{dolores.quotes.map((quote) => (
@@ -33,7 +33,7 @@ export function Dolores() {
))}
+ className="mt-16 font-sans font-black text-ancla text-azul-profundo max-w-4xl">
{dolores.remate.before}{' '}
{dolores.remate.accent}
diff --git a/components/sections/Estratega.tsx b/components/sections/Estratega.tsx
index 0901871..94c97b6 100644
--- a/components/sections/Estratega.tsx
+++ b/components/sections/Estratega.tsx
@@ -11,7 +11,7 @@ import { fadeInUp, staggerContainer, viewportOnce, usePrefersReducedMotion, moti
export function Estratega() {
const reduced = usePrefersReducedMotion();
return (
-
+
@@ -29,7 +29,7 @@ export function Estratega() {
{estratega.eyebrow.before} {estratega.eyebrow.brand}
- {estratega.title}
+ {estratega.title}
años construyendo marcas
diff --git a/components/sections/FraseAncla.tsx b/components/sections/FraseAncla.tsx
index 41762bb..dd20255 100644
--- a/components/sections/FraseAncla.tsx
+++ b/components/sections/FraseAncla.tsx
@@ -24,7 +24,7 @@ export function FraseAncla() {
whileInView="visible"
viewport={viewportOnce}
{...motionProps(reduced)}
- className="mt-10 font-sans font-black text-4xl md:text-6xl leading-[0.95] tracking-tight text-white"
+ className="mt-10 font-sans font-black text-ancla text-white"
>
{mecanismo.eyebrow}
{mecanismo.title}
+ className="mt-4 font-sans font-black text-seccion">{mecanismo.title}
{/* Conector de pasos: avanza solo cada ~3s (se pausa con hover o si el
usuario elige un paso), y adelanta la línea de progreso — el mismo
diff --git a/components/sections/ParaQuien.tsx b/components/sections/ParaQuien.tsx
index 4a9ccb6..65c00d2 100644
--- a/components/sections/ParaQuien.tsx
+++ b/components/sections/ParaQuien.tsx
@@ -12,7 +12,7 @@ export function ParaQuien() {
{paraQuien.title}
+ className="font-sans font-black text-seccion text-azul-profundo max-w-3xl">{paraQuien.title}
diff --git a/components/sections/PuntosInflexion.tsx b/components/sections/PuntosInflexion.tsx
index 4141e14..2acc29f 100644
--- a/components/sections/PuntosInflexion.tsx
+++ b/components/sections/PuntosInflexion.tsx
@@ -32,7 +32,7 @@ export function PuntosInflexion() {
{puntosInflexion.eyebrow}
{puntosInflexion.title}
+ className="mt-4 font-sans font-black text-seccion text-azul-profundo max-w-3xl">{puntosInflexion.title}
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 7e10cec..0c9f423 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -27,6 +27,13 @@ const config: Config = {
maxWidth: {
content: '1152px',
},
+ fontSize: {
+ // Two title roles, so a brand statement never looks like a section
+ // heading. Fluid so they hold from 360px to desktop without a stack of
+ // breakpoint overrides.
+ ancla: ['clamp(2.5rem, 6.5vw, 4.5rem)', { lineHeight: '0.98', letterSpacing: '-0.025em' }],
+ seccion: ['clamp(2rem, 4vw, 3.25rem)', { lineHeight: '1.02', letterSpacing: '-0.02em' }],
+ },
},
},
plugins: [],