/* Project photographs share the site's filled frames and concise overlay labels. */
.reviewed-picture { display:block; min-width:0; }
.reviewed-img { display:block; max-width:100%; }
.reviewed-carousel [hidden] { display:none !important; }

.reviewed-home-photo { margin:0; }
.reviewed-home-photo .reviewed-img { object-position:50% 50%; }
.reviewed-home-photo .ph-badge { z-index:2; }

.about-story-portrait {
  float:right; width:min(42%,260px); margin:0 0 1.5rem 2rem;
}
.about-story-portrait .reviewed-img {
  width:100%; height:auto; aspect-ratio:4/5; object-fit:contain;
  background:var(--bone); border-radius:2px;
}
.about-story-portrait figcaption {
  font-size:.8rem; line-height:1.45; color:var(--mute); margin-top:.65rem;
}

/* Keep the existing split hero layout with a filled photographic frame. */
.reviewed-carousel .hero-slides { left:52%; right:1.5rem; top:1.5rem; bottom:1.5rem; overflow:hidden; }
.reviewed-carousel .hero-overlay { display:none; }
.reviewed-carousel .hero-content {
  width:min(44vw,560px); max-width:none;
  margin-left:max(4vw,calc((100vw - 1200px)/2)); margin-right:0;
  padding:4rem 0; min-height:540px;
}
.reviewed-carousel.single .hero-content { min-height:480px; }
.reviewed-carousel .hero-slide .reviewed-picture {
  inset:0; width:100%; height:100%;
}
.reviewed-carousel .hero-slide .reviewed-img {
  object-fit:cover; object-position:var(--photo-position,50% 50%); width:100%; height:100%;
}
.reviewed-hero-caption {
  position:absolute; z-index:3; left:0; right:0; bottom:0;
  margin:0; padding:2.4rem 1rem 3rem;
  background:linear-gradient(0deg,rgba(0,0,0,.75),transparent);
  color:#fff; font:700 .75rem/1.5 var(--sans); letter-spacing:.1em;
  text-transform:uppercase; text-align:left;
}
.reviewed-carousel.single .reviewed-hero-caption { padding-bottom:1rem; }
.reviewed-carousel .hero-arrow { z-index:4; }
.reviewed-carousel .hero-prev { left:52%; }
.reviewed-carousel .hero-nav { z-index:4; left:52%; right:1.5rem; bottom:2rem; }

/* Distinct detail views from the same approved master, using only real pixels. */
#hero-garage-floor-epoxy-3 .reviewed-img { object-fit:cover; object-position:50% 95%; }
#hero-siding-repair-3 .reviewed-img { object-fit:cover; object-position:50% 65%; }
#work-commercial-2 .reviewed-img { object-position:54% 50%; }

.work-tile { overflow:hidden; }
.work-tile > .reviewed-picture .reviewed-img { object-fit:cover; object-position:var(--photo-position,50% 50%); }
.reviewed-picture[data-reviewed-asset="light-brick-prep"] { --photo-position:48% 50%; }
.reviewed-picture[data-reviewed-asset="timber-soffit"] { --photo-position:50% 35%; }
.reviewed-picture[data-reviewed-asset="stairwell-prep"] { --photo-position:50% 80%; }
.reviewed-picture[data-reviewed-asset="finish-cabinet-high-gloss-lacquer-kitchen-03-after-kitchen-overview"] { --photo-position:30% 50%; }

.reviewed-card { position:relative; margin:0; min-width:0; overflow:hidden; aspect-ratio:4/5; }
.reviewed-card .reviewed-picture { width:100%; height:100%; }
.reviewed-card .reviewed-img { width:100%; height:100%; object-fit:cover; object-position:var(--photo-position,50% 50%); }
.reviewed-card figcaption {
  position:absolute; inset:auto 0 0; margin:0; z-index:4; padding:2rem .9rem .8rem;
  background:linear-gradient(0deg,rgba(0,0,0,.75),transparent);
  color:#fff; font:700 .75rem/1.5 var(--sans); letter-spacing:.1em; text-transform:uppercase;
}

@media (max-width:900px) {
  .reviewed-carousel { display:flex; flex-direction:column; min-height:0; padding-bottom:0; }
  .reviewed-carousel .hero-content,
  .reviewed-carousel.single .hero-content {
    order:0; width:92%; max-width:none; min-height:0;
    margin:0 auto; padding:2.5rem 0 1.25rem;
  }
  .reviewed-carousel .hero-slides {
    order:1; position:relative; inset:auto; width:92%; margin:0 auto;
    height:clamp(360px,80vw,560px); flex:none;
  }
  .reviewed-carousel .hero-slide .reviewed-picture { inset:0; height:100%; }
  .reviewed-hero-caption { bottom:0; padding:2rem .9rem 3rem; }
  .reviewed-carousel.single .reviewed-hero-caption { bottom:0; padding-bottom:1rem; }
  .reviewed-carousel.single .hero-slide .reviewed-picture { bottom:0; height:100%; }
  .reviewed-carousel .hero-nav { bottom:1rem; left:0; right:0; }
  .reviewed-carousel .hero-prev { left:1rem; }
  /* Detail crops retain a floor/wall edge for context at narrow widths. */
  #hero-garage-floor-epoxy-3 .reviewed-img { object-position:65% 95%; }
  #hero-siding-repair-3 .reviewed-img { object-position:50% 65%; }
}
@media (max-width:600px) {
  .about-story-portrait { float:none; width:100%; max-width:320px; margin:0 auto 1.5rem; }
}
