/* --- Case Study Logo Strip --------------------------------- */

/* ── Shared container ───────────────────────────────────────── */
.case-study-logo-strip .logo-strip-eyebrow {
    text-align: center;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin: 0 0 28px;
    opacity: 0.65;
}

/* ── Logo filter classes ────────────────────────────────────── */
/* Grey: for default/light backgrounds */
.logo-filter-grey .logo-strip-item img,
.logo-filter-grey .splide__slide img {
    filter: grayscale(100%) opacity(0.55);
    transition: filter 0.25s ease, transform 0.25s ease;
}
.logo-filter-grey .logo-strip-item:hover img,
.logo-filter-grey .splide__slide:hover img {
    filter: grayscale(0%) opacity(1);
    transform: scale(1.04);
}

/* White: for dark/primary/secondary backgrounds */
.logo-filter-white .logo-strip-item img,
.logo-filter-white .splide__slide img {
    filter: brightness(0) invert(1) opacity(0.75);
    transition: filter 0.25s ease, transform 0.25s ease;
}
.logo-filter-white .logo-strip-item:hover img,
.logo-filter-white .splide__slide:hover img {
    filter: brightness(0) invert(1) opacity(1);
    transform: scale(1.04);
}

/* Colour: full colour, just a subtle opacity at rest */
.logo-filter-colour .logo-strip-item img,
.logo-filter-colour .splide__slide img {
    filter: opacity(0.8);
    transition: filter 0.25s ease, transform 0.25s ease;
}
.logo-filter-colour .logo-strip-item:hover img,
.logo-filter-colour .splide__slide:hover img {
    filter: opacity(1);
    transform: scale(1.04);
}

/* ── Desktop carousel (Splide) ──────────────────────────────── */
.case-study-logo-strip .logo-strip-carousel {
    display: block;
    padding: 0 20px;
    max-width: 1140px;
    margin: 0 auto;
}
.case-study-logo-strip .logo-strip-carousel .splide__slide {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
}
.case-study-logo-strip .logo-strip-carousel img {
    display: block;
    max-height: 52px;
    max-width: 150px;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* ── Mobile static grid (hidden on desktop) ─────────────────── */
.case-study-logo-strip .logo-strip-static {
    display: none;
}
.case-study-logo-strip .logo-strip-static .logo-strip-item {
    display: flex;
    align-items: center;
    justify-content: center;
}
.case-study-logo-strip .logo-strip-static img {
    display: block;
    max-height: 40px;
    max-width: 120px;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* ── Responsive breakpoint ──────────────────────────────────── */
@media (max-width: 768px) {
    /* Hide carousel, show static grid */
    .case-study-logo-strip .logo-strip-carousel { display: none !important; }
    .case-study-logo-strip .logo-strip-static {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 20px 28px;
        padding: 0;
    }
    .case-study-logo-strip .logo-strip-static img {
        max-height: 36px;
        max-width: 110px;
    }
}