/* Object cards reuse the catalog appearance with their own responsive grid. */
.objects-grid.catalog-grid{grid-template-columns:1fr;max-width:none;margin-inline:0}
@media(min-width:560px){.objects-grid.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1150px){.objects-grid.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Object page heroes use the supplied panoramic images. */
:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero){position:relative;isolation:isolate;overflow:hidden}
:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero) .category-hero-inner{min-height:620px;grid-template-columns:1fr;padding-block:80px}
:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero) .category-hero-copy{position:relative;z-index:2;max-width:720px}
:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero) .category-figure{position:absolute;inset:0;z-index:-2;max-width:none;height:100%;margin:0;border-radius:0}
:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero) .category-figure img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center}
:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero)::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,22,34,.78),rgba(8,22,34,.38) 48%,rgba(8,22,34,.04) 85%)}
:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero) .category-figure figcaption{position:absolute;bottom:0;right:0;max-width:460px;background:rgba(8,22,34,.75);border:0}
@media(max-width:680px){:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero) .category-hero-inner{min-height:600px;padding-block:48px 100px}:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero) .category-figure img{object-position:62% center}:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero)::after{background:linear-gradient(180deg,rgba(8,22,34,.76),rgba(8,22,34,.48) 48%,rgba(8,22,34,.12))}:is(.oil-gas-hero, .energy-hero, .logistics-hero, .data-centers-hero, .industry-hero, .water-utilities-hero) .category-figure figcaption{font-size:9px}}
/* Photo overlays are scoped to the six cards on the home page. */
#solutions .catalog-card {
  overflow: hidden;
}

#solutions .catalog-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(0, 0, 0, 0.25);
  pointer-events: none;
  transition: background-color 400ms ease-in-out;
}

#solutions .catalog-card-image {
  object-fit: cover;
  transform: scale(1);
  transition: transform 400ms ease-in-out;
}

#solutions .catalog-card-copy,
#solutions .catalog-card-arrow {
  z-index: 1;
}

#solutions .catalog-card-copy {
  position: relative;
}

#solutions .catalog-card:focus-visible::before {
  background-color: rgba(0, 0, 0, 0.10);
}

#solutions .catalog-card:focus-visible .catalog-card-image {
  transform: scale(1.03);
}

@media (hover: hover) and (pointer: fine) {
  #solutions .catalog-card:hover::before {
    background-color: rgba(0, 0, 0, 0.10);
  }

  #solutions .catalog-card:hover .catalog-card-image {
    transform: scale(1.03);
  }
}

@media (prefers-reduced-motion: reduce) {
  #solutions .catalog-card::before,
  #solutions .catalog-card-image {
    transition: none;
  }

  #solutions .catalog-card:hover .catalog-card-image,
  #solutions .catalog-card:focus-visible .catalog-card-image {
    transform: none;
  }
}
/* Keep the text backing near the bottom of object cards. */
#solutions .catalog-card::after {
  background: linear-gradient(
    180deg,
    transparent 50%,
    color-mix(in srgb, var(--card-bg) 35%, transparent) 70%,
    var(--card-bg) 100%
  );
}