:root{
     --primary-colo: #eee;
     --secondary-color: #bbb;
     --dark-color: #333;
     --black: #000;
}
nav{
.container {
     padding: 0px;
 }
}
.container{
     p {
          margin: 0 auto;
          margin-top: 1rem;
          margin-bottom: 1.5rem;
          text-align: center;
          font-size: 1rem;
          width: 70%;
      }
}
 h1{
     color: #fff;
     text-align: center;
}
 h2 {
     color: #fff;
     text-align: center;
     font-weight: 600;
     margin-bottom: 20px;
 }
 .service-card {
     background: var(--dark-color);
     /* display: grid; */
     /* grid-template-rows: 1fr 1fr 1fr; */
      /* align-items: center; */
      background: #2c2c8b;
      background: linear-gradient(145deg,#000086, #121262, #010152, #1b1b74);
      border: 5px solid #0a66c263;
      border-radius: 20px;
     /* padding: 20px; */
     padding: 2rem 4rem;
 h3 {
     color: var(--secondary-color)!important;
     
 }
 ul {
     list-style: none;
     padding: 0;
 }
 li {
     margin: 10px 0;
     color: #fff!important;
 }
 .btn {
     background-color: var(--primary-color);
     color: #fff!important;
     border: none;
     margin-top: 10px;
 }
 .btn:hover {
     background-color: #0000ff55;
 }
}
 .modal-content {
     background: var(--dark-color);
     color: var(--secondary-color);
     p {
          text-align: center;
          font-size: 0.8rem;
          width: 100%;
     }
     .btn {
          background-color: var(--primary-color);
          color: var(--secondary-color);
          border: none;
          margin-top: 10px;
      }
      .btn:hover {
          background-color: #0000ff55;
      }
 }
 .modal-header {
     border-bottom: 1px solid var(--primary-color);
 }
 .modal-footer {
     border-top: 1px solid var(--primary-color);
 }
 .cas{
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 20px;
 }
 section{
     padding: 2vw 0!important;
 }
 section::after{
     z-index: -3;
 }
@media (max-width: 800px){
     p{
          width: 100%;
     }
     .cas{
          grid-template-columns: 1fr;
      }
}
@media (max-width: 450px){
     .service-card {
          padding: 20px;
     }
}