/* NexuLaunch responsive */

@media (max-width: 1180px) and (min-width: 901px) {
    .nav-link {
        padding-inline: 0.55rem;
        font-size: 0.86rem;
    }

    .header-actions {
        gap: 0.65rem;
    }

    .header-actions .btn-sm {
        padding-inline: 0.8rem;
    }
}

@media (max-width: 1100px) {
    .split,
    .split-reverse,
    .feature-detail,
    .feature-detail:nth-child(even),
    .pricing-preview,
    .contact-grid,
    .footer-grid,
    .ops-layout,
    .model-compare {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .hero h1 {
        max-width: none;
    }

    .feature-detail:nth-child(even) .feature-copy {
        order: 0;
    }

    .journey-rail {
        grid-template-columns: 1fr 1fr;
    }

    .journey-rail::before,
    .journey-step:not(:last-child)::after {
        display: none;
    }

    .footer-brand {
        max-width: 28rem;
    }

    .campaign-board {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .site-header {
        position: sticky;
    }

    .primary-nav {
        display: none;
        position: absolute;
        top: var(--header-h);
        left: 0;
        right: 0;
        background: #171717;
        border-bottom: 1px solid var(--color-border);
        padding: 0.6rem 1.2rem 1.2rem;
        margin: 0;
        max-height: calc(100vh - var(--header-h));
        overflow: auto;
    }

    body.nav-open .primary-nav {
        display: block;
    }

    .mobile-nav-actions {
        display: grid;
        gap: 0.6rem;
        margin-top: 1rem;
        padding-top: 1rem;
        border-top: 1px solid var(--color-border);
    }

    .nav-list {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .dropdown {
        position: static;
        display: none;
        min-width: 0;
        box-shadow: none;
        border: 0;
        background: transparent;
        padding: 0 0 0.4rem 0.6rem;
        z-index: auto;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        gap: 0.15rem;
    }

    .has-dropdown.is-open .dropdown {
        display: grid;
    }

    .header-actions .text-link,
    .header-actions .btn {
        display: none;
    }

    .menu-toggle {
        display: inline-flex;
    }

    .header-inner {
        gap: 1rem;
    }

    .header-actions {
        margin-left: auto;
    }

    .value-section .workflow-visual,
    .guide-grid,
    .form-row,
    .storefront-mock {
        grid-template-columns: 1fr;
    }

    .app-shell {
        grid-template-columns: 1fr;
    }

    .app-sidebar {
        display: flex;
        flex-wrap: wrap;
        gap: 0.25rem;
        border-right: 0;
        border-bottom: 1px solid var(--color-border);
        padding: 0.65rem 0.75rem;
    }

    .app-sidebar .side-label {
        width: 100%;
        margin-bottom: 0.35rem;
    }

    .metric-row,
    .product-grid-mini {
        grid-template-columns: 1fr 1fr;
    }

    .timeline-item {
        grid-template-columns: 1fr;
        gap: 0.35rem;
    }

    .use-case-row {
        grid-template-columns: 1fr;
        gap: 0.35rem;
        padding: 1.15rem 0;
    }

    .os-strip span {
        flex: 1 1 40%;
        border-right: 0;
        border-bottom: 1px solid var(--color-border);
    }

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 1.75rem;
    }
}

@media (max-width: 720px) {
    .hero {
        padding: 2.4rem 0 2.8rem;
    }

    .hero-grid {
        gap: 1.75rem;
    }

    .section,
    .section-lg,
    .final-cta,
    .ops-section {
        padding: 3.2rem 0;
    }

    .journey-rail,
    .pricing-grid {
        grid-template-columns: 1fr;
    }

    .container,
    .container-wide {
        width: min(100% - 1.5rem, var(--container));
    }

    .page-hero {
        padding-top: 2.4rem;
    }

    .page-hero h1 {
        max-width: none;
    }

    .hero h1 {
        max-width: none;
        font-size: 1.8rem;
        line-height: 1.2;
    }

    .hero .lede {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .metric-row,
    .product-grid-mini,
    .detect-grid,
    .campaign-board {
        grid-template-columns: 1fr;
    }

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

    .btn-row .btn {
        width: 100%;
    }

    .footer-bottom {
        flex-direction: column;
    }

    .campaign-row,
    .plan-line {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }

    .ops-actions {
        flex-direction: column;
    }

    .os-strip span {
        flex-basis: 100%;
    }
}

@media (min-width: 1440px) {
    :root {
        --container: 1180px;
        --container-wide: 1280px;
    }
}

@media (min-width: 1920px) {
    .hero {
        padding-top: 3.75rem;
        padding-bottom: 4rem;
    }
}