:root{

--primary:#005b81;
--secondary:#ed7615;

--text:#1f2937;

--gray:#6b7280;

--light:#ffffff;

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

}

*{

margin:0;
padding:0;
box-sizing:border-box;

}

body{

font-family:'Segoe UI',sans-serif;

}

.navbar{

position:fixed;

top:0;

left:0;

width:100%;

background:#fff;

z-index:999;

transition:.35s;

}

.navbar.scrolled{

box-shadow:var(--shadow);

backdrop-filter:blur(12px);

}


.logo img{

height:45px;

display:block;

}

.nav-links{

display:flex;

gap:35px;

align-items:center;

}

.nav-links a{

text-decoration:none;

color:var(--text);

font-size:15px;

font-weight:600;

position:relative;

transition:.3s;

}

.nav-links a::after{

content:"";

position:absolute;

left:0;

bottom:-7px;

width:0;

height:3px;

background:var(--secondary);

transition:.35s;

border-radius:50px;

}

.nav-links a:hover{

color:var(--primary);


}

.nav-links a:hover::after{

width:100%;

}

.navbar-right{

display:flex;

align-items:center;

gap:20px;

}

.btn-demo{

padding:15px 28px;

background:var(--secondary);

color:#fff;

font-weight:700;

text-decoration:none;

border-radius:60px;

transition:.35s;

box-shadow:0 12px 25px rgba(237,118,21,.30);

}

.btn-demo:hover{

background:var(--primary);

transform:translateY(-2px);

box-shadow:0 18px 35px rgba(0,91,129,.35);

}

.menu-btn{

display:none;

border:none;

background:none;

font-size:32px;

cursor:pointer;

color:var(--primary);

}

@media(max-width:992px){

.nav-links{

position:fixed;

top:85px;

left:-100%;

width:100%;

background:white;

display:flex;

flex-direction:column;

padding:40px;

gap:25px;

transition:.35s;

box-shadow:var(--shadow);

}

.nav-links.active{
font-weight: bold;
left:0;

}

.menu-btn{

display:block;

}

.btn-demo{

display:none;

}

}