@font-face {
  font-family: 'BlairITCStdRegular'; /* The name you want to use for the font */
  src: url('Fonts/Blair\ ITC\ Std\ Regular.otf') format('opentype'); /* Adjust the path based on where you placed your font file */
  font-weight: normal;
  font-style: normal;
}

.cleaning-services {
    display: flex;
    flex-wrap: wrap;
    gap: 80px;
    justify-content: center;
    margin: 50px 0;
  }
  
  .service-box {
    background-color: #f7f7f7;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    max-width: 450px;
    padding: 20px;
    width: 100%;
    position: relative;
    transition: transform 0.3s, box-shadow 0.3s;
    text-decoration: none;
  }
  
  @media screen and (max-width: 768px){
    .service-box{
      max-width: 500px;
    }

    .service-list.b{
      font-size: 12px;
    }
    

  }

  .service-box2 {
    background-color: #f7f7f7;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    max-width: 450px;
    padding: 20px;
    width: 100%;
    position: relative;
    transition: transform 0.3s, box-shadow 0.3s;
  }
  
  .service-box li{
    text-align: left;
  }
  /* .service-box2:hover {
    
  }
   */
  
  .service-box:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
  }
  
  .service-info h3 {
    font-size: 1.25em;
    margin-bottom: 10px;
    font-family: 'BlairITCStdRegular', sans-serif;
  }
  
  .price {
    font-family: "Titillium Web";
    color: #2a9d8f;
    font-size: 1.2em;
    margin: 5px 0;
  }
  
  .description {
    font-family: "Titillium Web";
    font-size: 0.9em;
    margin-bottom: 15px;
  }
  
  .service-box2 .service-info h3 {
    font-size: 1.5em;
    margin-bottom: 10px;
    text-align: center;
  
  }
  
  .service-box2 .description {
    font-size: 0.9em;
    margin-bottom: 15px;
    text-align: center;
  }
  
  .service-list {
    font-family: "Titillium Web";
    font-weight: 600;
    list-style: none;
    padding: 0;
    margin-top: 15px;
    border-top: 1px solid #ddd;
    padding-top: 15px;
  }

  .service-list.b{
    column-count: 2;
  }
  
  .service-list li {
    margin-bottom: 10px;
    font-size: 0.9em;
    display: flex;
    align-items: center; /* Center the text vertically with the icon */
  }
  
  .service-icon {
    width: 40px;  /* Set the width of the icon */
    height: 40px; /* Set the height of the icon */
    margin-right: 10px; /* Space between icon and text */
  }