/* Stay&Go P10A · estabilidad visual móvil y CLS
   Base: staygo1.zip · 2026-06-24
   Objetivo: reservar espacio antes de cargar imágenes, hero y tarjetas públicas.
*/
html{overflow-y:scroll;text-size-adjust:100%;-webkit-text-size-adjust:100%}
img,picture,video,canvas{max-width:100%;height:auto}

/* El enlace de salto debe ser enfocable y no alterar layout. */
.sgSkip,.sgSkipF184{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;z-index:99999!important}
.sgSkip:focus,.sgSkipF184:focus{left:12px!important;top:12px!important;width:auto!important;height:auto!important;overflow:visible!important;background:#fff!important;color:#111827!important;border:2px solid rgba(255,56,92,.6)!important;border-radius:12px!important;padding:10px 12px!important;box-shadow:0 14px 34px rgba(17,24,39,.16)!important}

/* HERO HOME: reservar el bloque de imagen desde el primer pintado. */
main#main-content section.hero .hero-card{contain:layout paint;}
main#main-content section.hero .hero-media,
main#main-content section.hero .hero-media picture,
main#main-content section.hero .hero-media img{display:block;width:100%;aspect-ratio:4/3;}
main#main-content section.hero .hero-media{min-height:clamp(230px,54vw,520px);background:#eef2f7;border-radius:inherit;overflow:hidden;}
main#main-content section.hero .hero-media img{height:100%;object-fit:cover;object-position:center center;}
main#main-content section.hero .hero-content{min-width:0;}
@media (max-width:767px){
  main#main-content section.hero{padding-top:14px!important;}
  main#main-content section.hero .hero-card{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;}
  main#main-content section.hero .hero-media{min-height:min(68vw,390px)!important;}
  main#main-content section.hero .hero-content{padding-top:0!important;}
  main#main-content section.hero h1{font-size:clamp(31px,9vw,42px)!important;line-height:1.03!important;}
  .heroKpis,.hero-badges--booking{min-height:42px;}
}

/* HOME: cards con espacio fijo antes de que llegue la foto. */
.propCard__img,.propCard__media,.propCard__photo,.propCard__picture,
.featuredSection .propCard__img,
.featuredSection .propCard__media{aspect-ratio:16/10;min-height:190px;background:#eef2f7;overflow:hidden;}
.propCard__img img,.propCard__media img,.propCard__photo img,.propCard__picture img,.propCard__imgEl{width:100%;height:100%;object-fit:cover;display:block;}
@media (max-width:767px){.propCard__img,.propCard__media,.propCard__photo,.propCard__picture,.featuredSection .propCard__img,.featuredSection .propCard__media{min-height:215px;}}

/* LISTADO: el listado usa background-image; reservamos ratio y altura desde CSS crítico. */
body .listingSection .grid .card .media,
body .grid .card .media{aspect-ratio:16/11;min-height:198px;background-color:#d9dfe8;background-position:center;background-size:cover;}
@media (max-width:720px){body .listingSection .grid .card .media,body .grid .card .media{min-height:220px;}}

/* Bloques secundarios de home: zonas, experiencias, gastronomía y propietario. */
.sgHomeExpCleanF182__media,
.sgHomeZones img,
.gasCard__media,
.gasGrid img,
.restCard img,
.zonaCard img,
.ownerCard img{aspect-ratio:16/10;background:#eef2f7;overflow:hidden;}
.sgHomeExpCleanF182__media img,
.gasGrid img,.restCard img,.zonaCard img,.ownerCard img{width:100%;height:100%;object-fit:cover;display:block;}

/* Evita saltos por controles y chips que aparecen tarde. */
.searchSection,.filterCard,.search-wrap{contain:layout;}
.hero-btns--booking,.hero-badges--booking,.filterTags,.sectionStats,.quickFacts,.trust{min-height:42px;}

/* Áreas táctiles mínimas en público móvil. */
@media (max-width:767px){
  a.btn,button,.btn,.openBtn,.heroBtn,.air-btn,.sgNav__link,.sgAccountChip,.filterClear{min-height:44px;}
  input,select,textarea{font-size:16px;}
}
