/* Business Anchor: photo spots added from Admin > Photos.
   Every photo gets the same navy + cobalt treatment so mixed photos read as one set. */

/* Wide section photo */
.ba-photo { position: relative; margin: clamp(2rem, 4vw, 3rem) 0 0; overflow: hidden; border-radius: var(--radius); aspect-ratio: 21 / 8; background: var(--raised); }
.ba-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; filter: saturate(0.85) contrast(1.04); }
.ba-photo::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(135deg, rgba(38, 53, 242, 0.32) 0%, rgba(38, 53, 242, 0) 55%),
    linear-gradient(0deg, rgba(7, 11, 36, 0.6) 0%, rgba(7, 11, 36, 0.12) 55%, rgba(7, 11, 36, 0.22) 100%); }
@media (max-width: 860px) { .ba-photo { aspect-ratio: 16 / 9; } }

/* Response Gap: photo behind the big blue box, tinted cobalt */
.cell--hero .cell__photo { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.35) contrast(1.05); }
.cell--hero.has-photo::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(0deg, rgba(38, 53, 242, 0.96) 0%, rgba(38, 53, 242, 0.82) 45%, rgba(38, 53, 242, 0.55) 100%); }
.cell--hero.has-photo > :not(.cell__photo) { position: relative; z-index: 1; }
.cell--hero.has-photo .cell__ring, .cell--hero.has-photo .cell__pulse { position: absolute; }

/* Services list: small photo at the start of a row */
.service__photo { position: relative; display: block; overflow: hidden; border-radius: 10px; aspect-ratio: 3 / 2; background: var(--raised); }
.service__photo img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.85) contrast(1.04); transition: transform 600ms cubic-bezier(.2,.8,.2,1); }
.service__photo::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(135deg, rgba(38, 53, 242, 0.3) 0%, rgba(7, 11, 36, 0.35) 100%); }
.service__link.has-photo { grid-template-columns: 9rem minmax(0, 0.9fr) minmax(0, 1.2fr) 15rem; align-items: center; }
.service__link.has-photo:hover .service__photo img { transform: scale(1.05); }
.services--compact .service__link.has-photo { grid-template-columns: 7rem minmax(0, 0.9fr) minmax(0, 1.2fr) 15rem; }
@media (max-width: 1100px) { .service__link.has-photo, .services--compact .service__link.has-photo { grid-template-columns: 8rem minmax(0, 1fr) minmax(0, 1.2fr); } .service__link.has-photo .service__chip { grid-column: 2 / -1; justify-self: start; } }
@media (max-width: 860px) {
  .service__link.has-photo, .services--compact .service__link.has-photo { grid-template-columns: 1fr; align-items: start; }
  .service__link.has-photo .service__chip { grid-column: auto; }
  .service__photo { aspect-ratio: 16 / 9; }
}

/* Page tops: uploaded photos show a little stronger than the default city photo */
.page-hero--photo .page-hero__img { opacity: 0.62; filter: saturate(0.85); }
