/* ===================================================================
   VERA IT — Full-width layout (Vega IT pattern, design unchanged)
   body.site-saas.site-fullwidth — load last
   =================================================================== */

body.site-saas.site-fullwidth {
    --fw-gutter: clamp(24px, 4.5vw, 72px);
    --container-width: min(1520px, calc(100vw - 2 * var(--fw-gutter)));
    --section-padding: clamp(96px, 11vw, 140px);
}

/* —— Shared inner width —— */
body.site-fullwidth .container,
body.site-fullwidth .nav-container,
body.site-fullwidth .hero-shell--it,
body.site-fullwidth .studio-strip__inner,
body.site-fullwidth .products-studio__inner,
body.site-fullwidth .about-us__inner,
body.site-fullwidth .founder-section__inner,
body.site-fullwidth .engineering-section__inner,
body.site-fullwidth .trust-badges__inner,
body.site-fullwidth .services__inner,
body.site-fullwidth .process__inner,
body.site-fullwidth .techstack__inner,
body.site-fullwidth .portfolio__inner,
body.site-fullwidth .case-studies__inner,
body.site-fullwidth .testimonials__inner,
body.site-fullwidth .about-teaser__inner,
body.site-fullwidth .faq__inner,
body.site-fullwidth .contact__inner,
body.site-fullwidth .firm-bar__inner,
body.site-fullwidth .footer-wrap,
body.site-fullwidth .hero-shell--enterprise {
    max-width: var(--container-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--fw-gutter) !important;
    padding-right: var(--fw-gutter) !important;
}

body.site-fullwidth .navbar,
body.site-fullwidth section,
body.site-fullwidth .firm-bar,
body.site-fullwidth .studio-strip,
body.site-fullwidth .trust-badges {
    width: 100%;
    box-sizing: border-box;
}

/* —— Hero —— */
body.site-fullwidth .hero-shell--it {
    grid-template-columns: minmax(0, 1fr) min(440px, 38%);
    gap: clamp(40px, 6vw, 96px);
    align-items: center;
}

body.site-fullwidth .hero-title {
    max-width: none !important;
}

body.site-fullwidth .hero-description {
    max-width: 58ch;
}

/* —— Section rhythm —— */
body.site-fullwidth .products-studio--saas,
body.site-fullwidth .about-us--saas,
body.site-fullwidth .founder-section--saas,
body.site-fullwidth .engineering-section--saas,
body.site-fullwidth .services--saas,
body.site-fullwidth .process--saas,
body.site-fullwidth .techstack--saas,
body.site-fullwidth .portfolio--saas,
body.site-fullwidth .case-studies--modern,
body.site-fullwidth .testimonials--modern,
body.site-fullwidth .about--teaser-modern,
body.site-fullwidth .faq--saas,
body.site-fullwidth .contact--saas {
    padding-top: var(--section-padding) !important;
    padding-bottom: var(--section-padding) !important;
}

/* —— Wider section titles —— */
body.site-fullwidth .products-studio__title,
body.site-fullwidth .about-us__title,
body.site-fullwidth .founder-section__title,
body.site-fullwidth .engineering-section__title,
body.site-fullwidth .services__title,
body.site-fullwidth .process__title,
body.site-fullwidth .techstack__title,
body.site-fullwidth .portfolio__title,
body.site-fullwidth .section-title {
    max-width: none !important;
}

body.site-fullwidth .products-studio__lead,
body.site-fullwidth .about-us__lead,
body.site-fullwidth .services__lead,
body.site-fullwidth .portfolio__lead,
body.site-fullwidth .section-subtitle {
    max-width: 72ch !important;
}

/* —— Grids use full inner width —— */
@media (min-width: 1200px) {
    body.site-fullwidth .products-grid--saas {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 1280px) {
    body.site-fullwidth .services__grid {
        gap: 24px;
    }

    body.site-fullwidth .portfolio__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    body.site-fullwidth .hero-shell--it {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}
