500;600;700;800;900&display=swap");

.styleko-shared-header,
.styleko-shared-header *{
    box-sizing:border-box !important;
    font-family:Inter,"Segoe UI",Arial,sans-serif !important;
    font-synthesis:none !important;
    font-kerning:normal !important;
    -webkit-font-smoothing:antialiased !important;
    -moz-osx-font-smoothing:grayscale !important;
    text-rendering:optimizeLegibility !important;
}

.styleko-shared-header{
    position:relative !important;
    top:auto !important;
    z-index:1000 !important;
    width:100% !important;
    min-height:74px !important;
    margin:0 !important;
    padding:0 !important;
    background:linear-gradient(180deg,rgba(3,9,17,.98),rgba(3,9,17,.94)) !important;
    border:0 !important;
    border-bottom:1px solid rgba(73,217,255,.12) !important;
    box-shadow:0 8px 28px rgba(0,0,0,.18) !important;
    backdrop-filter:blur(10px) !important;
    -webkit-backdrop-filter:blur(10px) !important;
}

.styleko-header-container{
    width:min(calc(100% - 48px),1380px) !important;
    max-width:1380px !important;
    min-height:74px !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:34px !important;
}

.styleko-header-logo{
    flex:0 0 auto !important;
    min-width:225px !important;
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    margin:0 !important;
    padding:0 !important;
    color:inherit !important;
    text-decoration:none !important;
}

.styleko-header-logo-mark{
    position:relative !important;
    width:40px !important;
    height:40px !important;
    flex:0 0 40px !important;
    display:grid !important;
    place-items:center !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid rgba(73,217,255,.42) !important;
    border-radius:9px !important;
    background:linear-gradient(180deg,rgba(73,217,255,.07),rgba(73,217,255,.02)) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.styleko-header-logo-mark::before{
    content:"" !important;
    width:15px !important;
    height:15px !important;
    border:2px solid #43d8ff !important;
    transform:rotate(45deg) !important;
    box-shadow:0 0 12px rgba(67,216,255,.25) !important;
}

.styleko-header-logo-text{
    margin:0 !important;
    padding:0 !important;
    color:#eef7ff !important;
    font-size:21px !important;
    line-height:1 !important;
    font-weight:800 !important;
    letter-spacing:3px !important;
    white-space:nowrap !important;
}

.styleko-header-logo-text span{
    color:#43d8ff !important;
}

.styleko-header-logo-sub{
    margin:2px 0 0 !important;
    padding:0 !important;
    color:#648299 !important;
    font-size:7px !important;
    line-height:1 !important;
    font-weight:800 !important;
    letter-spacing:3px !important;
    white-space:nowrap !important;
}

.styleko-header-nav{
    flex:1 1 auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    margin:0 !important;
    padding:0 !important;
}

.styleko-header-link{
    position:relative !important;
    min-height:42px !important;
    margin:0 !important;
    padding:0 15px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:0 !important;
    border-radius:6px !important;
    color:#c0ccd8 !important;
    background:transparent !important;
    font-size:11px !important;
    line-height:1 !important;
    font-weight:700 !important;
    letter-spacing:.45px !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    box-shadow:none !important;
    transition:color .16s ease,background .16s ease !important;
}

.styleko-header-link::after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    bottom:2px !important;
    width:0 !important;
    height:2px !important;
    transform:translateX(-50%) !important;
    border-radius:10px !important;
    background:#49d9ff !important;
    box-shadow:0 0 10px rgba(73,217,255,.35) !important;
    transition:width .18s ease !important;
}

.styleko-header-link:hover{
    color:#eefaff !important;
    background:rgba(73,217,255,.035) !important;
}

.styleko-header-link:hover::after,
.styleko-header-link.active::after{
    width:42% !important;
}

.styleko-header-link.active{
    color:#49d9ff !important;
}

.styleko-header-login{
    flex:0 0 auto !important;
    min-width:104px !important;
    min-height:40px !important;
    margin:0 !important;
    padding:0 18px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid rgba(73,217,255,.34) !important;
    border-radius:7px !important;
    background:linear-gradient(180deg,rgba(8,27,43,.72),rgba(4,15,26,.82)) !important;
    color:#61ddff !important;
    font-size:11px !important;
    line-height:1 !important;
    font-weight:700 !important;
    letter-spacing:.5px !important;
    text-decoration:none !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025) !important;
}

.styleko-header-login:hover{
    transform:translateY(-1px) !important;
    border-color:rgba(73,217,255,.58) !important;
    background:linear-gradient(180deg,rgba(12,39,59,.88),rgba(6,21,35,.92)) !important;
}

@media(min-width:1600px){
    .styleko-header-container{
        max-width:1440px !important;
    }

    .styleko-header-nav{
        gap:8px !important;
    }
}

@media(max-width:1000px){
    .styleko-header-container{
        width:calc(100% - 32px) !important;
        gap:18px !important;
    }

    .styleko-header-link{
        padding-left:10px !important;
        padding-right:10px !important;
    }
}

@media(max-width:760px){
    .styleko-shared-header,
    .styleko-header-container{
        min-height:70px !important;
    }

    .styleko-header-nav{
        display:none !important;
    }

    .styleko-header-logo-sub{
        display:none !important;
    }

    .styleko-header-logo-text{
        font-size:20px !important;
    }

    .styleko-header-login{
        margin-left:auto !important;
    }
}



/* =========================================================
   STYLEKO AKTIF SEKME
   Yazi rengi degismez - sadece alt cizgi
   ========================================================= */

.styleko-header-link,
.styleko-header-link.active{
    color:#c0ccd8 !important;
}

.styleko-header-link.active:hover{
    color:#eefaff !important;
}

.styleko-header-link.active::after{
    width:42% !important;
    height:2px !important;
    background:#49d9ff !important;
    box-shadow:0 0 10px rgba(73,217,255,.35) !important;
}


/* =========================================================
   STYLEKO HEADER BALANCE BUTTON V1
   ========================================================= */

.styleko-header-actions{
    flex:0 0 auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    margin:0 !important;
    padding:0 !important;
}

.styleko-header-balance{
    display:none !important;
    min-width:118px !important;
    min-height:40px !important;
    margin:0 !important;
    padding:0 18px !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid rgba(255,69,85,.70) !important;
    border-radius:7px !important;
    background:linear-gradient(180deg,rgba(105,18,28,.72),rgba(50,8,15,.90)) !important;
    color:#ff8791 !important;
    font-family:Inter,"Segoe UI",Arial,sans-serif !important;
    font-size:11px !important;
    line-height:1 !important;
    font-weight:800 !important;
    letter-spacing:.5px !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    cursor:pointer !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 0 14px rgba(255,45,65,.10) !important;
    transition:
        color .16s ease,
        border-color .16s ease,
        background .16s ease,
        box-shadow .16s ease,
        transform .16s ease !important;
}

.styleko-header-balance.is-visible{
    display:inline-flex !important;
}

@media (hover:hover) and (pointer:fine){
    .styleko-header-balance:hover{
        color:#ffd1d5 !important;
        border-color:rgba(255,75,90,.95) !important;
        background:linear-gradient(180deg,rgba(135,24,36,.86),rgba(67,10,19,.96)) !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.05),
            0 0 18px rgba(255,48,65,.22) !important;
        transform:translateY(-1px) !important;
    }
}

@media(max-width:760px){
    .styleko-header-actions{
        margin-left:auto !important;
    }

    .styleko-header-balance{
        min-width:auto !important;
        padding-left:12px !important;
        padding-right:12px !important;
    }
}
/* =========================================================
   STYLEKO HEADER DOWNLOAD BUTTON V1
   ========================================================= */

.styleko-header-download{
    flex:0 0 auto !important;
    min-width:92px !important;
    min-height:40px !important;
    margin:0 !important;
    padding:0 18px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid rgba(87,116,145,.42) !important;
    border-radius:7px !important;
    background:linear-gradient(180deg,rgba(15,31,47,.88),rgba(6,17,29,.94)) !important;
    color:#a9bbca !important;
    font-family:Inter,"Segoe UI",Arial,sans-serif !important;
    font-size:11px !important;
    line-height:1 !important;
    font-weight:800 !important;
    letter-spacing:.5px !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    cursor:pointer !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025) !important;
    transition:color .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease !important;
}

@media (hover:hover) and (pointer:fine){
    .styleko-header-download:hover{
        color:#d7e3ec !important;
        border-color:rgba(105,143,178,.65) !important;
        background:linear-gradient(180deg,rgba(21,43,63,.94),rgba(8,23,38,.98)) !important;
        box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 0 12px rgba(70,130,180,.08) !important;
        transform:translateY(-1px) !important;
    }
}

@media(max-width:760px){
    .styleko-header-download{
        min-width:auto !important;
        padding-left:12px !important;
        padding-right:12px !important;
    }
}

/* STYLEKO NEW HEADER LOGO V1 */
.styleko-header-logo-mark{
    position:relative !important;
    width:40px !important;
    height:40px !important;
    flex:0 0 40px !important;
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    border:none !important;
    border-radius:9px !important;
    background-image:url("/styleko-logo-new.png?v=20260829") !important;
    background-size:40px 40px !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
    box-shadow:none !important;
    overflow:hidden !important;
}
.styleko-header-logo-mark::before{
    content:none !important;
    display:none !important;
}