/* GENEL AYARLAR */
        :root {
            --primary-color: #1A3663; /* Kurumsal Lacivert */
            --accent-color: #EF6923;  /* Vurgu Rengi (Turuncu) */
            --text-color: #333;
            --bg-color: #ffffff;
            --gray-light: #f9f9f9;
        }

        * { margin: 0; padding: 0; box-sizing: border-box; }
        body { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; background-color: var(--bg-color); color: var(--text-color); line-height: 1.6; }
        a { text-decoration: none; color: inherit; transition: 0.3s; }
        ul { list-style: none; }

        /* CONTAINER (Site Genişliği) */
        .container {
            width: 90%;
            max-width: 1140px; 
            margin: 0 auto;
        }

        /* 1. TOP BAR */
        .top-bar {
            background-color: var(--primary-color);
            color: #fff;
            padding: 10px 0;
            font-size: 0.85rem;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }
        .top-bar .container {
            display: flex; justify-content: flex-end; align-items: center; gap: 25px; flex-wrap: wrap;
        }
        .top-bar a { color: #fff; opacity: 0.9; display: flex; align-items: center; gap: 8px; }
        .top-bar a:hover { opacity: 1; color: var(--accent-color); }

        .lang-switch {
            display: flex; align-items: center; gap: 10px; padding-left: 20px; border-left: 1px solid rgba(255,255,255,0.3); margin-left: 10px;
        }
        .lang-switch a { font-weight: bold; letter-spacing: 1px; }
        .lang-switch a.active { color: var(--accent-color); border-bottom: 1px solid var(--accent-color); }

        /* 2. HEADER */
        header {
            background-color: #fff;
            box-shadow: 0 2px 10px rgba(0,0,0,0.08);
            position: sticky; top: 0; z-index: 1000; padding: 20px 0;
        }
        .nav-container { display: flex; justify-content: space-between; align-items: center; }
        .logo { font-size: 1.8rem; font-weight: 800; color: var(--primary-color); letter-spacing: -1px; text-transform: uppercase; }
        .logo .highlight { color: var(--accent-color); }
        
        .nav-links { display: flex; gap: 30px; }
        .nav-links a { font-weight: 600; color: var(--primary-color); text-transform: uppercase; font-size: 0.9rem; position: relative; }
        .nav-links a:hover { color: var(--accent-color); }
        
        .burger { display: none; font-size: 1.8rem; color: var(--primary-color); cursor: pointer; }

        /* --- 3. HERO BANNER (GÜNCELLENDİ) --- */
        #hero {
            width: 100%;
            height: 600px;
            /* Genco'nun Sihirli Dokunuşu: Drive Linki Düzenlendi */
            background: url('/images/ppy-banner.jpg'); 
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            color: #1A3663;
            padding: 0 20px;
            position: relative;
            border-bottom: 5px solid var(--accent-color);
        }

        .hero-content {
            max-width: 900px;
            animation: fadeIn 1.5s ease;
        }

        .hero-content h1 {
            font-size: 3.5rem; /* Büyük, güçlü font */
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: -1px;
            margin-bottom: 15px;
            line-height: 1.1;
            text-shadow: 0 4px 15px rgba(0,0,0,0.6); /* Okunurluk için gölge */
        }

        .hero-content p {
            font-size: 1.3rem;
            font-weight: 300;
            opacity: 0.9;
            text-shadow: 0 2px 5px rgba(0,0,0,0.5);
        }

        /* Giriş Animasyonu */
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }

       /* --- 4. HAKKIMIZDA (REVİZE: YAN YANA DÜZEN) --- */
    #about { 
        padding: 100px 0; 
        background: #fff; 
        overflow: hidden; /* Taşmaları engelle */
    }

    /* Kapsayıcıyı Flex yapıyoruz (Yan yana dizmek için) */
    .about-wrapper {
        display: flex;
        align-items: center; /* Dikeyde ortala */
        justify-content: space-between;
        gap: 60px; /* Yazı ile Resim arası boşluk */
    }

    /* Sol Taraf: Metin */
    .about-content {
        flex: 1; /* Mevcut alanın yarısını al */
    }

    .about-text {
        color: #555;
        font-size: 1.05rem;
        line-height: 1.7;
        margin-bottom: 20px;
        text-align: left; /* Kurumsal duruş için sola yaslı */
    }
    
    .about-text p { margin-bottom: 15px; } /* Paragraf araları */

    /* Sağ Taraf: Görsel */
    .about-image {
        flex: 1; /* Diğer yarıyı al */
        position: relative;
    }

    .about-image img {
        width: 100%;       /* Bulunduğu kutuya sığsın */
        height: auto;      /* Oran bozulmasın */
        border-radius: 12px; /* Köşeleri yumuşat */
        box-shadow: 0 20px 40px rgba(0,0,0,0.1); /* Hafif derinlik */
        object-fit: cover;
    }

    /* MOBİL DÜZENLEME */
    @media (max-width: 768px) {
        .about-wrapper {
            flex-direction: column; /* Mobilde alt alta olsun */
            gap: 40px;
        }
        .about-text {text-align: left;} /* Mobilde ortalı yazı daha iyi okunur */
        .section-title { text-align: center; display: block; margin: 0 auto 30px auto; }
        .section-title::after { margin: 10px auto 0; } /* Çizgiyi ortala */
    }

        /* 5. ŞİRKETLERİMİZ (FLEXBOX 3+2 DÜZENİ) */
        #companies { padding: 90px 0; background-color: var(--gray-light); }
        
        .companies-grid {
            display: flex;
            flex-wrap: wrap;
            justify-content: center; /* ALTAKİLERİ ORTALA */
            gap: 30px;
            margin-top: 50px;
        }

        .companies-grid > a {
            flex-basis: calc(33.333% - 40px); /* 3 tane sığdır */
            max-width: 350px;
            min-width: 280px;
        }

        .company-card {
            background: #fff; padding: 50px 20px; text-align: center; border-radius: 12px; 
            box-shadow: 0 5px 15px rgba(0,0,0,0.03); transition: all 0.4s ease; 
            cursor: pointer; border: 1px solid transparent; 
            display: flex; flex-direction: column; align-items: center; justify-content: center; 
            height: 250px; width: 100%;
        }
        .company-card:hover { transform: translateY(-10px) scale(1.02); box-shadow: 0 20px 40px rgba(26, 54, 99, 0.15); border-color: var(--accent-color); }
        .company-logo-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #999; font-weight: bold; font-size: 1.2rem; background: #f0f0f0; border-radius: 8px; }
        .company-logo-img { max-width: 80%;
    /* max-height: 80%; */
    object-fit: cover;}

        /* 6. İLETİŞİM */
        #contact { padding: 90px 0; }
        .contact-wrapper { display: flex; flex-wrap: wrap; gap: 50px; margin-top: 40px; }
        .contact-info { flex: 1; min-width: 300px; padding: 20px; }
        .contact-item { display: flex; align-items: flex-start; margin-bottom: 30px; }
        .contact-icon { color: var(--accent-color); font-size: 1.5rem; margin-right: 20px; margin-top: 5px; }
        .contact-text h4 { color: var(--primary-color); margin-bottom: 5px; font-size: 1.1rem; }
        .contact-text p { color: #666; font-size: 1rem; }
        .map-container { flex: 1.5; min-width: 300px; height: 400px; border-radius: 12px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
        .map-frame { width: 100%; height: 100%; border: 0; }

        /* FOOTER */
        footer { background-color: var(--primary-color); color: #fff; padding: 30px 0; text-align: center; font-size: 0.9rem; border-top: 5px solid var(--accent-color); }

        /* MOBİL AYARLAR */
     /* MOBİL MENÜ REVİZESİ */
          @media (max-width: 400px) {
                    .hero-content h1 {font-size: 1.5rem!important;}
                    .hero-content p {font-size: 0,7rem!important;}    
              
              #hero {
                    height: 300px!important;
                   background-size: cover!important;
                background-position: center!important;
                background-repeat: no-repeat!important;
                } 
          }
        @media (max-width: 768px) {
            .container { width: 95%; }
            
            /* Banner Mobilde Küçülsün */
            #hero { height: 500px; background-position: center top; }
            .hero-content h1 { font-size: 2.2rem; }
            .hero-content p { font-size: 1rem; }

            /* Şirketler Mobilde Tek Kolon */
            .companies-grid > a { flex-basis: 100%; max-width: 100%; }

            /* Top Bar ve Menü */
            .top-bar .container { justify-content: center; gap: 15px; }
            .lang-switch { border-left: none; padding-left: 0; margin-left: 0; border-top: 1px solid rgba(255,255,255,0.3); padding-top: 5px; width: 100%; justify-content: center; }
            .burger { display: block; right: 20px !important;
        position: absolute;}
            
            /* --- KRİTİK DÜZELTME BURADA --- */
            .nav-links {
                display: none!important;
                position: absolute;
                right: 0;
                /* height: 92vh;  <-- ESKİSİNİ İPTAL ETTİK */
                height: auto;  /* YENİ: Sadece linkler kadar yer kapla */
                padding: 30px 0; /* Üstten alttan biraz nefes payı */
                top: 100%; /* YENİ: Header'ın tam bittiği yerden başla */
                background-color: #fff;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                width: 100%;
                transform: translateX(100%);
                transition: transform 0.4s ease-in;
                
                /* Gölgeyi sadece aşağı doğru verelim ki havada duruyor gibi olsun */
                box-shadow: 0 15px 15px rgba(0,0,0,0.1);
                border-top: 1px solid #eee;
            }
			
			.section-title{
				text-align:center!important;
			}
            /* ----------------------------- */

            .nav-links.nav-active {transform: translateX(0%);display: flex!important;}
            .nav-links li { margin: 15px 0; opacity: 0; } /* Link aralarını biraz sıkılaştırdım (20px -> 15px) */
        }
        @keyframes navLinkFade { from { opacity: 0; transform: translateX(50px); } to { opacity: 1; transform: translateX(0); } }