.directions-section {
    background: #f4f4f4;
    padding: 60px 20px;
    color: #333;
  }
  
  .directions-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
  }
  
  .map-container {
    width: 50%;
    height: 100%;
    margin-right: 20px;
  }
  
  .directions-text {
    width: 40%;
  }
  
  .directions-text h3 {
    font-size: 1.8rem;
    color: #ff7a00;
    margin-bottom: 15px;
  }
  
  .directions-text p {
    font-size: 1rem;
    line-height: 1.6;
    color: #555;
  }
  
  @media (max-width: 768px) {
    .directions-content {
      flex-direction: column;
      align-items: center;
    }
  
    .map-container, .directions-text {
      width: 100%;
      margin-bottom: 20px;
    }

  }