/* ==========================================================================
   THEME-IBERIA.CSS · Capa de tema de Iberia Growth (cargar SIEMPRE la última)
   ==========================================================================
   Convierte el diseño base (oscuro teal + menta) a:
     · Fondo BLANCO en todas las secciones que eran oscuras
     · Texto oscuro legible sobre blanco
     · Acento DORADO sutil (la menta ya se cambió a oro en los otros CSS)
   Se mantienen en oscuro SOLO los "mockups"/widgets decorativos
   (maqueta de app del hero, calculadora ROI, tarjetas de módulo, paneles UI),
   porque sobre blanco lucen premium y conservan el diseño original.
   Marca: oro #C9A84C (claro #E2C97E · profundo #A8862E).
   ========================================================================== */

:root {
  --iberia-line: rgba(3, 33, 40, .10);   /* líneas/bordes sobre blanco */
  --iberia-line-soft: rgba(3, 33, 40, .06);
}

/* ===== BASE: página blanca, texto oscuro ===== */
body { background: #ffffff; color: var(--c-ink); }
h1, h2, h3, h4 { color: var(--c-ink); }
.section-head .lede { color: var(--c-grey-700); }
.section-head .lede strong { color: var(--c-ink); }
/* el grano/ruido del fondo no aporta sobre blanco */
body::after { display: none; }

/* ===== NAV (era teal translúcido) ===== */
.nav {
  background: rgba(255, 255, 255, .82);
  border-bottom: 1px solid var(--iberia-line);
}
.nav-logo, .nav-logo-wordmark { color: var(--c-ink); }
.nav-links a { color: var(--c-grey-700); }
.nav-links a:hover { color: var(--c-mint-deep); }
.nav-toggle { color: var(--c-mint-deep); border-color: rgba(3, 33, 40, .18); }
.nav-toggle:hover, .nav-toggle:focus-visible { background: rgba(3, 33, 40, .04); border-color: var(--c-mint-deep); }

/* ===== BOTÓN GHOST sobre fondo claro ===== */
.btn--ghost { background: transparent; color: var(--c-ink); border-color: rgba(3, 33, 40, .2); backdrop-filter: none; }
.btn--ghost:hover { background: rgba(3, 33, 40, .04); border-color: var(--c-ink); }

/* ===== HERO (era oscuro) → blanco, manteniendo la maqueta oscura a la derecha ===== */
.hero { background: #ffffff; }
.hero h1 { color: var(--c-ink); }
.hero h1 .italic::after { opacity: .18; }   /* atenúa el glow dorado tras la palabra */
.hero-sub { color: var(--c-grey-700); }
.hero-sub strong { color: var(--c-ink); }
.hero-meta { color: var(--c-grey-500); }
.hero-kpi-num { color: var(--c-ink); }
.hero-kpi-label { color: var(--c-grey-500); }
.hero-strip { border-top-color: var(--iberia-line); }
/* glows del hero: muy sutiles sobre blanco */
.hero-mesh::before, .hero-mesh::after { opacity: .25; }

/* ===== PLATFORM (era oscura) → blanca; las tarjetas de módulo siguen oscuras ===== */
.platform { background: #ffffff; }
.platform-bg-glow { display: none; }

/* ===== PROCESS (era oscura) → blanca; los círculos siguen oscuros ===== */
.process { background: #ffffff; }
.process-step h3 { color: var(--c-ink); }
.process-step p { color: var(--c-grey-700); }
.process-step-meta { color: var(--c-grey-500); }
.process-step .out { color: var(--c-grey-500); border-top-color: var(--iberia-line); }

/* ===== STATEMENT (era oscura) → blanca ===== */
.statement { background: #ffffff; }
.statement h2 { color: var(--c-ink); }
.statement-glow { display: none; }

/* ===== ROI (era oscura) → blanca; la calculadora sigue oscura ===== */
.roi { background: #ffffff; color: var(--c-ink); }
.roi-bg-glow { display: none; }

/* ===== FAQ (era oscura) → blanca ===== */
.faq { background: #ffffff; }
.faq-aside h2 { color: var(--c-ink); }
.faq-aside p { color: var(--c-grey-700); }
.faq-item { border-top-color: var(--iberia-line); }
.faq-item:last-child { border-bottom-color: var(--iberia-line); }
.faq-q-text { color: var(--c-ink); }
.faq-q-toggle { border-color: rgba(3, 33, 40, .2); color: var(--c-ink); }
.faq-a { color: var(--c-grey-700); }
.faq-item.open .faq-q-text { color: var(--c-mint-deep); }

/* ===== Sección menta a página completa (por si alguna la usa) → clara ===== */
.final { background: var(--c-paper); color: var(--c-ink); }
.final h2, .final p { color: var(--c-ink); }
.final-trust { border-top-color: var(--iberia-line); }
.final-trust-item { color: var(--c-ink); }

/* ===== FOOTER (era deep oscuro) → claro cálido con separación ===== */
.footer { background: #f6f3ee; color: var(--c-ink); border-top: 1px solid var(--iberia-line); }
.footer-brand p { color: var(--c-grey-700); }
.footer-brand .footer-logo-wordmark, .footer-brand .footer-logo-hub { color: var(--c-ink); }
.footer-col h5 { color: var(--c-grey-500); }
.footer-col ul a { color: var(--c-grey-700); }
.footer-col ul a:hover { color: var(--c-mint-deep); }
.footer-contact { border-top-color: var(--iberia-line); }
.footer-contact a { color: var(--c-grey-700); }
.footer-contact a:hover { color: var(--c-mint-deep); }
.footer-address { color: var(--c-grey-500); }
.footer-address strong { color: var(--c-grey-700); }
.footer-bottom { color: var(--c-grey-500); border-top-color: var(--iberia-line); }
.footer-bottom-right a { color: var(--c-grey-500); }
.footer-bottom-right a:hover { color: var(--c-mint-deep); }

/* ===== DRAWER MÓVIL (era oscuro) → blanco ===== */
.nav-drawer { background: #ffffff; border-left-color: var(--iberia-line); }
.nav-drawer-head { border-bottom-color: var(--iberia-line); }
.nav-drawer-links a { color: var(--c-ink); border-bottom-color: var(--iberia-line-soft); }
.nav-drawer-links a:hover, .nav-drawer-links a:focus-visible { background: rgba(3, 33, 40, .04); color: var(--c-mint-deep); }
.nav-overlay { background: rgba(3, 33, 40, .45); }

/* ===== LOGO Iberia en nav y footer (imagen en vez del SVG de nexoo) ===== */
.nav-logo img.brand-logo { height: 42px; width: auto; display: block; }
.footer-brand .footer-logo img.brand-logo { height: 48px; width: auto; display: block; }

/* ===== Page-hero de subpáginas (servicios/nosotros/contacto), era oscuro ===== */
.page-hero { background: #ffffff; }
.page-hero h1 { color: var(--c-ink); }
.page-hero p, .page-hero .page-hero-sub { color: var(--c-grey-700); }

/* ===== nosotros · statement-section (era oscura) → blanca ===== */
.statement-section { background: #ffffff; color: var(--c-ink); }
.statement-glow { display: none; }
.statement-quote { color: var(--c-ink); }
.statement-quote .italic { color: var(--c-mint-deep); }
.statement-mark { color: var(--c-mint-deep); }
.statement-sub { color: var(--c-grey-700); }
.statement-sub strong { color: var(--c-ink); }

/* ===== Fix: negritas del subtítulo del page-hero (eran color claro, invisibles sobre blanco) ===== */
.page-hero p.lede strong, .page-hero .lede strong, .page-hero p strong { color: var(--c-ink); }
.page-hero p.lede { color: var(--c-grey-700); }
