/* ===== TABLET VIEW (768px - 1024px) ===== */
@media (max-width: 1024px) {
    .hero h1 {
      font-size: 2.8rem;
    }
    
    .hero p {
      font-size: 1.1rem;
    }
    
    section {
      padding: 60px 0;
    }
  }
  
  /* ===== MOBILE VIEW (up to 768px) ===== */
  @media (max-width: 768px) {
    /* General Styles */
    html {
      font-size: 14px;
    }
    
    section {
      padding: 50px 0;
    }
    
    .section-title h2 {
      font-size: 1.8rem;
    }
    
    /* Header & Navigation */
    .hamburger {
      display: block;
    }
    
    .nav-links {
      position: fixed;
      top: 80px;
      left: -100%;
      width: 100%;
      height: calc(100vh - 80px);
      background: white;
      flex-direction: column;
      align-items: center;
      padding: 40px 0;
      transition: all 0.5s ease;
    }
    
    .nav-links.active {
      left: 0;
    }
    
    .nav-links li {
      margin: 15px 0;
    }
    
    .nav-links a {
      font-size: 1.2rem;
    }
    
    .hamburger.active span:nth-child(1) {
      transform: rotate(45deg) translate(5px, 5px);
    }
    
    .hamburger.active span:nth-child(2) {
      opacity: 0;
    }
    
    .hamburger.active span:nth-child(3) {
      transform: rotate(-45deg) translate(7px, -6px);
    }
    
    /* Hero Section */
    .hero {
      padding-top: 60px;
      height: 90vh;
    }
    
    h1 {
      font-size: 2.2rem;
    }
    
    .hero p {
      font-size: 1rem;
    }
    
    /* Footer */
    .footer-links {
      grid-template-columns: 1fr;
      text-align: center;
    }
    
    .footer-col h3::after {
      left: 50%;
      transform: translateX(-50%);
    }
    
    .social-links {
      justify-content: center;
    }
    
    /* Booking Form */
    .booking-form {
      padding: 30px 20px;
    }
    
    /* Filter Options */
    .filter-options {
      flex-direction: column;
      align-items: center;
    }
  }
  
  /* ===== SMALL MOBILE VIEW (up to 480px) ===== */
  @media (max-width: 480px) {
    .hero h1 {
      font-size: 1.8rem;
    }
    
    .btn {
      padding: 10px 20px;
    }
    
    .destination-grid {
      grid-template-columns: 1fr;
    }
    
    .testimonial-grid {
      grid-template-columns: 1fr;
    }
    
    .offer-card {
      padding: 30px 20px;
    }
  }
  