/* v47 - Safe 4 card services overview.
   This file only controls the top 4 icon cards on services pages.
   It does not change service category widths, containers, header, footer or other sections. */

body[data-page-id="hizmetler"] .services-four-overview{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:18px!important;
    align-items:stretch!important;
    width:100%!important;
    max-width:100%!important;
    margin:10px 0 0!important;
}
body[data-page-id="hizmetler"] .services-four-overview .service-card{
    display:flex!important;
    flex-direction:column!important;
    min-height:260px!important;
    padding:28px!important;
}
body[data-page-id="hizmetler"] .services-four-overview .service-icon{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
    margin:0 0 18px 0!important;
    border:1px solid rgba(254,237,1,.24)!important;
    border-radius:16px!important;
    background:rgba(254,237,1,.08)!important;
    color:var(--yellow)!important;
    font-size:22px!important;
}
body[data-page-id="hizmetler"] .services-four-overview .service-icon i{
    color:var(--yellow)!important;
    line-height:1!important;
}
@media(max-width:1100px){
    body[data-page-id="hizmetler"] .services-four-overview{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
}
@media(max-width:640px){
    body[data-page-id="hizmetler"] .services-four-overview{
        grid-template-columns:1fr!important;
        gap:16px!important;
    }
    body[data-page-id="hizmetler"] .services-four-overview .service-card{
        min-height:auto!important;
        padding:22px!important;
    }
}