/* Helprite Group V21 — Photography-led sections.
   Images are normal <img> elements with stable data-cms-media-key identifiers;
   the existing Visual Website Editor owns image source, alt, object-fit and size. */
.hg-image-frame{
  display:block;
  position:relative;
  overflow:hidden;
  min-width:0;
  margin:0;
  aspect-ratio: 1.75 / 1;
  background:#e7ebf1;
  border:1px solid #dbe3ed;
  border-radius:10px;
  box-shadow:0 12px 30px -28px rgba(16,33,60,.32);
}
.hg-image-frame>img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border-radius:inherit;
}
.hg-page-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);
  gap:clamp(28px,5vw,86px);
  align-items:center;
}
.hg-page-hero-grid>.hg-page-hero-copy{min-width:0;max-width:100%}
.hg-page-hero-grid>.hg-page-hero-copy h1{
  font-size:clamp(2.25rem,3.5vw,3.35rem);
  line-height:1.14;
  letter-spacing:-.045em;
  margin-bottom:.95rem;
}
.hg-page-hero-grid>.hg-page-hero-copy h2{
  font-size:clamp(1.18rem,2vw,1.65rem);
  line-height:1.35;
  letter-spacing:-.026em;
}
.hg-page-hero-grid>.hg-page-hero-copy p{max-width:66ch}
.hg-page-hero-image{aspect-ratio:1.26/1;min-height:260px}
.hg-brand-intro{margin-bottom:34px}
.hg-contact-intro{margin-bottom:20px}
.hg-contact-intro .hg-page-hero-image{aspect-ratio:1.85/1;min-height:220px}
.hg-inline-photo{aspect-ratio:1.72/1;margin:26px 0 0}
.hg-photo-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:30px 0 6px}
.hg-photo-pair>.hg-image-frame{aspect-ratio:1.7/1}
.hg-service-story{min-width:0}
.hg-service-story .hg-story-image{margin-bottom:22px;aspect-ratio:1.7/1}
.hg-service-story h3{margin-bottom:8px}
.hg-media-break{padding:0 0 clamp(28px,4vw,60px)}
.hg-media-break .hg-image-frame{aspect-ratio:3/1}
/* Make sure images in the editor remain naturally selectable. */
.hg-image-frame img[data-cms-media-key]{cursor:inherit}
@media (hover:hover){
  .hg-image-frame>img{transition:transform .55s cubic-bezier(.2,.65,.25,1)}
  .hg-image-frame:hover>img{transform:scale(1.025)}
}
@media(max-width:980px){
 .hg-page-hero-grid{grid-template-columns:1fr;gap:24px}
 .hg-page-hero-image{aspect-ratio:1.9/1;min-height:220px}
 .hg-contact-intro{margin-bottom:22px}
}
@media(max-width:650px){
 .hg-page-hero-grid>.hg-page-hero-copy h1{font-size:clamp(2rem,7vw,2.6rem);line-height:1.18}
 .hg-page-hero-image{aspect-ratio:1.55/1;min-height:0}
 .hg-image-frame{border-radius:7px}
 .hg-photo-pair{grid-template-columns:1fr;gap:16px;margin-top:22px}
 .hg-photo-pair>.hg-image-frame{aspect-ratio:1.72/1}
 .hg-inline-photo{margin-top:22px}
 .hg-media-break .hg-image-frame{aspect-ratio:1.65/1}
}
@media(prefers-reduced-motion:reduce){.hg-image-frame>img{transition:none!important}}