/* Approved Kaaba backgrounds; preserve existing content and foreground images. */
body[data-page="home"] #performer.section {
  background-color: #071c17;
  background-image:
    linear-gradient(180deg, #071c17 0%, rgba(5,25,20,.78) 17%, rgba(5,25,20,.77) 70%, #071c17 100%),
    url("black-stone-cinematic.webp");
  background-size: cover;
  background-position: center 62%;
  background-repeat: no-repeat;
}
body[data-page="home"] .footer {
  background-color: #061812;
  background-image:
    linear-gradient(180deg, rgba(5,24,18,.77), rgba(5,24,18,.84) 50%, rgba(5,24,18,.93)),
    url("download-light-unique.webp");
  background-size: cover;
  background-position: center 75%;
  background-repeat: no-repeat;
}
@media (min-width: 701px) {
  html[lang="en"] body[data-page="home"] #performer.section {
    background-size: cover, 155% auto;
    background-position: center, left 60%;
  }
}
@media (max-width: 700px) {
  body[data-page="home"] #performer.section {
    background-position: 32% center;
    background-image:
      linear-gradient(180deg, #071c17 0%, rgba(5,25,20,.80) 16%, rgba(5,25,20,.85) 74%, #071c17 100%),
      url("black-stone-cinematic.webp");
  }
  body[data-page="home"] .footer {
    background-position: center 75%;
    background-image:
      linear-gradient(180deg, rgba(5,24,18,.81), rgba(5,24,18,.85) 64%, rgba(5,24,18,.94)),
      url("download-light-unique.webp");
  }
}

/* Move the approved Kaaba door to the app-download invitation. */
body[data-page="home"] #download.v-download::before {
  background-image:
    linear-gradient(180deg, rgba(5,24,18,.80), rgba(5,24,18,.76) 50%, rgba(5,24,18,.88)),
    url("kaaba-door-footer-cinematic.webp");
  background-size: cover;
  background-position: center 58%;
  background-repeat: no-repeat;
}
/* LTR email text stays aligned with its surrounding language-specific column. */
body[data-page="home"] .footer-group > a[href^="mailto:"] {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: left;
  font-size: clamp(10px, 3.1vw, 12px);
  line-height: 1.85;
  letter-spacing: 0;
  overflow-wrap: normal;
  white-space: nowrap;
}
html[lang="ar"] body[data-page="home"] .footer-group > a[href^="mailto:"] {
  text-align: right;
}
@media (max-width: 700px) {
  body[data-page="home"] #download.v-download::before {
    background-position: center 55%;
    background-image:
      linear-gradient(180deg, rgba(5,24,18,.84), rgba(5,24,18,.80) 50%, rgba(5,24,18,.90)),
      url("kaaba-door-footer-cinematic.webp");
  }
}