.navbar{

    width:100%;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:15px 25px;

    background:#111;

    color:white;

    position:sticky;

    top:0;

    z-index:1000;

}

.logo{

    font-size:35px;

    font-weight:700;

}

.menu-btn{

    font-size:30px;

    cursor:pointer;

}

.search-box{

    width:40%;

}

.search-box input{

    width:100%;

    padding:12px 18px;

    border-radius:30px;

    border:none;

    outline:none;

    font-size:16px;

}
/* ================= HERO SECTION ================= */

.hero{

    width:100%;

    min-height:85vh;

    display:flex;

    justify-content:center;

    align-items:center;

    text-align:center;

    background:#ffffff;

    padding:40px 20px;

}

.hero-content{

    max-width:900px;

}

.hero h1{

    font-size:70px;

    font-weight:800;

    color:#111111;

    line-height:1.1;

    margin-bottom:20px;

}

.hero p{

    font-size:24px;

    color:#666666;

    margin-bottom:35px;

}

.hero-features{

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:15px;

    margin-bottom:40px;

}

.hero-features span{

    background:#f5f5f5;

    padding:12px 20px;

    border-radius:30px;

    font-size:16px;

    font-weight:500;

    border:1px solid #e5e5e5;

}

.hero-btn{

    display:inline-block;

    padding:15px 40px;

    background:#111111;

    color:#ffffff;

    border-radius:50px;

    text-decoration:none;

    font-size:18px;

    font-weight:600;

    transition:.3s;

}

.hero-btn:hover{

    background:#333333;

}