#reference-testimonials-category {

    & {
        padding-top: clamp(15px, calc(72 / 1920 * 100vw), 72px);
        padding-bottom: clamp(15px, calc(90 / 1920 * 100vw), 90px);
    }

    .slider-container {
        padding-top: clamp(15px, calc(70 / 1920 * 100vw), 70px);
        padding-left: clamp(0px, calc(18 / 1920 * 100vw), 18px);
        padding-right: clamp(0px, calc(18 / 1920 * 100vw), 18px);
    }

    .slider-container:not(.slick-initialized) .slideItem:first-child {
        visibility: hidden;
    }

    .slider-container:not(.slick-initialized) .slideItem:not(:first-child) {
        display: none;
    }

    .slider-container .slideItem {
        padding-left: clamp(var(--min-x-padding), calc(32 / 1920 * 100vw), 32px);
        padding-right: clamp(var(--min-x-padding), calc(32 / 1920 * 100vw), 32px);
    }

    .filters {
        padding-left: clamp(var(--min-x-padding), calc(48 / 1920 * 100vw), 48px);
        padding-right: clamp(var(--min-x-padding), calc(48 / 1920 * 100vw), 48px);
    }

    .filters .inner-container {
        border-bottom: 1px solid rgba(var(--g-color-3-rgb), 0.5);
        padding-bottom: clamp(15px, calc(30 / 1920 * 100vw), 30px);
        padding-top: clamp(15px, calc(30 / 1920 * 100vw), 30px);
        row-gap: 0.5rem;
    }

    .filters-nav-outer {
        column-gap: clamp(15px, calc(38 / 1920 * 100vw), 38px);
        row-gap: 8px;
    }

    .filters-nav {
        gap: clamp(15px, calc(38 / 1920 * 100vw), 38px);
    }



    .filters button[data-id="RegionFilter"],
    .filters button[data-id="CategoryFilter"]
    {
        background: none;
        border: 2px solid rgba(var(--g-color-3-rgb), 0.5);
        outline: none !important;
        box-shadow: none !important;
        font-size: 16px;
        padding-top: 1px;
        padding-bottom: 1px;
        color: white;
    }

    .filters button[data-id="RegionFilter"] .filter-option-inner-inner,
    .filters button[data-id="CategoryFilter"] .filter-option-inner-inner {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block;
        max-width: 100%;
        padding-right: 5px;
    }

    .filters .custom-checkbox {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .filters .label-text {
        padding-bottom: 2px;
        font-size: 16px;
    }

    .filters .custom-checkbox input[type="checkbox"] {
        display: none;
    }

    .filters .checkbox-box {
        font-size: 22px;
        opacity: 0.5;
    }

    .filters .custom-checkbox input[type="checkbox"] + .checkbox-box i.checked {
        opacity: 0;
        transition: opacity 0.3s ease-in-out;
        top: 7px;
        position: absolute;
        left: 0;
    }

    .filters .custom-checkbox input[type="checkbox"]:checked + .checkbox-box i.checked {
        opacity: 1;
    }

    .filters .custom-checkbox input[type="checkbox"] + .checkbox-box i.unchecked {
        opacity: 1;
        transition: opacity 0.3s ease-in-out;
    }

    .filters .custom-checkbox input[type="checkbox"]:checked + .checkbox-box i.unchecked {
        opacity: 0;
    }

    .title {
        font-size: clamp(18px, calc(36 / 1920 * 100vw), 36px);
        font-weight: bold;
    }

    .item-title {
        color: var(--g-color-3);
        font-weight: bold;
        font-size: clamp(16px, calc(20 / 1920 * 100vw), 20px);
        line-height: 23px;
        margin-bottom: 16px;
        min-height: 45px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    img {
        aspect-ratio: 290 / 206;
        width: 100%;
        object-fit: cover;
        object-position: center;
        border-radius: 4px;
    }

    .description {
        color: white;
    }

    .testimonial .description {
        height: clamp(130px, calc(228 / 1920 * 100vw), 228px);
        display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 8;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
        font-size: clamp(12px, calc(18 / 1920 * 100vw), 18px);
        line-height: clamp(16px, calc(28 / 1920 * 100vw), 28px);
        margin-top: -7px;
    }

    .reference .description {
        height: clamp(40px, calc(55 / 1920 * 100vw), 55px);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-top: 15px;
        font-size: clamp(12px, calc(18 / 1920 * 100vw), 18px);
    }

    .rating-stars {
        color: #dfb52d;
        font-size: 18px;
        margin-top: 12px;
        height: 52px;
    }
}
