.location-hero,
.experiences-hero,
.blog-hero,
.contact-hero {
  background-position: center;
  background-size: cover;
}

.location-hero {
  background-image: linear-gradient(90deg, rgba(9, 37, 50, .88), rgba(9, 37, 50, .2)), url('/images/heroes/location-panorama.jpg');
}

.experiences-hero {
  background-image: linear-gradient(90deg, rgba(9, 37, 50, .88), rgba(9, 37, 50, .22)), url('/images/heroes/experiences-cala-sarraina.png');
}

.contact-hero {
  background-image: linear-gradient(90deg, rgba(9, 37, 50, .86), rgba(9, 37, 50, .15)), url('/images/heroes/contacts-sunset.jpg');
  background-position: center 42%;
}

.blog-hero {
  min-height: 68vh;
  display: flex;
  align-items: end;
  background-image: linear-gradient(90deg, rgba(9, 37, 50, .9), rgba(9, 37, 50, .18)), url('/images/heroes/blog-isola-rossa.png');
}

.blog-hero .container { padding-bottom: 4.5rem; }

@media (max-width: 767.98px) {
  .location-hero { background-position: 62% center; }
  .experiences-hero { background-position: 60% center; }
  .contact-hero { background-position: 57% center; }
  .blog-hero { min-height: 60vh; background-position: 58% center; }
  .blog-hero .container { padding-bottom: 3rem; }
}

/* Complete apartment galleries. */
.gallery { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 220px; }
.gallery-item { overflow: hidden; cursor: zoom-in; }
.gallery-item img { height: 100%; aspect-ratio: auto; transition: transform .35s ease; }
.gallery-item:hover img, .gallery-item:focus-visible img { transform: scale(1.04); }
.gallery-item:first-child { grid-column: span 2; grid-row: span 2; }
.gallery-item:nth-child(6n+4) { grid-column: span 2; }

@media (max-width: 991.98px) {
  .gallery { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 190px; }
  .gallery-item:nth-child(6n+4) { grid-column: auto; }
}

@media (max-width: 767.98px) {
  .gallery { grid-template-columns: 1fr 1fr; grid-auto-rows: 165px; }
  .gallery-item:first-child { grid-column: span 2; grid-row: span 2; }
}
