.iletisim-hero-section{
    padding:90px 0 70px;

    background:
    linear-gradient(
        135deg,
        #0f172a,
        #1e293b,
        #334155
    );
}

.iletisim-hero-container{
    max-width:1400px;
    margin:auto;
    padding:0 30px;

    display:grid;
    grid-template-columns:1fr 480px;
    gap:70px;
    align-items:center;
}

.iletisim-badge{
    display:inline-block;

    background:rgba(255,255,255,.08);

    border:1px solid rgba(255,255,255,.15);

    color:#fff;

    padding:8px 16px;

    border-radius:50px;

    font-size:13px;
    font-weight:700;

    margin-bottom:18px;
}

.iletisim-title{
    font-size:56px;
    line-height:1.1;
    font-weight:800;

    color:#fff;

    margin-bottom:18px;
}

.iletisim-subtitle{
    color:rgba(255,255,255,.78);

    font-size:17px;
    line-height:1.9;

    max-width:700px;

    margin-bottom:35px;
}

.iletisim-features{
    display:grid;
    grid-template-columns:repeat(2,max-content);
    gap:18px 35px;
}

.iletisim-feature{
    display:flex;
    align-items:center;
    gap:10px;

    color:#fff;
    font-size:15px;
    font-weight:600;
}

.iletisim-feature i{
    color:#38bdf8;
}

.iletisim-hero-visual img{
    width:100%;
    height:360px;

    object-fit:cover;

    border-radius:26px;

    box-shadow:
    0 25px 50px rgba(0,0,0,.25);
}

.iletisim-cards-section{
    padding:50px 0 80px;
    background:#f8fafc;
}

.iletisim-cards-container{
    max-width:1400px;
    margin:auto;
    padding:0 30px;

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
}

.iletisim-card{
    background:#fff;

    border-radius:22px;

    padding:28px;

    box-shadow:
    0 10px 30px rgba(15,23,42,.06);

    border:1px solid #eef2f7;
}

.iletisim-card-icon{
    width:58px;
    height:58px;

    border-radius:16px;

    background:
    linear-gradient(
        135deg,
        #2563eb,
        #38bdf8
    );

    color:#fff;

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

    font-size:22px;

    margin-bottom:18px;
}

.iletisim-card span{
    display:block;

    color:#64748b;

    font-size:13px;

    margin-bottom:8px;
}

.iletisim-card strong{
    display:block;

    color:#0f172a;

    font-size:16px;

    line-height:1.7;
}

@media(max-width:991px){

    .iletisim-hero-container{
        grid-template-columns:1fr;
    }

    .iletisim-cards-container{
        grid-template-columns:1fr 1fr;
    }

    .iletisim-title{
        font-size:42px;
    }

}

@media(max-width:576px){

    .iletisim-cards-container{
        grid-template-columns:1fr;
    }

    .iletisim-title{
        font-size:34px;
    }

}