/* --------------------------Anasayfa------------------ */


/* Sayfa kaymaya devam eder ama sağdaki çubuk görünmez */
html, body {
    scrollbar-width: none; /* Firefox için */
    -ms-overflow-style: none; /* Internet Explorer ve eski Edge için */
}

html::-webkit-scrollbar {
    display: none; /* Chrome, Safari ve yeni Opera/Edge için */
}


/* --- 1. TEMEL SIFIRLAMA VE SABİTLEME --- */
html, body { 
    height: 100%; 
    margin: 0; 
    padding: 0; 
    width: 100%; 
    overflow-x: hidden; 
}

body { 
    display: flex; 
    flex-direction: column; 
    font-family: 'Segoe UI', Arial, sans-serif; 
    color: #222; 
    line-height: 1.6; 
    padding-top: 90px; 
    background-color: #ffffff; 
}

section { flex: 1 0 auto; } 

.konteyner { width: 90%; max-width: 1200px; margin: 0 auto; }

/* --- 2. HEADER --- */
.ust-bar { 
    background: #ffffff; 
    height: 90px; 
    display: flex; 
    align-items: center; 
    position: fixed; 
    top: 0; 
    width: 100%; 
    z-index: 9999; 
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08); 
}

.ust-icerik { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    width: 90%; 
    max-width: 1200px;
    margin: 0 auto;
}

.logo img { height: 60px; display: block; }

.ana-menu ul { 
    display: flex; 
    list-style: none; 
    gap: 20px; 
    align-items: center; 
} 

.nav-link { 
    text-decoration: none; 
    color: #1a4a8d; 
    font-weight: 700; 
    text-transform: uppercase; 
    font-size: 0.95rem; 
    transition: 0.3s; 
    position: relative; 
    padding: 10px 25px; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    text-align: center;
}

.nav-link::after { 
    content: ""; 
    position: absolute; 
    width: 0; 
    height: 3px; 
    bottom: 0; 
    left: 0; 
    background-color: #1a4a8d; 
    transition: width 0.4s ease-in-out; 
}

.nav-link:hover::after { width: 100%; }
.nav-link:hover { color: #1a4a8d; }

/* --- 3. SLIDER (LACİVERT BUTON & PARLAYAN EFEKT) --- */
.slider-alani { 
    position: relative; 
    width: 100%; 
    height: 550px; 
    background: #000; 
    overflow: hidden; 
}

.slider-alani::after { 
    content: ""; 
    position: absolute; 
    top: 0; left: 0; 
    width: 100%; height: 100%; 
    /* Resmin canlılığını bozmayan en hafif karartma */
    background: rgba(0, 0, 0, 0.25); 
    z-index: 2; 
}

.slider-img { 
    position: absolute; 
    width: 100%; height: 100%; 
    object-fit: cover; 
    opacity: 0; 
    /* Brightness 1.25 yaparak resmi %25 daha parlak hale getiriyoruz */
    /* Contrast 1.1 ile renklerin (mavi ve kırmızı çizgilerin) netliğini artırıyoruz */
    filter: brightness(1.25) contrast(1.1); 
    transition: opacity 1.5s ease-in-out, transform 8s linear; 
    z-index: 1; 
}

.slider-metin { 
    position: absolute; 
    z-index: 10; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    text-align: center; 
    color: white; 
    width: 90%; 
}

/* Başlık ve alt yazıyı kumaşın üzerinden havaya kaldırır */
.slider-icerik h2, 
.slider-icerik p {
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 1); /* Yazının arkasına simsiyah, keskin bir gölge atar */
    font-weight: 600; /* Harfleri biraz daha dolgun yapar */
}

/* LOGO: Tam Ortada */
.slider-logo { 
    max-width: 200px; 
    margin: 0 auto 25px auto; 
    display: block; 
}

/* YAZI STİLİ: Daha Farklı, Modern ve Lüks */
.slider-metin h1 {
    font-size: 2.8rem;
    font-weight: 300; /* Daha ince ve zarif bir font ağırlığı */
    text-transform: uppercase;
    letter-spacing: 6px; /* Harf aralarını açarak "Premium" hava kattık */
    margin-bottom: 30px;
    text-shadow: 0 4px 15px rgba(0,0,0,0.4);
}

.slider-metin h1 strong {
    font-weight: 800; /* Önemli kelimeyi kalınlaştırır */
    display: block;
    letter-spacing: 2px;
}


/* BUTON: Kurumsal Lacivert ve Parlama Efekti */
.btn-incele { 
    display: inline-block; 
    background: #001f54; /* Koyu Kurumsal Lacivert */
    color: white; 
    padding: 15px 45px; 
    text-decoration: none; 
    border-radius: 50px; 
    font-weight: 700; 
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 1.5px;
    transition: 0.5s all ease; 
    border: 1px solid rgba(255,255,255,0.2);
    position: relative;
    overflow: hidden; /* Parlama için gerekli */
}

/* Hover'da Parlama ve Canlanma Efekti */
.btn-incele:hover { 
    transform: translateY(-5px); 
    background: #1a4a8d; /* Hover'da biraz daha canlı mavi */
    box-shadow: 0 0 25px rgba(26, 74, 141, 0.6); /* Butonun etrafı parlar */
    border-color: #ffffff;
}

/* Butonun içinden geçen o şık parlama çizgisi (Glossy Effect) */
.btn-incele::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, transparent, rgba(255,255,255,0.3), transparent);
    transition: 0.5s;
}

.btn-incele:hover::before {
    left: 150%; /* Üzerine gelince ışık hızıyla geçer */
}



/* --- 4. HİZMETLERİMİZ (EN GÜNCEL - FİT VE KURUMSAL ÖLÇÜLER) --- */
.hizmetler-dis-alan { 
    padding: 70px 0; /* Boşluklar biraz daha dengeli hale getirildi */
    background-color: #f8f9fa; 
}

/* 1. BAŞLIK: Tam Ortada ve Daha Zarif (2.3rem) */
.anasayfa-ozel-baslik {
    text-align: center;
    margin-bottom: 50px;
    width: 100%;
}

.anasayfa-ozel-baslik h2 {
    color: #001f54;
    font-size: 2.3rem; /* Daha rafine bir büyüklük */
    font-weight: 800;
    text-transform: uppercase;
    margin: 0 auto 12px auto;
    letter-spacing: 1px;
    display: block;
}

/* Başlığın altındaki kurumsal yatay çizgi */
.anasayfa-ozel-baslik .baslik-cizgi {
    width: 60px; /* Biraz daraltıldı, daha şık durur */
    height: 4px;
    background: #001f54;
    margin: 0 auto;
    border-radius: 50px;
}

/* 2. KARTLAR: Yan Yana ve Sıkılaştırılmış */
.kartlar-grubu { 
    display: flex; 
    gap: 25px; 
    flex-wrap: nowrap; 
    justify-content: center; 
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}

/* 3. KART TASARIMI: Hakkımızda Stili (Tam Ortalı ve Fit) */
.kategori-kart { 
    background: #ffffff; 
    flex: 1; 
    padding: 35px 25px; /* İç boşluklar 50'den 35'e çekildi, kart daha fit */
    border-radius: 20px; 
    box-shadow: 0 10px 35px rgba(0,0,0,0.05); 
    
    /* İSTEDİĞİN O SOL LACİVERT ÇİZGİ (İdeal Kalınlık) */
    border-left: 10px solid #001f54; 
    
    /* İÇERİK: Tam Ortada */
    text-align: center; 
    display: flex;
    flex-direction: column;
    align-items: center; 
    justify-content: center;
    
    transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.kategori-kart:hover { 
    transform: translateY(-10px); 
    box-shadow: 0 20px 45px rgba(0,0,0,0.1);
}

/* Kart İçi İkon - Daha Dengeli (3rem) */
.hizmet-ikon { 
    font-size: 3rem; 
    margin-bottom: 20px; 
    display: block; 
}

/* Kart İçi Başlık */
.kategori-kart h3 { 
    color: #001f54; 
    font-size: 1.25rem; 
    font-weight: 800;
    margin-bottom: 12px; 
    text-transform: uppercase;
}

/* Kart İçi Açıklama Metni */
.kategori-kart p { 
    color: #000; 
    font-size: 0.92rem; 
    line-height: 1.5; 
    margin: 0;
}

/* --- MOBİL İÇİN KESİN ÇÖZÜM: ALT ALTA VE FİT --- */
@media (max-width: 992px) {
    .kartlar-grubu { 
        display: flex !important;
        flex-direction: column !important; /* YAN YANA GELMEYİ ENGELLER, ALT ALTA DİZER */
        align-items: center !important;    /* KUTULARI ORTALAR */
        gap: 25px !important;
        width: 100% !important;
        padding: 0 !important;
    }
    
    .kategori-kart { 
        /* Genişlik ayarı: Ekranın %82'si kadar, yanlar boş kalır */
        width: 82% !important; 
        min-width: 82% !important; 
        max-width: 330px !important; 
        margin: 0 auto !important; 
        padding: 25px 20px !important;
        
        /* Tasarım Detayları */
        flex: none !important; /* Kartların büyümesini/küçülmesini engeller */
        border-left: 8px solid #001f54 !important; 
    }

    .hizmet-ikon { 
        font-size: 2.5rem !important; 
    }

    .kategori-kart h3 { 
        font-size: 1.15rem !important; 
    }
}

/* Footer üst boşluk ayarı */
.pimateks-footer { 
    padding: 40px 0 20px 0; /* Üst boşluk 60'tan 40'a çekildi */
}
.kategori-kart:hover { transform: translateY(-15px); box-shadow: 0 15px 35px rgba(0,0,0,0.1); }
.hizmet-ikon { font-size: 4rem; margin-bottom: 25px; display: block; }

/* --- 5. FOOTER (GÜNCELLENMİŞ VE RENKLER SABİTLENMİŞ) --- */
#footer-sistemi { flex-shrink: 0; }
.pimateks-footer { background-color: #001f54; color: #ffffff !important; padding: 60px 0 20px 0; font-size: 0.9rem; }
.footer-ust-icerik { display: flex; flex-wrap: wrap; gap: 120px; justify-content: center; }
.footer-blok-menu, .footer-blok-iletisim { min-width: 250px; color: #ffffff; }

.footer-blok-menu h4, .footer-blok-iletisim h4 { 
    color: #ffffff; margin-bottom: 20px; font-size: 1.1rem; border-bottom: 2px solid #ffffff; 
    display: table; padding-bottom: 5px; 
}

.footer-blok-menu ul { list-style: none; padding: 0; margin: 0; }
.footer-blok-menu ul li { margin-bottom: 12px; display: flex; align-items: center; gap: 10px; color: #ffffff; }

/* Footer Linkleri ve Hover Efekti */
.footer-blok-menu ul li a, .iletisim-item a { 
    color: #ffffff !important; 
    text-decoration: none; 
    transition: 0.3s; 
    position: relative;
    padding-bottom: 2px;
}

.footer-blok-menu ul li a::after { 
    content: ""; position: absolute; width: 0; height: 1px; bottom: 0; left: 0; 
    background-color: #ffffff; transition: width 0.3s ease-in-out; 
}

.footer-blok-menu ul li a:hover::after { width: 100%; }
.footer-blok-menu ul li a:hover { padding-left: 5px; opacity: 1; }

.iletisim-item { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 15px; color: #ffffff; }

.footer-alt-telif { 
    border-top: 1px solid rgba(255,255,255,0.1); margin-top: 40px; padding-top: 20px; 
    text-align: center; color: #cccccc; font-size: 0.8rem; 
}

/* --- 6. MOBİL MENU (HAMBURGER TOGGLE) --- */
.menu-ikon { display: none; flex-direction: column; gap: 5px; cursor: pointer; z-index: 10001; }
.menu-ikon span { display: block; width: 28px; height: 3px; background-color: #1a4a8d; transition: 0.3s; }
.menu-ikon.acik span:nth-child(1) { transform: rotate(45deg) translate(5px, 6px); }
.menu-ikon.acik span:nth-child(2) { opacity: 0; }
.menu-ikon.acik span:nth-child(3) { transform: rotate(-45deg) translate(5px, -6px); }

/* --- 6. MOBİL MENU & FOOTER DÜZENLEME --- */
@media (max-width: 992px) {
    .menu-ikon { display: flex; }
    
    .ana-menu { 
        position: fixed; right: -100%; top: 0; height: 100vh; width: 70%; 
        background: #fff; display: flex; flex-direction: column; 
        align-items: center; justify-content: center; transition: 0.5s ease-in-out; 
        z-index: 10000; box-shadow: -10px 0 20px rgba(0,0,0,0.1);
    }
    
    .ana-menu.aktif { right: 0; }
    
    /* Mobil Menü Listesi */
    .ana-menu ul { flex-direction: column; gap: 15px; text-align: center; width: 100%; padding: 0; }
    .nav-link { padding: 10px 0; width: 100%; display: block; }
    .nav-link::after { left: 0; width: 0; }
    .nav-link:hover::after { width: 100%; }

    /* --- FOTOĞRAFTAKİ SOLA DAYALI MOBİL FOOTER --- */
    .footer-ust-icerik { 
        flex-direction: column; 
        align-items: flex-start; /* Başlık ve içerikleri sola yaslar */
        gap: 30px; /* İki blok arasındaki devasa boşluğu daralttık */
        padding-left: 5%; /* Ekrana tamamen yapışmaması için estetik boşluk */
    }

    .footer-blok-menu, .footer-blok-iletisim { 
        min-width: unset; 
        width: 100%; 
        text-align: left; /* Metin yönünü sola çeker */
    }

    .footer-blok-menu h4, .footer-blok-iletisim h4 {
        margin-left: 0; /* Başlık altındaki çizgiyi ve metni sola hizalar */
    }

    .footer-blok-menu ul li { 
        justify-content: flex-start; /* Link oklarını sola yaslar */
    }

    .iletisim-item { 
        justify-content: flex-start; /* İkonları ve adres bilgilerini sola yaslar */
        text-align: left;
    }

    .footer-alt-telif {
        margin-top: 30px;
        font-size: 0.75rem;
    }
}



/* ---------------------Hakkımızda----------------------------- */
/* ---------------------Hakkımızda Sayfası (GÜNCEL & ORTALI)----------------------------- */

/* 1. SAYFA GENELİ */
.kurumsal-sayfa {
    background-color: #f8f9fa !important;
    padding-bottom: 120px;
    padding-top: 30px; /* Header'a biraz daha yaklaştırdık */
}

/* 2. BAŞLIK ALANI (TAM ORTALI) */
.kurumsal-sayfa .sayfa-baslik {
    width: 100%;
    text-align: center; /* Yazıyı tam ortaya çeker */
    padding: 20px 0 40px;
    background: transparent !important;
}

.kurumsal-sayfa .sayfa-baslik h1 {
    font-size: 2.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    display: block;
    color: #003366;
    
}


/* Diğer sayfalarla aynı olan o meşhur alt çizgi */
.kurumsal-sayfa .baslik-alt-cizgi {
    width: 80px;
    height: 5px;
    background: #003366; /* Parlak Mavi */
    margin: 10px auto 15px !important; /* "auto" değeri çizgiyi tam ortaya alır */
    border-radius: 5px;
}

.kurumsal-sayfa .sayfa-baslik p {
    font-size: 1.1rem;
    color: #000;
    font-weight: 600;
    margin: 5px auto 0 auto;
}

/* 3. İZGARA DÜZENİ */
.hakkimizda-izgara-yeni {
    display: flex;
    gap: 40px;
    align-items: center; /* Kartların tepeden hizalanması için */
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
    width: 90%;
}

/* 4. SOL TARAF: TARİHÇE KARTI (METİN KÜÇÜLTÜLDÜ) */
.hakkimizda-tarihce-kart {
    flex: 2.2;
    background: #ffffff;
    border-radius: 20px;
    padding: 40px; 
    box-shadow: 0 15px 45px rgba(0,0,0,0.06);
    border-left: 10px solid #001f54 !important; /* Kurumsal kalın şerit */
}

/* Yazı altındaki istenmeyen çizgileri silen ve boyutu küçülten kısım */
.hakkimizda-tarihce-kart p {
    font-size: 1.05rem !important; /* Metin senin istediğin gibi kibarlaştırıldı */
    line-height: 1.7;
    color: #000;
    font-weight: 400;
    text-decoration: none !important; /* "Aldığımız güçle" altındaki çizgiyi siler */
    border-bottom: none !important;
    margin-bottom: 10px;
}


/* 5. SAĞ TARAF: TECRÜBE KARTI (FİT BOYUT) */
.tecrube-alani-sag {
    flex: 1;
    display: flex;
    justify-content: center;
}

/* 5. SAĞ TARAF: TECRÜBE KARTI (KESİN HİZALAMA) */
.deneyim-badge-cerceve {
    position: relative;
    background: #001f54;
    color: white;
    width: 200px; /* Genişliği biraz artırdık ki + sığsın */
    height: 180px; 
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    box-shadow: 0 15px 35px rgba(0, 31, 84, 0.3);
}

.sayac-kutu strong { 
    font-size: 4.5rem; 
    line-height: 1; 
    font-weight: 800;
    color: #fff;
}

.sayac-kutu span { 
    font-size: 0.95rem; 
    font-weight: 700; 
    text-align: center;
    letter-spacing: 1px;
}

.yildiz-ust-ikon {
    position: absolute;
    /* 5px olan yeri 12px yaparak sayıdan uzaklaştırdık */
    top: 12px !important; 
    /* Boyutu bir tık küçülterek daha profesyonel bir 'mühür' havası verdik */
    font-size: 1.1rem !important; 
    color: #f1c40f; 
    width: 100%;
    text-align: center;
    left: 0;
}

/* Sayacın sayı kısmını biraz aşağı iterek yıldıza yer açıyoruz */
.sayac-kutu {
    margin-top: 20px !important; 
    display: flex;
    flex-direction: column;
    align-items: center;
}


/* MOBİL AYAR */
@media (max-width: 992px) {
    .hakkimizda-izgara-yeni { flex-direction: column; align-items: center;}
    .tecrube-alani-sag { order: -1; margin-bottom: 20px; }
}


/* --------------------------------Ürün----------------- */
/* ==========================================================================
   PİMATEKS ÜRÜNLER - SON GÜNCEL (KÜÇÜK RESİM & 3 COL & BOŞLUK)
   ========================================================================== */

/* 1. Ürünler Genel Bölüm Ayarı */
.urunler-bolumu {
    padding: 70px 0 100px 0 !important; /* Header mesafesi ve alt boşluk dengelendi */
    background-color: #fcfcfc;
}

/* 2. BAŞLIK VE ALT YAZI: ESKİ AHENGİ KORUR (TAM ORTALI) */
.urunler-bolumu .sayfa-baslik {
    text-align: center;
    margin-bottom: 60px; /* Kartlar ile arayı ferahlatır */
    padding: 0 !important;
}

.urunler-bolumu .sayfa-baslik h1 {
    font-size: 2.8rem;
    color: #003366; /* Kurumsal Lacivert */
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
}

/* Diğer sayfalarla aynı olan o meşhur alt çizgi */
.urunler-bolumu .baslik-alt-cizgi {
    width: 80px;
    height: 5px;
    background: #003366; 
    margin: 10px auto 15px !important; /* Tam ortalı */
    border-radius: 5px;
}

.urunler-bolumu .sayfa-baslik p {
    font-size: 1.15rem;
    color: #000;
    font-weight: 600;
    margin: 5px auto 0 auto;
    text-align: center; /* Alt yazıyı ortalar */
}

/* 3. Ürün Izgarası (Grid) - Masaüstünde 3 Kolon */
.urun-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Jilet gibi 3'lü dizilim */
    gap: 40px; /* Kartlar arası boşluk (sağ-sol-üst-alt) */
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* --- ÜRÜNLER KATALOG DÜZENİ (BEYAZ BOŞLUKLARI GİZLER) --- */
.urun-kart {
    /* Kartın arka planını sayfanın gri tonuyla eşitle */
    background: #fcfcfc !important; 
    border-radius: 12px;
    overflow: hidden;
    /* Dış çerçeveyi ve gölgeyi çok hafifletiyoruz ki boşluk belli olmasın */
    box-shadow: none !important; 
    border: none !important;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.urun-resim {
    width: 90%; /* Resim kutunun kenarlarına yapışmasın */
    height: 90%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.urun-kart-resim img {
    width: 100% !important;
    height: 250px !important; /* Tüm resimler için ortak bir yükseklik */
    object-fit: cover !important; /* Resmi sündürmez, uygun şekilde kırpar */
    object-position: center !important; /* Kumaşın tam ortasını gösterir */
    border-radius: 8px 8px 0 0 !important; /* Üst köşelere hafif radius */
}
/* ------------------------------ */


/* ==========================================================================
   PİMATEKS ÜRÜNLER - 2026 GÜNCEL CSS (BÜTÜNLEŞİK HOVER SİSTEMİ)
   ========================================================================== */

/* 1. Ürünler Genel Bölüm Ayarı */
.urunler-bolumu {
    padding: 70px 0 100px 0 !important;
    background-color: #fcfcfc;
}

/* 2. Başlık Tasarımı */
.urunler-bolumu .sayfa-baslik {
    text-align: center;
    margin-bottom: 60px;
}

.urunler-bolumu .sayfa-baslik h1 {
    font-size: 2.8rem;
    color: #003366;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.urunler-bolumu .baslik-alt-cizgi {
    width: 80px;
    height: 5px;
    background: #003366; 
    margin: 10px auto 15px !important;
    border-radius: 5px;
}

/* 3. Ürün Izgarası (Grid) */
.urun-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 4. ÜRÜN KARTLARI - ANA YAPI */
.urun-kart {
    position: relative;
    background-color: #fcfcfc;
    border-radius: 12px;
    height: 400px; /* Bilgi alanı için boyu optimize ettik */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    border: 2px solid transparent; /* Kaymayı önleyen gizli çerçeve */
    cursor: pointer !important;
}

/* 5. RESİM ALANI (ÜST KISIM) */
.urun-resim {
    width: 85%;
    height: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 25px;
    transition: transform 0.4s ease;
    z-index: 1;
}

.urun-resim img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain !important;
    mix-blend-mode: multiply;
    filter: contrast(1.05);
}

/* 6. ALT BİLGİ ALANI (İSİM VE DETAY) */
.urun-alt-bilgi {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px 10px;
    background: #ffffff;
    text-align: center;
    border-top: 1px solid #eee;
    transition: all 0.4s ease;
    z-index: 2;
}

.urun-alt-bilgi h3 {
    margin: 0;
    font-size: 1.1rem;
    color: #003366;
    font-weight: 700;
    text-transform: uppercase;
}

.urun-alt-bilgi p {
    margin: 5px 0 0 0;
    font-size: 0.9rem;
    color: #666;
    font-weight: 400;
}

/* 7. HOVER ANINDAKİ "NET" DEĞİŞİM */
.urun-kart:hover {
    transform: translateY(-12px);
    background-color: #ffffff !important;
    border: 2px solid #003366 !important;
    box-shadow: 0 15px 35px rgba(0, 51, 102, 0.15) !important;
}

/* Hover'da Alt Bilgi Bandı Lacivert Olur */
.urun-kart:hover .urun-alt-bilgi {
    background: #003366 !important; 
    border-top-color: #003366;
}

/* Hover'da Yazılar Beyaz Olur */
.urun-kart:hover .urun-alt-bilgi h3 {
    color: #ffffff !important;
}

.urun-kart:hover .urun-alt-bilgi p {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* Hover'da Resim Hafif Büyür ve Yukarı Kayar */
.urun-kart:hover .urun-resim {
    transform: scale(1.1) translateY(-10px);
}

/* 8. MOBİL UYUMLULUK */
@media (max-width: 992px) {
    .urun-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}

@media (max-width: 600px) {
    .urun-grid { 
        grid-template-columns: repeat(2, 1fr) !important; 
        gap: 12px; 
        padding: 0 10px;
    }
    .urun-kart { height: 260px; }
    .urun-alt-bilgi { padding: 12px 5px; }
    .urun-alt-bilgi h3 { font-size: 0.9rem; }
    .urun-alt-bilgi p { font-size: 0.75rem; }
    .urun-resim { height: 50%; margin-top: 15px; }
}

/* Modal ve Footer Arası Boşluk Fix */
#footer-sistemi { margin-top: -1px !important; }


/* --- ÜRÜN KARTLARI HOVER EFEKTİ (GÜNCEL LACİVERT ÇERÇEVE) --- */
.urun-kart {
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    position: relative;
    overflow: hidden;
    border: 2px solid transparent; /* Başlangıçta gizli çerçeve, kaymayı önler */
    background-color: #fcfcfc;
}

/* Kartın üzerine gelince (Hover) */
.urun-kart:hover {
    transform: translateY(-12px); /* 10 yerine 12 yaptık, daha klas durur */
    background-color: #ffffff !important;
    
    /* İSTEDİĞİN NET LACİVERT ÇERÇEVE */
    border: 2px solid #003366 !important; 
    
    /* Lacivert tonlu gölgeyi biraz daha yumuşattık */
    box-shadow: 0 15px 35px rgba(0, 51, 102, 0.2) !important; 
    z-index: 10;
}

/* Hover anında içindeki resmin tepkisi */
.urun-kart:hover .urun-resim img {
    transform: scale(1.1); /* Resim %10 büyüsün */
    filter: contrast(1.1) brightness(1.02); /* Hafif canlılık */
}

/* Mobilde hover efektini hafifletiyoruz */
@media (max-width: 600px) {
    .urun-kart:hover {
        transform: translateY(-5px);
        border-width: 1.5px; /* Mobilde daha ince çerçeve */
    }
}

/* Ürün detayı kalıntı temizliği */
.urun-detay { display: none !important; }

/* 6. Mobil Uyumluluk (Grid yapısı sende zaten var, ama bu alt kısımda kalsın) */
@media (max-width: 992px) {
    .urun-grid { 
        grid-template-columns: repeat(2, 1fr); 
        gap: 20px; 
    }
    .urun-kart { 
        height: 280px; 
    }
}

@media (max-width: 600px) {
    .urun-grid { 
        grid-template-columns: repeat(2, 1fr) !important; /* Mobilde zorunlu 2'li yap */
        gap: 12px; 
        padding: 0 10px;
    }
    .urun-kart { 
        height: 200px; /* Kartları mobilde küçülttük ki ekran dolsun */
        margin-bottom: 0px; 
    }
    
    .urunler-bolumu .sayfa-baslik h1 {
        font-size: 2rem;
    }
}

/* --- BEYAZ BAR VE MODAL FIX --- */
.urunler-bolumu {
    padding-bottom: 50px !important;
    margin-bottom: 0 !important;
}

main { margin-bottom: 0 !important; }
#footer-sistemi { margin-top: -1px !important; }

/* --- YENİ NESİL MODAL SİSTEMİ (MERKEZLEME GARANTİLİ) --- */
.modal-sistemi {
    display: none;
    position: fixed;
    z-index: 99999;
    left: 0; top: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
}

.modal-sistemi.aktif {
    display: flex !important;
}

/* X BUTONU FIX */
.modal-kapat {
    position: fixed !important;
    top: 20px;
    right: 20px;
    width: 60px;
    height: 60px;
    background: rgba(0, 0, 0, 0.6); /* Arkası koyu olsun ki her zaman görünsün */
    color: white;
    font-size: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    z-index: 999999 !important; /* En ama EN üstte */
    cursor: pointer;
    pointer-events: auto !important; /* Tıklanabilirliği zorunlu yap */
}

/* RESİM KONTEYNERI - KADRAJI SINIRLAR */
.modal-resim-alani {
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden; /* Resim buradan dışarı taşamaz */
    display: flex;
    align-items: center;
    justify-content: center;
}

#buyuk-resim {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    /* translate(-50%, -50%) resmi merkeze çiviler */
    transform: translate(-50%, -50%) scale(1);
    max-width: 90%;
    max-height: 85%;
    object-fit: contain;
    border: 5px solid #fff;
    border-radius: 10px;
    box-shadow: 0 0 30px rgba(0,0,0,0.5);
    transition: transform 0.1s ease-out;
    user-select: none;
    display: block;
}

/* MOBİL ÖZEL DÜZELTME */
@media (max-width: 600px) {
    .modal-kapat { 
        top: 15px; 
        right: 15px; 
        width: 45px; 
        height: 45px; 
        font-size: 30px;
    }
    #buyuk-resim { 
        max-width: 95%; 
        max-height: 80%;
        border-width: 3px; 
    }
}


/* ==========================================================================
   PIMATEKS İLETİŞİM SAYFASI - FİNAL GÜNCEL (ÇERÇEVESİZ & DEV HARİTA)
   ========================================================================== */

/* --- PİMATEKS İLETİŞİM SAYFASI - NİHAİ GÜNCELLEME --- */

/* 1. Sayfa Arka Planı (Tek Parça) */
.iletisim-sayfasi {
    background-color: #f8f9fa !important;
    padding-bottom: 80px;
}

/* 2. Başlık Alanı (Kesinlikle Çerçevesiz) */
.iletisim-sayfasi .sayfa-baslik-merkez {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 60px 0 20px 0 !important;
    text-align: center;
}

/* 3. Dev Başlık Yazısı */
.iletisim-sayfasi .dev-baslik {
    color: #001f54;
    font-size: 2.8rem;
    font-weight: 800;
    letter-spacing: 5px;
    text-transform: uppercase;
    border: none !important;
    margin: 0 !important;
}

/* 4. Mavi Alt Çizgi */
.iletisim-sayfasi .baslik-cizgi {
    width: 80px;
    height: 4px;
    background: #001f54;
    margin: 15px auto;
    border-radius: 50px;
}

/* 5. Alt Başlık Yazısı (Diğer Sayfalarla Aynı Ahenkte) */
.iletisim-sayfasi .sayfa-alt-metin {
    color: #000 !important; /* Belirgin Gri */
    font-size: 1.2rem !important;
    font-weight: 600 !important;
    margin-top: 10px !important;
    letter-spacing: 0.5px;
}

/* 6. İletişim Kartları ve Harita Konteynırı */
.iletisim-konteyner {
    display: flex;
    max-width: 1200px;
    margin: 40px auto 0;
    gap: 30px;
    align-items: stretch;
}

/* --- 2. İLETİŞİM İÇERİK (Senin Gönderdiğin Dev Harita Düzeni) --- */
.iletisim-icerik {
    background-color: #f8f9fa;
    padding: 20px 0 80px 0; /* Başlık ile kart arasını dengeler */
}

.iletisim-konteyner {
    display: flex;
    max-width: 1200px;
    margin: 0 auto; /* Negatif margin kaldırıldı, çünkü çerçeve yok artık */
    gap: 30px;
    align-items: stretch;
}

/* Sol Blok: Bilgiler */
.iletisim-sol {
    flex: 1;
    background: #fff;
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-left: 10px solid #001f54; /* Hakkımızda ile ahenk çizgisi */
}

.bize-ulasin-baslik {
    color: #001f54;
    font-size: 1.8rem;
    font-weight: 800;
    margin-bottom: 10px;
    text-align: left;
}

.form-ayrac {
    width: 45px;
    height: 5px;
    background: #001f54;
    margin: 0 0 35px 0;
    border-radius: 5px;
}

.iletisim-alt-bilgi {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.iletisim-alt-bilgi p {
    margin: 0;
    display: flex;
    align-items: flex-start;
    text-align: left;
    line-height: 1.5;
}

.iletisim-alt-bilgi i {
    color: #001f54;
    font-size: 1.2rem;
    min-width: 25px;
    margin-right: 15px;
    margin-top: 3px;
}

.iletisim-alt-bilgi a {
    text-decoration: none;
    color: #000;
    font-size: 1rem;
    font-weight: 600;
    transition: 0.3s;
}

/* Sağ Blok: Harita */
.iletisim-sag {
    flex: 1.5;
    min-height: 450px; /* Eğer bu yoksa harita 0 piksel görünür, yani görünmez! */
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
}

.harita-cerceve {
    width: 100%;
    height: 100%; /* İçindeki iframe'in kutuyu doldurmasını sağlar */
}

#header-sistemi { border: none !important; }

/* --- 3. MOBİL GÜNCELLEME (KRİTİK DEV HARİTA) --- */
@media (max-width: 992px) {
    .iletisim-konteyner { 
        flex-direction: column; 
        margin-top: 0; 
        padding: 0 15px; 
        height: auto !important;
    }
    
    .iletisim-sol {
        padding: 30px 20px;
        margin-bottom: 20px;
    }

    .iletisim-sag { 
        width: 100%; 
        height: 450px !important; /* Mobilde harita dev kalsın */
        min-height: 450px !important;
        border-radius: 20px;
    }

    .harita-cerceve {
        height: 450px !important;
    }

    .dev-baslik {
        font-size: 2.2rem;
    }
}

/* --- İLETİŞİM BİLGİLERİ HOVER EFEKTLERİ --- */

.bilgi-satiri {
    display: flex;
    align-items: center;
    padding: 5px 0;
    transition: all 0.4s ease; /* Yumuşak geçiş */
    cursor: pointer;
}

.bilgi-satiri i {
    color: #1a4a8d;
    font-size: 1.3rem;
    margin-right: 15px;
    transition: all 0.3s ease;
}

.bilgi-satiri a {
    text-decoration: none;
    color: #000;
    font-weight: 600;
    font-size: 1.05rem;
    transition: all 0.3s ease;
    position: relative;
}

/* HOVER DURUMU: Yazı Parlasın ve Sağa Kaysın */
.bilgi-satiri:hover {
    transform: translateX(10px); /* Hafif sağa kayma */
}

.bilgi-satiri:hover a {
    color: #1a4a8d; /* Kurumsal maviye dönüş */
    text-shadow: 0 0 8px rgba(26, 74, 141, 0.3); /* Hafif parlama (Glow) efekti */
}

.bilgi-satiri:hover i {
    transform: scale(1.2) rotate(-10deg); /* İkon büyür ve hafif döner */
    color: #1a4a8d;
}

/* Adres kısmı uzun olduğu için alt satıra geçerse hizalamayı koru */
.bilgi-satiri {
    align-items: flex-start;
}
.bilgi-satiri i {
    margin-top: 5px;
}

/* Harita kenarlarını daha yumuşak yapalım */
.iletisim-sag {
    border: 1px solid #eee;
    transition: 0.5s;
}
.iletisim-sag:hover {
    box-shadow: 0 15px 40px rgba(0, 31, 84, 0.1);
}

/* --------------------------------------------- */

/* --- DİL SEÇİCİ STİLLERİ (Ahengi Bozmadan Eklendi) --- */
.dil-secici {
    position: relative;
    cursor: pointer;
    font-family: 'Segoe UI', sans-serif;
    z-index: 10005; /* Menünün üstünde kalması için */
    background: #f8f9fa;
    padding: 8px 15px;
    border-radius: 20px;
    transition: 0.3s;
    border: 1px solid #eee;
}

.dil-secici:hover {
    background: #eee;
}

.secili-dil {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    color: #1a4a8d;
    font-size: 0.85rem;
}

.secili-dil img {
    width: 20px;
    height: auto;
    border-radius: 2px;
}

.dil-listesi {
    position: absolute;
    top: 110%;
    right: 0;
    background: white;
    list-style: none;
    padding: 10px 0;
    margin: 0;
    width: 120px;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    display: none; /* JS ile kontrol ediliyor */
    border: 1px solid #eee;
}

.dil-listesi li {
    padding: 8px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #333;
    transition: 0.2s;
}

.dil-listesi li:hover {
    background: #1a4a8d;
    color: white;
}

.dil-listesi li img {
    width: 18px;
}

/* Google Translate'in bozduğu tepe boşluğunu ve barı gizle */
body {
    top: 0 !important;
}
.goog-te-banner-frame, .skiptranslate {
    display: none !important;
}
.goog-text-highlight {
    background-color: transparent !important;
    box-shadow: none !important;
}

/* MOBİL UYUMLULUK: Mobilde dil seçiciyi hamburgerin yanına düzgünce yerleştir */
@media (max-width: 992px) {
    .header-sag-grup {
        gap: 10px !important;
    }
    .dil-secici {
        padding: 5px 10px;
    }
    .aktif-dil-ad {
        display: none; /* Mobilde sadece bayrak kalsın istersen açabilirsin */
    }
}

/* ------------------------- */


/* --- 7. YÜKLEME PERDESİ (PRELOADER) - AHENGİ KORUYAN SİSTEM --- */
#sayfa-yukleniyor {
    position: fixed;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    background: #ffffff; /* Sayfa açılmadan önceki temiz beyazlık */
    z-index: 999999; /* Header'dan (9999) çok daha üstte olmalı */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.5s ease, visibility 0.5s;
}

.yukleyici-icerik { 
    text-align: center; 
}

.yukleyici-icerik img { 
    height: 65px; 
    margin-bottom: 25px; 
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Kurumsal Spinner */
.spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #f3f3f3;
    border-top: 3px solid #1a4a8d; /* Pimateks Laciverti */
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin: 0 auto;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Perdeyi Kaldıran Klas (JS tarafından tetiklenir) */
.yukleme-bitti {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none;
}

/* --- 8. GOOGLE TRANSLATE TEMİZLİK AYARLARI --- */
/* Sayfanın tepesindeki istenmeyen boşlukları ve Google barını tamamen yok eder */
body {
    top: 0 !important;
}

.goog-te-banner-frame, 
.goog-te-banner, 
.skiptranslate, 
iframe.goog-te-menu-frame {
    display: none !important;
    visibility: hidden !important;
}

.goog-text-highlight {
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Mobilde Dil Seçici ve Hamburger Mesafesi */
@media (max-width: 992px) {
    .header-sag-grup {
        display: flex;
        align-items: center;
        gap: 12px !important; /* Hamburger ve Dil seçici arası mesafe */
    }
}

/* --- FOOTER SAĞ TARAF (KESİN ÇÖZÜM) --- */

/* 1. Linklerin temel duruşu (Kutu falan yok, tertemiz) */
.footer-blok-iletisim .iletisim-item a {
    text-decoration: none !important;
    color: #ffffff !important; /* Başlangıçta beyaz */
    background: transparent !important; /* Arka planı sıfırladık */
    padding: 0 !important;
    transition: all 0.3s ease-in-out !important;
    display: inline-block;
}

/* 2. Hover olduğunda: Arka plan gelmesin, sadece yazı parlasın */
.footer-blok-iletisim .iletisim-item:hover a {
    color: #ffffff !important; /* Yazı beyaz kalmaya devam etsin */
    background: transparent !important; /* Kutu oluşmasını engelledik */
    transform: translateX(10px); /* Hafif sağa kaysın (estetik durur) */
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.8), 0 0 20px rgba(26, 74, 141, 0.5) !important; /* Yazının etrafında hafif bir ışık huzmesi */
}

/* 3. İkonlar için de aynı temizlik */
.footer-blok-iletisim .iletisim-item:hover i {
    color: #1a4a8d !important; /* Sadece ikon lacivert olsun ki fark edilsin */
    transform: scale(1.2);
    transition: 0.3s;
}

/* Google Translate'in eklediği istenmeyen beyazlıkları ezmek için */
.footer-blok-iletisim font {
    background: transparent !important;
    box-shadow: none !important;
}

/* Tıklama gecikmesini mobilde tamamen bitirir */
.urun-kart, .urun-resim img, .modal-kapat, #google_translate_element {
    touch-action: manipulation;
}

/* Başlıklar, alt başlıklar ve tüm açıklama metinleri için */
h1, h2, h3, h4, p, span, .sayfa-baslik p {
    user-select: none;           /* Yazının elle seçilmesini engeller */
    -webkit-user-select: none;    /* Safari için */
    pointer-events: none;         /* Fare etkileşimini (ve o mavi kutuyu) keser */
    cursor: default;              /* İmlecin yazı seçme moduna girmesini önler */
}

/* ÖNEMLİ: Eğer metin içinde tıklanabilir bir link (a) varsa onu muaf tutalım */
a {
    pointer-events: auto !important; 
}

/* ---------------------------- */

/* Mobildeki tıklama gecikmesini kaldırır */
#google_translate_element, .goog-te-menu-frame, .goog-te-menu2 {
    touch-action: manipulation !important;
    cursor: pointer !important;
}

/* Çeviri kutusunu menünün üstüne çıkarır */
.goog-te-menu-frame, iframe.goog-te-menu-frame {
    z-index: 99999999 !important;
    pointer-events: auto !important;
}

/* Metinlerin üzerinde çıkan mavi kutuyu (highlight) engeller */
h1, h2, h3, h4, p, span {
    -webkit-tap-highlight-color: transparent;
    outline: none !important;
    user-select: none;
}

/* ---------------------------- */
/* ==========================================================================
   OFİS SAYFASI - ÜRÜNLERDEN BAĞIMSIZ & TAM UYUMLU
   ========================================================================== */

.ofis-sayfasi {
    padding: 70px 0 100px 0;
    background-color: #fcfcfc;
}

/* BAŞLIK: Diğer sayfalarla aynı merkezleme ve stil */
.ofis-sayfasi .sayfa-baslik {
    text-align: center;
    margin-bottom: 60px;
}

.ofis-sayfasi .sayfa-baslik h1 {
    font-size: 2.8rem;
    color: #003366;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.ofis-sayfasi .baslik-alt-cizgi {
    width: 80px;
    height: 5px;
    background: #003366;
    margin: 10px auto 0 !important; /* Tam ortalar */
    border-radius: 5px;
}

/* IZGARA: Ofis resimleri için daha geniş 2'li düzen */
.ofis-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
}

/* KART TASARIMI: Beyaz boşluğu silen "cover" ayarı */
.ofis-kart {
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
    height: 400px; /* Ofis resimleri için ideal yükseklik */
    cursor: pointer;
    transition: 0.4s ease;
}

.ofis-kart:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(0, 31, 84, 0.15);
}

.ofis-resim {
    width: 100%;
    height: 100%;
}

.ofis-resim img {
    width: 100%;
    height: 100%;
    /* BEYAZ ÇERÇEVEYİ YOK EDEN ASIL KOMUT: */
    object-fit: cover !important; 
    object-position: center;
    transition: 0.8s;
}

.ofis-kart:hover img {
    transform: scale(1.05);
}

/* MOBİL AYAR */
@media (max-width: 768px) {
    .ofis-grid {
        grid-template-columns: 1fr; /* Mobilde alt alta */
        padding: 0 15px;
    }
    .ofis-kart {
        height: 280px;
    }
    .ofis-sayfasi .sayfa-baslik h1 {
        font-size: 2.2rem;
    }
}

/* ------------------------------- */

/* Google Translate'in "Orijinal metni göster" vurgusunu ve baloncuğunu öldürür */
.goog-te-banner-frame, 
.goog-te-balloon-frame, 
.goog-tooltip, 
.goog-tooltip:hover {
    display: none !important;
}

/* Çevrilen metnin altındaki o gıcık çizgiyi ve üzerine gelince çıkan maviliği siler */
font {
    background-color: transparent !important;
    box-shadow: none !important;
    border-bottom: none !important;
}

/* Mouse ile 2-3 saniye bekleyince çıkan o mavi "highlight"ı her dilde engeller */
:not(input):not(textarea)::selection {
    background-color: transparent !important;
}

/* Tarayıcının 'çeviri odağı' (focus) efektini sıfırlar */
a:focus, div:focus, h3:focus {
    background: none !important;
    outline: none !important;
}

/* ---------------------- */


/* Genel yazı stili ve geçiş ayarı */
.bilgi-satiri, .bilgi-satiri a {
    font-family: inherit;
    font-size: 16px;
    text-decoration: none; /* Çizgi burada tamamen kalkıyor */
    color: #333;
    transition: all 0.2s ease-in-out; /* Hızlı ve akıcı geçiş */
}

/* HOVER DURUMU: "Bir tık daha belli" ama sade versiyon */
.bilgi-satiri a:hover {
    color: #007bff !important;    /* Daha canlı ve derin bir mavi */
    font-weight: 600 !important;  /* Yazıyı kalınlaştırarak belirginleştirir */
    letter-spacing: 0.2px;        /* Harf arasını çok az açarak vurguyu artırır */
    text-decoration: none !important; /* Alt çizgi hover olduğunda da çıkmayacak */
}

/* WhatsApp özelinde numaraların birbirini etkilememesi için */
.whatsapp-konteynir {
    display: flex;
    align-items: center;
    gap: 5px;
}

.whatsapp-konteynir {
    display: flex;
    align-items: center;
    gap: 5px; /* Çizgiyle numaralar arası mesafe */
}

.ayrac-yatay {
    display: inline-block;
    width: 10px;           /* İSTEDİĞİN UZUNLUK: Çizginin boyu */
    height: 0;
    border-top: 3px solid #000; /* İSTEDİĞİN KALINLIK: 3px ile mermi gibi kalın oldu */
    margin: 0 8px;         /* Numaralardan uzaklığı */
    vertical-align: middle; /* Numaralarla aynı hizada durmasını sağlar */
}

.tekli-link {
    text-decoration: none;
    color: inherit;
    transition: all 0.2s ease;
}

.tekli-link:hover {
    color: #007bff !important; /* Kurumsal mavi */
    font-weight: 600 !important;
}


/* -------------------------- */

/* --- MOBİL MAVİ ÇERÇEVE SİLME --- */
* {
    -webkit-tap-highlight-color: transparent;
    outline: none;
}

/* --- KURUMSAL LACİVERT MENÜ SİSTEMİ (EN ŞIK HALİ) --- */
.nav-link {
    position: relative;
    color: #001f54 !important; /* Koyu Lacivert */
    transition: all 0.3s ease;
    text-decoration: none;
    font-weight: 500;
    padding: 8px 12px; /* Tıklama alanını ve çizgi payını genişletir */
    display: inline-block;
}

/* Hover ve Aktif Sayfa */
.nav-link:hover, 
.nav-link.active {
    color: #003399 !important; /* Hafif parlak lacivert */
    font-weight: 600;
}

/* Alt Çizgi Ayarı */
.nav-link::after {
    content: "";
    position: absolute;
    bottom: 0; /* Yazıya biraz daha yakınlaştırdık */
    left: 50%; /* Ortadan başlat */
    transform: translateX(-50%); /* Tam merkeze hizala */
    width: 0; /* Başlangıçta gizli */
    height: 2.5px; /* Çizgi kalınlığını çok az artırdık (daha net durur) */
    background-color: #001f54; /* Lacivert çizgi */
    transition: width 0.3s ease-in-out;
    border-radius: 5px;
}

/* Hover veya Aktifse Yazı Boyundan Biraz Fazla Uzat */
.nav-link:hover::after, 
.nav-link.active::after {
    width: 90%; /* %100 yaparsan kutu boyu kadar, %90 çok şık durur */
}

/* -------------------------- */

/* --- SAYAC KUTUSU: KÖŞELER VE KARELİK TAMİRİ --- */

.sayac-kutu {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    
    /* 1. KARE VE KÖŞE GÜVENLİĞİ */
    width: 200px !important; 
    height: 200px !important;
    aspect-ratio: 1 / 1 !important;
    
    background-color: #001f54;
    
    /* Alt köşelerin kaybolmaması için mermi gibi kural */
    border-radius: 15px !important; 
    overflow: hidden !important; /* İçerik köşeleri ezmesin diye */
    
    padding: 20px !important;
    box-sizing: border-box !important;
}

/* 2. YILDIZIN KONUMU (Sayıdan uzaklaştırıldı) */
.yildiz-ust-ikon {
    margin-bottom: 10px !important; 
    font-size: 1rem !important;
    color: #f1c40f !important;
}

/* 3. SAYI VE ARTI GRUBU */
.sayi-grubu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    margin-bottom: 2px !important;
}

#deneyim-yili { 
    font-size: 5rem !important; /* Kutuyu ferahlatmak için çok az küçülttük */
    font-weight: 800 !important; 
    line-height: 0.9 !important; 
}

.arti-isareti { 
    font-size: 3rem !important; 
    color: #f1c40f !important; 
    font-weight: 800 !important; 
}

/* 4. TÜRKÇE VE DİĞER DİLLER TÖRPUSÜ */
.metin-grubu span {
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-family: 'Segoe UI', sans-serif !important;
    line-height: 1.5 !important;
}

/* Türkçe: Kareyi ve Alt Köşeleri Bozmaması İçin */
html[lang="tr"] .metin-grubu span {
    display: inline-block !important;
    font-size: 13px !important; /* 14'ten 13'e çektik ki köşelere baskı yapmasın */
    white-space: nowrap !important;
    letter-spacing: -0.3px !important;
}

/* Diğer Diller: Senin 10 Numara Dediğin Düzen */
html:not([lang="tr"]) .metin-grubu span,
html:not([lang="tr"]) .metin-grubu font {
    display: block !important;
    font-size: 11.5px !important; /* Taşmayı önlemek için milimetrik küçültme */
    width: 100% !important;
}

/* --------------------------- */

/* --- FOOTER MENÜ: DİNAMİK SARI SİSTEMİ --- */

/* 1. Menü Linklerinin İlk Hali (Beyaz ve Çizgisiz) */
footer a.footer-link, 
#footer-sistemi a.footer-link {
    position: relative;
    text-decoration: none !important;
    color: #ffffff !important; /* Normalde Beyaz */
    padding: 5px 0;
    display: inline-block;
    transition: all 0.3s ease;
}



/* 3. HOVER VE AKTİF DURUMU: YAZI SARI + ÇİZGİ SARI */
footer a.footer-link:hover, 
footer a.footer-link.active,
#footer-sistemi a.footer-link:hover,
#footer-sistemi a.footer-link.active {
    color: #f1c40f !important; /* Mouse üzerindeyken veya o sayfadaysan SARI olur */
}

/* Çizginin uzaması */
footer a.footer-link:hover::after, 
footer a.footer-link.active::after,
#footer-sistemi a.footer-link:hover::after, 
#footer-sistemi a.footer-link.active::after {
    width: 100% !important;
}

/* 4. İLETİŞİM VE İSİM KISMI (SABİT BEYAZ - HİÇBİR ŞEKİLDE ÇİZGİ ÇIKMAZ) */
.footer-blok-iletisim a, 
.ozel-imza-alani a {
    color: #ffffff !important;
    text-decoration: none !important;
}

.footer-blok-iletisim a::after, 
.ozel-imza-alani a::after {
    display: none !important;
    content: none !important;
}


/* ------------------------- */


/* ============================================================
   PİMATEKS FİNAL DENGE VE SARI SİSTEMİ (CERRAHİ OPERASYON)
   ============================================================ */

/* 1. HEADER: LİNKLER ARASI TAM DENGE */
.header-sag-grup nav ul {
    display: flex !important;
    gap: 30px !important; /* Linklerin arası milimetrik açıldı */
    margin: 0; padding: 0; list-style: none; align-items: center;
}

/* 2. FOOTER: BLOKLARI ORTALAMA VE DENGELEME */
.footer-ust-icerik {
    display: flex !important;
    justify-content: center !important; 
    gap: 100px !important; /* Menü ve İletişim bloklarını birbirine yaklaştırdık */
    max-width: 1100px;
    margin: 0 auto 40px auto !important;
}

/* 3. TÜM ESKİ FOOTER ÇİZGİLERİNİ ZORLA SİL */
footer a::after, 
#footer-sistemi a::after,
.footer-blok-menu a::after,
.iletisim-item a::after {
    content: none !important;
    display: none !important;
}

/* 4. SADECE MENÜ LİNKLERİ İÇİN AKILLI SARI SİSTEM */
.footer-blok-menu ul li a {
    position: relative;
    text-decoration: none !important;
    color: #ffffff !important; /* Normalde Beyaz */
    padding: 5px 0;
    display: inline-block !important;
    transition: all 0.3s ease;
}

/* Üstüne gelince veya o sayfadaysan SARI yap */
.footer-blok-menu ul li a:hover, 
.footer-blok-menu ul li a.active {
    color: #f1c40f !important;
    padding-left: 0 !important; /* Kayma efektini iptal ettik, jilet gibi kalsın */
}

/* Sarı Çizgiyi Sadece Buraya Tanımla */
.footer-blok-menu ul li a::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: #f1c40f !important;
    transition: width 0.3s ease;
}

/* Hover/Aktifken Çizgiyi Aç */
.footer-blok-menu ul li a:hover::after, 
.footer-blok-menu ul li a.active::after {
    width: 100% !important;
}

/* 5. İLETİŞİM VE İSİM: KESİN BEYAZ VE ÇİZGİSİZ */
.footer-blok-iletisim a, 
.iletisim-item a,
.footer-alt-telif a {
    color: #ffffff !important;
    text-decoration: none !important;
    border: none !important;
}


/* --- FOOTER TERAZİ AYARI --- */

/* 1. Footer içindeki ana taşıyıcıyı ekranın tam ortasına mühürle */
.footer-ust-icerik {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    width: 100% !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 2. Blokların genişliğini eşitle ki biri diğerini itmesin */
.footer-blok-menu, .footer-blok-iletisim {
    flex: 0 1 auto !important; /* İçerik kadar yer kapla ama esneme */
    min-width: 250px; /* Bloklar çok daralıp dengesizleşmesin */
}

/* 3. Mobilde (Telefonlarda) blokları alt alta ve merkeze al */
@media (max-width: 768px) {
    .footer-ust-icerik {
        flex-direction: column !important;
        align-items: center !important;
        gap: 40px !important;
        text-align: center !important;
    }
}

/* --- FOOTER SATIR ARALIĞI (DENGE) AYARI --- */

/* 1. Menü satırlarını birbirine yaklaştır (Boşluğu azalt) */
.footer-blok-menu ul li {
    line-height: 1.6 !important; /* Eskiden 2.2 idi, şimdi daralttık */
    margin-bottom: 5px !important; /* Satırların arasındaki ek boşluk */
}

/* 2. İletişim bilgilerini birbirinden uzaklaştır (Boşluğu arttır) */
.footer-blok-iletisim .iletisim-satiri {
    margin-bottom: 20px !important; /* Her satırın altına 20px boşluk koyduk */
    line-height: 1.8 !important;   /* Yazıların kendi içindeki yüksekliği */
}

/* 3. Başlıkların altındaki boşluğu da eşitleyelim */
.footer-blok-menu h4, .footer-blok-iletisim h4 {
    margin-bottom: 25px !important;
}

/* Modalın tamamı ve içindeki tüm boş alanlar için */
.modal-sistemi, 
.modal-resim-alani {
    cursor: zoom-in !important;
}

/* Resmin kendisi için */
.modal-icerik {
    cursor: zoom-in !important;
    transition: transform 0.2s ease-out;
}

/* Sadece kapatma butonunda imleç normale dönsün (tıklanabilsin diye) */
.modal-kapat {
    cursor: pointer !important;
}