:root { 
    --primary: #f39c12;    /* Canlı Turuncu (Dikkat çeker) */
    --secondary: #2c3e50;  /* Koyu Lacivert (Güven verir) */
    --light: #f9f9f9; 
    --white: #ffffff;
}

/* Tüm sayfaya yumuşak bir geçiş efekti ekleyelim */
* { transition: all 0.3s ease-in-out; scroll-behavior: smooth; }

/* Hizmet kartlarına ve butonlara hafif bir yükselme efekti */
.service-card:hover, .cta-button:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}

/* Markalar (Carousel) Alanı için Animasyon */
@keyframes scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-250px * 7)); }
}

/* Header */
.top-bar { background: var(--dark); color: white; padding: 10px 0; text-align: center; }
.call-btn { background: var(--primary); color: white; padding: 5px 15px; border-radius: 5px; text-decoration: none; margin-left: 10px; font-weight: bold; }
.main-nav { display: flex; justify-content: space-between; align-items: center; padding: 20px 0; }
.nav-links { display: flex; list-style: none; gap: 20px; }
.nav-links a { text-decoration: none; color: var(--dark); font-weight: 500; }

/* Hero */
.hero { background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url('assets/hero-bg.jpg'); 
        background-size: cover; color: white; padding: 100px 0; text-align: center; }
.hero h1 span { color: var(--primary); }
.cta-button { display: inline-block; background: var(--primary); color: white; padding: 15px 30px; text-decoration: none; font-size: 20px; border-radius: 50px; margin-top: 20px; animation: pulse 2s infinite; }

/* Services & Gallery Grid */
.services-grid, .gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; margin-bottom: 50px; }
.service-card { background: var(--light); padding: 30px; text-align: center; border-radius: 10px; transition: 0.3s; }
.service-card:hover { transform: translateY(-10px); background: #fff; box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.service-card i { font-size: 40px; color: var(--primary); }

.gallery-item img { width: 100%; height: 250px; object-fit: cover; border-radius: 10px; }

/* Mobil Uyumluluk */
@media (max-width: 768px) {
    .nav-links { display: none; } /* Basitlik için mobilde menüyü gizledik */
    .hero h1 { font-size: 28px; }
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}


/* ===== MARKA CAROUSEL ===== */

.marka-carousel {
    padding: 60px 0;
    background: var(--light);
    overflow: hidden;
}

.marka-wrapper {
    overflow: hidden;
}

.marka-track {
    display: flex;
    gap: 60px;
    width: max-content;
    animation: scroll 35s linear infinite;
}

.marka-item {
    width: 150px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.marka-item img {
    max-width: 120px;
    max-height: 60px;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.7;
}

.marka-item img:hover {
    filter: grayscale(0%);
    opacity: 1;
}
.seo-intro {
    font-size: 15px;
    max-width: 800px;
    margin: 15px auto 30px auto;
    text-align: center;
    line-height: 1.6;
    opacity: 0.9;
}

.seo-block {
    padding: 50px 0;
    background: #fafafa;
}

.seo-block h2 {
    text-align: center;
    margin-bottom: 20px;
}

.seo-block p {
    max-width: 900px;
    margin: 0 auto 15px auto;
    line-height: 1.7;
}
/* ===== EDITOR ICERIK RESPONSIVE AYARLARI ===== */

.entry-content {
    width: 100%;
    overflow-x: hidden; /* Sağdan taşmaları engeller */
    word-wrap: break-word;
}

/* Editörden gelen resimleri terbiye eden asıl kısım */
.entry-content img {
    max-width: 100% !important; /* Resmin genişliğini ekranla sınırlar */
    height: auto !important;    /* Orantılı küçültür */
    width: auto !important;      /* Sabit px değerlerini (800px gibi) ezer */
    display: block;
    margin: 20px auto;          /* Mobilde ortalar */
}

/* Editörden gelen video veya haritaların taşmasını engeller */
.entry-content iframe, 
.entry-content video {
    max-width: 100% !important;
    height: auto !important;
}

/* Mobil için ek dokunuşlar */
@media (max-width: 768px) {
    .entry-content {
        font-size: 16px;
        line-height: 1.6;
        padding: 0 10px; /* Kenarlara çok yapışmasın */
    }
    
    .section-padding {
        padding: 30px 0; /* Mobilde dikey boşlukları daraltalım */
    }
}
@media (max-width: 768px) {
    section#home {
        /* Üst ve alt padding'i artırarak resmi dikeyde açıyoruz */
        padding: 120px 0 80px 0 !important; 
        
        /* Resmin tam ortasını değil, senin için önemli olan kısmını gösterelim */
        /* Eğer resmin üstü önemliyse 'center top', altı önemliyse 'center bottom' dene */
        background-position: center center !important; 
        
        background-size: cover !important;
        background-repeat: no-repeat !important;
        
        /* Mobilde minimum bir yükseklik sınırı koyalım */
        min-height: 450px !important;
        
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    section#home h1 {
        font-size: 24px !important;
        line-height: 1.3 !important;
        /* Yazının arkasındaki resim karışık olsa bile okunmasını sağlar */
        text-shadow: 2px 2px 4px rgba(0,0,0,0.7); 
        margin-bottom: 15px !important;
    }

    /* Tanıtım metnini biraz daha toparlayalım */
    .seo-intro {
        font-size: 14px !important;
        line-height: 1.5 !important;
        margin-bottom: 25px !important;
        text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
    }
}