*{
      margin:0;
      padding:0;
      box-sizing:border-box;
      font-family:'Outfit',sans-serif;
    }

    body{
      background:#f8f9fc;
      color:#0f1e36;
      overflow-x:hidden;
    }

    a{
      text-decoration:none;
    }

    .container{
      width:90%;
      max-width:1200px;
      margin:auto;
    }

    /* ================= HEADER ================= */
header {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    background:#000;
    backdrop-filter: blur(10px);
    border-bottom: 1vw solid rgb(255 108 4);
}

    .navbar{
      max-width:1300px;
      margin:auto;
      padding:18px 25px;
      display:flex;
      justify-content:space-between;
      align-items:center;
    }

    .logo{
      font-size:34px;
      font-weight:700;
      letter-spacing:2px;
      width: 19%;
      line-height:0px;
    }
    .logo img{
    width:100%;
    }    

    .nav-links{
      display:flex;
      gap:35px;
    }

    .nav-links a{
    color:#fff;
      font-size:18px;
      font-weight:700;
      position:relative;
      transition:0.3s;
    }

    .nav-links a::after{
      content:'';
      position:absolute;
      left:0;
      bottom:-6px;
      width:0%;
      height:1px;
      background:#000;
      transition:0.3s;
    }

    .nav-links a:hover::after{
      width:100%;
    }
    .btn{
display: inline-block;
    background: #ffc107;
    color: #000;
    text-decoration: none;
    padding: 16px 35px;
    border-radius: 8px;
    font-weight: bold;
    transition: .3s;
    }

    .btn:hover{
      transform:translateY(-3px);
      color:#fff;
    }

    .menu-btn{
      display:none;
      font-size:32px;
      color:#fff;
      cursor:pointer;
    }
    
    
        @media(max-width:991px){



      .nav-links{
        position:absolute;
        top:20vw;
        left:-100%;
        width:100%;
		height:100vh;
        background:#fff;
        flex-direction:column;
        padding:30px 0;
        transition:0.4s;
      }

      .nav-links.active{
        left:0;
      }

      .menu-btn{
        display:block;
      }

      .desktop-btn{
        display:none;
      }
      .service-icon img {
    width: 66%;
}
    }

    @media(max-width:600px){
        .container{
        
            width:100%!important;
            margin:auto!important;
    .logo{
      font-size:34px;
      font-weight:700;
      letter-spacing:2px;
      width: 41%;
      line-height:0px;
    }
    .logo img{
    width:100%;
    }    

    .nav-links{
      display:flex;
      gap:35px;
    }

    .nav-links a{
    color:#000;
      font-size:18px;
      text-align:center;
      font-weight:700;
      position:relative;
      transition:0.3s;
    }

    .nav-links a::after{
      content:'';
      position:absolute;
      left:0;
      bottom:-6px;
      width:0%;
      height:1px;
      background:#000;
      transition:0.3s;
    }

    .nav-links a:hover::after{
      width:100%;
    }      
	  .contbtn{
      padding:14px 28px;
      border-radius:40px;
      color:black;
      display:inline-block;
      font-weight:600;
      transition:0.3s;
    }

    .contbtn:hover{
      transform:translateY(-3px);
    }
          
    .btn {
        display: inline-block;
        background: #ffc107;
        color: #000;
        text-decoration: none;
        padding: 2vw 4vw;
        border-radius: 8px;
        font-weight: bold;
        transition: .3s;
    }
    
 .service-icon img {
    width: 66%;
}   
    <!---------indexpage---------------->
    .serboxcard h3 {
    margin-bottom: 0vw;
    font-size: 6vw;
    background: #fff;
    padding: 1vw 1vw;
    border-radius: 5vw;
}
    }