/* ============================================================================
   IVAE MARKETING — override COMPLETO de marca para los posts de blog de
   marketing. Se carga DESPUÉS de blog.css (marca IVAE Studios: serif Cormorant
   + acentos dorados) y neutraliza TODO el dorado/serif para que estos posts se
   vean 100% IVAE Marketing: Outfit sans-serif + acentos morado (#a78bfa) /
   rosa (#ec4899). Solo se enlaza en los posts de marketing; los de fotografía
   no lo cargan y conservan su identidad.
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&display=swap');

:root{
  --mkt-purple:#a78bfa;
  --mkt-purple-deep:#7c5cd6;
  --mkt-pink:#ec4899;
  --mkt-purple-line:rgba(124,92,214,0.38);
  --mkt-purple-bg:rgba(167,139,250,0.08);
}

/* ── Tipografía: TODO a Outfit (nada de Cormorant serif ni Syne) ── */
body,.post-article,.post-article p,.post-article li,.toc-list li a{font-family:'Outfit',sans-serif}
.post-hero h1{font-family:'Outfit',sans-serif;font-weight:800;letter-spacing:-0.02em}
.post-lead{font-family:'Outfit',sans-serif;font-weight:400;font-size:19px;line-height:1.7;opacity:1}
.post-article h2{font-family:'Outfit',sans-serif;font-weight:700;letter-spacing:-0.01em;line-height:1.25}
.post-article h3{font-family:'Outfit',sans-serif;font-weight:600}
.faq-section h2,.post-cta h2{font-family:'Outfit',sans-serif;font-weight:800}
.internal-links h3,.related h3,.rel-title{font-family:'Outfit',sans-serif;font-weight:700}
.pricing-card h4{font-family:'Outfit',sans-serif;font-weight:700}

/* ── Cursivas de acento: dorado -> morado ── */
.post-article h2 em,.post-hero h1 em,.post-cta h2 em,.related h3 em{font-style:normal;color:var(--mkt-purple-deep)}
.post-cta h2 em{color:var(--mkt-purple)}

/* ── Enlaces y bullets del cuerpo: dorado -> morado ── */
.post-article a{color:var(--mkt-purple-deep);text-decoration-color:var(--mkt-purple-line)}
.post-article a:hover{color:var(--mkt-pink)}
.post-article ul li::before{background:var(--mkt-purple-deep)}
.post-article ol li::before{color:var(--mkt-purple-deep)}
.post-divider{background:linear-gradient(90deg,var(--mkt-purple),var(--mkt-pink))}

/* ── Hero / TOC / migas ── */
.post-tag-hero{color:var(--mkt-purple)}
.post-back:hover{color:var(--mkt-pink)}
.toc-title{color:var(--mkt-purple-deep)}
.toc-list li a::before{color:var(--mkt-purple-deep)}
.toc-list li a:hover{color:var(--mkt-purple-deep)}
.breadcrumbs a:hover{color:var(--mkt-purple-deep)}

/* ── FAQ / tablas / tarjetas de precios ── */
.faq-q::after{color:var(--mkt-purple-deep)}
.comparison-table thead th{color:var(--mkt-purple-deep)}
.pricing-card:hover,.pricing-card.featured{border-color:var(--mkt-purple)}
.pricing-card.featured::before{background:var(--mkt-purple);color:#fff}
.pricing-card .price{color:var(--mkt-purple-deep)}
.pricing-card ul li::before{background:var(--mkt-purple-deep)}
.pricing-btn{color:var(--mkt-purple-deep);border-color:var(--mkt-purple-line)}
.pricing-btn:hover{background:var(--mkt-purple-bg);border-color:var(--mkt-purple)}

/* ── Autor / enlaces internos / relacionados ── */
.author-info .author-title{color:var(--mkt-purple-deep)}
.internal-links h3{color:var(--mkt-purple-deep)}
.il-link:hover{border-color:var(--mkt-purple);background:var(--mkt-purple-bg)}
.il-link .il-tag{color:var(--mkt-purple-deep)}
.rel-tag{color:var(--mkt-purple-deep)}

/* ── CTA final: botones dorados -> morado/rosa marca marketing ── */
.btn-cta{color:#fff;background:linear-gradient(135deg,var(--mkt-purple),var(--mkt-pink));border:1px solid transparent;border-radius:10px;font-weight:700}
.btn-cta:hover{background:linear-gradient(135deg,var(--mkt-purple-deep),var(--mkt-pink));border-color:transparent;opacity:.94}
.btn-cta[style*="background:transparent"]{background:transparent !important;color:var(--mkt-purple) !important;border:1px solid rgba(167,139,250,0.4) !important}

/* ── Accesibilidad: focus dorado -> morado ── */
*:focus-visible{outline:2px solid var(--mkt-purple) !important;outline-offset:2px}
.skip-link{background:var(--mkt-purple);color:#0a0a0f}

/* ── Meta bar del hero (autor/fecha): el dark-mode global pinta los <a> dorados ── */
.post-meta-bar a{color:var(--mkt-purple) !important;text-decoration-color:var(--mkt-purple-line)}
.post-meta-bar a:hover{color:var(--mkt-pink) !important}

/* ============================================================================
   MODO OSCURO: dark-mode.css (marca Studios) pinta TODOS los <a> dorados
   (#c9a54e) con `html.dark a`. En los posts de marketing lo neutralizamos
   COMPLETO con !important (dark-mode.css puede cargar después de este archivo).
   ============================================================================ */
html.dark .post-article a{color:var(--mkt-purple) !important}
html.dark .post-article a:hover{color:var(--mkt-pink) !important}
html.dark .toc-list li a{color:rgba(240,238,233,0.78) !important}
html.dark .toc-list li a:hover{color:var(--mkt-purple) !important}
html.dark .toc-list li a::before{color:var(--mkt-purple) !important}
html.dark .toc-title{color:var(--mkt-purple) !important}
html.dark .breadcrumbs a{color:rgba(240,238,233,0.55) !important}
html.dark .breadcrumbs a:hover{color:var(--mkt-purple) !important}
html.dark .post-back{color:rgba(240,238,233,0.7) !important}
html.dark .post-back:hover{color:var(--mkt-pink) !important}
html.dark .post-tag-hero{color:var(--mkt-purple) !important}
html.dark .post-meta-bar a{color:var(--mkt-purple) !important}
html.dark .il-link .il-tag{color:var(--mkt-purple) !important}
html.dark .internal-links a,html.dark .il-link{color:inherit !important}
html.dark .il-link .il-title{color:rgba(240,238,233,0.92) !important}
html.dark .internal-links h3{color:var(--mkt-purple) !important}
html.dark .post-article h2 em{color:var(--mkt-purple) !important}
html.dark .post-cta h2 em{color:var(--mkt-purple) !important}
html.dark .btn-cta{color:#fff !important;background:linear-gradient(135deg,var(--mkt-purple),var(--mkt-pink)) !important;border-color:transparent !important}
html.dark .btn-cta[style*="background:transparent"]{background:transparent !important;color:var(--mkt-purple) !important;border:1px solid rgba(167,139,250,0.4) !important}
html.dark .post-divider{background:linear-gradient(90deg,var(--mkt-purple),var(--mkt-pink)) !important}
html.dark .faq-q::after,html.dark .rel-tag,html.dark .author-info .author-title{color:var(--mkt-purple) !important}
html.dark *:focus-visible{outline-color:var(--mkt-purple) !important}

/* ── HEADER de marketing: html.dark a también lo pintaba dorado ── */
html.dark .imkt-hd-logo{color:#f0eee9 !important}
html.dark .imkt-hd-logo b,html.dark .imkt-hd-logo span:not(.g){color:#f0eee9 !important}
html.dark .imkt-hd-nav a{color:rgba(240,238,233,.72) !important}
html.dark .imkt-hd-nav a:hover{color:#f0eee9 !important}
html.dark .imkt-hd-nav a.is-active{color:#c4b5fd !important}
html.dark .imkt-hd-nav a.studio{color:rgba(240,238,233,.5) !important}
html.dark .imkt-hd-nav a.studio:hover{color:#c4b5fd !important}
html.dark .imkt-hd-lang a{color:rgba(240,238,233,.5) !important}
html.dark .imkt-hd-lang a.is-active{color:#c4b5fd !important}
html.dark .imkt-hd-login{color:rgba(240,238,233,.8) !important}
html.dark .imkt-hd-cta,html.dark .imkt-hd-cta *{color:#fff !important}
html.dark .imkt-hd svg{color:inherit !important}
html.dark .imkt-hd-burger,html.dark .imkt-hd-burger *{color:#f0eee9 !important}
html.dark .imkt-mnav a{color:rgba(240,238,233,.8) !important}