/* Unified listing / nearby card photo treatment — SSOT for the whole portal.
   Target: no white inset/border, photo flush to card edges, bottom corners rounded,
   soft shadow without 1px hairline ring. */

:root {
  --z-card-radius: 20px;
  --z-card-gap: 0px;
  --z-card-photo-aspect: 1 / 1;
  /* Top flush via card overflow; bottom rounded into body */
  --z-card-photo-radius: 0;
  --z-card-photo-bottom-radius: var(--z-card-radius, 20px);
  --z-card-photo-clip: inset(
    0 round 0 0 var(--z-card-photo-bottom-radius) var(--z-card-photo-bottom-radius)
  );
  /* Soft shadow only — no 0 0 0 1px frame around photos */
  --z-card-outer-ring: 0 1px 3px rgba(0, 0, 0, 0.04);
  --z-card-outer-ring-hover: 0 4px 16px rgba(0, 0, 0, 0.08);
}

/* ── Card chrome ── */
.svc-card,
.sr-card,
.rv-nearby-card,
.similar-card,
.place-card,
.compass-card,
.mkt-card,
.homepage-news-card,
.news-container .card {
  --z-card-gap: 0px;
  border: none !important;
  border-width: 0 !important;
  background-clip: padding-box;
  overflow: hidden;
  box-shadow: var(--z-card-outer-ring) !important;
}

.svc-card:hover,
.sr-card:hover,
.rv-nearby-card:hover,
.similar-card:hover,
.place-card:hover,
.compass-card:hover,
.mkt-card:hover {
  box-shadow: var(--z-card-outer-ring-hover) !important;
}

/* Kill white-gap border pattern wherever still wired to --z-card-gap */
.svc-card,
.sr-card,
.rv-nearby-card,
.similar-card,
.place-card,
.compass-card,
.mkt-card,
.hub-listing-grid .compass-card,
.hub-listing-grid .place-card,
.hub-listing-grid .mkt-card {
  border: none !important;
}

/* ── Photo wraps: flush top, rounded bottom ── */
.svc-card-img,
.sr-card__image-wrap,
.rv-nc-photo,
.similar-card__img-wrap,
.place-card-img,
.compass-card-img,
.mkt-card__img,
.places-side-img {
  border-radius: 0 0 var(--z-card-photo-bottom-radius) var(--z-card-photo-bottom-radius) !important;
  overflow: hidden !important;
  isolation: isolate;
  line-height: 0;
  transform: translateZ(0);
  background: transparent;
}

/* ── Media + carousel ──
   IMPORTANT: do NOT put clip-path on .card-carousel / __track / __slide —
   clip-path on the moving track/slides chops slides 2+ (half/white photo).
   Round corners via overflow:hidden + border-radius on the photo wrap. */

/* Kill accidental clip-path on carousel chrome (overrides svc_catalog / hub-grid) */
.svc-card-img .card-carousel,
.svc-card-img .card-carousel__track,
.svc-card-img .card-carousel__slide,
.sr-card__image-wrap .card-carousel,
.sr-card__image-wrap .card-carousel__track,
.sr-card__image-wrap .card-carousel__slide,
.rv-nc-photo .card-carousel,
.rv-nc-photo .card-carousel__track,
.rv-nc-photo .card-carousel__slide,
.similar-card__img-wrap .card-carousel,
.similar-card__img-wrap .card-carousel__track,
.similar-card__img-wrap .card-carousel__slide,
.place-card-img .card-carousel,
.place-card-img .card-carousel__track,
.place-card-img .card-carousel__slide,
.compass-card-img .card-carousel,
.compass-card-img .card-carousel__track,
.compass-card-img .card-carousel__slide {
  -webkit-clip-path: none !important;
  clip-path: none !important;
}

.svc-card-img > img,
.svc-card-img .card-carousel__slide img,
.sr-card__image-wrap > img,
.sr-card__image-wrap .sr-card__image,
.sr-card__image-wrap .card-carousel__slide img,
.rv-nc-photo > img,
.rv-nc-photo > .rv-nc-nophoto,
.rv-nc-photo .card-carousel__slide img,
.similar-card__img-wrap > img,
.similar-card__img-wrap .card-carousel__slide img,
.place-card-img > img,
.place-card-img .card-carousel__slide img,
.compass-card-img > img,
.compass-card-img .card-carousel__slide img,
.mkt-card__img > img,
.places-side-img > img {
  border-radius: 0 0 var(--z-card-photo-bottom-radius) var(--z-card-photo-bottom-radius) !important;
}

/* Fill square photo box: absolute inset beats % height + HTML 512×341 aspect */
.svc-card-img .card-carousel,
.svc-card-img .card-carousel__track,
.svc-card-img .card-carousel__slide,
.sr-card__image-wrap .card-carousel,
.sr-card__image-wrap .card-carousel__track,
.sr-card__image-wrap .card-carousel__slide,
.similar-card__img-wrap .card-carousel,
.similar-card__img-wrap .card-carousel__track,
.similar-card__img-wrap .card-carousel__slide,
.place-card-img .card-carousel,
.place-card-img .card-carousel__track,
.place-card-img .card-carousel__slide,
.compass-card-img .card-carousel,
.compass-card-img .card-carousel__track,
.compass-card-img .card-carousel__slide,
.rv-nc-photo .card-carousel,
.rv-nc-photo .card-carousel__track,
.rv-nc-photo .card-carousel__slide {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
}

.svc-card-img .card-carousel__slide,
.sr-card__image-wrap .card-carousel__slide,
.similar-card__img-wrap .card-carousel__slide,
.place-card-img .card-carousel__slide,
.compass-card-img .card-carousel__slide,
.rv-nc-photo .card-carousel__slide {
  position: relative !important;
  overflow: hidden !important;
}

.svc-card-img > img,
.svc-card-img .card-carousel__slide img,
.sr-card__image-wrap > img,
.sr-card__image-wrap .sr-card__image,
.sr-card__image-wrap .card-carousel__slide img,
.rv-nc-photo > img,
.rv-nc-photo .card-carousel__slide img,
.similar-card__img-wrap > img,
.similar-card__img-wrap .card-carousel__slide img,
.place-card-img > img,
.place-card-img .card-carousel__slide img,
.compass-card-img > img,
.compass-card-img .card-carousel__slide img,
.mkt-card__img > img,
.places-side-img > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center center;
  display: block !important;
  box-sizing: border-box !important;
}

/* Direct imgs still need a positioned parent */
.svc-card-img,
.sr-card__image-wrap,
.rv-nc-photo,
.similar-card__img-wrap,
.place-card-img,
.compass-card-img,
.mkt-card__img,
.places-side-img {
  position: relative;
}

/* Watermark overlays match photo bottom radius */
.svc-card-img::after,
.sr-card__image-wrap::after,
.rv-nc-photo::after,
.place-card-img::after,
.compass-card-img::after,
.places-side-img::after {
  border-radius: 0 0 var(--z-card-photo-bottom-radius) var(--z-card-photo-bottom-radius) !important;
}

/* Homepage / object-cards must not reintroduce full photo radius */
.homepage-featured-grid,
.homepage-compass-section,
.hub-listing-grid,
.rv-nearby,
.services-grid,
.places-grid {
  --z-card-gap: 0px;
  --z-card-photo-radius: 0;
  --z-card-photo-bottom-radius: var(--z-card-radius, 20px);
}