body {
  background: #080807;
}

/* A separate fixed layer stays stable when mobile browser chrome changes. */
.page-backdrop {
  position: fixed;
  inset: 0;
  height: 100lvh;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.page-backdrop img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 45%;
  filter: saturate(.86) contrast(1.04);
}

.page-backdrop::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgb(5 5 4 / 58%);
}

.site-shell {
  z-index: 1;
}

.site-shell .section-band,
.site-shell .gear-band,
.site-shell .product-copy {
  background: rgb(8 8 7 / 45%);
}

.site-shell .hero {
  background: transparent;
}

.site-shell .section-band::before,
.site-shell .section-band::after {
  background: none;
}

.site-shell .shop-footer {
  background: rgb(8 8 7 / 55%);
}

.site-shell .service-list {
  background: rgb(8 8 7 / 62%);
}

@media (min-width: 961px) {
  .topbar {
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 12px;
  }
}

@media (max-width: 600px) {
  .page-backdrop img {
    object-position: 42% 45%;
  }
}