.site-header{

position:fixed;

top:0;

left:0;

width:100%;

z-index:1000;

padding:24px 0;

background:rgba(7,26,18,.72);

backdrop-filter:blur(18px);

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

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

transition:.35s;

}

.navbar{

display:flex;

justify-content:space-between;

align-items:center;

}

.logo img{

    height:22px;

    width:22px;

    display:block;

}

.main-nav .menu{

display:flex;

gap:40px;

list-style:none;

margin:0;

padding:0;

}

.main-nav a{

    position:relative;

    text-decoration:none;

    color:#FFFFFF;

    font-size:16px;

    font-weight:600;

    transition:color .3s ease;

}
.main-nav a:visited{

    color:#FFFFFF;

}

}

.main-nav a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:0;

    height:2px;

    background:#22C36A;

    transition:width .3s ease;

}

.main-nav a:hover::after{

    width:100%;

}

.header-cta{

padding:15px 30px;

background:#1FA971;

border-radius:14px;

text-decoration:none;

font-weight:700;

color:#fff;

transition:.3s;

}

.header-cta:hover{

transform:translateY(-3px);

box-shadow:0 12px 28px rgba(31,169,113,.35);

}

.menu-toggle{

display:none;

background:none;

border:none;

color:white;

font-size:34px;

cursor:pointer;

}

@media (max-width:768px){

.menu-toggle{

    display:block;

    z-index:1002;

}

/* Hide menu */

.main-nav{

    position:absolute;
    text-decoration:none;

    color:#FFFFFF;

    font-weight:600;

    font-size:16px;

    transition:color .3s ease;

    top:100%;

    left:0;

    width:100%;

    background:#071A12;

    display:none;

    padding:25px 0;

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

}

/* Show menu */

.main-nav.active{

    display:block;

}

/* Vertical menu */

.main-nav .menu{

    flex-direction:column;

    gap:25px;

    align-items:center;

}

/* Hide desktop CTA */

.header-cta{

    display:none;

}

}

.custom-logo{

    height:34px;

    width:auto;

}
.main-nav a:hover{

    color:#58F0A6;

}