/* Publicaciones de Instagram en su sitio: «Para leer con calma» en el inicio, la lista y cada
   publicación. Usa las variables de inicio.css. */

.lecturas.con-foto a{display:grid;grid-template-columns:120px minmax(0,1fr);gap:24px;align-items:center}
.lecturas.con-foto img{width:120px;height:120px;object-fit:cover;border-radius:20px;background:var(--lana)}
.lecturas.con-foto a:not(:has(img)){grid-template-columns:1fr}
.lecturas .fila-texto{display:block}
.lecturas .fila-texto span{display:block;margin-top:6px;color:var(--tinta-suave)}
.mas-publicaciones{margin-top:26px}
.mas-publicaciones a,.paginas a,.volver a,.original a{font:700 1rem/1.2 var(--titulos)}
@media (max-width:560px){
  .lecturas.con-foto a{grid-template-columns:84px minmax(0,1fr);gap:16px}
  .lecturas.con-foto img{width:84px;height:84px;border-radius:16px}
}

.publicaciones h1,.publicacion h1{font-size:clamp(2.3rem,5.4vw,3.9rem)}
.paginas{display:flex;justify-content:space-between;gap:16px;margin-top:32px}
.paginas a:only-child{margin-left:auto}

.publicacion .ancho{max-width:780px}
.publicacion .volver{margin:0 0 18px}
.publicacion .fecha{color:var(--tinta-suave);margin:14px 0 30px}
.fotos{display:grid;gap:14px;margin:0 0 34px}
.fotos.varias{grid-auto-flow:column;grid-auto-columns:min(86%,560px);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;margin-inline:-22px;padding-inline:22px;scroll-padding-inline:22px}
.fotos figure{margin:0;position:relative;scroll-snap-align:start}
.fotos img{display:block;width:100%;height:auto;border-radius:28px;background:var(--lana)}
.fotos .ver-video{position:absolute;left:18px;bottom:18px;padding:12px 18px;border-radius:999px;background:var(--ciruela);color:#fff;font:700 .95rem/1 var(--titulos);text-decoration:none}
.fotos .ver-video:hover{background:var(--frambuesa)}
.publicacion .texto p{margin:0 0 1.1em;max-width:36em}
.publicacion .original{margin:28px 0 0}
.conversar{margin-top:clamp(48px,7vw,80px);background:var(--menta);border-radius:34px;padding:clamp(28px,4vw,48px)}
.conversar h2{font-size:clamp(1.7rem,3.4vw,2.4rem)}
.conversar p{color:var(--petroleo);margin:12px 0 24px;max-width:30em}
.conversar .boton{background:var(--petroleo);border-color:var(--petroleo)}
.conversar .boton:hover{background:var(--ciruela);border-color:var(--ciruela)}

/* Cupos solidarios, bajo «Reserva tu hora» en el inicio. */
.agenda .solidario{margin:22px 0 0;color:#b9d6d0;max-width:40em}
.agenda .solidario a{color:#fff;font-weight:600}
