/* Bright Medihab homepage treatment aligned with the wider company family. */
.mhc-homepage{background:#fff}
.mhc-home-hero.has-image{
  background-image:
    linear-gradient(90deg,
      rgba(255,255,255,var(--mhc-home-hero-overlay,.82)) 0%,
      rgba(255,255,255,calc(var(--mhc-home-hero-overlay,.82) * .88)) 36%,
      rgba(255,255,255,.38) 68%,
      rgba(255,255,255,.08) 100%),
    var(--mhc-home-hero-image);
}
.mhc-home-hero.has-image .mhc-home-hero-copy{color:var(--mhc-green)}
.mhc-home-hero.has-image h1{color:#27463a}
.mhc-home-hero.has-image p{color:#3f5049}
.mhc-home-hero.has-image .mhc-home-kicker{color:#b67b00}
.mhc-home-hero.has-image .mhc-home-button-secondary{color:var(--mhc-green);border-color:rgba(51,81,68,.72);background:rgba(255,255,255,.72)}
.mhc-home-trust-strip{background:#edf2ef;border-top:1px solid #e7ece9;border-bottom:1px solid #e7ece9}
.mhc-home-trust-strip>div{background:#fff}
.mhc-home-benefit-grid article{background:#faf8f3;border:1px solid #efebe1}

/* Approved mobility-scooter lifestyle banner.
 * The Storefront-selected scooter image fills the COMPLETE banner.
 * The Medihab green treatment is a left-side gradient over the photograph,
 * not a separate green panel and not a separate image card. */
.mhc-home-scooter-feature{
  position:relative;
  isolation:isolate;
  width:min(1240px,calc(100% - 40px));
  min-height:470px;
  margin:0 auto 72px;
  padding:64px 64px;
  display:flex;
  align-items:center;
  overflow:hidden;
  color:#fff;
  border-radius:28px;
  background:#335144;
  box-shadow:0 18px 48px rgba(51,81,68,.10);
}

/* Full-bleed lifestyle photograph. */
.mhc-home-scooter-media{
  position:absolute;
  inset:0;
  z-index:-2;
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:inherit;
}
.mhc-home-scooter-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border-radius:inherit;
}

/* Deep green on the left, fading smoothly into the photograph. */
.mhc-home-scooter-feature:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(90deg,
    rgba(42,78,64,.98) 0%,
    rgba(42,78,64,.95) 22%,
    rgba(42,78,64,.84) 38%,
    rgba(42,78,64,.60) 50%,
    rgba(42,78,64,.28) 64%,
    rgba(42,78,64,.07) 78%,
    rgba(42,78,64,0) 100%);
  pointer-events:none;
}

.mhc-home-scooter-copy{
  position:relative;
  z-index:2;
  width:min(600px,54%);
  max-width:600px;
}
.mhc-home-scooter-copy .mhc-home-kicker{
  color:#f9bf29;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.mhc-home-scooter-copy h2{
  max-width:590px;
  margin:14px 0 16px;
  color:#fff;
  font-size:clamp(32px,3.1vw,46px);
  line-height:1.08;
  letter-spacing:-.025em;
}
.mhc-home-scooter-copy p{
  max-width:570px;
  margin:0 0 28px;
  color:rgba(255,255,255,.94);
  font-size:17px;
  line-height:1.65;
}
.mhc-home-scooter-copy .mhc-home-button-primary{
  display:inline-flex;
  align-items:center;
  min-height:52px;
  padding:13px 25px;
  background:#f9bf29;
  color:#335144;
  border:0;
  border-radius:999px;
  font-weight:800;
}
.mhc-home-scooter-copy .mhc-home-button-primary:after{
  content:'→';
  margin-left:12px;
  font-size:18px;
  line-height:1;
}
.mhc-home-scooter-image-placeholder{
  width:100%;
  height:100%;
  display:block;
  background:linear-gradient(135deg,#335144,#496d5d);
  color:transparent;
  font-size:0;
}

.mhc-home-needs-panel{background:linear-gradient(135deg,#f8fbf9,#e7efeb);border:1px solid #dce6e1}
.mhc-home-help{background:#fbf8f0}

@media(max-width:1024px){
  .mhc-home-scooter-feature{min-height:430px;padding:52px 44px}
  .mhc-home-scooter-copy{width:min(590px,62%)}
}

@media(max-width:720px){
  .mhc-home-hero.has-image{
    background-image:
      linear-gradient(180deg,
        rgba(255,255,255,.92) 0%,
        rgba(255,255,255,.80) 58%,
        rgba(255,255,255,.48) 100%),
      var(--mhc-home-hero-mobile-image,var(--mhc-home-hero-image));
  }
  .mhc-home-scooter-feature{
    width:calc(100% - 28px);
    min-height:520px;
    margin-bottom:54px;
    padding:34px 24px;
    align-items:flex-end;
    border-radius:22px;
  }
  .mhc-home-scooter-feature:after{
    background:linear-gradient(180deg,
      rgba(42,78,64,.03) 0%,
      rgba(42,78,64,.10) 28%,
      rgba(42,78,64,.48) 52%,
      rgba(42,78,64,.90) 72%,
      rgba(42,78,64,.98) 100%);
  }
  .mhc-home-scooter-copy{width:100%;max-width:none}
  .mhc-home-scooter-copy h2{font-size:30px}
  .mhc-home-scooter-copy p{font-size:15px}
  .mhc-home-scooter-media img{object-position:center center}
}
