#top-features.top-features-2025 {
    padding: var(--sec-padding1);
    ul.wrap_cards {
        list-style: none;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        column-gap: var(--common-gap2);
        row-gap: 35px;
        li {
            padding: 30px;
            border-radius: 8px;
            background: #f8f8fc;
            border: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .wrap_img {
            background: transparent;
            border-radius: 8px;
            width: 110px;
            height: 110px;
            display: flex;
            align-items: center;
            justify-content: center;
            img {
                width: 75px;
                margin: 0 auto;
            }
        }
        h3 {
            margin: 20px 0 20px;
            text-align: center;
        }
        p {
            margin: 0;
        }
    }
    .wrap_L_cards {
        list-style: none;
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: var(--common-gap1);
        row-gap: 35px;
        padding: 60px 0;
        .wrap_cards_browser,
        .wrap_cards_mobile {
            background-color: #f8f8fc;
            border-radius: 8px;
            padding: 60px 35px;
            p.title {
                font-size: 28px;
                margin: 0 auto 40px;
                display: block;
                font-weight: 600;
                text-align: center;
                &.title1::before {
                    font: var(--fa-font-solid);
                    content: "\e163";
                    margin-right: 10px;
                }
                &.title2::before {
                    font: var(--fa-font-solid);
                    content: "\f3cf";
                    margin-right: 10px;
                }
            }
        }
        ul {
            list-style: none;
            display: grid;
            grid-template-columns: 1fr 1fr;
            column-gap: var(--common-gap2);
            row-gap: 35px;
            li {
                padding: 30px;
                border-radius: 8px;
                background: #fff;
                border: 0;
                display: flex;
                justify-content: start;
                flex-direction: column;
                align-items: center;
                min-height: 250px;
                min-height: 320px;
                h3 {
                    margin: 20px 0 20px;
                    text-align: center;
                    min-height: 63px;
                }
                p {
                    margin: 0;
                }
                .wrap_img {
                    background: transparent;
                    border-radius: 8px;
                    width: 110px;
                    height: 110px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    img {
                        width: 75px;
                        margin: 0 auto;
                    }
                }
            }
        }
    }
    .sec_footer {
        padding-top: 0;
        p {
            font-size: 23px;
            font-weight: 600;
            color: #2a3037;
            text-align: center;
            margin-bottom: 20px;
        }
    }
}
@media screen and (max-width: 1399px) {
    #top-features.top-features-2025 {
        & ul.wrap_cards {
            row-gap: 30px;
            & .wrap_img {
                width: 100px;
                height: 100px;
                img {
                    width: 67px;
                    height: auto;
                }
            }
        }
        & .wrap_L_cards {
            & .wrap_cards_browser,
            & .wrap_cards_mobile {
                p.title {
                    font-size: 27px;
                    margin: 0 auto 40px;
                    display: block;
                    font-weight: 600;
                    text-align: center;
                }
                ul {
                    row-gap: 30px;
                    & li {
                        & .wrap_img {
                            width: 100px;
                            height: 100px;
                            img {
                                width: 67px;
                                height: auto;
                            }
                        }
                    }
                }
            }
        }
    }
}
@media screen and (max-width: 1199px) {
    #top-features.top-features-2025 {
        & ul.wrap_cards {
            grid-template-columns: 1fr 1fr;
            li {
                padding: 30px 40px;
                & .wrap_img {
                    width: 100px;
                    height: 100px;
                    img {
                        width: 60px;
                    }
                }
            }
        }
        & .wrap_L_cards {
            grid-template-columns: 1fr;
            & .wrap_cards_browser,
            & .wrap_cards_mobile {
                grid-template-columns: 1fr 1fr;
                p.title {
                    font-size: 25px;
                    margin-bottom: 30px;
                }
                ul {
                    _row-gap: 30px;
                    li {
                        padding: 30px 40px;
                        min-height: 200px;
                        h3 {
                            min-height: initial;
                        }
                        & .wrap_img {
                            width: 100px;
                            height: 100px;
                            img {
                                width: 60px;
                            }
                        }
                    }
                }
            }
        }
        .sec_footer {
            p {
                font-size: 22px;
            }
        }
    }
}
@media screen and (max-width: 959px) {
    #top-features.top-features-2025 {
        ul.wrap_cards {
            grid-template-columns: 1fr 1fr;
            li {
                padding: 30px;
            }
        }
        .wrap_L_cards {
            grid-template-columns: 1fr;
            padding: 60px 0;
            .wrap_cards_browser,
            .wrap_cards_mobile {
                padding: 45px 30px;
                /* Full bleed. 100vw includes the scrollbar and overflows, so cancel the
                   section's 20px and .container's 1rem side padding instead. */
                margin: 0 calc(-20px - 1rem);
                width: auto;
                overflow: hidden;
                border-radius: var(--sec-br);
            }
        }
        .sec_footer {
            p {
                font-size: 20px;
            }
        }
    }
}
@media screen and (max-width: 767px) {
    #top-features.top-features-2025 {
        ul.wrap_cards {
            grid-template-columns: 1fr;
            gap: 30px 20px;
            li {
                padding: 30px;
                display: grid;
                grid-template-columns: 1fr 3fr;
                column-gap: 3vw;
                & .wrap_img {
                    width: 100%;
                    height: initial;
                    background: initial;
                    position: relative;
                    img {
                        width: 45px;
                        z-index: 1;
                    }
                    &::after {
                        content: "";
                        width: 75px;
                        position: absolute;
                        height: 75px;
                        background: #f3f3f7;
                        border-radius: 999px;
                    }
                }
                h3 {
                    margin: 0 0 15px;
                    text-align: initial;
                }
            }
        }
        & .wrap_L_cards {
            & .wrap_cards_browser,
            & .wrap_cards_mobile {
                ul {
                    grid-template-columns: 1fr;
                    gap: 20px;
                    li {
                        padding: 30px;
                        display: initial;
                        grid-template-columns: initial;
                        column-gap: initial;
                        min-height: initial;
                        h2 {
                            margin: 0 0 15px;
                            text-align: initial;
                        }
                        & .wrap_img {
                            width: 100%;
                            height: initial;
                            background: initial;
                            position: relative;
                            img {
                                width: 45px;
                                z-index: 1;
                            }
                            &::after {
                                content: "";
                                width: 75px;
                                position: absolute;
                                height: 75px;
                                background: #f3f3f7;
                                border-radius: 999px;
                            }
                        }
                    }
                }
            }
        }
        .sec_footer {
            p {
                font-size: 18px;
            }
        }
    }
}
@media screen and (max-width: 480px) {
    #top-features.top-features-2025 {
        ul.wrap_cards {
            gap: 20px 15px;
            li {
                padding: 25px 20px;
                h3 {
                    margin: 0 0 12px;
                }
                & .wrap_img {
                    &::after {
                        width: 70px;
                        height: 70px;
                    }
                }
            }
        }
        & .wrap_L_cards {
            & .wrap_cards_browser,
            & .wrap_cards_mobile {
                padding: 60px 20px;
                /* .container has no side padding at this width, so only the section's 20px
                   needs cancelling. */
                margin: 0 -20px;
                & ul {
                    gap: 20px 15px;
                    li {
                        padding: 25px 20px;
                        h3 {
                            margin: 0 0 12px;
                        }
                        & .wrap_img {
                            &::after {
                                width: 70px;
                                height: 70px;
                            }
                        }
                    }
                }
            }
        }
        .sec_footer {
            p {
                font-size: 17px;
            }
        }
    }
}

/* Enterprise restyle: desaturate the illustration icons. */
#top-features.top-features-2025 .wrap_img img {
    filter: grayscale(1);
}

/* Figma spec is 8px. Placed last to override the per-breakpoint values. */
#top-features.top-features-2025 ul.wrap_cards,
#top-features.top-features-2025 .wrap_L_cards ul {
    column-gap: 8px;
    row-gap: 8px;
}

/* Browser / mobile test cards. At 21px the longest headings measured 210-231px
   against a 208px content width and wrapped to two lines; at 17px the longest is
   187px, so all 12 fit on one line. Left aligned to share an axis with the body. */
#top-features.top-features-2025 .wrap_L_cards {
    /* 60px was too loose against the 8px card gap. Nested media queries below
       override the per-breakpoint values. */
    .wrap_cards_browser,
    .wrap_cards_mobile {
        padding: 40px 35px;

        @media screen and (max-width: 959px) {
            padding: 35px 25px;
        }

        @media screen and (max-width: 480px) {
            padding: 32px 20px;
        }
    }

    /* Matches the pricing page section-title; 28px left too big a gap to the
       card headings. */
    .wrap_cards_browser p.title,
    .wrap_cards_mobile p.title {
        font-size: 22px;
        line-height: 1.4;
        margin: 0 auto 28px;
    }

    ul li {
        /* Grid rows already equalise the card heights. */
        min-height: 0;
        align-items: stretch;

        h3 {
            /* Same scale as the case-study card titles. */
            font-size: 17px;
            line-height: 1.55;
            letter-spacing: 0.01em;
            text-align: left;
            min-height: 0;
            margin: 0 0 10px;
        }

        p {
            text-align: left;
        }
    }
}

/* Feature card headings. At 21px the longest measured 294px against a 249px
   content width and wrapped, so body text started at different heights; at 17px the
   longest is 238px and all 9 fit on one line. Same 17px as the other cards. */
#top-features.top-features-2025 ul.wrap_cards > li h3 {
    font-size: 17px;
    line-height: 1.55;
    letter-spacing: 0.01em;
    /* Tightening 14px then 8px groups the icon, heading and body as one block. */
    margin: 14px 0 8px;
}