/* ================= BLOG (07-oct) =================
   /blog/ y /blog/<slug>/, generados por scripts/generar-blog.py. Se carga SÓLO en el blog, encima de site-vN.css:
   reutiliza la plantilla .doc de las legales (cabecera navy + hoja clara .doc__body, que repone los tokens claros).
   El nombre es la versión (el borde de capohealth.com ignora ?v=): si hay que cambiarlo y que se vea ya, blog-v2.css
   y se actualiza BLOG_CSS en el generador.
   Contraste medido (WCAG): #18709F sobre #FBFDFF 5.34 y sobre #EEF6FC 4.98 · #44546B sobre #FBFDFF 7.55 ·
   #BDE1F5 sobre #141B2E 12.44 · #D5DEF0 sobre #243162 9.19 · #9CAAD4 sobre #141B2E 7.43 ·
   #141B2E sobre botón #8FCDEE 9.9. El cyan de marca sólo como fondo de botón o adorno. */

.post [id]{scroll-margin-top:calc(var(--nav-h) + var(--lang-h,0px) + 22px)}

/* --- cabecera (sobre navy) --- */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.45em;margin:0 0 1.2rem;font-size:.84rem;color:#9CAAD4}
.crumbs a{color:#BDE1F5;text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs span:last-child{color:#9CAAD4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:46ch}
.post .doc__head h1{font-size:clamp(2rem,4.6vw,3.1rem);line-height:1.1;max-width:24ch}
.doc__head .post__dek{color:#D5DEF0;font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.6;max-width:62ch;margin:1rem 0 1.3rem}
.doc__head .post__by{display:flex;flex-wrap:wrap;gap:.35rem .75rem;margin:0;font-size:.86rem;color:#BDE1F5}
.post__by span{display:inline-flex;align-items:center;gap:.75rem}
/* el punto va DESPUÉS de cada dato: si la línea se parte en móvil, queda al final y no colgando al inicio */
.post__by span:not(:last-child)::after{content:"";width:4px;height:4px;border-radius:50%;background:#637ABB}
.doc__head .post__by a{color:#fff}

/* --- hoja de lectura --- */
.post .doc__body{font-size:1.06rem}
.post .doc__body p,.post .doc__body li{font-size:1.06rem;line-height:1.75}
.post .doc__body p{margin:0 0 1.05rem}
.post .doc__body ul,.post .doc__body ol{margin:0 0 1.3rem}
.post .doc__body li{margin:.4rem 0}
.post .doc__body li::marker{color:#18709F}
.post .doc__body h2{font-size:clamp(1.4rem,2.6vw,1.85rem);line-height:1.2;margin:3rem 0 .9rem;letter-spacing:-.02em}
.post .doc__body h3{font-size:1.15rem;margin:1.8rem 0 .6rem}
.post .doc__body strong,.post .doc__body b{color:#141B2E}
.post__label{font-family:var(--fd);font-size:.74rem !important;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:#18709F !important;margin:0 0 .7rem !important}

/* intro + foto */
.post__lead{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(22px,3.4vw,40px);align-items:start}
.post__intro p:first-child{font-size:1.14rem !important;color:#141B2E !important}
.post__fig{margin:0}
.post__fig img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);
  box-shadow:0 18px 44px rgba(20,27,46,.14)}
.post__fig figcaption{margin-top:.55rem;font-size:.78rem;color:#44546B}

/* key takeaways */
.post__tldr{margin:2.2rem 0 1.6rem;padding:1.5rem 1.7rem;border-radius:var(--r);background:#EEF6FC;border:1px solid #CFE5F3}
.post__tldr ul{list-style:none;padding:0 !important;margin:0 !important;display:grid;gap:.6rem}
.post__tldr li{position:relative;padding-left:1.9rem;margin:0 !important}
.post__tldr li::before{content:"";position:absolute;left:0;top:.38em;width:1.15rem;height:1.15rem;border-radius:50%;
  background:#18709F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/70% no-repeat}

/* índice */
.post__toc{margin:0 0 1rem;padding:1.2rem 1.5rem;border:1px solid var(--line);border-radius:var(--r)}
.post__toc ol{columns:2;column-gap:2.4rem;margin:0 !important;padding-left:1.3rem}
.post__toc li{break-inside:avoid;font-size:.96rem !important;margin:.25rem 0 !important}
.post__toc a{text-decoration:none}
.post__toc a:hover{text-decoration:underline}
@media(max-width:640px){.post__toc ol{columns:1}}

/* bloque de definición (fragmento destacado / respuesta para IA) */
.post .doc__body .post__def{margin:0 0 1.4rem;padding:1.15rem 1.4rem;border-left:4px solid #3C5089;border-radius:0 14px 14px 0;
  background:#F3F7FB;color:#141B2E;font-size:1.1rem}

/* listas numeradas en tarjeta: los 5 pasos y la verificación */
.post .doc__body .post__glance{list-style:none;counter-reset:s;padding:0;margin:1.1rem 0 1.4rem;display:grid;gap:.65rem}
.post .doc__body .post__glance li{counter-increment:s;display:grid;grid-template-columns:2.3rem 1fr;gap:1rem;align-items:start;
  margin:0;padding:.95rem 1.1rem;border:1px solid var(--line);border-radius:14px;background:#fff}
.post__glance li::before{content:counter(s);display:grid;place-items:center;width:2.3rem;height:2.3rem;border-radius:50%;
  background:#3C5089;color:#fff;font-family:var(--fh);font-weight:700;font-size:.98rem}
.post__glance--check li::before{background:#18709F}
.post__glance a{text-decoration:none}
.post .doc__body .post__glance a b{color:#18709F}
.post__glance a:hover b{text-decoration:underline}

/* CTA a mitad de texto */
.post__cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 1.6rem;margin:2.2rem 0 .6rem;
  padding:1.35rem 1.6rem;border-radius:var(--r);background:linear-gradient(120deg,#141B2E 0%,#243162 100%)}
.post .doc__body .post__cta p{margin:0;max-width:46ch;color:#D5DEF0}
.post .doc__body .post__cta b{color:#fff}
.doc__body a.btn{--bg:#8FCDEE;--fg:#141B2E;color:var(--fg);text-decoration:none}
.doc__body a.btn:hover{--fg:#141B2E}

/* FAQ en HTML (sin JS: details/summary) */
.post__faq{border-top:1px solid var(--line);margin-bottom:.4rem}
.post__faq details{border-bottom:1px solid var(--line)}
.post__faq summary{position:relative;display:block;cursor:pointer;list-style:none;padding:1.05rem 2.6rem 1.05rem 0}
.post__faq summary::-webkit-details-marker{display:none}
.post__faq summary h3{margin:0 !important;font-size:1.08rem !important;line-height:1.4;color:#141B2E}
.post__faq summary::after{content:"";position:absolute;right:.35rem;top:50%;width:.7rem;height:.7rem;margin-top:-.5rem;
  border-right:2px solid #18709F;border-bottom:2px solid #18709F;transform:rotate(45deg);transition:transform .3s var(--ease)}
.post__faq details[open] summary::after{transform:rotate(-135deg);margin-top:-.15rem}
.post__faq summary:focus-visible{outline:2px solid #18709F;outline-offset:4px;border-radius:6px}
.post__faq details > div{padding:0 0 .5rem}

/* banda de cierre */
.post__band{margin:3rem 0 0;padding:clamp(26px,4.4vw,44px);border-radius:var(--rl);text-align:center;
  background:radial-gradient(560px 280px at 85% 0%,rgba(143,205,238,.26),transparent 70%),linear-gradient(135deg,#141B2E 0%,#2F3E6A 100%)}
.post .doc__body .post__band-t{margin:0 0 .6rem;font-family:var(--fh);font-weight:700;font-size:clamp(1.45rem,2.8vw,1.95rem);
  line-height:1.2;letter-spacing:-.02em;color:#fff}
.post .doc__body .post__band p{color:#D5DEF0;max-width:52ch;margin-inline:auto}
.post__band small{display:block;margin:1.2rem auto 0;max-width:60ch;font-size:.84rem;line-height:1.6;color:#BDE1F5}

/* firma y fuentes */
.post__about{margin:2.6rem 0 0;padding:1.2rem 1.4rem;border:1px solid var(--line);border-radius:var(--r);background:#F3F7FB}
.post .doc__body .post__about p{margin:0;font-size:.95rem}
.post .doc__body .post__sources li{font-size:.92rem;line-height:1.6;overflow-wrap:anywhere}

@media(max-width:720px){
  .post__lead{grid-template-columns:1fr}
  .post__fig{order:-1}
  .post__fig img{aspect-ratio:4/3;object-position:50% 30%}
}
@media(max-width:560px){
  .post .doc__body .post__glance li{grid-template-columns:2rem 1fr;gap:.8rem;padding:.85rem .9rem}
  .post__glance li::before{width:2rem;height:2rem;font-size:.9rem}
  .post__cta{padding:1.2rem}
}

/* --- índice /blog/ --- */
.bloglist{display:grid;gap:1.2rem}
.doc__body a.bcard{display:grid;grid-template-columns:minmax(150px,210px) 1fr;gap:1.5rem;align-items:center;padding:1.1rem;
  border:1px solid var(--line);border-radius:var(--r);background:#fff;color:inherit;text-decoration:none;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.doc__body a.bcard:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(20,27,46,.12)}
.bcard img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:14px}
.bcard__meta{margin:0 0 .4rem !important;font-size:.8rem !important;font-weight:600;letter-spacing:.06em;color:#18709F !important}
.post .doc__body .bcard h2{margin:0 0 .6rem;font-size:clamp(1.25rem,2.2vw,1.6rem)}
.post .doc__body .bcard p{margin:0 0 .8rem}
.bcard__more{font-weight:600;color:#18709F}
.post .doc__body .doc__note{margin-top:1.4rem;font-size:.86rem}
@media(max-width:620px){.doc__body a.bcard{grid-template-columns:1fr}.bcard img{aspect-ratio:16/10;object-position:50% 30%}}