.tamc-vertical-doctors, .tamc-vertical-doctors * { box-sizing: border-box; }
.tamc-vertical-doctors { width: 100%; max-width: 350px; margin-inline: auto; padding: 30px 40px; background: linear-gradient(#131313, #1872cd); border-radius: 20px; color: #fff; }
.tamc-vertical-doctors h2 { color: #fff; font-size: 38px; font-weight: 700; line-height: 38px; text-align: center; margin: 0 0 30px; }
.tamc-vertical-doctors__list { display: grid; gap: 20px; max-height: calc(var(--doctor-count, 4) * 350px); overflow: auto; scroll-snap-type: y proximity; scrollbar-width: thin; scrollbar-color: #76b8f8 transparent; }
.tamc-vertical-doctors__card { position: relative; display: block; height: auto; aspect-ratio: 1 / 1.2; min-height: 300px; overflow: hidden; border: 3px solid #40474e; border-radius: 20px; scroll-snap-align: start; }
.tamc-vertical-doctors__card img { display: block; width: 100%; height: 100%; object-fit: cover; opacity: .8; }
.tamc-vertical-doctors__card:is(:hover, :focus-visible) img { opacity: 1; }
.tamc-vertical-doctors__info { position: absolute; inset-inline: 0; bottom: 0; padding: 18px 12px; color: #fff; text-align: center; background: linear-gradient(#0008, #000e); border-top: 3px solid #40474e; }
.tamc-vertical-doctors__info strong { display: block; font-size: 20px; line-height: 1.2; }
.tamc-vertical-doctors__info > span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; line-height: 1.2; margin-top: 8px; }
.tamc-vertical-doctors__info .tamc-vertical-doctors__categories { color: #3580cb; font-size: 16px; font-weight: 600; }
.tamc-vertical-doctors__more { display: block; margin-top: 20px; padding: 12px; text-align: center; background: #fff; color: #3580cb; border-radius: 3px; text-decoration: none; }
.tamc-vertical-doctors__more:is(:hover, :focus-visible) { background: #e8f0f7; color: #001b4d; }
.tamc-vertical-doctors :focus-visible { outline: 3px solid #76b8f8; outline-offset: -3px; }
@media(max-width: 800px) { .tamc-vertical-doctors { max-width: 100%; padding: 20px; } .tamc-vertical-doctors__list { display: flex; scroll-snap-type: x mandatory; } .tamc-vertical-doctors__card { flex: 0 0 min(300px, 90%); } }

/* Fixed viewport like the original vertical carousel, without scrollbars. */
.tamc-vertical-doctors__list {
    --visible-doctors: var(--doctor-count, 4);
    display: flex; flex-direction: column; height: 1400px; max-height: none;
    overflow-x: hidden; overflow-y: auto; scrollbar-width: none;
    scroll-snap-type: y mandatory; overscroll-behavior: contain;
}
.tamc-vertical-doctors__list::-webkit-scrollbar { display: none; }
.tamc-vertical-doctors__card {
    flex: 0 0 calc((100% - (var(--visible-doctors) - 1) * 20px) / var(--visible-doctors));
    width: 100%; min-width: 0; min-height: 0; aspect-ratio: auto;
}
.tamc-vertical-doctors__info { padding: 20px 12.5px; background: linear-gradient(#0004, #000d); backdrop-filter: blur(15px); }
.tamc-vertical-doctors__info strong { font: 600 20px/22px var(--tamc-font-text); }
.tamc-vertical-doctors__info > span { font: 500 15px/16px var(--tamc-font-text); }
.tamc-vertical-doctors__info .tamc-vertical-doctors__categories { font-size: 16px; font-weight: 600; }
@media (min-width: 600px) and (max-width: 999px) { .tamc-vertical-doctors__list { --visible-doctors: 3; } }
@media (min-width: 600px) and (max-width: 799px) { .tamc-vertical-doctors__list { --visible-doctors: 2; height: 800px; } }
@media (min-width: 600px) and (max-width: 768px) { .tamc-vertical-doctors__list { height: 650px; } }
@media (max-width: 599px) {
    .tamc-vertical-doctors__list { --visible-doctors: 1; flex-direction: row; height: 360px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; }
    .tamc-vertical-doctors__card { flex-basis: 100%; height: 100%; }
}