.topbar,
.site-header,
.ticker {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

.site-header .nav {
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
  padding-inline: 24px;
}

@media (max-width: 720px) {
  .site-header .nav {
    padding-inline: 18px;
  }
}

.avlynt-seo-heading {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Reserve the exact 2:1 hero artwork space before it downloads. */
.banner-frame {
  aspect-ratio: 2 / 1;
}

.banner-frame img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
}

/* Premium image treatment: keep imagery clear while adding contrast only
   where copy is layered over a photo. Service/package artwork is excluded. */
.why-photo::after {
  background: linear-gradient(
    180deg,
    rgba(9, 11, 15, 0.02) 20%,
    rgba(9, 11, 15, 0.34) 54%,
    rgba(9, 11, 15, 0.94) 100%
  ) !important;
}

.why-card.with-image {
  background-image: linear-gradient(
      180deg,
      rgba(9, 11, 15, 0.03) 15%,
      rgba(9, 11, 15, 0.34) 56%,
      rgba(9, 11, 15, 0.92) 100%
    ),
    var(--why-image) !important;
}

.portfolio-card.image-card {
  background-image: linear-gradient(
      180deg,
      rgba(9, 11, 15, 0.03) 18%,
      rgba(9, 11, 15, 0.3) 58%,
      rgba(9, 11, 15, 0.92) 100%
    ),
    var(--card-image) !important;
}

.contact-visual::after {
  background: linear-gradient(
    180deg,
    rgba(9, 11, 15, 0.02) 28%,
    rgba(9, 11, 15, 0.3) 58%,
    rgba(9, 11, 15, 0.9) 100%
  ) !important;
}

@media (max-width: 620px) {
  img {
    max-width: 100%;
    height: auto;
  }

  .banner-frame,
  .card-media,
  .split-image,
  .contact-visual,
  .section-gallery figure,
  .why-photo,
  .why-card,
  .portfolio-card {
    overflow: hidden;
  }

  .banner-frame img,
  .card-media img,
  .offer-banner {
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
    object-position: center;
  }

  .split-image img,
  .contact-visual img,
  .section-gallery img {
    width: 100%;
    max-width: 100%;
    object-fit: cover;
    object-position: center;
  }

  .why-photo,
  .why-card.with-image,
  .portfolio-card.image-card {
    background-size: cover !important;
    background-position: center !important;
  }

  .why-photo::after,
  .why-card.with-image::after,
  .portfolio-card.image-card::before,
  .contact-visual::after {
    backdrop-filter: saturate(0.96) contrast(1.04);
  }

  /* Interior-page mobile banners match the premium image-card treatment:
     the picture remains visible and page details sit on a transparent fade. */
  .page-hero.has-banner {
    width: calc(100% - 28px) !important;
    min-height: 610px !important;
    margin: 24px 14px 44px !important;
    padding: 260px 0 34px !important;
    align-items: flex-end !important;
    color: #fff !important;
    background: #111317 !important;
    border-radius: 28px !important;
    box-shadow: 0 20px 52px rgba(18, 20, 24, 0.18) !important;
  }

  .page-hero.has-banner::before {
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    border-radius: inherit !important;
    background-size: cover !important;
    background-position: center !important;
  }

  .page-hero.has-banner::after {
    background: linear-gradient(
      180deg,
      rgba(9, 11, 15, 0.02) 18%,
      rgba(9, 11, 15, 0.38) 48%,
      rgba(9, 11, 15, 0.96) 100%
    ) !important;
    backdrop-filter: saturate(0.96) contrast(1.04);
  }

  .page-hero.has-banner .wrap,
  .is-arabic .page-hero.has-banner .wrap {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 24px !important;
  }

  .page-hero.has-banner .breadcrumbs,
  .page-hero.has-banner .lead {
    color: rgba(255, 255, 255, 0.88) !important;
  }

  .page-hero.has-banner h1 {
    color: #fff !important;
    font-size: clamp(2.55rem, 12vw, 3.4rem) !important;
  }
}