```css id="nk39p4"
/* =========================================
   SERVICE BHAIYA MAIN CSS
========================================= */

body{

  margin:0;

  font-family:Arial,sans-serif;

  background:#f8fafc;

  color:#111827;

}

/* =========================================
   SIDEBAR
========================================= */

.sidebar{

  position:fixed;

  left:0;

  top:0;

  width:260px;

  height:100vh;

  background:#dc2626;

  color:#fff;

  padding:30px 20px;

  overflow:auto;

}

.sidebar h2{

  margin-bottom:30px;

}

.sidebar a{

  display:block;

  padding:14px 16px;

  margin-bottom:10px;

  border-radius:12px;

  color:#fff;

  text-decoration:none;

}

.sidebar a:hover{

  background:rgba(255,255,255,.12);

}

/* =========================================
   MAIN
========================================= */

.main{

  margin-left:260px;

}

/* =========================================
   HERO
========================================= */

.hero{

  min-height:100vh;

  background:
  linear-gradient(
    135deg,
    #dc2626,
    #7f1d1d
  );

  color:#fff;

  padding:100px 50px;

  display:flex;

  align-items:center;

}

.hero-content h1{

  font-size:70px;

  margin-bottom:20px;

}

.hero-content p{

  font-size:22px;

  max-width:700px;

  line-height:1.8;

}

/* =========================================
   BUTTONS
========================================= */

.hero-buttons{

  margin-top:30px;

}

.btn{

  display:inline-block;

  padding:16px 24px;

  border-radius:14px;

  margin-right:14px;

  text-decoration:none;

  font-weight:bold;

}

.btn-white{

  background:#fff;

  color:#dc2626;

}

.btn-outline{

  border:1px solid #fff;

  color:#fff;

}

/* =========================================
   CARDS
========================================= */

.grid{

  display:grid;

  grid-template-columns:
  repeat(auto-fit,minmax(280px,1fr));

  gap:30px;

  padding:80px 50px;

}

.card{

  background:#fff;

  padding:30px;

  border-radius:24px;

  box-shadow:
  0 10px 30px rgba(0,0,0,.08);

}

/* =========================================
   FOOTER
========================================= */

.footer{

  background:#111827;

  color:#fff;

  padding:50px;

}

/* =========================================
   MOBILE
========================================= */

@media(max-width:992px){

  .sidebar{

    transform:translateX(-100%);

    transition:.3s;

  }

  .sidebar.active{

    transform:translateX(0);

  }

  .main{

    margin-left:0;

  }

  .hero{

    padding:60px 24px;

  }

  .hero-content h1{

    font-size:42px;

  }

}
```
