/* ==================================================
   Omnidigi responsive rules
   ================================================== */

@media (max-width: 1100px) {
    :root {
        --container: 960px;
    }

    .hero__title {
        font-size: 58px;
    }

    .page-hero__title {
        font-size: 50px;
    }

    .about__grid,
    .tech__grid,
    .contact__grid,
    .career-intro__grid {
        grid-template-columns: 1fr;
    }

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

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

@media (max-width: 860px) {
    :root {
        --header-height: 76px;
    }

    .container {
        width: min(100% - 28px, var(--container));
    }

    .section {
        padding: 82px 0;
    }

    .section-heading h2,
    .section-copy h2 {
        font-size: 34px;
    }

    .site-header {
        height: var(--header-height);
    }

    .nav-toggle {
        display: block;
        position: relative;
        z-index: 120;
    }

    .primary-nav {
        position: fixed;
        inset: var(--header-height) 14px auto;
        border: 1px solid rgba(158, 190, 223, 0.16);
        border-radius: 8px;
        background: rgba(5, 8, 18, 0.96);
        box-shadow: 0 24px 80px rgba(0,0,0,.46);
        opacity: 0;
        pointer-events: none;
        transform: translateY(-12px);
        transition: opacity .22s cubic-bezier(.2,.8,.2,1), transform .22s cubic-bezier(.2,.8,.2,1);
    }

    .primary-nav.is-open {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .primary-nav ul {
        display: grid;
        gap: 0;
        padding: 10px;
    }

    .primary-nav a {
        padding: 14px;
    }

    .hero {
        min-height: auto;
        padding-top: calc(var(--header-height) + 82px);
    }

    .hero__title {
        font-size: 44px;
        line-height: 1.08;
    }

    .page-hero__title {
        font-size: 40px;
    }

    .hero__subtitle {
        font-size: 18px;
    }

    .hero__stats,
    .service-grid,
    .testimonial-grid,
    .results-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .about__pillars,
    .tech-cloud,
    .job-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .job-card__header {
        flex-direction: column;
    }
}

@media (max-width: 640px) {
    .brand__text small {
        display: none;
    }

    .hero__title {
        font-size: 36px;
    }

    .page-hero__title {
        font-size: 34px;
    }

    .section-heading h2,
    .section-copy h2 {
        font-size: 30px;
    }

    .hero__actions,
    .footer-bottom {
        flex-direction: column;
        align-items: stretch;
    }

    .btn {
        width: 100%;
    }

    .hero__stats,
    .service-grid,
    .why-grid,
    .testimonial-grid,
    .results-grid,
    .about__pillars,
    .tech-cloud,
    .job-detail-grid,
    .form-grid,
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .stat-card,
    .service-card,
    .why-item,
    .result-card,
    .testimonial-card,
    .contact-form,
    .about__panel {
        box-shadow: 0 18px 48px rgba(0,0,0,.28);
    }

    .contact-form,
    .about__panel,
    .job-card,
    .cta-panel {
        padding: 20px;
    }
}

@media (max-width: 420px) {
    .container {
        width: min(100% - 22px, var(--container));
    }

    .brand__mark {
        width: 44px;
        height: 44px;
        border-radius: 10px;
    }

    .brand__mark img {
        width: 34px;
        height: 34px;
    }

    .brand__text strong {
        font-size: 18px;
    }

    .hero__title {
        font-size: 32px;
    }

    .page-hero__title {
        font-size: 30px;
    }

    .section-heading h2,
    .section-copy h2 {
        font-size: 28px;
    }
}