

/* Start:/bitrix/templates/art_krut/components/bitrix/news.list/startup_cards/style.css?178662128121220*/
/* =========================================================
   СТАРТАПЫ
   ========================================================= */


/* ---------------------------------------------------------
   Сетка карточек
   --------------------------------------------------------- */

.startup-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin: 0 0 40px;
}


/* ---------------------------------------------------------
   Карточка
   --------------------------------------------------------- */

.startup-card {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;

    color: #333;

    transition: all .3s ease;

    box-shadow: 0 4px 18px rgba(0, 0, 0, .08);

    height: 100%;

    display: flex;
    flex-direction: column;
}


.startup-card:hover {
    transform: translateY(-6px);

    box-shadow: 0 12px 30px rgba(0, 0, 0, .15);
}


/* ---------------------------------------------------------
   Изображение карточки
   --------------------------------------------------------- */

.startup-image {
    height: 230px;
    overflow: hidden;
}


.startup-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .4s ease;

    display: block;
}


.startup-card:hover .startup-image img {
    transform: scale(1.05);
}


/* ---------------------------------------------------------
   Тело карточки
   --------------------------------------------------------- */

.startup-body {
    padding: 20px;

    display: flex;
    flex-direction: column;

    flex: 1;
}


/* ---------------------------------------------------------
   Заголовок карточки
   --------------------------------------------------------- */

.startup-body h3 {
    margin: 0 0 12px;

    font-size: 22px;
    font-weight: 600;

    color: #e31b23;

    text-transform: uppercase;

    line-height: 1.25;
}


/* ---------------------------------------------------------
   Текст карточки
   --------------------------------------------------------- */

.startup-text {
    line-height: 1.5;

    color: #666;

    margin-bottom: 20px;

    flex: 1;
}


/* ---------------------------------------------------------
   Ссылка "Перейти на сайт"
   --------------------------------------------------------- */

.startup-link,
.startup-link:visited {
    display: inline-block;

    margin-top: auto;

    color: #e31b23;

    font-weight: 600;

    text-decoration: none;

    border: 1px solid #e31b23;

    padding: 10px 18px;

    border-radius: 6px;

    transition: all .3s ease;
}


.startup-link:hover,
.startup-link:focus,
.startup-link:active {
    background: #e31b23;

    color: #fff !important;

    border-color: #e31b23;

    text-decoration: none;
}


/* =========================================================
   БАННЕР
   ========================================================= */

.startup-hero {
    margin: 30px 0 70px;
}


.startup-hero img {
    display: block;

    width: 100%;

    border-radius: 20px;
}


/* =========================================================
   ОСНОВНОЙ БЛОК
   ========================================================= */

.startup-section {
    margin-bottom: 80px;
}


/* ---------------------------------------------------------
   Заголовок раздела
   --------------------------------------------------------- */

.startup-title {
    margin: 0 0 45px;

    font-size: 44px;

    font-weight: 500;

    text-transform: uppercase;

    line-height: 1;

    color: #222;
}


/* =========================================================
   ПАГИНАЦИЯ
   ========================================================= */

.startup-pager-wrap {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;

    margin: 0 0 20px;
}


.startup-pagination {
    display: flex;
    align-items: center;

    gap: 15px;
}


/* =========================================================
   НОМЕРА СТРАНИЦ
   ========================================================= */

.pager-pages {
    display: flex;
    align-items: center;

    gap: 15px;
}


.pager-pages a,
.pager-pages span {
    width: 50px;
    height: 50px;

    box-sizing: border-box;

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

    padding: 0;

    border: 1px solid #777;
    border-radius: 6px;

    background: #fff;

    color: #333;

    text-decoration: none;

    font-size: 16px;
    font-weight: 400;

    line-height: 1;

    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease;
}


/* ---------------------------------------------------------
   Обычная страница
   --------------------------------------------------------- */

.pager-pages a {
    background: #fff;
    color: #333;
}


/* ---------------------------------------------------------
   Наведение на номер
   --------------------------------------------------------- */

.pager-pages a:hover,
.pager-pages a:focus {
    background: #fff;

    color: #e31b23;

    border-color: #e31b23;

    text-decoration: none;
}


/* ---------------------------------------------------------
   Активная страница
   --------------------------------------------------------- */

.pager-pages .active {
    background: #ed1c2e;

    border-color: #ed1c2e;

    color: #fff;
}


 /* =========================================================
   СТРЕЛКИ
   ========================================================= */

.pager-arrow {
    width: 50px;
    height: 50px;

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

    padding: 0;

    background: transparent;

    border: 0;

    color: #222;

    text-decoration: none;

    font-size: 30px;
    font-weight: 400;

    line-height: 1;

    transition:
        color .2s ease,
        transform .2s ease;
}


/* Левая стрелка */

.pager-prev {
    color: #999;
}


/* Правая стрелка */

.pager-next {
    color: #111;
}


/* ---------------------------------------------------------
   Наведение на стрелки
   --------------------------------------------------------- */

.pager-arrow:hover,
.pager-arrow:focus {
    background: transparent;

    color: #e31b23;

    border: 0;

    text-decoration: none;
}


/* Небольшой эффект при наведении */

.pager-prev:hover {
    transform: translateX(-2px);
}

.pager-next:hover {
    transform: translateX(2px);
} 


/* =========================================================
   МОБИЛЬНАЯ ВЕРСИЯ
   ========================================================= */

@media (max-width: 640px) {

    .startup-pager-wrap {
        justify-content: center;

        margin-bottom: 20px;
    }


    .startup-pagination {
        gap: 8px;
    }


    .pager-pages {
        gap: 8px;
    }


    .pager-pages a,
    .pager-pages span {
        width: 42px;
        height: 42px;

        font-size: 14px;
    }


    .pager-arrow {
        width: 42px;
        height: 42px;

        font-size: 25px;
    }

}


/* =========================================================
   АДАПТИВНОСТЬ
   ========================================================= */


/* ---------------------------------------------------------
   Планшет
   --------------------------------------------------------- */

@media (max-width: 991px) {

    .startup-grid {
        grid-template-columns: repeat(2, 1fr);
    }

}


/* ---------------------------------------------------------
   Телефон
   --------------------------------------------------------- */

@media (max-width: 640px) {

    .startup-grid {
        grid-template-columns: 1fr;
    }


    .startup-pager-wrap {
        justify-content: center;

        margin-bottom: 20px;
    }


    .startup-pagination {
        justify-content: center;
    }


    .pager-pages a,
    .pager-pages span {
        min-width: 32px;

        height: 32px;

        font-size: 14px;
    }


    .pager-arrow {
        width: 32px;

        height: 32px;

        font-size: 18px;
    }


    .startup-title {
        font-size: 32px;
    }


    .startup-image {
        height: 210px;
    }

}


/* ---------------------------------------------------------
   Очень маленькие экраны
   --------------------------------------------------------- */

@media (max-width: 400px) {

    .startup-pagination {
        gap: 6px;
    }


    .pager-pages {
        gap: 4px;
    }


    .pager-pages a,
    .pager-pages span {
        min-width: 30px;

        height: 30px;

        padding: 0 6px;
    }


    .pager-arrow {
        width: 30px;

        height: 30px;
    }

}

/* =========================================================
   ОБЩИЙ БЛОК
   ========================================================= */

.incubator-system {
    position: relative;
z-index: 1;
    width: 100%;

    margin: 70px 0 0;

    padding: 55px 20px 0;

    box-sizing: border-box;

    background: #fafafa;

    border-radius: 16px;

    overflow: hidden;

    font-family: inherit;
}


/* =========================================================
   ЗАГОЛОВОК
   ========================================================= */

.incubator-system__header {
    position: relative;

    z-index: 9;

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    width: 100%;

    max-width: 1100px;

    margin: 0 auto;

    box-sizing: border-box;

    text-align: left;
}


/* Левая часть */

.incubator-system__content {
    flex: 1;

    min-width: 0;

    text-align: left;
}


/* =========================================================
   ЗАГОЛОВОК
   ========================================================= */

.incubator-system__title {
    margin: 0;
z-index: 8;
    color: #292929;

    font-size: 36px;

    line-height: 1.08;

    font-weight: 700;

    text-align: left;
}


/* =========================================================
   ОПИСАНИЕ
   ========================================================= */

.incubator-system__description {
    max-width: 760px;

    margin: 22px 0 0;

    color: #333;

    font-size: 17px;

    line-height: 1.48;

    font-weight: 400;

    text-align: left;
}


/* =========================================================
   КРАСНАЯ КНОПКА
   Справа и сверху напротив заголовка
   ========================================================= */

.incubator-system__apply {
    flex: 0 0 auto;

    display: inline-block;

    margin: 0 0 0 50px;

    padding: 10px 14px;

    background: #ed1c2e;

    color: #fff !important;

    border-radius: 4px;

    font-size: 30px;

    line-height: 1.25;

    font-weight: 400;

    text-decoration: none !important;

    white-space: nowrap;

    cursor: pointer;

    transition:
        background-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}


.incubator-system__apply:hover {
    background: #d91629;

    color: #fff !important;

    transform: translateY(-2px);

    box-shadow: 0 6px 16px rgba(237, 28, 46, .25);
}


/* =========================================================
   КАРТА
   ========================================================= */

.incubator-map {
    position: relative;
z-index: 2;
    width: 900px;

    height: 325px;

    max-width: 100%;

    margin: 65px auto 0;

    overflow: visible;
}


/* =========================================================
   ОРБИТЫ
   ========================================================= */

.incubator-orbit {
    position: absolute;

    left: 50%;

    box-sizing: border-box;

    border: 1px solid #d9d9d9;

    /*
     * Нижней границы нет.
     * Поэтому видна ровно верхняя половина окружности.
     */

    border-bottom: 0;

    border-radius: 500px 500px 0 0;

    pointer-events: none;
}


/* Внешняя дуга */

.incubator-orbit--outer {
    width: 720px;
    height: 360px;

    top: 15px;

    transform: translateX(-50%);
}


/* Средняя дуга */

.incubator-orbit--middle {
    width: 535px;
    height: 267.5px;

    top: 83px;

    transform: translateX(-50%);
}


/* Внутренняя дуга */

.incubator-orbit--inner {
    width: 350px;
    height: 175px;

    top: 150px;

    transform: translateX(-50%);
}


/* =========================================================
   КРАСНЫЕ ТОЧКИ
   ========================================================= */

.incubator-dot {
    position: absolute;

    width: 20px;

    height: 20px;

    margin-left: -10px;

    margin-top: -10px;

    background: #ed1c2e;

    border-radius: 50%;

    z-index: 5;

    transition: transform .2s ease;
}


.incubator-dot:hover {
    transform: scale(1.15);
}


.incubator-dot--1 {
    left: 56%;

    top: 18px;
}


.incubator-dot--2 {
    left: 36%;

    top: 116px;
}


.incubator-dot--3 {
    left: 58%;

    top: 169px;
}


.incubator-dot--4 {
    left: 88%;

    top: 255px;
}


.incubator-dot--5 {
    left: 12%;

    top: 260px;
}


/* =========================================================
   СЕРЫЕ КАРТОЧКИ
   ========================================================= */

.incubator-card {
    position: absolute;

    z-index: 20;

    padding: 10px 20px;

    background: #c9c9c9;

    color: #fff;

    border-radius: 4px;

    font-size: 16px;

    line-height: 1.25;

    cursor: pointer;

    transition:
        background-color .2s ease,
        transform .2s ease;
}


.incubator-card:hover {
    background: #bdbdbd;
}


/* =========================================================
   ТОЧКА-СОЕДИНЕНИЕ
   ========================================================= */

.incubator-card::after {
    content: "";

    position: absolute;

    width: 11px;

    height: 11px;

    background: #c9c9c9;

    border-radius: 50%;

    transition: background-color .2s ease;
}


.incubator-card:hover::after {
    background: #bdbdbd;
}


/* =========================================================
   ПОЗИЦИИ
   ========================================================= */


/* Привлечение инвестиций */

.incubator-card--invest {
    left: 70px;

    top: 10px;
}


.incubator-card--invest::after {
    right: -7px;

    bottom: -5px;
}


/* Партнерская сеть */

.incubator-card--partners {
    left: -20px;

    top: 140px;
}


.incubator-card--partners::after {
    right: -7px;

    bottom: -3px;
}


/* PR */

.incubator-card--pr {
    left: 525px;

    top: 45px;

    transform: translateX(-50%);
}





.incubator-card--pr::after {
    left: -5px;

    bottom: -5px;
}


/* Трекшн-митинги */

.incubator-card--meetings {
    right: 65px;

    top: 57px;
}


.incubator-card--meetings::after {
    left: -5px;

    bottom: -5px;
}


/* Нетворкинг */

.incubator-card--network {
    left: 155px;

    top: 250px;
}


.incubator-card--network::after {
    right: -7px;

    bottom: -5px;
}


/* Коворкинг */

.incubator-card--coworking {
    right: 170px;

    top: 225px;
}


.incubator-card--coworking::after {
    left: -5px;

    bottom: -5px;
}


/* =========================================================
   ВСПЛЫВАЮЩИЕ КОММЕНТАРИИ
   ========================================================= */

.incubator-card__comment {
    position: absolute;

    width: 280px;
    max-width: 280px;

    box-sizing: border-box;

    padding: 14px 17px;

    background: #c9c9c9;
    color: #fff;

    border-radius: 5px;

    font-size: 14px;
    line-height: 1.45;
    font-weight: 400;

    z-index: 10;

    opacity: 0;
    visibility: hidden;

    pointer-events: none;

    /*
     * Начальная позиция немного ниже,
     * затем плавно поднимается.
     */

    transform: translate(-50%, 8px);

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;

    box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
}


/* Показываем комментарий */

.incubator-card:hover .incubator-card__comment {
    opacity: 1;
    visibility: visible;

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


/* Заголовок */

.incubator-card__comment strong {
    display: inline-block;

    margin-bottom: 4px;

    font-weight: 700;
}


/* =========================================================
   СТРЕЛКА
   ========================================================= */

.incubator-card__comment::before {
    content: "";

    position: absolute;

    left: 50%;
    bottom: -8px;

    transform: translateX(-50%);

    width: 0;
    height: 0;

    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #c9c9c9;
}


/* =========================================================
   ПОЗИЦИИ КОММЕНТАРИЕВ
   ========================================================= */

/* Привлечение инвестиций */

.incubator-card--invest .incubator-card__comment {
    left: 50%;
    bottom: calc(100% + 14px);

    top: auto;
}


/* Партнерская сеть */

.incubator-card--partners .incubator-card__comment {
    left: 50%;
    bottom: calc(100% + 14px);

    top: auto;
}


/* PR */

.incubator-card--pr .incubator-card__comment {
    left: 50%;
    bottom: calc(100% + 14px);

    top: auto;

    transform: translate(-50%, 8px);
}

.incubator-card--pr:hover .incubator-card__comment {
    transform: translate(-50%, 0);
}


/* Трекшн-митинги */

.incubator-card--meetings .incubator-card__comment {
    left: 50%;
    bottom: calc(100% + 14px);

    top: auto;
}


/* Нетворкинг */

.incubator-card--network .incubator-card__comment {
    left: 50%;
    bottom: calc(100% + 14px);

    top: auto;
}


/* Коворкинг */

.incubator-card--coworking .incubator-card__comment {
    left: 50%;
    bottom: calc(100% + 14px);

    top: auto;
}


/* =========================================================
   АДАПТИВ
   ========================================================= */

@media (max-width: 950px) {

    .incubator-map {
        transform: scale(.85);

        transform-origin: top center;

        width: 900px;

        margin-bottom: -55px;
    }

}


@media (max-width: 700px) {

    .incubator-system {
        padding-top: 40px;
    }


    .incubator-system__title {
        font-size: 27px;
    }


    .incubator-system__description {
        font-size: 15px;
    }


    .incubator-desktop {
        display: none;
    }


    .incubator-map {
        transform: scale(.62);

        transform-origin: top center;

        width: 900px;

        margin-top: 50px;

        margin-bottom: -145px;
    }

}


@media (max-width: 480px) {

    .incubator-system__title {
        font-size: 23px;
    }


    .incubator-system__apply {
        margin-top: 25px;
    }


    .incubator-map {
        transform: scale(.48);

        transform-origin: top center;

        margin-bottom: -210px;
    }

}

/* =========================================================
   СКРЫТЬ ИНКУБАТОР НА МОБИЛЬНЫХ
   ========================================================= */

@media (max-width: 767px) {

    /* =====================================================
       ШАПКА
       ===================================================== */

    .incubator-system__header {
        display: flex;

        flex-direction: column;

        align-items: flex-start;

        justify-content: flex-start;

        width: 100%;

        text-align: left;
    }


    .incubator-system__content {
        width: 100%;

        text-align: left;
    }


    .incubator-system__title {
width: 70%;
font-size: 20px;

        line-height: 1.12;

        text-align: left;
    }


    .incubator-system__description {
        width: 100%;

        margin-top: 20px;

        font-size: 15px;

        line-height: 1.48;

        text-align: left;
    }


    /*
     * Кнопка после всего текста
     */

    .incubator-system__apply {
        margin: 25px 0 0;

        align-self: flex-start;

        font-size: 16px;
    }


    /* =====================================================
       СКРЫВАЕМ СХЕМУ НА МОБИЛЬНОМ
       ===================================================== */

    .incubator-map {
        display: none !important;
    }


    /*
     * Оставляем небольшой серый участок
     * после кнопки
     */

    .incubator-system {
        padding-bottom: 35px;
    }


    .incubator-desktop {
        display: none;
    }

}

/* Убираем стандартный AJAX-loader Bitrix */
.bx-core-waitwindow,
div[id^="wait_comp_"] {
    display: none !important;
}
/* End */
/* /bitrix/templates/art_krut/components/bitrix/news.list/startup_cards/style.css?178662128121220 */
