@media (max-width: 1100px) {
  .feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .menu-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gallery-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: 155px;
  }

  .gallery-item:nth-child(1),
  .gallery-item:nth-child(2),
  .gallery-item:nth-child(3),
  .gallery-item:nth-child(4),
  .gallery-item:nth-child(5),
  .gallery-item:nth-child(6) {
    grid-column: span 1;
    grid-row: span 1;
  }
}

@media (max-width: 820px) {
  .nav-wrap {
    grid-template-columns: auto auto;
    grid-template-areas:
      "brand toggle"
      "menu menu";
  }

  .brand {
    grid-area: brand;
  }

  .menu-toggle {
    grid-area: toggle;
    display: inline-block;
    justify-self: end;
  }

  .nav-menu {
    grid-area: menu;
    display: none;
    padding: 0.9rem;
    margin: 0.3rem 0 0.8rem;
    border-radius: 0.9rem;
    background: rgba(34, 21, 14, 0.96);
    border: 1px solid rgba(244, 223, 195, 0.2);
    flex-direction: column;
  }

  .nav-menu.is-open {
    display: flex;
  }

  .nav-cta {
    display: none;
  }

  .hero {
    min-height: 76vh;
  }

  .events-wrap,
  .contact-grid,
  .locations-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .section-pad {
    padding: 4.2rem 0;
  }

  .feature-grid,
  .menu-grid,
  .gallery-grid {
    grid-template-columns: 1fr;
  }

  .hero-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }

  .btn {
    width: 100%;
  }

  .floating-wa {
    left: 1rem;
    right: 1rem;
    text-align: center;
  }
}