/*=========================================================
    HEADER
=========================================================*/

.ss-header{

    position:sticky;
    padding-top:8px;

    top:0;

    left:0;

    z-index:1000;

    width:100%;

    transition:.25s;

}

.support{
    display: flex;
    align-items: center;
    gap: 5px;
}
/*=========================================================
    HEADER CONTAINER
=========================================================*/

.ss-header .ss-container{

    position:relative;

}


/*=========================================================
    HEADER ROW
=========================================================*/

.ss-header-row{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

    min-height:72px;

    padding:0 18px;

    border:1px solid rgba(112,168,255,.08);

    border-radius:15px;

    background:

        linear-gradient(

            180deg,

            rgba(30,40,64,.88),

            rgba(18,25,41,.94)

        );

    backdrop-filter:blur(18px);

    -webkit-backdrop-filter:blur(18px);

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.04),

        0 16px 34px rgba(0,0,0,.18);

    overflow:hidden;

}


/*=========================================================
    TOP HIGHLIGHT
=========================================================*/

.ss-header-row::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    right:0;

    height:1px;

    background:

        linear-gradient(

            90deg,

            transparent,

            rgba(120,185,255,.35),

            transparent

        );

}


/*=========================================================
    BRAND
=========================================================*/

.ss-brand{

    flex:0 0 auto;

}


/*=========================================================
    BRAND LINK
=========================================================*/

.ss-brand-link{

    display:flex;

    align-items:center;

    gap:12px;

    text-decoration:none;

}


/*=========================================================
    LOGO
=========================================================*/

.ss-brand-logo{

    display:flex;

    align-items:center;

    justify-content:center;

    flex:0 0 auto;

}

.ss-brand-logo img{

    display:block;

    width:auto;

    height:62px;

}


/*=========================================================
    BRAND CONTENT
=========================================================*/

.ss-brand-content{

    display:flex;

    flex-direction:column;

    gap:2px;

    min-width:0;

}


/*=========================================================
    TITLE
=========================================================*/

.ss-brand-title{

    margin:0;

    font-size:14px;

    font-weight:500;

    line-height:1.2;

    color:#FFFFFF;

    letter-spacing:.2px;

}


/*=========================================================
    SUBTITLE
=========================================================*/

.ss-brand-subtitle{

    display:block;

    font-size:9px;

    font-weight:400;

    line-height:1.4;

    letter-spacing:.6px;

    text-transform:uppercase;

    color:#8EA3BD;

}
/*=========================================================
    DESKTOP NAVIGATION
=========================================================*/

.ss-nav{

    flex:1 1 auto;

    display:flex;

    justify-content:center;

    min-width:0;

}


/*=========================================================
    MENU
=========================================================*/

.ss-menu{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:4px;

    margin:0;

    padding:0;

    list-style:none;

}


/*=========================================================
    MENU ITEM
=========================================================*/

.ss-menu>li{

    position:relative;

    margin:0;

    padding:0;

}


/*=========================================================
    MENU LINK
=========================================================*/

.ss-menu>li>a{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:6px;

    height:40px;

    padding:0 14px;

    border-radius:8px;

    text-decoration:none;

    font-size:11px;

    font-weight:500;

    letter-spacing:.2px;

    white-space:nowrap;

    color:#AEBFD6;

    transition:.22s;

}


/*=========================================================
    MENU ICON
=========================================================*/

.ss-menu>li>a svg{

    width:14px;

    height:14px;

    opacity:.82;

    transition:.22s;

}


/*=========================================================
    HOVER
=========================================================*/

.ss-menu>li:hover>a{

    color:#FFFFFF;

    background:rgba(255,255,255,.035);

}

.ss-menu>li:hover>a svg{

    opacity:1;

    transform:translateY(-1px);

}


/*=========================================================
    ACTIVE
=========================================================*/

.ss-menu>.current-menu-item>a,

.ss-menu>.current-menu-parent>a,

.ss-menu>.current_page_item>a,

.ss-menu>.current_page_parent>a{

    color:#FFFFFF;

    background:

        linear-gradient(

            180deg,

            rgba(74,144,255,.14),

            rgba(74,144,255,.06)

        );

}


/*=========================================================
    ACTIVE INDICATOR
=========================================================*/

.ss-menu>.current-menu-item>a::after,

.ss-menu>.current-menu-parent>a::after,

.ss-menu>.current_page_item>a::after,

.ss-menu>.current_page_parent>a::after{

    content:"";

    position:absolute;

    left:10px;

    right:10px;

    bottom:6px;

    height:2px;

    border-radius:13px;

    background:

        linear-gradient(

            90deg,

            transparent,

            #67B3FF,

            transparent

        );

}


/*=========================================================
    SUB MENU
=========================================================*/

.ss-menu .sub-menu{

    position:absolute;

    top:calc(100% + 10px);

    left:0;

    min-width:220px;

    margin:0;

    padding:8px;

    list-style:none;

    border:1px solid rgba(110,170,255,.08);

    border-radius:12px;

    background:

        linear-gradient(

            180deg,

            rgba(28,38,60,.98),

            rgba(18,25,40,.99)

        );

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.04),

        0 18px 36px rgba(0,0,0,.24);

    opacity:0;

    visibility:hidden;

    transform:translateY(8px);

    transition:.22s;

}


/*=========================================================
    SUB MENU SHOW
=========================================================*/

.ss-menu li:hover>.sub-menu{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}


/*=========================================================
    SUB MENU ITEM
=========================================================*/

.ss-menu .sub-menu li{

    margin:0;

}


/*=========================================================
    SUB MENU LINK
=========================================================*/

.ss-menu .sub-menu a{

    display:flex;

    align-items:center;

    min-height:36px;

    padding:0 12px;

    border-radius:10px;

    text-decoration:none;

    font-size:10px;

    font-weight:400;

    color:#B7C7DB;

    transition:.2s;

}


/*=========================================================
    SUB MENU HOVER
=========================================================*/

.ss-menu .sub-menu a:hover{

    color:#FFFFFF;

    background:rgba(255,255,255,.04);

}
/*=========================================================
    HEADER ACTIONS
=========================================================*/

.ss-header-actions{

    display:flex;

    align-items:center;

    justify-content:flex-end;

    gap:8px;

    flex:0 0 auto;

}


/*=========================================================
    ACTION BUTTON
=========================================================*/

.ss-action-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:42px;

    height:42px;

    padding:0;

    border:1px solid rgba(110,170,255,.08);

    border-radius:10px;

    background:

        linear-gradient(

            180deg,

            rgba(31,42,67,.88),

            rgba(20,28,45,.96)

        );

    color:#DCEBFF;

    cursor:pointer;

    transition:.22s;

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.04);

}


/*=========================================================
    ACTION ICON
=========================================================*/

.ss-action-btn svg{

    width:18px;

    height:18px;

    transition:.22s;

}


/*=========================================================
    ACTION HOVER
=========================================================*/

.ss-action-btn:hover{

    color:#FFFFFF;

    border-color:rgba(103,179,255,.20);

    transform:translateY(-1px);

    background:

        linear-gradient(

            180deg,

            rgba(39,54,82,.96),

            rgba(26,37,59,.98)

        );

}


/*=========================================================
    ACTION ICON HOVER
=========================================================*/

.ss-action-btn:hover svg{

    transform:scale(1.08);

}


/*=========================================================
    DOWNLOAD BUTTON
=========================================================*/

.ss-download-btn-header{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    height:42px;

    padding:0 18px;

    border:1px solid rgba(255,86,86,.18);

    border-radius:10px;

    text-decoration:none;

    font-size:11px;

    font-weight:500;

    color:#FFFFFF;

    background:

        linear-gradient(

            180deg,

            rgba(255,82,82,.18),

            rgba(195,43,43,.14)

        );

    transition:.22s;

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.05);

}


/*=========================================================
    DOWNLOAD ICON
=========================================================*/

.ss-download-btn-header svg{

    width:15px;

    height:15px;

    transition:.22s;

}


/*=========================================================
    DOWNLOAD HOVER
=========================================================*/

.ss-download-btn-header:hover{

    color:#FFFFFF;

    border-color:rgba(255,110,110,.28);

    transform:translateY(-1px);

    background:

        linear-gradient(

            180deg,

            rgba(255,92,92,.24),

            rgba(220,48,48,.18)

        );

}


/*=========================================================
    SEARCH OVERLAY
=========================================================*/

.ss-search-overlay{

    position:fixed;

    inset:0;

    opacity:0;

    visibility:hidden;

    background:rgba(7,12,22,.62);

    backdrop-filter:blur(6px);

    -webkit-backdrop-filter:blur(6px);

    transition:.25s;

    z-index:1100;

}

.ss-search-item{

display:flex;

align-items:center;

gap:12px;

padding:10px 18px;

text-decoration:none;

}
/*=========================================================
    SEARCH MODAL
=========================================================*/

.ss-search-modal{

    position:fixed;

    top:88px;

    left:50%;

    width:min(760px,calc(100% - 32px));

    opacity:0;

    visibility:hidden;

    transform:translate(-50%,-12px);

    border:1px solid rgba(110,170,255,.08);

    border-radius:15px;

    background:

        linear-gradient(

            180deg,

            rgba(31,42,67,.96),

            rgba(20,28,45,.98)

        );

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.04),

        0 24px 50px rgba(0,0,0,.30);

    transition:.25s;

    overflow:hidden;

    z-index:1101;

}


/*=========================================================
    SEARCH BOX
=========================================================*/

.ss-search-box{

    display:flex;

    align-items:center;

    gap:14px;

    min-height:64px;

    padding:0 20px;

}

.ss-search-box>svg{

    flex:0 0 18px;

    width:18px;

    height:18px;

    min-width:18px;

    min-height:18px;

    color:#73A8FF;

}
/*=========================================================
    SEARCH INPUT
=========================================================*/

#ss-global-search{

    flex:1;

    width:auto;

    min-width:0;

    height:44px;

    padding:0;

    border:0;

    outline:0;

    background:none;

    color:#FFFFFF;

    font-size:12px;

}


/*=========================================================
    PLACEHOLDER
=========================================================*/

#ss-global-search::placeholder{

    color:#8EA3BD;

}


/*=========================================================
    SEARCH CLOSE
=========================================================*/

.ss-search-close{

    display:flex;

    align-items:center;

    justify-content:center;

    width:36px;

    height:36px;

    padding:0;

    border:0;

    border-radius:10px;

    background:transparent;

    color:#AFC1D8;

    cursor:pointer;

    transition:.2s;

}


/*=========================================================
    SEARCH CLOSE HOVER
=========================================================*/

.ss-search-close:hover{

    color:#FFFFFF;

    background:rgba(255,255,255,.05);

}


/*=========================================================
    SEARCH RESULTS
=========================================================*/

.ss-search-results{

    max-height:420px;

    overflow-y:auto;

}
/*=========================================================
    MOBILE OVERLAY
=========================================================*/

.ss-mobile-overlay{

    position:fixed;

    inset:0;

    opacity:0;

    visibility:hidden;

    background:rgba(6,11,20,.72);

    backdrop-filter:blur(5px);

    -webkit-backdrop-filter:blur(5px);

    transition:.25s;

    z-index:1200;

}
.ss-bg-noise{

    position:absolute;

    inset:0;

    opacity:.025;

    background-image:

    radial-gradient(#fff 1px,transparent 1px);

    background-size:4px 4px;

}

.ss-bg-particles{

    position:absolute;

    inset:0;

    opacity:.14;

    background-image:

    radial-gradient(circle,#6FAFFF 1px,transparent 1.4px);

    background-size:180px 180px;

}

/*=========================================================
    MOBILE MENU
=========================================================*/

.ss-mobile-menu{

    position:fixed;

    top:0;

    right:-380px;

    width:min(380px,100%);

    height:100vh;

    display:flex;

    flex-direction:column;

    border-left:1px solid rgba(110,170,255,.08);

    background:

        linear-gradient(

            180deg,

            rgba(31,42,67,.98),

            rgba(18,25,40,.99)

        );

    box-shadow:

        -20px 0 50px rgba(0,0,0,.30);

    transition:right .28s;

    overflow:hidden;

    z-index:1201;

}


/*=========================================================
    MOBILE HEADER
=========================================================*/

.ss-mobile-head{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:14px;

    min-height:76px;

    padding:18px;

    border-bottom:1px solid rgba(255,255,255,.05);

}


/*=========================================================
    MOBILE BRAND
=========================================================*/

.ss-mobile-brand{

    flex:1;

    min-width:0;

}


/*=========================================================
    MOBILE BRAND LINK
=========================================================*/

.ss-mobile-brand-link{

    display:flex;

    align-items:center;

    gap:12px;

    text-decoration:none;

}


/*=========================================================
    MOBILE LOGO
=========================================================*/

.ss-mobile-logo{

    flex:0 0 auto;

}

.ss-mobile-logo img{

    display:block;

    width:auto;

    height:40px;

}


/*=========================================================
    MOBILE BRAND CONTENT
=========================================================*/

.ss-mobile-brand-content{

    display:flex;

    flex-direction:column;

    gap:2px;

    min-width:0;

}

.ss-mobile-brand-content strong{

    font-size:13px;

    font-weight:500;

    line-height:1.2;

    color:#FFFFFF;

}

.ss-mobile-brand-content span{

    font-size:9px;

    font-weight:400;

    text-transform:uppercase;

    letter-spacing:.5px;

    color:#8EA3BD;

}


/*=========================================================
    MENU CLOSE
=========================================================*/

.ss-menu-close{

    display:flex;

    align-items:center;

    justify-content:center;

    width:40px;

    height:40px;

    padding:0;

    border:1px solid rgba(110,170,255,.08);

    border-radius:12px;

    background:

        linear-gradient(

            180deg,

            rgba(34,46,72,.94),

            rgba(21,30,49,.98)

        );

    color:#D7E7FF;

    cursor:pointer;

    transition:.22s;

}

.ss-menu-close:hover{

    color:#FFFFFF;

    border-color:rgba(110,170,255,.20);

}


/*=========================================================
    MOBILE NAVIGATION
=========================================================*/

.ss-mobile-nav{

    flex:1;

    overflow-y:auto;

    padding:14px;

}


/*=========================================================
    MOBILE MENU LIST
=========================================================*/

.ss-mobile-list{

    margin:0;

    padding:0;

    list-style:none;

}


/*=========================================================
    MOBILE MENU ITEM
=========================================================*/

.ss-mobile-list>li{

    margin:0 0 6px;

}


/*=========================================================
    MOBILE MENU LINK
=========================================================*/

.ss-mobile-list a{

    display:flex;

    align-items:center;

    min-height:44px;

    padding:0 14px;

    border-radius:12px;

    text-decoration:none;

    font-size:11px;

    font-weight:500;

    color:#B7C7DB;

    transition:.2s;

}

.ss-mobile-list a:hover{

    color:#FFFFFF;

    background:rgba(255,255,255,.04);

}


/*=========================================================
    MOBILE SUPPORT
=========================================================*/

.ss-mobile-support{

    display:flex;

    flex-direction:column;

    gap:14px;

    margin:16px;

    padding:18px;

    border:1px solid rgba(110,170,255,.08);

    border-radius:18px;

    background:

        linear-gradient(

            180deg,

            rgba(34,46,72,.95),

            rgba(22,31,49,.98)

        );

}


/*=========================================================
    SUPPORT ICON
=========================================================*/

.ss-mobile-support-icon{

    display:flex;

    align-items:center;

    justify-content:center;

    width:48px;

    height:48px;

    border-radius:14px;

    background:rgba(77,149,255,.10);

    color:#69B5FF;

}


/*=========================================================
    SUPPORT CONTENT
=========================================================*/

.ss-mobile-support-content h3{

    margin:0 0 6px;

    font-size:12px;

    font-weight:500;

    color:#FFFFFF;

}

.ss-mobile-support-content p{

    margin:0;

    font-size:10px;

    line-height:1.7;

    color:#91A7C2;

}


/*=========================================================
    SUPPORT BUTTON
=========================================================*/

.ss-mobile-support-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    min-height:40px;

    border-radius:12px;

    text-decoration:none;

    font-size:11px;

    font-weight:500;

    color:#FFFFFF;

    background:

        linear-gradient(

            180deg,

            rgba(67,140,255,.22),

            rgba(41,95,205,.18)

        );

}


/*=========================================================
    MOBILE FOOTER
=========================================================*/

.ss-mobile-footer{

    padding:18px;

    border-top:1px solid rgba(255,255,255,.05);

}

.ss-mobile-footer-top{

    display:flex;

    flex-direction:column;

    gap:2px;

    margin-bottom:8px;

}

.ss-mobile-footer-top strong{

    font-size:11px;

    font-weight:500;

    color:#FFFFFF;

}

.ss-mobile-footer-top span{

    font-size:9px;

    color:#8EA3BD;

}

.ss-mobile-footer-bottom p{

    margin:0;

    font-size:9px;

    color:#7488A3;

}
/*=========================================================
    HEADER STICKY
=========================================================*/



.ss-header.scrolled .ss-header-row{

    background:

        linear-gradient(

            180deg,

            rgba(24,34,56,.92),

            rgba(16,23,39,.96)

        );

    border-color:rgba(112,168,255,.10);

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.04),

        0 18px 40px rgba(0,0,0,.24);

}


/*=========================================================
    SEARCH OPEN
=========================================================*/

body.ss-search-open{

    overflow:hidden;

}

body.ss-search-open .ss-search-overlay{

    opacity:1;

    visibility:visible;

}

body.ss-search-open .ss-search-modal{

    opacity:1;

    visibility:visible;

    transform:translate(-50%,0);

}


/*=========================================================
    MOBILE MENU OPEN
=========================================================*/

body.ss-menu-open{

    overflow:hidden;

}

body.ss-menu-open .ss-mobile-overlay{

    opacity:1;

    visibility:visible;

}

body.ss-menu-open .ss-mobile-menu{

    right:0;

}


/*=========================================================
    TABLET
=========================================================*/

@media (max-width:991px){

.ss-nav{

    display:none;

}

.ss-download-btn-header{

    display:none;

}

.ss-header-row{

    min-height:66px;

    padding:0 14px;

}

}


/*=========================================================
    MOBILE
=========================================================*/

@media (max-width:767px){

.ss-header-row{

    min-height:70px;

    gap:10px;

    padding:0 12px;


}

.ss-brand-logo img{

    height:44px;

}

.ss-brand-title{

    font-size:12px;

}

.ss-brand-subtitle{

    font-size:8px;

}

.ss-header-actions{

    gap:6px;

}

.ss-action-btn{

    width:38px;

    height:38px;

    border-radius:12px;

}

}


/*=========================================================
    SMALL MOBILE
=========================================================*/

@media (max-width:480px){

.ss-brand-subtitle{

    display:none;

}

.ss-header-row{

    min-height:65px;

}

.ss-brand-logo img{

    height:40px;

}

.ss-brand-title{

    font-size:11px;

}

.ss-action-btn{

    width:36px;

    height:36px;

}

}


/*=========================================================
    DESKTOP ONLY
=========================================================*/

@media (min-width:992px){

.ss-menu-toggle{

    display:none;

}

}


/*=========================================================
    ACCESSIBILITY
=========================================================*/

.ss-action-btn:focus-visible,

.ss-download-btn-header:focus-visible,

.ss-menu a:focus-visible,

.ss-mobile-list a:focus-visible{

    outline:2px solid rgba(103,179,255,.55);

    outline-offset:2px;

}


/*=========================================================
    REDUCED MOTION
=========================================================*/

@media (prefers-reduced-motion:reduce){

.ss-header,

.ss-header-row,

.ss-action-btn,

.ss-download-btn-header,

.ss-search-overlay,

.ss-search-modal,

.ss-mobile-overlay,

.ss-mobile-menu{

    transition:none;

}

}


/*=========================================================
    UTILITIES
=========================================================*/

.ss-nav,

.ss-brand,

.ss-header-actions{

    min-width:0;

}

.ss-brand-link,

.ss-download-btn-header,

.ss-action-btn{

    user-select:none;

    -webkit-user-select:none;

}

.ss-search-results{

    scrollbar-width:thin;

    scrollbar-color:rgba(255,255,255,.12) transparent;

}

.ss-search-results::-webkit-scrollbar{

    width:6px;

}

.ss-search-results::-webkit-scrollbar-thumb{

    background:rgba(255,255,255,.12);

    border-radius:20px;

}