@media (max-width: 768px) {
    body {
      font-size: 16px;
      /* padding: 0 2px; */
    }
    
    .container {
      flex-direction: column;
      align-items: center;
      text-align: center;         
      padding: 0 16px;
      }
    
  
    .interface{
         position: relative;
         padding: 0 10px;
    }
   .navbar-container {
    display: none;
  }

    .menu-icon{
        display: block;
        position: absolute;
        right: 20px;
        top: 20px;
        font-size: 2rem;
    }
  
    .content h1 {
      font-size: 28px;
    }
  
    .content p {
      font-size: 16px;
    }
    .shop-content{
      text-align: center;
    }
  
    .signup-btn {
      width: 100%;
      text-align: center;
    }
  
      .search-bar {
        width: 90%;
        margin: 1rem auto;
      }
    
      .mini-boxes {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.5rem;
      }
   
       .product-card {
        width: 100%;
        margin: 1rem auto;
      } 
      .product-box .card {
        width: 100%;
        background-color: #fff;
        border-radius: 15px;
        overflow: hidden;
        box-shadow: 0 0 15px rgba(0,0,0,0.1);
        transition: 0.3s;
      }
      .product-box .card img {
        width: 100%;
        height: auto;
        display: block;
        border-radius: 15px;
      }
      .btn-more {
        color: var(--text-color);
        padding: 10px 20px;
        border-radius: 30px;
        font-size: 1rem;
        border: none;
        cursor: pointer;
        transition: 0.3s;
        
      }   
      .services .big-box {
        flex-direction: column;
        align-items: center;
    }


    .services .big-box .flex-item .card img {
        height: 200px; 
    }
    
      .services .big-box .flex-item{
       flex: 1 1 100%; 
        width: 100%;  
         margin-bottom: 20px;
         position: relative;
         overflow: hidden;
         border-radius: 15px;
         box-shadow: 0 0 15px rgba(0,0,0,0.1);
         transition: 0.3s;
         display: flex;
         flex-direction: row;
         gap: 10px;
      }

      .services .big-box .flex-item .card{
        width:100%;
        background-color: #fff;
        border-radius: 15px;
        overflow: hidden;
        box-shadow: 0 0 15px rgba(0,0,0,0.1);
        transition: 0.3s;
      }

      .aboutus .big-box .left{
     width: 100%;
     height: auto;
     text-align: left;
      }
      .aboutus .big-box .right{
       display: none;
      }

      .team .cards .card {
        width: 45%; 
        height: 225px; 
    }
    .team .cards .card img {
        height: 100px;
    }
.team .cards .card-text .social-icons {
        justify-content: center;
      
    } 
    .team .cards .card-text {
      height: calc(100% - 100px); 
  }

    .blog{
      display: none;
    }
    .contact-main {
      flex-direction: column;
  }
  .left-form, .right-links {
      flex: 1 1 100%;
  }
  .left-form{
    text-align: left;
  }
  .flex-box {
    flex-direction: column;
}
.box-contact {
    flex: 1 1 40%;

}
  .newsletter .top-content {
      flex-direction: column;
      text-align: center;
  }
  .newsletter .top-content .right form {
      flex-direction: column;
      width: 100%;
  }
  .newsletter .top-content .right form input,
  .newsletter .top-content .right form button {
      width: 100%;
      margin-bottom: 10px;
  }
  .footer-container {
    flex-direction: column;
    text-align: center;
}

.footer-col {
    flex: 1 1 50%; 
    margin-bottom: 20px;
}

.footer-bottom {
    flex-direction: column;
    text-align: center;
}

.social-icons {
    justify-content: center;
}

    }

    @media (max-width: 1024px) {
    .team .cards .card {
        width: 45%;
    }
    .blog{
      display:none;
    }
}