diff --git a/AGENTS.md b/AGENTS.md
index fb31ec2..d003ef2 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -13,9 +13,10 @@ One-page landing para **creeer**, marca personal de una estratega de crecimiento
 ## Decisiones bloqueadas (no reabrir sin consultar a la dueña)
 
 - **Tono maestro:** "seguridad + cercanía" + "simple, directo, limpio".
-- **Wordmark:** `cre`**`e`**`er.` **SIEMPRE minúsculas**, Georgia 700 italic, la 2ª "e" en peso 900 + dorado, punto final dorado. **Nunca** `CREEER`, `Creeer`, sans-serif, ni mayúsculas. (Es la regla más fácil de romper por defecto.)
-- **Paleta:** navy `#0A1F44` + dorado tostado `#B8901f` (sobre claro) / dorado `#D4AF37` (sobre oscuro) + blanco cálido `#FBFAF7` / blanco `#FFFFFF`. **Sin amarillo eléctrico** tipo Hormozi.
-- **Tipografía híbrida:** Georgia italic = voz de marca (wordmark + citas); Inter 400/600/900 = voz funcional (headlines Hormozi + body + UI).
+- **Logotipo:** `cre≡er` — **SIEMPRE minúsculas**, la "e" central reemplazada por el **símbolo ≡** (tres líneas) en dorado. **Nunca** `CREEER`, `Creeer`, ni mayúsculas.
+- **Paleta:** Azul Profundo `#0A1D5D` + Dorado Estratégico `#C4942E` + Blanco `#FFFFFF` + neutros (Azul Claro `#C8EEF5`, Gris `#F2F2F2`, Gris Medio `#AAAAAA`). **Sin amarillo eléctrico** tipo Hormozi.
+- **Tipografía:** **Aptos** (principal) + **Aptos Narrow** (secundaria). En web: autoalojar .woff2 o usar Inter como fallback métricamente similar.
+- **Tagline de marca:** "CLARIDAD · DIRECCIÓN · CRECIMIENTO". Eslogan: "Estrategia que transforma."
 - **Voz:** segunda persona ("tú"/"tu negocio"), sin jerga corporativa.
 - **Sin escasez en el hero:** no mostrar cupos, cohorte ni "Generación Fundadora" arriba (decisión de la dueña).
 
diff --git a/app/globals.css b/app/globals.css
index b0a12fc..5a4b78f 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -5,12 +5,12 @@
 @layer base {
   html { scroll-behavior: smooth; }
   body {
-    background-color: #FBFAF7;
-    color: #0A1F44;
-    font-family: var(--font-inter), system-ui, sans-serif;
+    background-color: #FFFFFF;
+    color: #0A1D5D;
+    font-family: 'Aptos', var(--font-inter), system-ui, sans-serif;
     -webkit-font-smoothing: antialiased;
   }
-  ::selection { background: #D4AF37; color: #0A1F44; }
+  ::selection { background: #C4942E; color: #FFFFFF; }
 
   @media (prefers-reduced-motion: reduce) {
     html { scroll-behavior: auto; }
@@ -19,7 +19,7 @@
 
 @layer base {
   a:focus-visible, button:focus-visible {
-    outline: 3px solid #D4AF37;
+    outline: 3px solid #C4942E;
     outline-offset: 3px;
     border-radius: 2px;
   }
diff --git a/components/layout/Footer.tsx b/components/layout/Footer.tsx
index 26c473e..5bcbd57 100644
--- a/components/layout/Footer.tsx
+++ b/components/layout/Footer.tsx
@@ -4,11 +4,11 @@ import { footer } from '@/lib/content';
 
 export function Footer() {
   return (
-    <footer className="bg-bg-dark text-cream border-t border-cream/10">
+    <footer className="bg-azul-profundo text-white border-t border-white/10">
       <Container className="flex flex-col items-center gap-3 py-10 text-center md:flex-row md:justify-between md:text-left">
         <Wordmark size="sm" onDark />
-        <p className="text-sm text-muted-dark">{footer.tagline}</p>
-        <p className="text-xs text-muted-dark">{footer.legal}</p>
+        <p className="text-sm text-gris-medio">{footer.tagline}</p>
+        <p className="text-xs text-gris-medio">{footer.legal}</p>
       </Container>
     </footer>
   );
diff --git a/components/layout/Header.tsx b/components/layout/Header.tsx
index 1703f39..d255148 100644
--- a/components/layout/Header.tsx
+++ b/components/layout/Header.tsx
@@ -5,7 +5,7 @@ import { header } from '@/lib/content';
 
 export function Header() {
   return (
-    <header className="sticky top-0 z-50 border-b border-ink/10 bg-base/80 backdrop-blur">
+    <header className="sticky top-0 z-50 border-b border-azul-profundo/10 bg-white/80 backdrop-blur">
       <Container className="flex items-center justify-between py-3">
         <a href="#top" aria-label="creeer — inicio">
           <Wordmark size="md" />
diff --git a/components/layout/__tests__/Footer.test.tsx b/components/layout/__tests__/Footer.test.tsx
index 40de2d9..7bb10dc 100644
--- a/components/layout/__tests__/Footer.test.tsx
+++ b/components/layout/__tests__/Footer.test.tsx
@@ -5,7 +5,7 @@ import { Footer } from '../Footer';
 describe('<Footer />', () => {
   it('renders the tagline and the legal line', () => {
     render(<Footer />);
-    expect(screen.getByText('tu estratega de crecimiento')).toBeInTheDocument();
+    expect(screen.getByText('CLARIDAD · DIRECCIÓN · CRECIMIENTO')).toBeInTheDocument();
     expect(screen.getByText(/© 2026 creeer/)).toBeInTheDocument();
   });
   it('does not introduce a second h1', () => {
diff --git a/components/layout/__tests__/Header.test.tsx b/components/layout/__tests__/Header.test.tsx
index a18a25f..bbeb25d 100644
--- a/components/layout/__tests__/Header.test.tsx
+++ b/components/layout/__tests__/Header.test.tsx
@@ -5,7 +5,7 @@ import { Header } from '../Header';
 describe('<Header />', () => {
   it('renders the wordmark', () => {
     const { container } = render(<Header />);
-    expect(container.textContent).toContain('creeer');
+    expect(container.textContent).toContain('cre≡er');
   });
   it('renders a persistent CTA linking to the contact section', () => {
     render(<Header />);
diff --git a/components/primitives/CTA.tsx b/components/primitives/CTA.tsx
index 81ef72b..8042080 100644
--- a/components/primitives/CTA.tsx
+++ b/components/primitives/CTA.tsx
@@ -1,7 +1,7 @@
 type Variant = 'light' | 'dark';
 const styles: Record<Variant, string> = {
-  light: 'bg-ink text-cream hover:bg-ink/90',
-  dark: 'bg-gold-bright text-ink hover:bg-gold-bright/90',
+  light: 'bg-azul-profundo text-white hover:bg-azul-profundo/90',
+  dark: 'bg-dorado text-white hover:bg-dorado/90',
 };
 
 export function CTA({ href, label, variant = 'light', className = '' }: { href: string; label: string; variant?: Variant; className?: string }) {
diff --git a/components/primitives/Wordmark.tsx b/components/primitives/Wordmark.tsx
index 39abd95..bb995d3 100644
--- a/components/primitives/Wordmark.tsx
+++ b/components/primitives/Wordmark.tsx
@@ -9,15 +9,14 @@ const sizeClass: Record<Size, string> = {
 };
 
 export function Wordmark({ size = 'lg', onDark = false }: { size?: Size; onDark?: boolean }) {
-  const { before, accent, after, dot } = wordmark.parts;
-  const baseColor = onDark ? 'text-cream' : 'text-ink';
-  const goldColor = onDark ? 'text-gold-bright' : 'text-gold';
+  const { before, after } = wordmark.parts;
+  const baseColor = onDark ? 'text-white' : 'text-azul-profundo';
+  const goldColor = 'text-dorado';
   return (
-    <span className={`font-serif italic font-bold tracking-tight leading-none ${sizeClass[size]} ${baseColor}`}>
+    <span className={`font-sans font-bold tracking-tight leading-none ${sizeClass[size]} ${baseColor}`}>
       {before}
-      <span data-accent="true" className={`not-italic font-black ${goldColor}`}>{accent}</span>
+      <span data-accent="true" className={goldColor}>≡</span>
       {after}
-      <span className={goldColor}>{dot}</span>
     </span>
   );
 }
diff --git a/components/primitives/__tests__/Wordmark.test.tsx b/components/primitives/__tests__/Wordmark.test.tsx
index 6eec40d..6dcba6c 100644
--- a/components/primitives/__tests__/Wordmark.test.tsx
+++ b/components/primitives/__tests__/Wordmark.test.tsx
@@ -6,13 +6,13 @@ describe('<Wordmark />', () => {
   it('renders the wordmark in lowercase', () => {
     render(<Wordmark />);
     const text = screen.getByText(/cre/).closest('span')?.textContent;
-    expect(text?.toLowerCase()).toBe('creeer.');
+    expect(text?.toLowerCase()).toBe('cre≡er');
   });
-  it('renders the accent "e" separately for gold styling', () => {
+  it('renders the accent "≡" symbol separately for dorado styling', () => {
     const { container } = render(<Wordmark />);
     const accent = container.querySelector('[data-accent="true"]');
     expect(accent).not.toBeNull();
-    expect(accent?.textContent).toBe('e');
+    expect(accent?.textContent).toBe('≡');
   });
   it('never renders uppercase CREEER', () => {
     const { container } = render(<Wordmark />);
diff --git a/components/sections/Cierre.tsx b/components/sections/Cierre.tsx
index bb197a5..d04b95d 100644
--- a/components/sections/Cierre.tsx
+++ b/components/sections/Cierre.tsx
@@ -10,25 +10,25 @@ export function Cierre() {
   const reduced = usePrefersReducedMotion();
   const { whatsapp, email, linkedin } = cierre.contact;
   return (
-    <section id="contacto" className="bg-bg-dark text-cream scroll-mt-24">
+    <section id="contacto" className="bg-azul-profundo text-white scroll-mt-24">
       <Container className="py-24 md:py-32 text-center">
         <motion.div variants={staggerContainer} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
           className="flex flex-col items-center">
           <motion.div variants={fadeInUp}><Wordmark size="lg" onDark /></motion.div>
           <motion.blockquote variants={fadeInUp}
-            className="mt-10 font-serif italic text-2xl md:text-4xl font-bold leading-snug max-w-3xl">
-            <span className="text-gold-bright">&ldquo;</span>{cierre.quote}<span className="text-gold-bright">&rdquo;</span>
+            className="mt-10 font-sans italic text-2xl md:text-4xl font-bold leading-snug max-w-3xl">
+            <span className="text-dorado">&ldquo;</span>{cierre.quote}<span className="text-dorado">&rdquo;</span>
           </motion.blockquote>
           <motion.div variants={fadeInUp} className="mt-10">
             <CTA href={whatsapp.href} label={cierre.cta} variant="dark" />
           </motion.div>
           <motion.nav variants={fadeInUp} aria-label="Contacto" className="mt-12">
             <ul className="flex flex-wrap justify-center gap-6 text-sm">
-              <li><a href={whatsapp.href} className="hover:text-gold-bright transition-colors">{whatsapp.label}</a></li>
-              <li aria-hidden="true" className="text-muted-dark">·</li>
-              <li><a href={email.href} className="hover:text-gold-bright transition-colors">{email.label}</a></li>
-              <li aria-hidden="true" className="text-muted-dark">·</li>
-              <li><a href={linkedin.href} className="hover:text-gold-bright transition-colors">{linkedin.label}</a></li>
+              <li><a href={whatsapp.href} className="hover:text-dorado transition-colors">{whatsapp.label}</a></li>
+              <li aria-hidden="true" className="text-gris-medio">·</li>
+              <li><a href={email.href} className="hover:text-dorado transition-colors">{email.label}</a></li>
+              <li aria-hidden="true" className="text-gris-medio">·</li>
+              <li><a href={linkedin.href} className="hover:text-dorado transition-colors">{linkedin.label}</a></li>
             </ul>
           </motion.nav>
         </motion.div>
diff --git a/components/sections/ComoEmpezar.tsx b/components/sections/ComoEmpezar.tsx
index cd61c3a..c2de85b 100644
--- a/components/sections/ComoEmpezar.tsx
+++ b/components/sections/ComoEmpezar.tsx
@@ -10,20 +10,20 @@ export function ComoEmpezar() {
   const reduced = usePrefersReducedMotion();
   const waHref = `${cierre.contact.whatsapp.href}?text=${encodeURIComponent(comoEmpezar.whatsappText)}`;
   return (
-    <section className="bg-base">
+    <section className="bg-white">
       <Container className="py-24 md:py-32">
         <motion.p variants={fadeInUp} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
-          className="text-xs tracking-[0.3em] uppercase font-semibold text-gold-deep">{comoEmpezar.eyebrow}</motion.p>
+          className="text-xs tracking-[0.3em] uppercase font-semibold text-dorado">{comoEmpezar.eyebrow}</motion.p>
         <motion.h2 variants={fadeInUp} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
-          className="mt-4 font-serif italic font-bold text-3xl md:text-5xl text-ink">{comoEmpezar.title}</motion.h2>
+          className="mt-4 font-sans font-bold text-3xl md:text-5xl text-azul-profundo">{comoEmpezar.title}</motion.h2>
         <motion.ol variants={staggerContainer} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
           className="mt-12 grid gap-10 md:grid-cols-3">
           {comoEmpezar.steps.map((step) => (
             <motion.li key={step.n} variants={fadeInUp}
-              className="border-t border-gold/30 pt-6 transition-all duration-300 ease-out hover:-translate-y-1.5 hover:border-gold/70 motion-reduce:transform-none motion-reduce:transition-none">
-              <div className="font-serif italic font-black text-5xl md:text-6xl text-gold leading-none">{step.n}</div>
-              <h3 className="mt-4 font-sans font-bold text-xl text-ink">{step.name}</h3>
-              <p className="mt-3 text-muted leading-relaxed">{step.desc}</p>
+              className="border-t border-dorado/30 pt-6 transition-all duration-300 ease-out hover:-translate-y-1.5 hover:border-dorado/70 motion-reduce:transform-none motion-reduce:transition-none">
+              <div className="font-sans font-black text-5xl md:text-6xl text-dorado leading-none">{step.n}</div>
+              <h3 className="mt-4 font-sans font-bold text-xl text-azul-profundo">{step.name}</h3>
+              <p className="mt-3 text-gris-medio leading-relaxed">{step.desc}</p>
             </motion.li>
           ))}
         </motion.ol>
diff --git a/components/sections/Disciplinas.tsx b/components/sections/Disciplinas.tsx
index 5b84b70..a253f19 100644
--- a/components/sections/Disciplinas.tsx
+++ b/components/sections/Disciplinas.tsx
@@ -7,21 +7,21 @@ import { fadeInUp, staggerContainer, viewportOnce, usePrefersReducedMotion, moti
 export function Disciplinas() {
   const reduced = usePrefersReducedMotion();
   return (
-    <section className="bg-base">
+    <section className="bg-white">
       <Container className="py-24 md:py-32">
         <motion.p variants={fadeInUp} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
-          className="text-xs tracking-[0.3em] uppercase font-semibold text-gold-deep">{disciplinas.eyebrow}</motion.p>
+          className="text-xs tracking-[0.3em] uppercase font-semibold text-dorado">{disciplinas.eyebrow}</motion.p>
         <motion.h2 variants={fadeInUp} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
-          className="mt-4 font-serif italic font-bold text-3xl md:text-5xl text-ink">{disciplinas.title}</motion.h2>
+          className="mt-4 font-sans font-bold text-3xl md:text-5xl text-azul-profundo">{disciplinas.title}</motion.h2>
         <motion.p variants={fadeInUp} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
-          className="mt-4 text-muted text-lg">{disciplinas.lead}</motion.p>
+          className="mt-4 text-gris-medio text-lg">{disciplinas.lead}</motion.p>
         <motion.ul variants={staggerContainer} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
           className="mt-12 grid gap-8 md:grid-cols-3 list-none p-0">
           {disciplinas.items.map((item) => (
             <motion.li key={item.name} variants={fadeInUp}
-              className="border-t-2 border-gold pt-5 transition-all duration-300 ease-out hover:-translate-y-1.5 hover:border-gold-deep motion-reduce:transform-none motion-reduce:transition-none">
-              <h3 className="font-serif italic font-bold text-2xl text-ink">{item.name}</h3>
-              <p className="mt-3 text-muted leading-relaxed">{item.desc}</p>
+              className="border-t-2 border-dorado pt-5 transition-all duration-300 ease-out hover:-translate-y-1.5 hover:border-dorado motion-reduce:transform-none motion-reduce:transition-none">
+              <h3 className="font-sans font-bold text-2xl text-azul-profundo">{item.name}</h3>
+              <p className="mt-3 text-gris-medio leading-relaxed">{item.desc}</p>
             </motion.li>
           ))}
         </motion.ul>
diff --git a/components/sections/Estratega.tsx b/components/sections/Estratega.tsx
index 718e558..7433370 100644
--- a/components/sections/Estratega.tsx
+++ b/components/sections/Estratega.tsx
@@ -7,21 +7,21 @@ import { fadeInUp, staggerContainer, viewportOnce, usePrefersReducedMotion, moti
 export function Estratega() {
   const reduced = usePrefersReducedMotion();
   return (
-    <section className="bg-base">
+    <section className="bg-white">
       <Container className="py-24 md:py-32">
         <motion.div variants={staggerContainer} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
           className="grid gap-12 md:grid-cols-[auto_1fr] md:items-center">
           {/* Portrait — placeholder gradient until dueña provides a photo */}
           <motion.div variants={fadeInUp}
-            className="w-40 h-40 md:w-56 md:h-56 rounded-full flex-shrink-0 bg-gradient-to-br from-ink to-gold"
+            className="w-40 h-40 md:w-56 md:h-56 rounded-full flex-shrink-0 bg-gradient-to-br from-azul-profundo to-dorado"
             aria-label="Retrato de la estratega"
             role="img"
           />
           <div>
-            <motion.p variants={fadeInUp} className="text-xs tracking-[0.3em] uppercase font-semibold text-gold-deep">{estratega.eyebrow}</motion.p>
-            <motion.h2 variants={fadeInUp} className="mt-4 font-serif italic font-bold text-3xl md:text-5xl text-ink">{estratega.title}</motion.h2>
-            <motion.p variants={fadeInUp} className="mt-6 text-lg text-muted leading-relaxed max-w-2xl">{estratega.bio}</motion.p>
-            <motion.blockquote variants={fadeInUp} className="mt-6 font-serif italic text-xl md:text-2xl text-ink border-l-4 border-gold pl-4">
+            <motion.p variants={fadeInUp} className="text-xs tracking-[0.3em] uppercase font-semibold text-dorado">{estratega.eyebrow}</motion.p>
+            <motion.h2 variants={fadeInUp} className="mt-4 font-sans font-bold text-3xl md:text-5xl text-azul-profundo">{estratega.title}</motion.h2>
+            <motion.p variants={fadeInUp} className="mt-6 text-lg text-gris-medio leading-relaxed max-w-2xl">{estratega.bio}</motion.p>
+            <motion.blockquote variants={fadeInUp} className="mt-6 font-sans italic text-xl md:text-2xl text-azul-profundo border-l-4 border-dorado pl-4">
               {estratega.quote}
             </motion.blockquote>
           </div>
diff --git a/components/sections/FraseAncla.tsx b/components/sections/FraseAncla.tsx
index 81749fb..ab15332 100644
--- a/components/sections/FraseAncla.tsx
+++ b/components/sections/FraseAncla.tsx
@@ -8,7 +8,7 @@ import { fadeInUp, viewportOnce, usePrefersReducedMotion, motionProps } from '@/
 export function FraseAncla() {
   const reduced = usePrefersReducedMotion();
   return (
-    <section className="bg-base">
+    <section className="bg-white">
       <Container className="py-24 md:py-32 text-center max-w-4xl">
         <motion.blockquote
           variants={fadeInUp}
@@ -16,12 +16,12 @@ export function FraseAncla() {
           whileInView="visible"
           viewport={viewportOnce}
           {...motionProps(reduced)}
-          className="font-serif italic text-2xl md:text-4xl font-bold leading-snug text-ink"
+          className="font-sans italic text-2xl md:text-4xl font-bold leading-snug text-azul-profundo"
         >
-          <span className="text-gold">“</span>
+          <span className="text-dorado">“</span>
           {fraseAncla.quote.before}{' '}
-          <span className="text-gold">{fraseAncla.quote.accent}</span>
-          <span className="text-gold">”</span>
+          <span className="text-dorado">{fraseAncla.quote.accent}</span>
+          <span className="text-dorado">”</span>
         </motion.blockquote>
       </Container>
     </section>
diff --git a/components/sections/Hero.tsx b/components/sections/Hero.tsx
index 5b6bbf9..7011afe 100644
--- a/components/sections/Hero.tsx
+++ b/components/sections/Hero.tsx
@@ -14,22 +14,22 @@ export function Hero({ variant = 'editorial' }: { variant?: Variant }) {
   const isHormozi = variant === 'hormozi';
   const headlineBase = isHormozi
     ? 'font-sans font-black uppercase tracking-tight'
-    : 'font-serif italic font-bold';
+    : 'font-sans font-bold';
   const headlineSize = 'text-4xl md:text-6xl leading-[1.1]';
 
   return (
-    <section className="bg-bg-pure">
+    <section className="bg-white">
       <Container className="min-h-[88vh] flex flex-col items-center justify-center text-center py-24">
         <motion.div variants={staggerContainer} initial="hidden" animate="visible" {...motionProps(reduced)} className="flex flex-col items-center">
           <motion.div variants={fadeInUp}><Wordmark size="xl" /></motion.div>
-          <motion.p variants={fadeInUp} className="mt-6 text-xs md:text-sm tracking-[0.3em] uppercase font-semibold text-gold-deep">
+          <motion.p variants={fadeInUp} className="mt-6 text-xs md:text-sm tracking-[0.3em] uppercase font-semibold text-dorado">
             {hero.eyebrow}
           </motion.p>
-          <motion.h1 variants={fadeInUp} className={`mt-8 ${headlineBase} ${headlineSize} text-ink`}>
+          <motion.h1 variants={fadeInUp} className={`mt-8 ${headlineBase} ${headlineSize} text-azul-profundo`}>
             {hero.headline.line1}{' '}
-            <span className="text-gold">{hero.headline.effort}</span>{' '}
+            <span className="text-dorado">{hero.headline.effort}</span>{' '}
             {hero.headline.line3}{' '}
-            <span style={{ borderBottom: isHormozi ? '5px solid #B8901f' : '3px solid #B8901f', paddingBottom: 2 }}>
+            <span style={{ borderBottom: isHormozi ? '5px solid #C4942E' : '3px solid #C4942E', paddingBottom: 2 }}>
               {hero.headline.clarity}
             </span>
           </motion.h1>
diff --git a/components/sections/Mecanismo.tsx b/components/sections/Mecanismo.tsx
index 2a45fdf..1eb705a 100644
--- a/components/sections/Mecanismo.tsx
+++ b/components/sections/Mecanismo.tsx
@@ -8,20 +8,20 @@ import { fadeInUp, staggerContainer, viewportOnce, usePrefersReducedMotion, moti
 export function Mecanismo() {
   const reduced = usePrefersReducedMotion();
   return (
-    <section className="bg-bg-dark text-cream">
+    <section className="bg-azul-profundo text-white">
       <Container className="py-24 md:py-32">
         <motion.p variants={fadeInUp} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
-          className="text-xs tracking-[0.3em] uppercase font-semibold text-gold-bright">{mecanismo.eyebrow}</motion.p>
+          className="text-xs tracking-[0.3em] uppercase font-semibold text-dorado">{mecanismo.eyebrow}</motion.p>
         <motion.h2 variants={fadeInUp} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
-          className="mt-4 font-serif italic font-bold text-3xl md:text-5xl">{mecanismo.title}</motion.h2>
+          className="mt-4 font-sans font-bold text-3xl md:text-5xl">{mecanismo.title}</motion.h2>
         <motion.ol variants={staggerContainer} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)}
           className="mt-12 grid gap-10 md:grid-cols-3">
           {mecanismo.steps.map((step) => (
             <motion.li key={step.n} variants={fadeInUp}
-              className="border-t border-gold-bright/30 pt-6 transition-all duration-300 ease-out hover:-translate-y-1.5 hover:border-gold-bright/70 motion-reduce:transform-none motion-reduce:transition-none">
-              <div className="font-serif italic font-black text-5xl md:text-6xl text-gold-bright leading-none">{step.n}</div>
+              className="border-t border-dorado/30 pt-6 transition-all duration-300 ease-out hover:-translate-y-1.5 hover:border-dorado/70 motion-reduce:transform-none motion-reduce:transition-none">
+              <div className="font-sans font-black text-5xl md:text-6xl text-dorado leading-none">{step.n}</div>
               <h3 className="mt-4 font-sans font-bold text-xl">{step.name}</h3>
-              <p className="mt-3 text-muted-dark leading-relaxed">{step.desc}</p>
+              <p className="mt-3 text-gris-medio leading-relaxed">{step.desc}</p>
             </motion.li>
           ))}
         </motion.ol>
diff --git a/components/sections/ParaQuien.tsx b/components/sections/ParaQuien.tsx
index 6646b50..6d171d3 100644
--- a/components/sections/ParaQuien.tsx
+++ b/components/sections/ParaQuien.tsx
@@ -8,18 +8,18 @@ import { fadeInUp, staggerContainer, viewportOnce, usePrefersReducedMotion, moti
 export function ParaQuien() {
   const reduced = usePrefersReducedMotion();
   return (
-    <section className="bg-base">
+    <section className="bg-white">
       <Container className="py-24 md:py-32">
         <motion.div variants={staggerContainer} initial="hidden" whileInView="visible" viewport={viewportOnce} {...motionProps(reduced)} className="max-w-3xl">
-          <motion.h2 variants={fadeInUp} className="font-serif italic font-bold text-3xl md:text-5xl text-ink leading-tight">
+          <motion.h2 variants={fadeInUp} className="font-sans font-bold text-3xl md:text-5xl text-azul-profundo leading-tight">
             {paraQuien.title}
           </motion.h2>
-          <motion.p variants={fadeInUp} className="mt-6 text-lg text-muted">{paraQuien.lead}</motion.p>
+          <motion.p variants={fadeInUp} className="mt-6 text-lg text-gris-medio">{paraQuien.lead}</motion.p>
           <motion.ul variants={fadeInUp} className="mt-8 space-y-3">
             {paraQuien.criteria.map((c) => (
               <li key={c} className="flex items-start gap-3">
-                <span className="text-gold font-bold mt-1" aria-hidden="true">✓</span>
-                <span className="text-ink text-lg">{c}</span>
+                <span className="text-dorado font-bold mt-1" aria-hidden="true">✓</span>
+                <span className="text-azul-profundo text-lg">{c}</span>
               </li>
             ))}
           </motion.ul>
diff --git a/docs/branding.jpeg b/docs/branding.jpeg
new file mode 100755
index 0000000..e6db084
Binary files /dev/null and b/docs/branding.jpeg differ
diff --git a/docs/dueña-directrices.md b/docs/dueña-directrices.md
index a507e04..62ce88b 100644
--- a/docs/dueña-directrices.md
+++ b/docs/dueña-directrices.md
@@ -94,80 +94,104 @@ Empresarios que **ya lograron tracción**, pero llegaron al punto donde **trabaj
 
 ---
 
-## Restricciones fijadas (decisiones ya tomadas)
+## Sistema de diseño oficial — Manual de Identidad Visual v1.0 (mayo 2026)
 
-Estas son decisiones bloqueadas durante el brainstorming. **No reabrir sin consultar.**
+> **Fuente:** `docs/branding.jpeg` — Manual de Identidad Visual aprobado por la dueña (28/jul/2026). **Reemplaza** todas las decisiones previas de paleta, tipografía y logotipo del brainstorming y del pptx.
 
-### Paleta
-- Blanco cálido `#FBFAF7` / Blanco puro `#FFFFFF` (fondos)
-- Navy `#0A1F44` (texto principal + CTAs)
-- Dorado tostado `#B8901f` (acentos sobre claro) / Dorado `#D4AF37` (acentos sobre oscuro)
-- **NO amarillo eléctrico tipo Hormozi** (rompe cercanía)
+### Filosofía de marca
+> *"Transformamos la complejidad en claridad estratégica para construir ecosistemas empresariales que crecen con dirección y propósito."*
 
-### Sistema de diseño extraído del pptx (BASE)
+Proceso visual: **Complejidad** (múltiples variables) → **Enfoque** (priorizamos y alineamos lo esencial) → **Claridad** (una estrategia, una dirección, resultados extraordinarios).
 
-El pptx `CREEER_Plantilla_Presentacion.pptx` es la **base visual oficial** de la marca. Estos datos se extrajeron parseando el archivo y deben respetarse:
+### Símbolo principal
+- **Tres líneas horizontales** (≡) que representan el proceso de transformar lo complejo en lo esencial
+- Las líneas van de muchas/desordenadas (complejidad) a pocas/alineadas (claridad)
+- Significado: "una estrategia clara, con dirección y propósito"
 
-**Formato:** 16:9 widescreen (33.87 × 19.05 cm)
+### Logotipo
+- Wordmark: **`cre≡er`** — la "e" central se reemplaza por el **símbolo de tres líneas** (≡) en dorado
+- SIEMPRE en minúsculas
+- Tagline debajo: `CLARIDAD · DIRECCIÓN · CRECIMIENTO`
+- Eslogan: *"Estrategia que transforma."*
 
-**Paleta usada en el pptx (100% confirmada):**
-- Dorado `#D4AF37` → **siempre BOLD, para títulos y énfasis** (Master Class, Agenda, sección, "Gracias", y la "e" del wordmark)
-- Navy `#0A1F44` → **body text** (peso regular)
-- Blanco implícito (fondos)
+**Versiones del logotipo:**
+| Versión | Descripción |
+|---------|-------------|
+| Principal | `cre≡er` + tagline "CLARIDAD · DIRECCIÓN · CRECIMIENTO" |
+| Secundaria | `cre≡er` sin tagline |
+| Ícono | Solo el símbolo ≡ (tres líneas) |
+| Negativa | Fondo navy, logotipo en blanco + dorado |
+| Negativo (ícono) | Símbolo ≡ en dorado sobre navy |
+| Escala de grises | Todo en grises |
 
-**Tipografía del pptx:**
-- Fuente: **Calibri** (sans-serif) — majorFont y minorFont del tema
-- **Decisión RESUELTA (sistema híbrido):**
-  - **Wordmark** `cre`**`e`**`er.` → **Georgia 700 italic** (minúscula, "e" central en peso 900 + dorado, punto final dorado). El usuario prefiere la elegancia del wordmark serif sobre la fidelidad estricta al pptx sans-serif. El wordmark es la firma de marca.
-  - **Headlines** → **Inter 900** (Google Fonts) uppercase — punch Hormozi.
-  - **Body / eyebrow / CTA** → Inter 400/600.
-  - **Citas institucionales** → Georgia italic (anclan con el wordmark).
-  - Principio: **serif = voz de marca**, **sans = voz funcional**.
+**Tamaño mínimo:** impreso 20 mm, digital 120 px.
 
-**Escala tipográfica (extraída de los slides reales):**
-| Uso | Tamaño | Estilo | Color |
-|---|---|---|---|
-| Caption/tagline | 14pt | regular | navy |
-| Subtítulo | 24pt | regular | navy |
-| Body / lista | 28pt | regular | navy |
-| Cierre | 32pt | regular | dorado |
-| Título de sección | 36pt | **BOLD** | dorado |
-| Título grande / cita | 40pt | **BOLD** | navy o dorado |
-| Hero | 48pt | **BOLD** | dorado |
+### Paleta de colores
 
-**Wordmark `cre`+`e`+`er` (confirmado a múltiples tamaños):**
-- "Cre" + "e" (BOLD + `#D4AF37`) + "er"
-- La **2ª "e"** (la del medio) va en dorado + negrita
-- Aparece en 14pt (slide 1) y 28pt (slide 2)
+**Colores principales:**
+| Nombre | Hex | Pantone | RGB | Uso |
+|--------|-----|---------|-----|-----|
+| **Azul Profundo** | `#0A1D5D` | 2965 C | 10, 29, 61 | Texto principal, fondos oscuros, CTAs |
+| **Dorado Estratégico** | `#C4942E` | 872 C | 196, 154, 46 | Acentos, títulos, símbolo ≡, énfasis |
 
-**Logo PNG:** `image1.png` — 1200×400 px, aspect **3:1 horizontal**. En slide 1 ocupa 27.38 × 9.13 cm (es el **protagonista visual**, no un detalle pequeño).
+**Colores neutros:**
+| Nombre | Hex | RGB | Uso |
+|--------|-----|-----|-----|
+| Azul Claro | `#C8EEF5` | 222, 226, 245 | Fondos alternativos, secciones suaves |
+| Gris Claro | `#F2F2F2` | 242, 242, 242 | Fondos neutros, separadores |
+| Gris Medio | `#AAAAAA` | 166, 166, 166 | Texto secundario, placeholders |
+| Blanco | `#FFFFFF` | 255, 255, 255 | Fondo principal |
 
-**Patrones de alineación:**
-- `center` (align=ctr) → hero / títulos de impacto
-- `right` (align=r) → momentos asimétricos (slide 2)
-- `left` (align=l) → contenido, citas, cierre
+**Regla:** NO amarillo eléctrico tipo Hormozi (rompe cercanía).
 
-**Recursos visuales recurrentes:**
-- Separador de disciplinas: **" • "** (Comunicación • Digital • Experiencias)
-- Listas numeradas: **"1. " "2. " "3. "** (sin bullets)
-- Smart quotes **"" ""** para citas institucionales
+### Tipografía
+
+| Tipo | Fuente | Pesos disponibles | Uso |
+|------|--------|--------------------|-----|
+| **Principal** | **Aptos** | Light, Book, Regular, Medium, Bold, Black | Headlines, body, CTA, UI general |
+| **Secundaria** | **Aptos Narrow** | Light, Book, Regular, Medium, Bold, Black | Taglines, subtítulos, texto compacto |
+
+> ⚠️ **Nota para web:** Aptos es una fuente de Microsoft sin versión Google Fonts. Para la landing se debe: (a) autoalojar los archivos .woff2 con `@font-face`, o (b) usar un fallback con métricas similares (ej. **Inter** para body, que es visualmente cercana). Decisión a confirmar con la dueña.
+
+### Iconografía
+- Estilo: **líneas simples, geométricas, consistentes en grosor**
+- Iconos definidos: Análisis, Enfoque, Estrategia, Crecimiento, Alineación, Resultados
+- Colores: Azul Profundo + Dorado Estratégico
+
+### Recursos visuales
+- **Patrón de puntos** (grid de puntos dorados)
+- **Líneas y divisores** (horizontales, en dorado o navy)
+- **Recurso gráfico** (las tres líneas del símbolo en diversas orientaciones y escalas)
+
+### Patrones de alineación
+- `center` → hero / títulos de impacto
+- `right` → momentos asimétricos
+- `left` → contenido, citas, cierre
 - Mucho aire/whitespace alrededor de los textos
 
-**Anclas de copy del pptx (verbatim):**
-- Tagline: *"creeer en ti, en mi, en el proyecto"* (slide 1 y 2)
-- Cita institucional: *"El tiempo no se compra, se invierte"* (slide 6, 40pt bold navy)
-- Cierre: *"Gracias por tu tiempo"* + *"CREEER - Comunicación • Digital • Experiencias"* (slide 7)
+---
 
-### Wordmark
-- SIEMPRE en minúsculas: `creeer`
-- La "e" central (2ª de las 3) en dorado + bold
-- Termina con punto dorado: `creeer.`
+## Restricciones fijadas (decisiones bloqueadas)
+
+Estas decisiones **no se reabren sin consultar a la dueña.**
 
 ### Copy
 - Voz en **segunda persona ("tú")** — nunca "el empresario", siempre "tu negocio"
 - Sin jerga corporativa
 - "Simple, directo, limpio" aplica al copy también
 
+### Frases-ancla aprobadas
+- *"Las empresas no dejan de crecer por falta de talento; dejan de crecer por falta de claridad."*
+- *"Cuando el esfuerzo ya no alcanza, la estrategia se vuelve indispensable."*
+- *"El tiempo no se compra, se invierte."* (institucional)
+- *"Devuélvele claridad al rumbo de tu empresa."* (promesa)
+- *"Estrategia que transforma."* (eslogan oficial)
+
+### Taglines
+- **Eslogan oficial:** *"Estrategia que transforma."*
+- **Tagline de marca:** *"CLARIDAD · DIRECCIÓN · CRECIMIENTO"*
+- **Tagline emocional:** *"creeer en ti, creeer en mí, creeer en el proyecto."*
+
 ### Estructura
 - One-page (single page)
 - Sin backend, contacto por enlaces directos (WhatsApp, email, LinkedIn)
@@ -175,6 +199,7 @@ El pptx `CREEER_Plantilla_Presentacion.pptx` es la **base visual oficial** de la
 
 ### Pendiente de decisión de la dueña
 - **Hero final:** HV-1 (bold sans sin cajas) vs HV-2 (palabras en caja) — ver `docs/hero-finalists.md`
+- **Tipografía web:** ¿Alojar Aptos como web font o usar Inter como fallback?
 
 ---
 
diff --git a/docs/superpowers/specs/2026-07-20-creeer-landing-design.md b/docs/superpowers/specs/2026-07-20-creeer-landing-design.md
index 24ec347..8f64665 100644
--- a/docs/superpowers/specs/2026-07-20-creeer-landing-design.md
+++ b/docs/superpowers/specs/2026-07-20-creeer-landing-design.md
@@ -35,65 +35,68 @@ Landing page **one-page** para **creeer**, marca personal de una estratega de cr
 
 ## 3. Sistema de diseño
 
+> **Actualizado 28/jul/2026** — Basado en el Manual de Identidad Visual v1.0 (mayo 2026). Ver `docs/branding.jpeg` y `docs/dueña-directrices.md`.
+
 ### 3.1 Paleta
 
 Tokens de color (Tailwind):
 
 | Token | Hex | Uso |
 |---|---|---|
-| `bg-base` | `#FBFAF7` | Fondo base (blanco cálido) |
-| `bg-pure` | `#FFFFFF` | Secciones limpias / hero |
-| `bg-dark` | `#0A1F44` | Secciones oscuras (04 y 07) |
-| `text-primary` | `#0A1F44` | Texto principal (navy) |
-| `text-on-dark` | `#F5EBD0` | Texto sobre fondo oscuro (marfil) |
-| `accent-gold` | `#B8901f` | Dorado tostado — acentos sobre claro |
-| `accent-gold-bright` | `#D4AF37` | Dorado — acentos sobre oscuro |
-| `text-muted` | `#5a5168` | Texto secundario sobre claro |
-| `text-muted-dark` | `#9aa6c2` | Texto secundario sobre oscuro |
+| `bg-white` | `#FFFFFF` | Fondo base y hero |
+| `bg-azul-profundo` | `#0A1D5D` | Secciones oscuras (04 y 07) |
+| `text-azul-profundo` | `#0A1D5D` | Texto principal |
+| `text-white` | `#FFFFFF` | Texto sobre fondo oscuro |
+| `text-dorado` / `bg-dorado` | `#C4942E` | Dorado Estratégico — acentos, títulos, símbolo ≡ |
+| `bg-azul-claro` | `#C8EEF5` | Fondos alternativos, secciones suaves |
+| `bg-gris-claro` | `#F2F2F2` | Fondos neutros, separadores |
+| `text-gris-medio` | `#AAAAAA` | Texto secundario / placeholders |
 
 **NO usar amarillo eléctrico tipo Hormozi** — rompe la cercanía.
 
 ### 3.2 Tipografía
 
-Sistema híbrido (decisión final):
-
 | Uso | Familia | Pesos | Estilo |
 |---|---|---|---|
-| Wordmark + citas institucionales | **Georgia** (system serif) | 700 / 900 | italic |
-| Headlines (Hormozi punch, si HV-1) | **Inter** (Google Fonts) | 900 | uppercase |
-| Body / eyebrow / CTA / UI | **Inter** | 400 / 600 / 700 | normal |
+| Headlines, body, CTA, UI | **Aptos** | Light–Black | normal |
+| Taglines, subtítulos compactos | **Aptos Narrow** | Light–Black | normal |
 
-Principio: **serif = voz de marca**, **sans = voz funcional**. Georgia no requiere import (system font). Inter se carga desde Google Fonts.
+> **Nota web:** Aptos (Microsoft) no está en Google Fonts. Se autoaloja como .woff2 o se usa **Inter** como fallback métricamente similar (cargado desde Google Fonts como respaldo).
 
-### 3.3 Escala tipográfica (extraída del pptx)
+### 3.3 Escala tipográfica
 
 | Rol | Tamaño (móvil / desktop) | Peso |
 |---|---|---|
-| Hero headline | 32px / 48px | 700 italic (V-a) o 900 uppercase (HV-1) |
-| Sección título | 28px / 36px | 700 |
-| Cita ancla | 24px / 32px | 700 italic |
-| Subtítulo / body large | 18px / 24px | 400 |
-| Body | 16px / 18px | 400 |
-| Eyebrow / label | 11px / 12px | 600 uppercase (tracking +3px) |
-| Caption / métricas label | 10px / 11px | 600 uppercase |
+| Hero headline | 32px / 48px | Bold o Black |
+| Sección título | 28px / 36px | Bold |
+| Cita ancla | 24px / 32px | Bold italic |
+| Subtítulo / body large | 18px / 24px | Regular |
+| Body | 16px / 18px | Regular |
+| Eyebrow / label | 11px / 12px | Medium uppercase (tracking +3px) |
+| Caption / métricas label | 10px / 11px | Medium uppercase |
 
-### 3.4 Wordmark
+### 3.4 Wordmark / Logotipo
 
-`cre`**`e`**`er.` — siempre en minúsculas, Georgia 700 italic:
-- `cre` en navy `#0A1F44` (sobre claro) o marfil `#F5EBD0` (sobre oscuro)
-- **`e`** (la 2ª de las 3 "e") en **peso 900 + dorado**
+**`cre≡er`** — siempre en minúsculas, Aptos (o Inter como fallback):
+- `cre` en Azul Profundo `#0A1D5D` (sobre claro) o blanco `#FFFFFF` (sobre oscuro)
+- **`≡`** (símbolo de tres líneas, reemplaza la "e" central) en **Dorado Estratégico `#C4942E`**
 - `er` en el color del "cre"
-- **`.`** (punto final) en dorado
 
-**Tamaño:** base 32–48px según contexto. Es la firma de marca, va en serif italic SIEMPRE (no en sans, no en mayúsculas).
+**Tagline debajo:** `CLARIDAD · DIRECCIÓN · CRECIMIENTO`
+**Eslogan:** *"Estrategia que transforma."*
 
-### 3.5 Recursos visuales recurrentes (del pptx)
+**Tamaño:** base 32–48px según contexto. Es la firma de marca, siempre en minúsculas.
+
+### 3.5 Recursos visuales recurrentes
 
 - Separador de disciplinas: **" • "** (Comunicación • Digital • Experiencias)
 - Listas numeradas: **"1." "2." "3."** (sin bullets)
 - Smart quotes **"" ""** para citas institucionales
 - Flecha **"→"** en CTAs
 - Mucho aire/whitespace
+- **Patrón de puntos** (grid de puntos dorados) — recurso del branding
+- **Líneas y divisores** en dorado o azul profundo
+- **Iconografía:** líneas simples, geométricas, consistentes en grosor
 
 ### 3.6 Espaciado y ritmo
 
@@ -104,8 +107,8 @@ Principio: **serif = voz de marca**, **sans = voz funcional**. Georgia no requie
 
 ### 3.7 Layout de secciones
 
-- Secciones **claras**: hero (01) usa **blanco puro `#FFFFFF`**; el resto (02, 03, 05, 06) usa **blanco cálido `#FBFAF7`**. El contraste sutil separa el hero del cuerpo.
-- Secciones **oscuras** (04, 07): fondo navy `#0A1F44` con texto marfil y acentos dorado `#D4AF37`
+- Secciones **claras**: fondo blanco `#FFFFFF`. Alternar con `#F2F2F2` (gris claro) o `#C8EEF5` (azul claro) para ritmo visual.
+- Secciones **oscuras** (04, 07): fondo Azul Profundo `#0A1D5D` con texto blanco y acentos Dorado `#C4942E`
 - Esto da **ritmo visual** al scroll y enmarca las partes estratégicas (mecanismo + cierre)
 
 ---
@@ -114,20 +117,20 @@ Principio: **serif = voz de marca**, **sans = voz funcional**. Georgia no requie
 
 Dos finalistas guardados en `docs/hero-finalists.md`. La dueña elige uno. Ambos comparten:
 
-- Wordmark `cre`**`e`**`er.` (Georgia italic)
+- Logotipo `cre≡er` (Aptos / Inter)
 - Eyebrow: `— tu estratega de crecimiento —`
 - Headline copy: *"Tu negocio no necesita más esfuerzo. Necesita más claridad."*
-- CTA: `Define tu siguiente movimiento →` (navy, white text, chunky)
+- CTA: `Define tu siguiente movimiento →` (Azul Profundo, white text, chunky)
 - Fondo blanco `#FFFFFF`
 - Sin escasez (sin cupos/cohorte)
 
 ### 4.1 HV-1 · Hormozi ligero
-- Headline en **Inter 900 uppercase**
-- "más esfuerzo" en dorado tostado, "más claridad" subrayado en dorado
+- Headline en **Aptos Black uppercase**
+- "más esfuerzo" en dorado, "más claridad" subrayado en dorado
 - + punch / conversión, − cercanía
 
 ### 4.2 V-a · Editorial minimal
-- Headline en **Georgia 700 italic** (todo serif)
+- Headline en **Aptos Bold**
 - Sin subhead, sin métricas. Solo wordmark → eyebrow → headline → CTA
 - + cercanía / limpieza, − punch
 
diff --git a/lib/content.ts b/lib/content.ts
index 571911d..47f378a 100644
--- a/lib/content.ts
+++ b/lib/content.ts
@@ -1,8 +1,8 @@
 // Source of truth for all copy. Edit here, not in JSX.
 
 export const wordmark = {
-  // cre[e]er. — 'cre' + gold 'e' + 'er' + gold '.'
-  parts: { before: 'cre', accent: 'e', after: 'er', dot: '.' },
+  // cre[≡]er — 'cre' + dorado symbol '≡' + 'er'
+  parts: { before: 'cre', accent: '≡', after: 'er' },
 };
 
 export const hero = {
@@ -90,6 +90,7 @@ export const header = {
 };
 
 export const footer = {
-  tagline: 'tu estratega de crecimiento',
+  tagline: 'CLARIDAD · DIRECCIÓN · CRECIMIENTO',
+  eslogan: 'Estrategia que transforma.',
   legal: '© 2026 creeer',
 };
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 0c2c251..751976c 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -5,22 +5,24 @@ const config: Config = {
   theme: {
     extend: {
       colors: {
-        base: '#FBFAF7',       // blanco cálido (fondo base)
-        'bg-pure': '#FFFFFF',  // blanco puro (hero)
-        'bg-dark': '#0A1F44',  // navy (secciones oscuras)
-        ink: '#0A1F44',        // texto principal
-        cream: '#F5EBD0',      // texto sobre oscuro (marfil)
-        gold: {
-          DEFAULT: '#B8901f',  // dorado tostado (sobre claro) — usar solo en texto grande/decorativo
-          deep: '#7A5F15',     // dorado profundo (AA 4.5:1 sobre claro para texto pequeño)
-          bright: '#D4AF37',   // dorado (sobre oscuro)
+        // — Manual de Identidad Visual v1.0 (mayo 2026) —
+        // Colores principales
+        'azul-profundo': '#0A1D5D',    // Pantone 2965 C — texto, fondos oscuros, CTAs
+        'dorado': {
+          DEFAULT: '#C4942E',           // Pantone 872 C — acentos, títulos, símbolo ≡
         },
-        muted: '#5a5168',
-        'muted-dark': '#9aa6c2',
+        // Colores neutros
+        'azul-claro': '#C8EEF5',       // fondos alternativos, secciones suaves
+        'gris-claro': '#F2F2F2',       // fondos neutros, separadores
+        'gris-medio': '#AAAAAA',       // texto secundario, placeholders
+        // Aliases semánticos (backward compat + legibilidad en componentes)
+        ink: '#0A1D5D',                // texto principal
+        'bg-dark': '#0A1D5D',          // secciones oscuras
       },
       fontFamily: {
-        sans: ['var(--font-inter)', 'system-ui', 'sans-serif'],
-        serif: ['Georgia', 'Cambria', 'Times New Roman', 'serif'],
+        // Aptos (principal) — autoalojar .woff2; Inter como fallback web
+        sans: ['Aptos', 'var(--font-inter)', 'system-ui', 'sans-serif'],
+        narrow: ['Aptos Narrow', 'var(--font-inter)', 'system-ui', 'sans-serif'],
       },
       maxWidth: {
         content: '1152px',