/* QGB-WEB-PAGE-HOME-01. All changes are isolated to the active Home page.
   Composite slices retain the user's confirmed left-to-right asset order. */
#page-home .hero::before {
  background-image: url("assets/home/QGB-HOME-HERO-01.png");
  background-position: 50% 50%;
}

#page-home .hero::after {
  background: linear-gradient(180deg,
    rgba(27,41,53, .22),
    rgba(27,41,53, .18) 22%,
    rgba(27,41,53, .46) 58%,
    rgba(27,41,53, .24));
}

#page-home .hero h1 {
  font-size: clamp(42px, 5.2vw, 64px);
}

#page-home .hero-lead,
#page-home .hero .eyebrow,
#page-home .hero-note {
  color: #ffffff;
  text-shadow: 0 1px 8px rgba(27,41,53, .28);
}

#page-home .capability-card:nth-child(1) {
  background-image: url("assets/home/QGB-HOME-GROWTH-SET-01-01.png");
}
#page-home .capability-card:nth-child(2) {
  background-image: url("assets/home/QGB-HOME-GROWTH-SET-01-02.png");
}
#page-home .capability-card:nth-child(3) {
  background-image: url("assets/home/QGB-HOME-GROWTH-SET-01-03.png");
}
#page-home .capability-card:nth-child(4) {
  background-image: url("assets/home/QGB-HOME-GROWTH-SET-01-04.png");
}
#page-home .capability-card:nth-child(5) {
  background-image: url("assets/home/QGB-HOME-GROWTH-SET-01-05.png");
}
#page-home .capability-card:nth-child(n) {
  background-position: center top;
  background-size: 100% auto;
}
#page-home .capability-card:nth-child(2) { background-position: center 90%; }
#page-home .capability-card:nth-child(3) { background-position: center 95%; }
#page-home .capability-card:nth-child(4) { background-position: center 15%; }
#page-home .capability-card:nth-child(5) { background-position: center 50%; }

#page-home .work-diagram span {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #ffffff;
  text-shadow: 0 1px 5px rgba(27,41,53, .55);
}
#page-home .work-card.studio .work-diagram span:nth-child(1) {
  background-image: linear-gradient(0deg, rgba(27,41,53, .62), transparent 65%), url("assets/home/QGB-HOME-STUDIO-SET-01-01.png");
}
#page-home .work-card.studio .work-diagram span:nth-child(2) {
  background-image: linear-gradient(0deg, rgba(27,41,53, .62), transparent 65%), url("assets/home/QGB-HOME-STUDIO-SET-01-02.png");
}
#page-home .work-card.studio .work-diagram span:nth-child(3) {
  background-image: linear-gradient(0deg, rgba(27,41,53, .62), transparent 65%), url("assets/home/QGB-HOME-STUDIO-SET-01-03.png");
}
#page-home .work-card.consultancy .work-diagram span:nth-child(1) {
  background-image: linear-gradient(0deg, rgba(27,41,53, .62), transparent 65%), url("assets/home/QGB-HOME-CONSULTANCY-SET-01-01.png");
}
#page-home .work-card.consultancy .work-diagram span:nth-child(2) {
  background-image: linear-gradient(0deg, rgba(27,41,53, .62), transparent 65%), url("assets/home/QGB-HOME-CONSULTANCY-SET-01-02.png");
}
#page-home .work-card.consultancy .work-diagram span:nth-child(3) {
  background-image: linear-gradient(0deg, rgba(27,41,53, .62), transparent 65%), url("assets/home/QGB-HOME-CONSULTANCY-SET-01-03.png");
}

#page-home .home-final-cta::before {
  display: block;
  background-image: url("assets/home/QGB-HOME-CTA-BG-01.png");
  background-position: center 52%;
}
#page-home .home-final-cta::after {
  display: block;
  background: radial-gradient(ellipse at center, rgba(27,41,53, .58), rgba(27,41,53, .24));
}
#page-home .home-final-cta p {
  color: #ffffff;
}

@media (max-width: 980px) {
  #page-home .hero::before {
    background-position: 37% center;
  }
}

@media (max-width: 640px) {
  #page-home .hero h1 {
    font-size: clamp(42px, 11vw, 56px);
  }
  #page-home .home-final-cta::before {
    background-position: 58% center;
  }
}
