/* BUSINESS SOLUTION V20
   1) Карточки: одинаковая высота в каждой строке, высота строки определяется контентом.
   2) Верхняя навигация первого экрана активна.
   3) WhatsApp / Telegram в футере выровнены и не накладываются.
*/

/* Кликабельные зоны на утверждённом первом экране */
.approved-screen{
    position:relative;
}

.screen-hotspot{
    position:absolute;
    z-index:20;
    display:block;
    background:transparent;
    border:0;
}

/* Координаты по утверждённому макету 1536×1024 */
.screen-hotspot--home{
    left:28.4%;
    top:3.2%;
    width:7.2%;
    height:6.2%;
}
.screen-hotspot--about{
    left:37.6%;
    top:3.2%;
    width:6.6%;
    height:6.2%;
}
.screen-hotspot--services{
    left:45.4%;
    top:3.2%;
    width:7.2%;
    height:6.2%;
}
.screen-hotspot--advantages{
    left:54.2%;
    top:3.2%;
    width:13.4%;
    height:6.2%;
}
.screen-hotspot--contacts{
    left:69.0%;
    top:3.2%;
    width:9.5%;
    height:6.2%;
}
.screen-hotspot--contact-top{
    left:84.0%;
    top:2.7%;
    width:13.3%;
    height:7.0%;
}
.screen-hotspot--services-cta{
    left:4.6%;
    top:49.2%;
    width:17.0%;
    height:6.7%;
}
.screen-hotspot--contact-cta{
    left:23.2%;
    top:49.2%;
    width:19.4%;
    height:6.7%;
}
.screen-hotspot--scroll{
    left:47.4%;
    top:57.1%;
    width:5.0%;
    height:5.0%;
}

.screen-hotspot:focus-visible{
    outline:2px solid rgba(255,133,0,.95);
    outline-offset:2px;
    border-radius:12px;
}

/* УСЛУГИ — две карточки в строке одной высоты, но без фиксированной высоты */
.services__grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:22px;
    align-items:stretch;
}

.service-card{
    min-height:0 !important;
    height:100%;
    display:flex;
    flex-direction:column;
}

/* ПРЕИМУЩЕСТВА — симметрия правой/левой карточки в каждой строке */
.advantages__grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:22px;
    align-items:stretch;
}

.advantages__grid .advantages__panel{
    min-height:0 !important;
    height:100%;
}

/* ЭТАПЫ — если карточки переходят в 2 колонки, каждая строка также симметрична */
.cooperation__steps{
    align-items:stretch;
}

.cooperation-step{
    min-height:0 !important;
    height:100%;
}

/* Футер: мессенджеры строго в одну линию, без наложения */
.footer__socials--approved{
    display:flex !important;
    align-items:center !important;
    gap:14px !important;
    flex-wrap:wrap;
    margin-top:24px;
}

.footer-social{
    width:auto !important;
    height:46px !important;
    min-width:145px;
    padding:7px 15px 7px 8px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:10px !important;
    border-radius:14px !important;
    line-height:1 !important;
    white-space:nowrap;
}

.footer-social__icon{
    width:32px !important;
    height:32px !important;
    flex:0 0 32px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:50% !important;
    background:rgba(255,255,255,.16) !important;
}

.footer-social__icon svg{
    display:block !important;
    width:20px !important;
    height:20px !important;
    fill:currentColor !important;
}

.footer-social span:last-child{
    display:block;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}

@media(max-width:820px){
    .services__grid,
    .advantages__grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:760px){
    /* На мобильном изображение первого экрана остаётся без наложений интерфейса */
    .screen-hotspot{
        display:none;
    }
}