.skip{
  position:fixed!important;
  top:8px!important;
  left:8px!important;
  z-index:999;
  background:#fff;
  padding:10px;
  transform:translateY(-150%);
}
.skip:focus{transform:none}

html,body{
  max-width:100%;
  overflow-x:hidden;
}

/* WHITE SAND V2.1 — CLEAN RESPONSIVE HEADER */
@media (min-width:1001px){
  .header .head>.nav,
  .header .head>.langs{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
  }

  .header .menu,
  .header .mobile-nav,
  .header .mobile-nav.open{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }

  /* FINAL DESKTOP GALLERY REPAIR
     Supports old .gallery, interim .gallery-grid, and canonical .gallery-strip. */
  body[data-page="gallery"] .gallery,
  body[data-page="gallery"] .gallery-grid,
  body[data-page="gallery"] .gallery-strip{
    display:grid!important;
    grid-template-columns:repeat(12,minmax(0,1fr))!important;
    gap:18px!important;
    width:100%!important;
    margin:48px 0!important;
    padding:0!important;
    align-items:start!important;
  }

  body[data-page="gallery"] .gallery-item{
    -webkit-appearance:none!important;
    appearance:none!important;
    box-sizing:border-box!important;
    position:relative!important;
    display:block!important;
    min-width:0!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#e9e5df!important;
    aspect-ratio:4 / 3!important;
    cursor:pointer!important;
    line-height:0!important;
  }

  /* Normal cards = 3 across */
  body[data-page="gallery"] .gallery-item:not(.wide):not(.span-12):not(.span-6){
    grid-column:span 4!important;
  }

  body[data-page="gallery"] .gallery-item.span-4{
    grid-column:span 4!important;
  }

  body[data-page="gallery"] .gallery-item.span-6{
    grid-column:span 6!important;
    aspect-ratio:16 / 10!important;
  }

  /* Wide cards */
  body[data-page="gallery"] .gallery-item.wide,
  body[data-page="gallery"] .gallery-item.span-12{
    grid-column:span 12!important;
    aspect-ratio:21 / 9!important;
  }

  /* The image itself fills the card; no gray placeholder can remain above it. */
  body[data-page="gallery"] .gallery-item>img{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-width:100%!important;
    min-height:100%!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    object-fit:cover!important;
    object-position:center!important;
    transform:none!important;
  }

  body[data-page="gallery"] .gallery-item>span,
  body[data-page="gallery"] .gallery-caption{
    position:absolute!important;
    z-index:2!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:28px 18px 14px!important;
    background:linear-gradient(180deg,transparent 0%,rgba(22,22,22,.78) 100%)!important;
    color:#fff!important;
    font-size:.8rem!important;
    letter-spacing:.06em!important;
    line-height:1.35!important;
    text-align:left!important;
    pointer-events:none!important;
  }

  body[data-page="gallery"] .gallery-item[hidden]{
    display:none!important;
  }

  /* Keep Villa 2 opening badge inside its card. */
  body[data-page="villas"] .grid-2>.card:nth-child(2)>.card-body>.badge{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    float:none!important;
    display:inline-block!important;
  }
}

/* MOBILE — preserve the working behavior */
@media (max-width:1000px){
  .header .head>.nav,
  .header .head>.langs{
    display:none!important;
  }

  .header .menu{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    margin-left:auto!important;
  }

  [dir="rtl"] .header .menu{
    margin-left:0!important;
    margin-right:auto!important;
  }

  .header .mobile-nav{
    display:none!important;
  }

  .header .mobile-nav.open{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    gap:14px!important;
  }
}
/* =====================================================
   VILLA 1 INTERNAL GALLERY — DESKTOP ONLY
   Apply the same finished gallery system inside Villa 1.
   ===================================================== */
@media (min-width:1001px){

  body[data-page="villa1"] .gallery,
  body[data-page="villa1"] .gallery-grid,
  body[data-page="villa1"] .gallery-strip{
    display:grid!important;
    grid-template-columns:repeat(12,minmax(0,1fr))!important;
    grid-auto-flow:dense!important;
    gap:18px!important;
    width:100%!important;
    margin:48px 0!important;
    padding:0!important;
    align-items:start!important;
  }

  body[data-page="villa1"] .gallery-item{
    -webkit-appearance:none!important;
    appearance:none!important;
    box-sizing:border-box!important;
    position:relative!important;
    display:block!important;
    min-width:0!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#e9e5df!important;
    aspect-ratio:4 / 3!important;
    cursor:pointer!important;
    line-height:0!important;
  }

  body[data-page="villa1"] .gallery-item:not(.wide):not(.span-12):not(.span-6){
    grid-column:span 4!important;
  }

  body[data-page="villa1"] .gallery-item.span-4{
    grid-column:span 4!important;
  }

  body[data-page="villa1"] .gallery-item.span-6{
    grid-column:span 6!important;
    aspect-ratio:16 / 10!important;
  }

  body[data-page="villa1"] .gallery-item.wide,
  body[data-page="villa1"] .gallery-item.span-12{
    grid-column:span 12!important;
    aspect-ratio:21 / 9!important;
  }

  body[data-page="villa1"] .gallery-item>img{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-width:100%!important;
    min-height:100%!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    object-fit:cover!important;
    object-position:center!important;
    transform:none!important;
  }

  body[data-page="villa1"] .gallery-item>span,
  body[data-page="villa1"] .gallery-caption{
    position:absolute!important;
    z-index:2!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:28px 18px 14px!important;
    background:linear-gradient(180deg,transparent 0%,rgba(22,22,22,.78) 100%)!important;
    color:#fff!important;
    font-size:.8rem!important;
    letter-spacing:.06em!important;
    line-height:1.35!important;
    text-align:left!important;
    pointer-events:none!important;
  }

  body[data-page="villa1"] .gallery-item[hidden]{
    display:none!important;
  }

  /* Main Gallery page: pack later small items into holes where possible. */
  body[data-page="gallery"] .gallery,
  body[data-page="gallery"] .gallery-grid,
  body[data-page="gallery"] .gallery-strip{
    grid-auto-flow:dense!important;
  }
}
