/* Yalnızca lg altı (<=991.98px) */
@media (max-width: 991.98px) {
    header {
        background: white !important;
    }
    /* Sadece bu nav için kapsam */
    #mbzNav {
        position: relative;
        /*position: absolute;*/
        z-index: 1000;
        width:100%;
        top:-30px!important;
    }

        /* Toggler her zaman üstte ve sade */
        #mbzNav .navbar-toggler {
            font-size:50px;
            position: relative;
            z-index: 1061;
            border: none;
            outline: none;
            box-shadow: none !important;
            float:right;
            right:20px;
        }

        /* Tam ekran panel (üstte) */
        #mbzNav .navbar-collapse {
            position: fixed;
            inset: 0; /* top:0; right:0; bottom:0; left:0 */
            width: 100vw;
            height: 100vh;
            background: #ffffff;
            transform: translateY(-100%); /* başlangıçta gizli */
            padding: 18px 22px 80px;
            overflow-y: auto;
            box-shadow: 0 10px 25px rgba(15,23,42,.12);
            z-index: 1060;
            transition: transform .34s cubic-bezier(.22,1,.36,1);
            will-change: transform;
            /*margin-top:100px;*/
        }

            #mbzNav .navbar-collapse.show {
                transform: translateY(0);
            }

        /* Arka plan karartma (panelin altında) */
        #mbzNav .mbz-overlay {
            position: fixed;
            inset: 0;
            background: rgba(15,23,42,.45);
            opacity: 0;
            pointer-events: none;
            transition: opacity .24s ease;
            -webkit-backdrop-filter: blur(2px);
            backdrop-filter: blur(2px);
            z-index: 1040;
        }

            #mbzNav .mbz-overlay.is-visible {
                opacity: 1;
                pointer-events: auto;
            }

        /* Marka görseli */
        #mbzNav .navbar-brand img {
            max-height: 50px;
            transition: .5s;
            margin-top: 40px;
            /*width:100px;*/
        }

        /* Link renkleri (tema beyaza zorluyorsa kesin bastır) */
        #mbzNav.navbar.navbar-light .navbar-nav .nav-link,
        #mbzNav .navbar-nav .nav-link,
        #mbzNav .dropdown-item {
            color: #0f172a !important;
        }

            #mbzNav .navbar-nav .nav-link:hover,
            #mbzNav .navbar-nav .nav-link:focus {
                color: #111827 !important;
            }

            #mbzNav .navbar-nav .nav-link.active {
                color: #0f172a !important;
                font-weight: 700;
            }

        #mbzNav .navbar-toggler .fas {
            color: #0f172a !important;
        }

        /* Menü link blokları */
        #mbzNav .navbar-nav .nav-link {
            display: block;
            padding: .85rem 0;
            border-bottom: 1px solid #f1f5f9;
        }

        /* Dropdownlar: mobilde iç içe liste + yumuşak aç/kapa */
        #mbzNav .dropdown {
            position: static;
        }

        #mbzNav .nav-link.dropdown-toggle::after {
            transition: transform .2s ease;
            margin-left: .35rem;
        }

        /* NOT: display:none KULLANMIYORUZ -> animasyon çalışsın */
        #mbzNav .dropdown-menu {
            position: static !important;
            float: none;
            border: 0;
            border-left: 2px solid #e2e8f0;
            border-radius: 0;
            margin: .25rem 0 .75rem .5rem;
            padding: .25rem .25rem .5rem .75rem;
            background: transparent;
            max-height: 0;
            opacity: 0;
            visibility: hidden;
            overflow: hidden;
            transition: max-height .28s ease, opacity .22s ease, visibility 0s linear .28s;
        }

        #mbzNav .dropdown.show > .dropdown-menu {
            max-height: 800px; /* içerik uzunluğunu karşılayacak kadar büyük */
            opacity: 1;
            visibility: visible;
            transition: max-height .28s ease, opacity .22s ease;
        }

        #mbzNav .dropdown.show > .nav-link.dropdown-toggle::after {
            transform: rotate(180deg);
        }

        #mbzNav .dropdown-item {
            padding: .5rem 0;
            border-bottom: 1px dashed #eef2ff;
        }

            #mbzNav .dropdown-item:last-child {
                border-bottom: 0;
            }

        /* --- Dropdown toggle oklarını sağa sabitle --- */
        #mbzNav .nav-link.dropdown-toggle {
            position: relative;
            padding-right: 1.5rem; /* ok için boşluk aç */
        }

            #mbzNav .nav-link.dropdown-toggle::after {
                position: absolute;
                right: 0; /* her zaman sağ kenara */
                top: 50%; /* dikey ortala */
                transform: translateY(-50%); /* tam ortada */
                margin-left: 0; /* default margin’i kaldır */
                pointer-events: none; /* tıklamayı engelle */
            }

        /* --- Mobilde kapatma ikonu (sol ok) sabitle --- */
        #mbzNav .navbar-toggler {
            position: fixed !important; /* ekrana sabitle */
            position: relative !important; /* ekrana sabitle */
            top: 18px; /* üstten boşluk */
            top: 18px; /* üstten boşluk */
            right: 38px; /* sağdan boşluk */
            z-index: 1100; /* panelin üstünde olsun */
            background: transparent; /* arka plan olmasın */
            border: none;
            outline: none;
            box-shadow: none !important;
        }

            #mbzNav .navbar-toggler .fas {
                font-size: 2.6rem; /* okun boyutu */
                color: #0f172a; /* marka rengin neyse onu kullan */
            }


        /* Arama butonu menü içinde altta */
        #mbzNav .btn.btn-primary.btn-md-square {
            margin-top: 1rem;
        }

        /* Stagger: panel görünür olduktan sonra nav öğelerini sırayla animasyonla */
        #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > * {
            animation: mbzFadeUp .28s ease forwards;
        }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(1) {
                animation-delay: .02s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(2) {
                animation-delay: .04s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(3) {
                animation-delay: .06s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(4) {
                animation-delay: .08s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(5) {
                animation-delay: .10s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(6) {
                animation-delay: .12s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(7) {
                animation-delay: .14s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(8) {
                animation-delay: .16s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(9) {
                animation-delay: .18s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(10) {
                animation-delay: .20s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(11) {
                animation-delay: .22s;
            }

            #mbzNav .navbar-collapse.mbz-animate-in .navbar-nav > *:nth-child(12) {
                animation-delay: .24s;
            }

    @keyframes mbzFadeUp {
        from {
            opacity: 0;
            transform: translateY(80px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}


/* === ALT MENÜ (dropdown) ÖĞELERİ İÇİN STAGGER ANİMASYONU === */
@media (max-width: 991.98px) {
    /* Dropdown container zaten yumuşak açılıyor (max-height/opacity). 
     Şimdi içindeki her öğeyi sırayla "fade-up" ile akıtalım. */

    /* Yalnız .show olduğunda öğelere animasyon uygula; default görünürlüğü bozmaz */
    #mbzNav .dropdown.show > .dropdown-menu > * {
        opacity: 0; /* animasyon başlamadan önce şeffaf */
        transform: translateY(6px); /* hafif aşağıdan gelsin */
        animation: mbzDdFadeUp .22s ease forwards;
    }

        /* 8-10 madde için gecikme uygulayalım (artırmak istersen sayı ekleyebilirsin) */
        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(1) {
            animation-delay: .02s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(2) {
            animation-delay: .04s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(3) {
            animation-delay: .06s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(4) {
            animation-delay: .08s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(5) {
            animation-delay: .10s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(6) {
            animation-delay: .12s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(7) {
            animation-delay: .14s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(8) {
            animation-delay: .16s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(9) {
            animation-delay: .18s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(10) {
            animation-delay: .20s;
        }

    /* Alt menü için küçük ve hızlı bir fade-up */
    @keyframes mbzDdFadeUp {
        from {
            opacity: 0;
            transform: translateY(6px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

/* Hareket azaltma tercihinde dropdown animasyonlarını da kapat */
@media (prefers-reduced-motion: reduce) {
    #mbzNav .dropdown.show > .dropdown-menu > * {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}



/* Menü açıkken body scroll kilidi (JS sınıfı) */
body.mbz-lock {
    overflow: hidden;
}


/* 1) Header-top'u mobilde gizle (global style.css dokunulmadan) */
@media (max-width: 991.98px) {
    .header-top {
        display: none !important;
    }
}

/* 2) Mobil menü içi top bar (sadece mobilde göster) */
@media (max-width: 991.98px) {
    #mbzNav .mbz-mobile-top {
        margin-top: 1rem;
        padding-top: 1rem;
        border-top: 1px solid #e5e7eb; /* açık gri ayraç */
    }

        /* Telefon & Mail satırları */
        #mbzNav .mbz-mobile-top .mbz-row {
            display: flex;
            align-items: center;
            gap: .6rem;
            padding: .6rem 0;
            text-decoration: none;
            color: #0f172a !important; /* koyu lacivert metin */
            border-bottom: 1px dashed #eef2ff;
        }

            #mbzNav .mbz-mobile-top .mbz-row:last-of-type {
                border-bottom: 0;
                margin-bottom: .25rem;
            }

            #mbzNav .mbz-mobile-top .mbz-row i {
                width: 28px;
                height: 28px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                border-radius: 9999px;
                background: #f4f4f5; /* nötr arkaplan */
                color: #0f172a;
                font-size: .9rem;
            }

            #mbzNav .mbz-mobile-top .mbz-row span {
                font-size: .98rem;
                line-height: 1.3;
            }

        /* Sosyal ikonlar bloğu */
        #mbzNav .mbz-mobile-top .mbz-social {
            display: flex;
            gap: .5rem;
            padding-top: .6rem;
        }

            #mbzNav .mbz-mobile-top .mbz-social .mbz-soc {
                width: 36px;
                height: 36px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                border-radius: 9999px;
                background: #f4f4f5;
                color: #0f172a;
                text-decoration: none;
                transition: transform .18s ease, background-color .18s ease;
            }

                #mbzNav .mbz-mobile-top .mbz-social .mbz-soc:hover {
                    transform: translateY(-1px);
                    background: #eaeaec;
                }

        /* X (Twitter) ikonunu uyumlu göster (varsa) */
        #mbzNav .mbz-mobile-top .fa.fa-twitter {
            font-family: sans-serif;
        }

            #mbzNav .mbz-mobile-top .fa.fa-twitter::before {
                content: "𝕏";
                font-size: 1.05em;
                line-height: 1;
            }
}

/* 3) Desktop'ta görünmesin */
@media (min-width: 992px) {
    #mbzNav .mbz-mobile-top {
        display: none !important;
    }
}

/* === Renk teması: #BA005A (mobil) === */
@media (max-width: 991.98px) {
    /* Tüm nav linkleri ve dropdown öğeleri tema renginde */
    #mbzNav .navbar-nav .nav-link,
    #mbzNav .navbar-nav .nav-link.active,
    #mbzNav .dropdown-item {
        color: #BA005A !important;
    }

        /* Hover/Focus */
        #mbzNav .navbar-nav .nav-link:hover,
        #mbzNav .navbar-nav .nav-link:focus,
        #mbzNav .dropdown-item:hover,
        #mbzNav .dropdown-item:focus {
            color: #BA005A !important;
            background: rgba(186,0,90,0.06); /* çok hafif vurgulu zemin */
        }

    /* Dropdown okları (caret) sağda sabit ve tema renginde */
    #mbzNav .nav-link.dropdown-toggle {
        position: relative;
        padding-right: 1.5rem;
        color: #BA005A !important;
    }

        #mbzNav .nav-link.dropdown-toggle::after {
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            margin-left: 0;
            pointer-events: none;
            /* caret, currentColor'ı kullanır → link rengini #BA005A'ya çekmek yeterli */
        }

    /* Toggler ikon rengi */
    #mbzNav .navbar-toggler .fas {
        color: #BA005A !important;
    }

    /* Sosyal butonlar ve küçük ikon yuvarlakları için hafif pembe arka plan */
    #mbzNav .mbz-mobile-top .mbz-row i,
    #mbzNav .mbz-mobile-top .mbz-social .mbz-soc {
        background: #FFE3F0; /* #BA005A'nın açık tonu */
        color: #BA005A !important;
    }

        #mbzNav .mbz-mobile-top .mbz-social .mbz-soc:hover {
            background: #FFD3E8;
            transform: translateY(-1px);
        }
}

/* === Menü altına kısa, ortalı ayraç çizgisi (mobil) === */
@media (max-width: 991.98px) {
    #mbzNav .navbar-nav::after {
        content: "";
        display: block;
        width: 88px; /* kısa çizgi */
        height: 2px;
        margin: 10px auto 6px; /* ortala */
        background: #BA005A;
        border-radius: 2px;
        opacity: .95;
    }
}

/* === Alt blok (telefon / mail / sosyal) animasyonu (mobil) === */
@media (max-width: 991.98px) {
    /* blok göründüğünde iç öğeler sırayla yukarıdan gelsin */
    #mbzNav .mbz-mobile-top > * {
        opacity: 0;
        transform: translateY(8px);
        animation: mbzTopFadeUp .26s ease forwards;
    }
        /* sıralı gecikmeler */
        #mbzNav .mbz-mobile-top > *:nth-child(1) {
            animation-delay: .06s;
        }

        #mbzNav .mbz-mobile-top > *:nth-child(2) {
            animation-delay: .12s;
        }

        #mbzNav .mbz-mobile-top > *:nth-child(3) {
            animation-delay: .18s;
        }

    @keyframes mbzTopFadeUp {
        from {
            opacity: 0;
            transform: translateY(8px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

/* === Dropdown içi öğelere de minik fade-up (mobil) — isteğe bağlı === */
@media (max-width: 991.98px) {
    #mbzNav .dropdown.show > .dropdown-menu > * {
        opacity: 0;
        transform: translateY(6px);
        animation: mbzDdFadeUp .22s ease forwards;
    }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(1) {
            animation-delay: .02s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(2) {
            animation-delay: .04s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(3) {
            animation-delay: .06s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(4) {
            animation-delay: .08s;
        }

        #mbzNav .dropdown.show > .dropdown-menu > *:nth-child(5) {
            animation-delay: .10s;
        }

    @keyframes mbzDdFadeUp {
        from {
            opacity: 0;
            transform: translateY(6px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

/* Hareket azaltma tercihinde animasyonları kapat */
@media (prefers-reduced-motion: reduce) {
    #mbzNav .mbz-mobile-top > *,
    #mbzNav .dropdown.show > .dropdown-menu > * {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}


/* === Mobil: menü açılınca (mbz-animate-in) top blok elemanlarını sırayla göster === */
@media (max-width: 991.98px) {

    .sec-header{
        background:white!important;
    }
    /* Başlangıç hali: görünmez (menü kapalıyken zaten panel gizli) */
    #mbzNav .mbz-mobile-top > * {
        opacity: 0;
        transform: translateY(8px);
    }

    /* Panel açılıp .mbz-animate-in geldiğinde animasyonları başlat */
    #mbzNav .navbar-collapse.mbz-animate-in .mbz-mobile-top > * {
        animation: mbzTopFadeUp .26s ease forwards;
    }
        /* Sıralı gecikmeler */
        #mbzNav .navbar-collapse.mbz-animate-in .mbz-mobile-top > *:nth-child(1) {
            animation-delay: .06s;
        }

        #mbzNav .navbar-collapse.mbz-animate-in .mbz-mobile-top > *:nth-child(2) {
            animation-delay: .12s;
        }

        #mbzNav .navbar-collapse.mbz-animate-in .mbz-mobile-top > *:nth-child(3) {
            animation-delay: .18s;
        }

    @keyframes mbzTopFadeUp {
        from {
            opacity: 0;
            transform: translateY(8px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

/* Hareket azaltma tercihinde kapat */
@media (prefers-reduced-motion: reduce) {
    #mbzNav .mbz-mobile-top > * {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}