/* One homepage visual, one job: show that DBM measures the problem before it
   builds the next layer. The image is the hero object; CSS only adds depth,
   readable overlays, and a restrained motion cue. */
.dbm-home-page .dbm-caliper-stage {
  margin: 0;
  background: #06100d;
  isolation: isolate;
  box-shadow: inset 0 0 54px rgba(0, 0, 0, .55), 0 24px 60px rgba(0, 0, 0, .24);
}
.dbm-home-page .dbm-caliper-stage::before {
  z-index: 1;
  background: linear-gradient(90deg, rgba(2, 10, 8, .18), rgba(2, 10, 8, .04) 46%, rgba(2, 10, 8, .38)), linear-gradient(0deg, rgba(2, 10, 8, .66), transparent 42%);
}
.dbm-home-page .dbm-caliper-stage::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 12% 8% 14%;
  border: 1px solid rgba(126, 200, 32, .2);
  border-radius: 12px;
  box-shadow: 0 0 34px rgba(126, 200, 32, .07), inset 0 0 28px rgba(126, 200, 32, .04);
  pointer-events: none;
  transform: perspective(900px) rotateX(1deg) translateZ(0);
}
.dbm-home-page .dbm-caliper-stage > picture,
.dbm-home-page .dbm-caliper-stage > picture > img,
.dbm-home-page .dbm-caliper-stage > img {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transform: scale(1.035);
  transition: transform .7s cubic-bezier(.2, .7, .2, 1), filter .7s ease;
  pointer-events: none;
}
.dbm-home-page .dbm-caliper-visual-copy {
  position: absolute;
  z-index: 3;
  right: 15px;
  bottom: 14px;
  left: 15px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  color: #e7f5e9;
}
.dbm-home-page .dbm-caliper-visual-copy strong {
  display: block;
  color: #d8ff9a;
  font: 900 clamp(13px, 1.8vw, 18px)/1.05 var(--dbm-font-display, ui-sans-serif, sans-serif);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .85);
}
.dbm-home-page .dbm-caliper-visual-copy span:not(.dbm-spokane-map-tag) {
  display: block;
  margin-top: 5px;
  color: #e7f5e9;
  font-size: 12px;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .9);
}
.dbm-home-page .dbm-caliper-hero .dbm-spokane-map-tag {
  color: #07110f !important;
  background: #7ec820;
  border-color: #b7f06b;
  box-shadow: 0 0 20px rgba(126, 200, 32, .3);
}
@media (hover: hover) and (pointer: fine) {
  .dbm-home-page .dbm-caliper-hero:hover .dbm-caliper-stage > picture > img,
  .dbm-home-page .dbm-caliper-hero:hover .dbm-caliper-stage > img,
  .dbm-home-page .dbm-caliper-hero:focus-within .dbm-caliper-stage > picture > img,
  .dbm-home-page .dbm-caliper-hero:focus-within .dbm-caliper-stage > img {
    transform: scale(1.065) translate3d(-.4%, -.4%, 0);
    filter: saturate(1.06) contrast(1.03);
  }
}
@media (min-width: 801px) {
  .dbm-home-page .dbm-home-grid .dbm-hero-panel {
    margin-right: auto !important;
    margin-left: 24px !important;
  }
}
@media (max-width: 800px) {
  .dbm-home-page .spatial-home { overflow-x: clip; contain: paint; }
  .dbm-home-page .dbm-caliper-stage > picture > img,
  .dbm-home-page .dbm-caliper-stage > img { object-position: 64% center; }
}
@media (max-width: 560px) {
  .dbm-home-page .dbm-caliper-stage > picture > img,
  .dbm-home-page .dbm-caliper-stage > img { object-position: 68% center; }
  .dbm-home-page .dbm-caliper-visual-copy { right: 12px; bottom: 12px; left: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .dbm-home-page .dbm-caliper-stage > picture > img,
  .dbm-home-page .dbm-caliper-stage > img { transition: none; transform: none; }
}