/* Reusable testimonial slider ("Your expertise, amplified").
   Paired with views/partials/expertise-slider.php and js/expertise-slider.js. */

/* Let the quote background icon overflow outside the card.
   Splide fade stacks slides in the same position, so visible overflow is safe. */
.expertise-slider .splide__track,
.expertise-slider .splide__list {
    overflow: visible;
}

/* The global `blockquote:before` (custom.css) injects a decorative " before every
   quote. The slider already shows its own u-quote.svg, so suppress it here. */
.expertise-slider blockquote::before {
    content: none;
}

/* 2px gradient border that follows the card's rounded corners
   (border-image ignores border-radius, so use the padding-box/border-box trick). */
.expertise-slider .expertise-card {
    border: 2px solid transparent;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(180deg, #c8defe 0%, #99c2ff 100%) border-box;
}

/* Pagination dots below the card. */
.expertise-slider .splide__pagination {
    position: static;
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 2.5rem;
    padding: 0;
}

.expertise-slider .splide__pagination li {
    line-height: 1;
}

.expertise-slider .splide__pagination__page {
    width: 19px;
    height: 19px;
    margin: 0;
    background: #c7dbff;
    border-radius: 9999px;
    opacity: 1;
    transition: background-color 0.25s ease, transform 0.25s ease;
}

.expertise-slider .splide__pagination__page.is-active {
    background: #005de8;
    transform: scale(1);
}

.expertise-slider .splide__pagination__page:focus-visible {
    outline: 2px solid #005de8;
    outline-offset: 2px;
}