/* ============================================
   KARAKUS & CO — Mobile Responsive
   ============================================ */

@media (max-width: 1024px) {
    .section { padding: 80px 0; }
    .section-header { margin-bottom: 48px; }

    /* Nav */
    .nav-toggle { display: flex; }
    .nav-links {
        position: fixed; top: 0; right: 0;
        width: 100%; height: 100vh;
        background: var(--andesite-deep);
        flex-direction: column;
        align-items: center; justify-content: center;
        gap: 28px;
        transform: translateX(100%);
        transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    .nav-links.open { transform: translateX(0); }
    .nav-link {
        font-size: 1.1rem !important;
        color: rgba(255,255,255,0.7) !important;
        letter-spacing: 3px;
    }
    .nav-link-cta {
        margin-top: 12px;
        padding: 14px 32px;
        color: var(--white) !important;
    }
    .nav-toggle.active span { background: var(--white) !important; }

    /* About */
    .about-grid { grid-template-columns: 1fr; gap: 48px; }
    .about-visual { order: -1; max-width: 400px; margin: 0 auto; }
    .about-content .section-label,
    .about-content .section-title { text-align: center; }
    .about-content .section-label { justify-content: center; }

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

    /* Stats */
    .stats-grid { flex-wrap: wrap; gap: 32px; }
    .stat-divider { display: none; }
    .stat { flex: 1 1 40%; }

    /* Gallery */
    .gallery-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 220px;
    }
    .gallery-item-lg { grid-column: span 2; }

    /* Process */
    .process-grid { grid-template-columns: repeat(2, 1fr); gap: 40px; }
    .process-step-line { display: none; }

    /* Contact */
    .contact-grid { grid-template-columns: 1fr; gap: 48px; }
    .contact-info .section-label,
    .contact-info .section-title { text-align: center; }
    .contact-info .section-label { justify-content: center; }
    .contact-details { align-items: center; }

    /* Footer */
    .footer-top { grid-template-columns: 1fr 1fr; gap: 36px; }
    .footer-brand { grid-column: span 2; text-align: center; }
    .footer-desc { margin: 0 auto; }
    .footer-logo { justify-content: center; }
}

@media (max-width: 768px) {
    .section { padding: 64px 0; }
    .container { padding: 0 20px; }

    /* Hero */
    .hero { min-height: 100svh; }
    .hero-title { font-size: clamp(2.4rem, 9vw, 3.5rem); }
    .hero-subtitle { font-size: 0.95rem; }
    .hero-actions { flex-direction: column; align-items: center; }
    .hero-actions .btn { width: 100%; max-width: 300px; justify-content: center; }
    .hero-scroll { bottom: 24px; }

    /* Marquee */
    .marquee-track span { font-size: 0.75rem; letter-spacing: 2px; }

    /* Services */
    .services-grid { grid-template-columns: 1fr; }
    .service-card { padding: 32px 28px; }

    /* Stats */
    .stats { padding: 60px 0; }
    .stat-number { font-size: 2.5rem; }

    /* Gallery */
    .gallery-grid {
        grid-template-columns: 1fr;
        grid-auto-rows: 200px;
    }
    .gallery-item-lg { grid-column: span 1; }
    .gallery-filters { gap: 6px; }
    .gallery-filter { padding: 8px 16px; font-size: 0.7rem; }

    /* Process */
    .process-grid { grid-template-columns: 1fr; gap: 32px; }

    /* Testimonials */
    .testimonial-card { padding: 0 16px; }
    .testimonial-text { font-size: 1.15rem; }

    /* Contact */
    .contact-form-wrapper { padding: 32px 24px; }
    .form-row { grid-template-columns: 1fr; }

    /* Footer */
    .footer { padding: 48px 0 0; }
    .footer-top { grid-template-columns: 1fr; gap: 32px; text-align: center; }
    .footer-brand { grid-column: span 1; }
    .footer-bottom { flex-direction: column; gap: 8px; text-align: center; padding: 20px 0; }
}

@media (max-width: 480px) {
    .hero-badge { font-size: 0.65rem; letter-spacing: 2px; }
    .hero-badge-line { width: 24px; }
    .hero-title { margin-bottom: 20px; }
    .hero-content { padding: 0 16px; }

    .section-title { font-size: 1.8rem; }
    .about-experience { bottom: -16px; right: -8px; padding: 20px 24px; }
    .about-experience-number { font-size: 2.2rem; }

    .stat-number { font-size: 2rem; }
    .stats-grid { gap: 24px; }

    .testimonial-text { font-size: 1rem; }

    .cta-title { font-size: 1.7rem; }
    .btn-lg { padding: 16px 32px; }
}