@media (min-width:1400px) {
    .container {
        max-width: 1320px
    }

    .hero {
        min-height: 960px
    }

    .hero-visual {
        min-height: 650px
    }
}

@media (min-width:1200px) and (max-width:1399px) {
    .container {
        max-width: 1160px
    }

    .hero h1 {
        font-size: 4.8rem
    }

    .feature-badges {
        right: -5px
    }

    .industry-card h3 {
        font-size: .87rem
    }

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

@media (min-width:992px) and (max-width:1199px) {
    .container {
        max-width: 960px
    }

    .main-nav {
        gap: 20px
    }

    .brand {
        width: 165px
    }

    .hero {
        min-height: 880px
    }

    .hero-inner {
        grid-template-columns: 1fr 1fr
    }

    .hero h1 {
        font-size: 4rem
    }

    .hero-image-wrap {
        inset: 20px -110px 0 -20px
    }

    .hex-badge {
        width: 92px;
        height: 92px
    }

    .feature-badges {
        right: -8px
    }

    .about-grid {
        gap: 35px
    }

    .hex-collage {
        transform: scale(.9)
    }

    .about-cards {
        grid-template-columns: 1fr
    }

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

    .product-layout {
        grid-template-columns: .8fr 1fr
    }

    .capsule-stage {
        grid-row: 1 / span 2;
        grid-column: 2
    }

    .product-browser {
        grid-column: 1/-1
    }

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

    .footer-grid {
        grid-template-columns: 1.4fr repeat(2, 1fr)
    }
}

@media (max-width:991px) {
    .site-header {
        height: 78px
    }

    .brand {
        width: 155px;
        height: 56px
    }

    .menu-toggle {
        display: block
    }

    .main-nav {
        position: absolute;
        top: 70px;
        left: 20px;
        right: 20px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        background: rgba(3, 21, 63, .98);
        border: 1px solid rgba(78, 196, 255, .35);
        border-radius: 18px;
        padding: 10px;
        box-shadow: 0 20px 50px rgba(0, 0, 0, .35);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        transition: .25s
    }

    .main-nav.open {
        opacity: 1;
        visibility: visible;
        transform: none
    }

    .main-nav a {
        padding: 14px 16px;
        color:#fff;
    }

    .main-nav>a:not(.nav-cta)::after {
        display: none
    }

    .nav-cta {
        text-align: center;
        margin-top: 6px
    }

    .menu-toggle.open span:nth-child(1) {
        transform: translateY(9px) rotate(45deg)
    }

    .menu-toggle.open span:nth-child(2) {
        opacity: 0
    }

    .menu-toggle.open span:nth-child(3) {
        transform: translateY(-9px) rotate(-45deg)
    }

    .hero {
        padding-top: 120px;
        min-height: auto;
        padding-bottom: 135px
    }

    .hero-inner {
        grid-template-columns: 1fr
    }

    .hero-copy {
        text-align: center
    }

    .hero-description {
        margin-inline: auto
    }

    .hero-actions {
        justify-content: center
    }

    .hero-visual {
        min-height: 520px
    }

    .hero-image-wrap {
        inset: -20px 0 -20px 0
    }

    .feature-badges {
        right: 10px;
        top: 40px
    }

    .stats-wrap {
        position: relative;
        left: auto;
        bottom: -82px;
        transform: none
    }

    .stats-bar {
        grid-template-columns: repeat(2, 1fr)
    }

    .stat-item:nth-child(2) {
        border-right: 0
    }

    .stat-item:nth-child(-n+2) {
        border-bottom: 1px solid rgba(255, 255, 255, .14)
    }

    .about {
        padding-top: 150px
    }

    .about-grid {
        grid-template-columns: 1fr
    }

    .hex-collage {
        max-width: 620px;
        width: 100%;
        margin: auto
    }

    .about-copy {
        text-align: center
    }

    .about-cards {
        grid-template-columns: repeat(3, 1fr);
        text-align: left
    }

    .industry-grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .product-layout {
        grid-template-columns: 1fr
    }

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

    .product-benefits>div {
        padding: 14px
    }

    .product-benefits>div+div {
        border-top: 0;
        border-left: 1px solid rgba(255, 255, 255, .11)
    }

    .capsule-stage {
        min-height: 420px
    }

    .product-browser {
        min-height: 420px
    }

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

    .quote-wrap {
        grid-template-columns: 1fr
    }

    .quote-intro {
        min-height: 280px
    }

    .newsletter-inner {
        align-items: flex-start;
        flex-direction: column
    }

    .newsletter form {
        min-width: 0;
        width: 100%
    }

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

    .footer-brand {
        grid-column: 1/-1
    }

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

@media (min-width:768px) and (max-width:991px) {
    .hero h1 {
        font-size: 4.4rem
    }

    .hex-badge {
        width: 95px;
        height: 95px
    }

    .section {
        padding: 80px 0
    }
}

@media (min-width:576px) and (max-width:767px) {
    .container {
        width: min(100% - 28px, 680px)
    }

    .hero h1 {
        font-size: 3.65rem
    }

    .hero-visual {
        min-height: 440px
    }

    .feature-badges {
        grid-template-columns: repeat(4, 1fr);
        left: 0;
        right: 0;
        top: auto;
        bottom: 0;
        gap: 8px
    }

    .hex-badge {
        width: 82px;
        height: 82px;
        margin: auto
    }

    .hex-badge i {
        font-size: 1.15rem
    }

    .hex-badge span {
        font-size: .65rem
    }

    .hex-collage {
        min-height: 500px;
        transform: scale(.9)
    }

    .about-cards {
        grid-template-columns: 1fr
    }

    .industry-grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .product-benefits {
        grid-template-columns: 1fr
    }

    .product-benefits>div+div {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, .11)
    }

    .bottom-benefits {
        grid-template-columns: repeat(2, 1fr)
    }

    .why-grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .quote-form {
        grid-template-columns: 1fr
    }

    .form-field.full,
    .form-actions.full {
        grid-column: auto
    }

    .footer-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width:575px) {
    .container {
        width: calc(100% - 22px)
    }

    .section {
        padding: 68px 0
    }

    .hero {
        padding-top: 110px;
        padding-bottom: 120px
    }

    .hero h1 {
        font-size: clamp(2.65rem, 13vw, 3.5rem)
    }

    .hero-description {
        font-size: .93rem
    }

    .hero-actions {
        display: grid
    }

    .hero-actions .btn {
        width: 100%
    }

    .hero-visual {
        min-height: 355px
    }

    .hero-image-wrap {
        inset: 0 -35px 20px -35px
    }

    .feature-badges {
        grid-template-columns: repeat(4, 1fr);
        left: 0;
        right: 0;
        top: auto;
        bottom: -10px;
        gap: 4px
    }

    .hex-badge {
        width: 70px;
        height: 70px;
        margin: auto
    }

    .hex-badge i {
        font-size: 1rem
    }

    .hex-badge span {
        font-size: .58rem
    }

    .stats-bar {
        grid-template-columns: 1fr 1fr
    }

    .stat-item {
        padding: 18px 12px;
        min-height: 100px;
        gap: 10px
    }

    .stat-item i {
        font-size: 1.45rem
    }

    .stat-item strong {
        font-size: 1.35rem
    }

    .stat-item span {
        font-size: .68rem
    }

    .about {
        padding-top: 145px
    }

    .hex-collage {
        min-height: 390px
    }

    .hex-a {
        width: 190px;
        height: 165px;
        left: 0
    }

    .hex-b {
        width: 175px;
        height: 155px;
        right: 0;
        top: 35px
    }

    .hex-c {
        width: 200px;
        height: 175px;
        left: 20px
    }

    .hex-d {
        width: 180px;
        height: 158px;
        right: 0
    }

    .about-cards {
        grid-template-columns: 1fr
    }

    .industry-grid {
        grid-template-columns: 1fr
    }

    .products-section {
        border-radius: 38px;
        padding: 68px 0
    }

    .product-tabs {
        justify-content: flex-start
    }

    .product-benefits {
        grid-template-columns: 1fr
    }

    .product-benefits>div+div {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, .11)
    }

    .capsule-stage {
        min-height: 330px;
        transform: scale(.78);
        margin: -30px 0
    }

    .product-browser {
        min-height: 400px
    }

    .bottom-benefits {
        grid-template-columns: 1fr
    }

    .why-grid {
        grid-template-columns: 1fr
    }

    .quote-form {
        grid-template-columns: 1fr;
    }

    .form-field.full,
    .form-actions.full {
        grid-column: auto
    }

    .form-actions {
        align-items: stretch;
        flex-direction: column
    }

    .form-actions .btn {
        width: 100%
    }

    .newsletter-inner {
        padding: 20px
    }

    .newsletter form {
        grid-template-columns: 1fr
    }

    .newsletter input,
    .newsletter button {
        border-radius: 10px;
        height: 46px
    }

    .newsletter button {
        margin-top: 8px
    }

    .footer-grid {
        grid-template-columns: 1fr
    }

    .footer-bottom div {
        flex-wrap: wrap
    }

    .product-modal {
        padding: 28px 22px
    }
}
/* =========================================================
   UNIFIED RESPONSIVE CONTAINER WIDTHS
   Keeps every page section aligned on the same vertical grid.
   No visual styling or content has been changed.
========================================================= */

:root {
    --orbix-unified-max-width: 1600px;
    --orbix-unified-gutter: 40px;
}

/* All main section wrappers use one shared width system */
.orbix-layout,
.container,
.header-inner,
.orbix-hero__content,
.orbix-aboutx-wrap,
.orbix-glance-container,
.orbix-industriesx-container,
.orbix-products-container,
.orbix-choice-section > .container,
.orbix-quote-light__container,
.orbix-footer__container {
    width: min(
        var(--orbix-unified-max-width),
        calc(100% - (var(--orbix-unified-gutter) * 2))
    ) !important;
    max-width: none !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

/* Remove wrapper-specific horizontal padding so all content edges match */
.header-inner,
.orbix-glance-container,
.orbix-products-container,
.orbix-choice-section > .container,
.orbix-quote-light__container,
.orbix-footer__container {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/* Large screens: 1900px and above */
@media (min-width: 1900px) {
    :root {
        --orbix-unified-max-width: 1600px;
        --orbix-unified-gutter: 40px;
    }
}

/* Desktop and wide laptop: 1400px–1899px */
@media (min-width: 1400px) and (max-width: 1899px) {
    :root {
        --orbix-unified-max-width: 1450px;
        --orbix-unified-gutter: 40px;
    }
}

/* Standard laptop: 1200px–1399px */
@media (min-width: 1200px) and (max-width: 1399px) {
    :root {
        --orbix-unified-max-width: 1220px;
        --orbix-unified-gutter: 24px;
    }
}

/* Small laptop / landscape tablet: 992px–1199px */
@media (min-width: 992px) and (max-width: 1199px) {
    :root {
        --orbix-unified-max-width: 960px;
        --orbix-unified-gutter: 24px;
    }
}

/* Tablet: 768px–991px */
@media (min-width: 768px) and (max-width: 991px) {
    :root {
        --orbix-unified-max-width: 760px;
        --orbix-unified-gutter: 20px;
    }
}

/* Mobile: 576px–767px */
@media (min-width: 576px) and (max-width: 767px) {
    :root {
        --orbix-unified-max-width: 680px;
        --orbix-unified-gutter: 16px;
    }
}

/* Small mobile: up to 575px */
@media (max-width: 575px) {
    :root {
        --orbix-unified-max-width: 100%;
        --orbix-unified-gutter: 13px;
    }
}
