/* Temel Ayarlar */
* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Segoe UI', sans-serif; }
html, body { 
    max-width: 100%; 
    overflow-x: hidden; 
    background-color: #121212; 
    color: #fff; 
    line-height: 1.6; 
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* Header */
header { background: #000; padding: 15px 0; border-bottom: 2px solid #333; }
.header-content { display: flex; justify-content: space-between; align-items: center; }
.logo-section { display: flex; align-items: center; }
.logo-section img { width: 60px; height: auto; margin-right: 15px; }
.logo-text h1 { font-size: 24px; text-transform: uppercase; }
.logo-text p { font-size: 11px; color: #d00; font-weight: bold; border-top: 1px solid #d00; margin-top: -3px; }
.top-contacts { display: flex; flex-direction: column; text-align: right; }
.top-contacts a { color: #fff; text-decoration: none; font-size: 14px; margin-bottom: 5px; }

/* Hero Bölümü */
.hero-section {
    background: linear-gradient(rgba(0,0,0,0.75), rgba(0,0,0,0.75)), url('tir.jpg') center/cover no-repeat;
    min-height: 80vh;
    display: flex;
    align-items: center;
    text-align: center;
    padding: 20px 0;
}
.hero-overlay h2 { font-size: 40px; margin-bottom: 10px; }
.locations { color: #f1c40f; font-weight: bold; font-size: 22px; margin-bottom: 25px; }

/* Buton Düzenlemesi */
.hero-btns { display: flex; gap: 15px; justify-content: center; margin-bottom: 25px; flex-wrap: wrap; }
.main-call-btn {
    background-color: #b30000;
    color: white;
    padding: 12px 25px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 50px;
    font-size: 18px;
    min-width: 180px;
    text-align: center;
}
.main-call-btn.whatsapp { background-color: #25D366; }

.hakkimizda-box {
    margin: 20px auto;
    background: rgba(0, 0, 0, 0.85);
    padding: 20px;
    border-radius: 12px;
    max-width: 800px;
    border: 1px solid #444;
}

/* Hizmetler */
.services-section { padding: 50px 0; }
.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}
.item { background: #1e1e1e; padding: 25px; border-radius: 10px; text-align: center; border-bottom: 4px solid #b30000; }
.item span { font-size: 35px; display: block; margin-bottom: 10px; }

/* Footer */
.footer-bar { background: #000; padding: 25px 0; text-align: center; border-top: 3px solid #b30000; }
.footer-badge { background: #fff; color: #000; padding: 6px 15px; border-radius: 20px; font-weight: bold; display: inline-block; }

/* --- MOBİL UYUM (SİHİRLİ DOKUNUŞ) --- */
@media screen and (max-width: 768px) {
    .header-content { flex-direction: column; gap: 15px; }
    .top-contacts { text-align: center; }
    .hero-overlay h2 { font-size: 26px; }
    .locations { font-size: 18px; }
    
    /* Butonları mobilde alt alta ve tam genişlik yapıyoruz */
    .hero-btns { flex-direction: column; align-items: center; width: 100%; padding: 0 10px; }
    .main-call-btn { width: 90%; max-width: 300px; }

    .services-grid { grid-template-columns: 1fr 1fr; gap: 10px; } /* Yan yana ikişerli hizmet */
    .item { padding: 15px; }
    .item span { font-size: 25px; }
    .item p { font-size: 13px; }
}