/* The same foundation mark anchors the hero and the site's compact wordmark. */
.brand-mark img{display:block;box-sizing:border-box;width:100%;height:100%;padding:7px;object-fit:contain}
.pro-hero{isolation:isolate}
.hero-copy{isolation:isolate}
.hero-copy::before{
  content:"";
  position:absolute;
  z-index:-1;
  right:-7%;
  bottom:6%;
  width:min(61%,310px);
  aspect-ratio:1;
  background:url("repaircostmatch-mark.svg") center/contain no-repeat;
  opacity:.16;
  pointer-events:none;
}
.hero-brand-stamp{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.hero-brand-stamp .hero-mark{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  flex:0 0 58px;
  padding:8px;
  border:1px solid rgba(143,231,255,.46);
  border-radius:16px;
  background:linear-gradient(145deg,#0d5681,#052b4a);
  box-shadow:0 10px 26px rgba(0,15,32,.24);
}
.hero-brand-stamp .hero-mark img{width:100%;height:100%;object-fit:contain}
.hero-brand-stamp .eyebrow{max-width:250px;line-height:1.45}
@media(max-width:560px){
  .brand-mark img{padding:6px}
  .hero-copy::before{width:88%;right:-14%;bottom:12%;opacity:.12}
  .hero-brand-stamp{gap:6px;margin-bottom:5px}
  .hero-brand-stamp .hero-mark{width:34px;height:34px;flex-basis:34px;padding:5px;border-radius:9px}
  .hero-brand-stamp .eyebrow{font-size:7px!important;line-height:1.2!important}
}
