/* Only affects the ChristianStory slider; no carousel framework required. */
.cs-video-slider { --cs-slider-ink: #233435; width: 100%; min-width: 0; margin-block: 32px; }
.cs-video-slider *, .cs-video-slider *::before, .cs-video-slider *::after { box-sizing: border-box; }
.cs-video-slider [hidden] { display: none !important; }
.cs-video-slider .cs-video-card { margin: 0 0 36px; }
.cs-video-slider .cs-video-stage { position: relative; min-width: 0; min-height: 200px; aspect-ratio: 16 / 9; background: #172523; }
.cs-video-slider .cs-video-stage figure { margin: 0; }
.cs-video-slider .cs-video-stage img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cs-video-slider .cs-video-stage figure, .cs-video-slider .cs-video-stage iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cs-video-slider .cs-video-stage iframe { z-index: 2; background: #000; }
.cs-video-slider .cs-video-card .cs-video-details { padding: 28px 0; }
.cs-video-slider .cs-video-card h3 { font-size: clamp(23px, 2.5vw, 30px); line-height: 1.25; margin: 10px 0 18px; }
.cs-video-slider .cs-video-details > p { font-size: 15px; }
.cs-video-slider .cs-video-details > .cs-eyebrow { font-size: 10px; }
.cs-video-slider .cs-video-details a { text-underline-offset: .2em; }
.cs-video-slider .cs-video-details .cs-dossier-link { margin-top: 26px; font-weight: 600; }
.cs-video-slider .cs-video-details .cs-youtube-link { margin-top: 10px; font-size: 13px; }
.cs-video-slider .cs-video-details .cs-player-note { margin-top: 22px; font-size: 11px; line-height: 1.5; color: #58625e; }
.cs-video-slider.is-ready .cs-video-track { display: flex; width: 100%; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; }
.cs-video-slider.is-ready .cs-video-card { flex: 0 0 100%; min-width: 0; margin: 0; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); background: #f3f1eb; scroll-snap-align: start; scroll-snap-stop: always; align-items: center; }
.cs-video-slider.is-ready .cs-video-card .cs-video-details { padding: 34px; }
.cs-video-slider .cs-slider-controls { display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin: 0 0 18px; }
.cs-video-slider .cs-slide-status { margin-right: auto; font: 500 12px/1.5 system-ui, sans-serif; letter-spacing: .06em; color: #58625e; }
.cs-video-slider button { cursor: pointer; border-radius: 2px; box-shadow: none; font: 600 14px/1.4 system-ui, sans-serif; text-transform: none; letter-spacing: 0; }
.cs-video-slider .cs-slider-controls button { width: 46px; height: 44px; border: 1px solid #82928b; color: var(--cs-slider-ink); background: transparent; font-size: 22px; padding: 0; }
.cs-video-slider .cs-slider-controls button:hover:not(:disabled) { background: #233435; color: #fff; }
.cs-video-slider .cs-slider-controls button:disabled { opacity: .35; cursor: default; }
.cs-video-slider .cs-play-video { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%, -50%); white-space: nowrap; min-height: 50px; padding: 13px 22px; border: 1px solid #fff; color: #fff; background: #182b28ed; }
.cs-video-slider .cs-play-video:hover { background: #0f1f1d; }
.cs-video-slider .cs-close-video { display: block; margin-top: 18px; color: #233435; background: transparent; border: 1px solid #82928b; min-height: 40px; padding: 8px 14px; }
.cs-video-slider :is(button, a, .cs-video-track):focus-visible { outline: 3px solid #a6402e; outline-offset: 4px; }
.cs-video-slider .cs-play-video:focus-visible { outline-color: #fff; }
@media (max-width: 781px) {
  .cs-video-slider.is-ready .cs-video-card { grid-template-columns: minmax(0, 1fr); align-content: start; }
  .cs-video-slider.is-ready .cs-video-card .cs-video-details { padding: 25px 22px; }
}
@media print {
  .cs-video-slider.is-ready .cs-video-track { display: block; overflow: visible; }
  .cs-video-slider.is-ready .cs-video-card { display: block; margin-bottom: 25px; break-inside: avoid; }
  .cs-video-slider .cs-slider-controls, .cs-video-slider button, .cs-video-slider iframe { display: none !important; }
}
