/* =========================================================
   sc-fotos.css — Fotos debajo del hero: Surf Palace, Villa Pilar y cualquier página
   con 3 o más en su grupo «Fotos» (inc/fotos-pagina.php). Antes en sc-alojamiento.css.
   ========================================================= */
.photos-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:3px}
.photos-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}

/* Más de 3 fotos: carrusel. Se ven 3 y se pasa con las flechas (sc-galeria.js pone
   .is-js en .photos-slider) o deslizando con el dedo; sin JS sigue pudiéndose deslizar. */
.photos-slider{position:relative}
.photos-grid.is-scroll{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none}
.photos-grid.is-scroll::-webkit-scrollbar{display:none}
.photos-grid.is-scroll img{flex:0 0 calc((100% - 6px) / 3);scroll-snap-align:start}
.photos-nav{display:none}
.photos-slider.is-js .photos-nav{position:absolute;top:50%;z-index:2;display:flex;align-items:center;justify-content:center;width:48px;height:48px;transform:translateY(-50%);background:#fff;color:var(--green-ink);border:1px solid var(--line);box-shadow:0 10px 24px -12px rgba(0,0,0,.45);transition:background .2s ease,opacity .2s ease}
.photos-slider.is-js .photos-nav:hover{background:var(--cream)}
.photos-slider.is-js .photos-nav:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.photos-slider.is-js .photos-nav:disabled{opacity:0;pointer-events:none}
.photos-nav .ic{width:20px;height:20px}
.photos-nav--prev{left:16px}
.photos-nav--prev .ic{transform:rotate(180deg)}
.photos-nav--next{right:16px}