/* ============================================
   EXOS SYSTEMS — Responsive Breakpoints
   ============================================ */

/* --- Tablet: 768px - 1024px --- */
@media (max-width: 1280px) {
    .page-home .hero__grid {
        grid-template-columns: 1fr;
    }

    .page-home .hero__content {
        max-width: none;
    }

    .page-home .hero-focus {
        max-width: 760px;
    }
}

@media (max-width: 1024px) {
    .hero {
        min-height: auto;
        padding: calc(var(--nav-height) + 3rem) 0 3rem;
    }

    .hero__grid {
        grid-template-columns: 1fr;
    }

    .hero__visual {
        display: none;
    }

    .hero__title {
        font-size: clamp(2rem, 5vw, 2.75rem);
    }

    .spotlight {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .spotlight__visual {
        order: -1;
    }

    .spotlight__diagram {
        max-width: 300px;
        margin: 0 auto;
    }

    .stats-bar__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }

    .stats-bar__item:nth-child(2)::after {
        display: none;
    }

    .services-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }

    .client-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }

    .footer__grid {
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }

    .footer__col--brand {
        grid-column: span 2;
    }

    .about-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .eaas-callout {
        grid-template-columns: 1fr;
    }

    .contact-layout {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .event-recap__highlights {
        grid-template-columns: 1fr;
    }
    .event-highlight-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .flagship-card-grid,
    .flagship-capability-grid,
    .flagship-faqs,
    .flagship-split {
        grid-template-columns: 1fr;
    }
}

/* --- Mobile: < 768px --- */
@media (max-width: 767px) {
    :root {
        --section-pad: clamp(3rem, 6vw, 4rem);
        --nav-height: 64px;
    }

    .nav {
        padding: 0.5rem 0.75rem 0;
    }

    .nav__inner {
        border-radius: 24px;
        padding: 0.85rem 1rem;
    }

    /* Nav Mobile */
    .nav__toggle {
        display: flex;
    }

    .nav__menu {
        position: fixed;
        top: 0;
        right: -100%;
        width: 280px;
        height: 100vh;
        background: rgba(6, 13, 26, 0.97);
        backdrop-filter: blur(24px);
        -webkit-backdrop-filter: blur(24px);
        flex-direction: column;
        align-items: flex-start;
        padding: calc(var(--nav-height) + 1.5rem) 1.5rem 1.5rem;
        gap: 0.25rem;
        transition: right 0.35s var(--ease-out);
        border-left: 1px solid var(--border);
        z-index: 5;
    }

    .nav__menu.active {
        right: 0;
    }

    .nav__link {
        font-size: 1rem;
        padding: 0.75rem 0.5rem;
        width: 100%;
    }

    .nav__login {
        margin-left: 0;
        margin-top: 0.75rem;
        width: 100%;
        justify-content: center;
    }

    /* Hero */
    .hero {
        padding-top: calc(var(--nav-height) + 3.2rem);
        padding-bottom: 2rem;
    }

    .hero__grid {
        grid-template-columns: 1fr;
    }

    .hero__title {
        font-size: clamp(2rem, 8vw, 2.9rem);
    }

    .hero__actions {
        flex-direction: column;
    }

    .hero__actions .btn {
        width: 100%;
        justify-content: center;
    }

    .hero-focus {
        padding: 1.2rem;
    }

    .hero-signal {
        margin-top: 1.6rem;
    }

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

    .stats-bar__item::after {
        display: none !important;
    }

    .stats-bar__value {
        font-size: 1.75rem;
    }

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

    .client-grid {
        grid-template-columns: 1fr;
    }

    /* Testimonials */
    .testimonials-grid {
        grid-template-columns: 1fr;
    }

    /* Team */
    .team-grid {
        grid-template-columns: 1fr;
    }

    .team-card__actions,
    .profile-stat-row,
    .client-card__stats--stacked {
        flex-direction: column;
    }

    .team-card__actions a,
    .profile-link-list a {
        width: 100%;
        justify-content: center;
    }

    /* Footer */
    .footer__grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .footer__col--brand {
        grid-column: span 1;
    }

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

    /* Page Hero */
    .page-hero {
        padding-top: calc(var(--nav-height) + 2rem);
    }

    .page-hero__title {
        font-size: clamp(1.5rem, 5vw, 2rem);
    }

    /* Form */
    .form-row {
        grid-template-columns: 1fr;
    }

    /* Client Strip */
    .client-strip {
        gap: 1rem;
    }

    .client-logo {
        font-size: 0.95rem;
        padding: 0.75rem 1rem;
    }

    /* Certs */
    .certs-strip {
        gap: 0.75rem;
    }

    .cert-badge {
        padding: 0.6rem 0.9rem;
    }

    .cert-badge__text {
        font-size: 0.68rem;
    }

    /* Locations */
    .locations-grid {
        grid-template-columns: 1fr;
    }

    /* Login */
    .login-card {
        padding: 1.5rem;
    }

    /* Event Recap */
    .event-recap {
        padding: 1.5rem;
    }

    .event-recap__header {
        flex-direction: column;
    }

    .event-recap__meta {
        flex-direction: column;
        gap: 0.5rem;
    }

    .event-highlight-grid {
        grid-template-columns: 1fr;
    }

    .arch-stack__connector-label {
        display: none;
    }

    /* Section headers */
    .section__title {
        font-size: clamp(1.5rem, 4vw, 2rem);
    }

    .flagship-card-grid,
    .flagship-capability-grid,
    .flagship-faqs {
        grid-template-columns: 1fr;
    }

    .blog-grid,
    .newsletter-form .form-row,
    .resource-hero {
        grid-template-columns: 1fr;
    }

    .hero__trust-grid,
    .hero__client-list,
    .hero-proof__credentials,
    .hero-proof__outcomes,
    .hero-focus__tabs,
    .hero-focus__footer,
    .resource-meta {
        gap: 0.5rem;
    }

    .hero-proof__credentials,
    .hero-proof__outcomes {
        grid-template-columns: 1fr;
    }

    .newsletter-panel {
        grid-template-columns: 1fr;
    }

    .proof-grid,
    .case-study-card__body,
    .case-study-card__metrics,
    .proof-hero,
    .case-study-detail-grid {
        grid-template-columns: 1fr;
    }

    .proof-card__actions,
    .section-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .proof-card__actions .btn,
    .section-actions .btn {
        width: 100%;
        justify-content: center;
    }
}

/* --- Small Mobile: < 400px --- */
@media (max-width: 399px) {
    .stats-bar__grid {
        grid-template-columns: 1fr;
    }

    .hero__badge {
        font-size: 0.6rem;
    }

    .nav__logo-sub {
        display: none;
    }
}


/* --- Agentic BSS Responsive --- */
@media (max-width: 768px) {
    .contrast-grid__header {
        display: none;
    }
    .contrast-row {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    .contrast-row__arrow {
        transform: rotate(90deg);
    }
    .contrast-row__agentic {
        justify-content: flex-start;
        text-align: left;
    }
    .arch-stack__layer {
        flex-direction: column;
        text-align: center;
        padding: 1.5rem;
        gap: 1rem;
    }
    .arch-stack__connector {
        display: none;
    }
    .arch-stack__desc {
        font-size: 0.6rem;
    }
    .outcome-loops {
        gap: 0.5rem;
    }
    .outcome-loop {
        font-size: 0.6rem;
        padding: 0.4rem 0.9rem;
    }
}

/* --- Image Responsive --- */
@media (max-width: 768px) {
    .spotlight__image {
        max-width: 280px;
    }
    .section__visual-break {
        max-height: 200px;
        margin: 1.5rem auto;
    }
    .about-story__image {
        max-height: 250px;
    }
    .contact-image {
        max-height: 200px;
    }
    .arch-stack__layer {
        padding: 0.75rem 1rem;
        gap: 0.75rem;
    }
    .arch-stack__icon {
        width: 28px;
        height: 28px;
        min-width: 28px;
    }
    .arch-stack__icon svg {
        width: 18px;
        height: 18px;
    }
}

/* --- Partner Bar Responsive --- */
@media (max-width: 768px) {
    .partner-bar__inner {
        gap: 1.5rem;
    }
    .partner-bar__logos {
        gap: 1.5rem;
    }
    .partner-bar__logo img {
        height: 32px;
    }
    .nav__logo-img {
        height: 44px;
    }
}