.feature-container:not(:last-child){
    margin-bottom: 30px;
}
@media screen and (min-width:768px) {
    .feature-container:not(:last-child){
        margin-bottom: 50px;
    }
}

.feature-name{
   font-size: 16px;
   font-weight: 700;
   text-align: center;
   letter-spacing: 0.002em; 
   line-height: 25px;
   padding-bottom: 7px;
   margin-bottom: 20px;
   border-bottom: 2px solid #3DA08D;
}
/* .feature-name.-ls{ */
    @media screen and (max-width:576px) {
        .feature-name.-ls{
            letter-spacing: -0.01em;
        }
    }
/* } */
@media screen and (min-width:768px) {
    .feature-name{
        font-size: 22px;
        line-height: 32px;
        padding-bottom: 15px;
        border-bottom: 3px solid #3DA08D;
     }
}

.feature-top{
   border: 2px solid #222;
   padding-block: 5px; 
}
@media screen and (min-width:768px) {
    .feature-top{
        padding-block: 13px; 
     }
}

.feature-row{
    display: flex;
    align-items: center;
    justify-content: center;
}

.feature-col{
    width: 50%;
    padding-block: 5px;
}
.feature-col:first-child.-noborder{
    border-right: none;
}
@media screen and (max-width:767px) {
    .feature-col:first-child.-noborder .feature-text{
        gap: 20px;
    }
}

.feature-col:first-child{
    border-right: 2px solid #222;
}

.feature-text{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
@media screen and (min-width:768px) {
    .feature-text{
        gap: 30px;
    }
}

.feature-text span:first-child{
    max-width: 122px;
    width: 100%;
    height: 35px;
    font-size: 13px;
    font-weight: 500;
    /* color: #7F6000;
    background-color: #FFD966; */
    display: flex;
    align-items: center;
    justify-content: center;
}

@media screen and (min-width:768px) {
    .feature-text span:first-child{
        max-width: 180px;
        height: 40px;
        font-size: 18px;
    }
}

.feature-text span:first-child.yellow{
    color: #7F6000;
    background-color: #FFD966;
}
.feature-text span:first-child.pink{
    background-color: #F64473;
    color: #fff;
}

.feature-text span:last-child{
    font-size: 14px;
}
@media screen and (min-width:768px) {
    .feature-text span:last-child{
        font-size: 20px;
    }
}

.feature-images{
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-block: 20px;
}
.feature-images iframe {
    width: 100%;
}
@media screen and (min-width:768px) {
    .feature-images{
        display: flex;
        flex-direction: row;
        gap: 35px;
        height: 350px;
        margin-block: 30px;
    }
    .feature-images figure,
    .feature-images iframe {
        height: 100%;
        width: calc( (100% - 20px) / 2 );
    }
    .feature-images figure img {
        height: 100%;
    }
}

/* .feature-desc{
    font-size: 18px;
} */

.feature-desc a {
    display: inline-block;
    margin: 0 5px;
    cursor: pointer;
    font-size: 15px;
    text-decoration: underline;
}
.feature-desc a:hover{
    text-decoration: underline;
}
.feature-desc{
    font-size: 14px;
    /* letter-spacing: -0.004em; */
}
@media screen and (min-width:768px) {
    .feature-desc{
        font-size: 18px;
    }
    .feature-desc a {
        font-size: 19px;
    }
}
/* .feature-desc.-lg{
    font-size: 14px;
    letter-spacing: -0.004em;
}
@media screen and (min-width:768px) {
    .feature-desc.-lg{
        font-size: 18px;
    }
} */

.feature-flex{
    display: flex;
    gap: 30px;
    margin-top: 30px;
    align-items: center;
    flex-direction: column;
}
@media screen and (min-width:768px) {
    body .feature-flex{
        flex-direction: row;
        align-items: unset !important;
    }
    body .feature-flex figure {
        height: auto;
    }
    body .feature-flex figure img {
        height: 100%;
        object-position: top;
    }
}

.feature-img{
    max-width: 330px;
    width: 100%;
}