/* =================================================================
   ARK YAPI - KURUMSAL SAYFASI (FIGMA PIXEL-PERFECT UYARLAMA)
   ================================================================= */

/* Kurumsal sayfasında navbar'ı hero üzerine yerleştir */
.kurumsal-hero #header-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
}

.kurumsal-hero #header-placeholder .navbar {
    position: absolute;
    top: 0;
    width: 100%;
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.24);
}

/* Bootstrap container override - Header ile hizalama için */
.kurumsal-hero .container {
    max-width: 1920px;
    padding-left: 240px;
    padding-right: 240px;
}

/* --- HERO BÖLÜMÜ --- */
.kurumsal-hero {
    position: relative;
    width: 100%;
    height: 507px; /* Figma: Rectangle 4289 height */
    overflow: hidden;
    display: flex;
    align-items: center;
    margin-top: 0;
    max-width: 100vw;
}

/* Katman 1: Resim */
.hero-kurumsal-image {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url('../../img/ark/hero-kurumsal.webp');
    background-size: cover;
    background-position: center;
    z-index: 1;
}

/* Katman 2: Yeşil Overlay (Mix Blend Mode: Overlay) */
.hero-overlay-green {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(66, 95, 87, 0.57);
    mix-blend-mode: overlay;
    z-index: 2;
}

/* Katman 3: Siyah Gradient */
.hero-overlay-gradient {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /* Figma: linear-gradient(90deg, rgba(31, 31, 31, 0.75) 1.12%, rgba(31, 31, 31, 0) 101.12%); */
    background: linear-gradient(90deg, rgba(31, 31, 31, 0.75) 1.12%, rgba(31, 31, 31, 0) 101.12%);
    z-index: 3;
}

/* Katman 4: Alt Çizgi */
.hero-bottom-border {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /* Figma: border-bottom: 1px solid rgba(255, 255, 255, 0.24); */
    border-bottom: 1px solid rgba(255, 255, 255, 0.24);
    z-index: 4;
    pointer-events: none;
}

/* Hero İçerik */
.hero-container {
    position: relative;
    z-index: 5;
    /* Figma: top: 206px (Yaklaşık dikey hizalama için flex kullanıyoruz ama padding ile destekleyelim) */
    padding-top: 50px;
    max-width: 1920px;
    margin: 0 auto;
    padding-left: 240px;
    padding-right: 240px;
    width: 100%;
    box-sizing: border-box;
}

.hero-title {
    /* Figma: Kurumsal text styles */
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 54px;
    line-height: 68px;
    color: #FFFFFF;
    margin-bottom: 18px; /* Figma'daki boşluk hissi */
}

.hero-subtitle {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0px;
    color: rgba(255, 255, 255, 0.9);
    max-width: 600px;
}

/* --- BİZ KİMİZ BÖLÜMÜ --- */
.biz-kimiz-section {
    position: relative;
    padding: 100px 0; /* Figma'daki konuma göre yaklaşık padding */
    background: #FFFFFF;
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
}

.biz-kimiz-section .container {
    max-width: 1920px;
    margin: 0 auto;
    padding-left: 240px;
    padding-right: 240px;
    width: 100%;
    box-sizing: border-box;
}

.biz-kimiz-section .row {
    align-items: flex-start; /* Üstten hizalama */
}

.biz-kimiz-section .col-lg-6:first-child {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.biz-kimiz-title {
    /* Figma: "Biz Kimiz ?" */
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 36px;
    line-height: 54px;
    color: #425F57; /* Green-500 */
    margin-bottom: 20px;
    margin-top: 0; /* Üstten boşluk yok */
}

.biz-kimiz-text {
    margin-top: 0;
    flex: 1;
}

.biz-kimiz-text p {
    /* Figma: Paragraph styles */
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #5C5C5C;
    margin-bottom: 25px;
}

.biz-kimiz-section .col-lg-6:last-child {
    display: flex;
    align-items: flex-start;
}

.biz-kimiz-image-wrapper {
    position: relative;
    width: 100%;
    max-width: 710px; /* Figma: Rectangle 4323 width */
    height: 438px; /* Figma: Rectangle 4323 height */
    /* Figma: Rectangle 4323 properties */
    background: #FFFFFF;
    border-radius: 8px;
    /* Figma: box-shadow: 0px 0px 18.3px rgba(0, 0, 0, 0.25); */
    box-shadow: 0px 0px 18.3px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    margin-top: 0; /* Üstten boşluk yok - başlıkla hizalı */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px; /* Logo için iç boşluk */
    box-sizing: border-box;
}

.biz-kimiz-image-wrapper img {
    width: auto;
    height: auto;
    max-width: calc(100% - 80px); /* Padding'i hesaba katarak */
    max-height: calc(100% - 80px); /* Padding'i hesaba katarak */
    object-fit: contain;
    display: block;
    margin: auto;
}

/* --- MİSYON & VİZYON BÖLÜMÜ --- */
.misyon-vizyon-section {
    position: relative;
    width: 100%;
    max-width: 100vw;
    min-height: 478px; /* Figma: Frame 20 height */
    padding: 80px 0;
    display: flex;
    align-items: center;
    overflow-x: hidden;
}

.mv-container {
    position: relative;
    z-index: 3;
    max-width: 1920px;
    margin: 0 auto;
    padding-left: 240px;
    padding-right: 240px;
    width: 100%;
    box-sizing: border-box;
}

.mv-container .row {
    gap: 60px;
}

/* Arka Plan */
.mv-bg-image {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url('../../img/ark/urunler04.webp'); /* 3d-rendering-ventilation... muadili */
    background-size: cover;
    background-position: center;
    z-index: 1;
}

.mv-bg-color {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /* Figma: background: #425F57; (Orijinalinde resimle karışık olabilir ama overlay olarak veriyoruz) */
    background: rgba(66, 95, 87, 0.95); /* Okunabilirlik için opaklık artırıldı */
    z-index: 2;
}


.mv-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 15px; /* Figma: gap: 12px ve 13px */
}

/* İkon Daireleri */
.mv-icon-wrapper {
    margin-bottom: 15px;
}

.mv-icon-circle {
    /* Figma: width: 97px; height: 97px; */
    width: 97px;
    height: 97px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    position: relative;
}


.mv-icon-img {
    width: 97px;
    height: auto;
    filter: brightness(0) invert(1); /* İkonları beyaz yapmak için */
    z-index: 2;
}

.mv-title {
    /* Figma: Misyonumuz/Vizyonumuz Text */
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 36px;
    line-height: 54px;
    color: #FFFFFF;
    margin: 0;
}

.mv-desc {
    /* Figma: Açıklama metinleri */
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #FFFFFF;
    margin: 0;
}

.misyon-vizyon-section .mv-title,
.misyon-vizyon-section .mv-desc,
.misyon-vizyon-section .mv-desc * {
    color: #FFFFFF !important;
}

/* Orta çözünürlükler için padding ayarları - Ana sayfa ile aynı */
@media (min-width: 992px) and (max-width: 1199px) {
    .kurumsal-hero .container,
    .hero-container,
    .biz-kimiz-section .container,
    .mv-container,
    .navbar .container,
    .footer-section .container,
    .cta-content.container {
        padding-left: 100px;
        padding-right: 100px;
    }
}

@media (min-width: 1200px) and (max-width: 1399px) {
    .kurumsal-hero .container,
    .hero-container,
    .biz-kimiz-section .container,
    .mv-container,
    .navbar .container,
    .footer-section .container,
    .cta-content.container {
        padding-left: 150px;
        padding-right: 150px;
    }
}

@media (min-width: 1400px) and (max-width: 1499px) {
    .kurumsal-hero .container,
    .hero-container,
    .biz-kimiz-section .container,
    .mv-container,
    .navbar .container,
    .footer-section .container,
    .cta-content.container {
        padding-left: 120px;
        padding-right: 120px;
    }
}

@media (min-width: 1500px) and (max-width: 1599px) {
    .kurumsal-hero .container,
    .hero-container,
    .biz-kimiz-section .container,
    .mv-container,
    .navbar .container,
    .footer-section .container,
    .cta-content.container {
        padding-left: 150px;
        padding-right: 150px;
    }
}

/* =========================================
   1470px (Laptop) Ekranı İçin Özel Düzeltme
   ========================================= */
@media (min-width: 1350px) and (max-width: 1550px) {
    
    /* 1. Kenar Boşluklarını Rahatlatma */
    .kurumsal-hero .container,
    .hero-container,
    .biz-kimiz-section .container,
    .mv-container,
    .navbar .container,
    .footer-section .container,
    .cta-content.container {
        padding-left: 60px !important;
        padding-right: 60px !important;
    }

    /* Navbar içindeki menü linklerinin arasını biraz kısalım */
    .navbar-nav {
        gap: 30px !important;
        margin-right: 15px !important;
    }

    /* 2. Footer (Alt Kısım) Hizalaması */
    .footer-quick-access {
        margin-left: 50px !important;
    }
    
    .footer-links-col,
    .footer-contact,
    .footer-social {
        margin-left: 40px !important;
    }

    /* Footer üst kısmındaki hizalamayı garantiye al */
    .footer-top {
        justify-content: space-between;
        gap: 0;
    }

    /* 3. Yazı Boyutları */
    .hero-title {
        font-size: 46px !important;
        line-height: 60px !important;
    }
    
    .hero-subtitle {
        font-size: 20px !important;
    }
}

@media (min-width: 1600px) and (max-width: 1919px) {
    .kurumsal-hero .container,
    .hero-container,
    .biz-kimiz-section .container,
    .mv-container,
    .navbar .container,
    .footer-section .container,
    .cta-content.container {
        padding-left: 200px;
        padding-right: 200px;
    }
}

/* --- MOBİL UYUMLULUK (RESPONSIVE) --- */
@media (max-width: 991px) {
    .kurumsal-hero {
        height: 400px;
    }
    
    .hero-container,
    .kurumsal-hero .container {
        padding-left: 30px;
        padding-right: 30px;
    }
    
    .hero-title {
        font-size: 36px;
        line-height: 48px;
    }
    
    .hero-subtitle {
        font-size: 16px;
        line-height: 24px;
    }
    .biz-kimiz-section .container {
        padding-left: 40px;
        padding-right: 40px;
    }
    .mv-container {
        padding-left: 40px;
        padding-right: 40px;
    }
    .biz-kimiz-text p {
        font-size: 16px;
        line-height: 26px;
    }
    .biz-kimiz-section .row {
        flex-direction: column;
    }
    .biz-kimiz-image-wrapper {
        margin-top: 30px;
        max-width: 100%;
        height: auto;
        min-height: 300px;
    }
    
    .biz-kimiz-image-wrapper img {
        max-width: calc(100% - 40px);
        max-height: calc(100% - 40px);
    }
    .misyon-vizyon-section {
        height: auto;
        padding: 60px 0;
    }
    .mv-container {
        padding: 0 40px;
    }
}

@media (max-width: 576px) {
    .kurumsal-hero {
        height: 350px;
    }
    
    .hero-container,
    .kurumsal-hero .container {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .hero-title {
        font-size: 20px;
        line-height: 36px;
    }
    
    .hero-subtitle {
        font-size: 14px;
        line-height: 20px;
    }
    .biz-kimiz-section .container {
        padding-left: 20px;
        padding-right: 20px;
    }
    .mv-container {
        padding-left: 20px;
        padding-right: 20px;
    }
    .biz-kimiz-title {
        font-size: 20px;
        line-height: 36px;
    }
    .biz-kimiz-text p {
        font-size: 16px;
        line-height: 24px;
    }
    .biz-kimiz-image-wrapper {
        height: auto;
        min-height: 250px;
        padding: 20px;
    }
    .biz-kimiz-image-wrapper img {
        max-width: calc(100% - 40px);
        max-height: calc(100% - 40px);
    }
    .mv-container {
        padding: 0 20px;
    }
    .mv-title {
        font-size: 20px;
        line-height: 36px;
    }
}