.case-study-carousel-wrapper {
    --dot-active: #F26419;
    --dot-inactive: #D0D5DD;
    --arrow-color: #0B3C5D;

    margin: 0 auto;
    font-family: inherit;
    padding-top: 35px;
    
    .case-study-card {
        display: flex;
        gap: 24px;
        align-items: stretch;
        
        .case-study-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 100px;
            margin-bottom: 24px;
            
            .Button {
                white-space: nowrap;
				background: #003451;
				color: #FFFFFF;
				
				i {
					color: #FFFFFF;
				}
				
				&:hover {
					background: #4F788F;
					border: 2px solid #4F788F;
				}
            }
        }
        
        .case-study-content {
            flex: 2;
            background-color: #003451;
            color: #ffffff;
            padding: 55px;
            border-radius: 30px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
    }

    .case-study-title {
        color: #F6AE2D;
        font-size: 22px;
        font-weight: 600;
        margin: 0;
    }

    .case-study-excerpt {
        font-size: 18px;
        font-weight: 300;
        color: #FFFFFF;
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .case-study-image {
        flex: 1;
        border-radius: 24px;
        overflow: hidden;
        max-height: 280px;

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
    }

    .case-study-footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 24px;
		
		.Button:hover {
			background: #f26419;
		}
    }

    .carousel-nav-container {
        display: flex;
        align-items: center;
        gap: 24px;

        /* Slick Dots Styling */
        .js-case-study-dots {
            ul {
                display: flex;
                align-items: center;
                gap: 10px;
                margin: 0;
                padding: 0;
                list-style: none;

                li {
                    width: 12px;
                    height: 12px;
                    margin: 0;
                    cursor: pointer;

                    button {
                        display: block;
                        width: 12px;
                        height: 12px;
                        padding: 0;
                        border: none;
                        border-radius: 50%;
                        background-color: var(--dot-inactive);
                        font-size: 0;
                        color: transparent;
                        outline: none;
                        transition: background-color 0.25s ease, transform 0.25s ease;
                        cursor: pointer;

                        &:hover {
                            opacity: 0.8;
                        }
                    }

                    &.slick-active button {
                        background-color: #F26419;
                        transform: scale(1.1);
                    }
                }
            }
        }

        .slick-arrows-custom {
            display: flex;
            align-items: center;
            gap: 16px;

            .slick-prev-custom,
            .slick-next-custom {
                background: transparent;
                border: none;
                padding: 4px;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;
                outline: none;
                transition: transform 0.2s ease, opacity 0.2s ease;

                svg {
					width: 26px;
					height: 26px;
					
					path {
						stroke: #004063;
						transition: stroke 0.2s ease;
					}
				}

                &:hover {
                    opacity: 0.7;
                    transform: scale(1.08);
					
					svg path {
						stroke: #F26419;
					}
                }

                &:disabled,
                &.slick-disabled {
                    opacity: 0.3;
                    cursor: not-allowed;
                    transform: none;
                }
            }
        }
    }
}