/* Plans */
.plans {
    padding: 2.5rem 0 5rem;
    text-align: center;
}
.plans h2 {
    margin-bottom: 5rem;
}
.plans-list {
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
}
.plans-list .plan {
    margin: 0 1.25rem;
    padding: 2.5rem 2rem;
    border-radius: 1.5rem;
    background: #F7F6F5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    border: 1px solid transparent;
    transition: .2s;
    text-decoration: none;
    color: var(--black-text);
}
.plans-list .plan:hover, .plans-list .plan.hover   {
    background: #fff;
    border-color: #E9E9E9;
    box-shadow: 0 8px 40px 0 rgba(10, 34, 59, 0.32);
    transition: .2s;
    text-decoration: none;
    color: var(--black-text);
}
.plans-list .plan:first-child {
    margin-left: 0;
}
.plans-list .plan:last-child {
    margin-right: 0;
}
.plan--features ul {
    border-top: 0.0625rem solid rgba(10, 34, 59, 0.10);
    padding: .75rem 0;
    list-style: none;
    text-align: left;
    margin: 0;
}
.plan--features {
    margin-bottom: 1.5rem;
}
.plan--features .plan--main-features {
    padding-top: 1.5rem;
    margin-top: 1.5rem;
    margin-bottom: 0;
}
.plan--ribbon {
    position: absolute;
    top:-1.25rem;
    padding: 0.5rem;
    width: 60%;
    background: #00B67A;
    border-radius: 0.625rem;
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
}
.plan--head {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 120%;
    margin-bottom: 1rem;
}
.plan--price p {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 120%;
    margin-bottom:.5rem;
}
.plan--price strong {
    font-size: 3.25rem;
    font-weight: 800;
    line-height: 120%;
    letter-spacing: -0.0975rem;
}
.plan--price sub {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: normal;
}
.plan--cta {
    width: 100%;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
    padding: 1rem;
    border-radius: 0.75rem;
    opacity: 0.4;
}
.plan:hover .plan--cta, .plan.hover .plan--cta {
    opacity: 1;
}
.plan--features li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    margin: 0.375rem 0;
}
.plan--features li:before {
    content:'';
    display: inline-flex;
    width: 1.5rem;
    height: 1.5rem;
    margin-right: .75rem;
}
.plan--features li.feature--includes:before {
    background: url("../../../images/redesign/svg/check.svg") no-repeat center;
    background-size: contain;
}
.plan--features li.feature--excludes:before {
    background: url("../../../images/redesign/svg/cross.svg") no-repeat center;
    background-size: contain;
}
.plan--features li.quota:before {
    background: url("../../../images/redesign/svg/server.svg") no-repeat center;
    background-size: contain;
}
.plan--features li.calendar:before {
    background: url("../../../images/redesign/svg/calendar.svg") no-repeat center;
    background-size: contain;
}
.plan--features li.connections:before {
    background: url("../../../images/redesign/svg/link.svg") no-repeat center;
    background-size: contain;
}
.plan--features li.mbg:before {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='33' viewBox='0 0 32 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.7454 5.42992C14.3406 3.19654 17.6599 3.19654 19.2553 5.42992L19.5093 5.78548C19.7899 6.17855 20.2614 6.38902 20.7414 6.33568L21.8734 6.2099C24.4211 5.92683 26.5738 8.07951 26.2907 10.6272L26.165 11.7592C26.1117 12.2393 26.3221 12.7106 26.7151 12.9914L27.0707 13.2454C29.3041 14.8406 29.3041 18.1599 27.0707 19.7553L26.7151 20.0093C26.3221 20.2899 26.1117 20.7614 26.165 21.2414L26.2907 22.3734C26.5738 24.9211 24.4211 27.0738 21.8734 26.7907L20.7414 26.665C20.2614 26.6117 19.7899 26.8221 19.5093 27.2151L19.2553 27.5707C17.6599 29.8041 14.3407 29.8041 12.7454 27.5707L12.4914 27.2151C12.2106 26.8221 11.7393 26.6117 11.2592 26.665L10.1272 26.7907C7.57951 27.0738 5.42683 24.9211 5.7099 22.3734L5.83568 21.2414C5.88902 20.7614 5.67855 20.2899 5.28548 20.0093L4.92992 19.7553C2.69654 18.1599 2.69654 14.8407 4.92992 13.2454L5.28548 12.9914C5.67855 12.7106 5.88902 12.2393 5.83568 11.7592L5.7099 10.6272C5.42683 8.07951 7.57951 5.92683 10.1272 6.2099L11.2592 6.33568C11.7393 6.38902 12.2106 6.17855 12.4914 5.78548L12.7454 5.42992ZM20.9431 12.8908C21.4638 13.4115 21.4638 14.2558 20.9431 14.7765L15.8513 19.8683C15.1973 20.5225 14.1367 20.5225 13.4827 19.8683L11.0575 17.4431C10.5368 16.9225 10.5368 16.0782 11.0575 15.5575C11.5782 15.0369 12.4224 15.0369 12.9431 15.5575L14.667 17.2814L19.0575 12.8908C19.5782 12.3701 20.4225 12.3701 20.9431 12.8908Z' fill='%230A223B'/%3E%3C/svg%3E%0A");
    background-size: contain;
}

@media screen and (max-width: 1399px) {
    .plans h2 {
        margin-bottom: 4rem
    }
    .plans-list .plan {
        margin: 0 1rem;
        padding: 2rem 1.5rem;
    }
    .plan--features {
        margin-bottom: .5rem;
    }
    .plan--features li {
        flex-wrap: unset;
        align-items: flex-start;
        line-height: 120%;
        margin: .75rem 0;
    }
}
@media screen and (max-width: 1199px) {
    .plans-list .plan {
        margin: 0 .875rem;
        padding: 2.5rem 1.5rem;
    }
    .plan--features li {
        font-size: .875rem;
    }
    .plan--features li:before {
        margin-right: .5rem;
        width: 1.25rem;
        height: 1.25rem;
    }
    .plan--features .plan--main-features {
        padding-top: .75rem
    }
}
@media screen and (max-width: 991px) {
    .plans h2 {
        margin-bottom: 2.25rem
    }
    .plans-list {
        flex-direction: column-reverse;
    }
    .plans-list .plan {
        margin: .75rem auto;
        max-width: 25rem;
        padding: 2.5rem 2rem;
    }
    .plans-list .plan:last-child, .plans-list .plan:first-child {
        margin-right: auto;
        margin-left: auto;
    }
    .plans-list .plan.plan-featured {
        order: 1
    }
    .plan--features {
        margin-bottom: 0
    }
    .plan--features li {
        font-size: 1rem;
    }
}