/* ============================================
   MCL Growth Partners — páginas internas en la paleta nueva
   (crema, azul marino y dorado, como la portada y el Instagram).
   Se carga DESPUÉS de style.css y le da vuelta las variables: casi
   todo lo de esas páginas ya usa var(--...), así que con esto cambia
   la paleta sin reescribir cada página. Condiciones del servicio,
   privacidad y eliminación de datos NO lo cargan a propósito.
   ============================================ */
:root {
  --bg: #E4E2DE;
  --bg-soft: #EEECE8;
  --bg-card: #F6F5F2;
  --border: rgba(29, 45, 58, 0.13);
  --border-strong: rgba(29, 45, 58, 0.3);
  --accent: #1D2D3A;
  --accent-soft: #14202A;
  --accent-dim: rgba(29, 45, 58, 0.7);
  --text: #1D2D3A;
  --text-muted: #4E5A63;
  --oro: #A27D4A;
  --oro-texto: #7A5C32;
}

body { background: var(--bg); color: var(--text); }
::selection { background: #1D2D3A; color: #F6F5F2; }

/* Header claro */
.site-header { background: rgba(228, 226, 222, 0.88); border-bottom: 1px solid var(--border); }
.nav-links a:not(.btn) { color: var(--text); }
.nav-links a:not(.btn):hover { color: var(--oro-texto); }
.nav-toggle { border-color: rgba(29, 45, 58, 0.3); }
.nav-toggle span { background: #1D2D3A; }
@media (max-width: 860px) {
  .site-header[data-nav="collapsible"] .nav-links { background: rgba(238, 236, 232, 0.98); box-shadow: 0 22px 40px rgba(29, 45, 58, 0.14); }
  .site-header[data-nav="collapsible"] .nav-links a:not(.btn) { color: var(--text); }
}

/* Botones */
.btn-primary { background: #1D2D3A; color: #F6F5F2 !important; border-color: #1D2D3A; }
.btn-primary:hover { background: #14202A; color: #F6F5F2 !important; }
.btn-ghost { color: #1D2D3A !important; border-color: rgba(29, 45, 58, 0.35); }
.btn-ghost:hover { border-color: #1D2D3A; }

/* Etiquetas chicas en dorado, como en la portada */
.kicker, .eyebrow, .blog-tag, .section-head .kicker, .faq-page .kicker { color: var(--oro-texto) !important; }

/* Títulos: azul marino; la palabra destacada en dorado */
h1, h2, h3, h4 { color: var(--text); }
h1 em, h2 em { color: var(--oro); font-style: normal; }

/* Tarjetas y bloques: papel claro con sombra suave */
.faq-item, .blog-card, .coex-card, .card, .note, .blog-cta, .faq-cta {
  background: var(--bg-card);
  border-color: var(--border);
}
.blog-card { box-shadow: 0 12px 34px rgba(29, 45, 58, 0.08); transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.4s; }
@media (hover: hover) { .blog-card:hover { transform: translateY(-5px); box-shadow: 0 22px 50px rgba(29, 45, 58, 0.14); } }
.faq-item summary::after { color: var(--oro); }
.faq-answer li::before { background: var(--oro); color: var(--oro); }

/* Texto de los artículos: más contraste y links en dorado legible */
.blog-post p, .blog-post li { color: #2F3D48; }
.blog-post a, .faq-answer a { color: var(--oro-texto); }
.blog-tabla th { background: #1D2D3A; color: #F6F5F2; }
.blog-tabla td { border-color: var(--border); }

/* Footer: azul marino oscuro, como el de la portada (ahí el logo beige se ve bien) */
.site-footer { background: #14202A; color: rgba(246, 245, 242, 0.75); border-top: 0; }
.site-footer a { color: rgba(246, 245, 242, 0.88); }
.site-footer a:hover { color: #C9A86A; }
.site-footer h4, .site-footer h5, .site-footer strong { color: #F6F5F2; }
.footer-copy, .footer-legal { color: rgba(246, 245, 242, 0.6); }

/* Widget de contacto y su formulario, en claro */
.contact-widget { background: #F6F5F2; border-color: var(--border); box-shadow: 0 30px 70px rgba(29, 45, 58, 0.22); }
.contact-widget h3 { color: var(--text); }
.contact-widget input, .contact-widget textarea { background: #FFFFFF; color: var(--text); border-color: var(--border); }
.fab { background: #F6F5F2; color: #1D2D3A; }