/* ================================================================
   HYEN — Blog (guías con normativa)
   Hoja externa: no se incrusta CSS en el HTML.
   Complementa a ranking-styles.css y hyen-comparativa.css.
   ================================================================ */

/* Columna de lectura: un artículo largo no se lee bien a todo lo ancho */
.blg-ancho{max-width:820px}

.blg-parrafo{
  font-size:1.02rem;line-height:1.8;color:#334155;margin:0 0 1.15rem;
}
.blg-parrafo strong{color:#0b1e3d}
.blg-parrafo a{color:#1757c2;text-decoration:underline;text-underline-offset:2px}
.blg-parrafo a:hover{color:#0b1e3d}

/* ---------- Citas de la norma ---------- */
.blg-cita{
  margin:1.6rem 0;padding:1.3rem 1.5rem;
  background:#f8fafc;border-left:4px solid #94a3b8;border-radius:0 12px 12px 0;
}
.blg-cita p{
  margin:0 0 .7rem;font-size:1rem;line-height:1.8;color:#1e293b;font-style:italic;
}
.blg-cita p strong{font-style:normal;color:#0b1e3d}
.blg-cita cite{
  display:block;font-style:normal;font-size:.78rem;font-weight:700;
  letter-spacing:.07em;text-transform:uppercase;color:#64748b;
}
/* La cita que sostiene el argumento del bloque */
.blg-cita-clave{background:#f0f4ff;border-left-color:#1757c2}
.blg-cita-clave cite{color:#1757c2}

/* ---------- Listas ---------- */
ul.blg-lista li{font-size:.98rem;line-height:1.75;margin-bottom:.7rem}

/* ---------- Aviso legal ---------- */
.blg-aviso{background:#fff8e6;border-left-color:#e0a800}
.blg-aviso p{font-size:.92rem;color:#5c4a12}

/* ---------- Llamada a la acción dentro del texto ---------- */
.blg-cta{
  background:#e9f8ee;border-left:4px solid #25D366;border-radius:0 10px 10px 0;
  padding:1rem 1.2rem;margin-top:1.5rem;
}

/* ---------- Portada del blog ---------- */
.blg-lista-entradas{display:grid;gap:1.2rem;margin-top:1.5rem}
.blg-card{
  background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;padding:1.5rem 1.6rem;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.blg-card:hover{border-color:#1757c2;box-shadow:0 6px 20px rgba(11,30,61,.07)}
.blg-card-tag{
  display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:#1757c2;background:rgba(23,87,194,.08);
  padding:.25rem .65rem;border-radius:100px;margin-bottom:.8rem;
}
.blg-card-title{
  font-family:'Barlow Condensed',sans-serif;font-size:1.5rem;font-weight:800;
  line-height:1.2;margin:0 0 .6rem;text-transform:uppercase;
}
.blg-card-title a{color:#0b1e3d;text-decoration:none}
.blg-card-title a:hover{color:#1757c2}
.blg-card-sum{margin:0 0 .8rem;font-size:.95rem;line-height:1.7;color:#475569}
.blg-card-meta{
  margin:0;font-size:.74rem;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:#94a3b8;
}

/* El hero del blog es más bajo que el de las comparativas */
.rk-hero-blog{min-height:38vh}

@media (max-width:600px){
  .blg-cita{padding:1.05rem 1.15rem}
  .blg-parrafo{font-size:.98rem}
  .blg-card{padding:1.2rem 1.25rem}
  .blg-card-title{font-size:1.28rem}
}