/* ============================================================
   Biblioteca FECCUM — componentes de "ficha excepcional" (fx-*)
   CSS condicional: se encola solo en artículos (single post).
   Tokens de marca; contraste AA; responsive.
   ============================================================ */

/* ---------- Resumen en 30 segundos (hero de la ficha) ---------- */
.fx-resumen { position: relative; overflow: hidden; background: linear-gradient(135deg, var(--granate), var(--vino) 60%, var(--vino-osc)); color: var(--crema); border-radius: var(--r-lg); padding: clamp(20px, 4vw, 30px); margin: 0 0 1.6rem; }
.fx-resumen::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 85% 15%, rgba(212, 175, 55, .35), transparent 45%); }
.fx-resumen-eyebrow { position: relative; display: inline-flex; align-items: center; gap: .5rem; font: 700 .72rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--oro-claro); margin-bottom: .6rem; }
.fx-resumen p { position: relative; margin: 0; font: 400 1.08rem/1.65 var(--sans); color: var(--crema); }
.fx-resumen p strong { color: #fff; }
.fx-resumen-e { position: absolute; right: -10px; bottom: -18px; font-size: 6rem; opacity: .12; pointer-events: none; }

/* ---------- Cifras clave ---------- */
.fx-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 0 0 1.8rem; }
.fx-stat { background: var(--blanco); border: 1px solid var(--linea); border-top: 3px solid var(--oro); border-radius: 14px; padding: 14px 16px; text-align: center; }
.fx-stat b { display: block; font: 400 1.7rem/1.1 var(--serif); color: var(--vino); }
.fx-stat span { font: 500 .78rem/1.35 var(--sans); color: var(--gris); display: block; margin-top: .25rem; }

/* ---------- Semáforo (tranquila / obsérvalo / consulta ya) ---------- */
.fx-semaforo { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 1.4rem 0 1.8rem; }
.fx-sem { border-radius: 16px; padding: 16px 16px 14px; border: 1px solid; }
.fx-sem h3 { display: flex; align-items: center; gap: .5rem; margin: 0 0 .6rem; font: 700 .85rem/1.2 var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.fx-sem ul { margin: 0; padding-left: 1.1rem; }
.fx-sem li { font: 400 .9rem/1.55 var(--sans); margin-bottom: .45rem; }
.fx-sem-ok  { background: #EAF5EE; border-color: #cfe7d8; }  .fx-sem-ok h3  { color: #1D5C33; }  .fx-sem-ok li  { color: #1D4A2E; }
.fx-sem-mid { background: #F9F1DC; border-color: #ecdcae; }  .fx-sem-mid h3 { color: #7a5c0d; }  .fx-sem-mid li { color: #5f4a10; }
.fx-sem-alt { background: #F7E9ED; border-color: #eacdd6; }  .fx-sem-alt h3 { color: var(--vino); } .fx-sem-alt li { color: #5a1024; }

/* ---------- Pasos (línea de tiempo numerada) ---------- */
.fx-pasos { list-style: none; margin: 1.2rem 0 1.8rem; padding: 0; counter-reset: fxp; }
.fx-pasos li { position: relative; counter-increment: fxp; padding: 0 0 1.35rem 58px; }
.fx-pasos li::before { content: counter(fxp); position: absolute; left: 0; top: 0; width: 38px; height: 38px; border-radius: 50%; background: var(--vino); color: var(--oro-claro); font: 700 1rem/38px var(--sans); text-align: center; box-shadow: 0 0 0 3px rgba(212, 175, 55, .35); }
.fx-pasos li::after { content: ""; position: absolute; left: 18.5px; top: 44px; bottom: 4px; width: 1.5px; background: var(--linea); }
.fx-pasos li:last-child::after { display: none; }
.fx-pasos b { display: block; font: 600 1.02rem/1.3 var(--sans); color: var(--tinta); margin-bottom: .2rem; }
.fx-pasos p { margin: 0; font: 400 .95rem/1.6 var(--sans); color: var(--gris); }

/* ---------- Tabla comparativa ---------- */
.fx-tabla-wrap { overflow-x: auto; margin: 1.2rem 0 1.8rem; border: 1px solid var(--linea); border-radius: var(--r-md); }
table.fx-tabla { width: 100%; border-collapse: collapse; font: 400 .9rem/1.5 var(--sans); min-width: 560px; }
.fx-tabla th { background: var(--vino); color: var(--crema); text-align: left; font: 700 .78rem/1.3 var(--sans); letter-spacing: .05em; text-transform: uppercase; padding: 12px 14px; }
.fx-tabla td { padding: 12px 14px; border-top: 1px solid var(--linea); vertical-align: top; color: var(--tinta); }
.fx-tabla tr:nth-child(even) td { background: var(--marfil); }
.fx-tabla td b { color: var(--vino); }

/* ---------- Mito / Realidad ---------- */
.fx-mitos { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; margin: 1.2rem 0 1.8rem; }
.fx-mito { background: var(--blanco); border: 1px solid var(--linea); border-radius: 16px; padding: 16px 18px; }
.fx-mito .m { display: block; font: 700 .72rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--granate); margin-bottom: .35rem; }
.fx-mito .m::before { content: "✕ Mito: "; }
.fx-mito .r { display: block; font: 700 .72rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: #1D5C33; margin: .7rem 0 .35rem; }
.fx-mito .r::before { content: "✓ Realidad: "; }
.fx-mito p { margin: 0; font: 400 .92rem/1.55 var(--sans); color: var(--tinta); }

/* ============================================================
   K6 — componentes de guías descargables
   ============================================================ */

/* ---------- Banner "guía descargable" (fx-dl) ---------- */
.fx-dl { display: flex; align-items: center; gap: 14px; background: var(--marfil); border: 1.5px dashed var(--oro); border-radius: var(--r-md); padding: 14px 18px; margin: 0 0 1.8rem; }
.fx-dl-ico { font-size: 1.6rem; line-height: 1; }
.fx-dl p { margin: 0; flex: 1; font: 400 .92rem/1.5 var(--sans); color: var(--tinta); }
.fx-dl-btn { flex-shrink: 0; display: inline-block; background: var(--vino); color: var(--crema); font: 700 .82rem/1 var(--sans); letter-spacing: .03em; padding: 12px 18px; border-radius: 999px; text-decoration: none; transition: background .2s ease, transform .2s ease; }
.fx-dl-btn:hover { background: var(--granate); transform: translateY(-1px); color: var(--crema); }
/* K10: .content a ganaba en especificidad y pintaba el botón granate-sobre-vino (1.27:1). */
.content a.fx-dl-btn { color: var(--crema); text-decoration: none; }
.content a.fx-dl-btn:hover { color: var(--crema); }

/* ---------- Checklist imprimible (fx-check) ---------- */
.fx-check { list-style: none; margin: 1.2rem 0 1.8rem; padding: 0; }
.fx-check li { position: relative; padding: 0 0 .85rem 40px; font: 400 .96rem/1.6 var(--sans); color: var(--gris); }
.fx-check li b { color: var(--tinta); font-weight: 600; }
.fx-check li::before { content: ""; position: absolute; left: 4px; top: 3px; width: 19px; height: 19px; border: 2px solid var(--oro); border-radius: 6px; background: var(--blanco); box-shadow: inset 0 0 0 2px var(--blanco); }

/* ---------- Línea de días (fx-dias) ---------- */
.fx-dias { list-style: none; margin: 1.2rem 0 1.8rem; padding: 0; }
.fx-dias li { position: relative; display: flex; gap: 16px; padding: 0 0 1.35rem; }
.fx-dias li::before { content: ""; position: absolute; left: 37px; top: 30px; bottom: 2px; width: 1.5px; background: var(--linea); }
.fx-dias li:last-child::before { display: none; }
.fx-dias .fxd-b { flex-shrink: 0; width: 76px; text-align: center; align-self: flex-start; background: var(--vino); color: var(--oro-claro); font: 700 .7rem/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; padding: 8px 6px; border-radius: 999px; box-shadow: 0 0 0 3px rgba(212, 175, 55, .3); position: relative; z-index: 1; }
.fx-dias .fxd-c b { display: block; font: 600 1.02rem/1.3 var(--sans); color: var(--tinta); margin-bottom: .2rem; }
.fx-dias .fxd-c p { margin: 0; font: 400 .95rem/1.6 var(--sans); color: var(--gris); }

/* ---------- Qué decir / qué evitar (fx-frases) ---------- */
.fx-frases { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; margin: 1.2rem 0 1.8rem; }
.fx-frase { border-radius: 16px; padding: 16px 18px; border: 1px solid; }
.fx-frase::before { display: block; font: 700 .7rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; margin-bottom: .5rem; }
.fx-frase.si { background: #EAF5EE; border-color: #cfe7d8; }
.fx-frase.si::before { content: "✓ Ayuda decir"; color: #1D5C33; }
.fx-frase.no { background: #F7E9ED; border-color: #eacdd6; }
.fx-frase.no::before { content: "✕ Mejor evita"; color: var(--vino); }
.fx-frase .q { display: block; font: 400 1.05rem/1.45 var(--serif); font-style: italic; color: var(--tinta); margin-bottom: .45rem; }
.fx-frase p { margin: 0; font: 400 .88rem/1.5 var(--sans); color: var(--gris); }

/* ---------- Medidor de evidencia (fx-evi) ---------- */
.fx-evi { margin: 1.2rem 0 1.8rem; border: 1px solid var(--linea); border-radius: var(--r-md); overflow: hidden; }
.fx-evi-row { padding: 16px 18px; background: var(--blanco); }
.fx-evi-row + .fx-evi-row { border-top: 1px solid var(--linea); }
.fx-evi-row:nth-child(even) { background: var(--marfil); }
.fx-evi-h { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-bottom: .4rem; }
.fx-evi-h b { font: 600 1rem/1.3 var(--sans); color: var(--tinta); }
.fx-evi-dots { display: inline-flex; gap: 4px; }
.fx-evi-dots i { width: 10px; height: 10px; border-radius: 50%; background: var(--linea); }
.fx-evi-dots i.on { background: var(--oro); }
.fx-evi-badge { font: 700 .68rem/1.2 var(--sans); letter-spacing: .05em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; }
.fx-evi-badge.e3 { background: #EAF5EE; color: #1D5C33; }
.fx-evi-badge.e2 { background: #F9F1DC; color: #7a5c0d; }
.fx-evi-badge.e1 { background: #EFE9E7; color: var(--gris); }
.fx-evi-badge.e0 { background: #F7E9ED; color: var(--vino); }
.fx-evi-row p { margin: 0; font: 400 .92rem/1.55 var(--sans); color: var(--gris); }
.fx-evi-row p strong { color: var(--tinta); }

/* ---------- responsive ---------- */
@media (max-width: 760px) {
	.fx-semaforo { grid-template-columns: 1fr; }
	.fx-dl { flex-direction: column; align-items: flex-start; }
}
.fx-semaforo--uno { grid-template-columns: 1fr; }

/* ============================================================
   Impresión: la guía se vuelve un PDF limpio con marca FECCUM
   ============================================================ */
@media print {
	.nav, .foot-cta, footer.site, .related, .skip-link, .cg-cta, .fx-dl, #wpadminbar, .post-nav { display: none !important; }
	* { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	body { background: #fff !important; }
	.content { max-width: 100% !important; padding: 0 !important; }
	.content::before { content: "FECCUM · Fundación de Endometriosis Colombia y Cuidado de la Mujer"; display: block; font: 700 .72rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--vino); border-bottom: 2px solid var(--oro); padding-bottom: 8px; margin-bottom: 18px; }
	.fx-sem, .fx-mito, .fx-frase, .fx-stat, .fx-evi-row, .fx-dias li, .fx-pasos li, .fx-check li, details { break-inside: avoid; }
	h2, h3 { break-after: avoid; }
	.fx-resumen { border-radius: 12px; }
	a { color: inherit; text-decoration: none; }
}

/* ============================================================
   K7 — página "Empieza aquí" (rutas guiadas ea-*)
   ============================================================ */
.ea-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 1.6rem 0 1.4rem; }
.ea-card { position: relative; overflow: hidden; background: var(--blanco); border: 1px solid var(--linea); border-top: 4px solid var(--ea-acc, var(--vino)); border-radius: var(--r-lg); padding: 24px 24px 20px; box-shadow: var(--sombra); }
.ea-sospecha    { --ea-acc: #8A1538; }
.ea-diagnostico { --ea-acc: #6E1024; }
.ea-adolescente { --ea-acc: #C2185B; }
.ea-apoyo       { --ea-acc: #8A6508; } /* K10: AA sobre tinte y en círculos */
.ea-emoji { position: absolute; right: -8px; top: -12px; font-size: 5rem; opacity: .1; pointer-events: none; }
.ea-eyebrow { display: inline-block; font: 700 .68rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ea-acc, var(--vino)); background: color-mix(in srgb, var(--ea-acc, var(--vino)) 9%, #fff); padding: 6px 12px; border-radius: 999px; margin-bottom: .8rem; }
.ea-card h2 { font: 400 1.45rem/1.25 var(--serif); color: var(--tinta); margin: 0 0 .5rem; }
.ea-intro { font: 400 .92rem/1.55 var(--sans); color: var(--gris); margin: 0 0 1.1rem; }
.ea-pasos { list-style: none; counter-reset: eap; margin: 0 0 1.1rem; padding: 0; }
.ea-pasos li { counter-increment: eap; }
.ea-pasos a { position: relative; display: block; padding: .6rem .6rem .6rem 44px; border-radius: 12px; text-decoration: none; transition: background .18s ease; }
.ea-pasos a::before { content: counter(eap); position: absolute; left: 6px; top: .68rem; width: 26px; height: 26px; border-radius: 50%; background: var(--ea-acc, var(--vino)); color: #fff; font: 700 .8rem/26px var(--sans); text-align: center; }
.ea-pasos a:hover, .ea-pasos a:focus-visible { background: var(--marfil); }
.ea-pasos b { display: block; font: 600 .98rem/1.3 var(--sans); color: var(--tinta); }
.ea-pasos a:hover b { color: var(--vino); }
.ea-pasos span { display: block; font: 400 .85rem/1.45 var(--sans); color: var(--gris); margin-top: .15rem; }
.ea-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-top: 1px solid var(--linea); padding-top: 14px; }
.ea-tiempo { font: 500 .8rem/1.3 var(--sans); color: var(--gris); }
.ea-extra { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; background: var(--marfil); border: 1px solid var(--linea); border-radius: var(--r-md); padding: 18px 22px; margin: 0 0 1rem; }
.ea-extra p { margin: 0; flex: 1 1 320px; font: 400 .95rem/1.55 var(--sans); color: var(--gris); }
.ea-extra p strong { color: var(--tinta); }
@media (max-width: 860px) {
	.ea-grid { grid-template-columns: 1fr; }
}
.content .ea-pasos a, .content .ea-extra a { text-decoration: none; }
.content .ea-extra a { color: var(--vino); font-weight: 600; border-bottom: 1.5px solid var(--oro); }

/* ============================================================
   K8 — blog vivo: caja de autor aliado (alb) y webinars (wb)
   ============================================================ */
.alb { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; background: var(--blanco); border: 1px solid var(--linea); border-left: 4px solid var(--vino); border-radius: var(--r-md); padding: 16px 20px; margin: 0 0 1.6rem; }
.alb-foto { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; margin: 0 !important; box-shadow: 0 0 0 3px rgba(212, 175, 55, .4); }
.alb-tx { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 2px; }
.alb-eyebrow { font: 700 .66rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gris); }
.alb-tx strong { font: 600 1.1rem/1.3 var(--sans); color: var(--tinta); }
.alb-cargo { font: 400 .88rem/1.4 var(--sans); color: var(--gris); }
.alb-band { font: 700 .7rem/1.4 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--vino); }
.content a.alb-link { font: 600 .85rem/1.3 var(--sans); color: var(--vino); text-decoration: none; border-bottom: 1.5px solid var(--oro); white-space: nowrap; }
.alb-nota { font: 400 .85rem/1.55 var(--sans); color: var(--gris); background: var(--marfil); border-radius: 12px; padding: 12px 16px; margin-top: 1.6rem; }

.wb-lista { display: flex; flex-direction: column; gap: 12px; margin: 1rem 0 2rem; }
.wb-card { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--r-md); padding: 16px 20px; }
.wb-fecha { flex-shrink: 0; width: 64px; text-align: center; background: var(--vino); color: var(--crema); border-radius: 14px; padding: 10px 6px; }
.wb-fecha b { display: block; font: 400 1.6rem/1 var(--serif); color: var(--oro-claro); }
.wb-fecha span { font: 700 .68rem/1.4 var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.wb-tx { flex: 1; min-width: 240px; }
.wb-tx h3 { margin: 0 0 .25rem; font: 600 1.1rem/1.3 var(--sans); color: var(--tinta); }
.wb-meta { margin: 0; font: 600 .82rem/1.4 var(--sans); color: var(--vino); }
.wb-desc { margin: .35rem 0 0; font: 400 .9rem/1.5 var(--sans); color: var(--gris); }
.wb-vacio { background: var(--marfil); border: 1.5px dashed var(--oro); border-radius: var(--r-md); padding: 20px 22px; margin: 1rem 0 2rem; }
.wb-vacio p { margin: 0 0 .8rem; font: 400 .95rem/1.6 var(--sans); color: var(--gris); }
.wb-vacio p:last-child { margin-bottom: 0; }
.wb-vacio strong { color: var(--tinta); }
.wb-nota { font: 400 .92rem/1.6 var(--sans); color: var(--gris); font-style: italic; }
.wb-como h2 { margin-top: 0; }