@media (max-width: 1199.98px) 
{
    .page-product-detail .content .column-right .hacim-wrapper {
        gap: 20px;
        flex-direction: column;
    }
    .page-product-detail .content .column-right {
        padding: 50px 20px 50px 50px;
    }
    .page-corporate section.banner .text-container .text {
        width: 90%;
    }
    .page-contact .content .contact-info {
        flex-direction: column;
    }
    .page-contact .contact-info .text-wrapper {
        width: 100%;
    }

    .page-contact .contact-info .map {
        width: 100%;
        aspect-ratio: 3/1;
    }
    section.sub-header {
        height: 50px;
    }
    .page-home section.banner .hero-slider .container {
        width: 75%;
    }
}



@media (max-width: 991.98px)
{
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    form {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    #page-header,
    #page-header.desktop,
    .page-header,
    .main-nav {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .page-home .hero-style {
        aspect-ratio: 1;
    }

    .page-home section.banner .hero-slider .container {
        width: 80%;
        left: 10%;
        bottom: 10%;
        text-align:center;
    }

    .curve-container {
        overflow: hidden !important;
    }


    .page-home .hero-style .slide-title h2 {
        font-size: 5vw;
        /* font-weight: 900; */
        /* line-height: 1.5; */
        color: #222;
        /* margin: 0 0 50px; */
        text-transform: capitalize;
        transition: all .4s ease;
        text-shadow: 0px 1px 11px #ffffff00;
    }

    .page-home .hero-style .slide-text p {
        font-size: 3vw;
        font-weight: 300;
        line-height: 1.25;
        letter-spacing: normal;
        color: #333;
        margin: 20px 0 40px;
        transition: all .4s ease;
    }



    footer,
    footer .container,
    footer .row,
    .social-row {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    .social-row {
        flex-wrap: wrap;
    }

    img,
    svg,
    video,
    iframe {
        max-width: 100%;
    }

    footer ul.footer-menu {
        flex-direction: column;
        align-content: center;
        flex-wrap: wrap;
        gap: 70px;
        padding: 50px 0;
    }
        footer ul.footer-menu li:first-child {
            padding-left: inherit !important;
        }

        footer ul.footer-menu li {
            padding: 0 !important;
            border-right: none !important;
            min-width: 100% !important;
            text-align: center;
        }



    footer .bottom-row .wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 30px;
        width: 100%;
        max-width: 100%;
        text-align: center;
    }

    footer .bottom-row .copyright {
        width: 100%;
        text-align: center;
    }

    footer .bottom-row .lizbon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        max-width: 100%;
    }

        footer .bottom-row .lizbon img {
            display: block;
            /* max-width: 80px; */
            height: 15px;
        }

    .page-products .product-list.cols-4 {
        grid-template-columns: repeat(3, 1fr);
    }

    section.sub-header .bread-wrapper {
        display: none;
    }
    .page-product-detail .content .column-left .gallery-container {
        height: 50vh;
    }

    .page-blog-list section.content .list .item {
        width: calc((100% - 30px) / 2);
    }

    .page-video-list section.content .list .item {
        width: calc((100% - 30px) / 2);
    }

    .page-catalogs section.content .list .item {
        width: calc((100% - 80px) / 3);
    }

    section.sub-header {
        display:none;
    }


    /*BANNER DEĞİŞİKLİĞİ*/
    .page-home section.banner {
        overflow: visible !important;
    }

        .page-home section.banner .hero-slider,
        .page-home section.banner .hero-style {
            display: block !important;
            position: relative !important;
            width: 100% !important;
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
            aspect-ratio: auto !important;
            padding: 0 !important;
            overflow: visible !important;
            z-index: 1 !important;
        }

            .page-home section.banner .hero-slider .swiper-container {
                position: relative !important;
                left: auto !important;
                top: auto !important;
                width: 100% !important;
                height: auto !important;
                min-height: 0 !important;
                max-height: none !important;
                overflow: hidden !important;
            }

            .page-home section.banner .hero-slider .swiper-wrapper {
                height: auto !important;
                min-height: 0 !important;
                max-height: none !important;
                align-items: flex-start !important;
            }

            .page-home section.banner .hero-slider .swiper-slide {
                height: auto !important;
                min-height: 0 !important;
                max-height: none !important;
                overflow: visible !important;
            }

            .page-home section.banner .hero-slider .slide-inner {
                position: relative !important;
                left: auto !important;
                top: auto !important;
                width: 100% !important;
                height: auto !important;
                min-height: 0 !important;
                max-height: none !important;
                display: flex !important;
                flex-direction: column !important;
                align-items: stretch !important;
                justify-content: flex-start !important;
                overflow: visible !important;
                text-align: left !important;
            }

            .page-home section.banner .hero-slider .banner-media-wrap {
                order: 1;
                position: relative !important;
                width: 100% !important;
                aspect-ratio: 1 / 1;
                height: auto !important;
                min-height: 0 !important;
                overflow: hidden !important;
                flex: 0 0 auto !important;
            }

                .page-home section.banner .hero-slider .banner-media-wrap > .banner-media {
                    position: absolute !important;
                    inset: 0 !important;
                    width: 100% !important;
                    height: 100% !important;
                    overflow: hidden !important;
                }

            .page-home section.banner .hero-slider .banner-media-desktop {
                display: none !important;
            }

            .page-home section.banner .hero-slider .banner-media-mobile {
                display: block !important;
            }

            .page-home section.banner .hero-slider .banner-media-wrap img,
            .page-home section.banner .hero-slider .banner-media-wrap video {
                position: absolute !important;
                inset: 0 !important;
                width: 100% !important;
                height: 100% !important;
                max-width: none !important;
                object-fit: cover !important;
                object-position: center center !important;
                display: block !important;
            }

            .page-home section.banner .hero-slider .container.banner-content {
                order: 2;
                position: relative !important;
                left: auto !important;
                right: auto !important;
                top: auto !important;
                bottom: auto !important;
                transform: none !important;
                /* display: block !important; */
                width: 100% !important;
                max-width: 100% !important;
                height: auto !important;
                min-height: 0 !important;
                max-height: none !important;
                padding: 22px 20px 30px !important;
                margin: 0 !important;
                overflow: visible !important;
                z-index: 5 !important;
                background: #fbfbfb !important;
            }

            .page-home section.banner .hero-slider .slide-title,
            .page-home section.banner .hero-slider .slide-text,
            .page-home section.banner .hero-slider .slide-btns {
                position: relative !important;
                display: block !important;
                width: 100% !important;
                height: auto !important;
                max-height: none !important;
                overflow: visible !important;
                opacity: 1 !important;
                visibility: visible !important;
                transform: none !important;
            }

                .page-home section.banner .hero-slider .slide-title h2 {
                    height: auto !important;
                    max-height: none !important;
                    overflow: visible !important;
                    white-space: normal !important;
                    font-size: 26px !important;
                    line-height: 1.25 !important;
                    margin: 0 0 12px 0 !important;
                    padding: 0 !important;
                    color: #222 !important;
                }

                .page-home section.banner .hero-slider .slide-text p {
                    height: auto !important;
                    max-height: none !important;
                    overflow: visible !important;
                    white-space: normal !important;
                    font-size: 16px !important;
                    line-height: 1.5 !important;
                    margin: 0 0 18px 0 !important;
                    padding: 0 !important;
                    color: #222 !important;
                }

            .page-home section.banner .hero-slider .swiper-button-next,
            .page-home section.banner .hero-slider .swiper-button-prev {
                display: none !important;
            }

            .page-home section.banner .hero-slider .swiper-container {
                overflow: hidden !important;
            }

            .page-home section.banner .hero-slider .swiper-wrapper {
                overflow: visible !important;
            }

            .page-home section.banner .hero-slider .swiper-slide {
                overflow: hidden !important;
            }

            .page-home section.banner .hero-slider .slide-inner {
                transform: none !important;
                transition-property: transform !important;
            }

            .page-home section.banner .hero-slider .swiper-slide .slide-inner[style] {
                transform: none !important;
            }

            .page-home section.banner .hero-slider .banner-media-wrap {
                overflow: hidden !important;
            }

    .page-home .hero-style .btn-banner {
        /* margin-top:20px !important; */
        background-color: #ed1b24 !important;
        color: #ffffff !important;
        display: inline-block;
        font-size: 18px !important;
        padding: 10px 20px !important;
    }





}

@media (max-width: 767.98px)
{
    .page-home .hero-style .slide-title h2 {
        font-size: 6vw;
        /* font-weight: 900; */
        /* line-height: 1.5; */
        color: #222;
        /* margin: 0 0 50px; */
        text-transform: capitalize;
        transition: all .4s ease;
        text-shadow: 0px 1px 11px #ffffff00;
        font-family: 'Oswald', sans-serif;
    }

    .page-home .hero-style .slide-text p {
        font-size: 4vw;
        /* font-weight: 300; */
        /* line-height: 1.25; */
        letter-spacing: normal;
        color: #333;
        margin: 20px 0 40px;
        transition: all .4s ease;
    }
    .page-home section.urunler .wrapper {
        flex-direction: column;
    }
        .page-home section.urunler .wrapper .item {
            width: 100%;
        }

    .page-products .product-list.cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
    .page-products .product-list.cols-3 {
        grid-template-columns: repeat(2, 1fr);
    }

    .page-blog-list section.content .list .item .text {
        font-size: 16px;
    }
    .page-video-list section.content .list .item .text {
        font-size: 16px;
    }

    .page-corporate section.banner .text-container {
        left: 0;
    }
        .page-corporate section.banner .text-container .text {
            width: 100%;
        }

        .page-corporate section.banner .text-container .text {
            padding: 20px;
        }

      .page-contact .contact-info .map {
        width: 100%;
        aspect-ratio: 2/1;
    }
    .page-catalogs section.content .list .item {
        width: calc((100% - 40px) / 2);
    }

}

@media (max-width: 575.98px) 
{
    .page-home section.banner .hero-slider .container {
        width: 80%;
        left: 10%;
        bottom: 5%;
        text-align: center;
    }

    .page-home section.latest-articles .article-slider .glide__arrows {
        display: none;
    }
    .page-home section.latest-articles .htitle {
        font-size: 24px;
    }

    .page-home section.latest-articles {
        padding: 50px 5%;
    }

    .page-home section.urunler {
        padding: 40px 0;
    }
    .page-home section.videos {
        padding: 50px 5%;
    }
        .page-home section.videos .video-slider .glide__arrows {
            display: none;
        }
        .page-home section.videos .htitle {
            font-size: 24px;
            
        }

    .page-products .product-list.cols-4 {
        grid-template-columns: repeat(1, 1fr);
    }

    .page-products .product-list {
        gap: 10px;
    }

        .page-products .product-list.cols-3 {
            grid-template-columns: repeat(1, 1fr);
        }

    .page-product-detail .content .column-right {
        padding: 20px;
    }

    .page-blog-list section.content .list .item {
        width: 100%;
    }
    .page-video-list section.content .list .item {
        width:100%;
    }

    .page-corporate section.banner .text-container .text h3 {
        font-size: 26px;
    }

    .page-corporate section.banner .text-container .text span {
        font-size: 18px;
    }
    .page-corporate section.banner .text-container {
        align-items: flex-end;
    }

      .page-contact .contact-info .map {
        width: 100%;
        aspect-ratio: 1;
    }
    .page-contact .contact-form .wrapper .item {
        width: 100%;
    }
    .page-contact .contact-form .submit .but-send {
        
        width: 100%;
    }

}

/* ==========================================================================
   NİHAİ MOBİL MENÜ CSS (Tarayıcı Kilitlenmesi ve Sarsıntı Çözülmüş Versiyon)
   ========================================================================== */

@media (max-width: 1224px) {

    /* 1. GEÇİŞ ANINDAKİ TÜM KARARMALARI KÖKTEN ENGELLEYEN SÜPER RESET */
    header,
    header *,
    header .header-bg,
    header .main-nav,
    header .main-nav .menu,
    header .main-nav .menu *,
    header .nav-right,
    header .nav-right * {
        transition: none !important;
        -webkit-transition: none !important;
        animation: none !important;
    }

    body.menu-open {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
        height: 100% !important;
    }

    /* 2. TIKLAMA VE ETKİLEŞİM GÜVENCESİ */
    header,
    header .main-nav,
    header .main-nav .menu,
    header .nav-right,
    header .language-content {
        pointer-events: auto !important;
    }

    /* 3. HAMBURGER BUTON TASARIMI */
    .menu-toggle {
        display: flex !important;
        flex-direction: column;
        justify-content: space-between;
        width: 30px;
        height: 21px;
        background: transparent !important;
        border: none !important;
        cursor: pointer;
        z-index: 99999 !important;
        position: absolute !important;
        top: 25px;
        left: 20px;
    }

        .menu-toggle span {
            width: 100%;
            height: 3px;
            background-color: #222 !important;
            border-radius: 2px;
            transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, background-color 0.3s !important;
        }

        .menu-toggle.active span:nth-child(1) {
            transform: translateY(9px) rotate(45deg) !important;
            background-color: #fff !important;
        }

        .menu-toggle.active span:nth-child(2) {
            opacity: 0 !important;
        }

        .menu-toggle.active span:nth-child(3) {
            transform: translateY(-9px) rotate(-45deg) !important;
            background-color: #fff !important;
        }

    /* 4. TAM EKRAN MOBÄ°L PANEL YAPISI (.main-nav) */
    header .main-nav {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        background: rgba(17, 17, 17, 0.98) !important;
        backdrop-filter: blur(12px) !important;
        -webkit-backdrop-filter: blur(12px) !important;
        z-index: 99998 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        overflow-y: auto !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 90px 24px calc(20px + env(safe-area-inset-bottom)) 24px !important;
        transition: opacity 0.3s ease, visibility 0.3s !important;
        -webkit-overflow-scrolling: touch !important;
        box-sizing: border-box !important;
    }

        header .main-nav.active {
            opacity: 1 !important;
            visibility: visible !important;
        }

        header .main-nav .menu {
            display: flex !important;
            flex-direction: column !important;
            height: auto !important;
            min-height: 0 !important;
            max-width: none !important;
            gap: 10px !important;
            padding: 0 !important;
            margin: 0 0 20px 0 !important;
            flex-shrink: 0 !important;
        }

            header .main-nav .menu .menu-item {
                display: block !important;
                position: relative !important;
                width: 100% !important;
                height: auto !important;
                min-height: 0 !important;
                max-height: none !important;
                margin-right: 0 !important;
                float: none !important;
            }

                /* Mobil Tetikleyici Ana Menü Başlıkları */
                header .main-nav .menu .menu-item > .mobile-trigger {
                    display: flex !important;
                    justify-content: space-between !important;
                    align-items: center !important;
                    color: #fff !important;
                    font-size: 1.25rem !important;
                    font-weight: 600 !important;
                    padding: 14px 0 !important;
                    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
                    width: 100% !important;
                    height: auto !important;
                    line-height: normal !important;
                    cursor: pointer !important;
                }

                header .main-nav .menu .menu-item.open-active > .mobile-trigger i {
                    transform: rotate(180deg) !important;
                    color: #ffb703 !important;
                }

    /* 5. ARAMA VE DÄ°L ALANININ (.nav-right) EN DÄ°BE YASLANMASI */
    header .nav-right {
        position: relative !important;
        bottom: auto !important;
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        width: 100% !important;
        height: auto !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: center;
        align-items: center !important;
        z-index: 99990 !important;
        margin-top: auto !important;
        flex-shrink: 0 !important;
        padding: 20px 0 10px 0 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s !important;
        gap: 100px;
    }

    body.menu-open header .nav-right {
        opacity: 1 !important;
        visibility: visible !important;
    }

    header .nav-right .search a img,
    header .nav-right .language > a img {
        filter: brightness(0) invert(1) !important;
    }

    header .nav-right .language > a {
        padding: 5px 0 !important;
        display: block !important;
    }

    /* 6. ALT MENÃœLERÄ° (DROPDOWN & MEGA MENU) SIRALI AKIÅžA ALMA */
    header .main-nav .menu .dropdown,
    header .main-nav .menu .menu-item .mega-menu {
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
        /* Orijinal JS'in tüm display kurallarını tarayıcı düzeyinde kilitleyen süper ezici */
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        max-height: 0 !important;
        overflow: hidden;
        transform: none !important;
        box-shadow: none !important;
        border: none !important;
        transition: max-height 0.3s ease-in-out !important;
    }

        /* ----------------------------------------------------------------------
       MÃœKEMMEL EVRELEME (ZIRHLI CSS KATMANI)
       ---------------------------------------------------------------------- */
        /* Menüde bizim tıkladığımız .open sınıfı VARKEN, yanına eski JS kodundan ne gelirse gelsin,
       ister .is-active eklensin, ister satır içi style display yazılmaya çalışılsın,
       aşağıdaki birleşik seçici grubu tüm dış müdahaleleri ezer ve yapıyı korur. */
        header .main-nav .menu .menu-item .dropdown.open,
        header .main-nav .menu .menu-item .mega-menu.open,
        header .main-nav .menu .menu-item .dropdown.open[style],
        header .main-nav .menu .menu-item .mega-menu.open[style],
        header .main-nav .menu .menu-item .dropdown.open.is-active,
        header .main-nav .menu .menu-item .mega-menu.open.is-active,
        header .main-nav .menu .menu-item .dropdown.open.active,
        header .main-nav .menu .menu-item .mega-menu.open.active,
        header .main-nav .menu .menu-item:hover .dropdown.open,
        header .main-nav .menu .menu-item:hover .mega-menu.open,
        header .main-nav .menu .menu-item .mega-menu.open:hover {
            display: block !important;
            position: relative !important;
            top: 0 !important;
            left: 0 !important;
            width: 100% !important;
            max-height: 4000px !important;
            opacity: 1 !important;
            visibility: visible !important;
            transform: none !important;
            box-shadow: none !important;
            background: transparent !important;
        }
        /* ---------------------------------------------------------------------- */

        header .main-nav .menu .menu-item .mega-menu .mega-container {
            display: flex !important;
            flex-direction: column !important;
            gap: 15px !important;
            padding: 10px 0 !important;
            width: 100% !important;
        }

            header .main-nav .menu .menu-item .mega-menu .mega-container .mega-column h3 {
                color: #ff4242 !important;
                font-size: 1.1rem !important;
                font-weight: 700 !important;
                border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
                padding-bottom: 6px !important;
                margin: 20px 0 8px 0 !important;
            }

            header .main-nav .menu .menu-item .mega-menu .mega-container .mega-column.left .columns-2,
            header .main-nav .menu .menu-item .mega-menu .mega-container .mega-column #productGroups {
                display: flex !important;
                flex-direction: column !important;
                width: 100% !important;
            }

            /* İç Link Tasarımları */
            header .main-nav .menu .dropdown a,
            header .main-nav .menu .menu-item .mega-menu .mega-container .mega-column a {
                color: #b3b3b3 !important;
                padding: 12px 15px !important;
                font-size: 1rem !important;
                border-left: 2px solid rgba(255, 255, 255, 0.15) !important;
                margin: 4px 0 !important;
                background: transparent !important;
                width: 100% !important;
                box-sizing: border-box !important;
                text-decoration: none !important;
            }

                header .main-nav .menu .dropdown a:hover,
                header .main-nav .menu .menu-item .mega-menu .mega-container .mega-column a:hover {
                    color: #fff !important;
                    border-left-color: #ff4242 !important;
                    background: rgba(255, 255, 255, 0.04) !important;
                }

        header .main-nav .menu .menu-item .mega-menu svg.mega-curve {
            display: none !important;
        }

    /* 7. TAM EKRAN DÄ°L PANELÄ° KATMANI */
    header .main-nav .language-content,
    header .language-content {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        background: #111111 !important;
        z-index: 99999 !important;
        padding: 90px 24px 40px 24px !important;
        box-sizing: border-box !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateX(100%) !important;
        transition: transform 0.3s ease-in-out, opacity 0.3s ease !important;
    }

        header .main-nav .language-content.open,
        header .language-content.open {
            display: block !important;
            opacity: 1 !important;
            visibility: visible !important;
            transform: translateX(0) !important;
        }

        header .language-content .lang-back-btn {
            color: #ffb703 !important;
            font-size: 1.25rem !important;
            font-weight: 600 !important;
            padding-bottom: 20px;
            margin-bottom: 20px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 10px;
        }

        header .language-content ul {
            list-style-type: none !important;
            padding: 0 !important;
            margin: 0 !important;
            display: flex !important;
            flex-direction: column !important;
            gap: 10px !important;
            box-shadow: none !important;
        }

            header .language-content ul li a {
                display: flex !important;
                align-items: center !important;
                color: #fff !important;
                font-size: 1.25rem !important;
                font-weight: 600 !important;
                padding: 14px 0 !important;
                border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
                border-left: none !important;
                margin: 0 !important;
                width: 100% !important;
                text-decoration: none !important;
                background: transparent !important;
            }

                header .language-content ul li a img {
                    width: 24px !important;
                    height: auto !important;
                    margin-right: 14px !important;
                    object-fit: contain;
                }

    /* 8. MASAÜSTÜ HOVER ETKİLERİNİ MOBİLDE DEVRE DIŞI BIRAKAN EZİCİLER */
    header .main-nav .menu li.has-dropdown:hover > .dropdown,
    header .main-nav .menu li.has-mega:hover > .mega-menu,
    header .main-nav .menu .menu-item:hover > .dropdown,
    header .main-nav .menu .menu-item:hover > .mega-menu,
    header .nav-right .language:hover .language-content {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }
}

@media (min-width: 1225px) {
    .menu-toggle {
        display: none !important;
    }

    header .language-content .lang-back-btn {
        display: none !important;
    }
}

/*000000000000000000*/

@media (max-width: 991px) {
    .page-products .mobile-left-menu-btn {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        height: 52px;
        padding: 0 18px;
        margin: 0 0 24px;
        border: none;
        /* border-radius: 14px; */
        background: #222;
        color: #fff;
        font-size: 16px;
        font-weight: 600;
        position: sticky;
        top: 80px;
        z-index: 90;
    }

        .page-products .mobile-left-menu-btn i {
            font-size: 18px;
        }

    .page-products .left-menu {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        max-height: 80vh;
        overflow-y: auto;
        background: #fff;
        z-index: 9999;
        padding: 22px 18px 30px;
        border-radius: 24px 24px 0 0;
        transform: translateY(110%);
        transition: transform 0.35s ease;
        box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.18);
    }

        .page-products .left-menu.active {
            transform: translateY(0);
        }

        .page-products .left-menu .item {
            margin: 0;
            padding: 0;
            background: transparent;
        }

        .page-products .left-menu .title {
            font-size: 20px;
            font-weight: 700;
            margin-bottom: 18px;
            padding-right: 45px;
            position: relative;
        }



        .page-products .left-menu .item:first-of-type .title::after {
            content: "×";
            position: absolute;
            right: 0;
            top: -4px;
            width: 34px;
            height: 34px;
            border-radius: 50%;
            background: #f1f1f1;
            color: #222;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 26px;
            font-weight: 400;
            cursor: pointer;
        }

        .page-products .left-menu ul {
            margin: 0;
            padding: 0;
            list-style: none;
        }

            .page-products .left-menu ul li {
                margin: 0;
                padding: 0;
                border-bottom: 1px solid #eee;
            }

                .page-products .left-menu ul li a {
                    display: block;
                    padding: 14px 0;
                    color: #222;
                    font-size: 15px;
                    line-height: 1.4;
                    text-decoration: none;
                }

                    .page-products .left-menu ul li a:hover,
                    .page-products .left-menu ul li a.active {
                        color: #273389;
                        font-weight: 700;
                    }

    .page-products .mobile-left-menu-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
        z-index: 9998;
    }

        .page-products .mobile-left-menu-overlay.active {
            display: block;
        }

    body.left-menu-open {
        overflow: hidden;
    }
}

@media (min-width: 992px) {
    .mobile-left-menu-btn,
    .mobile-left-menu-overlay {
        display: none;
    }
}


/* =========================================================
   MOBILE HEADER OVERRIDE
   Hamburger görünmeye başladığında: 100px düz header
   Sol: hamburger | Orta: logo | Sağ: arama + dil
   ========================================================= */

@media (max-width: 1224px) {

    #page-header.page-header,
    header#page-header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100px !important;
        background: #fff !important;
        border-bottom: 1px solid var(--border-color);
        z-index: 1000;
        pointer-events: auto !important;
    }

    header .header-bg {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100px !important;
        background: #fff !important;
        border-bottom: none !important;
        z-index: 1;
    }

    /* Mobilde curve tamamen kalksın */
    header .curve-container,
    header .curve-svg {
        display: none !important;
    }

    /* Logo ortada, dairesel/curve etkisi olmadan */
    header .logo-wrapper {
        position: absolute !important;
        top: 0 !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: 150px !important;
        height: 100px !important;
        border-radius: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 100000 !important;
        pointer-events: auto !important;
    }

        header .logo-wrapper img {
            width: 100% !important;
            max-height: 72px !important;
            object-fit: contain !important;
        }

    /* Hamburger solda ve dikey ortada */
    .menu-toggle {
        position: absolute !important;
        top: 50% !important;
        left: 20px !important;
        right: auto !important;
        transform: translateY(-50%) !important;
        width: 30px !important;
        height: 22px !important;
        padding: 0 !important;
        z-index: 100001 !important;
    }

    body:not(.menu-open) .menu-toggle span {
        background-color: #222 !important;
    }

    body.menu-open .menu-toggle {
        position: fixed !important;
        top: 39px !important;
        left: 20px !important;
        right: auto !important;
        transform: none !important;
    }

        body.menu-open .menu-toggle span {
            background-color: #fff !important;
        }

    /* Menü kapalıyken main-nav sadece taşıyıcı gibi dursun */
    header .main-nav:not(.active) {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100px !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        overflow: visible !important;
        display: block !important;
        z-index: 20 !important;
        pointer-events: none !important;
    }

        /* Menü kapalıyken normal menü linkleri görünmesin */
        header .main-nav:not(.active) .menu {
            display: none !important;
        }

        /* Sağ tarafta arama + dil */
        header .main-nav:not(.active) .nav-right {
            position: absolute !important;
            top: 0 !important;
            right: 20px !important;
            left: auto !important;
            width: auto !important;
            height: 100px !important;
            margin: 0 !important;
            padding: 0 !important;
            border-top: none !important;
            display: flex !important;
            flex-direction: row !important;
            align-items: center !important;
            justify-content: flex-end !important;
            gap: 18px !important;
            opacity: 1 !important;
            visibility: visible !important;
            z-index: 100001 !important;
            pointer-events: auto !important;
        }

            header .main-nav:not(.active) .nav-right .search a,
            header .main-nav:not(.active) .nav-right .language > a {
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                width: 36px !important;
                height: 36px !important;
                padding: 0 !important;
            }

            header .main-nav:not(.active) .nav-right img {
                filter: none !important;
            }

    /* Menü açıldığında sağ ikonlar üstte kalsın */
    body.menu-open header .main-nav.active {
        padding-top: 120px !important;
    }

        body.menu-open header .main-nav.active .nav-right {
            position: fixed !important;
            top: 0 !important;
            right: 20px !important;
            left: auto !important;
            width: auto !important;
            height: 100px !important;
            margin: 0 !important;
            padding: 0 !important;
            border-top: none !important;
            display: flex !important;
            align-items: center !important;
            justify-content: flex-end !important;
            gap: 18px !important;
            opacity: 1 !important;
            visibility: visible !important;
            z-index: 100001 !important;
        }

            body.menu-open header .main-nav.active .nav-right img {
                filter: brightness(0) invert(1) !important;
            }

    /* RTL sayfada da istenen düzen bozulmasın */
    body.rtl .menu-toggle {
        left: 20px !important;
        right: auto !important;
    }

    body.rtl header .main-nav:not(.active) .nav-right,
    body.rtl.menu-open header .main-nav.active .nav-right {
        right: 20px !important;
        left: auto !important;
    }
}

/* Mobil header kapalıyken dil dropdown düzgün açılsın */
@media (max-width: 1224px) {

    body:not(.menu-open) header .main-nav:not(.active) {
        overflow: visible !important;
    }

        body:not(.menu-open) header .main-nav:not(.active) .nav-right,
        body:not(.menu-open) header .main-nav:not(.active) .language {
            overflow: visible !important;
        }

            body:not(.menu-open) header .main-nav:not(.active) .language .language-content {
                position: absolute !important;
                top: 58px !important;
                right: 0 !important;
                left: auto !important;
                width: 190px !important;
                height: auto !important;
                min-height: auto !important;
                max-height: none !important;
                padding: 0 !important;
                background: #fff !important;
                z-index: 100005 !important;
                overflow: visible !important;
                display: none !important;
                opacity: 0 !important;
                visibility: hidden !important;
                transform: none !important;
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14) !important;
            }

                body:not(.menu-open) header .main-nav:not(.active) .language:hover .language-content,
                body:not(.menu-open) header .main-nav:not(.active) .language .language-content.open {
                    display: block !important;
                    opacity: 1 !important;
                    visibility: visible !important;
                    transform: none !important;
                }

                body:not(.menu-open) header .main-nav:not(.active) .language .language-content .lang-back-btn {
                    display: none !important;
                }

                body:not(.menu-open) header .main-nav:not(.active) .language .language-content ul {
                    display: block !important;
                    padding: 0 !important;
                    margin: 0 !important;
                    background: #fff !important;
                    box-shadow: none !important;
                    gap: 0 !important;
                }

                    body:not(.menu-open) header .main-nav:not(.active) .language .language-content ul li a {
                        display: flex !important;
                        align-items: center !important;
                        gap: 8px !important;
                        padding: 10px 12px !important;
                        color: #707070 !important;
                        font-size: 15px !important;
                        font-weight: 500 !important;
                        border-bottom: 1px solid #eee !important;
                        border-left: none !important;
                        background: #fff !important;
                        width: 100% !important;
                        box-sizing: border-box !important;
                    }

                    body:not(.menu-open) header .main-nav:not(.active) .language .language-content ul li:nth-child(odd) a {
                        background: #f7f7f7 !important;
                    }

                    body:not(.menu-open) header .main-nav:not(.active) .language .language-content ul li a img {
                        width: 22px !important;
                        height: auto !important;
                        margin: 0 !important;
                        filter: none !important;
                    }

                    body:not(.menu-open) header .main-nav:not(.active) .language .language-content ul li a span {
                        color: #707070 !important;
                        padding-left: 0 !important;
                    }
}

/* Mobilde header kapalıyken dil dropdown 100px içinde kırpılmasın */
@media (max-width: 1224px) {

    body:not(.menu-open) #page-header,
    body:not(.menu-open) #page-header.desktop,
    body:not(.menu-open) .page-header,
    body:not(.menu-open) header,
    body:not(.menu-open) header .header-bg,
    body:not(.menu-open) header .main-nav,
    body:not(.menu-open) header .nav-right,
    body:not(.menu-open) header .nav-right .language {
        overflow: visible !important;
    }

        body:not(.menu-open) header .main-nav:not(.active) {
            height: 100px !important;
            overflow: visible !important;
        }

            body:not(.menu-open) header .main-nav:not(.active) .nav-right {
                overflow: visible !important;
            }

                body:not(.menu-open) header .main-nav:not(.active) .nav-right .language {
                    position: relative !important;
                    overflow: visible !important;
                }

                    body:not(.menu-open) header .main-nav:not(.active) .nav-right .language .language-content {
                        position: absolute !important;
                        top: 52px !important;
                        right: 0 !important;
                        left: auto !important;
                        width: 190px !important;
                        height: auto !important;
                        min-height: 0 !important;
                        max-height: none !important;
                        display: none !important;
                        opacity: 0 !important;
                        visibility: hidden !important;
                        padding: 0 !important;
                        margin: 0 !important;
                        background: #fff !important;
                        box-shadow: 0 10px 30px rgba(0,0,0,.18) !important;
                        transform: none !important;
                        z-index: 100010 !important;
                        overflow: visible !important;
                    }

                        body:not(.menu-open) header .main-nav:not(.active) .nav-right .language .language-content.open {
                            display: block !important;
                            opacity: 1 !important;
                            visibility: visible !important;
                        }

                        body:not(.menu-open) header .main-nav:not(.active) .nav-right .language .language-content ul {
                            display: block !important;
                            background: #fff !important;
                            padding: 0 !important;
                            margin: 0 !important;
                            list-style: none !important;
                            box-shadow: none !important;
                        }

                            body:not(.menu-open) header .main-nav:not(.active) .nav-right .language .language-content ul li a {
                                display: flex !important;
                                align-items: center !important;
                                gap: 8px !important;
                                padding: 10px 12px !important;
                                color: #707070 !important;
                                background: #fff !important;
                                font-size: 15px !important;
                                border-bottom: 1px solid #eee !important;
                                width: 100% !important;
                                box-sizing: border-box !important;
                            }

                            body:not(.menu-open) header .main-nav:not(.active) .nav-right .language .language-content ul li:nth-child(odd) a {
                                background: #f5f5f5 !important;
                            }

                        body:not(.menu-open) header .main-nav:not(.active) .nav-right .language .language-content img {
                            width: 22px !important;
                            filter: none !important;
                        }

                        body:not(.menu-open) header .main-nav:not(.active) .nav-right .language .language-content .lang-back-btn {
                            display: none !important;
                        }
}

/* =========================================================
   Mobilde menü veya dil paneli açılınca üst bar elemanlarını gizle
   ========================================================= */

@media (max-width: 1224px) {

    /* Hamburger menü açılınca logo ve sağ ikonlar görünmesin */
    body.menu-open header .logo-wrapper,
    body.menu-open header .main-nav.active .nav-right {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* Hamburger/X butonu görünmeye devam etsin */
    body.menu-open .menu-toggle {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        z-index: 100002 !important;
    }

    /* Dil paneli açılınca logo gizlensin */
    body.language-open:not(.menu-open) header .logo-wrapper {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* Dil paneli açılınca arama ikonu gizlensin */
    body.language-open:not(.menu-open) header .main-nav:not(.active) .nav-right .search {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* Dil paneli açılınca dil butonu gizlensin ama dropdown kalsın */
    body.language-open:not(.menu-open) header .main-nav:not(.active) .nav-right .language > a {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* Dil listesi açık kalmaya devam etsin */
    body.language-open:not(.menu-open) header .main-nav:not(.active) .nav-right .language .language-content.open {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        z-index: 100010 !important;
    }
}

/* Dil paneli açıkken mobil header ikonlarını gizle */
@media (max-width: 1224px) {

    body:not(.menu-open):has(header .nav-right .language .language-content.open) header .logo-wrapper {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body:not(.menu-open):has(header .nav-right .language .language-content.open) header .nav-right .search {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body:not(.menu-open):has(header .nav-right .language .language-content.open) header .nav-right .language > a {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body:not(.menu-open):has(header .nav-right .language .language-content.open) header .nav-right .language .language-content.open {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        z-index: 100010 !important;
    }
}

@media (max-width: 1224px) {

    body.language-open:not(.menu-open) header .logo-wrapper,
    body.language-open:not(.menu-open) header .nav-right .search,
    body.language-open:not(.menu-open) header .nav-right .language > a {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body.language-open:not(.menu-open) header .nav-right .language .language-content.open {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}

@media (max-width: 1224px) {

    body:not(.menu-open) #page-header,
    body:not(.menu-open) header#page-header {
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    }

    body.menu-open #page-header,
    body.menu-open header#page-header {
        box-shadow: none !important;
    }
}

@media (max-width: 1224px) {

    body:not(.menu-open) #page-header,
    body:not(.menu-open) header#page-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        transform: translateY(0);
        transition: transform 0.32s ease, box-shadow 0.32s ease !important;
        will-change: transform;
    }

    body.mobile-header-hidden:not(.menu-open):not(.language-open) #page-header,
    body.mobile-header-hidden:not(.menu-open):not(.language-open) header#page-header {
        transform: translateY(-115%) !important;
        box-shadow: none !important;
    }

    body.mobile-header-visible:not(.menu-open) #page-header,
    body.mobile-header-visible:not(.menu-open) header#page-header {
        transform: translateY(0) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    }

    body.menu-open #page-header,
    body.language-open #page-header {
        transform: translateY(0) !important;
    }
}

/* =========================================================
   Menü ve dil paneli açılınca 100px header'a sıkışmasın
   ========================================================= */

@media (max-width: 1224px) {

    body.menu-open #page-header,
    body.menu-open header#page-header,
    body.language-open #page-header,
    body.language-open header#page-header {
        overflow: visible !important;
        height: 100px !important;
        max-height: none !important;
        transform: translateY(0) !important;
        z-index: 100000 !important;
    }

    /* Hamburger menü tam ekran açılsın */
    body.menu-open header .main-nav.active {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        max-height: none !important;
        min-height: 100vh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 99998 !important;
        padding: 90px 24px calc(20px + env(safe-area-inset-bottom)) 24px !important;
        box-sizing: border-box !important;
        transform: none !important;
    }

    /* Dil paneli tam ekran açılsın */
    body.language-open:not(.menu-open) header .language-content.open {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        max-height: none !important;
        min-height: 100vh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 100020 !important;
        background: #fff !important;
        transform: none !important;
        box-sizing: border-box !important;
        padding: 90px 24px calc(20px + env(safe-area-inset-bottom)) 24px !important;
    }

    /* Dil paneli açıkken header'ın 100px alanı kesici gibi davranmasın */
    body.language-open:not(.menu-open) header,
    body.language-open:not(.menu-open) header .main-nav,
    body.language-open:not(.menu-open) header .nav-right,
    body.language-open:not(.menu-open) header .language {
        overflow: visible !important;
    }

        /* Dil paneli içindeki liste tam genişlikte düzgün aksın */
        body.language-open:not(.menu-open) header .language-content.open ul {
            display: block !important;
            width: 100% !important;
            max-width: 420px !important;
            margin: 0 auto !important;
            padding: 0 !important;
            list-style: none !important;
            background: transparent !important;
        }

            body.language-open:not(.menu-open) header .language-content.open ul li a {
                display: flex !important;
                align-items: center !important;
                gap: 12px !important;
                width: 100% !important;
                padding: 14px 16px !important;
                font-size: 17px !important;
                color: #222 !important;
                background: #fff !important;
                border-bottom: 1px solid #eee !important;
                box-sizing: border-box !important;
            }

                body.language-open:not(.menu-open) header .language-content.open ul li a img {
                    width: 24px !important;
                    height: auto !important;
                    filter: none !important;
                }
}

@media (max-width: 1224px) {

    body.language-open > .language-content.open {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        max-height: none !important;
        min-height: 100vh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 100020 !important;
        background: #fff !important;
        transform: none !important;
        box-sizing: border-box !important;
        padding: 90px 24px calc(20px + env(safe-area-inset-bottom)) 24px !important;
    }

        body.language-open > .language-content.open ul {
            display: block !important;
            width: 100% !important;
            max-width: 420px !important;
            margin: 0 auto !important;
            padding: 0 !important;
            list-style: none !important;
            background: transparent !important;
        }

            body.language-open > .language-content.open ul li a {
                display: flex !important;
                align-items: center !important;
                gap: 12px !important;
                width: 100% !important;
                padding: 14px 16px !important;
                font-size: 17px !important;
                color: #222 !important;
                background: #fff !important;
                border-bottom: 1px solid #eee !important;
                box-sizing: border-box !important;
            }

                body.language-open > .language-content.open ul li a img {
                    width: 24px !important;
                    height: auto !important;
                    filter: none !important;
                }

        body.language-open > .language-content.open .lang-back-btn {
            display: flex !important;
            align-items: center !important;
            gap: 8px !important;
            width: 100% !important;
            max-width: 420px !important;
            margin: 0 auto 20px auto !important;
            padding: 12px 0 !important;
            font-size: 16px !important;
            font-weight: 600 !important;
            color: #222 !important;
            background: transparent !important;
            border: none !important;
        }
}

/* =========================================================
   Mobil dil paneli scroll sonrası 100px header'a sıkışmasın
   ========================================================= */

@media (max-width: 1224px) {

    html.language-lock,
    body.language-open {
        overflow: hidden !important;
        height: 100% !important;
    }

        body.language-open #page-header,
        body.language-open header#page-header {
            transform: translateY(0) !important;
            overflow: visible !important;
            height: 100px !important;
            z-index: 100000 !important;
        }

        body.language-open.mobile-header-hidden #page-header,
        body.language-open.mobile-header-hidden header#page-header,
        body.language-open.mobile-header-visible #page-header,
        body.language-open.mobile-header-visible header#page-header {
            transform: translateY(0) !important;
        }

        body.language-open > .language-content.open {
            position: fixed !important;
            inset: 0 !important;
            width: 100vw !important;
            height: 100vh !important;
            height: 100dvh !important;
            min-height: 100vh !important;
            max-height: none !important;
            display: block !important;
            opacity: 1 !important;
            visibility: visible !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
            -webkit-overflow-scrolling: touch !important;
            z-index: 2147483000 !important;
            background: #fff !important;
            transform: none !important;
            box-sizing: border-box !important;
            padding: 90px 24px calc(24px + env(safe-area-inset-bottom)) 24px !important;
        }

            body.language-open > .language-content.open .lang-back-btn {
                display: flex !important;
                align-items: center !important;
                gap: 8px !important;
                width: 100% !important;
                max-width: 420px !important;
                margin: 0 auto 20px auto !important;
                padding: 12px 0 !important;
                font-size: 16px !important;
                font-weight: 600 !important;
                color: #222 !important;
                background: transparent !important;
                border: none !important;
                border-bottom: 1px solid #eee !important;
            }

            body.language-open > .language-content.open ul {
                display: block !important;
                width: 100% !important;
                max-width: 420px !important;
                margin: 0 auto !important;
                padding: 0 !important;
                list-style: none !important;
                background: transparent !important;
                box-shadow: none !important;
            }

                body.language-open > .language-content.open ul li a {
                    display: flex !important;
                    align-items: center !important;
                    gap: 12px !important;
                    width: 100% !important;
                    padding: 14px 16px !important;
                    font-size: 17px !important;
                    font-weight: 500 !important;
                    color: #222 !important;
                    background: #fff !important;
                    border-bottom: 1px solid #eee !important;
                    box-sizing: border-box !important;
                    text-decoration: none !important;
                }

                body.language-open > .language-content.open ul li:nth-child(odd) a {
                    background: #f7f7f7 !important;
                }

                body.language-open > .language-content.open ul li a img {
                    width: 24px !important;
                    height: auto !important;
                    margin: 0 !important;
                    filter: none !important;
                }

                body.language-open > .language-content.open ul li a span {
                    color: #222 !important;
                    padding-left: 0 !important;
                }
}