/* reviews ----------------------------------------- */
.reviewspage{
    margin: 20px 0 20px 0;
    width: 96%;
    gap: 20px;
    flex-wrap: wrap;
}
.reviews{
    text-align: left;
    width: 100%;
    padding: 35px 30px 35px 30px;
    border-radius: var(--border-radius);
    gap: 10px;
    flex-direction: column;
    background: var(--fill-1);
    justify-content: flex-start;
    cursor: pointer;
    transition: .25s ease-in-out;
    position: relative;
}
@media (hover: hover){
    .reviews:hover{
        scale: 1.01;
    }
}
.reviews:active{
    transition: 0s;
    scale: .995;
}
.reviewtop{
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
}
[data-pinned="review"]{
    padding: 40px 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(-230deg, #ff5100, #ff00bf);
}
[data-pinned="review"] > *{
    z-index: 4;
}
[data-pinned="review"] .reviewprofilecircles{
    background: linear-gradient(-230deg, #ff5100, #ff00bf);
}
[data-pinned="review"] .reviewernames, [data-pinned="review"] .pure-text{
    background: -webkit-linear-gradient(#ff5100, #ff00bf);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}
[data-pinned="review"]::after{
    content: "";
    position: absolute !important;
    background: var(--fill-1);
    border-radius: calc(var(--border-radius) - 3px);
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    z-index: 1;
}
[data-pinned="review"]::before{
    content: "\eed9";
    position: absolute !important;
    top: 15px;
    left: 15px;
    font-size: 20px;
    box-sizing: inherit;
    font-family: uicons-solid-rounded !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    display:flex;
    z-index: 3;

    background: -webkit-linear-gradient(#ff5100, #ff00bf);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}
.reviewprofilecircles{
    height: 50px;
    font-size: 20px;
    color: rgba(255,255,255,.8);
    aspect-ratio: 1;
    border-radius: 50%;
}
.reviewprofileletters{
    color: white;
    font-size: 25px;
}
.reviewspecs{
    gap: 5px;
    font-size: 13px;
    flex-direction: column;
    align-items: flex-start;
}
.reviewernames{
    font-size: 17px;
    font-weight: 500;
    color: var(--light-grey);
}
.reviewrattings{
    gap: 2px;
}
.ratingstar{
    color: gold;
}
.reviewsource{
    font-size: 12px;
    color: var(--light-grey);
    opacity: .5;
    margin-left: 10px;
}
.reviewtexts{
    color: var(--light-grey);
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    font-size: 13px;
}
.reviews-quotation-marks{
    color: var(--light-grey);
    opacity: .5;
    font-size: 9px;
    margin: 0 5px 0 5px;
}