/* Start:/local/templates/primedoc/components/bitrix/news/doctors/style.css?17901638403196*/
/* Раздел «Специалисты»: шапка и отступы страницы
--------------------------------------------------------------------------- */
/* Строка результата и сортировка над сеткой
--------------------------------------------------------------------------- */
/* ВРЕМЕННО скрыта: строка «Найдено N» и сортировка не показываются.
   Разметка и сама сортировка в шаблоне рабочие — вернуть можно заменой
   display: none на flex. */
.doctors-toolbar {
    display: none;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 1.25rem;
}

.doctors-toolbar__count {
    font-size: var(--fs-base);
    color: var(--color-muted);
}

.doctors-toolbar__sort {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.doctors-toolbar__sort-label {
    font-size: var(--fs-sm);
    color: var(--color-muted);
}

.doctors-toolbar__sort-item {
    padding: .5rem 1rem;
    border: 1px solid var(--color-line);
    border-radius: 20px;
    font-size: var(--fs-sm);
    color: var(--color-text);
    transition: border-color var(--transition), color var(--transition);
}
.doctors-toolbar__sort-item:hover { border-color: var(--color-accent); color: var(--color-dark); }

.doctors-toolbar__sort-item--active,
.doctors-toolbar__sort-item--active:hover {
    background: var(--color-dark);
    border-color: var(--color-dark);
    color: var(--white);
    font-weight: 500;
}

/* Перелинковка по специализациям
--------------------------------------------------------------------------- */
.doctors-specialities { padding: 0 0 4.5rem; }

.doctors-specialities__title {
    font-size: var(--fs-h3);
    font-weight: 600;
    color: var(--color-dark);
    margin: 0 0 1.25rem;
}

.doctors-specialities__list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.doctors-specialities__item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: .625rem 1.25rem;
    border: 1px solid var(--color-line);
    border-radius: 20px;
    font-size: var(--fs-sm);
    color: var(--color-text);
    transition: border-color var(--transition), color var(--transition);
}

/* Направления с посадочной страницей — ссылки; без страницы остаются подписями */
a.doctors-specialities__item:hover {
    border-color: var(--color-dark);
    color: var(--color-dark);
}

.doctors-specialities__count { color: var(--color-muted); }

/* Блок «не нашли специалиста» и текст раздела
--------------------------------------------------------------------------- */








.doctors-seo { padding: 0 0 5.5rem; }

.doctors-seo__inner { max-width: 900px; }

.doctors-seo__title {
    font-size: var(--fs-h3);
    font-weight: 600;
    color: var(--color-dark);
    margin: 0 0 .875rem;
}

.doctors-seo__text {
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.65;
    color: var(--color-text);
}

/* End */


/* Start:/local/templates/primedoc/components/bitrix/breadcrumb/breadcrumbs/style.css?1790163840558*/
/* Хлебные крошки
--------------------------------------------------------------------------- */
.breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 1.5rem 0 1.75rem;
    font-size: var(--fs-sm);
    color: var(--color-muted);
}

.breadcrumbs__link {
    color: var(--color-muted);
    transition: color var(--transition);
}
.breadcrumbs__link:hover { color: var(--color-accent); }

.breadcrumbs__sep { color: var(--color-line); }

.breadcrumbs__item--current { color: var(--color-dark); }

/* End */


/* Start:/local/templates/primedoc/components/bitrix/news/doctors/bitrix/news.detail/.default/style.css?179016384035705*/
/* ==========================================================================
   Детальная врача (news.detail / doctors). Перенос вёрстки vrach.html 1:1.
   Автономные стили компонента. Дизайн-токены (--fs-*, --color-*) — из template_styles.css.
   Размеры шрифтов / padding / margin — в rem (1rem = 16px).
   ========================================================================== */

/* Локальные токены раздела: оттенка заливки плашек в общих переменных нет,
   радиус карточек — 20px, как в макете и на карточках списка врачей. */
.dr {
    --dr-tint: #edf5f7;
    --dr-card: 1.25rem;
    --dr-green: #2ccaa4;
}

/* Пометка захардкоженных блоков (поля ещё не созданы в инфоблоке) */
.is-hc { outline: 2px dashed red; outline-offset: -2px; }

/* Первый экран
-----------------------------------------------------------------  */
.dr-hero {
    padding: 2.5rem 0 3rem;
}

.dr-hero__grid {
    display: grid;
    grid-template-columns: 34.375rem minmax(0, 1fr);
    gap: 3.5rem;
    align-items: start;
}

@media (max-width: 1100px) {
    .dr-hero__grid { grid-template-columns: 1fr; gap: 2rem; }
}

.dr-hero__photo {
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--bg-light);
}

.dr-hero__photo img {
    display: block;
    width: 100%;
    height: auto;
}

.dr-hero__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.875rem;
}

.dr-hero__eyebrow {
    font-size: var(--fs-sm);
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent-dark);
}

.dr-hero__name {
    margin: 0 0 1rem;
    font-size: var(--fs-h1);
    font-weight: 600;
    line-height: 1.15;
    color: var(--color-dark);
}

.dr-hero__specs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 0 0 1rem;
    padding: 0;
    list-style: none;
}

.dr-hero__spec {
    padding: 0.5rem 1rem;
    border-radius: 1.25rem;
    background: var(--bg-light);
    font-size: var(--fs-sm);
    font-weight: 500;
    color: var(--color-dark);
}

.dr-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    font-size: var(--fs-sm);
    margin-bottom: 1.5rem;
}

.dr-hero__metaitem {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.dr-hero__metaitem img {
    width: 1rem;
    height: 1rem;
}

/* Оффер из карточки врача (CTA1) */
.dr-offer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    width: 100%;
    margin: 0 0 2rem;
    padding: 2rem 1.75rem;
    border-radius: var(--radius);
    background: var(--bg-light);
}

.dr-offer__badge {
    padding: 0.4375rem 0.875rem;
    border-radius: 1.25rem;
    background: var(--white);
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-accent-dark);
}

.dr-offer__title {
    font-size: 1.375rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-dark);
}

.dr-offer__text {
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--color-text);
}

.dr-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.875rem;
}

/* Кнопки внутри плашки оффера: «Позвонить» — белой заливкой, обводка на тонированном
   фоне читалась хуже (как бейдж плашки) */
.dr-offer .dr-hero__actions {
    margin-top: 0.5rem;
}

.dr-offer .dr-hero__actions .btn--outline {
    border-color: var(--white);
    background: var(--white);
    color: var(--color-dark);
}

.dr-offer .dr-hero__actions .btn--outline:hover {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--white);
}

@media (max-width: 560px) {
    .dr-hero__actions { flex-direction: column; }
    .dr-hero__actions .btn { width: 100%; }
}

/* Раскладка карточки: липкое меню слева, блоки справа
-----------------------------------------------------------------  */
.dr-layout {
    padding-top: 2rem;
    /* Колонка — grid, и margin последней секции внутри неё наружу НЕ выходит
       (схлопывания полей в grid нет). Поэтому отступ до блоков во всю ширину
       (призыв) задаём самой колонке, а у последней секции внутри снимаем. */
    margin-bottom: 4rem;
}

.dr-layout__body > .dr-section:last-child {
    margin-bottom: 0;
}

.dr-layout__grid {
    display: grid;
    grid-template-columns: 17.5rem minmax(0, 1fr);
    gap: 2.75rem;
    align-items: start;
}

.dr-layout__body {
    min-width: 0;
}

/* Секции внутри колонки открывают свой .container — гасим его боковые отступы
   и ограничение ширины: их теперь задаёт сама колонка. */
.dr-layout__body .container {
    width: 100%;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

/* Светлая секция внутри колонки — панель со скруглением (во всю ширину экрана
   она бы конфликтовала с меню) */
.dr-layout__body .dr-section--alt {
    padding: 2.5rem 2.25rem;
    border-radius: 1.75rem;
}

.dr-side {
    position: sticky;
    top: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    /* Без этого колонка растягивается по длине ленты меню (у grid-элемента
       min-width: auto), и вся страница уезжает шире экрана */
    min-width: 0;
}

.dr-side__card {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem;
    border: 1px solid var(--color-line);
    border-radius: 1.25rem;
    background: var(--white);
}

.dr-side__photo {
    flex-shrink: 0;
    width: 2.875rem;
    height: 2.875rem;
    border-radius: 0.75rem;
    object-fit: cover;
    object-position: center top;
    background: var(--bg-light);
}

.dr-side__name {
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--color-dark);
}

.dr-side__specs {
    margin-top: 0.125rem;
    font-size: 0.75rem;
    line-height: 1.3;
    color: var(--color-muted);
}

.dr-side__nav {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding: 0.625rem;
    border: 1px solid var(--color-line);
    border-radius: 1.25rem;
    background: var(--white);
}

.dr-nav__item {
    padding: 0.6875rem 1rem;
    border-radius: 0.875rem;
    font-size: 0.875rem;
    color: var(--color-text);
    transition: color var(--transition), background var(--transition);
}

.dr-nav__item:hover {
    background: var(--bg-light);
    color: var(--color-dark);
}

.dr-nav__item.is-active {
    background: var(--color-dark);
    color: var(--white);
    font-weight: 500;
}

.dr-side__actions {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.dr-side__btn {
    justify-content: center;
    width: 100%;
    min-height: 3.25rem;
}

/* Узкий экран: колонка не нужна — меню снова лента над блоками,
   карточка врача и кнопки не дублируются (они есть в первом экране) */
@media (max-width: 1100px) {
    .dr-layout__grid { grid-template-columns: 1fr; gap: 1rem; }

    .dr-side {
        position: static;
        gap: 0;
    }

    .dr-side__card,
    .dr-side__actions { display: none; }

    .dr-side__nav {
        flex-direction: row;
        gap: 0.625rem;
        padding: 0 0 1.25rem;
        border: none;
        border-bottom: 1px solid var(--color-line);
        border-radius: 0;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .dr-side__nav::-webkit-scrollbar { display: none; }

    .dr-nav__item {
        flex-shrink: 0;
        border: 1px solid var(--color-line);
        border-radius: 1.25rem;
        font-size: 0.8125rem;
        white-space: nowrap;
    }

    .dr-nav__item.is-active { border-color: var(--color-dark); }

    .dr-layout__body .dr-section--alt {
        padding: 2rem 1.5rem;
    }
}

/* Секции
-----------------------------------------------------------------  */
/* Расстояние между блоками задаёт ВНЕШНИЙ отступ, а не padding: у секции с фоном
   padding уходит внутрь заливки, и визуально расстояние между блоками пропадает —
   ритм получался разным у секций с фоном и без него. Поэтому здесь только margin,
   а padding остаётся внутренним отступом панели (ниже, у .dr-section--alt). */
.dr-section {
    margin-bottom: 4rem;
}

/* Светлая секция с подсветкой. Такой фон даём ТОЛЬКО блокам-сеткам: у секций
   со слайдером (#priem, #notes, #video) карточки намеренно уходят за правый край,
   и overflow: hidden их обрезал бы. */
.dr-section--alt {
    position: relative;
    overflow: hidden;
    padding: 3rem 0;
    background: var(--bg-light);
}

.dr-section--alt::before,
.dr-section--alt::after {
    content: "";
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    pointer-events: none;
}

.dr-section--alt::before {
    right: -13.75rem;
    top: -21.25rem;
    width: 58.75rem;
    height: 58.75rem;
    background: rgba(44, 202, 164, 0.10);
}

.dr-section--alt::after {
    left: -16.25rem;
    bottom: -22.5rem;
    width: 51.25rem;
    height: 51.25rem;
    background: rgba(104, 185, 241, 0.10);
}

/* Содержимое — поверх кругов. Одного position: relative мало: ::after идёт в потоке
   ПОСЛЕ контента и при равном z-index перекрывает его — поэтому z-index задаём явно. */
.dr-section--alt > .container {
    position: relative;
    z-index: 1;
}

/* Плашки того же оттенка внутри светлой секции сливаются с фоном — делаем их белыми */
.dr-section--alt .dr-tile,
.dr-section--alt .dr-edu__group,
.dr-section--alt .dr-faq__item,
.dr-section--alt .dr-faq__item.is-open {
    background: var(--white);
}

.dr-head {
    margin: 0 0 2rem;
    max-width: 45rem;
}

/* Шапка блока со слайдером: заголовок слева, стрелки ленты справа */
.dr-head-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    margin: 0 0 2rem;
}

.dr-head-row .dr-head {
    margin: 0;
}

.dr-slider-nav {
    display: flex;
    flex-shrink: 0;
    gap: 0.75rem;
}

.dr-slider-nav button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid var(--color-line);
    border-radius: 50%;
    background: var(--white);
    font-size: 1.375rem;
    line-height: 1;
    color: var(--color-dark);
    cursor: pointer;
    transition: background var(--transition), color var(--transition), border-color var(--transition);
}

.dr-slider-nav button:hover {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--white);
}

.dr-slider-nav button[disabled] {
    opacity: 0.4;
    cursor: default;
}

.dr-slider-nav button[disabled]:hover {
    border-color: var(--color-line);
    background: var(--white);
    color: var(--color-dark);
}

@media (max-width: 640px) {
    /* На телефоне стрелки остаются — без них не видно, что блок листается, — но уходят
       отдельной строкой под заголовок: в одной строке с длинным заголовком они его сжимали. */
    .dr-head-row { flex-wrap: wrap; }
    .dr-head-row .dr-head { flex: 1 1 100%; }
    .dr-head-row .dr-slider-nav { width: 100%; }
}

.dr-head--row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2.5rem;
    max-width: none;
}

.dr-head__eyebrow {
    display: block;
    margin-bottom: 0.625rem;
    font-size: var(--fs-sm);
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent-dark);
}

.dr-head__title {
    margin: 0;
    font-size: var(--fs-h2);
    font-weight: 600;
    line-height: 1.15;
    color: var(--color-dark);
}

.dr-head__lead {
    margin: 0.75rem 0 0;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--color-text);
}

@media (max-width: 760px) {
    .dr-head--row { flex-direction: column; align-items: flex-start; gap: 1.25rem; }
}



/* Преимущества приёма — сетка светлых карточек
-----------------------------------------------------------------  */
.dr-tiles {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
}

/* Рядом с боковым меню колонка уже — по четыре плитки в ряд текст превращается
   в лапшу из переносов, поэтому внутри колонки их две */
.dr-layout__body .dr-tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* После инициализации слайдера сетка не нужна: лента раскладывает плитки сама,
   а align-self тянет их до одной высоты */
.dr-tiles.tns-slider,
.dr-layout__body .dr-tiles.tns-slider {
    display: flex;
    align-items: stretch;
    grid-template-columns: none;
    /* Зазор задаёт плагин (gutter): css-gap он в расчёт ширины не берёт, и слайды не влезают */
    gap: 0;
}

.dr-tiles.tns-slider .dr-tile__wrapper {
    align-self: stretch;
}

@media (max-width: 1200px) {
    .dr-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    /* Правило .dr-layout__body .dr-tiles выше «сильнее» по специфичности,
       поэтому на телефоне гасим его явно — иначе останутся две узкие колонки */
    .dr-tiles,
    .dr-layout__body .dr-tiles { grid-template-columns: 1fr; }
}

.dr-tile {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    height: 100%;
    padding: 1.75rem 1.625rem 2rem;
    border-radius: var(--dr-card);
    background: var(--bg-light);
}

.dr-tile__title {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-dark);
}

.dr-tile__text {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.55;
    color: var(--color-dark-grey);
}



/* Про приём
-----------------------------------------------------------------  */
/* Лента слайдера: flex + stretch тянут карточки до высоты самой длинной.
   Зазор задаёт сам плагин (опция gutter) — css-gap он в расчёт ширины не берёт. */
.dr-priem__steps.tns-slider {
    display: flex;
    align-items: stretch;
}

/* Шаг приёма — светлая карточка с номером */
.dr-step {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    height: 100%;
    padding: 1.75rem 2rem;
    border: 1px solid var(--color-line);
    border-radius: var(--radius);
    background: var(--white);
}

.dr-step__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    background: var(--bg-light);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--color-accent-dark);
}

.dr-step__title {
    font-size: 1.3125rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-dark);
}

.dr-step__text {
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--color-muted);
}

.dr-priem__actions {
    margin-top: 2rem;
}





/* FAQ — аккордеон
-----------------------------------------------------------------  */
.dr-faq {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    max-width: 56.25rem;
}

.dr-faq__item {
    border: 1px solid var(--color-line);
    border-radius: var(--dr-card);
}

.dr-faq__item.is-open {
    border-color: transparent;
    background: var(--bg-light);
}

.dr-faq__q {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 1.625rem 2rem;
    background: none;
    border: none;
    cursor: pointer; font-family: inherit;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-dark);
    text-align: left;
}
.dr-faq__icon {
    position: relative;
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
}

.dr-faq__icon::before, .dr-faq__icon::after {
    content: ""; position: absolute;
    top: 50%;
    left: 50%;
    width: 16px; height: 3px;
    background: var(--color-accent);
    transform: translate(-50%, -50%);
    transition: transform var(--transition), opacity var(--transition);
}

.dr-faq__icon::after {
    transform: translate(-50%, -50%)
    rotate(90deg);
}

.dr-faq__item.is-open .dr-faq__icon::after {
    opacity: 0;
}

.dr-faq__a {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.dr-faq__a-inner {
    margin: 0;
    padding: 0 2rem 1.625rem;
    max-width: 90%;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--color-text);
}

/* Прайс — аккордеон по категориям верхнего уровня, оформлен как аккордеон вопросов */
.dr-price__group {
    border: 1px solid var(--color-line);
    border-radius: var(--dr-card);
    overflow: hidden;
    background: var(--white);
}

.dr-price__group.is-open {
    border-color: transparent;
}

.dr-price__group:not(:last-child) {
    margin-bottom: 0.875rem;
}

.dr-price__head {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 1.5rem 2rem;
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
}

.dr-price__cat {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-dark);
    line-height: 1.3;
}

.dr-price__icon {
    position: relative;
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
}

.dr-price__icon::before, .dr-price__icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 3px;
    background: var(--color-dark);
    transform: translate(-50%, -50%);
    transition: transform var(--transition), opacity var(--transition);
}

.dr-price__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.dr-price__group.is-open .dr-price__icon::after { opacity: 0; }
.dr-price__body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.dr-price__body-inner {
    padding: 0 2rem 1.5rem;
}

.dr-price__subcat {
    margin: 1.25rem 0 0.5rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--color-dark-grey);
}

.dr-price__body-inner > .dr-price__subcat:first-child { margin-top: 0; }

.dr-price__list { list-style: none; margin: 0; padding: 0; }
.dr-price__item {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.5rem 0;
    border-top: 1px dashed var(--color-dark-grey);
}

.dr-price__item:first-child { border-top: none; }
.dr-price__name { font-size: 0.9375rem; line-height: 1.4; color: var(--color-dark); }
.dr-price__meta { display: flex; align-items: baseline; gap: 1.5rem; flex-shrink: 0; }
.dr-price__time { font-size: 0.8125rem; color: var(--color-dark-grey); white-space: nowrap; }
.dr-price__cost { font-size: 1rem; font-weight: 600; color: var(--color-dark); white-space: nowrap; }
@media (max-width: 600px) {
    .dr-price__item { flex-direction: column; gap: 0.375rem; }
    .dr-price__meta { justify-content: space-between; gap: 1rem; }
}

/* Комплекс услуг — лента слайдера (tiny-slider инициализирует её по data-dr-slider).
   Сетка ниже остаётся запасным видом: пока слайдер не поднялся или его не с чем листать,
   карточки просто стоят рядами. */
.dr-services.tns-slider {
    display: flex;
    align-items: stretch;
    gap: 0;
}

/* Слайд — обёртка (.dr-service__slide): плагин вешает на слайд свой отступ, и у карточки-слайда
   он резал бы правый край. Обёртку тянет align-self, карточка заполняет её по высоте. */
.dr-services.tns-slider .dr-service__slide {
    align-self: stretch;
}

.dr-services.tns-slider .dr-service {
    height: 100%;
}

.dr-services {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

@media (max-width: 1100px) {
    .dr-services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
    .dr-services { grid-template-columns: 1fr; }
}

.dr-service {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    padding: 1.75rem;
    border: 1px solid var(--color-line);
    border-radius: var(--dr-card);
    background: var(--white);
}

.dr-service__img-wrapper {
    aspect-ratio: 16 / 10;
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--bg-light);
    margin-bottom: 1rem;
}

.dr-service__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dr-service__body {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    flex: 1;
}

/* Верхняя строка: возраст плашкой слева, цена справа */
.dr-service__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.dr-service__age {
    padding: 0.375rem 0.875rem;
    border-radius: 1rem;
    background: var(--dr-tint);
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--color-accent-dark);
}

.dr-service__price {
    font-size: 1.375rem;
    font-weight: 600;
    color: var(--color-dark);
    white-space: nowrap;
}

.dr-service__title {
    margin: 0;
    font-size: 1.375rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--color-dark);
}

.dr-service__desc {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--color-dark-grey);
}

.dr-service__desc b { font-weight: 500; color: var(--color-dark); }

.dr-service__list {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--color-dark-grey);
}

.dr-service__list b { font-weight: 500; color: var(--color-dark); }

.dr-service__btn {
    margin-top: auto;
    justify-content: center;
    min-height: 3rem;
}

.tns-outer { position: relative; }
.tns-controls { line-height: 0; }
.tns-controls button {
    position: absolute; top: 38%; z-index: 3; width: 44px; height: 44px;
    border: 1px solid var(--color-line); border-radius: 50%; background: var(--white);
    box-shadow: var(--shadow); font-size: 1.375rem; line-height: 1; color: var(--color-dark);
    cursor: pointer; transition: background var(--transition), color var(--transition);
}
.tns-controls button:hover { background: var(--color-accent); color: var(--white); border-color: var(--color-accent); }
.tns-controls button[data-controls="prev"] { left: -18px; }
.tns-controls button[data-controls="next"] { right: -18px; }
.tns-controls button[disabled] { opacity: 0.4; cursor: default; }
@media (max-width: 1024px) {
    .tns-controls button[data-controls="prev"] { left: 4px; }
    .tns-controls button[data-controls="next"] { right: 4px; }
}

/* Призыв перед подвалом — тёмная панель: слева аргументы, справа карточка записи
-----------------------------------------------------------------  */
.dr-cta__panel {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem;
    align-items: center;
    padding: 3.5rem;
    border-radius: 1.5rem;
    background: var(--color-dark);
    overflow: hidden;
}

/* Декоративные круги фона — из макета */
.dr-cta__panel::before,
.dr-cta__panel::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.dr-cta__panel::before {
    right: -7.5rem;
    top: -8.75rem;
    width: 26.25rem;
    height: 26.25rem;
    background: rgba(44, 202, 164, 0.14);
}

.dr-cta__panel::after {
    right: 3.75rem;
    bottom: -11.25rem;
    width: 20rem;
    height: 20rem;
    background: rgba(104, 185, 241, 0.12);
}

@media (max-width: 1000px) {
    .dr-cta__panel { grid-template-columns: 1fr; gap: 2rem; padding: 2rem; }
}

.dr-cta__body {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.375rem;
}

.dr-cta__eyebrow {
    padding: 0.5rem 1rem;
    border: 1px solid rgba(44, 202, 164, 0.5);
    border-radius: 1.25rem;
    font-size: 0.8125rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--dr-green);
}

.dr-cta__title {
    margin: 0;
    font-size: 2.25rem;
    font-weight: 600;
    line-height: 1.18;
    color: var(--white);
}

.dr-cta__accent { color: var(--dr-green); }

.dr-cta__text {
    font-size: 1rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.82);
}

.dr-cta__card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 2.25rem 2.25rem 2rem;
    border-radius: var(--dr-card);
    background: var(--white);
}

.dr-cta__doctor {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.dr-cta__photo {
    width: 3.5rem;
    height: 3.5rem;
    flex-shrink: 0;
    border-radius: var(--radius);
    object-fit: cover;
    object-position: center top;
}

.dr-cta__name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-dark);
}

.dr-cta__specs {
    margin-top: 0.1875rem;
    font-size: 0.8125rem;
    color: var(--color-muted);
}

.dr-cta__contact {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.dr-cta__note {
    font-size: 0.875rem;
    color: var(--color-muted);
}

.dr-cta__phone {
    font-size: 1.875rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--color-dark);
}

.dr-cta__btn {
    justify-content: center;
    min-height: 3.5rem;
}

.dr-cta__tg {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--color-line);
    font-size: 0.9375rem;
    color: var(--color-text);
}

.dr-cta__tg-icon {
    width: 2.5rem;
    height: 2.5rem;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--dr-tint) url("/local/templates/primedoc/img/icons/telegram.png") center / 1.125rem no-repeat;
}


/* Опыт работы — фото слева, места работы строками
-----------------------------------------------------------------  */
.dr-exp-layout {
    display: grid;
    grid-template-columns: 28.75rem minmax(0, 1fr);
    gap: 3.5rem;
    align-items: start;
}

@media (max-width: 1000px) {
    .dr-exp-layout { grid-template-columns: 1fr; gap: 2rem; }
}

.dr-exp-media {
    height: 26.25rem;
    border-radius: 1.5rem;
    overflow: hidden;
    background: var(--color-dark);
}

.dr-exp-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.dr-exp__item {
    display: grid;
    grid-template-columns: 1.4fr 1.2fr 8.125rem;
    gap: 1.5rem;
    align-items: center;
    padding: 1.25rem 0;
    border-top: 1px solid var(--color-line);
}

@media (max-width: 560px) {
    .dr-exp__item { grid-template-columns: 1fr auto; gap: 0.25rem 1rem; }
    .dr-exp__role { grid-column: 1 / -1; }
}

.dr-exp__place {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--color-dark);
}

.dr-exp__role {
    font-size: 0.9375rem;
    color: var(--color-dark-grey);
}

.dr-exp__year {
    font-size: 0.9375rem;
    color: var(--color-muted);
    text-align: right;
}


/* Отзывы — партиал parts/doctors/reviews.php, стили .dr-reviews* в styles.css шаблона сайта */

/* Образование — карточки по вузам
-----------------------------------------------------------------  */
.dr-edu {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    align-items: start;
}

/* После инициализации слайдера сетка не нужна; align-self тянет карточки до одной высоты */
.dr-edu.tns-slider {
    display: flex;
    align-items: stretch;
    grid-template-columns: none;
    gap: 0;
}

/* Слайд — обёртка (.dr-edu__slide), карточка заполняет её по высоте */
.dr-edu.tns-slider .dr-edu__slide {
    align-self: stretch;
}

.dr-edu.tns-slider .dr-edu__group {
    height: 100%;
}

@media (max-width: 1100px) {
    .dr-edu { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
}

.dr-edu__group {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.875rem 1.875rem 2.125rem;
    border: 1px solid var(--color-line);
    border-radius: var(--dr-card);
}

.dr-edu__uni {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    font-size: 1.1875rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-dark);
}

.dr-edu__icon {
    width: 2.625rem;
    height: 2.625rem;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--dr-tint) url("/local/templates/primedoc/components/bitrix/news/doctors/bitrix/news.detail/.default/img/icons/education.png") center / 1.25rem no-repeat;
}

.dr-edu__items {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.dr-edu__item {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-top: 0.875rem;
    border-top: 1px solid var(--color-line);
}

.dr-edu__row {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.dr-edu__year {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-dark);
}

.dr-edu__type {
    padding: 0.25rem 0.75rem;
    border-radius: 0.875rem;
    background: var(--bg-light);
    font-size: 0.75rem;
    color: var(--color-dark-grey);
}

.dr-edu__spec {
    font-size: 0.9375rem;
    color: var(--color-text);
}


/* Галерея видео */
.dr-videos.tns-slider { display: flex; align-items: stretch; gap: 0; }
.dr-videos.tns-slider .dr-video__slide { align-self: stretch; }
.dr-videos.tns-slider .dr-video { height: 100%; }
.dr-video-dialog { width: 90vw; max-width: 900px; }
.dr-video-dialog iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; }
.dr-video { display: flex; flex-direction: column; gap: 16px; padding: 0; background: none; border: none; text-align: left; color: inherit; font-family: inherit; cursor: pointer; text-decoration: none; }

.dr-video__title {
    font-size: var(--fs-card);
    font-weight: 600;
    color: var(--color-dark);
    line-height: 1.3;
    margin-top: 1rem;
}

.dr-video__thumb { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden; background: var(--bg-light); }
.dr-video__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.dr-video:hover .dr-video__thumb img { transform: scale(1.04); }
.dr-video__play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: rgba(255, 255, 255, 0.9); transition: background var(--transition); }
.dr-video:hover .dr-video__play { background: var(--white); }
.dr-video__play img { width: 20px; height: 20px; margin-left: 0.1875rem; }

/* Стили блока «Полезные статьи» — в шаблоне компонента news.list/articles/style.css */



/* Услуги: карточка помощи, прайс, похожие врачи, текст раздела
-----------------------------------------------------------------  */
/* «Не знаете, какой чек-ап нужен» — стоит сразу под лентой чек-апов */
.dr-price-block {
    margin-top: 3rem;
    position: relative;
    z-index: 10;
}

.dr-price-block__title {
    margin: 0 0 0.5rem;
    font-size: 1.625rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--color-dark);
}

.dr-price-block__lead {
    margin: 0 0 1.25rem;
    font-size: var(--fs-sm);
    color: var(--color-muted);
}

.dr-price-block .dr-price {
    max-width: 56.25rem;
}

/* Похожие специалисты: сетку рисует шаблон news.list/doctors, здесь только отступы */
.dr-similar .doctors-list {
    padding: 0;
}

/* Кнопка под аккордеоном вопросов */
.dr-faq__actions {
    margin-top: 1.75rem;
}



/* Документы — превью скана с кнопкой «Открыть»
-----------------------------------------------------------------  */
.dr-docs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
}

@media (max-width: 1100px) {
    .dr-docs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .dr-docs { grid-template-columns: 1fr; }
}

.dr-doc {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.dr-doc__media {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 18rem;
    padding: 1.25rem;
    border: 1px solid var(--color-line);
    border-radius: var(--radius);
    background: var(--bg-light);
    overflow: hidden;
}

.dr-doc__media img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.dr-doc__btn {
    position: absolute;
    right: 0.875rem;
    bottom: 0.875rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5625rem 1rem;
    border-radius: 1.25rem;
    background: var(--white);
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-accent-dark);
    transition: background var(--transition), color var(--transition);
}

.dr-doc__btn:hover {
    background: var(--color-accent);
    color: var(--white);
}



.dr-doc__caption {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--color-text);
}

/* Шапка блока похожих: ссылка на раздел и стрелки ленты рядом */
.dr-head__actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

/* Места приёма — компонент news.list/doctor_clinics, стили в его шаблоне */

/* End */


/* Start:/local/templates/primedoc/components/bitrix/news.list/doctor_cases/style.css?17901638404638*/
/* ==========================================================================
   Блок «Заметки с приёма» на детальной врача (news.list / doctor_cases).
   Рамка секции, шапка и стрелки — от шаблона карточки (dr-section, dr-head,
   dr-slider-nav), здесь только чипы-фильтр и карточки случаев.
   Дизайн-токены (--color-*, --dr-green, --transition) — из template_styles.css
   и стилей карточки врача.
   ========================================================================== */
.dr-notes__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    margin-bottom: 1.625rem;
}

.dr-notes__chip {
    padding: 0.5625rem 1.125rem;
    border: 1px solid var(--color-line);
    border-radius: 1.25rem;
    background: none;
    font-family: inherit;
    font-size: 0.8125rem;
    color: var(--color-text);
    cursor: pointer;
    transition: border-color var(--transition), color var(--transition), background var(--transition);
}

.dr-notes__chip:hover {
    border-color: var(--color-dark);
    color: var(--color-dark);
}

.dr-notes__chip.is-active {
    background: var(--color-dark);
    border-color: var(--color-dark);
    color: var(--white);
    font-weight: 500;
}

/* Без слайдера (js не сработал) остаётся сеткой; с плагином — лента,
   flex + stretch тянут карточки до высоты самой длинной, зазор задаёт gutter. */
.dr-notes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    align-items: start;
}

@media (max-width: 900px) {
    .dr-notes { grid-template-columns: 1fr; }
}

/* Слайдом служит обёртка: плагин своим селектором делает слайды inline-block,
   и у самой карточки слетел бы display: flex вместе с внутренними отступами. */
.dr-notes.tns-slider {
    display: flex;
    align-items: stretch;
    gap: 0;
}

/* Обёртке высоту НЕ задаём: явная height у флекс-элемента отключает stretch,
   и слайды перестают выравниваться. Тянется обёртка, карточка заполняет её. */
.dr-notes.tns-slider .dr-note {
    height: 100%;
}

/* Декоративный круг внутри карточки — цвет чередуется, чтобы лента не выглядела однообразно */
.dr-note::before {
    content: "";
    position: absolute;
    right: -4.375rem;
    top: -5.625rem;
    width: 16.25rem;
    height: 16.25rem;
    border-radius: 50%;
    background: rgba(44, 202, 164, 0.12);
    pointer-events: none;
}

/* Чередуем по слайду: сама карточка внутри .dr-note__slide всегда первая и единственная,
   поэтому :nth-child на ней не сработал бы. */
.dr-note__slide:nth-child(even) .dr-note::before {
    right: -5rem;
    top: -6.25rem;
    width: 17.5rem;
    height: 17.5rem;
    background: rgba(104, 185, 241, 0.12);
}

/* Содержимое карточки — поверх круга */
.dr-note > * {
    position: relative;
    z-index: 1;
}

.dr-note {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 1.125rem;
    padding: 2rem 2.125rem 2.125rem;
    border-radius: 1.5rem;
    background: var(--bg-light);
}

.dr-note__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.dr-note__hash {
    padding: 0.4375rem 1rem;
    border-radius: 1.125rem;
    background: var(--white);
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-accent-dark);
}

.dr-note__patient {
    font-size: 0.875rem;
    color: var(--color-muted);
}

.dr-note__part {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.dr-note__label {
    font-size: 0.8125rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-muted);
}

/* Итог случая выделяем зелёной подписью — это результат лечения */
.dr-note__part--result .dr-note__label {
    color: var(--dr-green);
}

.dr-note__text {
    font-size: 0.9375rem;
    line-height: 1.55;
    color: var(--color-text);
}

.dr-note__text p { margin: 0 0 0.5rem; }
.dr-note__text p:last-child { margin-bottom: 0; }

/* End */


/* Start:/local/templates/primedoc/components/bitrix/news.list/articles_slider/style.css?17901638401901*/
/* Полезные статьи врача (news.list, выборка по автору) */
.dr-pubs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
/* Контейнер-слайдер (tiny-slider): после инициализации tns навешивает класс .tns-slider —
   сетка не нужна, flex + stretch тянут карточки до высоты самой длинной (зазор — опцией gutter) */
.dr-pubs.tns-slider {
    display: flex;
    align-items: stretch;
    grid-template-columns: none;
    gap: 0;
}
.dr-pubs.tns-slider .dr-pub__slide { align-self: stretch; }
.dr-pubs.tns-slider .dr-pub { height: 100%; }
.dr-pub {
    display: flex;
    flex-direction: column;
    color: inherit;
    position: relative;
}

.dr-pub__link {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

.dr-pub__img { position: relative; display: block; aspect-ratio: 4 / 3; margin-bottom: 1.125rem; border-radius: var(--radius); overflow: hidden; background: var(--bg-light); }
.dr-pub__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.dr-pub:hover .dr-pub__img img { transform: scale(1.04); }
.dr-pub__label { position: absolute; left: 14px; bottom: 14px; padding: 0.375rem 0.75rem; border-radius: 999px; background: rgba(50, 51, 77, 0.85); color: var(--white); font-size: 0.75rem; }
.dr-pub__title { margin: 0 0 0.5rem; font-size: var(--fs-card); font-weight: 600; color: var(--color-dark); line-height: 1.3; }
.dr-pub__descr { margin: 0 0 0.625rem; font-size: var(--fs-sm); color: var(--color-text); line-height: 1.5; }
.dr-pub__date { font-size: 0.875rem; color: var(--color-muted); }

@media (max-width: 860px) { .dr-pubs { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .dr-pubs { grid-template-columns: 1fr; } }

/* End */


/* Start:/local/templates/primedoc/components/bitrix/news.list/doctors/style.css?17901638408908*/
.doctors-list { padding: 0 0 3.5rem; }
.doctors-list--home { padding: 5.5rem 0 0; }

/* --- Шапка секции --- */
.doctors-list__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 1.75rem;
}

.doctors-list__heading {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.doctors-list__eyebrow {
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent-dark);
}

.doctors-list__title {
    margin: 0;
    font-size: clamp(1.75rem, 1.5vw + 1.1rem, 2.375rem);
    font-weight: 600;
    line-height: 1.15;
    color: var(--color-dark);
}

.doctors-list__all {
    flex-shrink: 0;
    padding: 0.9375rem 1.75rem;
    border-radius: 30px;
    font-size: 1rem;
    white-space: nowrap;
}
.doctors-list__all:hover { background: var(--color-dark); color: var(--white); }

/* --- Чипы-фильтр --- */
.doctors-list__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 2rem;
}

.doctors-chip {
    padding: 0.625rem 1.25rem;
    border: 1px solid var(--color-line);
    border-radius: 20px;
    background: transparent;
    font-size: 0.875rem;
    line-height: 1.2;
    color: var(--color-text);
    transition: background var(--transition), color var(--transition), border-color var(--transition);
}
.doctors-chip:hover { border-color: var(--color-accent); color: var(--color-accent); }
.doctors-chip--active,
.doctors-chip--active:hover {
    border-color: var(--color-dark);
    background: var(--color-dark);
    font-weight: 500;
    color: var(--white);
}

/* --- Сетка карточек --- */
.doctors {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
}

/* Карточка — сетка из трёх строк: фото, текст, строка города и отзывов.
   Grid (в отличие от flex-колонки) пересчитывает строки, когда карточку растягивает
   внешняя раскладка, поэтому нижняя строка держится у низа и в сетке списка,
   и в ленте слайдера. */
.doctor-card {
    position: relative;
    display: grid;
    grid-template-rows: auto 1fr auto;
    height: 100%;
    gap: 16px;
    padding: 1rem 1rem 1.375rem;
    border: 1px solid var(--color-line);
    border-radius: 20px;
    background: var(--white);
    transition: box-shadow var(--transition), border-color var(--transition);
}
.doctor-card:hover {
    border-color: transparent;
    box-shadow: var(--shadow);
}
.doctor-card[hidden] { display: none; }

/* Ссылка-оверлей на всю карточку */
.doctor-card__stretch { position: absolute; inset: 0; z-index: 2; }

.doctor-card__photo {
    position: relative;
    height: 300px;
    border-radius: 14px;
    background: var(--color-dark);
    overflow: hidden;
    margin-bottom: 1rem;
}

.doctor-card__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: opacity var(--transition);
}
.doctor-card:hover .doctor-card__photo img { opacity: 0.88; }

/* Тело занимает остаток карточки — иначе строка города и отзывов «пляшет» по высоте,
   когда у одних врачей специализации в одну строку, а у других в две. */
.doctor-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 8px;
    padding: 0 0.375rem;
}

.doctor-card__name {
    margin: 0;
    font-size: var(--fs-card);
    font-weight: 600;
    line-height: 1.25;
    color: var(--color-dark);
}
.doctor-card:hover .doctor-card__name { color: var(--color-accent); }

.doctor-card__spec {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--color-dark-grey);
}

/* Прижата к низу карточки: margin-top: auto съедает свободное место над строкой */
/* Строка города и отзывов — прямой ребёнок карточки (а не внутренней обёртки):
   так margin-top: auto прижимает её к низу и в сетке, и в ленте слайдера, где
   растянутая карточка не пересчитывает раскладку вложенной обёртки. */
.doctor-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-self: end;
    gap: 14px;
    padding: 0 0.375rem;
}

.doctor-card__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.875rem;
    line-height: 1.2;
    color: var(--color-muted);
}
.doctor-card__meta-item svg { flex-shrink: 0; }

/* 4 в ряд на десктопе, 3 на узком десктопе, 2 на планшете и телефоне */
@media (max-width: 1400px) {
    .doctors { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
    .doctors { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
    .doctors-list { padding: 0 0 2.5rem; }
    .doctors-list--home { padding: 3rem 0 0; }

    /* В макете на мобильном кнопка «Все специалисты» стоит ПОД сеткой.
       display:contents растворяет шапку, и порядок блоков задаётся order. */
    .doctors-list--home > .container { display: flex; flex-direction: column; }
    .doctors-list--home .doctors-list__head { display: contents; }
    .doctors-list--home .doctors-list__heading { order: 1; margin-bottom: 1.125rem; }
    .doctors-list--home .doctors-list__chips { order: 2; }
    .doctors-list--home .doctors { order: 3; }
    .doctors-list--home .doctors-list__all { order: 4; margin-top: 1.125rem; }

    .doctors-list__all { justify-content: center; min-height: 52px; }
    .doctors-list__chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
    .doctors-list__chips::-webkit-scrollbar { display: none; }
    .doctors-chip { white-space: nowrap; }
}

@media (max-width: 640px) {
    .doctors { gap: 12px; }
    .doctor-card { gap: 12px; padding: 0.625rem 0.625rem 1rem; border-radius: 18px; }
    .doctor-card__photo { height: 150px; border-radius: 12px; }
    .doctor-card__body { gap: 6px; padding: 0 0.25rem; }
    .doctor-card__name { font-size: 1rem; }
    .doctor-card__spec { font-size: 0.875rem; }
    .doctor-card__meta { gap: 10px; }
    .doctor-card__meta-item { font-size: 0.75rem; }
}

/* Заглушка вместо портрета*/
.doctor-card__no-photo {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-light);
    color: var(--color-muted);
}

/* Лента (режим SLIDER=Y): после инициализации tiny-slider сетка не нужна,
   align-self тянет карточки до одной высоты */
.doctors.tns-slider {
    display: flex;
    align-items: stretch;
    grid-template-columns: none;
    /* Зазор задаёт плагин (gutter): css-gap он в расчёт ширины не берёт, и слайды не влезают */
    gap: 0;
}

/* Слайд — обёртка (.doctors__slide): плагин вешает на слайд свой отступ, и у карточки-слайда
   он резал бы правый край. Обёртку тянет align-self, карточка заполняет её (height: 100%
   у неё уже есть в базовом правиле). */
.doctors.tns-slider .doctors__slide {
    align-self: stretch;
}

/* В ленте фото — пропорцией, а не высотой: правило сетки для телефона (150px под две колонки)
   в ленте с одной карточкой на экран давало узкую полосу с обрезанным лицом. Пропорция 11/10 —
   как 300px на карточке списка шириной 330px, и та же, что у слайдера врачей на главной. */
.doctors.tns-slider .doctor-card__photo {
    height: auto;
    aspect-ratio: 11 / 10;
}

/* Растянутый лентой слайд не пересчитывает свои строки, поэтому текстовой части задаём
   минимальную высоту: два ряда имени + строка специализаций. Так строка города и отзывов
   стоит на одном уровне во всех карточках ленты. */
.doctors.tns-slider .doctor-card__body {
    min-height: 4.5rem;
}





/* End */
/* /local/templates/primedoc/components/bitrix/news/doctors/style.css?17901638403196 */
/* /local/templates/primedoc/components/bitrix/breadcrumb/breadcrumbs/style.css?1790163840558 */
/* /local/templates/primedoc/components/bitrix/news/doctors/bitrix/news.detail/.default/style.css?179016384035705 */
/* /local/templates/primedoc/components/bitrix/news.list/doctor_cases/style.css?17901638404638 */
/* /local/templates/primedoc/components/bitrix/news.list/articles_slider/style.css?17901638401901 */
/* /local/templates/primedoc/components/bitrix/news.list/doctors/style.css?17901638408908 */