#map {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: 'PragmataProMono', Arial, Helvetica, sans-serif;
    transition: all ease-in-out 0.3s;
    /* line-height: 1.5; */
}

@media (width > 570px) {
    #map.active-panel-info {
        width: calc(100vw - 585px);
        margin-left: 570px;
    }
}

#map a {
    text-decoration: none;
    color: #333333;
}

#map .block {
    display: block !important;
}

#map .hidden {
    display: none !important;
}

#map .circle {
    cursor: pointer;
    position: relative;

    width: 40px;
    height: 40px;

    color: var(--interact-action);
    border: 2px solid rgba(255, 255, 255, 0.7);
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.7);
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
    transform: translate(-50%, -50%);
    position: absolute;
    box-sizing: border-box;
}

.circle-content {
    position: absolute;
    top: 50%;
    left: 50%;

    display: flex;
    justify-content: center;
    align-items: center;

    width: 90%;
    height: 90%;

    border-radius: 50%;
    background-color: black;

    transform: translate3d(-50%, -50%, 0);
}

.circle-text {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    color: #fff;
}

.my-marker {
    position: absolute;
    box-sizing: border-box;
    transform: translate(-50%, calc(-50% - 24px));
    cursor: pointer;
    max-width: 38px;
    height: 51px;
}

.popup {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translate(30px, 50%);
    width: 378px;
    padding: 16px 20px;
    border-radius: 0.4rem;
    background-color: #fff;
    font-size: 0.9rem;
    color: #333333;
    user-select: text !important;
    border: #c9c9c9 solid 1px;
}

@media (max-width: 1024px) {
    .popup {
        width: calc(320px - 42px);
        left: 0;
        transform: translate(-50%, calc(50% + 20px));
    }
}

.popup .logo {
    max-width: 100%;
    max-height: 200px;
}

.popup .logo_container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.popup .header {
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
}

.popup .header .title {
    font-size: 24px;
    line-height: 120%;
    text-transform: uppercase;
    font-family: 'Pragmatapro';
}

.popup .header .slogan {
    padding: 0.3rem 0;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 120%;
}

.popup .header .tags {
    color: #afafaf;
    padding: 0.3rem 0;
    word-break: break-word;
    line-height: 120%;
}

.popup .geo {
    margin-bottom: 0.8rem;
    font-size: 1rem;
}

.popup .geo .office {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.6rem;
}

.popup .geo .office .city,
.popup .geo .office .coordinates,
.popup .geo .address,
.popup .contacts .link,
.popup .contacts .tel,
.popup .contacts .email {
    display: flex;
    align-items: center;
    gap: 0 8px;
}

.popup .contacts .link a,
.popup .contacts .email span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1;
}

.popup .geo svg,
.popup .contacts svg {
    min-width: 20px;
}

.popup .geo .address {
    margin-top: 0.6rem;
}

.popup .description-block {
    margin-bottom: 0.8rem;
}

.popup .description-block .desc-title {
    font-size: 1rem;
    font-weight: 700;
    padding: 0.4rem 0;
}

.popup .description-block .more {
    text-align: right;
    margin-top: 0.4rem;
}

.popup .description-block .more .toggle-more {
    font-size: 0.8rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0 6px;
    cursor: pointer;
    display: none;
}

.popup .description-block .description {
    max-height: 4.5em;
    /* Ограничение по высоте: 3 строки при line-height = 1.5 */
    overflow: hidden;
    position: relative;
    line-height: 1.5;
    text-overflow: ellipsis;
}

.popup .description-block .description::after {
    content: '...';
    position: absolute;
    bottom: 0;
    right: 0;
    background: white;
    padding-left: 5px;
    height: 1.5em;
    display: none;
}

.popup .description-block .description.overflowed::after {
    display: block;
    /* Показываем многоточие только если текст обрезан */
}

.popup .description-block .description.expanded {
    max-height: none;
    overflow: visible;
}

.popup .description-block .description.expanded::after {
    content: '';
    /* Убираем многоточие */
}

.popup .contacts .link,
.popup .contacts .tel,
.popup .contacts .email {
    margin-top: 0.6rem;
    font-size: 1rem;
}

@media (max-width: 1024px) {
    .popup .contacts .link,
    .popup .contacts .tel,
    .popup .contacts .email {
        font-size: 0.9rem;
    }
}

.popup .footer-container {
    margin-top: 0.8rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
}

.popup .condition {
    padding: 0.5rem 0.6rem;
    background-color: #f7f7f7;
    border-radius: 0.4rem;
    display: inline-block;
}

.popup .condition::before {
    content: '*';
    vertical-align: super;
    line-height: 0;
}

.popup .view-counter-container {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.popup .close-popup {
    position: absolute;
    top: 22px;
    right: 25px;
    cursor: pointer;
}

.popup .more-link {
    text-align: end;
    margin-top: 4px;
}

.popup .more-link a {
    font-weight: bold;
}

.sidebar {
    width: 570px;
    height: calc(100% - 76px);
    background-color: #ffffff;
    color: #171717;
    position: fixed;
    top: 0;
    left: -570px;
    transition: left ease-in-out 0.3s;
    margin-top: 76px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border: #c4c4c4 solid 1px;
    box-shadow: #a9a9a9 -1px 0 6px 0px;
    font-family: Pragmatapro;
}

.sidebar.active {
    left: 0;
}

@media (width < 570px) {
    .sidebar.active {
        width: 100%;
    }
}

@media (width < 64rem) {
    .sidebar {
        height: calc(100% - 56px);
        margin-top: 56px;
    }
}

.sidebar .sidebar-container {
    height: calc(100vh - 148px);
}

.sidebar-label {
    font-family: 'Roboto Flex';
    font-size: 14px;
    margin-bottom: 0.3rem;
}

.sidebar-filter-section-container-flex {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    justify-content: space-between;
    overflow: auto;
    padding-bottom: 6px;
}

.sidebar-filter-section-item {
    border: #727272 solid 1px;
    color: #727272;
    padding: 5px 15px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    cursor: pointer;
    font-family: 'Roboto Flex';
    font-size: 14px;
}

.sidebar-filter-section-item.active {
    background-color: #333333;
    color: white;
}

.sidebar-filter-section-pointer {
    /* font-size: 30px;
    line-height: 1;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center; */
}

.sidebar-filter-container {
    margin-top: 1rem;
}

.sidebar-filter-container-flex {
    display: inline-grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    width: 100%;
}

@media (max-width: 424px) {
    .sidebar-filter-container-flex {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}

.sidebar-filter-categories-container-flex {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.sidebar-filter-categories-container {
    position: relative;
    flex: 1;
    width: 100%;
    max-width: 100%;
    background-color: white;
    z-index: 10;
}

.sidebar-filter-categories-selector-items {
    overflow-x: auto;
    scroll-behavior: smooth;
    user-select: none;
}

.sidebar-filter-categories-selector-items-placeholder {
    white-space: nowrap;
    font-family: 'Roboto Flex';
    color: #afafaf;
}

.sidebar-filter-categories-tag-list {
    display: flex;
    gap: 0.3rem;
}

.sidebar-filter-categories-tag-list::-webkit-scrollbar {
    display: none;
}

.sidebar-filter-categories-tag-list:active .selector-tag-view {
    cursor: grabbing;
}

.sidebar-filter-categories-selector {
    border: 1px solid #727272;
    padding: 0.5rem 0.6rem;
    font-size: 1rem;
    color: #5f5f5f;
    font-family: 'PragmataProMono', Arial, Helvetica, sans-serif;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    border-radius: 4px;
}

.sidebar-filter-categories-selector-items {
    flex: 1;
    display: flex;
    gap: 0.5rem;
    overflow: hidden;
    font-size: 14px;
}

.selector-tag-view {
    font-size: 0.8rem;
    background-color: #333333;
    padding: 0.2rem 0.6rem;
    color: white;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: default;
    white-space: nowrap;
}

.sidebar-filter-categories-options {
    position: absolute;
    border: 1px solid #d8dce1;
    background-color: white;
    margin-top: 4px;
    width: 100%;
    display: none;
}

.sidebar-filter-categories-options-item {
    padding: 4px 14px;
    cursor: pointer;
    border-top: white solid 1px;
    border-bottom: white solid 1px;
}

@media (hover: hover) and (pointer: fine) {
    .sidebar-filter-categories-options-item:hover {
        background-color: #e6e6e6;
    }
}

.sidebar-filter-categories-options-item.active {
    background-color: #e6e6e6;
}

.sidebar .sidebar-search-container {
    display: flex;
    align-items: center;
    border: 1px solid #727272;
    border-radius: 4px;
    padding: 0;
    padding-right: 0.6rem;
    overflow: hidden;
    background-color: white;
}

.sidebar .sidebar-search-icon {
    background-color: #ffffff;
    padding: 0.6rem 0.6rem;
    line-height: 1;
}

.sidebar .sidebar-search-input {
    padding: 0 0.6rem;
    flex: 1;
    font-size: 14px;
}

.sidebar .sidebar-search-input input {
    width: 160px;
    border: 0;
    outline: none;
    font-size: 14px;
    line-height: 1;
    font-family: 'Roboto Flex';
}

.sidebar .sidebar-search-input input::placeholder {
    color: #afafaf;
}

.sidebar .sidebar-search-close {
    cursor: pointer;
    display: none;
    position: absolute;
    top: 20px;
    right: 20px;
}

@media (max-width: 570px) {
    .sidebar .sidebar-search-close {
        display: block;
    }
}

.sidebar .sidebar-header {
    padding: 2rem 0 1rem;
    margin: 0 2rem;
    border-bottom: #e0e0e0 solid 1px;
}

.sidebar .sidebar-organizations {
    margin-top: 1rem;
    overflow-y: auto;
    overflow-x: hidden;
    height: calc(100% - 141px);
    padding: 0 2rem;
}

@media (max-width: 424px) {
    .sidebar .sidebar-header {
        margin: 0 1rem;
    }

    .sidebar .sidebar-organizations {
        padding: 0 1rem;
    }
}

@media (max-width: 1024px) {
    .sidebar .sidebar-organizations {
        height: calc(100% - 116px);
    }
}

@media (max-width: 424px) {
    .sidebar .sidebar-organizations {
        height: calc(100% - 167px);
    }
}

.sidebar .sidebar-organizations .sidebar-org-item {
    overflow-x: hidden;
    cursor: pointer;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 1rem;
    color: #333333;
    padding: 1rem 0.5px;
    border-radius: 8px;
    transition-property: all;
    transition-duration: 150ms;
    margin-bottom: 12px;
    border: transparent solid 1px;
}

.sidebar .sidebar-organizations .sidebar-org-item.active {
    border: #E4E4E4 solid 1px;
}

.sidebar .sidebar-organizations .sidebar-org-item:hover {
    border: #E4E4E4 solid 1px;
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-number-box {
    display: flex;
    align-items: start;
    justify-content: flex-end;
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-number {
    display: inline-block;
    padding: 0.1rem 0.5rem;
    background-color: #f1f1f1;
    border-radius: 4px;
    text-align: center;
    font-family: 'Roboto Flex';
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-name {
    text-transform: uppercase;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -0.01em;
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-desc-box {
    /* white-space: nowrap;
    text-overflow: ellipsis;
    overflow-x: hidden; */
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-desc-box .sidebar-org-desc-title {
    font-size: 14px;
    font-family: 'Roboto Flex';
    font-weight: 700;
    line-height: 120%;
    text-transform: uppercase;
    max-height: 2.2em;
    overflow: hidden;
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-desc-box .sidebar-org-desc {
    font-size: 14px;
    font-family: 'Roboto Flex';
    color: #727272;
    line-height: 120%;
    margin-top: 0.35rem;
    max-height: 2.5em;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
}
.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-desc-box .sidebar-org-desc::after {
    content: '...';
    position: absolute;
    bottom: 0;
    right: 4px;
    background: white;
    padding-left: 5px;
    height: 1.3em;
    width: 7rem;
    display: none;
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-desc-box .sidebar-org-desc.overflowed::after {
    display: block;
    /* Показываем многоточие только если текст обрезан */
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-footer {
    display: flex;
    gap: 1rem;
    font-size: 14px;
    font-family: 'Roboto Flex';
    margin-top: 0.5rem;
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-footer .sidebar-org-footer-country {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.sidebar .sidebar-organizations .sidebar-org-item .sidebar-org-footer .sidebar-org-footer-city {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

.sidebar .sidebar-close-btn {
    position: absolute;
    top: 2rem;
    right: 0;
    transform: translate(100%, 0);
    padding: 0.6rem;
    border: 0;
    border-top-right-radius: 0.4rem;
    border-bottom-right-radius: 0.4rem;
    background-color: #333333;
    color: white;
    cursor: pointer;
}

.ymaps3x0--main-engine-container {
    filter: grayscale(1);
    -ms-filter: grayscale(1);
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
}

/* Стилизация скроллбара для WebKit-браузеров (Chrome, Safari, Edge) */
.sidebar-organizations::-webkit-scrollbar {
    width: 10px; /* Ширина скроллбара */
}

.sidebar-organizations::-webkit-scrollbar-track {
    background: #f1f1f1; /* Цвет фона трека */
    border-radius: 10px;
}

.sidebar-organizations::-webkit-scrollbar-thumb {
    background: #888; /* Цвет ползунка */
    border-radius: 10px;
    border: 3px solid #f1f1f1; /* Отступы вокруг ползунка */
}

.sidebar-organizations::-webkit-scrollbar-thumb:hover {
    background: #555; /* Цвет ползунка при наведении */
}

/* Стилизация скроллбара для Firefox */
.sidebar-organizations {
    scrollbar-width: thin; /* "auto" или "thin" */
    scrollbar-color: #888 #f1f1f1; /* Цвет ползунка и трека */
}

#view-panel {
    width: 570px;
    height: calc(100% - 76px);
    background-color: #ffffff;
    color: #171717;
    position: fixed;
    top: 0;
    left: -570px;
    transition: left ease-in-out 0.3s;
    margin-top: 76px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border: #c4c4c4 solid 1px;
    box-shadow: #a9a9a9 -1px 0 6px 0px;
    font-family: Pragmatapro;
}

#view-panel.active {
    left: 0;
}

@media (width < 570px) {
    #view-panel {
        width: 100%;
    }
}

@media (width < 64rem) {
    #view-panel {
        height: calc(100% - 56px);
        margin-top: 56px;
    }
}

.view-panel-container {
    position: relative;
    padding: 1rem 2rem;
    max-height: calc(100vh - 79px);
    overflow: auto;
}

@media (width < 1024px) {
    .view-panel-container {
        max-height: calc(100vh - 57px);
    }
}

@media (width < 490px) {
    .view-panel-container {
        padding: 1rem 1rem;
    }
}

.view-panel-container .logo {
    max-width: 200px;
    max-height: 100px;
}

.view-panel-container .header {
    border-bottom: #d8dce1 solid 1px;
}

.view-panel-container .header .title {
    font-size: 24px;
    margin-top: 0.5rem;
    text-transform: uppercase;
    letter-spacing: -1px;
}

.view-panel-container .header .slogan {
    text-transform: uppercase;
    line-height: 120%;
}

.view-panel-container .tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 1rem 0;
}

.view-panel-container .tags .tag-item {
    background-color: #e9e9e9;
    font-size: 12px;
    font-family: 'Roboto Flex';
    padding: 0.2rem 0.5rem;
    white-space: nowrap;
    border-radius: 4px;
}

/* .view-panel-container .body {
    overflow: auto;
    max-height: calc(100vh - 126px);
    padding: 0 2rem;
    margin: 1rem 0;
}

@media (width < 1024px) {
    .view-panel-container .body {
        max-height: calc(100vh - 357px);
    }
} */

.view-panel-container .office {
    border-bottom: #d8dce1 solid 1px;
    padding: 1rem 0;
    font-size: 14px;
    font-family: 'Roboto Flex';
}

.view-panel-container .office .office-flex {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr) minmax(0, 1fr);
    row-gap: 0.6rem;
    column-gap: 0.5rem;
}

@media (width < 490px) {
    .view-panel-container .office .office-flex {
        grid-template-columns: 100px minmax(0, 1fr) minmax(0, 1fr);
    }
}

@media (width < 425px) {
    .view-panel-container .office .office-flex {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.view-panel-container .office .office-flex .office-item {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 1rem 0 0;
}

.view-panel-container .office .footer .footer-flex {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    margin-top: 0.8rem;
}

.view-panel-container .office .footer .footer-flex .counter {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.view-panel-container .office .footer .condition {
    padding: 0.4rem 0.6rem;
    background-color: #f7f7f7;
    border-radius: 0.4rem;
    display: inline-block;
    margin-top: 1rem;
}

.view-panel-container .office .footer .condition::before {
    content: '*';
    line-height: 0;
}

.view-panel-container .desc-container {
    padding: 1rem 0;
    font-family: 'Roboto Flex';
}

.view-panel-container .desc-container .title {
    font-weight: bold;
}

.view-panel-container .desc-container .more {
    text-align: right;
    margin-top: 0.4rem;
}

.view-panel-container .desc-container .more .toggle-more {
    font-size: 0.8rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0 6px;
    cursor: pointer;
    display: none;
}

.view-panel-container .desc-container .description {
    margin-top: 0.4rem;
    line-height: 100%;
    font-size: 14px;
    letter-spacing: -0.01em;
    /* Ограничение по высоте: 3 строки при line-height = 1.5 */
    max-height: 4.5em;
    overflow: hidden;
    position: relative;
    line-height: 1.5;
    text-overflow: ellipsis;
    color: #333333;
}

.view-panel-container .desc-container .description::after {
    content: '...';
    position: absolute;
    bottom: 0;
    right: 0;
    background: white;
    padding-left: 5px;
    height: 1.5em;
    display: none;
}

.view-panel-container .desc-container .description.overflowed::after {
    display: block;
    /* Показываем многоточие только если текст обрезан */
}

.view-panel-container .desc-container .description.expanded {
    max-height: none;
    overflow: visible;
}

.view-panel-container .desc-container .description.expanded::after {
    content: '';
    /* Убираем многоточие */
}

.view-panel-container .close-card {
    position: absolute;
    top: 22px;
    right: 25px;
    cursor: pointer;
}

.view-panel-container .brand-container {
    padding: 1rem 0;
    font-family: 'Roboto Flex';
}

.view-panel-container .brand-container .title {
    font-weight: bold;
}

.photos-container .title {
    font-weight: bold;
    font-family: 'Roboto Flex';
}

.view-panel-container .photos-container .photos {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    margin-top: 0.5rem;
}

.view-panel-container .photos-container .photos .photo-item-mini {
    width: 80px;
    height: 80px;
    cursor: pointer;
}

.photo-swiper {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.photo-swiper-background {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: #00000093;
    width: 100%;
    height: 100%;
}

.photo-swiper-close-btn {
    position: absolute;
    top: 23px;
    right: 23px;
}

.photo-swiper.hidden {
    display: none;
}

.mySwiper {
    width: 100%;
    height: 100%;
    z-index: 99999 !important;
}

.swiper-slide {
    /* background-position: center; */
    /* background-size: cover; */
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.swiper-slide img {
    display: block;
    max-height: 80%;
    /* width: 100%; */
}

.swiper-button-prev,
.swiper-button-next {
    color: #ffffff !important;
}

.swiper-pagination-bullet-active {
    background-color: #ffffff !important;
}