@charset "UTF-8";
.reviews-title { width: 100%; }
.reviews-nav {
    border-radius: 1.6rem;
    background-color: #202020;
    box-shadow: 0 0.1rem 3.4rem 0 #C0C0C040;

}
.reviews-nav--item {
    border-radius: 0.8rem;
    background-color: rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease-in-out;
    box-sizing: border-box;
    cursor: pointer;
}

.reviews-nav--item:hover { background-color: transparent; }

.reviews-info {
    position: relative;
    border-radius: 1.6rem;
}

.reviews-img, .reviews-img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1.6rem;
}
.reviews-info--wrap span { color: #fff; }
.reviews-info--wrap, .reviews-info--create { z-index: 2; }
.reviews-info--create {
    border: 0.1rem solid #0AB6C9;
    transition: all 0.3s ease-in-out;
}
.reviews-info--create:hover { color: #0AB6C9; }
.reviews-info--create:after {
    display: block;
    content: '';
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("../img/svg/white/pencil.svg");
    transition: all 0.3s ease-in-out;
}
.reviews-info--create:hover:after { background-image: url("../img/svg/turquoise/pencil.svg"); }


/* Desktop (Big screen less than 3k) Only */
@media (min-width: 1600px) {
    .reviews { margin-top: 8rem; }
    .reviews .wrapper {
        gap: 0.8rem;
        padding-bottom: 8rem;
    }
    .reviews-nav {
        width: 50.2rem;
        height: 68rem;
        margin-top: 3.2rem;
        padding: 3.2rem;
        gap: 0.8rem;

    }
    .reviews-nav--item {
        width: 43.8rem;
        height: 14.8rem;
        padding: 0 2.4rem;
    }
    .reviews-nav--item img { width: 36.6rem; }
    .reviews-info {
        width: 101rem;
        height: 68rem;
        margin-top: 3.2rem;
        padding: 3.2rem;
        gap: 3.2rem;
    }
    .reviews-info--wrap {
        width: 55rem;
        height: 53.6rem;
    }
    .reviews-info--desc { padding-right: 10rem; }
    .reviews-info--create { padding: 1.4rem 3.2rem; }
}


/* Desktop (All screens) */
@media (min-width: 1025px) {
    .reviews .wrapper { gap: 0.8rem; }
    .reviews-nav {
        padding: 3.2rem;
        gap: 0.8rem;
    }
    .reviews-info { padding: 3.2rem; }
    .reviews-info--create {
        gap: 0.8rem;
        padding: 1.4rem 3.2rem;
    }
}

/* Desktop (Small screen less than 1600px) Only  */
@media (min-width: 1025px) and (max-width: 1599px) {
    .reviews { margin-top: 5.6rem; }
    .reviews .wrapper { padding-bottom: 5.6rem; }
    .reviews-nav {
        width: 37.2rem;
        height: 58rem;
        margin-top: 2.4rem;
    }
    .reviews-nav--item {
        width: 30.8rem;
        height: 12.3rem;
        padding: 0 2.4rem;
    }

    .reviews-nav--item img { width: 29rem; }
    .reviews-info {
        width: 90rem;
        height: 58rem;
        margin-top: 2.4rem;
        gap: 2.4rem;
    }
    .reviews-info--wrap {
        width: 42rem;
        height: 51.6rem;
    }
}

/* Desktop (All screens) + Tablet */
@media (min-width: 600px) {
}

/* Tablet Only */
@media (min-width: 600px) and (max-width: 1024px) {
    .reviews { margin-top: 5.6rem; }
    .reviews .wrapper { padding-bottom: 5.6rem; }
    .reviews-nav {
        padding: 2.4rem;
        gap: 0.4rem;
        order: 3;
    }
    .reviews-nav--item { width: 33.4rem; }
    .reviews-nav--item img { width: 26.6rem; }
    .reviews-info {
        width: 72rem;
        height: 36rem;
        margin-top: 1.6rem;
        gap: 1.6rem;
        padding: 2.4rem;
        order: 2;
    }
    .reviews-info--wrap {
        width: 34rem;
        height: 25.6rem;
    }
}

/* Tablet + Mobile */
@media (max-width: 1289px) {
    .reviews .wrapper { gap: 0.8rem; }
    .reviews-title { order: 1; }
    .reviews-nav {
        padding: 2.4rem;
        gap: 0.4rem;
        order: 3;
    }
    .reviews-nav--item {
        height: 7.4rem;
        padding: 0.8rem;
    }
    .reviews-info--create {
        gap: 0.8rem;
        padding: 1.1rem 2.4rem;
    }
}

/* Mobile Only */
@media (max-width: 599px) {
    .reviews { margin-top: 4.8rem; }
    .reviews .wrapper {
        padding-bottom: 4.8rem;
        gap: 0.8rem;
    }
    .reviews-nav {
        width: 34.3rem;
        height: 35.5rem;
    }
    .reviews-nav--item { width: 29.5rem;}
    .reviews-nav--item img { width: 27.9rem; }
    .reviews-info {
        width: 34.3rem;
        height: 58rem;
        margin-top: 1.6rem;
        gap: 2.4rem;
        padding: 3.3rem 2.4rem;
        order: 2;
    }
    .reviews-info--wrap {
        width: 28rem;
        height: 16rem;
        gap: 0.8rem;
        justify-content: start;
    }
    .reviews-info--title { font-size: 1.8rem; }
    .reviews-info--create { margin-top: -4.6rem; }
}