/*****************************************************************************
 * Feature highlights
 ***************************************************************************** */

.m-feature-highlights__wrapper { background: #ffffff; background-position: center; background-size: cover; margin-bottom: 5.1rem; padding: 2.5rem 0; }
    
.m-feature-highlights__visual img { margin-bottom: -5.4rem; margin-top: -.7rem; }

.m-feature-highlights__list ul { list-style: none; margin: 0; padding: 0; }
.m-feature-highlights__list a { border-bottom: 1px solid rgba(0, 0, 0, .22); display: block; padding: 1.5rem 2rem 1.5rem 1.2rem; position: relative; z-index: 1; }
.m-feature-highlights__list a::before { background: none; content: ''; height: 100%; left: 0; position: absolute; top: 0; transition: background .1s linear; width: 100%; z-index: -1; }
.m-feature-highlights__list a::after { align-items: center; background: #fff; border-radius: 50%; color: #000000; content: '\e818'; display: flex; font-size: 1.2rem; font-family: hziconen; font-weight: 700; height: 32px; justify-content: center; position: absolute; right: .8rem; top: 1.5rem; transition: background .1s linear, color .1s linear; width: 32px; }
.m-feature-highlights__list a:hover { border-bottom-color: transparent; }
.m-feature-highlights__list a:hover::before,
.m-feature-highlights__list a.active::before
  { background: #fff; }
.m-feature-highlights__list a:hover::after,
.m-feature-highlights__list a.active::after
  { background: #153D6A; color: #fff; }
.m-feature-highlights__list h3 { margin-bottom: 0; max-width: 243px; }
.m-feature-highlights__list p { color: rgba(0,0,0,.56);  max-width: 243px; }

@media only screen and (min-width: 576px){
  .m-feature-highlights__visual img { margin-bottom: -8rem; }
  
  .m-feature-highlights__list h3 { margin-bottom: 0; max-width: 70%; }
  .m-feature-highlights__list p { color: rgba(0,0,0,.56);  max-width: 70%; }
}

@media only screen and (min-width: 992px){
  .m-feature-highlights__wrapper { margin-bottom: 0; padding-bottom: 4rem; }
  
  .m-feature-highlights__visual img { margin-bottom: 0; margin-top: -18%; }
  
  .m-feature-highlights__list { order: 1; }
  .m-feature-highlights__list a { padding-bottom: 2rem; }
  .m-feature-highlights__list a::before { left: -24px; width: calc(100% + 48px);  }
  .m-feature-highlights__list a::after { right: 0; }
}

@media only screen and (min-width: 1440px){
  .m-feature-highlights__visual img { margin-left: -132px; width: calc(100% + 132px); }