

/* 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/unpaid/style.css?179016384013547*/
/* ==========================================================================
   Детальная врача — урезанный шаблон «unpaid» (карточка без подписки).
   Самостоятельный дубль стилей полного шаблона .default: первый экран, раскладка
   с липким меню, секции и их шапки, стрелки ленты — те же правила (источник —
   .default/style.css), плюс свои блоки: панель записи, анонс, «Это ваша карточка?».
   Дизайн-токены (--fs-*, --color-*) — из template_styles.css. Размеры — в rem.
   ========================================================================== */

/* Пометка несогласованных блоков (тексты ждут заказчика) */
.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__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;
}


/* Панель записи — вместо оффера и кнопок полной карточки: телефон и кнопка в одной плашке */
.dr-hero__panel {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    width: 100%;
    padding: 1.375rem 1.625rem;
    border-radius: var(--radius);
    background: var(--bg-light);
}

.dr-hero__panel-contact {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-right: auto;
}

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

.dr-hero__panel-phone {
    font-size: 1.625rem;
    font-weight: 600;
    line-height: 1.2;
    color: var(--color-dark);
}

.dr-hero__panel-phone:hover { color: var(--color-accent); }

@media (max-width: 560px) {
    .dr-hero__panel .btn { width: 100%; }
}

.dr-hero__note {
    margin: 0;
    font-size: var(--fs-sm);
    color: var(--color-muted);
}

/* Раскладка карточки: липкое меню слева, блоки справа
-----------------------------------------------------------------  */
.dr-layout {
    padding-top: 2rem;
    /* Отступ до призыва даёт сам общий блок .cta (padding-top), поэтому у колонки
       нижнего отступа нет, а у последней секции внутри него снимаем. */
}

.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-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-head__actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

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

/* О враче — текст анонса (PREVIEW_TEXT): ограничен по ширине, иначе строка нечитаема */
.dr-about {
    max-width: 56.25rem;
    font-size: var(--fs-base);
    line-height: 1.7;
    color: var(--color-text);
}

.dr-about p { margin: 0 0 1rem; }

/* «Это ваша карточка?» — плашка для самого врача под призывом */
.dr-own {
    padding: 3.5rem 0 4.5rem;
}

.dr-own__panel {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.75rem;
    padding: 2rem 2.25rem;
    border: 1px solid var(--color-line);
    border-radius: var(--radius);
}

.dr-own__body {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-width: 47.5rem;
    margin-right: auto;
}

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

.dr-own__text {
    margin: 0;
    font-size: var(--fs-base);
    line-height: 1.6;
    color: var(--color-text);
}

.dr-own__btn { white-space: nowrap; }

@media (max-width: 560px) {
    .dr-own__btn { width: 100%; }
}

/* 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/unpaid/style.css?179016384013547 */
