/* =========================
   Campaign: Hero + Layout fixes
   ========================= */

/* ---- Variables (optional but keeps things consistent) ---- */
:root{
  --hero-bg: #1c3755;
  --stacked-logo: url("/-/media/images/svg-logos/mhs-logo-stacked.svg");
}

/* ---- HERO base ---- */
.hero::before{
  background: none; /* removes background arrows */
}

/* Default: hide the inline hero image on desktop so wide background shows */
.hero__bg-image img{
  display: none;
}

/* Desktop hero background */
.hero{
  background: var(--hero-bg);
  background-image: var(--hero-desktop-bg);
  background-repeat: no-repeat;
  background-position: right 70%;
  margin-bottom: 0;
}

/* Fix for hero background positioning on certain templates / screens */
.hero.hero--w-img{
  background-position: right;
}

/* Large but not ultra-wide: center looks better than “flush right” */
@media screen and (max-width: 125em){
  .hero.hero--w-img{
    background-position: center;
  }
	
	
}

/* Desktop tweak: allow hero inner wrapper to behave when only one CTA */
@media screen and (min-width: 64em){
  .hero .hero_inner_wrapper{
    display: block;
  }
	
	
.image-with-ctas h2.title{
    text-shadow: 4px 4px 7px #062657;
    font-size: 3em;

}
}

@media screen and (min-width: 64em) {
    .hero .hero__bg-image+.hero_inner_wrapper {
        width: 110%;
    }
}

/* ---- Hero title SVG replacement ---- */
.hero__title-container{
  z-index: 9;
  background-image: var(--hero-title-svg); /* FIXED URL */
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left;
  height: 290px;
}

/* Hide the H1 + description visually, but keep accessible to screen readers */
.hero__title,
.hero__description{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.hero__title-container::after{
  display: none;
}

/* =========================
   Rich Text w/ Background
   ========================= */

/* Remove italic/default bold from the component */
.rich-text-with-background{
  font-style: normal;
  font-weight: 400;
  margin: 0 auto 3.75rem;
}

/* Replace vertical cyan line with stacked logo */
.rich-text-line{
  background: var(--stacked-logo) no-repeat center;
  border: none;
  margin: 1rem 2.5rem 1rem 0;
  padding: 0 15.6875rem 5.75rem 0;
}

/* Make the container wider */
.rich-text-with-background .rich-container{
  max-width: 69.375rem;
}

/* Mobile spacing: center logo + better margins */
@media screen and (max-width: 47.99875em){
  .rich-text-line{
    width: auto;
    margin: 1rem 1rem 2rem;
  }
}

/* =========================
   Cards / Lists / Typography tweaks
   ========================= */

/* Multi Column Cards with Title: keep text aligned consistently */
.image-with-ctas__container .cta__text{
  justify-content: flex-start;
}

/* Reduce default list padding for tighter layout */
.link-list-with-image .links-container ul.link-list li.link{
  padding-bottom: 0.625rem;
}

/* Heading scale on desktop */
@media screen and (min-width: 64em){
  .h2,
  .rtf h2{
    font-size: 3.1rem;
    line-height: 3.5rem;
  }
	
}

/* Related doctors title when copy is too long */
.related-doctors .title{
  font-size: 1.7rem;
}

/* =========================
   Tablet / Mobile behavior
   ========================= */

/* <= 63.9988em: show the hero image <img>, hide wide background */
@media screen and (max-width: 63.9988em){
  .hero__bg-image img{
    display: block;
    width: 100%;
  }

  .hero{
    background: #135299; /* hides wide background hero image */
  }

  .rich-text-with-background{
    margin-bottom: auto;
  }

  .hero__title-container{
    max-height: 230px;
    background-position: center;
  }

  .hero__ctas{
    margin: 2.5rem auto;
  }
	
}

/* <= 48em: tighten title container + make CTAs span */
@media screen and (max-width: 48em){
  .hero__title-container{
    max-height: 160px;
  }

  .hero__ctas{
    margin: 1.875rem 0;
  }
	

}