/* Supplied standalone artwork, scoped to Games/About. Home stays unchanged. */
[data-page="games"] .games-scene {
  top: -105px;
  width: 100%;
  height: 409px;
  background: url('/assets/games-scene.png') right 70px top -60px / auto 620px no-repeat;
  mask-image:
    linear-gradient(90deg, transparent 25%, #000 51%, #000 93%, transparent),
    linear-gradient(#000 92%, transparent);
  mask-composite: intersect;
  opacity: 1;
}

[data-page="games"] .all-games-grid .game-art {
  background: none;
}

[data-page="games"] .all-games-grid .game-art img {
  position: static;
  width: 100%;
  height: 100%;
  max-width: 100%;
  margin: 0;
  object-fit: cover;
  object-position: center;
  transform: none;
  mask-image: none;
}

[data-page="about"] .about-scene {
  top: -105px;
  bottom: auto;
  /* Keep the artwork aligned with the centered content on maximized screens.
     Unbounded 127vw scaling pushed both characters below the fixed scene. */
  width: min(100%, 1672px);
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  height: 794px;
  background-image:
    linear-gradient(90deg, #050e17 0%, #050e17f5 24%, #050e17e6 33%, #050e1759 42%, transparent 50%),
    linear-gradient(#050e17df, #050e1766 13%, transparent 30%),
    url('/assets/about-scene.png');
  background-size: 100% 100%, 100% 100%, 127% auto;
  background-position: 0 0, 0 0, right -74px top -215px;
  background-repeat: no-repeat;
  mask-image: linear-gradient(#000 89%, transparent 100%);
}

[data-page="about"] .about-scene::after {
  content: none;
}

@media (min-width: 1673px) {
  [data-page="about"] .about-scene {
    mask-image:
      linear-gradient(90deg, transparent, #000 5%, #000 94%, transparent),
      linear-gradient(#000 89%, transparent);
    mask-composite: intersect;
  }
}

/* Move the whole identity/signature row down; keep the divider in place. */
[data-page="games"] .footer-inner > *,
[data-page="about"] .footer-inner > * {
  transform: translateY(20px);
}

@media (min-width: 901px) and (max-width: 1500px) {
  [data-page="games"] .games-scene {
    background-position: right 0 top -60px;
  }
  [data-page="about"] .about-scene {
    background-size: 100% 100%, 100% 100%, auto 1120px;
    background-position: 0 0, 0 0, right -90px top -168px;
  }
}

@media (max-width: 900px) {
  [data-page="games"] .games-scene {
    top: -86px;
    height: 370px;
    background-size: auto 470px;
    background-position: right -90px top 0;
    mask-image: linear-gradient(90deg, transparent, #000 60%);
  }
  [data-page="about"] .about-scene {
    top: auto;
    bottom: 0;
    height: 490px;
    background-image: url('/assets/about-scene.png');
    background-size: auto 660px;
    background-position: right -40px bottom -65px;
    mask-image: linear-gradient(transparent, #000 18%, #000 85%, transparent);
  }
  [data-page="games"] .footer-inner,
  [data-page="about"] .footer-inner {
    padding-bottom: 30px;
  }
  [data-page="games"] .footer-inner > *,
  [data-page="about"] .footer-inner > * {
    transform: translateY(12px);
  }
}

@media (max-width: 540px) {
  [data-page="games"] .games-scene {
    height: 350px;
    background-size: auto 430px;
    background-position: right -100px top 0;
    opacity: .8;
  }
  [data-page="about"] .about-scene {
    height: 340px;
    background-size: auto clamp(390px, 121.8vw, 475px);
    background-position: right -45px bottom -35px;
  }
}