.testimonials {
    overflow: hidden;
    position: relative;

    &[data-color="#000000"],
    &[data-color="#006aaf"] {
        .container {
            .testimonials__portrait {
                img {
                    outline-color: rgba(255, 255, 255, 0.2) !important;
                }
            }
        }
    }

    &[data-color="#000000"] {
        .testimonials__quote {
            img {
                filter: brightness(0.2) !important;
            }
        }
    }

    &[data-color="#006aaf"] {
        &:before {
            background: rgba(0, 0, 0, 0.07);
        }

        .testimonials__quote {
            img {
                opacity: 0.3;
            }
        }

        .testimonials__author {
            opacity: 0.6;
        }
    }

    .container {
        .testimonials__list {
            display: flex;
            justify-content: center;

            .testimonials__item {
                max-width: 960px;

                .testimonials__content {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    gap: 20px;

                    .testimonials__portrait {
                        width: 80px;
                        height: 80px;

                        img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                            border-radius: 50%;
                            outline: 6px solid rgba(0, 0, 0, 0.2);
                        }
                    }

                    .testimonials__quote {
                        font-size: 22px;
                        line-height: 30px;
                        font-weight: var(--bold);
                        display: flex;
                        justify-content: center;
                        flex-direction: column;
                        text-align: center;
                        align-items: center;
                        gap: 20px;

                        @media (min-width: 768px) {
                            font-size: 32px;
                            line-height: 40px;
                        }

                        img {
                            filter: brightness(0.8);
                        }
                    }

                    .testimonials__author {
                        display: flex;
                        flex-direction: column;
                        align-items: center;
                        margin-top: 15px;

                        .testimonials__nom {
                            font-weight: var(--bold);
                            line-height: 1;
                        }

                        .testimonials__poste {
                            font-weight: var(--light);
                        }
                    }
                }
            }
        }
    }
}