

.header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:999;
    backdrop-filter:blur(20px);
    background:rgba(10, 10, 10, 0.096);
    border-bottom:1px solid rgba(255, 255, 255, 0);
}

.header-inner{
    height:65px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.logo img{
    width:0px;
}

.desktop-menu{
    display:flex;
    gap:50px;
}

.desktop-menu a{
    font-size:15px;
    font-weight:500;
    letter-spacing:.5px;
    opacity:.85;
    transition:.3s;
}

.desktop-menu a:hover,
.desktop-menu a.active{
    opacity:1;
    color:#c79b6a;
}

.header-socials{
    display:flex;
    gap:14px;
    
}

.header-socials a{
    width:44px;
    height:44px;
    border-radius:12px;
    background:rgba(255,255,255,.05);
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.3s;
}

.header-socials a:hover{
    transform:translateY(0px);
    background:#c79b6a;
}

.menu-btn{
    display:none;
}


.header-top{
    display:flex;
    justify-content:flex-start;
    padding:8px 4px;
}

.header-phone{
    color:#fff;
    text-decoration:none;
    font-size:14px;
    font-weight:500;
    letter-spacing:1px;
}

.header-phone i svg{
    fill:none;
    stroke:#fff;
    stroke-width:1.8;
}

.header-topbar{
    height:38px;
    background:#131313;
    border-bottom:1px solid rgba(255,255,255,.06);
}

.header-topbar-inner{
    height:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.topbar-left{
    display:flex;
    gap:30px;
}

.topbar-left a{
    color:rgba(255,255,255,.65);
    text-decoration:none;
    font-size:13px;
    transition:.3s;
}

.topbar-left a:hover{
    color:#c79b6a;
}

.topbar-left i{
    margin-right:8px;
}

.topbar-right{
    display:flex;
    align-items:center;
    gap:18px;
}

.topbar-right a{
    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:rgba(255,255,255,.65);
    text-decoration:none;

    transition:.3s ease;
}

.topbar-right a:hover{
    color:#c79b6a;
    transform:translateY(-2px);
}

.blog-btn{

    display:flex;
    align-items:center;
    gap:8px;
    margin-right:15px;

    padding:0;

    background:none;
    border:none;

    color:#d6b180;

    text-decoration:none;

    font-size:13px;
    font-weight:600;

    transition:.3s;
}

.blog-btn::after{

    content:"";

    width:0;

    height:1px;

    background:#c79b6a;

    transition:.35s;
}

.blog-btn:hover{

    color:#fff;
}

.blog-btn:hover::after{

    width:100%;
}


.shipping-info{
    display:flex;
    align-items:center;
    gap:8px;

    color:rgba(255,255,255,.65);

    font-size:13px;
    font-weight:500;
    letter-spacing:.3px;
}

.shipping-info i{
    color:rgba(255,255,255,.65);
}




/* =====================================================
   MOBILE DRAWER
===================================================== */

/* =====================================================
   MOBILE / TABLET
===================================================== */
.mobile-drawer { display: none; }


@media (max-width:991px){

    /* Masaüstü menüyü gizle */
    .desktop-menu,
    .header-inner{
        display:none !important;
    }

    .header{
        backdrop-filter:blur(18px);
    }

    .header-topbar{
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:44px;
        z-index:100000;
    }

    .header-topbar-inner{
        height:100%;
        display:flex;
        align-items:center;
        justify-content:space-between;
        padding:0 12px;
        gap:8px;
    }

    /* Mail ve kargo gizle */
    .topbar-left a:first-child,
    .shipping-info{
        display:none;
    }

    /* Telefon */
    .topbar-left{
        flex:1;
        min-width:0;

        display:flex;
        align-items:center;
    }

    .topbar-left a:last-child{
        display:flex;
        align-items:center;
        gap:6px;

        color:#fff;

        font-size:13px;
        font-weight:500;

        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .topbar-left i{
        margin-right:0;
        font-size:13px;
    }

    /* Sağ taraf */
    .topbar-right{
        display:flex;
        align-items:center;
        gap:4px;
        flex-shrink:0;
    }

    /* Blog */
    .blog-btn{
        display:flex !important;
        align-items:center;
        gap:6px;

        width:auto !important;
        height:auto !important;

        margin-right:12px;
        padding:0;

        color:#d6b180;

        font-size:12px;
        font-weight:600;

        flex-shrink:0;
    }

    .blog-btn::after{
        display:none;
    }

    /* Sadece sosyal ikonlar */
    .topbar-right a:not(.blog-btn){
        width:28px;
        height:28px;

        display:flex;
        align-items:center;
        justify-content:center;
        

        font-size:13px;

        flex-shrink:0;
    }

    /* ==========================
       DRAWER
    ========================== */

    .mobile-drawer{
        display:block;
        position:fixed;
        inset:0;
        pointer-events:none;
        z-index:99999;
    }

    .drawer-overlay{
        position:absolute;
        inset:0;
        top:44px;
        background:rgba(0,0,0,.5);
        opacity:0;
        pointer-events:none;
        transition:.35s;
    }

    .mobile-drawer.open .drawer-overlay{
        opacity:1;
        pointer-events:auto;
    }

    .drawer-sheet{
        position:absolute;
        left:0;
        right:0;
        top:44px;
        height:42vh;

        background:rgba(15,15,15,.92);

        backdrop-filter:blur(20px);
        -webkit-backdrop-filter:blur(20px);

        transform:translateY(-100%);
        transition:transform .35s cubic-bezier(.22,1,.36,1);

        pointer-events:auto;
        box-shadow:0 10px 25px rgba(0,0,0,.45);
    }

    .mobile-drawer.open .drawer-sheet{
        transform:translateY(0);
    }

    .drawer-content{
        height:calc(42vh - 32px);

        display:flex;
        align-items:center;
        justify-content:center;

        padding:18px 0;
    }

    .drawer-nav{
        width:88%;

        display:flex;
        flex-direction:column;
        gap:12px;

        text-align:center;
    }

    .drawer-nav a{
        color:#fff;

        font-size:18px;
        font-weight:600;

        text-decoration:none;

        padding:12px 0;

        border-bottom:1px solid rgba(255,255,255,.08);

        opacity:0;
        transform:translateY(-10px);

        transition:.35s;
    }

    .drawer-nav a:last-child{
        border-bottom:none;
    }

    .mobile-drawer.open .drawer-nav a{
        opacity:1;
        transform:translateY(0);
    }

    .drawer-nav a:nth-child(1){transition-delay:.05s;}
    .drawer-nav a:nth-child(2){transition-delay:.10s;}
    .drawer-nav a:nth-child(3){transition-delay:.15s;}
    .drawer-nav a:nth-child(4){transition-delay:.20s;}

    .drawer-handle{
        position:absolute;

        left:0;
        right:0;
        bottom:-30px;

        height:30px;

        display:flex;
        align-items:center;
        justify-content:center;

        cursor:grab;
        touch-action:none;

        background:rgba(10, 10, 10, 0);



        border-bottom:1px solid rgba(34, 34, 34, 0);
    }

    .drawer-handle span{
        width:44px;
        height:4px;

        border-radius:100px;

        background:rgba(255, 255, 255, 0.80);
    }

}

.youtube-link{
    display:flex;
}

@media (max-width:991px){

    .youtube-link{
        display:none !important;
    }

}