.doctor-videos { padding: 70px 0; }
.doctor-videos__heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.doctor-videos__heading h2 { margin-bottom: 12px; }
.doctor-videos__heading p { margin-bottom: 0; }
.doctor-videos__controls { display: flex; gap: 10px; flex-shrink: 0; }
.doctor-videos__controls[hidden] { display: none; }
.doctor-videos__arrow { width: 46px; height: 46px; border: 1px solid var(--theme-color); border-radius: 50%; background: var(--white-color); color: var(--theme-color); font-size: 24px; }
.doctor-videos__arrow:hover:not(:disabled) { background: var(--theme-color); color: var(--white-color); }
.doctor-videos__arrow:disabled { opacity: .35; cursor: default; }
.doctor-videos__track { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.doctor-videos--carousel .doctor-videos__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding-bottom: 16px; }
.doctor-videos--carousel .doctor-video { flex: 0 0 calc((100% - 48px) / 3); scroll-snap-align: start; }
.doctor-video { min-width: 0; border: 1px solid var(--th-border-color); border-radius: 12px; overflow: hidden; background: var(--white-color); }
.doctor-video__media { aspect-ratio: 16 / 9; position: relative; background: var(--title-color); }
.doctor-video__media iframe { width: 100%; height: 100%; border: 0; position: absolute; inset: 0; }
.doctor-video__body { padding: 20px; }
.doctor-video__body h3 { font-size: 19px; line-height: 1.4; margin: 0 0 12px; }
.doctor-video__body a, .doctor-videos__channel { color: var(--theme-color); text-decoration: underline; text-underline-offset: 3px; }
.doctor-videos__channel { display: inline-block; margin-top: 24px; }
.doctor-videos :is(button, a, [tabindex]):focus-visible { outline: 3px solid var(--title-color); outline-offset: 4px; }
@media (max-width: 991px) {
 .doctor-videos__track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .doctor-videos--carousel .doctor-video { flex-basis: calc((100% - 24px) / 2); }
}
@media (max-width: 575px) {
 .doctor-videos { padding: 48px 0; }
 .doctor-videos__heading { flex-wrap: wrap; gap: 16px; }
 .doctor-videos__track { grid-template-columns: minmax(0, 1fr); }
 .doctor-videos--carousel .doctor-video { flex-basis: 100%; }
}
