/* The complete campus stays within the visible hero, above the next section. */
.v2.home-view .site-shell { background-image: none; }
body.v2.home-view::before {
  background-image: linear-gradient(#9cb6c354, #d2dbe35c), url('assets/park-aerial-layout.webp');
}
.v2.home-view .site-shell::before {
  height: 96px;
  background: #edf4fa;
}
.v2 .task-hero {
  isolation: isolate;
  background: #eaf3fa;
}
.v2 .task-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(180deg, #eaf3fa 0px, #eaf3fa00 72px),
    linear-gradient(90deg, #f3f7faf2 0%, #f3f7faaa 26%, #f3f7fa36 43%, #f3f7fa00 55%),
    url('assets/park-aerial-layout.webp');
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, 100% auto;
  background-position: center, center, right bottom;
}
@media (min-width: 761px) and (max-width: 1200px) {
  .v2 .task-hero::before {
    background-size: 100% 100%, 100% 100%, 112% auto;
  }
}
@media (max-width: 760px) {
  .v2.home-view .site-shell::before { height: 76px; }
  .v2 .task-hero {
    --hero-mobile-art: clamp(200px, 71.8vw, 280px);
    padding-bottom: clamp(145px, 48.7vw, 190px);
    background: #edf4fa;
  }
  .v2 .task-hero::before {
    top: auto;
    height: var(--hero-mobile-art);
    background-image: url('assets/park-aerial-layout.webp');
    background-size: auto var(--hero-mobile-art);
    background-position: right bottom;
    mask-image: linear-gradient(180deg, transparent 0px, #000 90px);
  }
  .v2 .hero-image-label { bottom: 11px; }
}