/* ==========================
   NAVBAR
========================== */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{

font-family:'Inter',sans-serif;
background:#f8fafc;

}

a{

text-decoration:none;

}

ul{

list-style:none;

}

.container{

width:90%;
max-width:1400px;
margin:auto;

}

/* Header */

.header{

position:fixed;

top:0;

left:0;

width:100%;

background:#fff;

z-index:9999;

box-shadow:0 10px 30px rgba(0,0,0,.06);

}

.header .container{

display:flex;

justify-content:space-between;

align-items:center;

height:85px;

}

/* Logo */

.logo a{

display:flex;

align-items:center;

gap:12px;

}

.logo img{

width:55px;

}

.logo span{

font-size:28px;

font-weight:700;

font-family:Poppins;

color:#0F4C81;

}

/* Nav */

.nav-links{

display:flex;

gap:35px;

}

.nav-links li a{

font-size:16px;

font-weight:600;

color:#222;

transition:.3s;

position:relative;

}

.nav-links li a:hover{

color:#ff6600;

}

.nav-links li a.active{

color:#ff6600;

}

.nav-links li a::after{

content:"";

position:absolute;

bottom:-8px;

left:0;

width:0;

height:3px;

background:#ff6600;

transition:.3s;

border-radius:30px;

}

.nav-links li a:hover::after{

width:100%;

}

/* Right */

.header-right{

display:flex;

align-items:center;

gap:20px;

}

.login-btn{

background:#ff6600;

color:#fff;

padding:13px 28px;

border-radius:50px;

font-weight:600;

transition:.3s;

}

.login-btn:hover{

background:#0F4C81;

}

.menu-btn{

display:none;

font-size:28px;

cursor:pointer;

}

/* Mobile */

@media(max-width:991px){

.navbar{

position:fixed;

top:85px;

left:-100%;

width:100%;

background:#fff;

transition:.4s;

box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.navbar.active{

left:0;

}

.nav-links{

flex-direction:column;

padding:40px;

gap:30px;

}

.menu-btn{

display:block;

}

.login-btn{

display:none;

}

}