.features {
     display: flex;
}
 .features__img-large {
     position: absolute;
     inset: 0;
     opacity: 0;
     transition: opacity .4s ease;
}
 .features-img-is-active {
     opacity: 1;
     z-index: 1;
}
 .object-fit--tall {
     height: 100%;
}
 .object-fit {
     left: 0;
     -o-object-fit: cover;
     object-fit: cover;
     -o-object-position: 50% 50%;
     object-position: 50% 50%;
     padding: 0;
     position: absolute;
     top: 0;
     width: 100%;
}
 .features__list {
     position: relative;
     display: flex;
     justify-content: space-between;
     z-index: 2;
     width: 100%;
     flex-wrap: wrap;
}

 .features__link {
     height: 100%;
     position: relative;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     overflow: hidden;
      padding: 40px;
     -webkit-transition: background .5s cubic-bezier(.4,0,0,1),background .5s cubic-bezier(.4,0,0,1);
     transition: background .5s cubic-bezier(.4,0,0,1),background .5s cubic-bezier(.4,0,0,1);
     z-index: 2;
}
 .features__link:before {
    background-color: rgba(0, 0, 0, .8);
    content: "";
    display: block;
    inset: 0;
    position: absolute;
}
 .features__heading {
     display: block;
     font-size: 28px;
     font-weight: 700;
     color: #fff;
    letter-spacing: .2px;
     margin: 0 0 2.2222222222rem;
     transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
}
 .features__link:focus .features__heading, .features__link:hover .features__heading {
     opacity: 0;
}
 .features__hidden {
     display: block;
     margin-left: 0;
     text-align: left;
}
 .features__hidden p {
     font-size: 20px;
     font-weight: 600;
     letter-spacing: .02em;
     line-height: 30px;
     margin-bottom: 20px;
     text-align: left;
     color: #fff;
}
 .highlight {
     -webkit-text-decoration-skip: ink;
     text-decoration-skip: ink;
     text-decoration-color: #234982;
     text-decoration-line: underline;
     text-decoration-style: solid;
}
 .service-button {
     color: #fff;
     outline: 0;
     font-weight: bold;
     text-decoration: none;
     padding: 8px 25px;
     font-size: 15px;
     border: none;
     border-radius: 8px;
     transition: 0.3s;
     background-color: #678FD5;
     display: inline-block;
}
.features__list li {
    width: 100%;
}
.features__img {
  height: 100%;
  width: 100%;
}
@media (min-width: 48em) {
    .features__list li:not(:last-child) {
        width: 50%;
    }
    .features__link:before {
    background-color: rgba(0, 0, 0, .8);
    content: "";
    display: block;
    inset: 0;
    position: absolute;
}
}
@media (max-width: 74.99em) {
    .features__overview {
        margin-right: auto;
    }
    .features__hidden p {
        display: none;
    }
    .features__link {
      align-items: flex-start;
     padding: 40px 15px;
    }
    .features__list li {
      width: 100%;
    }
    .features__heading {
      font-size: 24px;
      margin-bottom: 20px;
    }
    .features__link:focus .features__heading, .features__link:hover .features__heading {
      opacity: 1;
    }
    .service-button {
      padding: 5px 16px;
    font-size: 13px;
    }
}

@media (min-width: 75em) {
      .features {
        height: 500px;
    }
    
    .features__list li {
        border-right: 1px solid #b3b3b3;
        flex: 1;
        width: auto;
    }
    .features__link:focus .features__hidden, .features__link:hover .features__hidden {
        height: 16.1111111111rem;
        margin-bottom: 0;
        opacity: 1;
    }
        .features__link:focus, .features__link:hover {
        background-color: rgba(0, 0, 0, .6);
        padding-bottom: 0;
        padding-top: 0;
    }
        .features__link:before {
        background: transparent;
        background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, .77)));
        background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .77));
    }
        .features__hidden {
        height: 0;
        margin-bottom: -24.4444444444rem;
        max-width: 320px;
        opacity: 0;
        -webkit-transition: all .5s cubic-bezier(.4, 0, 0, 1);
        transition: all .5s cubic-bezier(.4, 0, 0, 1);
    }
        .features__link:focus .features__heading, .features__link:hover .features__heading {
        opacity: 0;
    }
    .features__img {
        display: none;
    }
}
@media (min-width: 93.75em) {
    .features__hidden p {
        width: 197px;
    }
}