/* ═══════════════════════════════════════════════════════════════
   ARMONÍA v3 · Coherencia global con la home
   Sistema «Criterio & Energía» · Campo Claro · Manual v3.0
   REGLA DE ORO: el color de los titulares NUNCA se fuerza a navy
   globalmente. Navy en contextos claros; blanco en los oscuros,
   con especificidad superior. (Este era el fallo de la v2.)
   ═══════════════════════════════════════════════════════════════ */
:root{
  --am-navy:#0A2540;--am-abismo:#051425;--am-brasa:#FF8300;--am-brasa-txt:#CC6900;
  --am-verde:#99CC00;--am-verde-txt:#5E7E00;--am-oro:#C9A961;
  --am-campo:#FFFFFF;--am-porcelana:#F4F6F8;--am-linea:#E2E8EE;--am-meta:#5B6573;
}

/* 1 · TIPOGRAFÍA DE TITULARES (sin tocar color) */
h1,h2,
.section-title,.sobre-h2,.cta-final h2,.manifesto h2,
.pillar-content h2,.about-text h2,.resource-body h2{
  font-family:'Sora',sans-serif !important;
  font-weight:800 !important;font-style:normal !important;
  text-transform:uppercase;letter-spacing:-.02em;line-height:1.1;
}
h3{font-family:'Sora',sans-serif !important;font-weight:700 !important;font-style:normal !important}
h1 em,h2 em,h1 i,h2 i,
.cta-final h2 em,.manifesto h2 em,.pillar-content h2 em,
.about-text h2 em,.sobre-h2 em,.resource-body h2 em{
  font-style:normal !important;font-family:inherit !important;
  color:var(--am-brasa-txt) !important;
}

/* 2 · COLOR POR CONTEXTO */
body h1,body h2,
.page-hero h1,.cta-final h2,.pillar-content h2,.about-text h2,.resource-body h2{
  color:var(--am-navy);
}
.advantage h1,.advantage h2,.advantage h3,.advantage .sobre-h2,
.manifesto h1,.manifesto h2,.manifesto h3,
.cx-navy h2,.cx-navy .cx-h2,.cx-navy h3,
.cx-sec-casos h2,.cx-sec-casos .cx-h2,
.footer h1,.footer h2,.footer h3,.footer h4,.footer h5,
[data-fondo="oscuro"] h1,[data-fondo="oscuro"] h2,[data-fondo="oscuro"] h3{
  color:#FFFFFF !important;
}
.advantage h2 em,.manifesto h2 em,.cx-navy h2 em,.cx-sec-casos h2 em,
[data-fondo="oscuro"] h2 em{color:var(--am-verde) !important}
[style*="background: var(--navy)"] h2,[style*="background:var(--navy)"] h2,
[style*="#0A2540"] h2,[style*="#051425"] h2{color:#FFFFFF !important}

/* 3 · HERO INTERIOR + BANDA FOTOGRÁFICA */
.page-hero{background:var(--am-campo);border-bottom:0;text-align:center;position:relative;
  padding-bottom:clamp(1.4rem,2.6vw,2.2rem)}
.page-hero-inner{max-width:900px}
.page-hero h1{font-size:clamp(1.9rem,4.6vw,3.2rem) !important}
.page-hero h1 em{text-decoration:underline;text-decoration-color:var(--am-brasa);
  text-decoration-thickness:.12em;text-underline-offset:.08em}
.page-hero-lede{font-family:'Barlow',sans-serif;color:var(--am-meta);max-width:680px;
  margin-left:auto;margin-right:auto;text-align:center;font-size:1.08rem;line-height:1.65}
.page-hero::after{content:"";display:block;height:170px;margin-top:1.8rem;
  background:var(--am-abismo) url('../img/fotos/ai-textura-bitono.jpg') center 42%/cover;
  border-top:4px solid var(--am-brasa)}
@media(max-width:760px){.page-hero::after{height:110px;margin-top:1.4rem}}

/* 4 · ETIQUETAS Y DATOS */
.section-eyebrow,.eyebrow,.kicker,[class*="eyebrow"]{
  font-family:'IBM Plex Mono',monospace !important;font-size:.92rem !important;
  letter-spacing:.16em;color:var(--am-verde-txt) !important;text-transform:uppercase;
  display:block;text-align:center;
}
.advantage .section-eyebrow,.manifesto .section-eyebrow,
[data-fondo="oscuro"] .section-eyebrow{color:var(--am-verde) !important}

/* 5 · PROHIBICIONES DEL MANUAL */
*{border-radius:0 !important}
[class*="card"],[class*="tier"],[class*="resource"]{box-shadow:none !important}
.btn-eu-ai-act{display:none !important}

/* 6 · BOTONES */
.btn-primary,a.btn-primary{background:var(--am-brasa) !important;color:var(--am-abismo) !important;
  border:2px solid transparent !important;font-family:'Barlow',sans-serif;font-weight:600}
.btn-primary:hover{background:var(--am-brasa-txt) !important;color:#fff !important}
.btn-secondary,a.btn-secondary{background:transparent !important;color:var(--am-navy) !important;
  border:2px solid var(--am-navy) !important}
.btn-secondary:hover{background:var(--am-navy) !important;color:#fff !important}
.advantage .btn-secondary,.manifesto .btn-secondary,[data-fondo="oscuro"] .btn-secondary{
  color:#fff !important;border-color:#fff !important}

/* 7 · COMPACTAR VERTICALES */
main section,body>section{padding-top:clamp(2.2rem,4.5vw,3.6rem) !important;
  padding-bottom:clamp(2.2rem,4.5vw,3.6rem) !important}
h2[style*="margin-top: 4rem"],h2[style*="margin-top:4rem"]{margin-top:2.2rem !important}

/* 8 · CADENA DE TRAZABILIDAD */
.ss-cadena{display:flex;gap:8px;flex-wrap:wrap}
.ss-bloque{display:inline-flex !important;align-items:center;gap:.35em;white-space:nowrap;
  font-size:.72rem !important;padding:.5rem .85rem !important}
.ss-bloque svg{flex:0 0 auto;width:.9em;height:.9em}

/* 9 · BLOG */
.blog-card h2,.blog-card h3,.blog-card-title,.article-card h2,.article-card h3,
[class*="blog"] h2,[class*="blog"] h3,[class*="post"] h2,[class*="post"] h3{
  font-family:'Sora',sans-serif !important;font-weight:700 !important;font-style:normal !important;
  text-transform:none;letter-spacing:-.01em;color:var(--am-navy);
}
.blog-card h2 em,.blog-card h3 em,[class*="blog"] h2 em,[class*="blog"] h3 em{
  font-style:normal !important;color:var(--am-brasa-txt) !important}
.blog-hero h1{font-family:'Sora',sans-serif !important}

/* ═══ v4 · BLOG: los titulares de tarjeta son <h4> (por eso no se unificaban) ═══ */
.blog-item h4,.blog-item h4 a,.blog-item-body h4,.blog-item-body h4 a{
  font-family:'Sora',sans-serif !important;font-weight:700 !important;font-style:normal !important;
  font-size:1.12rem !important;line-height:1.3;letter-spacing:-.01em;
  color:#0A2540 !important;text-decoration:none;text-transform:none;
}
.blog-item:hover h4 a{color:#CC6900 !important}
.blog-meta,.blog-meta span{font-family:'IBM Plex Mono',monospace !important;
  font-size:.72rem !important;letter-spacing:.1em;color:#5E7E00 !important;text-transform:uppercase}
.blog-filter{font-family:'Sora',sans-serif !important;font-weight:600 !important;
  text-transform:uppercase;letter-spacing:.02em;font-size:.8rem !important}
.blog-item{transition:transform .2s ease-out}
.blog-item:hover{transform:translateX(5px)}

/* ═══════════════════════════════════════════════════════════════
   v5 · ESPECIFICIDAD: replicar los selectores exactos de style.css
   style.css usa .page-hero h1{font-weight:400!important} y
   .page-hero h1 em{font-style:italic!important;color:gold!important},
   que ganaban a las reglas genéricas h1/h2. Aquí se igualan y,
   al cargarse después, mandan estas.
   ═══════════════════════════════════════════════════════════════ */

/* ── Titulares grandes: Sora 800 versales (prefijo body = especificidad superior) ── */
body .page-hero h1,
body .hero h1,
body .hero.hero-centered h1,
body .pillar-content h2,
body .cta-final h2,
body .about-text h2,
body .manifesto h2,
body .sobre-h2,
body .resource-body h2,
body .legal-content h2,
body article.resource-card.resource-card-featured h2,
body .blog-featured-preview h2{
  font-family:'Sora',sans-serif !important;
  font-weight:800 !important;
  font-style:normal !important;
  text-transform:uppercase;
  letter-spacing:-.02em !important;
  line-height:1.1 !important;
}

/* ── Subtítulos: Sora 700, caja normal ── */
body .pillar-content h3,
body .pillar-card h3,
body .pillar h3,
.service-row h3,
.blog-card h3,
.blog-featured h3,
.contact-info h3,
.hero-aside h3,
.legal-content h3,
.blog-featured-preview h3{
  font-family:'Sora',sans-serif !important;
  font-weight:700 !important;
  font-style:normal !important;
  text-transform:none;
  letter-spacing:-.01em !important;
}

/* ── Cuartos y quintos niveles ── */
.blog-item h4,.footer-brand h4,.sidebar-card h4{
  font-family:'Sora',sans-serif !important;font-weight:700 !important;font-style:normal !important}
.footer-col h5,.contact-item h5{
  font-family:'Barlow',sans-serif !important;font-weight:600 !important;
  text-transform:uppercase;letter-spacing:.08em}

/* ── ÉNFASIS: nunca cursiva dorada. Naranja tinta, recto ── */
body .page-hero h1 em,
body .hero h1 em,
body .pillar-content h2 em,
body .cta-final h2 em,
body .about-text h2 em,
body .manifesto h2 em,
body .sobre-h2 em,
body .resource-body h2 em,
body .blog-featured-preview h2 em,
body .pillar-content h3 em,
body .service-row h3 em,
body h1 em,body h2 em,body h1 i,body h2 i{
  font-style:normal !important;
  font-family:inherit !important;
  color:#CC6900 !important;
}
/* Sobre fondo oscuro el énfasis pasa a lima (contraste AA) */
.advantage h2 em,.manifesto h2 em,[data-fondo="oscuro"] h2 em,
.advantage .sobre-h2 em{color:#99CC00 !important}

/* ── Cuerpo de texto: Barlow en todo ── */
body,p,li,td,th,input,textarea,select,button,.page-hero-lede,.section-intro{
  font-family:'Barlow',sans-serif}

/* ── Datos verificables: IBM Plex Mono ── */
.section-eyebrow,.eyebrow,[class*="eyebrow"],.blog-meta,.blog-meta span,
.crit-hash,[class*="hash"],[class*="ledger"],code,.mono{
  font-family:'IBM Plex Mono',monospace !important}

/* ═══ v6 · EFECTOS · motor compartido (wow.js) ═══ */
#wow-progreso{position:fixed;top:0;left:0;height:3px;width:0;background:#FF8300;z-index:9999;
  transition:width .1s linear;pointer-events:none}
.wow{opacity:0;transform:translateY(26px);
  transition:opacity .75s cubic-bezier(.16,.84,.44,1),transform .75s cubic-bezier(.16,.84,.44,1)}
.wow.on,.wow.visible{opacity:1;transform:none}
.wow-d1{transition-delay:.08s}.wow-d2{transition-delay:.16s}
.wow-d3{transition-delay:.24s}.wow-d4{transition-delay:.32s}
/* La banda fotográfica del hero entra con zoom lento */
.page-hero::after{background-size:118% auto;transition:background-size 2.4s cubic-bezier(.16,.84,.44,1)}
.page-hero.wow-banda::after{background-size:cover}
/* Tarjetas: elevación al pasar el ratón */
.pillar-card,.resource-card,.crit-card,.tier,.service-row{transition:transform .22s ease-out,border-color .22s}
.pillar-card:hover,.resource-card:hover,.crit-card:hover,.tier:hover{transform:translateY(-6px)}
.blog-item{transition:transform .2s ease-out}
.blog-item:hover{transform:translateX(5px)}
/* Respeto absoluto a la preferencia del usuario */
@media(prefers-reduced-motion:reduce){
  .wow{opacity:1 !important;transform:none !important;transition:none !important}
  .page-hero::after{transition:none;background-size:cover}
}
body.a11y-no-motion .wow{opacity:1 !important;transform:none !important}