/* Translucent-fold artwork and section transitions. */
.hero-scene, .closing-section { background: #f8f8fb; }
.hero-scene > .scene-image, .closing-section > .scene-image { height: 100%; }
.hero-scene > .scene-image > img, .closing-section > .scene-image > img {
  height: 100%; object-fit: cover; object-position: center bottom; mask-image: none;
}
.hero-scene > .scene-image::after, .closing-section > .scene-image::after {
  content: ''; position: absolute; inset: auto 0 0;
  height: clamp(120px, 13vw, 220px);
  background: linear-gradient(to bottom,
    rgb(255 255 255 / 0) 0%,
    rgb(255 255 255 / .04) 15%,
    rgb(255 255 255 / .16) 30%,
    rgb(255 255 255 / .4) 48%,
    rgb(255 255 255 / .7) 66%,
    rgb(255 255 255 / .9) 83%, #fff 100%);
}
.closing-section > .scene-image::before {
  content: ''; position: absolute; z-index: 1; inset: 0 0 auto;
  height: clamp(100px, 11vw, 180px);
  background: linear-gradient(to bottom, #f8f8fb 0%,
    rgb(248 248 251 / .9) 17%, rgb(248 248 251 / .7) 34%,
    rgb(248 248 251 / .4) 52%, rgb(248 248 251 / .16) 70%,
    rgb(248 248 251 / .04) 85%, rgb(248 248 251 / 0) 100%);
}
.supporters-strip {
  position: relative; inset: auto; width: 100%; min-height: 144px;
  margin: 0; padding-block: 28px; gap: 14px; background: #fff;
}
/* Adjacent surfaces meet at the same solid color; no seam behind the fades. */
.team-section::after {
  content: ''; position: absolute; z-index: -1; inset: auto 0 0; height: 140px;
  background: linear-gradient(rgb(248 248 251 / 0), #f8f8fb); pointer-events: none;
}
.closing-section + .newsletter-section {
  background: linear-gradient(to bottom, #fff, #f5f8fb 180px);
}
.closing-section + .newsletter-section::before {
  mask-image: linear-gradient(transparent, #000 180px);
}
@media (max-width: 800px) {
  .hero-scene, .closing-section { background: #f8f8fb; }
  .hero { padding-bottom: 28px; }
  .hero-scene > .scene-image { grid-area: 3 / 1; }
  .closing-section > .scene-image { grid-area: 2 / 1; }
  .hero-scene > .scene-image, .closing-section > .scene-image {
    height: auto; aspect-ratio: 1200 / 982;
  }
  .hero-scene > .scene-image > img, .closing-section > .scene-image > img {
    position: static; width: 100%; min-width: 0; max-width: 100%; height: auto;
    transform: none; mask-image: none;
  }
  .hero-scene > .scene-image::before {
    content: ''; position: absolute; z-index: 1; inset: 0 0 auto;
    height: 80px;
    background: linear-gradient(to bottom, #f8f8fb, rgb(248 248 251 / .85) 25%, rgb(248 248 251 / .35) 60%, rgb(248 248 251 / 0));
  }
  .closing-section > .scene-image::before { height: 80px; }
  .hero-scene > .scene-image::after, .closing-section > .scene-image::after { height: 100px; }
  .supporters-strip {
    min-height: 132px; padding-block: 24px; gap: 12px;
  }
  .closing-inner { padding-bottom: 28px; }
}
