/* ==========================================================================
   Custom overrides — vendor (doit.css) dosyasına dokunmadan yapılan düzeltmeler
   ========================================================================== */

/* Menü öğelerinin herhangi bir durumda kelime ortasından bölünmemesi için
   güvenlik önlemi (menü metinleri her koşulda tek satırda kalır). */
.header-nav .navigation .navbar .navbar-nav .nav-item a {
    white-space: nowrap;
}

/* Header üst şerit: mail/telefon bilgisi taşmasın */
.header-top .header-left-side ul li a {
    white-space: nowrap;
}

/* ==========================================================================
   "Ücretsiz Teklif Al" CTA butonu — 576px altında (çoğu telefon) doit.css
   bu butonu tamamen "display:none" ile gizliyordu, üstelik 576-767px
   aralığında geri açılsa da "position:absolute; right:70px" ile logonun
   ve üst şeritteki metinlerin üzerine biniyordu (orijinal temada da
   mevcut bir hata). Her iki durumda da buton kullanılamaz hale geliyordu.
   Bunun yerine flexbox'ın doğal "wrap" davranışından yararlanılıp buton
   kendi satırına düşürülür ve ortalanır — logoya hiç dokunmadan, hiçbir
   elemanla çakışmadan güvenli bir çözüm.
   ========================================================================== */
@media (max-width: 767px) {
    .header-nav .navigation .navbar .navbar-btn {
        display: flex !important;
        position: static !important;
        width: 100%;
        justify-content: center;
        margin: 12px 0 0 !important;
        top: auto !important;
        right: auto !important;
        order: 3;
    }

    .header-nav .navigation .navbar .navbar-btn .main-btn {
        line-height: 1;
        padding: 13px 30px;
        font-size: 13px;
        border-radius: 6px;
    }
}

/* ==========================================================================
   Ana sayfa "Kampanyalar" slider (case-studies-active) — kart sayısı azken
   (örn. tek kampanya) slick'in JS ile hesapladığı genişlik, Bootstrap'ın
   .col-lg-3 sınıfındaki max-width: 25% kuralı tarafından eziliyor ve kart
   küçük/kırpık görünüyordu. Slick aktifken grid genişlik sınırı devre dışı
   bırakılır; gerçek genişlik artık tamamen JS tarafından (custom.js) kart
   sayısına göre doğru hesaplanır.
   ========================================================================== */
.case-studies-area .case-studies-active.slick-slider .slick-slide {
    max-width: none;
}

/* Kart sayısı, tasarımın öngördüğü sütun sayısına (masaüstünde 4) yetmiyorsa
   (örn. tek kampanya) kalan kartlar tasarımdaki oranında kalır, sadece
   sola yapışık kalmasın diye ortalanır. */
.case-studies-area .case-studies-active.slick-few-slides .slick-list {
    display: flex;
    justify-content: center;
}

/* ==========================================================================
   Şubeler sayfası — kart tasarımı
   Marka renkleri korunarak (kırmızı #E3000F, lacivert #002249) yenilendi.
   ========================================================================== */
.branches-area {
    background: #f4fbff;
}

/* Tema genelinde .section-title .title bileşenine otomatik eklenen dekoratif
   "services" filigranı bu sayfanın konusuyla ilgisiz ve kısa başlıkta çok
   belirgin görünüyor (doit.css satır ~177). Sadece bu bölüm için kapatıldı. */
.branches-area .section-title .title::before {
    content: none;
    display: none;
}

.branches-area .section-title p {
    color: #6b7b90;
    font-size: 15px;
    margin-top: 10px;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

.branch-card {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 18px;
    padding: 34px 30px 28px;
    overflow: hidden;
    box-shadow: 0 6px 22px rgba(0, 34, 73, 0.07);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.branch-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #E3000F 0%, rgba(227, 0, 15, 0.35) 100%);
}

.branch-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 44px rgba(0, 34, 73, 0.16);
}

.branch-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.branch-card__icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: rgba(227, 0, 15, 0.08);
    color: #E3000F;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    flex-shrink: 0;
}

.branch-card__badge {
    background: #002249;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding: 5px 13px;
    border-radius: 20px;
    text-transform: uppercase;
    white-space: nowrap;
}

.branch-card__title {
    color: #002249;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 20px;
}

.branch-card__info {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    flex: 1 1 auto;
}

.branch-card__info li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
}

.branch-card__info li:last-child {
    margin-bottom: 0;
}

.branch-card__ico {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #f2f4f8;
    color: #E3000F;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    margin-top: 1px;
}

.branch-card__info li.is-whatsapp .branch-card__ico {
    color: #25D366;
    background: rgba(37, 211, 102, 0.1);
}

.branch-card__info li a,
.branch-card__info li span.branch-card__text {
    color: #536171;
    font-size: 14.5px;
    line-height: 1.6;
    word-break: break-word;
    transition: color 0.2s ease;
}

.branch-card__info li a:hover {
    color: #E3000F;
}

.branch-card__info li.is-whatsapp a {
    color: #1c9c4d;
    font-weight: 600;
}

.branch-card__info li.is-whatsapp a:hover {
    color: #25D366;
}

.branch-card__footer {
    margin-top: auto;
    padding-top: 18px;
    border-top: 1px solid #f0f2f5;
}

.branch-card__map-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #E3000F;
    font-weight: 700;
    font-size: 13.5px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    transition: gap 0.25s ease, color 0.2s ease;
}

.branch-card__map-btn i {
    transition: transform 0.25s ease;
    font-size: 12px;
}

.branch-card__map-btn:hover {
    color: #002249;
    gap: 12px;
}

.branch-card__map-btn:hover i {
    transform: translateX(3px);
}

@media (max-width: 575px) {
    .branch-card {
        padding: 28px 24px 24px;
    }
}

/* ==========================================================================
   İş Ortaklarımız (partner logoları) — footer üstü brand slider
   Eski tasarımda logo yükseklikleri farklı olduğu için resimler üste
   yapışık/hizasız görünüyordu (inline-block + text-align:center yeterli
   değildi). Flex ile tam ortalanan, sabit yükseklikli, modern kart tasarımı.
   ========================================================================== */
.brand-2-area {
    background: #f7fafc;
}

.brand-2-area__eyebrow {
    display: inline-block;
    color: #E3000F;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.brand-2-area .title {
    font-size: 34px;
    font-weight: 700;
    color: #002249;
    margin-bottom: 45px;
}

.brand-2-area .brand-active {
    margin: 0 -10px;
}

.brand-2-area .brand-active .brand-item {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 130px;
    padding: 10px;
}

.brand-2-area .brand-active .brand-item a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 4px 20px rgba(0, 34, 73, 0.06);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.brand-2-area .brand-active .brand-item a:hover {
    box-shadow: 0 12px 30px rgba(0, 34, 73, 0.12);
    transform: translateY(-4px);
}

.brand-2-area .brand-active .brand-item img {
    max-height: 46px;
    max-width: 78%;
    width: auto;
    height: auto;
    object-fit: contain;
    opacity: 0.75;
    filter: grayscale(35%);
    transition: opacity 0.3s ease, filter 0.3s ease;
}

.brand-2-area .brand-active .brand-item a:hover img {
    opacity: 1;
    filter: grayscale(0%);
}

.brand-2-area .brand-active.slick-few-slides .slick-list {
    display: flex;
    justify-content: center;
}

@media (max-width: 991px) {
    .brand-2-area .title {
        font-size: 28px;
    }

    .brand-2-area .brand-active .brand-item {
        height: 110px;
    }

    .brand-2-area .brand-active .brand-item img {
        max-height: 38px;
    }
}

@media (max-width: 575px) {
    .brand-2-area .title {
        font-size: 24px;
    }

    .brand-2-area .brand-active .brand-item {
        height: 90px;
        padding: 6px;
    }

    .brand-2-area .brand-active .brand-item img {
        max-height: 32px;
        max-width: 82%;
    }
}

/* ==========================================================================
   İş Başvurusu formu (/is-basvurusu) — beyaz kart üzerinde
   .get-in-touch-area .form-area .input-box input'un varsayılan kenarlığı
   beyaz (`border:1px solid #fff`) olduğundan, formu beyaz bir kart
   (`.bg-white`) içine aldığımızda kutular tamamen görünmez oluyordu.
   Aşağıdaki kurallar SADECE bu kombinasyonu (beyaz kart) hedefler; diğer
   sayfalardaki (teklif al, iletişim) orijinal koyu/renkli arka plan
   üzerindeki form tasarımına dokunmaz.
   ========================================================================== */
.get-in-touch-area .form-area.bg-white .input-box input,
.get-in-touch-area .form-area.bg-white .input-box textarea {
    border: 1px solid #e3eeff;
    background: #f7fcff;
    border-radius: 8px;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.get-in-touch-area .form-area.bg-white .input-box input:focus,
.get-in-touch-area .form-area.bg-white .input-box textarea:focus {
    border-color: #E3000F;
    outline: none;
    box-shadow: 0 0 0 3px rgba(227, 0, 15, 0.08);
}

.get-in-touch-area .form-area.bg-white .input-box i {
    color: #9db7c6;
    transition: color 0.25s ease;
}

.get-in-touch-area .form-area.bg-white .input-box input:focus + i,
.get-in-touch-area .form-area.bg-white .input-box input:focus ~ i {
    color: #E3000F;
}

.job-application-form .cv-upload-box {
    position: relative;
}

.job-application-form .cv-upload-box input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.job-application-form .cv-upload-box__label {
    display: flex;
    align-items: center;
    gap: 18px;
    width: 100%;
    border: 2px dashed #cfe2ee;
    background: #f7fcff;
    border-radius: 10px;
    padding: 20px 24px;
    cursor: pointer;
    transition: border-color 0.25s ease, background-color 0.25s ease;
}

.job-application-form .cv-upload-box:hover .cv-upload-box__label {
    border-color: #E3000F;
    background: #fff5f5;
}

.job-application-form .cv-upload-box__icon {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffe6e8;
    color: #E3000F;
    border-radius: 50%;
    font-size: 20px;
}

.job-application-form .cv-upload-box__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
}

.job-application-form .cv-upload-box__text strong {
    color: #002249;
    font-size: 15px;
}

.job-application-form .cv-upload-box__text small {
    color: #6b93aa;
    font-size: 13px;
}

.job-application-form .cv-upload-box__filename {
    flex: 0 0 auto;
    max-width: 40%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
    color: #E3000F;
}

.job-application-form .cv-upload-box__filename:empty::before {
    content: attr(data-placeholder);
    color: #9db7c6;
    font-weight: 400;
}

@media (max-width: 575px) {
    .job-application-form .cv-upload-box__label {
        flex-wrap: wrap;
        gap: 12px;
        padding: 18px;
    }

    .job-application-form .cv-upload-box__filename {
        max-width: 100%;
        margin-left: 66px;
    }
}