/* ============================================
   CrowGenBot — Responsive Stylesheet
   Mobile-First Breakpoints & Adaptations
   ============================================ */

/* ---------- Small Mobile (< 480px) ---------- */
@media (max-width: 480px) {
    :root {
        --section-padding: 60px 0;
    }

    .container {
        padding: 0 16px;
    }

    .section-header {
        margin-bottom: 40px;
    }

    .section-title {
        font-size: 1.6rem;
    }

    .section-subtitle {
        font-size: 1rem;
    }

    /* Hero */
    .hero-logo-img {
        width: 144px;
        height: 144px;
    }

    .hero-logo-glow {
        width: 270px;
        height: 270px;
    }

    .hero-logo-ring {
        width: 210px;
        height: 210px;
    }

    .hero-version-badge {
        font-size: 0.65rem;
        padding: 4px 12px;
    }

    .stat-suffix {
        font-size: 1.4rem;
    }

    .hero-title {
        font-size: 2.2rem;
        letter-spacing: 3px;
    }

    .hero-bot-3d {
        animation-duration: 9s, 3s, 0.2s, 5s;
        text-shadow:
            0 1px 0 #5a66e8, 0 2px 0 #5460e0, 0 3px 0 #4e5ad8, 0 4px 0 #4854d0,
            0 5px 0 #424ec8, 0 6px 0 #3c48c0,
            0 7px 10px rgba(88, 101, 242, 0.3), 0 0 15px rgba(88, 101, 242, 0.4);
    }

    .hero-subtitle {
        font-size: 0.9rem;
        white-space: normal;
        animation: none;
        width: 100%;
        border-right: none;
    }

    .hero-stats {
        flex-direction: column;
        gap: 20px;
    }

    .stat-divider {
        width: 40px;
        height: 1px;
    }

    .stat-number {
        font-size: 2rem;
    }

    .hero-buttons {
        flex-direction: column;
        align-items: center;
    }

    .hero-buttons .btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }

    .hero-scroll-indicator {
        display: none;
    }

    /* Features */
    .features-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .feature-card {
        padding: 24px;
    }

    /* Commands */
    .commands-tabs {
        gap: 6px;
    }

    .tab-btn {
        padding: 8px 14px;
        font-size: 0.8rem;
    }

    .command-item {
        padding: 16px;
    }

    .command-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .command-params {
        flex-direction: column;
    }

    /* Security */
    .security-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .security-stat-card {
        padding: 20px 12px;
    }

    .security-stat-card .stat-value {
        font-size: 1.8rem;
    }

    .security-feature {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }

    .sf-status {
        align-self: center;
    }

    /* Tech */
    .tech-grid {
        grid-template-columns: 1fr;
    }

    /* Footer */
    .footer-content {
        flex-direction: column;
        gap: 32px;
    }

    .footer-links {
        flex-direction: column;
        gap: 24px;
    }
}

/* ---------- Mobile (481px — 767px) ---------- */
@media (min-width: 481px) and (max-width: 767px) {
    :root {
        --section-padding: 80px 0;
    }

    .section-title {
        font-size: 1.8rem;
    }

    /* Hero */
    .hero-subtitle {
        white-space: normal;
        animation: none;
        width: 100%;
        border-right: none;
    }

    .hero-stats {
        gap: 24px;
    }

    .stat-number {
        font-size: 2rem;
    }

    /* Features */
    .features-grid {
        grid-template-columns: 1fr;
    }

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

    .security-feature {
        flex-direction: column;
        text-align: center;
    }

    .sf-status {
        align-self: center;
    }

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

    /* Footer */
    .footer-content {
        flex-direction: column;
        gap: 32px;
    }
}

/* ---------- Shared Mobile Rules (< 768px) ---------- */
@media (max-width: 767px) {
    /* Navbar mobile */
    .nav-links {
        display: none;
    }

    .nav-hamburger {
        display: flex;
    }

    .nav-links.mobile-open {
        display: flex;
        flex-direction: column;
        position: fixed;
        inset: 0;
        top: 60px;
        background: rgba(13, 13, 13, 0.97);
        backdrop-filter: blur(20px);
        padding: 40px 24px;
        gap: 24px;
        align-items: center;
        z-index: calc(var(--z-navbar) - 1);
        animation: fade-in-mobile 0.3s ease;
    }

    @keyframes fade-in-mobile {
        from { opacity: 0; transform: translateY(-10px); }
        to { opacity: 1; transform: translateY(0); }
    }

    .nav-links.mobile-open .nav-link {
        font-size: 1.3rem;
        font-family: var(--font-display);
    }

    .nav-actions .btn {
        display: none;
    }

    /* Reduce animations for performance */
    .glitch::before,
    .glitch::after {
        display: none;
    }

    .hero-grid-bg {
        display: none;
    }

    /* Back to top */
    .back-to-top {
        bottom: 20px;
        right: 20px;
        width: 40px;
        height: 40px;
    }
}

/* ---------- Tablet (768px — 1023px) ---------- */
@media (min-width: 768px) and (max-width: 1023px) {
    :root {
        --section-padding: 100px 0;
    }

    .section-title {
        font-size: 2.2rem;
    }

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

    /* Security */
    .security-stats {
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
    }

    .security-stat-card {
        padding: 24px 16px;
    }

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

    /* Footer */
    .footer-content {
        flex-direction: column;
        gap: 40px;
    }

    .footer-brand {
        max-width: 100%;
    }

    .footer-links {
        justify-content: flex-start;
    }
}

/* ---------- Desktop (1024px — 1439px) ---------- */
@media (min-width: 1024px) and (max-width: 1439px) {
    .features-grid {
        grid-template-columns: repeat(3, 1fr);
    }

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

/* ---------- Large Desktop (>= 1440px) ---------- */
@media (min-width: 1440px) {
    .container {
        max-width: 1320px;
    }

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

    .section-title {
        font-size: 3.2rem;
    }

    .hero-title {
        font-size: 7rem;
        letter-spacing: 16px;
    }
}

/* Cursor: Default Windows cursor — no custom cursor */

/* ---------- High DPI / Retina ---------- */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .hero-grid-bg {
        background-size: 40px 40px;
    }
}

/* ---------- Print ---------- */
@media print {
    .navbar,
    .hero-grid-bg,
    .hero-scroll-indicator,
    .back-to-top,
    .noise-overlay,
    .scanlines-overlay,
    .loader,
    .footer-glow {
        display: none !important;
    }

    body {
        background: white;
        color: black;
    }

    .section {
        padding: 40px 0;
    }

    * {
        box-shadow: none !important;
        text-shadow: none !important;
    }
}

@media (max-width: 480px) {

    .cta-section {
        padding: 70px 0;
    }

    .cta-title {
        font-size: 1.7rem;
        letter-spacing: 1px;
    }

    .cta-desc {
        font-size: 0.95rem;
    }

    .cta-buttons {
        flex-direction: column;
        align-items: center;
    }

    .cta-buttons .btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
}

/* Marquee — all screens */
@media (max-width: 768px) {
    .features-marquee::before,
    .features-marquee::after {
        width: 60px;
    }
}

/* CTA section — tablet */
@media (max-width: 768px) {
    .cta-section {
        padding: 80px 0;
    }

    .cta-title {
        font-size: 2rem;
    }
}

/* ---------- Futuristic Details — Mobile ---------- */
@media (max-width: 768px) {
    .circuit-divider {
        height: 30px;
    }

    .circuit-node {
        display: none;
    }
}

@media (max-width: 480px) {
    .cta-hex-grid {
        display: none;
    }

    .cmd-category-card::after {
        display: none;
    }
}

/* ============================================
   v2.2 — RESPONSIVE ADJUSTMENTS
   Hide/reduce complex effects on mobile
   ============================================ */

/* Hide complex effects on small screens */
@media (max-width: 768px) {
    .cursor-glow {
        display: none;
    }

    .ambient-orbs {
        display: none;
    }

    .section-coords {
        display: none;
    }

    .security-radar {
        display: none;
    }

    .footer-binary-ticker {
        display: none;
    }

    body::before {
        display: none;
    }

    .navbar.scrolled::after {
        height: 1px;
    }
}

/* Reduced effects for tablet */
@media (min-width: 769px) and (max-width: 1023px) {
    .ambient-orb {
        filter: blur(100px);
        opacity: 0.08;
    }

    .cursor-glow {
        width: 200px;
        height: 200px;
    }

    .section-coords {
        font-size: 0.5rem;
        top: 16px;
        right: 16px;
    }
}