/* =========================================================
   EXPORT MASTER — блок "Наші послуги"
   Стиль максимально наближений до затвердженого ескізу
   ========================================================= */

.services-sketch{
    display:grid;
    grid-template-columns:repeat(9, minmax(118px, 1fr));
    gap:18px;
    width:100%;
    align-items:stretch;
}

/* Картка */
.services-sketch .card{
    min-height:170px;
    padding:2px 2px 2px;
    background:#ffffff;
    border:1px solid #e8eaf2;
    border-radius:12px;
    box-shadow:0 7px 22px rgba(33,26,112,.08);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    text-align:center;
    position:relative;
    overflow:hidden;
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}

/* Помаранчева риска знизу */
.services-sketch .card::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:12px;
    width:38px;
    height:2px;
    background:#f45b22;
    border-radius:3px;
    transform:translateX(-50%);
}

/* Hover */
.services-sketch .card:hover{
    transform:translateY(-5px);
    border-color:rgba(244,91,34,.32);
    box-shadow:0 14px 32px rgba(33,26,112,.14);
}

/* Контейнер іконки */
.services-sketch .icon{
    width:92px;
    height:92px;
    margin:0 auto 12px;
    padding:0;
    background:transparent;
    border-radius:0;
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
}

/* SVG-іконка */
.services-sketch .icon img{
    width:82px;
    height:82px;
    object-fit:contain;
    display:block;
    transition:transform .25s ease;
}

.services-sketch .card:hover .icon img{
    transform:scale(1.05);
}

/* Заголовок */
.services-sketch .card h3{
    color:#211a70;
    font-size:14px;
    line-height:1.25;
    font-weight:700;
    margin:0;
    width:100%;
    max-width:none;
    text-align:center;
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
}

/* Опис у цьому макеті не показуємо */
.services-sketch .card p{
    display:none;
}

/* Заголовок секції */
.services-section .title{
    text-align:center;
    margin-bottom:36px;
}

.services-section .title h2{
    margin:0;
    color:#211a70;
    font-size:42px;
    line-height:1.15;
    font-weight:700;
}

.services-section .title h2::after{
    content:"";
    display:block;
    width:60px;
    height:4px;
    margin:15px auto 0;
    background:#f45b22;
}

.services-section .title p{
    max-width:760px;
    margin:15px auto 0;
    color:#68708a;
    font-size:16px;
    line-height:1.55;
}

/* Ноутбуки */
@media (max-width:1400px){
    .services-sketch{
        grid-template-columns:repeat(5, 1fr);
    }
}

/* Планшети */
@media (max-width:980px){
    .services-sketch{
        grid-template-columns:repeat(3, 1fr);
    }

    .services-sketch .card{
        min-height:210px;
    }
}

/* Телефони */
@media (max-width:640px){
    .services-sketch{
        grid-template-columns:repeat(2, 1fr);
        gap:12px;
    }

    .services-sketch .card{
        min-height:190px;
        padding:17px 10px 24px;
    }

    .services-sketch .icon{
        width:78px;
        height:78px;
        margin-bottom:10px;
    }

    .services-sketch .icon img{
        width:70px;
        height:70px;
    }

    .services-sketch .card h3{
        font-size:15px;
        max-width:125px;
    }

    .services-section .title h2{
        font-size:34px;
    }
}

/* Дуже вузькі екрани */
@media (max-width:390px){
    .services-sketch{
        grid-template-columns:1fr;
    }

    .services-sketch .card{
        min-height:175px;
    }
}