#site-reviews {
    background-size: cover;
    background-position: center;
    padding: 300px 0px;
    position: relative;
    background-color: #030c12;
    background-blend-mode: color-dodge;
    margin: 70px;
    border: 1px solid var(--site-border);
    border-radius: 100px;
    overflow: hidden;

    &:before,
    &:after {

    }

    h2 {
        position: absolute;
        top: 50px;
        left: 30px;
        right: 30px;
        text-align: center;
    }

    .review {
        position: absolute;

        .avatar {
            position: relative;

            .content {
                position: absolute;
                left: 105%;
                top: 0;
                background: #fff;
                border-radius: 16px;
                padding: 30px;
                box-sizing: border-box;
                max-width: 400px;
                width: 400px;
                transition: all 0.15s;
                opacity: 0;
                visibility: hidden;
                z-index: 2;

                .author {
                    color: var(--site-primary);
                }
            }

            &:hover {
                .content {
                    visibility: visible;
                    opacity: 1;
                    left: 110%;
                }

                img {
                    border-color: var(--site-primary);
                }
            }

            span {
                display: none;
            }

            img {
                cursor: pointer;                
                width: 50px;
                height: 50px;
                border-radius: 50%;
                object-fit: cover;
                animation: pulse 2s infinite;
                backdrop-filter: blur(4px);
                background-size: cover;
                background-position: center;
                position: relative;
                overflow: hidden;
                color: #fff;
                border: 3px solid #fff;
            }

            svg {
                width: auto;
                height: 1em;
                display: inline-block;
                fill: var(--site-accent);
                font-size: 50px;
            }
        }

        &:nth-child(1) {
            left: 22.89%; 
            top: 28.74%;
        }

        &:nth-child(2) {
           left: 28.61%; 
           top: 50.17%;
        }


        &:nth-child(3) {
            left: 29.63%; 
            top: 22.76%;
        }


        &:nth-child(4) {
            left: 50.31%; top: 24.26%;
        }

        &:nth-child(5) {
            left: 56.37%; 
            top: 18.94%;
        }

        &:nth-child(6) {
            left: 61.19%; 
            top: 33.06%;
        }

  
        &:nth-child(7) {
            left: 70.54%; 
            top: 40.53%;
        }

        &:nth-child(8) {
            left: 56.54%; top: 71.90%;
        }

        &:nth-child(9) {
            left: 82.15%; 
            top: 31.90%;
        }

        &:nth-child(10) {
           left: 80.23%; 
           top: 57.98%;
        }
    }

}


@media (max-width: 980px) {
    #site-reviews {
        margin: 25px;
        border-radius: 50px;
    }
}


@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }
  
    70% {
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
    }
  
    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}