/* Tablet and smaller desktop screens */
@media (width < 1024px) {
    .about__content {
      grid-template-columns: 1fr;
    }
  
    .contact__content {
      grid-template-columns: 1fr;
    }
  
    .footer__content {
      grid-template-columns: 1fr;
      gap: 2rem;
    }
  }
  
  /* Tablet screens */
  @media (width < 900px) {
    .booking__container form {
      grid-template-columns: repeat(2, 1fr);
    }
  
    .popular__grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 1rem;
    }
  
    .client__grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 1rem;
    }
  
    .footer__container {
      grid-template-columns: repeat(2, 1fr);
    }
  
    .room__grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 1.5rem;
      padding: 1.5rem;
    }
  }
  
  /* Mobile screens */
  @media (width < 768px) {
    .nav__links {
      display: none;
    }
  
    .nav__links.active {
      display: flex;
      flex-direction: column;
      position: absolute;
      top: 70px; /* Adjust this value based on your navbar height */
      left: 0;
      right: 0;
      background-color: rgb(255, 255, 255);
      padding: 2rem;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    }
  
    .mobile__menu {
      display: block;
      color: rgb(255, 255, 255);
    }
  }
  
    .header__content h1 {
      font-size: 3rem;
      line-height: 3.5rem;
    }
  
    .about__features {
      grid-template-columns: 1fr;
    }
  
    .footer__links {
      grid-template-columns: 1fr;
    }
  
  
  /* Small mobile screens */
  @media (width < 600px) {
    .nav__links {
      display: none;
    }
  
    .header__container {
      padding-bottom: 25rem;

    }
/*   
    .booking__container {
      flex-direction: column;
      bottom: -25rem;
      color: rgb(242, 137, 0);
    } */
  
    .booking__container form {
      grid-template-columns: repeat(1, 1fr);
    }
  
    .popular__grid {
      grid-template-columns: repeat(1, 1fr);
    }
  
    .client__grid {
      grid-template-columns: repeat(1, 1fr);
    }
  
    .footer__container {
      gap: 2rem;
    }
  
    .room__grid {
      grid-template-columns: 1fr;
      gap: 1rem;
      padding: 1rem;
    }
  
    .about__content,
    .contact__content {
      padding: 1rem;
    }
  }
  
  /* Extra small mobile screens */
  @media (width < 480px) {
    .booking__container {
      padding: 1.5rem;
    }
  
    .room__info {
      flex-direction: column;
      gap: 0.5rem;
    }
  
    .more__btn {
      padding: 10px 25px;
      font-size: 1rem;
    }
    
    .more__btn i {
      font-size: 1rem;
    }
  }