/* =========================================================
   LV WAX — FINAL HOMEPAGE OVERRIDES
   Mobile hero uses the actual hero-1.png background.
   ========================================================= */


/* =========================================================
   MOBILE HOMEPAGE HERO
   ========================================================= */

@media (max-width: 820px) {

  /*
    Header remains fixed.
  */
  .site-header {
    position: fixed !important;

    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    width: 100% !important;

    z-index: 99999 !important;

    overflow: visible !important;

    background:
      rgba(31,15,8,.98) !important;

    box-shadow:
      0 7px 22px
      rgba(20,9,5,.22) !important;
  }


  body {
    padding-top: 82px !important;
  }


  /*
    TRUE FULL-BLEED HERO.

    The homepage image is a background image,
    so restore it directly on .hero.
  */
  .hero {
    position: relative !important;

    min-height: 940px !important;

    padding: 0 !important;

    display: block !important;

    overflow: hidden !important;

    background:
      linear-gradient(
        180deg,
        rgba(28,14,8,.02) 0%,
        rgba(28,14,8,.03) 35%,
        rgba(28,14,8,.16) 52%,
        rgba(28,14,8,.50) 73%,
        rgba(28,14,8,.82) 100%
      ),
      url('assets/images/hero-1.png')
      67% center / cover no-repeat !important;
  }


  .hero-grid {
    position: relative !important;

    width: 100% !important;

    min-height: 940px !important;

    margin: 0 !important;

    padding: 0 !important;

    display: block !important;

    background: transparent !important;
  }


  /*
    Remove old/mobile image elements.
    The background on .hero is now the image.
  */
  .hero-image {
    display: none !important;
  }


  /*
    Luxury glass panel over photograph.
  */
  .hero-copy {
    position: absolute !important;

    left: 18px !important;
    right: 18px !important;
    bottom: 34px !important;

    z-index: 5 !important;

    width: auto !important;
    max-width: 540px !important;

    min-height: auto !important;

    margin: 0 !important;

    padding:
      24px
      21px
      22px !important;

    background:
      linear-gradient(
        135deg,
        rgba(48,24,14,.78),
        rgba(27,13,8,.65)
      ) !important;

    border:
      1px solid
      rgba(226,183,96,.32) !important;

    box-shadow:
      0 18px 38px
      rgba(0,0,0,.24) !important;

    backdrop-filter:
      blur(5px) !important;

    -webkit-backdrop-filter:
      blur(5px) !important;
  }


  /*
    Text becomes readable over photograph.
  */
  .hero-copy h1 {
    color: #fffaf5 !important;

    margin-bottom: 15px !important;
  }


  .hero-copy p {
    color:
      rgba(255,250,245,.92) !important;
  }


  .hero-copy .eyebrow,
  .hero-copy .hero-eyebrow {
    color: #edc36a !important;
  }


  /*
    Decorative divider.
  */
  .hero-copy hr {
    border-color:
      rgba(233,193,111,.60) !important;
  }


  /*
    Booking CTA — obvious gold button.
  */
  body .hero .btn-dark {
    background:
      linear-gradient(
        135deg,
        #f0cc79 0%,
        #d89d3f 52%,
        #eabd62 100%
      ) !important;

    color: #211008 !important;

    border:
      1px solid
      #f3d58e !important;

    box-shadow:
      0 0 18px
      rgba(225,173,75,.40),
      0 10px 24px
      rgba(0,0,0,.22) !important;
  }


  /*
    Benefit pills remain visible over hero.
  */
  .hero-features {
    position: relative !important;

    z-index: 6 !important;

    margin-top: 20px !important;

    display: grid !important;

    grid-template-columns:
      1fr
      1fr !important;

    gap: 10px !important;
  }


  .hero-features > div {
    min-height: 58px !important;

    padding:
      9px
      10px !important;

    background:
      rgba(250,246,240,.92) !important;

    border:
      1px solid
      rgba(212,165,77,.45) !important;

    box-shadow:
      0 8px 18px
      rgba(0,0,0,.10) !important;

    backdrop-filter:
      blur(6px) !important;

    -webkit-backdrop-filter:
      blur(6px) !important;
  }


  .hero-features small {
    color: #4b382b !important;
  }

}



/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 560px) {

  .hero {
    min-height: 900px !important;

    background:
      linear-gradient(
        180deg,
        rgba(28,14,8,.01) 0%,
        rgba(28,14,8,.02) 31%,
        rgba(28,14,8,.14) 50%,
        rgba(28,14,8,.52) 72%,
        rgba(28,14,8,.86) 100%
      ),
      url('assets/images/hero-1.png')
      64% center / cover no-repeat !important;
  }


  .hero-grid {
    min-height: 900px !important;
  }


  .hero-copy {
    left: 14px !important;
    right: 14px !important;

    bottom: 25px !important;

    padding:
      21px
      17px
      18px !important;
  }


  .hero-copy h1 {
    font-size: 50px !important;

    line-height: .92 !important;
  }


  .hero-features {
    gap: 8px !important;
  }

}


/* =========================================================
   HOMEPAGE — HERO TO VISIT TRANSITION
   Keep spa image visible; no large brown overlay.
   ========================================================= */

/*
   Reduce the heavy shade at the bottom of the hero.
*/
.hero::after {
  height: 34px !important;

  background:
    linear-gradient(
      180deg,
      rgba(42,20,11,0) 0%,
      rgba(42,20,11,.08) 55%,
      rgba(42,20,11,.18) 100%
    ) !important;
}


/*
   Dedicated divider between hero and Visit section.
*/
.home-hero-divider {
  position: relative !important;

  z-index: 8 !important;

  width: 100% !important;
  height: 42px !important;

  margin: 0 !important;
  padding: 0 7% !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 14px !important;

  background:
    linear-gradient(
      180deg,
      #f7f1e9 0%,
      #f3eadf 100%
    ) !important;

  border-top:
    1px solid
    rgba(190,139,60,.16) !important;

  border-bottom:
    1px solid
    rgba(190,139,60,.24) !important;
}


.home-hero-divider-line {
  display: block !important;

  width: min(220px, 34vw) !important;
  height: 1px !important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(190,139,60,.78)
    ) !important;
}


.home-hero-divider-line:last-child {
  background:
    linear-gradient(
      90deg,
      rgba(190,139,60,.78),
      transparent
    ) !important;
}


.home-hero-divider-mark {
  width: 30px !important;
  height: 30px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  flex: 0 0 30px !important;

  color: #bf8b3c !important;

  border:
    1px solid
    rgba(190,139,60,.55) !important;

  border-radius: 50% !important;

  background:
    #faf6f0 !important;

  font-size: 12px !important;

  box-shadow:
    0 3px 10px
    rgba(85,48,24,.08) !important;
}


/*
   Visit area begins after the divider —
   no extra top brown padding needed.
*/
.home-contact-strip {
  margin-top: 0 !important;
}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 820px) {

  /*
    Remove the second large mobile shade that was
    covering too much of the treatment bed.
  */
  .hero::before {
    display: none !important;
    content: none !important;
  }


  .hero::after {
    height: 28px !important;

    background:
      linear-gradient(
        180deg,
        rgba(42,20,11,0),
        rgba(42,20,11,.14)
      ) !important;
  }


  .home-hero-divider {
    height: 38px !important;

    padding:
      0
      22px !important;

    gap: 11px !important;
  }


  .home-hero-divider-line {
    width: 100% !important;
  }


  .home-hero-divider-mark {
    width: 28px !important;
    height: 28px !important;

    flex-basis: 28px !important;
  }

}


/* =========================================================
   HOMEPAGE — HERO TO VISIT TRANSITION
   Keep spa image visible; no large brown overlay.
   ========================================================= */

/*
   Reduce the heavy shade at the bottom of the hero.
*/
.hero::after {
  height: 34px !important;

  background:
    linear-gradient(
      180deg,
      rgba(42,20,11,0) 0%,
      rgba(42,20,11,.08) 55%,
      rgba(42,20,11,.18) 100%
    ) !important;
}


/*
   Dedicated divider between hero and Visit section.
*/
.home-hero-divider {
  position: relative !important;

  z-index: 8 !important;

  width: 100% !important;
  height: 42px !important;

  margin: 0 !important;
  padding: 0 7% !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 14px !important;

  background:
    linear-gradient(
      180deg,
      #f7f1e9 0%,
      #f3eadf 100%
    ) !important;

  border-top:
    1px solid
    rgba(190,139,60,.16) !important;

  border-bottom:
    1px solid
    rgba(190,139,60,.24) !important;
}


.home-hero-divider-line {
  display: block !important;

  width: min(220px, 34vw) !important;
  height: 1px !important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(190,139,60,.78)
    ) !important;
}


.home-hero-divider-line:last-child {
  background:
    linear-gradient(
      90deg,
      rgba(190,139,60,.78),
      transparent
    ) !important;
}


.home-hero-divider-mark {
  width: 30px !important;
  height: 30px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  flex: 0 0 30px !important;

  color: #bf8b3c !important;

  border:
    1px solid
    rgba(190,139,60,.55) !important;

  border-radius: 50% !important;

  background:
    #faf6f0 !important;

  font-size: 12px !important;

  box-shadow:
    0 3px 10px
    rgba(85,48,24,.08) !important;
}


/*
   Visit area begins after the divider —
   no extra top brown padding needed.
*/
.home-contact-strip {
  margin-top: 0 !important;
}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 820px) {

  /*
    Remove the second large mobile shade that was
    covering too much of the treatment bed.
  */
  .hero::before {
    display: none !important;
    content: none !important;
  }


  .hero::after {
    height: 28px !important;

    background:
      linear-gradient(
        180deg,
        rgba(42,20,11,0),
        rgba(42,20,11,.14)
      ) !important;
  }


  .home-hero-divider {
    height: 38px !important;

    padding:
      0
      22px !important;

    gap: 11px !important;
  }


  .home-hero-divider-line {
    width: 100% !important;
  }


  .home-hero-divider-mark {
    width: 28px !important;
    height: 28px !important;

    flex-basis: 28px !important;
  }

}

/* =========================================================
   HOMEPAGE — LIGHT GLASS HERO PANEL
   Let the treatment bed remain visible
   ========================================================= */

@media (max-width: 820px) {

  /*
    Greatly reduce dark shading across the actual photo.
    The sales card provides enough contrast by itself.
  */
  .hero {
    background:
      linear-gradient(
        180deg,
        rgba(28,14,8,0) 0%,
        rgba(28,14,8,0) 38%,
        rgba(28,14,8,.03) 55%,
        rgba(28,14,8,.08) 72%,
        rgba(28,14,8,.14) 100%
      ),
      url('assets/images/hero-1.png')
      58% center / cover no-repeat !important;
  }


  /*
    Much lighter transparent glass panel.
    Bed and room remain clearly visible through it.
  */
  .hero-copy {
    background:
      linear-gradient(
        135deg,
        rgba(48,24,14,.38),
        rgba(29,14,8,.25)
      ) !important;

    border:
      1px solid
      rgba(231,190,105,.40) !important;

    box-shadow:
      0 14px 30px
      rgba(0,0,0,.15) !important;

    backdrop-filter:
      blur(2px) !important;

    -webkit-backdrop-filter:
      blur(2px) !important;
  }


  /*
    Maintain readability without making the card darker.
  */
  .hero-copy h1,
  .hero-copy p,
  .hero-copy .eyebrow,
  .hero-copy .hero-eyebrow {
    text-shadow:
      0 2px 7px
      rgba(28,12,6,.48) !important;
  }


  .hero-copy h1 {
    color: #fffdf9 !important;
  }


  .hero-copy p {
    color:
      rgba(255,255,255,.96) !important;
  }


  /*
    Do not darken the bottom of the spa image.
  */
  .hero::after {
    height: 24px !important;

    background:
      linear-gradient(
        180deg,
        transparent,
        rgba(46,23,13,.08)
      ) !important;
  }

}


@media (max-width: 560px) {

  .hero {
    background:
      linear-gradient(
        180deg,
        rgba(28,14,8,0) 0%,
        rgba(28,14,8,0) 42%,
        rgba(28,14,8,.03) 60%,
        rgba(28,14,8,.07) 78%,
        rgba(28,14,8,.12) 100%
      ),
      url('assets/images/hero-1.png')
      58% center / cover no-repeat !important;
  }


  .hero-copy {
    background:
      linear-gradient(
        135deg,
        rgba(48,24,14,.34),
        rgba(29,14,8,.22)
      ) !important;
  }

}

/* =========================================================
   HOMEPAGE — CENTER HERO PHOTO ON MOBILE
   ========================================================= */

@media (max-width: 820px) {

  .hero {
    background-position:
      center center,
      50% center !important;
  }

}

@media (max-width: 560px) {

  .hero {
    background-position:
      center center,
      50% center !important;
  }

}

/* =========================================================
   HOMEPAGE — CENTER HERO PHOTO ON MOBILE
   ========================================================= */

@media (max-width: 820px) {

  .hero {
    background-position:
      center center,
      50% center !important;
  }

}

@media (max-width: 560px) {

  .hero {
    background-position:
      center center,
      50% center !important;
  }

}

/* =========================================================
   HOMEPAGE — MOBILE HERO ROOM / MIRROR FOCUS
   Move crop toward right side of source image
   ========================================================= */

@media (max-width: 820px) {

  .hero {
    background-position:
      center center,
      72% center !important;
  }

}

@media (max-width: 560px) {

  .hero {
    background-position:
      center center,
      74% center !important;
  }

}

/* =========================================================
   HOMEPAGE — PROFESSIONAL CONTACT / SELF-CARE SECTION
   ========================================================= */

.home-contact-strip {
  position: relative !important;

  padding:
    30px
    0 !important;

  background:
    radial-gradient(
      circle at 50% 20%,
      rgba(111,57,28,.20),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      #2b1309 0%,
      #35170b 48%,
      #281107 100%
    ) !important;

  border-top:
    1px solid
    rgba(229,187,99,.22) !important;

  border-bottom:
    1px solid
    rgba(229,187,99,.18) !important;
}


.home-contact-strip-inner {
  width:
    min(94%, 1180px) !important;

  margin:
    0
    auto !important;

  padding:
    0 !important;

  display:
    grid !important;

  grid-template-columns:
    1fr
    1.18fr
    1fr !important;

  gap:
    18px !important;

  align-items:
    stretch !important;
}


/* ---------------------------------------------------------
   CARDS
   --------------------------------------------------------- */

.home-strip-card {
  position:
    relative !important;

  min-height:
    178px !important;

  padding:
    27px
    26px !important;

  display:
    flex !important;

  flex-direction:
    column !important;

  justify-content:
    center !important;

  overflow:
    hidden !important;

  background:
    linear-gradient(
      145deg,
      rgba(74,34,17,.72),
      rgba(45,20,10,.64)
    ) !important;

  border:
    1px solid
    rgba(224,179,91,.28) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,224,155,.04),
    0 12px 30px rgba(12,5,2,.18) !important;

  backdrop-filter:
    blur(4px) !important;

  -webkit-backdrop-filter:
    blur(4px) !important;
}


.home-strip-card::before {
  content:
    "" !important;

  position:
    absolute !important;

  left:
    28px !important;

  right:
    28px !important;

  top:
    0 !important;

  height:
    1px !important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(230,185,95,.76),
      transparent
    ) !important;
}


.home-strip-card::after {
  content:
    "" !important;

  position:
    absolute !important;

  width:
    100px !important;

  height:
    100px !important;

  right:
    -48px !important;

  bottom:
    -55px !important;

  border:
    1px solid
    rgba(226,182,93,.09) !important;

  border-radius:
    50% !important;

  pointer-events:
    none !important;
}


/* ---------------------------------------------------------
   CENTER CARD — FEATURED
   --------------------------------------------------------- */

.home-strip-card-center {
  background:
    linear-gradient(
      145deg,
      rgba(91,42,19,.82),
      rgba(48,20,9,.72)
    ) !important;

  border-color:
    rgba(229,186,97,.42) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,230,173,.05),
    0 0 26px rgba(185,121,38,.08),
    0 14px 32px rgba(12,5,2,.20) !important;
}


/* ---------------------------------------------------------
   KICKERS
   --------------------------------------------------------- */

.home-strip-kicker {
  position:
    relative !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  gap:
    8px !important;

  margin-bottom:
    9px !important;

  color:
    #e9b95c !important;

  font-size:
    9px !important;

  font-weight:
    700 !important;

  letter-spacing:
    .17em !important;

  text-transform:
    uppercase !important;
}


.home-strip-kicker::before {
  content:
    "" !important;

  width:
    4px !important;

  height:
    4px !important;

  flex:
    0 0 4px !important;

  border-radius:
    50% !important;

  background:
    #e8b75b !important;

  box-shadow:
    0 0 8px rgba(232,183,91,.48) !important;
}


/* ---------------------------------------------------------
   TITLES
   --------------------------------------------------------- */

.home-strip-title {
  margin:
    0
    0
    7px !important;

  color:
    #f6e7c7 !important;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif !important;

  font-size:
    29px !important;

  font-weight:
    500 !important;

  line-height:
    1.02 !important;
}


.home-strip-center-title {
  margin:
    0
    0
    8px !important;

  color:
    #e9b95e !important;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif !important;

  font-size:
    34px !important;

  font-weight:
    500 !important;

  line-height:
    1.05 !important;

  text-shadow:
    0 2px 12px rgba(0,0,0,.15) !important;
}


/* ---------------------------------------------------------
   ADDRESS / PHONE
   --------------------------------------------------------- */

.home-strip-main-link {
  display:
    inline-block !important;

  margin:
    0 !important;

  color:
    #fffdf8 !important;

  font-size:
    15px !important;

  font-weight:
    700 !important;

  line-height:
    1.4 !important;

  text-decoration:
    none !important;

  transition:
    color .2s ease !important;
}


.home-strip-main-link:hover {
  color:
    #efc66e !important;
}


.home-strip-subtext,
.home-strip-center-text {
  margin:
    5px
    0
    0 !important;

  color:
    rgba(255,255,255,.68) !important;

  font-size:
    12px !important;

  line-height:
    1.55 !important;
}


/* ---------------------------------------------------------
   CONTACT US ACTION
   --------------------------------------------------------- */

.home-strip-action-link {
  width:
    fit-content !important;

  min-height:
    34px !important;

  margin:
    13px
    0
    0
    auto !important;

  padding:
    0
    14px !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  color:
    #efc66e !important;

  border:
    1px solid
    rgba(232,185,92,.55) !important;

  background:
    rgba(255,255,255,.025) !important;

  text-decoration:
    none !important;

  font-size:
    9px !important;

  font-weight:
    700 !important;

  letter-spacing:
    .10em !important;

  text-transform:
    uppercase !important;

  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease !important;
}


.home-strip-action-link:hover {
  color:
    #251108 !important;

  background:
    linear-gradient(
      135deg,
      #efcb79,
      #d89c3d
    ) !important;

  transform:
    translateY(-1px) !important;
}


/* ---------------------------------------------------------
   ALIGNMENT
   --------------------------------------------------------- */

.home-strip-card-left {
  text-align:
    left !important;
}


.home-strip-card-center {
  text-align:
    center !important;
}


.home-strip-card-right {
  text-align:
    right !important;
}


.home-strip-card-right .home-strip-kicker {
  justify-content:
    flex-end !important;
}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 820px) {

  .home-contact-strip {
    padding:
      22px
      16px
      26px !important;
  }


  .home-contact-strip-inner {
    width:
      100% !important;

    grid-template-columns:
      1fr !important;

    gap:
      13px !important;
  }


  .home-strip-card {
    min-height:
      138px !important;

    padding:
      21px
      20px !important;

    text-align:
      center !important;
  }


  .home-strip-card-left,
  .home-strip-card-center,
  .home-strip-card-right {
    text-align:
      center !important;
  }


  .home-strip-card-right .home-strip-kicker,
  .home-strip-kicker {
    justify-content:
      center !important;
  }


  .home-strip-title {
    font-size:
      26px !important;
  }


  .home-strip-center-title {
    font-size:
      30px !important;
  }


  .home-strip-main-link {
    font-size:
      14px !important;
  }


  .home-strip-action-link {
    margin:
      12px
      auto
      0 !important;
  }

}


@media (max-width: 520px) {

  .home-contact-strip {
    padding:
      18px
      14px
      22px !important;
  }


  .home-strip-card {
    min-height:
      128px !important;

    padding:
      19px
      16px !important;
  }


  .home-strip-title {
    font-size:
      24px !important;
  }


  .home-strip-center-title {
    font-size:
      27px !important;
  }


  .home-strip-main-link {
    font-size:
      13px !important;
  }

}

/* =========================================================
   HOMEPAGE — DARKER / CLEARER MOBILE MENU
   ========================================================= */

@media (max-width: 820px) {

  .site-header {
    background:
      rgba(24, 11, 6, .985) !important;

    box-shadow:
      0 9px 28px
      rgba(0,0,0,.32) !important;

    backdrop-filter:
      blur(12px) !important;

    -webkit-backdrop-filter:
      blur(12px) !important;
  }


  [data-nav].open,
  .site-nav.open,
  .nav.open {
    background:
      linear-gradient(
        180deg,
        rgba(20,9,5,.99) 0%,
        rgba(35,16,8,.99) 100%
      ) !important;

    box-shadow:
      0 22px 42px
      rgba(0,0,0,.42) !important;

    backdrop-filter:
      blur(14px) !important;

    -webkit-backdrop-filter:
      blur(14px) !important;

    border-top:
      1px solid
      rgba(226,183,96,.26) !important;

    border-bottom:
      1px solid
      rgba(226,183,96,.18) !important;
  }


  [data-nav].open a,
  .site-nav.open a,
  .nav.open a {
    color:
      rgba(255,255,255,.96) !important;
  }


  [data-nav].open a:hover,
  .site-nav.open a:hover,
  .nav.open a:hover {
    color:
      #efc66f !important;
  }

}

/* =========================================================
   HOMEPAGE — FULL HEIGHT MOBILE MENU PANEL
   Prevent page imagery from showing behind menu links
   ========================================================= */

@media (max-width: 820px) {

  [data-nav].open,
  .site-nav.open,
  .nav.open {
    position: fixed !important;

    top: 82px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    width: 100% !important;
    height: calc(100dvh - 82px) !important;

    padding:
      24px
      28px
      36px !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: stretch !important;
    justify-content: flex-start !important;

    overflow-y: auto !important;

    z-index: 99997 !important;

    background:
      linear-gradient(
        180deg,
        #1b0b05 0%,
        #241007 48%,
        #160904 100%
      ) !important;

    box-shadow:
      0 24px 48px
      rgba(0,0,0,.48) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }


  [data-nav].open a,
  .site-nav.open a,
  .nav.open a {
    width: 100% !important;

    padding:
      16px
      2px !important;

    color:
      #fffaf3 !important;

    border-bottom:
      1px solid
      rgba(232,185,92,.18) !important;

    text-shadow:
      0 2px 8px
      rgba(0,0,0,.28) !important;
  }


  [data-nav].open a:last-child,
  .site-nav.open a:last-child,
  .nav.open a:last-child {
    border-bottom:
      none !important;
  }

}

/* =========================================================
   HOMEPAGE — PROFESSIONAL FLOATING MOBILE MENU
   ========================================================= */

@media (max-width: 820px) {

  [data-nav].open,
  .site-nav.open,
  .nav.open {

    position: fixed !important;

    top: 92px !important;
    left: 14px !important;
    right: 14px !important;
    bottom: auto !important;

    width: auto !important;
    height: auto !important;

    max-height:
      calc(100dvh - 112px) !important;

    padding:
      12px
      18px
      16px !important;

    display:
      flex !important;

    flex-direction:
      column !important;

    overflow-y:
      auto !important;

    z-index:
      99997 !important;

    background:
      linear-gradient(
        145deg,
        rgba(31,13,6,.985),
        rgba(49,21,9,.975)
      ) !important;

    border:
      1px solid
      rgba(225,178,88,.34) !important;

    border-radius:
      18px !important;

    box-shadow:
      0 22px 55px
      rgba(0,0,0,.42),
      inset 0 1px 0
      rgba(255,231,178,.06) !important;

    backdrop-filter:
      blur(14px) !important;

    -webkit-backdrop-filter:
      blur(14px) !important;
  }


  [data-nav].open::before,
  .site-nav.open::before,
  .nav.open::before {

    content:
      "" !important;

    position:
      absolute !important;

    top:
      0 !important;

    left:
      34px !important;

    right:
      34px !important;

    height:
      1px !important;

    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(235,191,103,.80),
        transparent
      ) !important;
  }


  [data-nav].open a,
  .site-nav.open a,
  .nav.open a {

    width:
      100% !important;

    padding:
      13px
      5px !important;

    color:
      #fff9ef !important;

    font-size:
      21px !important;

    line-height:
      1.1 !important;

    letter-spacing:
      .025em !important;

    border-bottom:
      1px solid
      rgba(223,177,88,.14) !important;

    text-shadow:
      none !important;
  }


  [data-nav].open a:last-child,
  .site-nav.open a:last-child,
  .nav.open a:last-child {

    border-bottom:
      none !important;
  }


  [data-nav].open a:hover,
  .site-nav.open a:hover,
  .nav.open a:hover {

    color:
      #efc66f !important;

    padding-left:
      10px !important;

    background:
      rgba(255,255,255,.025) !important;
  }

}



/* Slightly tighter phones */

@media (max-width: 520px) {

  [data-nav].open,
  .site-nav.open,
  .nav.open {

    top:
      90px !important;

    left:
      12px !important;

    right:
      12px !important;

    padding:
      11px
      16px
      14px !important;

    border-radius:
      16px !important;
  }


  [data-nav].open a,
  .site-nav.open a,
  .nav.open a {

    padding:
      12px
      4px !important;

    font-size:
      19px !important;
  }

}

/* =========================================================
   MOBILE MENU — HIDE REVIEWS + GALLERY
   Sections remain available on the homepage.
   ========================================================= */

@media (max-width: 820px) {

  [data-nav] a[href="#reviews"],
  [data-nav] a[href="#gallery"],
  .site-nav a[href="#reviews"],
  .site-nav a[href="#gallery"],
  .nav a[href="#reviews"],
  .nav a[href="#gallery"] {
    display: none !important;
  }

}

/* =========================================================
   HOMEPAGE — CENTER "CARE DESIGNED AROUND YOU" SECTION
   ========================================================= */

#reviews .section-heading,
.reviews .section-heading {
  width: min(760px, calc(100% - 40px)) !important;

  margin:
    0 auto
    38px !important;

  text-align:
    center !important;
}


#reviews .section-heading .eyebrow,
.reviews .section-heading .eyebrow {
  display:
    block !important;

  text-align:
    center !important;
}


#reviews .section-heading h2,
.reviews .section-heading h2 {
  margin:
    0 auto
    14px !important;

  text-align:
    center !important;

  max-width:
    680px !important;
}


#reviews .section-heading p,
.reviews .section-heading p {
  max-width:
    620px !important;

  margin:
    0 auto !important;

  text-align:
    center !important;
}


/* Keep the card group centered below the heading */
#reviews .reviews-grid,
.reviews .reviews-grid {
  width:
    min(760px, calc(100% - 40px)) !important;

  margin:
    0 auto !important;
}


/* MOBILE */
@media (max-width: 820px) {

  #reviews .section-heading,
  .reviews .section-heading {
    width:
      calc(100% - 32px) !important;

    margin-bottom:
      28px !important;
  }


  #reviews .section-heading h2,
  .reviews .section-heading h2 {
    max-width:
      100% !important;
  }


  #reviews .reviews-grid,
  .reviews .reviews-grid {
    width:
      calc(100% - 32px) !important;
  }

}

/* =========================================================
   HOMEPAGE — CORRECTIVE PROGRAMS PROMO FEATURE
   ========================================================= */

.corrective-feature {
  padding-top: 88px;
  padding-bottom: 88px;
}

.corrective-feature-shell {
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  min-height: 540px;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid rgba(192, 150, 88, .18);
  background:
    linear-gradient(
      90deg,
      rgba(22, 10, 6, .82) 0%,
      rgba(39, 19, 11, .58) 34%,
      rgba(39, 19, 11, .18) 62%,
      rgba(39, 19, 11, .08) 100%
    ),
    url("assets/images/about-lv.jpg");
  background-size: cover;
  background-position: center center;
  box-shadow:
    0 24px 55px rgba(32, 15, 8, .12);
}

.corrective-feature-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.03) 0%,
      rgba(0,0,0,.06) 100%
    );
  pointer-events: none;
}

.corrective-feature-content {
  position: relative;
  z-index: 2;
  width: min(100%, 560px);
  padding: 68px 56px 56px;
  color: #fffaf3;
}

.corrective-feature .eyebrow {
  margin-bottom: 18px;
  color: #dfb15a;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.corrective-feature h2 {
  margin: 0 0 20px;
  color: #fffaf3;
  font-size: clamp(42px, 5vw, 66px);
  line-height: .96;
  letter-spacing: -.03em;
}

.corrective-feature-copy {
  max-width: 500px;
  margin: 0 0 28px;
  color: rgba(255, 248, 239, .92);
  font-size: 18px;
  line-height: 1.72;
}

.corrective-feature-actions {
  margin-bottom: 34px;
}

.corrective-feature-benefits {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
  max-width: 560px;
}

.corrective-feature-benefits > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 56px;
  padding: 14px 16px;
  border: 1px solid rgba(233, 188, 100, .22);
  border-radius: 999px;
  background: rgba(255, 248, 239, .08);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.corrective-feature-benefits span {
  display: inline-flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
  flex: 0 0 26px;
  border-radius: 50%;
  border: 1px solid rgba(233, 188, 100, .55);
  color: #efc66f;
  font-size: 13px;
  font-weight: 700;
}

.corrective-feature-benefits p {
  margin: 0;
  color: #fffaf3;
  font-size: 14px;
  line-height: 1.35;
}

@media (max-width: 980px) {
  .corrective-feature-shell {
    min-height: 520px;
    background-position: 62% center;
  }

  .corrective-feature-content {
    width: min(100%, 100%);
    padding: 56px 32px 40px;
  }

  .corrective-feature-copy {
    font-size: 16px;
  }
}

@media (max-width: 680px) {
  .corrective-feature {
    padding-top: 56px;
    padding-bottom: 56px;
  }

  .corrective-feature-shell {
    min-height: auto;
    border-radius: 18px;
    background:
      linear-gradient(
        180deg,
        rgba(22, 10, 6, .52) 0%,
        rgba(22, 10, 6, .68) 28%,
        rgba(22, 10, 6, .82) 58%,
        rgba(22, 10, 6, .92) 100%
      ),
      url("assets/images/about-lv.jpg");
    background-size: cover;
    background-position: center center;
  }

  .corrective-feature-content {
    padding: 34px 22px 24px;
  }

  .corrective-feature h2 {
    font-size: 42px;
    line-height: 1;
  }

  .corrective-feature-copy {
    font-size: 15px;
    line-height: 1.68;
  }

  .corrective-feature-benefits {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .corrective-feature-benefits > div {
    min-height: 52px;
    border-radius: 16px;
  }
}

/* =========================================================
   LV CORRECTIVE PROGRAMS — FINAL ADVERTISING FEATURE
   ========================================================= */

.corrective-feature {
  padding:
    76px 24px !important;

  background:
    #f7f0e6 !important;
}


.corrective-feature-shell {
  position:
    relative !important;

  width:
    min(1180px, 100%) !important;

  min-height:
    560px !important;

  margin:
    0 auto !important;

  overflow:
    hidden !important;

  display:
    flex !important;

  align-items:
    center !important;

  border-radius:
    26px !important;

  background-image:
    linear-gradient(
      90deg,
      rgba(28,12,6,.91) 0%,
      rgba(39,17,8,.76) 34%,
      rgba(39,17,8,.42) 55%,
      rgba(39,17,8,.09) 78%
    ),
    var(--corrective-feature-bg) !important;

  background-size:
    cover !important;

  background-position:
    center center !important;

  box-shadow:
    0 28px 70px
    rgba(47,25,14,.16) !important;
}


.corrective-feature-shade {
  position:
    absolute !important;

  inset:
    0 !important;

  pointer-events:
    none !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.02),
      rgba(0,0,0,.12)
    ) !important;
}


.corrective-feature-content {
  position:
    relative !important;

  z-index:
    2 !important;

  width:
    min(590px, 58%) !important;

  padding:
    62px !important;

  color:
    #fff9f0 !important;
}


.corrective-feature .eyebrow {
  margin:
    0 0 16px !important;

  color:
    #e9b85d !important;

  font-size:
    11px !important;

  font-weight:
    700 !important;

  letter-spacing:
    .20em !important;

  text-transform:
    uppercase !important;
}


.corrective-feature h2 {
  margin:
    0 0 22px !important;

  max-width:
    540px !important;

  color:
    #fffaf3 !important;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif !important;

  font-size:
    clamp(54px, 5.5vw, 78px) !important;

  font-weight:
    500 !important;

  line-height:
    .88 !important;

  letter-spacing:
    -.035em !important;

  text-shadow:
    0 4px 24px
    rgba(0,0,0,.22) !important;
}


.corrective-feature-lead {
  max-width:
    520px !important;

  margin:
    0 0 28px !important;

  color:
    rgba(255,249,241,.90) !important;

  font-size:
    16px !important;

  line-height:
    1.72 !important;
}


.corrective-feature-button {
  min-height:
    48px !important;

  padding:
    0 24px !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  margin-bottom:
    34px !important;

  border:
    1px solid
    rgba(249,207,120,.70) !important;

  background:
    linear-gradient(
      135deg,
      #efca78,
      #ce9440
    ) !important;

  color:
    #281108 !important;

  font-size:
    10px !important;

  font-weight:
    800 !important;

  letter-spacing:
    .10em !important;

  text-transform:
    uppercase !important;

  box-shadow:
    0 10px 24px
    rgba(0,0,0,.18) !important;
}


.corrective-feature-button:hover {
  transform:
    translateY(-2px) !important;
}


.corrective-feature-programs {
  max-width:
    560px !important;

  display:
    grid !important;

  grid-template-columns:
    repeat(2, minmax(0,1fr)) !important;

  gap:
    11px !important;
}


.corrective-feature-programs > div {
  min-height:
    54px !important;

  padding:
    10px 14px !important;

  display:
    flex !important;

  align-items:
    center !important;

  gap:
    10px !important;

  border:
    1px solid
    rgba(235,190,100,.30) !important;

  border-radius:
    999px !important;

  background:
    rgba(31,13,6,.40) !important;

  backdrop-filter:
    blur(7px) !important;

  -webkit-backdrop-filter:
    blur(7px) !important;
}


.corrective-feature-programs span {
  width:
    30px !important;

  height:
    30px !important;

  flex:
    0 0 30px !important;

  display:
    grid !important;

  place-items:
    center !important;

  border:
    1px solid
    rgba(239,198,111,.58) !important;

  border-radius:
    50% !important;

  color:
    #efc66f !important;

  font-size:
    9px !important;

  font-weight:
    700 !important;
}


.corrective-feature-programs p {
  margin:
    0 !important;

  color:
    #fff9f1 !important;

  font-size:
    12px !important;

  line-height:
    1.25 !important;
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

  .corrective-feature-shell {
    min-height:
      540px !important;

    background-position:
      60% center !important;
  }


  .corrective-feature-content {
    width:
      68% !important;

    padding:
      46px 38px !important;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 680px) {

  .corrective-feature {
    padding:
      48px 14px !important;
  }


  .corrective-feature-shell {
    min-height:
      650px !important;

    align-items:
      flex-end !important;

    border-radius:
      20px !important;

    background-image:
      linear-gradient(
        180deg,
        rgba(26,11,5,.03) 0%,
        rgba(26,11,5,.14) 30%,
        rgba(26,11,5,.70) 62%,
        rgba(26,11,5,.96) 100%
      ),
      var(--corrective-feature-bg) !important;

    background-position:
      center center !important;
  }


  .corrective-feature-content {
    width:
      100% !important;

    padding:
      34px 22px 26px !important;
  }


  .corrective-feature h2 {
    font-size:
      46px !important;

    line-height:
      .92 !important;
  }


  .corrective-feature-lead {
    font-size:
      14px !important;

    line-height:
      1.62 !important;
  }


  .corrective-feature-programs {
    grid-template-columns:
      1fr 1fr !important;
  }


  .corrective-feature-programs > div {
    border-radius:
      14px !important;
  }

}


@media (max-width: 440px) {

  .corrective-feature-programs {
    grid-template-columns:
      1fr !important;
  }

}

/* =========================================================
   LV CORRECTIVE PROGRAMS — FINAL HOMEPAGE PROMO
   ========================================================= */

.corrective-feature {
  padding:
    78px 24px !important;

  background:
    #f7f0e7 !important;
}


.corrective-feature-shell {
  position:
    relative !important;

  width:
    min(1180px, 100%) !important;

  min-height:
    570px !important;

  margin:
    0 auto !important;

  overflow:
    hidden !important;

  display:
    flex !important;

  align-items:
    center !important;

  border-radius:
    26px !important;

  box-shadow:
    0 30px 70px
    rgba(48,24,12,.16) !important;
}


/* Actual existing LV image */
.corrective-feature-background {
  position:
    absolute !important;

  inset:
    0 !important;

  background-image:
    url("assets/images/meet-care.png") !important;

  background-size:
    cover !important;

  background-position:
    center center !important;

  transform:
    scale(1.015) !important;
}


/* Sales overlay */
.corrective-feature-shade {
  position:
    absolute !important;

  inset:
    0 !important;

  background:
    linear-gradient(
      90deg,
      rgba(27,12,6,.94) 0%,
      rgba(35,15,7,.82) 34%,
      rgba(35,15,7,.52) 56%,
      rgba(35,15,7,.14) 78%,
      rgba(35,15,7,.04) 100%
    ) !important;
}


/* Text area */
.corrective-feature-content {
  position:
    relative !important;

  z-index:
    2 !important;

  width:
    min(590px, 58%) !important;

  padding:
    62px !important;

  color:
    #fffaf3 !important;
}


.corrective-feature .eyebrow {
  margin:
    0 0 16px !important;

  color:
    #e8b55a !important;

  font-size:
    11px !important;

  font-weight:
    700 !important;

  letter-spacing:
    .20em !important;

  text-transform:
    uppercase !important;
}


.corrective-feature h2 {
  margin:
    0 0 22px !important;

  color:
    #fffaf3 !important;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif !important;

  font-size:
    clamp(54px, 5.5vw, 78px) !important;

  font-weight:
    500 !important;

  line-height:
    .88 !important;

  letter-spacing:
    -.035em !important;

  text-shadow:
    0 4px 24px
    rgba(0,0,0,.24) !important;
}


.corrective-feature-lead {
  max-width:
    510px !important;

  margin:
    0 0 28px !important;

  color:
    rgba(255,249,241,.91) !important;

  font-size:
    16px !important;

  line-height:
    1.72 !important;
}


/* Gold CTA */
.corrective-feature-button {
  min-height:
    50px !important;

  margin-bottom:
    34px !important;

  padding:
    0 25px !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  background:
    linear-gradient(
      135deg,
      #f0cb78,
      #cf9741
    ) !important;

  border:
    1px solid
    rgba(249,210,128,.70) !important;

  color:
    #271108 !important;

  font-size:
    10px !important;

  font-weight:
    800 !important;

  letter-spacing:
    .10em !important;

  text-transform:
    uppercase !important;

  box-shadow:
    0 12px 26px
    rgba(0,0,0,.18) !important;
}


.corrective-feature-button:hover {
  transform:
    translateY(-2px) !important;
}


/* Program teaser pills */
.corrective-feature-programs {
  width:
    100% !important;

  max-width:
    550px !important;

  display:
    grid !important;

  grid-template-columns:
    repeat(2, minmax(0,1fr)) !important;

  gap:
    11px !important;
}


.corrective-feature-programs > div {
  min-height:
    56px !important;

  padding:
    10px 14px !important;

  display:
    flex !important;

  align-items:
    center !important;

  gap:
    10px !important;

  border:
    1px solid
    rgba(234,187,94,.30) !important;

  border-radius:
    999px !important;

  background:
    rgba(29,12,6,.43) !important;

  backdrop-filter:
    blur(8px) !important;

  -webkit-backdrop-filter:
    blur(8px) !important;
}


.corrective-feature-programs span {
  width:
    30px !important;

  height:
    30px !important;

  flex:
    0 0 30px !important;

  display:
    grid !important;

  place-items:
    center !important;

  border:
    1px solid
    rgba(239,198,111,.62) !important;

  border-radius:
    50% !important;

  color:
    #efc66f !important;

  font-size:
    9px !important;

  font-weight:
    700 !important;
}


.corrective-feature-programs p {
  margin:
    0 !important;

  color:
    #fff9f1 !important;

  font-size:
    12px !important;

  line-height:
    1.25 !important;
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

  .corrective-feature-shell {
    min-height:
      540px !important;
  }


  .corrective-feature-background {
    background-position:
      58% center !important;
  }


  .corrective-feature-content {
    width:
      68% !important;

    padding:
      44px 36px !important;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 680px) {

  .corrective-feature {
    padding:
      48px 14px !important;
  }


  .corrective-feature-shell {
    min-height:
      680px !important;

    align-items:
      flex-end !important;

    border-radius:
      20px !important;
  }


  .corrective-feature-background {
    background-position:
      52% center !important;
  }


  .corrective-feature-shade {
    background:
      linear-gradient(
        180deg,
        rgba(27,12,6,.03) 0%,
        rgba(27,12,6,.10) 28%,
        rgba(27,12,6,.64) 58%,
        rgba(27,12,6,.96) 100%
      ) !important;
  }


  .corrective-feature-content {
    width:
      100% !important;

    padding:
      34px 22px 26px !important;
  }


  .corrective-feature h2 {
    font-size:
      46px !important;

    line-height:
      .92 !important;
  }


  .corrective-feature-lead {
    font-size:
      14px !important;

    line-height:
      1.62 !important;
  }


  .corrective-feature-programs {
    grid-template-columns:
      1fr 1fr !important;
  }


  .corrective-feature-programs > div {
    border-radius:
      14px !important;
  }

}


@media (max-width: 440px) {

  .corrective-feature-programs {
    grid-template-columns:
      1fr !important;
  }

}

/* =========================================================
   LV CORRECTIVE PROGRAMS — FINAL HOMEPAGE PROMO
   ========================================================= */

.corrective-feature {
  padding:
    78px 24px !important;

  background:
    #f7f0e7 !important;
}


.corrective-feature-shell {
  position:
    relative !important;

  width:
    min(1180px, 100%) !important;

  min-height:
    570px !important;

  margin:
    0 auto !important;

  overflow:
    hidden !important;

  display:
    flex !important;

  align-items:
    center !important;

  border-radius:
    26px !important;

  box-shadow:
    0 30px 70px
    rgba(48,24,12,.16) !important;
}


/* Actual existing LV image */
.corrective-feature-background {
  position:
    absolute !important;

  inset:
    0 !important;

  background-image:
    url("assets/images/meet-care.png") !important;

  background-size:
    cover !important;

  background-position:
    center center !important;

  transform:
    scale(1.015) !important;
}


/* Sales overlay */
.corrective-feature-shade {
  position:
    absolute !important;

  inset:
    0 !important;

  background:
    linear-gradient(
      90deg,
      rgba(27,12,6,.94) 0%,
      rgba(35,15,7,.82) 34%,
      rgba(35,15,7,.52) 56%,
      rgba(35,15,7,.14) 78%,
      rgba(35,15,7,.04) 100%
    ) !important;
}


/* Text area */
.corrective-feature-content {
  position:
    relative !important;

  z-index:
    2 !important;

  width:
    min(590px, 58%) !important;

  padding:
    62px !important;

  color:
    #fffaf3 !important;
}


.corrective-feature .eyebrow {
  margin:
    0 0 16px !important;

  color:
    #e8b55a !important;

  font-size:
    11px !important;

  font-weight:
    700 !important;

  letter-spacing:
    .20em !important;

  text-transform:
    uppercase !important;
}


.corrective-feature h2 {
  margin:
    0 0 22px !important;

  color:
    #fffaf3 !important;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif !important;

  font-size:
    clamp(54px, 5.5vw, 78px) !important;

  font-weight:
    500 !important;

  line-height:
    .88 !important;

  letter-spacing:
    -.035em !important;

  text-shadow:
    0 4px 24px
    rgba(0,0,0,.24) !important;
}


.corrective-feature-lead {
  max-width:
    510px !important;

  margin:
    0 0 28px !important;

  color:
    rgba(255,249,241,.91) !important;

  font-size:
    16px !important;

  line-height:
    1.72 !important;
}


/* Gold CTA */
.corrective-feature-button {
  min-height:
    50px !important;

  margin-bottom:
    34px !important;

  padding:
    0 25px !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  background:
    linear-gradient(
      135deg,
      #f0cb78,
      #cf9741
    ) !important;

  border:
    1px solid
    rgba(249,210,128,.70) !important;

  color:
    #271108 !important;

  font-size:
    10px !important;

  font-weight:
    800 !important;

  letter-spacing:
    .10em !important;

  text-transform:
    uppercase !important;

  box-shadow:
    0 12px 26px
    rgba(0,0,0,.18) !important;
}


.corrective-feature-button:hover {
  transform:
    translateY(-2px) !important;
}


/* Program teaser pills */
.corrective-feature-programs {
  width:
    100% !important;

  max-width:
    550px !important;

  display:
    grid !important;

  grid-template-columns:
    repeat(2, minmax(0,1fr)) !important;

  gap:
    11px !important;
}


.corrective-feature-programs > div {
  min-height:
    56px !important;

  padding:
    10px 14px !important;

  display:
    flex !important;

  align-items:
    center !important;

  gap:
    10px !important;

  border:
    1px solid
    rgba(234,187,94,.30) !important;

  border-radius:
    999px !important;

  background:
    rgba(29,12,6,.43) !important;

  backdrop-filter:
    blur(8px) !important;

  -webkit-backdrop-filter:
    blur(8px) !important;
}


.corrective-feature-programs span {
  width:
    30px !important;

  height:
    30px !important;

  flex:
    0 0 30px !important;

  display:
    grid !important;

  place-items:
    center !important;

  border:
    1px solid
    rgba(239,198,111,.62) !important;

  border-radius:
    50% !important;

  color:
    #efc66f !important;

  font-size:
    9px !important;

  font-weight:
    700 !important;
}


.corrective-feature-programs p {
  margin:
    0 !important;

  color:
    #fff9f1 !important;

  font-size:
    12px !important;

  line-height:
    1.25 !important;
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

  .corrective-feature-shell {
    min-height:
      540px !important;
  }


  .corrective-feature-background {
    background-position:
      58% center !important;
  }


  .corrective-feature-content {
    width:
      68% !important;

    padding:
      44px 36px !important;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 680px) {

  .corrective-feature {
    padding:
      48px 14px !important;
  }


  .corrective-feature-shell {
    min-height:
      680px !important;

    align-items:
      flex-end !important;

    border-radius:
      20px !important;
  }


  .corrective-feature-background {
    background-position:
      52% center !important;
  }


  .corrective-feature-shade {
    background:
      linear-gradient(
        180deg,
        rgba(27,12,6,.03) 0%,
        rgba(27,12,6,.10) 28%,
        rgba(27,12,6,.64) 58%,
        rgba(27,12,6,.96) 100%
      ) !important;
  }


  .corrective-feature-content {
    width:
      100% !important;

    padding:
      34px 22px 26px !important;
  }


  .corrective-feature h2 {
    font-size:
      46px !important;

    line-height:
      .92 !important;
  }


  .corrective-feature-lead {
    font-size:
      14px !important;

    line-height:
      1.62 !important;
  }


  .corrective-feature-programs {
    grid-template-columns:
      1fr 1fr !important;
  }


  .corrective-feature-programs > div {
    border-radius:
      14px !important;
  }

}


@media (max-width: 440px) {

  .corrective-feature-programs {
    grid-template-columns:
      1fr !important;
  }

}
