/* Case study slider (includes/case-study-slider.php) */
.cs-section{background:#fefefe;padding:70px 0 100px;overflow:hidden;}
.cs-header{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:52px;}
.cs-heading h2{font-family:"Raleway",sans-serif;font-size:45px;font-weight:700;line-height:54px;color:#000;margin:0 0 29px;}
.cs-heading p{font-family:"Raleway",sans-serif;font-size:17px;line-height:25.5px;color:#000;margin:0;}
.cs-more-btn{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 24px;margin-top:18px;background:#f57c20;border:1px solid #f57c20;border-radius:50px;color:#fff;font-family:"Raleway",sans-serif;font-size:16px;font-weight:700;line-height:21.6px;text-decoration:none;white-space:nowrap;transition:background-color .2s ease,border-color .2s ease;}
.cs-more-btn:hover,.cs-more-btn:focus{background:#dc660c;border-color:#dc660c;color:#fff;}

.cs-slider-wrap{position:relative;}
.cs-slider{margin:0 -12px;}
.cs-slider .slick-list{overflow:hidden;}
.cs-slider .slick-track{display:flex;}
.cs-slider .slick-slide{height:auto;padding:0 12px;}
.cs-slider .slick-slide > div{height:100%;}
/* Before slick initialises, lay the first cards out in a row so there is no jump. */
.cs-slider:not(.slick-initialized){display:flex;overflow:hidden;}
.cs-slider:not(.slick-initialized) .cs-slide{flex:0 0 33.333%;padding:0 12px;}

.cs-card{position:relative;display:block;aspect-ratio:469/492;overflow:hidden;background:#2b2b2b;color:#fff;text-decoration:none;}
.cs-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.cs-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(102,102,102,0) 0%,rgba(0,0,0,.8) 79.255%);pointer-events:none;}
.cs-card:hover img,.cs-card:focus-visible img{transform:scale(1.05);}
.cs-card:focus-visible{outline:3px solid #f57c20;outline-offset:2px;}
.cs-card-body{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;flex-direction:column;gap:12px;padding:16px 24px;}
.cs-card-title{font-family:"Raleway",sans-serif;font-size:24px;font-weight:700;line-height:1.2;color:#fff;font-variant-numeric:lining-nums proportional-nums;}
.cs-card-desc{font-family:"Raleway",sans-serif;font-size:16px;font-weight:400;line-height:1.5;color:#fff;font-variant-numeric:lining-nums proportional-nums;}

/* Arrows */
.cs-slider .cs-arrow{position:absolute;top:50%;z-index:2;width:60px;height:60px;padding:0;border:0;border-radius:50%;background:#fff url(../images/case-slider-arrow.png) no-repeat center/24px 24px;box-shadow:2px 0 19px rgba(0,0,0,.1);transform:translateY(-50%);cursor:pointer;font-size:0;transition:box-shadow .2s ease;}
.cs-slider .cs-arrow:hover,.cs-slider .cs-arrow:focus-visible{box-shadow:2px 0 19px rgba(245,124,32,.45);}
.cs-slider .cs-arrow:focus-visible{outline:2px solid #f57c20;outline-offset:2px;}
.cs-slider .cs-prev{left:-20px;transform:translateY(-50%) rotate(180deg);}
.cs-slider .cs-next{right:-20px;}

@media (max-width:1440px){.cs-heading h2{font-size:40px;line-height:48px;}}
@media (max-width:1199px){
    .cs-section{padding:60px 0 80px;}
    .cs-card-title{font-size:20px;}
    .cs-card-desc{font-size:14px;line-height:21px;}
    .cs-card-body{gap:8px;padding:16px 20px;}
    .cs-slider .cs-prev{left:-8px;}
    .cs-slider .cs-next{right:-8px;}
}
@media (max-width:991px){
    .cs-heading h2{font-size:32px;line-height:40px;margin-bottom:16px;}
    .cs-header{margin-bottom:36px;}
    .cs-slider:not(.slick-initialized) .cs-slide{flex-basis:50%;}
}
@media (max-width:767px){
    .cs-section{padding:48px 0 56px;}
    .cs-header{flex-direction:column;gap:20px;margin-bottom:28px;}
    .cs-heading h2{font-size:28px;line-height:36px;margin-bottom:12px;}
    .cs-heading p{font-size:16px;line-height:24px;}
    .cs-more-btn{margin-top:0;}
    .cs-slider:not(.slick-initialized) .cs-slide{flex-basis:100%;}
    /* Arrows move under the slider so they never cover the card text. */
    .cs-slider-wrap{padding-bottom:68px;}
    .cs-slider .cs-arrow{top:auto;bottom:-68px;width:48px;height:48px;background-size:20px 20px;transform:none;}
    .cs-slider .cs-prev{left:calc(50% - 56px);transform:rotate(180deg);}
    .cs-slider .cs-next{right:calc(50% - 56px);}
}