/* ===================================
   BEYKAP - Main Stylesheet
   =================================== */

/* Reset & Base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 9pt;
    background-color: #ffffff;
}

/* Custom Container */
.container {
    max-width: 1500px;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
}

/* ===================================
   HEADER WRAPPER (Glassmorphism)
   =================================== */
.header-wrapper {
    background: rgba(255, 255, 255, 0.1);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    transition: all 0.4s ease;
}

.header-wrapper.sticky-active {
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(255, 255, 255, 1);
    padding-bottom: 0;
}

/* ===================================
   HERO SECTION
   =================================== */
.hero-section {
    margin-top: 10px;
    position: relative;
    z-index: 1;
    height: 110vh;
    min-height: 110vh;
    overflow: hidden;
}

.hero-slider {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.hero-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

/* Hero Content Overlay */
.hero-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding-top: 144px;
    z-index: 5;
    /* Ensure text is above background but below overlay */
    pointer-events: none;
    /* Allow events to pass through if needed, but text selection might fail. Maybe auto? */
    /* Header yüksekliği */
}

/* Ensure hero-text-box is visible and interactive */
.hero-text-box {
    pointer-events: auto;
    position: relative;
    z-index: 20;
    /* Higher than static overlay */
    max-width: 650px;
    padding: 40px;
    background: rgba(255, 255, 255, 0.2);
    /* %20 beyaz */
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-radius: 0 60px 0 20px;
    /* sol-üst: 0, sağ-üst: 60px, sağ-alt: 0, sol-alt: 20px */
    border: none;
}

.hero-subtitle {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #41A8B9;
    letter-spacing: 2px;
    margin-bottom: 10px;
}

.hero-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #1B2C5D;
    line-height: 1.2;
    margin-bottom: 20px;
}

.hero-title-thin {
    font-weight: 300;
    /* İnce */
    display: block;
}

.hero-description {
    font-size: 15px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 25px;
}

/* Hero Buttons */
.hero-buttons {
    display: flex;
    gap: 15px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.btn-hero-primary {
    display: inline-block;
    padding: 14px 28px;
    background: #41A8B9;
    color: #fff !important;
    text-decoration: none;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
    box-shadow: 0 5px 20px rgba(65, 168, 185, 0.3);
}

.btn-hero-primary:hover {
    background: #1B2C5D;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(27, 44, 93, 0.3);
}

.btn-hero-outline {
    display: inline-block;
    padding: 14px 28px;
    background: transparent;
    color: #41A8B9 !important;
    text-decoration: none;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
    background-color: #fff;
}

.btn-hero-outline:hover {
    background: #41A8B9;
    color: #fff !important;
}

/* Hero Stats */
.hero-stats {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}


span.stat-text {
    color: #FFFFFF;
    font-size: 14px;
}

.stat-item {
    display: flex;
    flex-direction: column;
    /* Dikey düzen */
    align-items: center;
    /* Ortala */
    gap: 8px;
    color: #1B2C5D;
    font-size: 13px;
    font-weight: 500;
    text-align: center;
}

.stat-item i {
    font-size: 20px;
    color: #41A8B9;
}

.stat-icon {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

/* ===================================
   TOP BAR
   =================================== */
.top-bar {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    padding: 8px 0;
    font-size: 14px;
    transition: all 0.4s ease;
    height: 40px;
    overflow: hidden;
}

.header-wrapper.sticky-active .top-bar {
    height: 0;
    padding: 0;
    border: none;
    opacity: 0;
}


/* Turn Header White for Contact Page */
/* Turn Header White for Contact Page & Technical Service Page */
body.contact-page-body .header-wrapper,
body.technical-service-page-body .header-wrapper {
    background: #ffffff !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

/* Turn Header Dark Blue for Corporate Page */
body.corporate-page-body .header-wrapper {
    background: #1B2C5D !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}

body.corporate-page-body .top-bar a,
body.corporate-page-body .main-nav a,
body.corporate-page-body .lang-switch {
    color: #ffffff !important;
}

body.corporate-page-body .search-btn {
    color: #ffffff !important;
}

body.corporate-page-body .mobile-toggle {
    color: #ffffff !important;
}

.top-bar a {
    color: #1B2C5D;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: color 0.3s ease;
}

.top-bar a:hover {
    color: #26b5a0;
}

.top-bar .topbar-icon {
    height: 18px;
    color: #41A8B9;
    width: auto;
    font-weight: bolder;
    margin-right: 6px;
    vertical-align: middle;
}

.top-bar .separator-icon {
    height: 12px;
    width: auto;
    margin: 0 15px;
    vertical-align: middle;
}

/* ===================================
   MAIN HEADER
   =================================== */
.main-header {
    background: transparent;
    padding: 15px 0;
}

.logo-area {
    display: flex;
    align-items: center;
    gap: 20px;
}

.logo-text {
    font-size: 28px;
    font-weight: 700;
    color: #333;
    text-decoration: none;
}

.logo-text span {
    color: #26b5a0;
}

/* Anniversary Badge */
.anniversary-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: 15px;
    font-size: 11px;
    color: #666;
    line-height: 1.2;
}

.anniversary-badge .number {
    font-size: 32px;
    font-weight: 700;
    color: #26b5a0;
    line-height: 1;
}

.anniversary-badge .text {
    font-size: 10px;
    color: #666;
    text-transform: uppercase;
}

/* ===================================
   SEARCH BOX
   =================================== */
.search-box {
    position: relative;
    width: 100%;
    max-width: 300px;
}

.search-box input {
    width: 100%;
    padding: 10px 40px 10px 15px;
    border: 1px solid #e5e5e5;
    border-radius: 25px;
    font-size: 13px;
    outline: none;
    transition: border-color 0.3s ease;
}

.search-box input:focus {
    border-color: #26b5a0;
}

.search-box input::placeholder {
    color: #999;
}

.search-box .search-btn {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #26b5a0;
    cursor: pointer;
    padding: 5px 10px;
}

/* ===================================
   NAVIGATION (DESKTOP)
   =================================== */
.main-nav {
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

/* Desktop'ta mobil menü elementlerini gizle */
.mobile-menu-header,
.mobile-menu-footer {
    display: none;
}

.mobile-menu-links {
    display: flex;
    align-items: center;
    gap: 15px;
}

.mobile-menu-links a,
.main-nav a {
    text-decoration: none;
    font-size: 16px;
    color: #1B2C5D;
    font-weight: 500;
    transition: color 0.3s ease;
    position: relative;
    padding: 0;
    opacity: 1;
    transform: none;
}

.mobile-menu-links a:hover,
.main-nav a:hover {
    color: #41A8B9;
    /* Turkuaz */
}



/* ===================================
   BUTTONS
   =================================== */
.btn-teklif {
    background-color: #5BA8B4;
    color: #fff !important;
    padding: 15px 50px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 16px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 0 20px rgba(91, 168, 180, 0.4);
}

.btn-teklif:hover {
    background-color: #4a9aa6;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(91, 168, 180, 0.4);
}

.lang-switch {
    background: transparent;
    color: #1B2C5D !important;
    /* padding: 10px 15px; */
    font-size: 16px;
    text-decoration: none;
    transition: color 0.3s ease;
}

.lang-switch .lang-active {
    font-weight: 700;
}

.lang-switch:hover {
    color: #5BA8B4 !important;
}

/* ===================================
   MOBILE MENU TOGGLE
   =================================== */
/* ===================================
   MOBILE MENU TOGGLE
   =================================== */
.mobile-toggle {
    display: none;
    background: none;
    border: none;
    font-size: 28px;
    color: #1B2C5D;
    cursor: pointer;
    padding: 5px;
    transition: all 0.3s ease;
}

.mobile-toggle:hover {
    color: #5BA8B4;
}

/* ===================================
   RESPONSIVE STYLES
   =================================== */
@media (max-width: 991px) {
    .hero-section {
        height: 100vh;
        min-height: 100vh;
    }

    .main-nav {
        /* FULL SCREEN OVERLAY */
        position: fixed;
        top: 0;
        align-items: normal;
        left: 0;
        width: 100%;
        height: 100vh;

        /* Marka Rengi - Koyu Lacivert */
        background: #1B2C5D;

        /* Layout */
        display: flex;
        flex-direction: column;
        justify-content: space-between;

        z-index: 10000;
        padding: 0;

        /* HIDDEN STATE */
        opacity: 0;
        visibility: hidden;
        transform: translateY(-100%);
        transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1);
    }

    .main-nav.active {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    /* ====== MENU HEADER ====== */
    .mobile-menu-header {
        display: flex !important;
        /* Desktop'taki gizlemeyi override et */
        justify-content: space-between;
        align-items: center;
        padding: 20px 30px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .mobile-menu-logo img {
        height: 40px;
        filter: brightness(0) invert(1);
        /* Logoyu beyaz yap */
    }

    .mobile-menu-actions {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end;
        gap: 20px;
        flex-shrink: 0;
    }

    .mobile-lang-switch {
        color: rgba(255, 255, 255, 0.5);
        text-decoration: none;
        font-size: 14px;
        font-weight: 400;
    }

    .mobile-lang-switch .active {
        color: #41A8B9;
        /* Turkuaz */
        font-weight: 500;
    }

    .close-menu {
        background: transparent;
        border: 1px solid rgba(255, 255, 255, 0.3);
        border-radius: 50%;
        width: 44px;
        height: 44px;
        font-size: 18px;
        color: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease;
    }

    .close-menu:hover {
        background: #fff;
        color: #1B2C5D;
        border-color: #fff;
    }

    /* ====== MENU LINKS ====== */
    .mobile-menu-links {
        flex: 1;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-end !important;
        /* Sağa yasla */
        text-align: right;
        padding: 40px;
        overflow-y: auto;
        gap: 0;
    }

    .mobile-menu-links a {
        display: block !important;
        padding: 12px 0 !important;
        font-size: 20px !important;
        font-weight: 300 !important;
        color: rgba(255, 255, 255, 0.45) !important;
        text-decoration: none !important;
        transition: all 0.3s ease !important;
        letter-spacing: 0.5px;
        transform: translateX(-20px);
    }

    .main-nav.active .mobile-menu-links a {
        opacity: 1 !important;
        transform: translateX(0) !important;
    }

    .main-nav.active .mobile-menu-links a:nth-child(1) {
        transition-delay: 0.1s;
    }

    .main-nav.active .mobile-menu-links a:nth-child(2) {
        transition-delay: 0.15s;
    }

    .main-nav.active .mobile-menu-links a:nth-child(3) {
        transition-delay: 0.2s;
    }

    .main-nav.active .mobile-menu-links a:nth-child(4) {
        transition-delay: 0.25s;
    }

    .main-nav.active .mobile-menu-links a:nth-child(5) {
        transition-delay: 0.3s;
    }

    .main-nav.active .mobile-menu-links a:nth-child(6) {
        transition-delay: 0.35s;
    }

    .mobile-menu-links a:hover {
        color: rgba(255, 255, 255, 0.9) !important;
        padding-right: 10px !important;
    }

    .lang-switch {
        display: none !important;
    }

    /* ====== MENU FOOTER ====== */
    .mobile-menu-footer {
        display: block !important;
        /* Desktop'taki gizlemeyi override et */
        padding: 30px 40px;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .mobile-menu-contact {
        margin-bottom: 20px;
    }

    .mobile-menu-contact a {
        display: block;
        color: rgba(255, 255, 255, 0.5);
        text-decoration: none;
        font-size: 14px;
        margin-bottom: 5px;
        transition: color 0.3s ease;
    }

    .mobile-menu-contact a:hover {
        color: #5BA8B4;
    }

    .mobile-menu-social {
        display: flex;
        gap: 10px;
    }

    .mobile-menu-social a {
        width: 40px;
        height: 40px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: rgba(255, 255, 255, 0.6);
        text-decoration: none;
        font-size: 16px;
        transition: all 0.3s ease;
    }

    .mobile-menu-social a:hover {
        background: #5BA8B4;
        border-color: #5BA8B4;
        color: #fff;
    }

    .mobile-toggle {
        display: block;
    }

    .search-box {
        display: none;
    }

    .header-right {
        justify-content: flex-end;
    }
}

@media (max-width: 576px) {
    .anniversary-badge {
        display: none;
    }

    span.stat-text {
        color: #FFFFFF;
        font-size: 11px;
    }

    .top-bar .d-flex {
        flex-direction: row !important;
        justify-content: space-between !important;
        /* İki yana yasla */
        flex-wrap: nowrap;
        width: 100%;
        /* Tam genişlik */
    }

    .top-bar a {
        font-size: 13px;
        /* Fontu büyüt */
    }

    .top-bar .topbar-icon {
        height: 14px;
        /* İkonu büyüt */
        margin-right: 3px;
    }

    .top-bar .separator-icon {
        display: none;
        /* Mobilde gizle */
    }
}

/* ===================================
   EXTRA RESPONSIVE ADJUSTMENTS
   =================================== */

/* Laptop & Tablet Landscape (1200px - 1400px) */
@media (max-width: 1400px) {
    .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .logo-area {
        gap: 10px;
    }

    .search-box {
        max-width: 200px;
        /* Aramayı biraz daha küçült */
    }

    .search-box input {
        padding: 8px 35px 8px 15px;
        font-size: 12px;
    }

    .main-nav {
        gap: 10px;
        /* Menü aralığını sıkılaştır */
    }

    .main-nav a {
        font-size: 14px;
        /* Fontu küçült */
    }

    .btn-teklif {
        padding: 10px 25px;
        /* Butonu küçült */
        font-size: 14px;
        border-radius: 30px;
    }

    .lang-switch {
        padding: 5px 5px;
        font-size: 14px;
    }
}

/* Tablet Portrait & Smaller Laptops */
@media (max-width: 1100px) {
    .search-box {
        display: none !important;
        /* Yer kalmayınca aramayı gizle */
    }
}

/* ===================================
   MOBILE ADJUSTMENTS (General)
   =================================== */
@media (max-width: 991px) {
    .hero-image {
        object-position: 71% top;
        height: 100vh;
        min-height: 600px;
    }

    .hero-content {
        padding-top: 0;
        align-items: flex-end;
        /* İçeriği en aşağıya sabitle */
        padding-bottom: 50px;
        /* Alttan biraz boşluk bırak */
        text-align: center;
    }

    .hero-text-box {
        max-width: 100%;
        margin: 0 5px;
        padding: 20px 15px;
        /* Padding küçüldü */
        border-radius: 15px;
        background: rgba(255, 255, 255, 0.35);
        /* Biraz daha opak */
    }

    .hero-subtitle {
        font-size: 11px;
        /* Alt başlık küçüldü */
        letter-spacing: 0.5px;
        margin-bottom: 5px;
    }

    .hero-title {
        font-size: 24px;
        /* Başlık Mobilde daha küçük */
        margin-bottom: 10px;
    }

    .hero-description {
        font-size: 13px;
        color: #fff !important;
        /* Mobilde beyaz */
        margin-bottom: 20px;
    }

    .hero-buttons {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: center;
        gap: 8px;
        width: 100%;
    }

    .btn-hero-primary,
    .btn-hero-outline {
        flex: 1;
        padding: 10px 5px !important;
        font-size: 11px !important;
        height: 40px !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
        min-width: 0;
    }

    .hero-stats {
        display: none !important;
    }
}

@media (max-width: 576px) {

    /* Mobilde Top Bar'ı tamamen gizleyebiliriz, yer açmak için */
    .top-bar {
        display: none;
    }

    .hero-section {
        margin-top: 0;
        /* User'ın 10px override'ını düzelt */
    }

    .header-wrapper {
        background: rgba(255, 255, 255, 0.1);
        /* Şeffaf başla */
    }

    .hero-content {
        /* padding-top: 80px;  <-- Bunu kaldırıyoruz ki üstteki flex-end etkili olsun */
        padding-bottom: 20px;
        /* Alttan biraz daha az boşluk mobilde */
    }

    .logo-text img {
        height: 30px;
        /* Logoyu mobilde biraz küçült */
    }
}


/* ===================================
   ABOUT SECTION
   =================================== */
.about-section {
    position: relative;
    padding: 100px 0;
    background: url('../img/about_bg.svg') no-repeat center center;
    background-size: cover;
    overflow: hidden;
}

.about-image-wrapper {
    position: relative;
    z-index: 2;
}

.about-truck-img {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.1));
}

.about-content {
    position: relative;
    z-index: 2;
}

.about-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    color: #1B2C5D;
    font-size: 36px;
    font-weight: 300;
    line-height: 1.2;
    margin-bottom: 25px;
}

.about-text {
    font-size: 16px;
    line-height: 1.7;
    color: #1B2C5D80;
    margin-bottom: 35px;
}

.btn-about {
    display: inline-block;
    background-color: #41A8B9;
    /* Turkuaz */
    color: #fff;
    padding: 12px 35px;
    border-radius: 30px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(65, 168, 185, 0.3);
}

.btn-about:hover {
    background-color: #1B2C5D;
    transform: translateY(-2px);
    color: #fff;
}

/* Timeline Items */
.timeline-item {
    position: relative;
    padding-top: 15px;
}

.timeline-year {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 22px;
    color: #41A8B9;
    margin-bottom: 10px;
    font-weight: 700;
}

.timeline-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    /* 9pt karşılığı */
    color: #1B2C5D80;
    /* User'ın opacity'li rengi */
    line-height: 1.5;
}

/* About Section Responsive */
@media (max-width: 991px) {
    .about-section {
        padding: 60px 0;
    }

    .about-title {
        font-size: 28px;
        margin-top: 30px;
    }

    .about-truck-img {
        max-width: 80%;
        margin: 0 auto;
        display: block;
    }

    .about-content {
        text-align: center;
        padding-left: 0 !important;
    }

    .about-action {
        justify-content: center;
    }

    .timeline-item {
        text-align: center;
        margin-bottom: 20px;
    }
}


/* ===================================
   OEM PRODUCTS SECTION
   =================================== */
.oem-section {
    padding: 100px 0;
    background-color: #F4FAFB;
    /* Görseldeki buz mavisi zemin */
}

/* ... (Diğer OEM stilleri) ... */

/* ===================================
   PROBLEM SECTION (Aracınızda Ne Sorun Var?)
   =================================== */
.problem-section {
    padding: 100px 0;
    background-color: #ffffff;
    /* SVG'deki Blur Efekti Taklidi: Sağ tarafta yoğun turkuaz ışık */
    background-image: radial-gradient(circle at 75% 50%, rgba(65, 168, 185, 0.5) 0%, rgba(65, 168, 185, 0.1) 40%, rgba(255, 255, 255, 0) 70%);
    overflow: hidden;
}

.oem-main-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    color: #1B2C5D;
    font-size: 42px;
    /* Font büyütüldü */
    line-height: 1.1;
    font-weight: 300;
    margin-bottom: 30px;
}

.oem-main-title .fw-bold {
    font-weight: 800;
    /* Daha kalın */
    display: block;
    /* Alt satıra al */
}

.btn-oem {
    display: inline-block;
    background-color: #44A6B7;
    /* Görseldeki turkuaz */
    color: #fff;
    padding: 14px 40px;
    border-radius: 30px;
    /* Tam yuvarlak */
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 10px 20px rgba(68, 166, 183, 0.25);
    border: none;
}

.btn-oem:hover {
    background-color: #1B2C5D;
    color: #fff;
    transform: translateY(-2px);
}

/* Highlight Card (Middle) */
.oem-highlight-card {
    background-color: #fff;
    border-radius: 30px 0 30px 0;
    /* SVG'ye göre: Sol-Üst ve Sağ-Alt yuvarlak */
    overflow: hidden;
    position: relative;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
    height: 615px;
    /* User talebi: Sabit yükseklik */
}

.oem-card-title {
    font-family: 'Google Sans Flex 9pt', sans-serif;
    color: #1B2C5D;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    max-width: 210px;
    margin-bottom: 15px;
}

.oem-card-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 15px;
    color: #1B2C5D80;
    /* Biraz daha koyu gri */
    line-height: 1.6;
    margin-bottom: 15px;
}

.oem-highlight-img-wrapper {
    margin-top: auto;
    width: 100%;
    margin-bottom: -5px;
    flex-grow: 1;
    /* Alanı kapla */
    display: flex;
    /* Görseli stretch yapabilmek için */
}

.oem-highlight-img-wrapper img {
    width: 100%;
    height: 100%;
    /* Kapsayıcı yüksekliği kadar */
    min-height: 250px;
    /* Minimum yükseklik garantisi */
    object-fit: cover;
    /* Görüntüyü kırp ama doldur */
    border-bottom-left-radius: 0;
    /* Kartın sol altı düz */
    border-bottom-right-radius: 30px;
    /* Kartın sağ altı yuvarlak */
}

/* Product Mini Cards (Right Grid) */
.row.g-3 {
    --bs-gutter-y: 1rem;
    /* Dikey boşluk */
    --bs-gutter-x: 1rem;
    /* Yatay boşluk */
}

.product-mini-card {
    border-radius: 25px;
    /* Yumuşak köşeler */
    padding: 25px;
    height: 100%;
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
}

/* Kart Renk Varyasyonları (HTML'de nth-child kullanılabilir ama class eklemek daha güvenli) */
/* Sol Üst ve Sağ Alt: Gri Mavi */
.prod-card-gray {
    background-color: #E0EFF2;
}

/* Sağ Üst ve Sol Alt: Turkuaz Mavi */
.prod-card-blue {
    background-color: #CEEBF1;
}

.product-mini-card:hover {
    transform: translateY(-5px);
}

.prod-img-area {
    margin-bottom: 20px;
    text-align: left;
    height: 120px;
    /* Sabit yükseklik, başlık hizalaması için */
    display: flex;
    align-items: flex-start;
    /* Görsel üstte dursun */
}

.prod-img-area img {
    max-height: 120px;
    width: auto;
    mix-blend-mode: multiply;
    display: block;
}

.prod-title {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 800;
    color: #1B2C5D;
    margin-bottom: 8px;
    line-height: 1.3;
    min-height: 42px;
    /* 2 satıra yetecek kadar */
    display: flex;
    align-items: center;
    /* Veya flex-start */
}

.prod-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #1B2C5D80;
    line-height: 1.5;
    margin-bottom: 0;
    margin-top: 10px;
}

@media (max-width: 991px) {
    .oem-main-title {
        font-size: 32px;
        text-align: center;
        margin-bottom: 20px;
    }

    .btn-oem {
        display: table;
        margin: 0 auto;
    }

    .oem-highlight-card {
        margin-bottom: 30px;
        min-height: 400px;
        height: auto !important;
        /* Mobilde oto yükseklik */
    }

    .oem-highlight-img-wrapper img {
        min-height: auto;
        flex-grow: 0;
    }
}


/* ===================================
   GUARANTEE SECTION (OEM Güvencesi)
   =================================== */
.guarantee-section {
    padding-top: 120px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    background: linear-gradient(90deg, #FFFFFF 0%, #F0FBFF 100%);
    overflow: hidden;
}

.guarantee-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    color: #1B2C5D;
    font-size: 42px;
    line-height: 1.1;
    margin-bottom: 25px;
    text-transform: uppercase;
}

.guarantee-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #1B2C5D80;
    margin-bottom: 35px;
}

.btn-guarantee {
    display: inline-block;
    background-color: #44A6B7;
    color: #fff;
    padding: 14px 45px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 10px 20px rgba(68, 166, 183, 0.25);
}

.btn-guarantee:hover {
    background-color: #1B2C5D;
    color: #fff;
    transform: translateY(-2px);
}

/* Guarantee Image */
.guarantee-img-wrapper {
    position: relative;
    z-index: 1;
}

.guarantee-main-img {
    max-height: 700px;
    /* Görsel büyütüldü */
    width: auto;
    /* mix-blend-mode: multiply; Eğer arka plan beyaz değilse işe yarar */
}

/* Badge Styling */
.guarantee-badge {
    position: absolute;
    bottom: 20px;
    left: 40px;
    /* Konumu biraz düzelttim */
    width: 210px;
    height: 210px;

    /* Figma Verileri */
    background: rgba(255, 255, 255, 0.49);
    /* Fill: White %49 */
    border: 1px solid rgba(27, 44, 93, 0.05);
    /* Stroke: #1B2C5D %5 */
    backdrop-filter: blur(5px);
    /* Background Blur */
    -webkit-backdrop-filter: blur(10px);
    /* Safari Support */

    border-radius: 50%;
    /* Daire */

    /* Eski özellikleri sıfırla */
    background-size: initial;
    box-shadow: none;

    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.badge-top-text {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 10px;
    color: #1B2C5D;
    letter-spacing: 1px;
    margin-bottom: 0;
    text-transform: uppercase;
}

.badge-number {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 64px;
    color: #44A6B7;
    /* Turkuaz */
    font-weight: 700;
    line-height: 0.9;
    position: relative;
    display: inline-block;
}

.badge-year {
    font-size: 12px;
    color: #1B2C5D;
    position: absolute;
    top: 10px;
    right: -25px;
    font-weight: 600;
}

.badge-row {
    margin-bottom: -5px;
}

.badge-bottom-text {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 14px;
    color: #1B2C5D;
    font-weight: 500;
    margin-top: 5px;
}

@media (max-width: 991px) {
    .guarantee-section {
        text-align: center;
        padding: 60px 0;
    }

    .guarantee-img-wrapper {
        text-align: center !important;
        margin-top: 40px;
    }

    .guarantee-main-img {
        max-width: 100%;
        height: auto;
    }

    .guarantee-badge {
        left: 50%;
        transform: translateX(-50%) translateY(83px);
        bottom: -30px;
        /* Mobilde biraz taşsın */
    }
}

/* ===================================
   PROBLEM SECTION (Aracınızda Ne Sorun Var?)
   =================================== */
.problem-section {
    padding: 100px 0;
    background-color: #ffffff;
    /* SVG'deki Blur Efekti Taklidi: Sağ tarafta yoğun turkuaz ışık */
    background-image: radial-gradient(circle at 75% 50%, rgba(65, 168, 185, 0.5) 0%, rgba(65, 168, 185, 0.1) 40%, rgba(255, 255, 255, 0) 70%);
    overflow: hidden;
}

.problem-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 32px;
    color: #1B2C5D;
    margin-bottom: 10px;
    font-weight: bold;
    text-transform: uppercase;
}

.problem-subtitle {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 300;
    color: #1B2C5D80;
}

/* Sorun Kartları */
.problem-card {
    padding: 15px;
    border-radius: 12px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.problem-card:hover {
    background: #fff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    transform: translateY(-2px);
    /* Ufak bir hareket de katalım */
}

.active-problem-card {
    background: #fff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    padding: 25px;
    /* Aktif kart biraz daha geniş paddingli */
    border-radius: 16px;
}

.prob-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    /* Icon küçülmesin */
    width: 40px;
    height: 40px;
    background: rgba(68, 166, 183, 0.1);
    /* Hafif turkuaz zemin */
    border-radius: 50%;
    color: #44A6B7;
    /* Icon rengi */
}

.prob-icon .material-symbols-outlined {
    font-size: 24px;
}

.prob-card-title {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #1B2C5D;
    margin-bottom: 5px;
    font-weight: 700;
}

.prob-card-desc {
    font-size: 15px;
    color: #1B2C5D80;
    margin-bottom: 0;
    line-height: 1.5;
}

/* Usta ve CTA Alanı */
/* Usta ve CTA Alanı */
.master-img-wrapper {
    position: relative;
    z-index: 1;
    /* Usta arkada kalsın */
    text-align: center;
    transform: translateY(20px);
    /* Biraz aşağı sarkıtabiliriz ki kutunun içine iyice girsin */
}

.master-img {
    max-height: 600px;
    /* Görseli ciddi oranda büyüttüm */
    width: auto;
    filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.1));
}

.problem-cta-box {
    /* Arka planı geri getirdim */
    padding: 30px;
    border-radius: 20px;
    position: relative;
    z-index: 2;
    /* Kutu önde */
    margin-top: -100px;
    /* Görselin üzerine binsin */
}

.cta-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 20px;
    color: #1B2C5D;
    font-weight: 700;
    margin-bottom: 10px;
}

.cta-desc {
    font-size: 14px;
    color: #1B2C5D80;
    line-height: 1.5;
    max-width: 400px;
    margin-bottom: 0;
}

.col-lg-6.offset-lg-1.d-flex.flex-column.justify-content-between.position-relative {
    box-shadow: 0 0 0 100px #FFFFFF24;
}

.btn-cta {
    display: inline-block;
    background-color: #44A6B7;
    color: #fff;
    padding: 12px 25px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    white-space: nowrap;
    margin-left: 20px;
}

.btn-cta:hover {
    background-color: #1B2C5D;
    color: #fff;
}

/* Hizmet Kartları (Alt Kısım) */
.service-card {
    background: #fff;
    padding: 30px;
    border-radius: 16px;
    height: 100%;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.03);
    transition: transform 0.3s ease;
}

.service-card:hover {
    transform: translateY(-5px);
}

.srv-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    /* Biraz daha büyük */
    height: 60px;
    border-radius: 50%;
    color: #44A6B7;
}

.srv-icon .material-symbols-outlined {
    font-size: 32px;
}

.srv-title {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #1B2C5D;
    font-weight: 700;
    margin-bottom: 10px;
}

.srv-desc {
    font-size: 15px;
    color: #1B2C5D80;
    line-height: 1.5;
    margin-bottom: 0;
}

/* ===================================
   FAQ SECTION (Sıkça Sorulan Sorular)
   =================================== */
.faq-section {
    padding: 100px 0;
    background: linear-gradient(180deg, #FFFFFF 0%, #F0FBFF 100%);
    /* Hafif maviye geçiş */
}

.faq-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 32px;
    font-weight: bold;
    color: #1B2C5D;
    line-height: 1.1;
    text-transform: uppercase;
}

/* Custom Accordion */
.custom-accordion .accordion-item {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #1B2C5D30;
    /* İnce çizgi */
    border-radius: 0 !important;
}

.custom-accordion .accordion-item:last-child {
    border-bottom: none;
}

.custom-accordion .accordion-button {
    background-color: transparent;
    box-shadow: none;
    /* Focus outline kaldır */
    padding: 25px 0;
    /* Geniş boşluk */
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #1B2C5D;
    border-radius: 0 !important;
}

.custom-accordion .accordion-button:not(.collapsed) {
    background-color: transparent;
    /* Açıkken de şeffaf */
    color: #1B2C5D;
    /* Renk değişmesin */
    box-shadow: none;
}

.custom-accordion .accordion-body {
    padding: 0 0 25px 0;
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #1B2C5D80;
    /* Soluk metin */
    line-height: 1.6;
}

/* Bootstrap Accordion Icon Özelleştirme */
.custom-accordion .accordion-button::after {
    background-image: url('img/icon_up.svg') !important;
    /* Yol Düzeltildi ve !important eklendi */
    /* Kullanıcının ikonu */
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent;
    width: 24px;
    /* Boyut ayarı */
    height: 24px;
    transform: rotate(180deg);
    /* Kapalıyken aşağı baksın (Ters) */
    transition: transform 0.3s ease;
    filter: none;
    /* Renk filtresini kaldırdım, SVG rengi geçerli olsun */
}

.custom-accordion .accordion-button:not(.collapsed)::after {
    transform: rotate(0deg);
    /* Açıkken yukarı baksın (Orijinal) */
    background-image: url('img/icon_up.svg') !important;
    /* Aynı ikon */
}

@media (max-width: 991px) {
    .master-img-wrapper {
        margin-top: 40px;
        margin-bottom: 0;
    }

    .problem-cta-box {
        flex-direction: column;
        text-align: center;
        margin-top: 20px;
    }

    .btn-cta {
        margin-left: 0;
        margin-top: 20px;
    }

    .problem-section {
        padding: 50px 0;
    }
}

/* ===================================
   BOTTOM CTA BANNER
   =================================== */
.bottom-cta-section {
    background-color: #1B2C5D;
    /* Marka Laciverti */
    padding: 20px 0;
    margin-top: 10;
    /* FAQ'dan hemen sonra */
}

.bottom-cta-text {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 18px;
    /* Mobilde küçülteceğiz */
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 0;
    line-height: 1.4;
}

.btn-bottom-cta {
    display: inline-block;
    background: #41A8B9;
    /* Turkuaz Gradient */
    color: #fff;
    padding: 15px 35px;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.btn-bottom-cta:hover {
    background: #ffffff;
    color: #1B2C5D;
    transform: translateY(-2px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
}

@media (max-width: 768px) {
    .bottom-cta-text {
        font-size: 15px;
        text-align: center;
        margin-bottom: 20px;
    }

    .bottom-cta-section .col-md-5 {
        text-align: center !important;
    }
}

/* GIF Wrapper (Taşmaları önlemek için) */
.gif-wrapper {
    overflow: hidden;
    /* Scale yapınca taşmasın */
    width: 100%;
}

.footer-gif {
    width: 100%;
    /* 1920x575 Oranı */
    aspect-ratio: 2720 / 700;
    object-fit: cover;

    transform: scale(1.2);
    transform-origin: top center;
}

/* GIF Üzerindeki Yazı (Overlay) */
.gif-overlay-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    width: 100%;

    /* Animasyon Başlangıcı */
    opacity: 0;
}

/* JS ile tetiklenecek animasyon */
.gif-overlay-text.active {
    animation: fadeInText 1s ease forwards;
    /* 1 saniyede belirsin */
    animation-delay: 3.5s;
    /* GIF başladıktan 2.5 saniye sonra çıksın */
}

.gif-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 48px;
    font-weight: 800;
    color: #fff;
    text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    line-height: 1.2;
    margin: 0;
}

.gif-subtitle {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 20px;
    color: rgba(255, 255, 255, 0.9);
    margin: 0;
    font-weight: 400;
    max-width: 800px;
}

.btn-gif-cta {
    background-color: #41A8B9;
    color: #fff;
    padding: 12px 30px;
    border-radius: 50px;
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.btn-gif-cta:hover {
    background-color: #fff;
    color: #1B2C5D;
    transform: translateY(-2px);
}

@keyframes fadeInText {
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
        /* Hafif bir scale efekti de eklenebilir */
    }
}

@media (max-width: 768px) {
    .gif-wrapper {
        min-height: 300px;
    }

    .footer-gif {
        aspect-ratio: 16 / 12;
        min-height: 300px;
    }

    .gif-title {
        font-size: 28px;
    }

    .gif-subtitle {
        font-size: 16px;
        padding: 0 20px;
    }

    .btn-gif-cta {
        font-size: 14px;
        padding: 10px 24px;
    }
}

.gif-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #1b2c5d93;
    /* Marka Laciverti */
    /* Görselle kaynaştır */
    z-index: 5;
    /* Yazının altında, GIF'in üstünde */
    /* Çok koyu olursa buradan ayarlanabilir, şimdilik biraz kıstım */
}

/* ===================================
   FOOTER SECTION
   =================================== */
.footer-section {
    background-color: #1B2C5D;
    color: #fff;
    font-family: 'Google Sans Flex', sans-serif;
    position: relative;
    z-index: 10;
    overflow: hidden;
    /* Glow taşmasın */
}

/* SVG Glow Efekti Simülasyonu */
.footer-section::before {
    content: '';
    position: absolute;
    /* SVG: cx="1305" cy="201" -> 1920x620 içinde approx %68 left, %30 top */
    top: 30%;
    left: 68%;
    width: 800px;
    height: 800px;
    background: #41A8B9;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    filter: blur(200px);
    /* 440px gaussian çok fazla, CSS için 200px yeterli yumuşaklık sağlar */
    opacity: 0.4;
    z-index: -1;
    pointer-events: none;
}

.footer-desc {
    font-size: 14px;
    line-height: 1.6;
    color: #1B2C5D80;
    max-width: 350px;
}

.footer-heading {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #fff;
}

.footer-links ul li {
    margin-bottom: 10px;
}

.footer-links ul li a {
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
}

.footer-links ul li a:hover {
    color: #44A6B7;
    /* Turkuaz Hover */
}

.footer-social a {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    transition: all 0.3s ease;
}

.footer-social a:hover {
    background-color: #44A6B7;
    transform: translateY(-2px);
}

.footer-contact li {
    font-size: 14px;
    margin-bottom: 12px;
}

/* Harita Banner */
.footer-map-banner {
    position: relative;
    /* İframe arka planı oluşturacak, renk gerekmez */
    background: transparent;
    padding: 60px 0;
    /* İçerik için boşluk */
    margin-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    min-height: 200px;
    /* Iframe için minimum yükseklik */
}

/* Harita Overlay - CSS'e taşıdık */
.map-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(27, 44, 93, 0.90);
    /* Marka rengi, %90 opaklık */
    z-index: 2;
    mix-blend-mode: multiply;
    /* İsteğe bağlı: haritayla kaynaşsın */
}

.btn-map-cta {
    background-color: #44A6B7;
    color: #fff;
    padding: 10px 25px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.btn-map-cta:hover {
    background-color: #358A99;
    color: #fff;
}

/* Footer Bottom - Arka planı şeffaflaştır */
.footer-bottom {
    background-color: transparent;
    /* Ana zemin devam etsin */
    /* En koyu ton */
    font-size: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.footer-legal-links a {
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-legal-links a:hover {
    color: #fff;
}


/* Page Specific Styles */
.contact-page-top-bar-iletisim {
    background-color: #1B2C5D;
    padding-top: 220px;
    /* Header Height compensation */
    padding-bottom: 60px;
    color: #fff;
}

.contact-page-title-iletisim {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 38px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.contact-map-wrapper-iletisim {
    width: 100%;
    height: 450px;
    background-color: #1B2C5D;
    /* Marka Rengi */
    position: relative;
}

.contact-map-wrapper-iletisim iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: invert(90%) hue-rotate(180deg);
}

.map-overlay-iletisim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* #1B2C5D %40 opacity */
    mix-blend-mode: multiply;
    pointer-events: none;
    /* Harita etkileşimini engellememesi için */
    z-index: 2;
}

.contact-content-section-iletisim {
    padding: 80px 0;
    background-color: #fff;
}

/* Left Column: Info */
.info-item-iletisim {
    margin-bottom: 40px;
}

.info-icon-iletisim {
    color: #44A6B7;
    font-size: 32px;
    margin-bottom: 10px;
    display: inline-block;
}

.info-title-iletisim {
    color: #44A6B7;
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 22px;
    text-transform: uppercase;
    margin-bottom: 10px;
    letter-spacing: 0.5px;
}

.info-desc-iletisim {
    color: #1B2C5D;
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 18px;
    line-height: 1.6;
    font-weight: 400;
}

/* Right Column: Form */
.contact-form-label-iletisim {
    color: #1B2C5D;
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 10px;
    display: block;
}

.contact-form-input-iletisim {
    background-color: #F5FCFE;
    /* Very light cyan/grey */
    border: none;
    border-radius: 50px;
    /* Pill shape for inputs */
    padding: 18px 25px;
    width: 100%;
    color: #1B2C5D;
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 14px;
    transition: all 0.3s ease;
}

.contact-form-textarea-iletisim {
    background-color: #F5FCFE;
    border: none;
    border-radius: 20px;
    padding: 20px;
    width: 100%;
    color: #1B2C5D;
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 14px;
    resize: none;
    min-height: 150px;
}

.contact-form-input-iletisim:focus,
.contact-form-textarea-iletisim:focus {
    outline: none;
    background-color: #fff;
    box-shadow: 0 0 0 2px #44A6B7;
}

.btn-contact-submit-iletisim {
    background-color: #44A6B7;
    color: #fff;
    font-weight: 600;
    padding: 14px 40px;
    border-radius: 50px;
    border: none;
    display: inline-block;
    margin-top: 10px;
    transition: all 0.3s ease;
    font-size: 15px;
}

.btn-contact-submit-iletisim:hover {
    background-color: #1B2C5D;
    transform: translateY(-2px);
}

@media (max-width: 991px) {
    .contact-page-top-bar-iletisim {
        padding-top: 140px;
        padding-bottom: 40px;
    }

    .contact-page-title-iletisim {
        font-size: 28px;
    }

    .info-item-iletisim {
        text-align: center;
    }

    .info-desc-iletisim {
        margin: 0 auto;
    }

    .contact-form-wrapper-iletisim {
        margin-top: 40px;
    }
}

/* Floating WhatsApp Button */
.whatsapp-float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.3s ease;
}

.whatsapp-float:hover {
    background-color: #128C7E;
    color: #FFF;
    transform: scale(1.1);
}

.whatsapp-float i {
    margin-top: 2px;
    /* Slight adjustment for visual centering */
}

@media (max-width: 768px) {
    .whatsapp-float {
        width: 50px;
        height: 50px;
        bottom: 20px;
        right: 20px;
        font-size: 25px;
    }
}

/* WhatsApp Pulse Animation */
@keyframes pulse-green {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
    }

    70% {
        box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
    }
}

.whatsapp-float {
    animation: pulse-green 2s infinite;
}

/* WhatsApp Hint Bubble */
.whatsapp-hint {
    position: fixed;
    bottom: 52px;
    right: 115px;
    /* Button width (60) + margin (40) + gap (15) */
    background-color: #fff;
    color: #1B2C5D;
    padding: 10px 18px;
    border-radius: 50px 50px 4px 50px;
    /* Konuşma balonu şekli */
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
    font-size: 14px;
    font-weight: 700;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transform: translateX(20px) scale(0.8);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    pointer-events: none;
    white-space: nowrap;
}

.whatsapp-hint.show {
    opacity: 1;
    visibility: visible;
    transform: translateX(0) scale(1);
}

@media (max-width: 768px) {
    .whatsapp-hint {
        bottom: 30px;
        right: 80px;
        font-size: 12px;
        padding: 8px 14px;
    }
}

/* Corporate Hero Section Design */
.corporate-hero-section {
    background: url('/assets/img/kurumsal_01.png') no-repeat center center/cover;
    position: relative;
    margin-top: 100px;
    /* Spacing via padding instead of margin to prevent gaps */
    padding: 240px 0 100px 0;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

.corporate-hero-section::before {
    /* Overlay for better readability if needed */
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(27, 44, 93, 0.2);
    /* Slight tint */
    pointer-events: none;
    z-index: 1;
}

.crew-label {
    position: absolute;
    top: 15%;
    left: 8%;
    color: rgba(255, 255, 255, 0.9);
    z-index: 2;
}

.crew-label h4 {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    text-transform: lowercase;
}

.crew-label span {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 13px;
    font-weight: 400;
    opacity: 0.7;
}

.corporate-content-wrapper {
    color: #fff;
    padding-left: 0;
    position: relative;
    z-index: 2;
}

.corp-subtitle {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 0.8);
}

.corp-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 72px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.corp-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 18px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.7);
    max-width: 500px;
    margin-bottom: 40px;
}

.btn-corp-cta {
    background-color: #44A6B7;
    color: #fff;
    font-weight: 600;
    padding: 15px 40px;
    border-radius: 50px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
}

.btn-corp-cta:hover {
    background-color: #fff;
    color: #1B2C5D;
    transform: translateY(-3px);
}

@media (max-width: 991px) {
    .corporate-hero-section {
        padding: 60px 0;
        text-align: center;
        background-position: 45% center;
        min-height: 600px !important;
        /* Override desktop height */
        align-items: flex-end;
        /* Text bottom */
        margin-top: 0;
        /* Removing gap on mobile */
    }

    /* Strong gradient for mobile text readability */
    .corporate-hero-section::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(to top, rgba(27, 44, 93, 1) 0%, rgba(27, 44, 93, 0.6) 50%, rgba(27, 44, 93, 0.1) 100%);
        z-index: 1;
        pointer-events: none;
    }

    .corporate-content-wrapper {
        padding: 0 15px;
        position: relative;
        z-index: 3;
    }

    .corp-title {
        font-size: 36px;
        margin-bottom: 15px;
    }

    .corp-subtitle {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .corp-desc {
        margin: 0 auto 30px auto;
        font-size: 16px;
        color: rgba(255, 255, 255, 0.9);
    }

    .crew-label {
        display: none;
    }
}

/* Vision & Mission Section */
.vision-mission-section {
    padding: 120px 0;
    background: linear-gradient(135deg, #ffffff 0%, #f0f8fa 100%);
    /* Light gradient */
}

.vm-main-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    text-transform: uppercase;
    line-height: 1.1;
    color: #1B2C5D;
    /* Brand Dark Blue */
}

.vm-line-1 {
    font-weight: 300;
    /* Thinner */
    font-size: 32px;
    display: block;
    color: #556080;
}

.vm-line-2 {
    font-weight: 700;
    /* Bolder */
    font-size: 32px;
    display: block;
}

.vm-item-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 32px;
    font-weight: 500;
    color: #1B2C5D;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.vm-item-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 18px;
    line-height: 1.6;
    color: #1B2C5D;
}

.vm-separator {
    width: 100%;
    height: 1px;
    background-color: #d1d9e6;
    margin: 40px 0;
}

@media (max-width: 991px) {
    .vision-mission-section {
        padding: 60px 0;
    }

    .vm-line-1 {
        font-size: 24px;
    }

    .vm-line-2 {
        font-size: 28px;
        margin-bottom: 40px;
    }
}

/* Kurumsal 3. Section Styles */
.section_wrapper_kurumsal_uc {
    padding: 100px 0;
    background-color: #ffffff;
    background-image: radial-gradient(circle at 15% 30%, rgba(65, 168, 185, 0.25) 0%, rgba(255, 255, 255, 0) 60%);
}

.title_wrapper_kurumsal_uc {
    margin-bottom: 40px;
}

.title_line1_kurumsal_uc {
    display: block;
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-weight: 300;
    font-size: 36px;
    color: #1B2C5D;
    line-height: 1.2;
    text-transform: uppercase;
}

.title_line2_kurumsal_uc {
    display: block;
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-weight: 700;
    font-size: 36px;
    color: #1B2C5D;
    line-height: 1.2;
    text-transform: uppercase;
}

.logos_wrapper_kurumsal_uc {
    display: flex;
    gap: 20px;
    margin-top: 30px;
}

.cert_logo_kurumsal_uc {
    width: 210px;
    height: 123px;
    background: rgba(255, 255, 255, 0.52);
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 0 60px 0 60px;
    /* Custom shape matching SVG */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    box-shadow: none;
}

.cards_grid_kurumsal_uc {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.card_item_kurumsal_uc {
    background: #ffffffab;
    border-radius: 20px;
    padding: 30px 20px;
    text-align: left;
    /* Aligned left */
    box-shadow: 0 1px 3px rgba(27, 44, 93, 0.04);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 1px solid rgba(27, 44, 93, 0.03);
}

.card_item_kurumsal_uc:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(27, 44, 93, 0.08);
}

.icon_wrapper_kurumsal_uc {
    margin-bottom: 20px;
    display: flex;
    /* Flex for vertical centering */
    align-items: center;
    justify-content: center;

    height: 90px;
    /* Fixed height for Title alignment */
    padding: 0;
    border-radius: 0;
}

.icon_wrapper_kurumsal_uc i,
.icon_wrapper_kurumsal_uc span {
    font-size: 32px;
    color: #44A6B7;
    /* Brand Turquoise */
    background: -webkit-linear-gradient(45deg, #1B2C5D, #44A6B7);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.icon_wrapper_kurumsal_uc img {
    width: 75px;
    height: auto;
    display: block;
}

.card_title_kurumsal_uc {
    font-family: 'Google Sans Flex', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #1B2C5D;
    margin-bottom: 15px;
    line-height: 1.4;
    min-height: 48px;
    /* Ensure 2 lines structure */
    display: flex;
    align-items: center;
}

.card_desc_kurumsal_uc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #1B2C5D80;
    line-height: 1.6;
}

@media (max-width: 991px) {
    .section_wrapper_kurumsal_uc {
        padding: 60px 0;
    }

    .title_line1_kurumsal_uc,
    .title_line2_kurumsal_uc {
        font-size: 28px;
        text-align: center;
    }

    .logos_wrapper_kurumsal_uc {
        justify-content: center;
        margin-bottom: 50px;
    }

    .cards_grid_kurumsal_uc {
        grid-template-columns: repeat(2, 1fr);
        /* 2 columns on mobile */
        gap: 20px;
    }
}

/* Products Page Body Style */
.products-page-body {
    background-color: #f8fbff !important;
}

/* Kurumsal 4. Section Styles */
.section_wrapper_kurumsal_dort {
    padding: 100px 0;
    background: url('/assets/img/kurumsal_uc_back_01.svg') no-repeat center center/cover;

    background-size: cover;
    text-align: center;
    position: relative;
}

.title_kurumsal_dort {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 42px;
    color: #1B2C5D;
    margin-bottom: 25px;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 1.2;
}

.title_kurumsal_dort span {
    font-weight: 300;
}

.desc_kurumsal_dort {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #1B2C5D;
    max-width: 900px;
    margin: 0 auto 40px auto;
    line-height: 1.6;
}

.btn_kurumsal_dort {
    display: inline-block;
    background-color: #44A6B7;
    color: #fff;
    padding: 15px 40px;
    border-radius: 30px;
    font-family: 'Google Sans Flex', sans-serif;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    margin-bottom: 60px;
}

.btn_kurumsal_dort:hover {
    background-color: #1B2C5D;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(27, 44, 93, 0.2);
}

.image_wrapper_kurumsal_dort {
    margin-top: 20px;
}

.image_wrapper_kurumsal_dort img {
    max-width: 80%;
    height: auto;
}

@media (max-width: 991px) {
    .section_wrapper_kurumsal_dort {
        padding: 60px 0;
    }

    .title_kurumsal_dort {
        font-size: 28px;
    }

    .desc_kurumsal_dort {
        font-size: 14px;
        padding: 0 15px;
    }

    .image_wrapper_kurumsal_dort img {
        max-width: 100%;
    }
}

/* Kurumsal 5. Section Styles */
.section_wrapper_kurumsal_bes {
    padding: 200px 0 100px 0;
    /* Align content to top area */
    background: url('/assets/img/kurumsal_02.png') no-repeat center center;
    background-size: cover;
    text-align: center;
    position: relative;
    /* Fallback if image missing */
    background-color: #daeaf5;
    min-height: 1080px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    /* Move content up */
}

.title_kurumsal_bes {
    font-family: 'Zalando Sans Expanded', sans-serif;
    color: #ffffff;
    font-size: 48px;
    line-height: 1.1;
    text-transform: uppercase;
    margin-bottom: 30px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.title_kurumsal_bes span {
    display: block;
}

.title_part_1_bes {
    font-weight: 800;
    /* Bold */
}

.title_part_2_bes {
    font-weight: 300;
    /* Thin */
}

.desc_kurumsal_bes {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 18px;
    color: #1B2C5D;
    max-width: 720px;
    margin: 0 auto 40px auto;
    font-weight: 500;
    line-height: 1.6;
}

.btn_kurumsal_bes {
    display: inline-block;
    background-color: #44A6B7;
    color: #ffffff;
    padding: 15px 50px;
    border-radius: 30px;
    font-family: 'Google Sans Flex', sans-serif;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    box-shadow: 0 4px 10px rgba(68, 166, 183, 0.3);
}

.btn_kurumsal_bes:hover {
    background-color: #1B2C5D;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(27, 44, 93, 0.2);
}

@media (max-width: 991px) {
    .section_wrapper_kurumsal_bes {
        padding: 100px 0 60px 0;
        min-height: 600px;
        /* Reset height for mobile */
        background-position: center top;
        /* Focus on top part/sky */
    }

    .title_kurumsal_bes {
        font-size: 28px;
        margin-bottom: 20px;
    }

    .desc_kurumsal_bes {
        font-size: 15px;
        padding: 0 20px;
        line-height: 1.5;
        margin-bottom: 30px;
    }

    .btn_kurumsal_bes {
        padding: 12px 35px;
        font-size: 14px;
    }
}

/* Technical Service Hero Section */
.technical-hero-section {
    background: url('/assets/img/teknikservis_back_01.png') no-repeat center center;
    background-size: cover;
    /* Ensures fully covers area */
    height: 925px;
    /* Requested fixed height */
    min-height: 925px;
    display: flex;
    align-items: center;
    position: relative;
    padding-top: 100px;
    /* Space for fixed header */
    margin-top: 10em;

}

.ts-hero-content {
    color: #fff;
    max-width: 600px;
    margin-left: auto;
    /* Push to right side */
    padding-right: 5%;
}

.ts-hero-subtitle {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 10px;
    opacity: 0.8;
}

.ts-hero-subtitle strong {
    font-weight: 700;
}

.ts-hero-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 80px;
    font-weight: 700;
    line-height: 0.9;

    text-transform: uppercase;
    margin-bottom: 30px;
}

.ts-hero-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 40px;
    opacity: 0.8;
    color: #e0e0e0;
}

.btn-ts-hero {
    background-color: #44A6B7;
    color: #fff;
    padding: 15px 40px;
    border-radius: 50px;
    font-family: 'Google Sans Flex', sans-serif;
    font-weight: 600;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    border: none;
    margin-bottom: 50px;
}

.btn-ts-hero:hover {
    background-color: #fff;
    color: #1B2C5D;
    transform: translateY(-2px);
}

.ts-hero-badges {
    display: flex;
    gap: 20px;
}

.ts-hero-badges img {
    height: 40px;
    width: auto;
    opacity: 0.9;
}

/* Mobile Responsiveness */
@media (max-width: 991px) {
    .technical-hero-section {
        background-position: 0% center;
        /* Adjust to show truck mostly */
        height: auto;
        /* Override desktop fixed height */
        min-height: 500px;
        padding: 140px 0 60px 0;
        /* Reduced top padding */
        margin-top: 0;
        /* Reset desktop margin */
        text-align: left;
        /* Keep left align on mobile but maybe adjust padding */
    }

    .ts-hero-content {
        margin-left: 0;
        padding: 0 15px;
        max-width: 100%;
        background: linear-gradient(to right, rgba(27, 44, 93, 0.95), rgba(27, 44, 93, 0.8));
        /* Overlay for text readability on mobile */
        border-radius: 20px;
        padding: 30px;
    }

    .ts-hero-title {
        font-size: 48px;
    }
}

/* Technical Service Solutions Section */
.ts-solutions-section {
    padding: 100px 0;
    background: linear-gradient(90deg, #F5FBFD 0%, #FFFFFF 100%);
}

.ts-solutions-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 42px;
    line-height: 1.1;
    color: #1B2C5D;
    margin-bottom: 25px;
    text-transform: uppercase;
}

.ts-solutions-title span {
    font-weight: 700;
    display: block;
}

.ts-solutions-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #556080;
    margin-bottom: 40px;
    line-height: 1.6;
    max-width: 90%;
}

.btn-ts-solutions {
    display: inline-block;
    background-color: #44A6B7;
    color: #fff;
    padding: 15px 35px;
    border-radius: 30px;
    font-family: 'Google Sans Flex', sans-serif;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    box-shadow: 0 4px 10px rgba(68, 166, 183, 0.3);
}

.btn-ts-solutions:hover {
    background-color: #1B2C5D;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(27, 44, 93, 0.2);
}

/* TS Solution Cards */
.ts-cards-wrapper {
    display: flex;
    gap: 20px;
    justify-content: flex-end;
}

.ts-solution-card {
    background: #fff;
    border-radius: 20px 0 20px 0;
    /* Distinct shape based on other elements */
    padding: 30px 20px;
    width: 100%;
    max-width: 200px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.ts-solution-card:hover {
    transform: translateY(-5px);
}

.ts-card-icon {
    margin-bottom: 20px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ts-card-icon img {
    max-height: 100%;
    width: auto;
}

.ts-card-title {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #1B2C5D;
    line-height: 1.4;
}

@media (max-width: 991px) {
    .ts-solutions-section {
        padding: 60px 0;
        text-align: center;
    }

    .ts-solutions-title {
        font-size: 28px;
    }

    .ts-solutions-desc {
        max-width: 100%;
    }

    .ts-cards-wrapper {
        flex-direction: row;
        /* Side by side */
        align-items: stretch;
        margin-top: 40px;
        gap: 10px;
    }

    .ts-solution-card {
        max-width: none;
        width: auto;
        flex: 1;
        flex-direction: column;
        /* Icon top, text bottom */
        text-align: center;
        padding: 20px 10px;
        border-radius: 15px;
        justify-content: flex-start;
        gap: 10px;
    }

    .ts-card-icon {
        margin-bottom: 5px;
        height: 50px;
        width: auto;
        justify-content: center;
    }

    .ts-card-title {
        font-size: 13px;
    }
}

/* Production Page Hero Section */
.production-hero-section {
    background-image: url('img/uretim_01.png');
    background-size: cover;
    background-position: center;
    height: 100vh;
    width: 100%;
    margin-top: 80px;
    /* Counteract header height if needed, assuming header is transparent/overlay */
    position: relative;
    z-index: 0;
}

@media (max-width: 991px) {
    .production-hero-section {
        margin-top: 6em;
        height: 50vh;
        min-height: 500px;
    }
}

/* Uretim Bolum 1 */
.uretim_bir {
    padding: 60px 0;
    background-color: #fff;
}

.uretim_bir_container {
    max-width: 800px;
    margin: 0 auto;
    /* Center alignment if single column, or modify for left align if needed */
    padding: 0 15px;
}

.uretim_bir_ust_baslik {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #1B2C5D;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 5px;
    display: block;
}

.uretim_bir_baslik {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 32px;
    font-weight: 800;
    color: #1B2C5D;
    line-height: 1.2;
    text-transform: uppercase;
    margin-bottom: 25px;
}

.uretim_bir_aciklama {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    font-weight: 300;
    color: #556080;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .uretim_bir_baslik {
        font-size: 24px;
    }
}

/* Production Feature Sections - Common Styles */
.prod-feature-subtitle {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 32px;
    font-weight: 400;
    color: #1B2C5D;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 5px;
    display: block;
    line-height: 1.2;
}

.prod-feature-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 42px;
    font-weight: 800;
    color: #1B2C5D;
    line-height: 1.1;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.prod-feature-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: #1B2C5D;
    /* Standardizing color to dark blue as per requested in dort section */
    line-height: 1.6;
    margin-bottom: 35px;
    max-width: 90%;
}

.prod-feature-btn {
    background-color: #44A6B7;
    color: #fff;
    padding: 14px 45px;
    border-radius: 30px;
    font-family: 'Google Sans Flex', sans-serif;
    font-weight: 600;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    border: none;
    box-shadow: 0 4px 10px rgba(68, 166, 183, 0.3);
}

.prod-feature-btn:hover {
    background-color: #1B2C5D;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(27, 44, 93, 0.2);
}

.prod-feature-img-wrapper {
    position: relative;
    padding-right: 30px;
    text-align: center;
}

.prod-feature-img-wrapper img {
    width: 100%;
    height: auto;
    max-width: 100%;
}

/* Feature Section Specific Backgrounds & Layout Adjustments */
.uretim_iki {
    padding: 100px 0;
    background: linear-gradient(90deg, #F9FCFF 0%, #FFFFFF 100%);
}

.uretim_uc {
    padding: 100px 0;
    position: relative;
    overflow: hidden;
    background-color: #fff;
}



.uretim_dort {
    padding: 100px 0;
    background: linear-gradient(90deg, #FFFFFF 0%, #F9FCFF 100%);
}

.uretim_dort_logos {
    display: flex;
    gap: 20px;
    margin-bottom: 35px;
}

.uretim_dort_logo_item {
    background: #fff;
    border-radius: 10px;
    padding: 10px 15px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 80px;
    height: 60px;
}

.uretim_dort_logo_item img {
    max-height: 40px;
    width: auto;
}

/* Mobile Responsiveness for Feature Sections */
@media (max-width: 991px) {

    .uretim_iki,
    .uretim_uc,
    .uretim_dort {
        padding: 60px 0;
    }

    .prod-feature-title {
        font-size: 28px;
    }

    .prod-feature-subtitle {
        font-size: 24px;
    }

    .prod-feature-desc {
        max-width: 100%;
        font-size: 16px;
    }

    .prod-feature-img-wrapper {
        padding-right: 0;
        margin-bottom: 40px;
    }

    /* Force image to top on mobile for all sections */
    .uretim_iki .row,
    .uretim_uc .row,
    .uretim_dort .row {
        flex-direction: column;
    }

    /* If the image is the second column in HTML (like uretim_uc), we need to reorder it to top */
    .uretim_uc .row {
        flex-direction: column-reverse;
    }
}

/* ===================================
   PRODUCTS PAGE STYLES
   =================================== */

/* Anniversary Badge Header */
.anniversary-badge-header {
    height: 40px;
    width: auto;
    filter: brightness(0) invert(1);
}

/* Header Wrapper for Products Page */
.products-page-header .header-wrapper {
    background-color: #1B2C5D !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    position: fixed !important;
}

/* Make header text white */
.products-page-header .header-wrapper .nav-link,
.products-page-header .header-wrapper a,
.products-page-header .header-wrapper span,
.products-page-header .header-wrapper i {
    color: #ffffff !important;
}

/* Products Hero Section */
.products-hero-section {
    position: relative;
    background-image: url('/assets/img/urunlerimiz_01.png');
    background-size: cover;
    background-position: center;
    height: 600px;
    display: flex;
    align-items: center;
    margin-top: 100px;
}

.products-hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.products-hero-container {
    position: relative;
    z-index: 2;
}

.hero-search-card {
    background-color: #1B2C5D;
    padding: 60px;
    border-radius: 20px;
    color: white;
    max-width: 600px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.hero-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 20px;
}

.hero-subtitle {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 30px;
    opacity: 0.9;
}

.hero-search-input-wrapper {
    position: relative;
}

.hero-search-input {
    width: 100%;
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 30px;
    padding: 15px 50px 15px 25px;
    color: white;
    font-size: 16px;
    font-family: 'Google Sans Flex', sans-serif;
}

.hero-search-input::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.hero-search-input:focus {
    outline: none;
    background-color: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.5);
}

.hero-search-icon {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255, 255, 255, 0.6);
    pointer-events: none;
}

/* Products Intro Section */
.products-intro-section {
    padding: 80px 0;
    background-color: #f8fbff;
    text-align: center;
}

.intro-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 32px;
    font-weight: 800;
    color: #1B2C5D;
    margin-bottom: 25px;
    text-transform: uppercase;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.3;
}

.intro-title span {
    font-weight: 400;
}

.intro-desc {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 16px;
    color: #556080;
    line-height: 1.8;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

/* Product Cards Section */
.product-list-section {
    padding-bottom: 100px;
    background: url('/assets/img/kurumsal_uc_back_01.svg') no-repeat center center/cover;
}

.product-card {
    background: #fff;
    border-radius: 20px;
    padding: 40px 20px;
    text-align: center;
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.03);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.product-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(27, 44, 93, 0.08);
}

.product-img {
    max-width: 100%;
    height: 200px;
    object-fit: contain;
    margin-bottom: 30px;
}

.product-title {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: #1B2C5D;
}

/* Responsive */
@media (max-width: 991px) {
    .products-hero-section {
        height: auto;
        padding: 100px 0 60px 0;
    }

    .hero-title {
        font-size: 20px;
    }

    .hero-search-card {
        padding: 40px;
        margin: 0 15px;
    }
}

/* Updated Hero Search Card Shape (SVG-like) */
.hero-search-card {
    background-color: #0F2155 !important;
    padding: 60px;
    border-radius: 0 20px 0 20px !important;
    color: white;
    max-width: 670px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* ===================================
   PRODUCT GROUPS PAGE STYLES
   =================================== */

.product-group-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 36px;
    font-weight: 700;
    color: #0F2155;
    text-transform: uppercase;
    margin-bottom: 40px;
    margin-top: 60px;
    text-align: left;
}

.product-oem-text {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 13px;
    color: #8D99AE;
    margin-top: 15px;
    line-height: 1.5;
    text-align: left;
    /* Image shows text roughly centered or left? Looks slightly left aligned to the card content which is centered. Usually centralized with card. Let's keep small text left aligned block inside centered card or centered? Image shows it aligned with title. Let's center it. */
    text-align: left;
    width: 100%;
    padding-left: 10px;
    /* Slight indent */
}

/* ===================================
   BREADCRUMB STYLES
   =================================== */

.custom-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 14px;
    color: #8D99AE;
}

.custom-breadcrumb a {
    color: #8D99AE;
    text-decoration: none;
    transition: color 0.3s ease;
}

.custom-breadcrumb a:hover {
    color: #1B2C5D;
    /* Dark Blue hover */
}

.custom-breadcrumb .separator {
    font-size: 12px;
    color: #ccc;
}

.custom-breadcrumb .active {
    color: #1B2C5D;
    font-weight: 500;
}

/* ===================================
   PRODUCT DETAIL PAGE STYLES
   =================================== */

.pd-section-wrapper {
    padding-top: 150px;
    padding-bottom: 80px;
    min-height: 100vh;
    font-family: 'Google Sans Flex', sans-serif;
    background: url('/assets/img/u_detay.svg') no-repeat center top;
    background-size: cover;
    /* or contain, or 100% depending on the svg nature, usually cover for SECTION backgrounds */
}

.pd-breadcrumb {
    font-size: 12px;
    color: #44A6B7;
    /* Teal color from image/brand? Or simplified grey */
    color: #8D99AE;
    margin-bottom: 10px;
    font-weight: 500;
}

.pd-breadcrumb a {
    color: #8D99AE;
    text-decoration: none;
}

.pd-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #1B2C5D;
    margin-bottom: 40px;
    line-height: 1.2;
}

.pd-image-card {
    background: #fff;
    /* 
       SVG Path analysis:
       Top-Left: 0,0 (Sharp)
       Top-Right: Rounded 60px
       Bottom-Right: Sharp
       Bottom-Left: Rounded 60px
    */
    border-radius: 0 60px 0 60px;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
    height: 100%;
    min-height: 600px;
    /* Approximate height from SVG */
}

.pd-image-card img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.pd-info-list {
    padding-left: 30px;
}

.pd-info-item {
    border-bottom: 1px solid rgba(27, 44, 93, 0.1);
    padding: 20px 0;
}

.pd-info-item:first-child {
    padding-top: 0;
}

.pd-label {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 20px;
    font-weight: 800;
    /* Bolder */
    color: #0F2155;
    /* Darker Navy */
    text-transform: uppercase;
    margin-bottom: 15px;
    display: block;
}

.pd-value {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 20px;
    /* Much larger */
    font-weight: 300;
    color: #9aa5b1;
    /* Light grayish blue */
    letter-spacing: -0.5px;
}

.pd-brand-logo {
    height: 30px;
    width: auto;
    margin-top: 5px;
    display: block;
}

.btn-pd-teklif {
    display: inline-block;
    margin-top: 30px;
    background-color: #44A6B7;
    color: white !important;
    padding: 12px 30px;
    border-radius: 30px;
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-pd-teklif:hover {
    background-color: #1B2C5D;
    transform: translateY(-2px);
}

/* Related Products Slider */
.related-products-section {
    padding-bottom: 100px;
    background: url('/assets/img/u_detay.svg') no-repeat center bottom;
    background-size: cover;
}

.related-title {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 20px;
    color: #1B2C5D;
    font-weight: 500;
    margin-bottom: 30px;
}

.related-slider-wrapper {
    position: relative;
    padding: 0 50px;
    /* Space for arrows */
}

.swiper-button-next-related,
.swiper-button-prev-related {
    color: #44A6B7;
    width: auto;
    height: auto;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
    transition: all 0.3s ease;
}

.swiper-button-next-related:after,
.swiper-button-prev-related:after {
    font-size: 16px;
    font-weight: bold;
}

.swiper-button-prev-related {
    left: 0;
}

.swiper-button-next-related {
    right: 0;
}

.swiper-button-next-related:hover,
.swiper-button-prev-related:hover {
    color: #1B2C5D;
    background: none;
    transform: translateY(-50%) scale(1.1);
}

/* ===================================
   ARAÇ GRUPLARI SECTION STYLES
   =================================== */

.arac-gruplari-section {
    padding: 80px 0;
    background: linear-gradient(180deg, #F8FBFF 0%, #FFFFFF 100%);
}

.arac-gruplari-title {
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 42px;
    font-weight: 300;
    color: #1B2C5D;
    text-transform: uppercase;
    line-height: 1.1;
    margin-bottom: 50px;
    letter-spacing: 2px;
}

.arac-brands-slider-wrapper {
    position: relative;
    padding: 0;
}

.aracBrandsSwiper {
    width: 100%;
    overflow: hidden;
}

.arac-logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
    /* Fixed height for consistency */
}

.arac-logo-item img {
    min-height: 45px;
    max-height: 60px;
    width: auto;
    object-fit: contain;
    filter: grayscale(20%);
    opacity: 0.9;
    transition: all 0.3s ease;
}

.arac-logo-item img:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.05);
}

.arac-logo-item .brand-name-text {
    font-family: 'Google Sans Flex', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #1B2C5D;
    text-transform: uppercase;
}

@media (max-width: 991px) {
    .arac-gruplari-section {
        padding: 60px 0;
    }

    .arac-gruplari-title {
        font-size: 32px;
        text-align: center;
    }

    .arac-brands-slider-wrapper {
        padding: 0;
    }

    .arac-logo-item img {
        max-height: 30px;
        min-height: 20px;
    }

    .arac-logo-item {
        height: 60px;
    }
}

/* Mobil görünüm */
@media (max-width: 768px) {

    .section_wrapper_kurumsal_bes::before {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.35); /* mobilde biraz daha güçlü */
        z-index: 1;
    }

    .section_wrapper_kurumsal_bes .container {
        position: relative;
        z-index: 2;
    }

    .title_kurumsal_bes,
    .desc_kurumsal_bes {
        color: #fff;
        text-shadow: 0 3px 10px rgba(0,0,0,0.45);
    }
}
