/* =============================================
   RESPONSIVE – Theoba Theme
   Mobile-first breakpoints
   ============================================= */

/* ── Large Desktop (1400px+) ────────────────── */
@media (min-width: 1400px) {
    .container { max-width: 1320px; }
}

/* ── Desktop Adjustments (max 1199px) ──────── */
@media (max-width: 1199px) {
    :root { --section-padding: 5rem 0; }

    .hero-content { gap: 2.5rem; }
    .about-grid   { gap: 3rem; }
    .contact-grid { gap: 3rem; }
    .footer-grid  { grid-template-columns: 1.5fr 1fr 1fr; gap: 2rem; }
    .footer-grid > *:last-child { grid-column: 1 / -1; }

    .pricing-grid { gap: var(--space-lg); }
    .pricing-card--featured { transform: scale(1.02); }

    .stats-grid { gap: var(--space-lg); }
}

/* ── Tablet (max 991px) ─────────────────────── */
@media (max-width: 991px) {
    :root {
        --header-height: 70px;
        --section-padding: 4rem 0;
    }

    /* Nav */
    .main-nav,
    .header-cta { display: none; }

    .nav-toggle { display: flex; }

    /* Mobile menu */
    .main-nav.open {
        display: flex !important;
        position: fixed;
        inset: var(--header-height) 0 0 0;
        background: rgba(10,10,20,0.98);
        backdrop-filter: blur(20px);
        z-index: 999;
        flex-direction: column;
        padding: 2rem;
        overflow-y: auto;
    }

    .main-nav.open .menu {
        flex-direction: column;
        gap: 0;
        width: 100%;
    }

    .main-nav.open .menu-item > a {
        padding: 1rem 0;
        font-size: var(--text-xl);
        border-bottom: 1px solid var(--border-subtle);
        border-radius: 0;
    }

    .main-nav.open .menu-item > a::after { display: none; }

    /* Hero */
    .hero-content {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 3rem;
    }

    .hero-subtitle { max-width: 100%; }
    .hero-actions  { justify-content: center; }

    .hero-photo-ring--1 { width: 280px; height: 280px; }
    .hero-photo-ring--2 { width: 330px; height: 330px; }
    .hero-photo,
    .hero-photo-placeholder { width: 220px; height: 220px; }

    .hero-tech-tags    { display: none; }
    .hero-stat-card--1 { top: 5%; right: 0; }
    .hero-stat-card--2 { bottom: 5%; left: 0; }

    /* About */
    .about-grid { grid-template-columns: 1fr; gap: 3rem; }
    .about-photo-wrapper { max-width: 400px; margin: 0 auto; }
    .about-exp-badge  { right: 0; bottom: -1rem; }
    .about-available-badge { left: 0; }

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

    /* Pricing */
    .pricing-grid { grid-template-columns: 1fr; max-width: 480px; margin-inline: auto; }
    .pricing-card--featured { transform: none; }

    /* Contact */
    .contact-grid { grid-template-columns: 1fr; gap: 3rem; }

    /* Footer */
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
    .footer-grid > *:first-child { grid-column: 1 / -1; }

    /* Portfolio single */
    .portfolio-single-content { grid-template-columns: 1fr; }
    .portfolio-meta-card { position: static; }

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

    /* WooCommerce */
    .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ── Mobile (max 767px) ─────────────────────── */
@media (max-width: 767px) {
    :root {
        --section-padding: 3.5rem 0;
        --space-xl: 1.5rem;
    }

    .container { padding: 0 var(--space-md); }

    /* Hero */
    .hero-section { padding-top: var(--header-height); }
    .hero-photo,
    .hero-photo-placeholder { width: 180px; height: 180px; }
    .hero-photo-ring--1 { width: 230px; height: 230px; }
    .hero-photo-ring--2 { width: 280px; height: 280px; }
    .hero-stat-card { display: none; }

    /* Grid 2 cols → 1 col */
    .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }

    /* Services */
    .services-grid { grid-template-columns: 1fr; }

    /* Portfolio */
    .portfolio-grid { grid-template-columns: 1fr; }
    .portfolio-filter { gap: var(--space-xs); }
    .filter-btn { font-size: 0.7rem; padding: 0.4rem 0.9rem; }

    /* Stats */
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-md); }

    /* Tech */
    .tech-grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-sm); }

    /* Pricing */
    .pricing-grid { max-width: 100%; padding: 0; }
    .pricing-card { padding: 2rem; }

    /* Testimonials */
    .testimonial-card { padding: 2rem; }

    /* Contact form */
    .form-row { grid-template-columns: 1fr; }
    .contact-form-wrapper { padding: 2rem; }
    .form-submit-wrap { flex-direction: column; align-items: stretch; }

    /* Footer */
    .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
    .footer-bottom-inner { flex-direction: column; text-align: center; }
    .footer-bottom-links { flex-wrap: wrap; justify-content: center; gap: var(--space-md); }

    /* Blog */
    .blog-grid { grid-template-columns: 1fr; }

    /* WooCommerce */
    .woocommerce ul.products { grid-template-columns: 1fr !important; }
    .product-assurance { grid-template-columns: 1fr; }

    /* Floating CTA */
    .floating-cta { bottom: 1rem; right: 1rem; }
    .floating-cta__trigger { width: 48px; height: 48px; }

    /* Scroll indicator */
    .hero-scroll-indicator { display: none; }

    /* Section title */
    .section-title { font-size: var(--text-3xl); }

    /* Hero text */
    .hero-name { font-size: var(--text-4xl); }

    /* Testimonial slider – touch scroll */
    .testimonials-slider { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ── Small Mobile (max 479px) ───────────────── */
@media (max-width: 479px) {
    .hero-photo,
    .hero-photo-placeholder { width: 150px; height: 150px; }

    .hero-photo-ring--1 { width: 195px; height: 195px; }
    .hero-photo-ring--2 { width: 240px; height: 240px; }

    .tech-grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-xs); }

    .stats-grid { grid-template-columns: 1fr 1fr; gap: var(--space-sm); }
    .stat-number { font-size: 2.5rem; }

    .contact-quick-btns { flex-direction: column; }
    .contact-quick-btn  { justify-content: center; }

    .hero-actions { flex-direction: column; }
    .hero-actions .btn { width: 100%; justify-content: center; }

    .btn-lg { padding: 1rem 2rem; font-size: var(--text-base); }
}

/* ── Print Styles ───────────────────────────── */
@media print {
    .site-header,
    .site-footer,
    .floating-cta,
    #back-to-top,
    #theoba-preloader,
    .hero-particles {
        display: none !important;
    }

    body {
        background: #fff;
        color: #000;
    }

    .hero-section { min-height: auto; padding: 2rem 0; }
}

/* ── Dark mode (already dark by default, light mode override) ── */
@media (prefers-color-scheme: light) {
    /* Keep our dark theme – override if user wants light */
    :root {
        --bg-deep:    #060611;
        --bg-base:    #0a0a14;
    }
}

/* ── Reduced Motion ─────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    html { scroll-behavior: auto; }
}