/* Hero header and paragraph */
    /* original: no custom hero sizing for mobile */
    /* original: no custom hero sizing for small mobile */
/* ============================================================
   SCALARTECH — Responsive Stylesheet
   ============================================================ */

/* ============================================================
   TABLET — max-width: 1024px
   ============================================================ */
@media (max-width: 1024px) {

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

    .hero__form-card {
        max-width: 480px;
    }

    .about__grid,
    .features__grid,
    .contact__grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .about__image { height: 380px; }

    .services__grid,
    .values__grid,
    .testimonials__grid {
        grid-template-columns: repeat(2, 1fr);
    }

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

    .footer__grid { grid-template-columns: 1fr 1fr; gap: 40px; }

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

    .cta-section__grid {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .cta-section__actions { justify-content: center; }

    .service-detail__grid { grid-template-columns: 1fr; }
    .service-sidebar { position: static; }
}

/* ============================================================
   MOBILE — max-width: 768px
   ============================================================ */
@media (max-width: 768px) {

    .section { padding: 56px 0; }

    /* Top bar */
    .topbar { padding: 12px 0; }
    .topbar__inner {
        flex-direction: column;
        align-items: center;
        gap: 8px;
    }
    .topbar__left {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
    }
    .topbar__item {
        flex-direction: row;
        justify-content: center;
        align-items: center;
        width: 100%;
        text-align: center;
        padding: 2px 0;
    }
    .topbar__item--phone-alt { display: flex; }
    .topbar__item:nth-child(3) { display: none; }

    /* Navbar */
    .navbar__nav   { display: none; }
    .navbar__cta   { display: none; }
    .navbar__toggle { display: flex; }
    .mobile-menu { width: min(92vw, 360px); top: 0; }
    .mobile-menu__inner {
        padding-top: 120px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }
    .mobile-menu__header { display: none; }

    /* Hero */
    .hero { min-height: auto; }
    .hero__grid { padding: 48px 0; }
    .hero__trust { flex-wrap: wrap; gap: 20px; }

    /* Stats */
    .stats-bar__grid { grid-template-columns: 1fr 1fr; }

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

    /* Values */
    .values__grid { grid-template-columns: 1fr 1fr; }

    /* About */
    .about__missions { grid-template-columns: 1fr; }
    .about__image-badge { left: 12px; bottom: 16px; }
    .about__actions { flex-direction: column; align-items: stretch; }
    .about__actions .btn { width: 100%; justify-content: center; }

    /* Projects */
    .projects__grid { grid-template-columns: 1fr; }

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

    /* Footer */
    .footer__grid { grid-template-columns: 1fr; gap: 32px; }
    .footer__top { padding: 48px 0; }

    /* Page hero */
    .page-hero { padding: 48px 0; }

    /* Service detail */
    .service-detail__features { grid-template-columns: 1fr; }

    /* Grid helpers */
    .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }

    /* CTA */
    .cta-section { padding: 48px 0; }
    .cta-section__actions { flex-direction: column; width: 100%; }
    .cta-section__actions .btn { width: 100%; justify-content: center; }
}

/* ============================================================
   SMALL MOBILE — max-width: 480px
   ============================================================ */
@media (max-width: 480px) {

    :root { --max-width: 100%; }

    .container { padding: 0 16px; }
    .mobile-menu { width: 100%; }
    .mobile-menu__inner { padding: 180px 16px 24px; }
    .topbar__left {
        flex-direction: column;
        align-items: center;
        gap: 6px;
    }
    .topbar__item {
        justify-content: center;
        text-align: center;
        flex-direction: row;
    }
    .topbar__item:nth-child(3) {
        display: none;
    }
    .back-to-top { right: 16px; bottom: 16px; width: 44px; height: 44px; }

    /* Stats */
    .stats-bar__grid { grid-template-columns: 1fr; }
    .stats-bar__item { border-right: none; border-bottom: 1px solid rgba(17,17,17,0.1); }
    .stats-bar__item:last-child { border-bottom: none; }

    /* Values */
    .values__grid { grid-template-columns: 1fr; }

    /* Hero form */
    .hero__form-card { padding: 24px 20px; }

    /* Buttons */
    .hero__actions { flex-direction: column; }
    .hero__actions .btn { width: 100%; justify-content: center; }
    .about__actions { gap: 10px; }

    /* Footer bottom */
    .footer__bottom-inner { flex-direction: column; text-align: center; }
}