/* ---------- Blog: cabecera ---------- */
.art-cabeza { padding: 104px 0 44px; }
.art-cabeza h1 {
  font-size: clamp(2rem, 6vw, 3.2rem); font-weight: 900; font-stretch: 104%;
  margin-bottom: 14px; text-wrap: balance;
}
.art-cabeza .cabeza__pre { color: var(--amarillo); }
.art-meta { color: #c9d4f5; font-size: .95rem; margin: 0; }
.art-meta a { color: var(--blanco); font-weight: 600; }

.migas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .88rem; color: #aab6da; margin-bottom: 22px; }
.migas a { color: #dbe3fb; text-decoration: none; }
.migas a:hover { color: var(--amarillo); }
.migas [aria-current] { color: #8f9cc4; }

/* ---------- Blog: artículo ---------- */
.art { padding-top: 40px; padding-bottom: 64px; }
.art h2 { font-size: clamp(1.5rem, 4vw, 2rem); font-weight: 800; margin: 44px 0 14px; }
.art p, .art li { color: #2a3556; }
.art ul { padding-left: 1.25em; margin: 0 0 1.2em; display: grid; gap: 8px; }
.art li::marker { color: var(--azul); font-weight: 700; }
.art ol { padding-left: 1.4em; margin: 0 0 1.2em; display: grid; gap: 10px; }
.nota { font-size: .9rem; color: var(--gris); }
.art a { color: var(--azul); }
.art a.btn { color: inherit; }
.art a.btn--wa { color: var(--blanco); }
.art-intro { font-size: 1.15rem; }

.respuesta {
  background: var(--claro); border: 1px solid var(--linea); border-left: 5px solid var(--amarillo);
  border-radius: var(--radio-sm); padding: 20px 22px 6px; margin: 26px 0;
}
.respuesta__titulo {
  font-family: var(--display); font-weight: 800; font-stretch: 112%; text-transform: uppercase;
  letter-spacing: .08em; font-size: .82rem; color: var(--azul); margin-bottom: 10px;
}

.art .hoy {
  background: var(--noche); color: var(--blanco); border-radius: var(--radio-sm);
  padding: 16px 20px; margin: 0 0 8px; font-size: 1.05rem;
}
.art .hoy strong { color: var(--amarillo); }
.hoy__linea { display: block; }
.hoy__linea + .hoy__linea { margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .14); }

.tabla-envoltura { overflow-x: auto; margin: 0 0 18px; border: 1px solid var(--linea); border-radius: var(--radio-sm); }
.tabla { width: 100%; border-collapse: collapse; font-size: 1rem; }
.tabla th, .tabla td { padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--linea); }
.tabla thead th { background: var(--noche); color: var(--blanco); font-weight: 700; font-size: .92rem; }
.tabla tbody tr:last-child th, .tabla tbody tr:last-child td { border-bottom: 0; }
.tabla tbody th { font-weight: 700; color: var(--tinta); }
.tabla tbody tr:nth-child(even) { background: var(--claro); }

.art-cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0 8px; }

.art-faq { background: none; padding: 0; margin-top: 8px; }

.fuente { font-size: .9rem; color: var(--gris); border-top: 1px solid var(--linea); padding-top: 18px; margin-top: 36px; }

.autor {
  display: flex; gap: 18px; align-items: flex-start;
  background: var(--claro); border-radius: var(--radio); padding: 22px; margin-top: 36px;
}
.autor img { width: 76px; height: 76px; border-radius: 50%; object-fit: cover; object-position: top; background: var(--noche-2); flex: none; }
.autor__nombre { font-family: var(--display); font-weight: 800; font-size: 1.15rem; margin-bottom: 4px; color: var(--tinta); }
.autor p { font-size: .98rem; }

/* ---------- Blog: lista ---------- */
.blog-lista { padding-top: 40px; padding-bottom: 72px; }
.posts { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.post {
  position: relative; background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio);
  padding: 24px; box-shadow: var(--sombra); transition: transform .25s ease, box-shadow .25s ease;
}
.post:hover { transform: translateY(-3px); box-shadow: 0 28px 50px -22px rgba(5, 14, 46, .45); }
.post__pre { font-size: .85rem; color: var(--gris); margin-bottom: 8px; }
.post__titulo { font-size: clamp(1.35rem, 3.6vw, 1.7rem); font-weight: 800; margin-bottom: 10px; }
.post__titulo a { text-decoration: none; color: var(--tinta); }
.post__titulo a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.post p { color: var(--gris); }
.post__mas { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--azul); }

@media (min-width: 900px) {
  .art-cabeza { padding: 128px 0 56px; min-height: 0; display: block; }
}