/* ============================================================================
   SEGURATIS · ÍNDICE DE BLOG Y AUTOR
   static/*-blog-indice.html · *-blog-categoria.html · *-autor.html
   ============================================================================ */

/* ---- Índice de blog ------------------------------------------------------ */
.blog-hero        { padding: 14px 0 26px; }
.blog-hero__migas { position: relative; z-index: 1; }
.blog-hero__inner { position: relative; z-index: 1; }
.blog-hero__blob--1 { top: 66px; right: 9%; width: 42px; height: 42px; background: var(--c-blob-warm); }
.blog-hero__blob--2 { bottom: -16px; right: 24%; width: 34px; height: 34px; background: var(--c-blob-soft); animation-delay: .9s; }

.blog-hero__h1        { margin-top: 16px; }
.blog-hero__lead      { margin-top: 12px; }
.blog-hero__buscador  { margin-top: 18px; }

@media (min-width: 1024px) {
  .blog-hero { padding: 16px 0 0; }
  .blog-hero__inner { padding-top: 34px; padding-bottom: 52px; }
  .blog-hero__h1    { margin-top: 0; max-width: 20ch; }
  .blog-hero__lead  { margin-top: 22px; max-width: 60ch; }
  .blog-hero__buscador { margin-top: 26px; max-width: 420px; }
}

.blog-chips .subnav__row { gap: 8px; }

.blog-cuerpo   { padding: 22px var(--pad-x-m) 0; }
.blog-listado__h2    { margin-top: 24px; }
.blog-listado__grid  { display: grid; gap: 10px; margin-top: 16px; }
.blog-listado__vacio { margin-top: 24px; font-size: 16px; line-height: 1.6; color: var(--c-ink-2); }

/* Enlace a la madre comercial · lo que evita canibalizarla */
.blog-madre {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px; margin-bottom: 16px;
}
.blog-madre__txt    { display: block; min-width: 0; }
.blog-madre__titulo { display: block; margin-top: 8px; font-size: 19px; line-height: 1.2; font-weight: 800; letter-spacing: -.025em; color: var(--c-ink); }
.blog-madre__claim  { display: block; margin-top: 6px; font-size: 15px; line-height: 1.5; color: var(--c-ink-2); }

.blog-destacado         { display: block; }
.blog-destacado__foto   { width: 100%; aspect-ratio: 16 / 9; border-radius: var(--r); object-fit: cover; align-items: flex-end; padding: 12px; }
/* El padding solo lo necesita la etiqueta del placeholder. */
img.blog-destacado__foto { padding: 0; }
.blog-destacado__txt    { display: block; margin-top: 14px; }
.blog-destacado__titulo { display: block; margin-top: 10px; font-size: 21px; line-height: 1.22; font-weight: 800; letter-spacing: -.025em; color: var(--c-ink); }
.blog-destacado__claim  { display: block; margin-top: 8px; font-size: 15.5px; line-height: 1.55; color: var(--c-ink-2); }
.blog-destacado__txt .meta { display: block; margin-top: 10px; }

.blog-paginacion { margin-top: 26px; }
.blog-paginacion .nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.blog-paginacion .page-numbers {
  display: flex; align-items: center; justify-content: center;
  min-width: var(--h-tap); height: var(--h-tap); padding: 0 14px;
  border-radius: var(--r-pill); background: var(--c-surface-1);
  font-size: 15px; font-weight: 700; color: var(--c-ink-article);
}
.blog-paginacion .page-numbers.current { background: var(--c-action); color: var(--c-white); }
.blog-paginacion .page-numbers:hover   { background: var(--c-cta-bg); color: var(--c-action-ink); }

.blog-lateral        { padding: 26px 0 0; }
.blog-lateral__cta   { margin: 0; }
.blog-lateral__btn   { width: 100%; height: var(--h-btn); margin-top: 18px; }
.blog-lateral__tel   { width: 100%; margin-top: 10px; gap: 10px; }
.blog-lateral__ramos { margin-top: 16px; padding: 20px; }
.blog-lateral__lista { display: grid; margin-top: 10px; }
.blog-lateral__lista a {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 13px 0; border-top: var(--bd) solid var(--c-divider);
  font-size: 15.5px; font-weight: 600; color: var(--c-ink);
}
.blog-lateral__lista a:hover   { color: var(--c-action-ink); }
.blog-lateral__lista a span    { color: var(--c-ink-4); }

@media (min-width: 1024px) {
  .blog-cuerpo {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 64px; align-items: start;
    max-width: var(--max-w); margin: 0 auto; padding: 44px var(--pad-x-d) 0;
  }
  .blog-madre         { padding: 24px 26px; margin-bottom: 24px; }
  .blog-madre__titulo { font-size: 22px; }
  .blog-destacado__txt    { margin-top: 20px; }
  .blog-destacado__titulo { font-size: 30px; line-height: 1.14; letter-spacing: -.03em; }
  .blog-destacado__claim  { font-size: 17px; line-height: 1.6; }
  .blog-listado__h2   { margin-top: 48px; }
  .blog-listado__grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin-top: 24px; }
  .blog-lateral       { position: sticky; top: 150px; padding: 0; }
  .blog-lateral__cta  { padding: 26px 28px 28px; }
}

/* ---- Autor --------------------------------------------------------------- */
.autor-hero        { padding: 14px 0 26px; }
.autor-hero__migas { position: relative; z-index: 1; }
.autor-hero__inner { position: relative; z-index: 1; }
.autor-hero__foto {
  display: flex; align-items: center; justify-content: center;
  width: 96px; height: 96px; margin-top: 18px;
  border-radius: 50%; overflow: hidden;
  background: repeating-linear-gradient(135deg, #F4EEE9 0 6px, var(--c-surface-2) 6px 12px);
}
.autor-hero__foto img { width: 100%; height: 100%; object-fit: cover; }

.autor-hero__h1    { margin-top: 16px; }
.autor-hero__cargo { margin-top: 8px; font-size: 16.5px; font-weight: 700; color: var(--c-primary); }
.autor-hero__cred  { margin-top: 14px; }
.autor-hero__bio   { margin-top: 14px; }
.autor-hero__esp   { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.autor-hero__li    { margin-top: 16px; }

@media (min-width: 1024px) {
  .autor-hero { padding: 16px 0 0; }
  .autor-hero__inner {
    display: grid; grid-template-columns: 160px minmax(0, 1fr);
    gap: 44px; align-items: center; padding-top: 34px; padding-bottom: 56px;
  }
  .autor-hero__foto { width: 160px; height: 160px; margin-top: 0; }
  .autor-hero__h1   { margin-top: 0; font-size: clamp(40px, 4.4vw, 56px); }
  .autor-hero__cargo{ margin-top: 10px; font-size: 18px; }
  .autor-hero__bio  { margin-top: 18px; max-width: 62ch; }
}

.autor-confianza     { padding: 26px 0 0; }
.autor-confianza .eyebrow__bar { display: none; }
.autor-confianza__h2 { margin-top: 10px; }
.autor-confianza__grid { margin-top: 18px; }

@media (min-width: 1024px) {
  .autor-confianza { padding: 80px 0 0; }
  .autor-confianza .eyebrow__bar { display: block; }
  .autor-confianza__h2   { margin-top: 14px; max-width: 26ch; }
  .autor-confianza__grid { margin-top: 36px; }
}

.autor-articulos { margin-top: 28px; padding: 26px 0; }
.autor-articulos .eyebrow__bar { display: none; }
.autor-articulos__h2      { margin-top: 10px; }
.autor-articulos__filtros { display: flex; gap: 8px; overflow-x: auto; margin-top: 16px; padding-bottom: 4px; }
.autor-articulos__grid    { display: grid; gap: 10px; margin-top: 16px; }
/* «Ver más guías»: centrado bajo la lista. Lo enseña y lo esconde el JS. */
.autor-articulos__mas     { display: flex; margin: 18px auto 0; }
.autor-articulos__mas[hidden] { display: none; }

@media (min-width: 1024px) {
  .autor-articulos { margin-top: 80px; padding: 80px 0; }
  .autor-articulos .eyebrow__bar { display: block; }
  .autor-articulos__h2      { margin-top: 14px; }
  .autor-articulos__filtros { flex-wrap: wrap; overflow: visible; margin-top: 24px; }
  .autor-articulos__grid    { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin-top: 28px; }
}

.autor-cierre       { padding: 26px 0 0; }
.autor-cierre__cta  { margin: 0; }
.autor-cierre__btn  { width: 100%; height: var(--h-btn); margin-top: 18px; }
.autor-otros        { margin-top: 16px; padding: 20px; }
.autor-otros__lista { display: grid; margin-top: 12px; }
.autor-otro {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 0; border-top: var(--bd) solid var(--c-divider);
}
.autor-otro__txt        { flex: 1 1 auto; display: block; line-height: 1.3; }
.autor-otro__txt strong { display: block; font-size: 15.5px; font-weight: 800; color: var(--c-ink); }
.autor-otro__txt .meta  { display: block; }

@media (min-width: 1024px) {
  .autor-cierre { padding: 80px 0 0; }
  .autor-cierre__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); gap: 64px; align-items: start; }
  .autor-cierre__cta   { padding: 26px 28px 28px; }
  .autor-cierre__cta .cta__title { max-width: 22ch; font-size: 24px; line-height: 1.2; }
  .autor-otros         { margin-top: 0; padding: 24px 26px; }
}
