/* ============================================================
   Insights · Artículo del blog
   Misma línea que la página del blog (insights.css + blog.css). El texto
   del artículo (.single-body) conserva los estilos de contenido del tema.
   ============================================================ */

/* Espacio bajo la cabecera fija del tema */
html body #hero.hero-single{padding-top:calc(var(--zin-header-h,96px) + 40px);padding-bottom:0}
#main.zin-post-wrap{background:#fff}
html body #main.zin-post-wrap > section#single.zin-post{padding:0 0 72px}

.zin-post__layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:72px;align-items:start}
.zin-post__article{min-width:0;max-width:820px}

/* Cabecera del artículo */
.zin-post__head{display:flex;flex-direction:column;gap:18px;margin-bottom:36px}
body.zin-landing .zin-main .zin-post__crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;font-weight:600;line-height:16px;letter-spacing:.08em;text-transform:uppercase;color:var(--zin-sep)}
body.zin-landing .zin-main .zin-post__crumbs a{color:var(--zin-orange);transition:color .2s}
body.zin-landing .zin-main .zin-post__crumbs a:hover{color:#D94E1F;text-decoration:underline;text-underline-offset:3px}
body.zin-landing .zin-main h1.zin-post__title{font-size:44px;font-weight:700;line-height:52px;letter-spacing:-.01em;color:var(--zin-ink)}
body.zin-landing .zin-main .zin-post__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:15px;line-height:20px;color:var(--zin-grey-2)}

/* Imagen principal: como en el listado del blog (sombra naranja sólida del tema) */
.zin-post__cover{margin:0 0 48px}
#main section .zin-post__cover img{display:block;width:100%;height:auto;max-height:520px;object-fit:cover;border-radius:16px}

/* Texto del artículo: el estilo del tema, con un poco más de aire */
body.single-post #single .single-body{font-size:17px;line-height:1.7;color:#2B2B2B}
body.single-post #single .single-body > * + *{margin-top:1.1em}
body.single-post #single .single-body h2{margin-top:2.2em;scroll-margin-top:calc(var(--zin-header-h,96px) + 24px)}
body.single-post #single .single-body h3{margin-top:1.7em;scroll-margin-top:calc(var(--zin-header-h,96px) + 24px)}
body.single-post #single .single-body img{border-radius:12px}

/* Categorías y etiquetas */
.zin-post__foot{display:flex;flex-wrap:wrap;gap:8px;margin-top:48px;padding-top:28px;border-top:1px solid var(--zin-line)}
body.zin-landing .zin-main .zin-post__chip{display:inline-flex;align-items:center;padding:8px 14px;border:1px solid var(--zin-line);border-radius:100px;font-size:14px;font-weight:500;line-height:16px;color:var(--zin-grey);transition:border-color .2s,color .2s}
body.zin-landing .zin-main .zin-post__chip--cat{border-color:var(--zin-peach-line);background:var(--zin-tint);color:var(--zin-orange)}
body.zin-landing .zin-main .zin-post__chip:hover{border-color:var(--zin-orange);color:var(--zin-orange)}

/* Columna derecha: índice y contacto, fijos al hacer scroll */
.zin-post__side{align-self:stretch}
.zin-post__sticky{position:sticky;top:calc(var(--zin-header-h,96px) + 24px);display:flex;flex-direction:column;gap:20px}

/* Índice */
.zin-toc{display:flex;flex-direction:column;gap:14px}
.zin-toc--side{padding:24px 22px;border:1px solid var(--zin-line);border-radius:20px;background:var(--zin-cream)}
.zin-toc__list{position:relative;max-height:calc(100vh - var(--zin-header-h,96px) - 380px);min-height:120px;overflow:auto;counter-reset:zin-toc;scrollbar-width:thin}
body.zin-landing .zin-main .zin-toc__list li{margin:0}
body.zin-landing .zin-main .zin-toc__list a{display:block;padding:9px 0 9px 16px;border-left:2px solid var(--zin-line);font-size:14px;font-weight:500;line-height:19px;color:var(--zin-grey);transition:color .2s,border-color .2s}
body.zin-landing .zin-main .zin-toc__list a:hover{color:var(--zin-ink)}
body.zin-landing .zin-main .zin-toc__list a.is-active{border-left-color:var(--zin-orange);color:var(--zin-orange);font-weight:600}

/* Índice en móvil y tableta: desplegable sobre el texto */
.zin-toc--movil{display:none}
.zin-toc--movil summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;cursor:pointer;list-style:none;font-size:15px;font-weight:600;line-height:18px;color:var(--zin-ink)}
.zin-toc--movil summary::-webkit-details-marker{display:none}
.zin-toc--movil summary .zin-arrow{color:var(--zin-orange);transition:rotate .2s}
.zin-toc--movil[open] summary .zin-arrow{rotate:-90deg}
.zin-toc--movil .zin-toc__list{max-height:none;padding:0 20px 14px}

/* Debajo del artículo: descargables y relacionados */
.zin-post-more{padding:72px 0 104px;background:var(--zin-cream)}
body.zin-landing .zin-post-more{font-family:var(--zin-font)}
.zin-post-more > .zin-container{display:flex;flex-direction:column;gap:72px}
.zin-post-dl{display:grid;grid-template-columns:260px minmax(0,1fr) auto;align-items:center;gap:40px;padding:28px 32px;border:1px solid var(--zin-line);border-radius:24px;background:#fff}
.zin-post-dl__cover{margin:0}
.zin-post-dl__txt{display:flex;flex-direction:column;gap:10px}
.zin-post-dl .zin-bside__btn{margin-top:0}
.zin-post-rel{display:flex;flex-direction:column;gap:36px}
.zin-post-rel__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
body.zin-landing .zin-main .zin-post-rel__title{font-size:34px;font-weight:600;line-height:41px;color:var(--zin-ink)}
body.zin-landing .zin-main .zin-post-rel__all{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:600;line-height:18px;color:var(--zin-orange)}
body.zin-landing .zin-main .zin-post-rel__all:hover .zin-arrow{transform:translateX(3px)}
.zin-post-rel__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}

/* Responsive */
@media (max-width:1200px){
  .zin-post__layout{grid-template-columns:minmax(0,1fr) 300px;gap:48px}
  body.zin-landing .zin-main h1.zin-post__title{font-size:38px;line-height:46px}
}
@media (max-width:1024px){
  .zin-post__layout{grid-template-columns:minmax(0,1fr)}
  .zin-post__article{max-width:none}
  .zin-toc--side{display:none}
  .zin-toc--movil{display:block;margin:0 0 36px;border:1px solid var(--zin-line);border-radius:16px;background:var(--zin-cream)}
  .zin-post__sticky{position:static}
  .zin-post__side{max-width:560px}
  .zin-post-dl{grid-template-columns:200px minmax(0,1fr);gap:28px}
  .zin-post-dl .zin-bside__btn{grid-column:2;justify-self:start}
  .zin-post-rel__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .zin-post-rel__grid > :nth-child(3){display:none}
}
@media (max-width:760px){
  html body #hero.hero-single{padding-top:calc(var(--zin-header-h,72px) + 24px)}
  body.zin-landing .zin-main h1.zin-post__title{font-size:30px;line-height:37px}
  .zin-post__head{gap:14px;margin-bottom:28px}
  .zin-post__cover{margin-bottom:32px}
  body.single-post #single .single-body{font-size:16px}
  .zin-post-more{padding:56px 0 72px}
  .zin-post-more > .zin-container{gap:56px}
  .zin-post-dl{grid-template-columns:1fr;padding:22px;gap:18px}
  .zin-post-dl .zin-bside__btn{grid-column:auto}
  .zin-post-rel__head{flex-direction:column;align-items:flex-start;gap:10px}
  body.zin-landing .zin-main .zin-post-rel__title{font-size:28px;line-height:34px}
  .zin-post-rel__grid{grid-template-columns:1fr;gap:44px}
  .zin-post-rel__grid > :nth-child(3){display:flex}
}
