.elementor-543 .elementor-element.elementor-element-6294ae9{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-543 .elementor-element.elementor-element-4a6582c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-4a6582c *//* =====================================================
   RANK LOGICS HEADER FINAL CSS PART 1
   TOP ATTACHED + WHITE HEADER + SCROLL EFFECT
===================================================== */


/* ===============================
   GLOBAL
================================ */


html,
body{

    overflow-x:hidden;

}


.rank-header,
.rank-header *{

    box-sizing:border-box;

}





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


.rank-header{


    position:fixed !important;


    top:0 !important;


    left:0 !important;


    right:0 !important;



    width:100% !important;



    margin:0 !important;



    padding:0 !important;



    z-index:999999 !important;



    background:transparent;



    transition:

    background .35s ease,

    backdrop-filter .35s ease;



}







body.admin-bar .rank-header{

    top:32px !important;

}







/* ===============================
   OUTER SCROLL EFFECT
================================ */


.rank-header.scrolled{


    background:rgba(242,243,255,0.55) !important;



    backdrop-filter:blur(12px);



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



    box-shadow:


    0 12px 35px rgba(36,23,255,0.12);



}







/* ===============================
   INNER HEADER BOX
================================ */


.rank-header-inner{


    width:min(1500px,85%);



    min-height:92px;



    margin:0 auto !important;



    padding:12px 22px;



    display:grid;



    grid-template-columns:

    minmax(0,1fr)

    auto

    minmax(0,1fr);



    align-items:center;



    gap:22px;



    position:relative;



    isolation:isolate;



}







/* ===============================
   WHITE BOX NORMAL STATE
================================ */


.rank-header-inner::before{


    content:"";



    position:absolute;



    inset:0;



    background:#ffffff;



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



    border-radius:10px;



    box-shadow:


    0 12px 35px rgba(0,0,0,.15);



    z-index:-1;



    transition:

    background .35s ease,

    border-color .35s ease,

    box-shadow .35s ease;



}







/* ===============================
   WHITE BOX SCROLL STATE
================================ */


.rank-header.scrolled 
.rank-header-inner::before{


    background:rgba(242,243,255,0.92);



    border-color:rgba(36,23,255,.18);



    box-shadow:


    0 18px 55px rgba(36,23,255,.22);



}







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


.rank-logo-box{


    display:flex;



    align-items:center;



}



.rank-logo{


    width:200px !important;



    height:auto;



}







/* ===============================
   FONT
================================ */


.rank-nav,
.rank-nav-link,
.rank-header-btn,
.mega-card-head h3{


    font-family:"Syne",sans-serif !important;



}







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


.rank-nav{


    display:flex;



    align-items:center;



    justify-content:center;



    gap:12px;



}






.rank-nav-link{


    color:#050516 !important;



    font-size:16px;



    font-weight:600;



    padding:13px 18px;



    border-radius:10px;



    display:flex;



    align-items:center;



    justify-content:center;



    gap:8px;



    transition:.25s ease;



}





.rank-nav-link:hover,
.rank-nav-link.active{


    color:#2417ff !important;



    background:rgba(36,23,255,.08);



}






.dropdown-arrow{


    display:flex;



    align-items:center;



    justify-content:center;



    font-size:14px;



}







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


.rank-header-btn{


    justify-self:end;



    display:flex;



    align-items:center;



    justify-content:center;



    gap:14px;



    padding:5px 28px 5px 14px;



    min-height:64px;



    border-radius:12px;



    background:#2417ff;



    color:#fff !important;



    font-size:17px;



    font-weight:700;



    text-decoration:none !important;



    transition:.3s ease;



}





.rank-header-btn:hover{


    transform:translateY(-2px);



}





.header-btn-icon{


    width:46px;



    height:46px;



    background:#fff;



    color:#2417ff;



    border-radius:50%;



    display:flex;



    align-items:center;



    justify-content:center;



    font-size:23px;



}

/* =====================================================
   RANK LOGICS HEADER FINAL CSS PART 2
   Dropdown + Responsive + Elementor Fixes
===================================================== */


/* ===============================
   SERVICES DROPDOWN
================================ */


.services-menu{

    position:static;

}



.services-menu::after{

    content:"";

    position:absolute;

    top:100%;

    left:0;

    width:100%;

    height:35px;

}





.mega-dropdown{


    position:absolute;


    top:calc(100% + 10px);


    left:0;


    right:0;



    background:#f7f9ff;



    border:1px solid #e2e6ff;



    border-radius:22px;



    padding:20px;



    box-shadow:



    0 28px 80px rgba(8,5,34,.18);



    opacity:0;



    visibility:hidden;



    pointer-events:none;



    transform:translateY(12px);



    transition:.25s ease;



}






.services-menu:hover .mega-dropdown,
.mega-dropdown:hover{


    opacity:1;


    visibility:visible;


    pointer-events:auto;


    transform:translateY(0);


}







/* ===============================
   DROPDOWN GRID
================================ */


.mega-dropdown-grid{


    display:grid;



    grid-template-columns:repeat(4,1fr);



    gap:16px;



}







/* ===============================
   SERVICE CARDS
================================ */


.mega-service-card{


    background:#fff;



    border:1px solid #e8e9f8;



    border-radius:18px;



    padding:18px 22px;



    min-height:105px;



    display:flex;



    align-items:center;



    text-decoration:none!important;



    transition:.25s ease;



}







.mega-service-card:hover{


    transform:translateY(-6px);



    border-color:rgba(36,23,255,.45);



    box-shadow:



    0 18px 45px rgba(36,23,255,.18),



    0 8px 20px rgba(36,23,255,.12);



}







.mega-card-head{


    width:100%;



    display:flex;



    align-items:center;



    justify-content:space-between;



    gap:15px;



}





.mega-card-head h3{


    margin:0;



    color:#050516;



    font-size:20px;



    font-weight:500;



    line-height:1.2;



}







/* ===============================
   ICONS
================================ */


.mega-icon{


    width:40px;



    height:40px;



    flex-shrink:0;



    border-radius:12px;



    background:#ebe8ff;



    display:flex;



    align-items:center;



    justify-content:center;



}





.mega-icon svg{


    width:21px;



    height:21px;



    fill:#2417ff;



}







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


.menu-toggle{


    display:none;



}







@media(max-width:980px){



.rank-header{


    padding-top:0 !important;



}





.rank-header-inner{


    width:92%;



    display:flex;



    flex-wrap:wrap;



}





.menu-toggle{


    display:block;



    margin-left:auto;



}





.rank-nav{


    display:none;



    width:100%;



    flex-direction:column;



}





.rank-nav.show{


    display:flex;



}






.mega-dropdown{


    position:static;



    display:none;



    opacity:1;



    visibility:visible;



}





.services-menu.open .mega-dropdown{


    display:block;



}






.mega-dropdown-grid{


    grid-template-columns:1fr 1fr;



}



}







@media(max-width:650px){



.mega-dropdown-grid{


    grid-template-columns:1fr;



}





.rank-header-btn{


    display:none;



}



}








/* ==========================================
   ELEMENTOR / WORDPRESS FIXES
========================================== */


.rank-header{


    margin-top:0 !important;



}





.rank-header-inner{


    margin-top:0 !important;



}







.elementor-location-header,
.elementor-location-header > div,
header.elementor-header,
.site-header,
.wp-site-blocks header{


    margin-top:0 !important;



    padding-top:0 !important;



}







html,
body{


    margin:0 !important;



    padding:0 !important;



}







body > #page,
.site,
.site-content,
#content,
.elementor,
.elementor-section-wrap{


    margin-top:0 !important;



    padding-top:0 !important;



}







.elementor-location-header{


    position:absolute !important;



    top:0 !important;



    left:0 !important;



    width:100% !important;



    height:0 !important;



    min-height:0 !important;



    margin:0 !important;



    padding:0 !important;



    overflow:visible !important;



    background:transparent !important;



    z-index:999999 !important;



}







.elementor-location-header > .elementor-element,
.elementor-location-header > .e-con,
.elementor-location-header > section{


    margin-top:0 !important;



    padding-top:0 !important;



    background:transparent !important;



}







/* Final fixed header override */

.rank-header{


    position:fixed !important;



    top:0 !important;



    left:0 !important;



    right:0 !important;



    width:100% !important;



    margin:0 !important;



    padding:0 !important;



    background:transparent !important;



    z-index:999999 !important;



}







.rank-header-inner{


    margin:0 auto !important;



}







main,
.site-main,
.site-content,
#content,
.entry-content{


    margin-top:0 !important;



    padding-top:0 !important;



}







body.admin-bar .rank-header{


    top:32px !important;



}







@media(max-width:782px){


body.admin-bar .rank-header{


    top:46px !important;



}


}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-6294ae9 *//* =====================================
   TRANSPARENT OUTER HEADER SCROLL EFFECT
===================================== */


.rank-header.scrolled{

    background:rgba(242,243,255,0.55) !important;

    backdrop-filter:blur(12px);

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

    box-shadow:
    0 12px 35px rgba(36,23,255,0.12);

}/* End custom CSS */