@charset "UTF-8";
/* DENTAL BEAUTY - review_videos: uniform Splide carousel (3-up desktop / 1-up peek mobile).
   Card visuals ported from feat_vids; hover-to-feature logic intentionally omitted. */
.review-videos { padding: var( --secPadding ); background-color: var( --white ); }
.review-videos .heading { text-align: center; margin-bottom: clamp( 24px, 2vw, 48px ); }

.review-videos .featLink.popVid {
    position: relative; display: block; width: 100%;
    height: clamp( 420px, 41.667vw, 800px );
    border-radius: clamp( 32px, 3.125vw, 60px );
    overflow: hidden;
}
.review-videos .featBox { position: relative; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; }
.review-videos .featImg { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.review-videos .featImg img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }

/* navy overlay + centered play button - ALWAYS shown (no hover state on a carousel) */
.review-videos .featLink.popVid::before {
    content: ''; position: absolute; inset: 0; z-index: 1;
    background-color: var( --primary ); opacity: .45; pointer-events: none;
}
.review-videos .featLink.popVid::after {
    content: '\f04b'; position: absolute; left: 50%; top: 50%; transform: translate( -50%, -50% );
    z-index: 2; width: clamp( 64px, 7.396vw, 142px ); height: clamp( 64px, 7.396vw, 142px );
    border: 2px solid var( --white ); border-radius: 50%; color: var( --white );
    font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: clamp( 22px, 1.8vw, 34px );
    display: flex; align-items: center; justify-content: center; opacity: 1;
}
.review-videos .featContent { position: relative; z-index: 2; padding: 0 clamp( 24px, 3vw, 60px ) clamp( 24px, 3vw, 48px ); }
.review-videos .featContent .h4 { color: var( --white ); text-align: left; margin: 0; }

/* give the arrows room so they don't overlap cards; brand colors come from global style.css */
.review-videos .splide { padding: 0 clamp( 20px, 4vw, 72px ); }
/* this section is edge-to-edge (no page container), so the global -5% arrow offset
   overflows past the viewport; keep arrows inside the padding gutter reserved above */
.review-videos .splide__arrow--prev { left: clamp( 4px, 1vw, 24px ); }
.review-videos .splide__arrow--next { right: clamp( 4px, 1vw, 24px ); }
@media ( max-width: 1024px ) {
    .review-videos { padding: 100px 0; }
    .review-videos .featLink.popVid { height: clamp( 360px, 90vw, 560px ); }
}

/* dots: brand contrast on the white section (global default is white-on-white) */
.review-videos .splide__pagination { position: static; margin-top: clamp( 16px, 1.5vw, 28px ); }
.review-videos .splide__pagination__page { background-color: var( --black ); opacity: .35; }
.review-videos .splide__pagination__page.is-active { background-color: var( --primary ); opacity: 1; }