@media(max-width:991px) {

  section {

    padding: 80px 0;

  }

}

@media(max-width:768px) {

  section {

    padding: 70px 0;

  }

}

@media(max-width:576px) {

  section {

    padding: 60px 0;

  }

}

/*==============================
        MOBILE NAVBAR
===============================*/

@media(max-width:991px) {

  .custom-navbar {

    background: #111;

    padding: 14px 0;

  }

  .navbar-collapse {

    margin-top: 20px;

    background: #181818;

    border-radius: 18px;

    padding: 25px;

  }

  .navbar-nav {

    gap: 5px;

    align-items: flex-start !important;

  }

  .reserve-btn {

    margin-top: 15px;

    width: 100%;

    text-align: center;

  }

}

/*==================================
        HERO RESPONSIVE
===================================*/

@media(max-width:991px) {

  .hero-section {

    padding-top: 120px;

    text-align: center;

  }

  .hero-content h1 {

    font-size: 52px;

  }

  .hero-content p {

    margin: auto auto 40px;

  }

  .hero-buttons {

    justify-content: center;

    flex-wrap: wrap;

  }

  .hero-rating {

    margin-bottom: 60px;

  }

  .floating-card {

    display: none;

  }

}

@media(max-width:576px) {

  .hero-content h1 {

    font-size: 40px;

  }

  .hero-btn,

  .hero-btn-outline {

    width: 100%;

  }

  .hero-image img {

    max-width: 320px;

  }

}

@media(max-width:991px) {

  .bento-grid {

    grid-template-columns: 1fr;

  }

  .large {

    grid-row: auto;

    min-height: auto;

  }

}

@media(max-width:576px) {

  .section-heading h2 {

    font-size: 38px;

  }

  .bento-card {

    padding: 30px;

  }

}

@media(max-width:991px) {

  .about-content {

    margin-top: 30px;

    text-align: center;

  }

  .about-features {

    grid-template-columns: 1fr;

  }

  .experience-card {

    right: 20px;

    bottom: 20px;

  }

  .about-content h2 {

    font-size: 42px;

  }

}

@media(max-width:576px) {

  .about-content h2 {

    font-size: 34px;

  }

  .experience-card {

    min-width: 140px;

    padding: 18px;

  }

  .experience-card h2 {

    font-size: 36px;

  }

}

@media(max-width:768px) {

  .menu-image img {

    height: 220px;

  }

  .menu-top {

    flex-direction: column;

    align-items: flex-start;

    gap: 10px;

  }

}

@media(max-width:991px) {

  .signature-card,
  .signature-card.reverse {

    flex-direction: column;

  }

  .signature-content {

    text-align: center;

  }

  .signature-content h3 {

    font-size: 38px;

  }

}

@media (max-width:576px) {

  .gallery-grid {

    display: grid;

    grid-template-columns: 1fr;

    grid-auto-rows: auto;

    gap: 20px;

  }

  .gallery-item,
  .gallery-item.large,
  .gallery-item.wide {

    grid-column: auto;

    grid-row: auto;

    height: 260px;

  }

  .gallery-item img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

  }

}

@media(max-width:991px) {

  .reservation-content {

    text-align: center;

    margin-bottom: 40px;

  }

  .reservation-content h2 {

    font-size: 42px;

  }

  .reservation-info {

    align-items: center;

  }

}

@media(max-width:576px) {

  .reservation-card {

    padding: 25px;

  }

  .reservation-content h2 {

    font-size: 34px;

  }

}

@media(max-width:768px) {

  .custom-faq .accordion-button {

    font-size: 16px;

    padding: 20px;

  }

}

@media(max-width:768px) {

  .copyright {

    flex-direction: column;

    gap: 15px;

    text-align: center;

  }

}

@media(max-width:768px) {

  .map-wrapper iframe {

    height: 350px;

  }

}