/* ============================================================
   legacy.css — estilos para el contenido rescatado de Squarespace
   (artículos de blog, hubs de investigación, contraindicaciones)
   Se carga DESPUÉS de styles.css y solo en páginas legacy.
   ============================================================ */

.wrap-narrow{
  max-width:760px;
  margin:0 auto;
  padding:0 20px;
}

/* ---------- Artículo ---------- */
.legacy-article{
  padding:56px 0 72px;
}
.legacy-article h1{
  font-size:clamp(1.9rem,4.2vw,2.7rem);
  line-height:1.18;
  margin:0 0 10px;
}
.legacy-article h2{
  font-size:clamp(1.35rem,2.6vw,1.7rem);
  margin:2.2em 0 .5em;
}
.legacy-article h3{
  font-size:1.15rem;
  margin:1.8em 0 .4em;
}
.legacy-article p{
  font-size:1.05rem;
  line-height:1.72;
  margin:0 0 1.15em;
}
.legacy-article li{
  line-height:1.7;
  margin-bottom:.45em;
}
.legacy-article a{
  text-decoration:underline;
  text-underline-offset:2px;
}
.legacy-article blockquote{
  margin:1.6em 0;
  padding:.2em 0 .2em 1.15em;
  border-left:3px solid currentColor;
  opacity:.86;
  font-style:italic;
}
.legacy-article hr{
  border:0;
  border-top:1px solid rgba(0,0,0,.12);
  margin:2.6em 0 1.6em;
}

/* Imágenes: nunca desbordan, siempre proporcionales */
.legacy-article img{
  max-width:100%;
  height:auto;
  display:block;
  margin:1.6em auto;
  border-radius:10px;
}
.legacy-article figure{
  margin:1.8em 0;
}
.legacy-article figcaption{
  font-size:.86rem;
  opacity:.7;
  text-align:center;
  margin-top:.5em;
  line-height:1.5;
}

/* Tablas del contenido viejo: scroll en móvil en vez de romper el layout */
.legacy-article table{
  width:100%;
  border-collapse:collapse;
  margin:1.6em 0;
  font-size:.94rem;
  display:block;
  overflow-x:auto;
}
.legacy-article th,
.legacy-article td{
  border:1px solid rgba(0,0,0,.14);
  padding:8px 10px;
  text-align:left;
}

/* Squarespace deja iframes de vídeo sueltos */
.legacy-article iframe{
  max-width:100%;
  aspect-ratio:16/9;
  height:auto;
  border:0;
  margin:1.6em 0;
  border-radius:10px;
}

.legacy-meta,
.legacy-breadcrumb{
  font-size:.88rem;
  opacity:.66;
  margin:0 0 .35em;
}
.legacy-breadcrumb a{text-decoration:none}
.legacy-breadcrumb a:hover{text-decoration:underline}
.legacy-meta{margin-bottom:2em}

.legacy-cta{
  font-size:.98rem;
  opacity:.9;
}

/* ---------- Listados / hubs ---------- */
.legacy-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:18px;
  margin-top:8px;
}
.legacy-card{
  display:block;
  padding:20px 20px 22px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease;
}
.legacy-card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 26px rgba(0,0,0,.09);
}
.legacy-card h3{
  margin:.3em 0 .45em;
  font-size:1.06rem;
  line-height:1.35;
}
.legacy-card p{
  font-size:.92rem;
  line-height:1.6;
  opacity:.78;
  margin:0;
}
.legacy-date{
  font-size:.78rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  opacity:.6;
}

.legacy-list{
  list-style:none;
  padding:0;
  margin:10px 0 0;
}
.legacy-list li{
  padding:13px 0;
  border-bottom:1px solid rgba(0,0,0,.1);
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:16px;
  flex-wrap:wrap;
}
.legacy-list a{text-decoration:none}
.legacy-list a:hover{text-decoration:underline}

/* ---------- Salvaguardas contra los defectos del sitio viejo ---------- */
/* Squarespace dejaba texto blanco sobre fondo blanco en varios bloques.
   Forzamos que el contenido legacy herede siempre el color del tema. */
.legacy-article [style*="color:#fff"],
.legacy-article [style*="color: #fff"],
.legacy-article [style*="color:#ffffff"],
.legacy-article [style*="color: #ffffff"],
.legacy-article [style*="color:white"],
.legacy-article [style*="color: white"]{
  color:inherit !important;
}
/* Anchos fijos heredados del editor viejo */
.legacy-article [width]{max-width:100%}

@media (max-width:640px){
  .legacy-article{padding:36px 0 52px}
  .legacy-article p{font-size:1rem}
}