.card-post {
    border-radius: 30px;
    height: 100%;
    display: flex;
    flex-direction: column;
    background-color: var(--wp--preset--color--base);
    box-shadow: 0px 20px 20px 0px rgba(0, 0, 0, 0.06);
    position: relative;
    padding: 0;

    .card-header {
        height: 202px;

        img {
            height: 100%;
            width: 100%;
            object-fit: cover;
            border-radius: 30px 30px 0 0;
        }
    }

    .card-body {
        padding: 23px 23px 20px;

        .badges {
            display: flex;
            flex-wrap: wrap;
            gap: 7px;
        }

        .categorie {
            display: flex;
            align-items: center;
            width: fit-content;
            height: 25px;
            padding: 0 10px;
            border-radius: 100px;
            font-size: .8125rem;
            text-transform: uppercase;
            line-height: var(--wp--custom--line-height--none);
        }

        .card-text {
            margin-bottom: 0;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            display: -webkit-box;
            overflow: hidden;
        }
    }

    .card-footer {
        margin-top: auto;
        padding: 0 23px 35px;

        a {
            padding-left: 0;
            padding-bottom: 0;
            padding-top: 0;
        }
    }
}

.card-solution {
    display: flex;
    flex-direction: column;
    height: 260px;
    border-radius: 20px;
    padding: 35px 28px;
    transition: height 0.3s ease, padding 0.3s ease, margin 0.3s ease, box-shadow 0.3s ease;
    position: relative;

    @media(width < 768px) {
        width: 200px;
        height: 200px;
        margin: 0 auto;
    }

    &:hover {
        height: 295px;
        padding: 60px 28px 20px;
        margin-top: -25px;
        box-shadow: 0px 10px 50px 0px rgba(0, 0, 0, 0.25);
    }

    .card-header {
        text-align: center;
        height: 55px;
        display: flex;
        align-items: center;

        img {
            max-width: 160px;
            max-height: 70px;
            width: auto;
            margin: 0 auto;
            text-align: center;
        }

        .no-logo {
            color: var(--wp--preset--color--base);
            font-size: 1.875rem;
            font-weight: 700;
            margin: 0;
        }
    }

    .card-body {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 0.3s ease, opacity 0.3s ease;
        font-size: var(--wp--preset--font-size--base);
        color: var(--wp--preset--color--base);
        text-align: center;
    }

    &:hover .card-body {
        max-height: 200px;
        opacity: 1;
    }

    .card-footer {
        display: flex;
        flex-direction: column;
        align-items: end;
        gap: 10px;
        margin-top: auto;

        .arrow {
            margin-right: 8px;
        }

        a {
            color: var(--wp--preset--color--base);
            font-weight: var(--wp--custom--font-weight--bold);
            text-decoration: none;
        }
    }

    .lines {
        position: absolute;
        bottom: 3px;
        Right: -30px;
    }
}

.card-temoignage {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 42px 76px;
    border-radius: 30px;
    background: #FFF;
    box-shadow: 5px 5px 0px 0px rgba(132, 191, 65, 0.41);

    .card-header {
        text-align: center;

        img {
            max-width: 190px;
            max-height: 50px;
            width: auto;
            margin: 0 auto;
            text-align: center;
        }
    }

    .card-body {
        font-size: var(--wp--preset--font-size--base);
        text-align: center;

        .card-title {
            text-transform: uppercase;
            font-size: var(--wp--preset--font-size--base);
            color: var(--wp--preset--color--dark);
        }

        .card-baseline {
            font-size: 1.125rem;
            font-weight: var(--wp--custom--font-weight--bold);

            p {
                line-height: var(--wp--custom--line-height--tight);
            }
        }
    }

    .card-footer {
        display: flex;
        flex-direction: column;
        align-items: end;
        gap: 10px;
        margin-top: auto;

        a {
            font-weight: var(--wp--custom--font-weight--bold);
            text-decoration: none;
        }
    }
}

.card-liens {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;

    .card-header img {
        max-height: 60px;
        width: auto;
    }

    .card-body {
        .texte {
            margin: 12px 0 32px;
        }
    }

    .card-footer {
        margin-top: auto;
    }

    &.card-liens--is-style-cards {
        padding: 0;
        border-radius: 30px;
        background-color: var(--wp--preset--color--base);
        box-shadow: 0px 20px 20px 0px rgba(0, 0, 0, 0.06);
        height: 100%;

        .card-header {
            text-align: center;
            margin-bottom: 0;

            img {
                width: 100%;
                height: 200px;
                max-height: inherit;
                object-fit: cover;
                border-radius: 30px 30px 0 0;
            }
        }

        .card-body {
            text-align: left;
            padding: 23px 23px 20px;

            .titre {
                text-align: left;
                margin-top: 0;
            }

            .texte {
                text-align: left;
                margin: 0;
            }
        }

        .card-footer {
            padding: 0 23px 35px;
        }
    }
}