/* === LANDING-RESPONSIVE.CSS ===
 * assets/css/landing-responsive.css
 * НАЗНАЧЕНИЕ: Адаптивные стили лендинга CommandOS
 * СВЯЗИ: landing.css, landing.php
 * РАЗМЕР: ~100 строк
 */

/* ============================================================
   MOBILE (max-width: 768px)
   ============================================================ */

@media (max-width: 768px) {
    .ld-hero {
        padding-top: 96px;
        padding-bottom: 48px;
        min-height: auto;
    }

    .ld-hero-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .ld-hero-title { font-size: 30px; }
    .ld-hero-subtitle { font-size: 15px; }

    .ld-hero-cta {
        flex-direction: column;
        align-items: stretch;
    }

    .ld-nav { display: none; }
    .ld-hamburger { display: flex; }

    .ld-compare-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .ld-compare-col { padding: 24px; }

    .ld-features-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .ld-feature-card { padding: 22px; }
    .ld-section-title { font-size: 24px; }

    .ld-showcase-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .ld-steps {
        flex-direction: column;
        gap: 24px;
    }

    .ld-step-connector {
        width: 2px;
        height: 24px;
        margin-top: 0;
    }

    .ld-modules-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .ld-audience-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .ld-cta-title { font-size: 26px; }

    .ld-cta-buttons {
        flex-direction: column;
        width: 100%;
    }

    .ld-footer-inner {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }

    .ld-footer-nav {
        flex-wrap: wrap;
        justify-content: center;
    }
}

/* ============================================================
   TABLET (769px - 1024px)
   ============================================================ */

@media (min-width: 769px) and (max-width: 1024px) {
    .ld-features-grid { grid-template-columns: repeat(2, 1fr); }
    .ld-hero-title { font-size: 38px; }
    .ld-modules-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */

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

    .reveal-on-scroll {
        opacity: 1;
        transform: none;
    }
}