.our-case-studies {
            position: relative;
            padding-bottom: 40px;
        }

        .our-case-studies__title {
            font-weight: 500;
            color: #0d1118;
        }

        .our-case-studies__case-item {
            display: flex;
            flex-direction: column;
            border: 1px solid #cfcfcf;
            border-radius: 16px;
            background: #fefefe;
            text-decoration: none;
            overflow: hidden;
        }

        .our-case-studies__case-item-image {
            display: block;
            width: 100%;
            height: auto;
            max-height: clamp(310px, 36.11vw, 520px);
            min-height: clamp(310px, 36.11vw, 520px);
        }

        .our-case-studies__case-item-content {
            display: flex;
            flex-direction: column;
            gap: 16px;
            box-sizing: border-box;
            height: 100%;
            justify-content: space-between;
            border-top: 1px solid var(--grey-300);
        }

        .our-case-studies__case-item-head {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .our-case-studies__case-item-title {
            font-weight: 500;
            line-height: 130%;
            color: #0d1118;
        }

        .our-case-studies__case-item-description p {
            display: -webkit-box;
            -webkit-line-clamp: 1;
            line-clamp: 1;
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-overflow: ellipsis;
            font-weight: 400;
            font-size: 18px;
            line-height: 160%;
            color: var(--grey-600, #4f4f4f);
        }

        .our-case-studies__case-item-types {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }

        .our-case-studies__case-item-types p {
            font-weight: 400;
            font-size: 14px;
            line-height: 140%;
            color: #0d1118;
            display: flex;
            box-sizing: border-box;
            border-radius: 24px;
            padding: 8px 16px;
            background: #f3f5fb;
        }

        @media screen and (min-width: 1201px) {
            .our-case-studies {
                padding-top: 150px;
            }

            .our-case-studies__title {
                font-size: 56px;
                line-height: 120%;
            }

            .our-case-studies__head {
                margin-bottom: 56px;
            }

            .our-case-studies__case-item-content {
                padding: 24px;
            }

            .our-case-studies__case-item-title {
                font-size: 24px;
            }
        }

        @media screen and (max-width: 1200px) {
            .our-case-studies {
                padding-top: 160px;
            }

            .our-case-studies__title {
                line-height: 130%;
            }

            .our-case-studies__head {
                margin-bottom: 40px;
            }

            .our-case-studies__case-item-content {
                padding: 24px 16px;
            }

            .our-case-studies__case-item-title {
                font-size: 20px;
            }
        }

        @media screen and (min-width: 769px) and (max-width: 1200px) {
            .our-case-studies__title {
                font-size: 46px;
            }
        }

        @media screen and (max-width: 768px) {
            #primary section.our-case-studies {
                padding-top: 120px;
            }

            .our-case-studies__title {
                font-size: 36px;
            }
        }

        /* tabs styles */
        .our-case-studies .tab_nav {
            position: relative;
            display: flex;
            gap: 16px;
            flex-wrap: wrap;
            scrollbar-width: none;
            -ms-overflow-style: none;
        }

        .our-case-studies .tab_nav_item {
            font-weight: 400;
            line-height: 140%;
            color: #0d1118;
            text-decoration: none;
            transition: all 0.3s ease;
            background-color: transparent;
            position: relative;
            border-radius: 40px;
            padding: 13px 22px;
            box-sizing: border-box;
            background: #f3f5fb;
        }

        .our-case-studies .tab_nav_item.active {
            background: #06063c;
            color: #f3f5fb;
        }

        .our-case-studies .tab_nav::-webkit-scrollbar {
            display: none;
        }

        .our-case-studies .top_tabs_bar {
            position: relative;
        }

        .our-case-studies .tabContainer {
            position: relative;
            z-index: 99;
            overflow: hidden;
        }

        .our-case-studies .Tabcondent.active {
            transform: none !important;
            opacity: 1 !important;
            border-radius: 0px;
            z-index: 3;
            transition: all ease-in-out 0.6s;
            margin: 0 auto;
        }

        .our-case-studies .Tabcondent {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            min-height: fit-content;
            transform-origin: 0 0;
            transition: opacity 0.4s, transform 0.4s;
            opacity: 0;
            transform: translateY(50px);
        }

        .posts-container {
            display: flex;
            gap: 16px;
            flex-wrap: wrap;
        }

        @media screen and (min-width: 1201px) {
            .our-case-studies .tab_nav_item:not(.active):hover {
                background: #06063c;
                color: #f3f5fb;
            }

            .our-case-studies .tab_nav_item {
                font-size: 16px;
            }

            .our-case-studies .top_tabs_bar {
                margin-bottom: 40px;
            }
        }

        @media screen and (max-width: 1200px) {
            .our-case-studies .tab_nav_item {
                font-size: 14px;
            }

            .our-case-studies .top_tabs_bar {
                margin-bottom: 24px;
            }
        }

        @media screen and (min-width: 991px) {
            .our-case-studies .posts-container .our-case-studies__case-item {
                flex: 1 1 calc(50% - 16px);
                max-width: 50%;
            }
        }

        @media screen and (max-width: 990px) {
            .our-case-studies .posts-container {
                flex-direction: column;
            }
        }

        /* Pagination styles */
        .pagination-container {
            display: flex;
            align-items: center;
            gap: 16px;
            max-width: fit-content;
            min-width: fit-content;
            margin-left: auto;
            margin-right: auto;
        }

        .pagination-btn {
            flex: 0 0 48px;
            display: flex;
        }

        .pagination-btn svg {
            cursor: pointer;
            width: 100%;
            height: auto;
            min-width: 48px;
            min-height: 48px;
            max-width: 48px;
            max-height: 48px;
        }

        .pagination-btn svg * {
            transition: all 0.3s;
        }

        .pagination-btn svg rect {
            fill: transparent;
        }

        .pagination-btn.disabled {
            display: none;
        }

        .pagination-numbers {
            display: flex;
            gap: 8px;
            align-items: center;
            overflow-x: scroll;
            -webkit-overflow-scrolling: touch;
            scroll-snap-type: x mandatory;
            padding: 0 4px;
        }

        .pagination-numbers::-webkit-scrollbar {
            display: none;
        }

        .pagination-numbers {
            scrollbar-width: none;
        }

        .pagination-number {
            border-radius: 99px;
            max-width: 44px;
            max-height: 44px;
            min-width: 44px;
            min-height: 44px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: 400;
            font-size: 16px;
            line-height: 140%;
            color: #0d1118;
            cursor: pointer;
            transition: all 0.3s ease;
            text-align: center;
        }

        .pagination-number.active {
            background: #E4EBFF;
            color: #1629D6;
        }

        .pagination-number.dots {
            cursor: default;
            background: transparent;
            border: none;
        }

        @media screen and (min-width: 1201px) {
            .pagination-btn:not(.disabled):hover svg path {
                stroke: #fff;
            }

            .pagination-btn:not(.disabled):hover svg rect {
                fill: #1629D6;
            }

            .pagination-number:not(.dots):not(.active):hover {
                background: #1629D6;
                color: #f3f5fb;
            }

            .pagination-container {
                margin-top: 60px;
            }
        }

        @media screen and (min-width: 769px) and (max-width: 1200px) {
            .pagination-container {
                margin-top: 40px;
            }
        }

        @media screen and (max-width: 768px) {
            .pagination-container {
                margin-top: 24px;
            }

            .pagination-numbers {
                max-width: 200px;
            }
        }

        @media screen and (max-width: 390px) {
            .pagination-numbers {
                max-width: 150px;
            }
        }