/* ============================================
   SAMB KITE — Responsive (Blue Premium)
   ============================================ */

@media (max-width: 1024px) {
    .grid-4 { grid-template-columns: repeat(2, 1fr); }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .testimonials-slider { max-width: 100%; }
    .gallery-preview-grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; }
    .gi-1 { grid-column: 1 / -1; grid-row: auto; }
    .steps-grid { flex-direction: column; align-items: center; gap: var(--space-xl); }
    .step-connector { width: 2px; height: 30px; margin: 0; background: linear-gradient(180deg, var(--accent), rgba(0,210,255,0.2)); }

    /* About page */
    .about-intro-grid { grid-template-columns: 1fr; gap: var(--space-2xl); }
    .about-intro-image { order: 1; }
    .about-intro-content { order: 2; text-align: center; }
    .about-intro-stats { justify-content: center; }
    .certs-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
    /* Mobile Nav */
    .hamburger { display: flex; }
    .nav-links {
        position: fixed; top: 0; right: -100%; width: 100%; max-width: 340px; height: 100vh;
        background: var(--bg-surface);
        flex-direction: column; justify-content: center; align-items: center; gap: var(--space-2xl);
        transition: right 0.4s cubic-bezier(0.22, 1, 0.36, 1);
        box-shadow: -10px 0 40px rgba(10, 37, 64, 0.08);
        z-index: 1000;
    }
    .nav-links.open { right: 0; }
    .nav-links a { color: var(--primary) !important; font-size: 1.15rem; }
    .nav-links a.active::after { bottom: -4px; }

    .hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .hamburger.active span:nth-child(2) { opacity: 0; }
    .hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

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

    /* Split layout */
    .split-grid { grid-template-columns: 1fr !important; text-align: center; }
    .split-grid .reveal-left { order: 2; }
    .split-grid .reveal-right { order: 1; }
}

@media (max-width: 768px) {
    h1 { font-size: 2.2rem; }
    h2 { font-size: 1.8rem; }

    .section { padding: var(--space-3xl) 0; }
    .section-header { margin-bottom: var(--space-2xl); }

    .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }

    /* Hero */
    .hero-content { padding-top: 100px; text-align: center; }
    .hero-btns { justify-content: center; }
    .hero-trust { flex-direction: column; text-align: center; gap: var(--space-md); }

    /* Logo mobile */
    .nav-logo-img { height: 32px; }

    /* Stats */
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-xl); }
    .stat-number { font-size: 2.2rem; }

    /* Testimonials */
    .testi-arrow { width: 36px; height: 36px; }
    .testi-track .testimonial-card { padding: var(--space-xl); font-size: 0.95rem; }

    /* Gallery Preview */
    .gallery-preview-grid { grid-template-columns: 1fr; grid-template-rows: auto; }
    .gi-1 { grid-column: auto; }

    /* FAQ */
    .faq-grid { grid-template-columns: 1fr; gap: var(--space-2xl); }
    .faq-left { text-align: center; }
    .faq-left .btn { margin: var(--space-lg) auto 0; }

    /* Footer */
    .footer-grid { grid-template-columns: 1fr; text-align: center; gap: var(--space-xl); }
    .footer-bottom { flex-direction: column; gap: var(--space-sm); text-align: center; }

    /* Page Header */
    .page-header { padding: 130px 0 60px; }

    /* Gallery */
    .gallery-grid { grid-template-columns: repeat(2, 1fr); }

    /* Wave divider */
    .wave-divider svg { height: 40px; }
    .hero-wave .waves-svg { height: 50px; }

    /* CTA */
    .cta-btns { flex-direction: column; align-items: center; }

    /* Steps mobile */
    .step-card { padding: var(--space-lg) var(--space-md); }
    .step-number { font-size: 3rem; }

    /* About mobile */
    .about-stats { gap: var(--space-lg); flex-wrap: wrap; }
    .about-stat-value { font-size: 1.4rem; }
    .about-intro-stats { gap: var(--space-lg); flex-wrap: wrap; }
    .about-intro-stat-value { font-size: 1.4rem; }
    .about-img-wrapper--large img { aspect-ratio: 4/3; }

    /* Method mobile */
    .method-steps::before { left: 22px; }
    .method-step-icon { width: 46px; height: 46px; }
    .method-step-icon svg { width: 24px; height: 24px; }
    .method-step-number { font-size: 0.65rem; }

    /* Timeline mobile */
    .timeline { padding-left: 30px; }
    .timeline::before { left: 8px; }
    .timeline-dot { left: -26px; width: 12px; height: 12px; }

    /* Certs mobile */
    .certs-grid { grid-template-columns: 1fr; }
    .cert-icon { width: 64px; height: 64px; }
    .cert-icon svg { width: 36px; height: 36px; }

    /* Spot page */
    .spot-intro-grid { grid-template-columns: 1fr; gap: var(--space-2xl); }
    .spot-intro-image { order: 1; }
    .spot-intro-content { order: 2; }
    .spot-features { grid-template-columns: 1fr; }
    .spot-info-grid { grid-template-columns: 1fr; }
    .wind-bar-group { grid-template-columns: 40px 1fr 50px; }
    .wind-legend { flex-direction: column; align-items: center; gap: var(--space-sm); }

    /* WhatsApp mobile */
    .whatsapp-float { width: 50px; height: 50px; bottom: 20px; right: 20px; }
    .whatsapp-float svg { width: 22px; height: 22px; }
    .whatsapp-tooltip { display: none; }

    /* Scroll top mobile */
    .scroll-top { width: 40px; height: 40px; bottom: 20px; left: 20px; }
    .scroll-top svg { width: 16px; height: 16px; }
}

@media (max-width: 480px) {
    h1 { font-size: 1.9rem; }
    .container { padding: 0 var(--space-md); }
    .btn { width: 100%; }
    .hero-btns .btn { width: 100%; }
    .gallery-grid { grid-template-columns: 1fr; }
    .pricing-card { padding: var(--space-xl); }
    .nav-logo-img { height: 28px; }
    .footer-logo-img { height: 28px; }
    .spot-more-card { padding: var(--space-xl); }
    .spot-weather-badge { font-size: 0.75rem; padding: 8px 12px; top: 12px; right: 12px; }
    .spot-season-card { padding: var(--space-xl); }
    .method-step { flex-direction: column; align-items: flex-start; gap: var(--space-md); }
    .method-step-left { flex-direction: row; gap: var(--space-md); }
    .about-lead { font-size: 1rem; }
    .spot-map-wrapper iframe { min-height: 250px; }
}