/* Original CSS styles */

/* Add responsive styles */
@media only screen and (max-width: 768px) {
    .navbar {
      flex-direction: column;
      height: auto;
    }
  
    .nav-link {
      flex-direction: column;
      align-items: center;
      gap: 10px;
    }
  
    .nav-link > li > a {
      padding: 10px;
    }
  
    .container {
      padding: 0 20px;
    }
  
    .banner > .banner-img {
      height: auto;
    }
  
    .about-us {
      flex-direction: column;
      padding: 40px 0;
    }
  
    .about-project,
    .about-text {
      width: 100%;
      margin: 20px 0;
    }
  
    .highlights-text {
      flex-direction: column;
      align-items: center;
      gap: 20px;
    }
  
    .amenities,
    .about-developer,
    .gallery,
    #footer {
        padding: 60px 0; /* Adjusted padding for smaller screens */
      }
      
      .theme-padding {
        padding: 0 20px; /* Adjusted padding for smaller screens */
      }
      
      .footer-cols {
        flex-wrap: wrap; /* Allow columns to wrap on smaller screens */
        justify-content: center;
      }
      
      .column {
        color: white;
        padding: 0 12px;
        width: 100%; /* Make columns full width on smaller screens */
        font-size: 16px;
        text-align: center;
        margin-bottom: 20px;
      }
      
      .column div h4 {
        margin: 0 0 10px;
      }
      
      .column a,
      .column p {
        color: rgb(182, 179, 179);
      }
      
      .footer-col-contact a {
        display: block;
        text-decoration: none;
        transition: all 0.5s ease-in-out;
      }
      
      .footer-col-contact a:hover {
        color: rgb(153, 94, 54);
      }
      
      .footer-col-qr-detail {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 15px;
      }
      
      .disclaimer {
        color: white;
        margin: 20px 0; /* Adjusted margin for smaller screens */
        text-align: center;
      }
      
      .disclaimer p {
        color: rgb(182, 179, 179);
      }
      
      .copyright-bar {
        display: flex;
        flex-direction: column; /* Stack items vertically on smaller screens */
        justify-content: center;
        color: rgb(182, 179, 179);
        margin-top: 20px;
        text-align: center;
      }
      
      .copyright-bar ul {
        list-style: none;
      }
      
      .copyright-bar a {
        text-decoration: none;
        color: rgb(182, 179, 179);
      }
  }