/* Start:/local/templates/main_b2b/components/bitrix/news.list/contacts/style.css?178519162312446*/
.contacts-item__phone--item {
    text-decoration: none;
    color:#0a1a3e;
}

.path-contacts {
    font-weight: 700;
    font-size: clamp(1.875rem, 1.55rem + 1.625vw, 3.5rem);
}

[data-v-ae23ba2b]:root {
    --tablet-breakpoint: 920px
}

.contacts-map-section[data-v-ae23ba2b] {
    height: 814px;
    width: 100%;
    position: relative
}

@media screen and (max-width: 920px) {
    .contacts-map-section[data-v-ae23ba2b] {
        height:356px
    }
}

.contacts-map-section__map {
    height: 800px;
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
}

[data-v-c6e560b4]:root {
    --tablet-breakpoint: 920px
}

.contacts-list[data-v-c6e560b4] {
    gap: 28px
}

.contacts-item[data-v-c6e560b4] {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(29%,1fr));
    gap: clamp(1.25rem, 0.55rem + 3.5vw, 4.75rem);
}

@media screen and (max-width: 920px) {
    .contacts-map-section__map {
        height: 350px;
    }
    /* .contacts-item[data-v-c6e560b4] {
        gap:20px
    } */
}

@media screen and (max-width: 576px) {
    .contacts-item[data-v-c6e560b4] {
        grid-template-columns:repeat(auto-fill,minmax(100%,1fr));
        /* gap: 8px */
    }
}

.contacts-item a[data-v-c6e560b4] {
    color: #1553a3;
    text-decoration: none
}

.contacts-item__start[data-v-c6e560b4],.contacts-item__medium[data-v-c6e560b4],.contacts-item__end[data-v-c6e560b4] {
    gap: 12px
}

@media screen and (max-width: 920px) {
    .contacts-item__start[data-v-c6e560b4],.contacts-item__medium[data-v-c6e560b4],.contacts-item__end[data-v-c6e560b4] {
        gap:8px
    }
}

@media screen and (max-width: 920px) {
    .contacts-item__phone--item[data-v-c6e560b4] {
        font-size:14px
    }
}

@media screen and (max-width: 920px) {
    .contacts-item__email--item[data-v-c6e560b4] {
        font-size:12px
    }
}

.contacts-item__button[data-v-c6e560b4] span {
    text-decoration: underline;
    text-underline-offset: 4px
}

@media screen and (max-width: 920px) {
    .contacts-item__button[data-v-c6e560b4] span {
        font-size:12px
    }
}

@media screen and (max-width: 480px) {
    .contacts-item__button[data-v-c6e560b4] {
        display:none
    }
}

.contacts-item__address[data-v-c6e560b4] {
    color: #1553a3
}

@media screen and (max-width: 920px) {
    .contacts-item__address[data-v-c6e560b4] {
        font-size:12px
    }
}

.contacts-item__worktime[data-v-c6e560b4] {
    line-height: 140%
}

@media screen and (max-width: 920px) {
    .contacts-item__worktime[data-v-c6e560b4] {
        font-size:14px
    }
}

.contacts-item__name[data-v-c6e560b4] {
    padding-left: 32px;
    position: relative;
    --circle-color: #8654CC
}

@media screen and (max-width: 920px) {
    .contacts-item__name[data-v-c6e560b4] {
        font-size:14px;
        padding-left: 22px
    }
}

@media screen and (max-width: 480px) {
    .contacts-item__name[data-v-c6e560b4] {
        font-weight:600
    }
}

.contacts-item__name[data-v-c6e560b4]:before {
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    left: 0;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    content: "";
    background-color: var(--circle-color)
}

@media screen and (max-width: 920px) {
    .contacts-item__name[data-v-c6e560b4]:before {
        width:12px;
        height: 12px
    }
}

.contacts-item__name-purple[data-v-c6e560b4]:before {
    background-color: #8654cc
}

.contacts-item__name-rose[data-v-c6e560b4]:before {
    background-color: #cc54b2
}

.contacts-item__name-orange[data-v-c6e560b4]:before {
    background-color: #cc5456
}

[data-v-01b5e419]:root {
    --tablet-breakpoint: 920px
}

.contacts-page .page-container--with-padding {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.contacts-page__title[data-v-01b5e419] {
    margin-bottom: 40px
}

@media screen and (max-width: 920px) {
    .contacts-page__title[data-v-01b5e419] {
        margin-bottom:30px
    }
}

.contacts-page__columns[data-v-01b5e419] {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(29%,1fr));
    font-size: 25px;
    gap: clamp(1.25rem, 0.55rem + 3.5vw, 4.75rem);
    margin-bottom: 20px
}

@media screen and (max-width: 920px) {
    .contacts-page__columns[data-v-01b5e419] {
        font-size:18px;
        gap: 20px
    }
}

.contacts-page__data-section[data-v-01b5e419] {
    margin-bottom: 50px
}

@media screen and (max-width: 920px) {
    .contacts-page__data-section[data-v-01b5e419] {
        margin-bottom:40px
    }
}

@media (max-width: 576px) {
    .contacts-page__columns {
        display: none !important;
    }
    .contacts-page__data-section[data-v-01b5e419] {
        margin-bottom:20px
    }
}

[data-v-47f3989e]:root {
    --tablet-breakpoint: 920px
}

/* Контейнер карты */
.map-component {
    width: 100%;
    height: 100%;
}

.map {
    height: 100%;
}

/* Пины маркеров */
.map__pin {
    transition: transform 0.2s ease;
    cursor: pointer;
}

@media screen and (min-width: 921px) and (hover: hover) {
    .map__pin:not(:disabled):not(.map__pin--disabled):not(.disabled):hover,
    .map__pin:not(:disabled):not(.map__pin--disabled):not(.disabled):focus-visible {
        transform: scale(1.15);
    }
}

/* Кластеры */
.map__cluster {
    transition: transform 0.2s ease;
    width: 40px;
    height: 40px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.map__cluster span {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #fff;
    font-size: 14px;
    font-weight: 500;
}

@media screen and (min-width: 921px) and (hover: hover) {
    .map__cluster:not(:disabled):not(.map__cluster--disabled):not(.disabled):hover,
    .map__cluster:not(:disabled):not(.map__cluster--disabled):not(.disabled):focus-visible {
        transform: scale(1.15);
    }
}

@media screen and (max-width: 920px) {
    .map__pin, .map__cluster {
        width: 28px;
        height: 28px;
    }

    .map__cluster span {
        width: 19px;
        height: 19px;
        font-size: 10px;
    }
}

/* Позиционирование контролов карты */
.ymaps3x0--controls_bottom {
    bottom: 56px !important;
    right: 26px;
    padding: 0;
}

.ymaps3x0--controls_left {
    bottom: auto;
    top: 50%;
    transform: translateY(-50%);
    left: 16px;
    right: auto;
    padding: 0;
}

.ymaps3x0--zoom-control {
    background-color: #d9efff;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1px;
}

.ymaps3x0--control-button {
    padding: 13px 10px;
    border-radius: 0;
}

.ymaps3x0--zoom-control__in,
.ymaps3x0--zoom-control__out {
    width: 20px;
    height: 20px;
}

/* Попап карточка */
.map-baloon-contacts-card {
    background-color: #fff;
    border: 1px solid #E5F4FF;
    border-radius: 12px;
    max-width: 425px;
    min-width: 425px;
    width: 100%;
    padding: 24px;
    position: absolute;
}

@media screen and (max-width: 920px) {
    .map-baloon-contacts-card {
        bottom: 16px;
        left: 16px;
        max-width: 339px;
        min-width: 339px;
    }
}

@media screen and (max-width: 480px) {
    .map-baloon-contacts-card {
        max-width: 100%;
        left: 50%;
        transform: translateX(-50%);
        max-width: 310px;
        min-width: 310px;
    }
}

/* Контент попапа */
.map-baloon-contacts-card__list {
    gap: 12px;
}

@media screen and (max-width: 920px) {
    .map-baloon-contacts-card__item {
        font-size: 12px;
    }
}

.map-baloon-contacts-card__head {
    position: relative;
    padding-left: 28px;
    margin-bottom: 12px;
    padding-right: 14px;
}

.map-baloon-contacts-card__head--no-circle {
    padding-left: 0;
}

.map-baloon-contacts-card__circle {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 16px;
    height: 16px;
    border-radius: 100%;
}

@media screen and (max-width: 920px) {
    .map-baloon-contacts-card__circle {
        width: 12px;
        height: 12px;
    }
}

.map-baloon-contacts-card h3 {
    font-size: 20px;
    line-height: 138%;
    margin: 0;
}

@media screen and (max-width: 920px) {
    .map-baloon-contacts-card h3 {
        font-size: 14px;
    }
}

/* Кнопка закрытия */
.map-baloon-contacts-card__close {
    width: 56px;
    height: 56px;
    padding: 20px;
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
}

@media screen and (min-width: 921px) and (hover: hover) {
    .map-baloon-contacts-card__close:not(:disabled):not(.map-baloon-contacts-card__close--disabled):not(.disabled):hover,
    .map-baloon-contacts-card__close:not(:disabled):not(.map-baloon-contacts-card__close--disabled):not(.disabled):focus-visible {
        opacity: 0.8;
    }
}

.map-baloon-contacts-card__close:not(:disabled):not(.map-baloon-contacts-card__close--disabled):not(.disabled):active {
    opacity: 0.6;
}


/* ──────────────────────────────────────────────────────────────────────────
   Карта на всю ширину (десктоп, ≥921px) — как на /map/
   ---------------------------------------------------------------------------
   Секция карты вынесена из .page-container в template.php. Здесь обнуляем
   центрированный контейнер страницы (max-width 1320px + padding 20px), и карта
   растягивается на всю ширину контентной области — от левого «рельса»
   навигации (aside.left-plate) до правого края окна.

   • Под рельс карту НЕ уводим: он непрозрачный и лежит поверх (z-index 6).
   • Селектор :has(.contacts-page) — потомок, а не прямой ребёнок: шаблон
     компонента работает в frame-режиме, который оборачивает вывод в div.
     Два класса у контейнера — чтобы по специфичности обойти
     .page-container[data-v-23243403] из standard.css.
   • Файл грузится лишь этим шаблоном (contacts) — другие страницы не
     затрагиваются; вдобавок :has() ограничивает область действия страницей.
   • Список контактов лежит в своём .page-container внутри .contacts-page и
     сохраняет прежние рамки.
   • Если браузер не поддерживает :has() — правило игнорируется, карта
     остаётся на ширину контейнера (без поломок).
   ────────────────────────────────────────────────────────────────────────── */
@media (min-width: 921px) {
    .page-container.page-container--with-padding:has(.contacts-page) {
        max-width: none;
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
    }

    /* Заголовок «Контактная информация» лежит в том же (теперь полноширинном)
       контейнере, что и карта. Возвращаем ему обычные рамки страницы —
       повторяем ограничения .page-container (max-width 1320 + padding 20),
       чтобы тайтл был выровнен как на других страницах. */
    .support-page .section-with-description {
        max-width: 1320px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
    }

    /* Карта упирается в края экрана — скругление убираем */
    .contacts-map-section__map {
        border-radius: 0;
    }
}

/* End */
/* /local/templates/main_b2b/components/bitrix/news.list/contacts/style.css?178519162312446 */