/* ============================================
   MOBILE — 768px and below
   ============================================ */
@media (max-width: 768px) {
    /* Nav — logo left, CTA right, centered on small screens */
    .nav-inner { justify-content: space-between; }
    .nav-cta .btn { font-size: 0.7rem; padding: 0.55rem 1rem; }

    /* Mobile centering — hero text */
    .hero-grid { grid-template-columns: 1fr; text-align: center; }
    .hero-eyebrow-wrap { justify-content: center; }
    .btn-group { justify-content: center; }
    .hero-trust { justify-content: center; }
    .hero-visual { order: -1; }
    .hero-scene { aspect-ratio: 16/9; }
    .hero-badge { display: none; }

    /* Section headers centered */
    .section-header { text-align: center; }
    .section-header .section-body { margin-left: auto; margin-right: auto; }
    .section-header .eyebrow { display: block; text-align: center; }

    /* Brink intro centered */
    .brink-intro { grid-template-columns: 1fr; text-align: center; }
    .brink-intro .section-body { margin-left: auto; margin-right: auto; }

    /* Method layout stack */
    .method-layout { grid-template-columns: 1fr; }
    .method-soft-link { display: flex; justify-content: center; }

    /* About layout stack */
    .about-layout { grid-template-columns: 1fr; text-align: center; }
    .about-values { align-items: center; }
    .about-value { justify-content: center; }

    /* Testimonials */
    .testimonials-grid { grid-template-columns: 1fr; }
    .t-cta-strip {
        flex-direction: column;
        text-align: center;
        align-items: center;
    }

    /* Programs */
    .programs-grid { grid-template-columns: 1fr; }
    .prog-card--hero { order: -1; }

    /* Final CTA */
    .final-cta-bg-word { display: none; }

    /* Footer */
    .footer-grid { grid-template-columns: 1fr; gap: 2rem; text-align: center; }
    .footer-tagline { margin: 0 auto; }

    /* Sticky bar */
    .sticky-bar { display: flex; }
    body { padding-bottom: 68px; }
}

/* ============================================
   SMALL MOBILE — 480px and below
   ============================================ */
@media (max-width: 480px) {
    .hero-trust { gap: 1.5rem; }
    .btn-group { flex-direction: column; align-items: flex-start; }
    .qual-grid { grid-template-columns: 1fr; }
    .timeline { grid-template-columns: 1fr; }
    .contact-details { flex-direction: column; align-items: center; gap: 1rem; }
}
