/* TPH58A_RESORT_DESKTOP_GALLERY_UNIFIED_LAYOUT
   Desktop/tablet only. Keep mobile rendering untouched.
   Purpose: identical gallery frame/height regardless of photo count.
*/
@media (min-width:768px){
  .tph-resort-page .tph-resort-gallery{
    display:grid!important;
    width:100%!important;
    height:360px!important;
    min-height:360px!important;
    max-height:360px!important;
    grid-template-columns:2fr 1fr 1fr!important;
    grid-template-rows:1fr 1fr!important;
    gap:6px!important;
    overflow:hidden!important;
    align-items:stretch!important;
    border-radius:14px!important;
  }

  .tph-resort-page .tph-resort-gallery > .tph-resort-gallery-item{
    position:relative!important;
    width:100%!important;
    min-width:0!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
    border-radius:0!important;
    margin:0!important;
  }

  .tph-resort-page .tph-resort-gallery > .tph-resort-gallery-item img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    object-fit:cover!important;
  }

  /* Main image always occupies the full left block. */
  .tph-resort-page .tph-resort-gallery > .tph-resort-gallery-item.main-photo{
    grid-column:1!important;
    grid-row:1 / 3!important;
  }

  /* Standard positions for up to four secondary images. */
  .tph-resort-page .tph-resort-gallery > .tph-resort-gallery-item:nth-child(2){
    grid-column:2!important;
    grid-row:1!important;
  }
  .tph-resort-page .tph-resort-gallery > .tph-resort-gallery-item:nth-child(3){
    grid-column:3!important;
    grid-row:1!important;
  }
  .tph-resort-page .tph-resort-gallery > .tph-resort-gallery-item:nth-child(4){
    grid-column:2!important;
    grid-row:2!important;
  }
  .tph-resort-page .tph-resort-gallery > .tph-resort-gallery-item:nth-child(5){
    grid-column:3!important;
    grid-row:2!important;
  }

  /* 1 photo: use the whole gallery frame. */
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-1{
    grid-template-columns:1fr!important;
    grid-template-rows:1fr!important;
  }
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-1 > .main-photo{
    grid-column:1!important;
    grid-row:1!important;
  }

  /* 2 photos: preserve full gallery height instead of collapsing to a short strip. */
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-2{
    grid-template-columns:2fr 1fr!important;
    grid-template-rows:1fr!important;
  }
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-2 > .main-photo{
    grid-column:1!important;
    grid-row:1!important;
  }
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-2 > .tph-resort-gallery-item:nth-child(2){
    grid-column:2!important;
    grid-row:1!important;
  }

  /* 3 photos: same visual language as the accepted reference:
     large main image + two smaller images on the right. */
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-3{
    grid-template-columns:2fr 1fr 1fr!important;
    grid-template-rows:1fr!important;
  }
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-3 > .main-photo{
    grid-column:1!important;
    grid-row:1!important;
  }
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-3 > .tph-resort-gallery-item:nth-child(2){
    grid-column:2!important;
    grid-row:1!important;
  }
  .tph-resort-page .tph-resort-gallery.tph58-gallery-count-3 > .tph-resort-gallery-item:nth-child(3){
    grid-column:3!important;
    grid-row:1!important;
  }
}

@media (min-width:1200px){
  .tph-resort-page .tph-resort-gallery{
    height:380px!important;
    min-height:380px!important;
    max-height:380px!important;
  }
}