@media (max-width: 768px) {
  nav {
    position: absolute;
    top: 70px;
    left: 0;
    width: 100%;
    background: var(--color-dark);
    display: none;
    padding: 20px 0;
  }

  nav ul {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }

  nav.active {
    display: block;
  }

  .menu-toggle {
    display: block;
  }

  .hero-text h1 {
    font-size: 2rem;
  }

  .carousel {
    height: 70vh;
  }

  .experience-grid,
  .boats-grid {
    flex-direction: column;
  }

  .pricing-card {
    padding: 25px;
  }

  .price {
    font-size: 1.6rem;
  }
}

@media (max-width: 480px) {
  .hero-text h1 {
    font-size: 1.6rem;
  }

  .whatsapp-float {
    font-size: 20px;
    padding: 12px;
  }

  .footer-container {
    flex-direction: column;
    align-items: center;
  }
}