/* =========================================================
   WESTFIELD USG — Responsive Stylesheet (Redesign 2026)
   ========================================================= */

/* ── 1280px — large desktop ─────────────────────────────── */
@media (max-width: 1280px) {
    .footer-grid { grid-template-columns: 1fr 1fr; }
}

/* ── 1024px — laptop / small desktop ────────────────────── */
@media (max-width: 1024px) {
    .hero-container { grid-template-columns: 1fr; text-align: center; }
    .hero-subtitle { margin-left: auto; margin-right: auto; }
    .hero-trust { justify-content: center; }
    .hero-actions { justify-content: center; }
    .hero-card-wrap { max-width: 420px; margin: 0 auto; }
    .hero-badge-float--tl { top: -8px; left: 0; }
    .hero-badge-float--br { bottom: -8px; right: 0; }

    .about-grid { grid-template-columns: 1fr; gap: 48px; }
    .about-visual { max-width: 480px; margin: 0 auto; }

    .courses-grid { grid-template-columns: repeat(2,1fr); }
    .why-grid { grid-template-columns: repeat(2,1fr); }
    .stats-grid { grid-template-columns: repeat(2,1fr); gap: 40px 0; }
    .stat-item:nth-child(2)::after { display: none; }
    .stat-item:nth-child(4)::after { display: none; }

    .site-nav { display: none; }
    .site-header__cta { display: none; }
    .hamburger { display: flex; }

    .services-grid      { grid-template-columns: repeat(2, 1fr); }
    .gallery-grid       { grid-template-columns: repeat(2, 1fr); }
    .contact-grid       { grid-template-columns: 1fr; }
    .course-detail-grid { grid-template-columns: 1fr; }
    .course-enroll-card { position: static; }
    .course-meta-strip  { grid-template-columns: repeat(2, 1fr); }
    .page-article       { padding: 32px; }

    /* News / Instructors / Apply */
    .news-grid          { grid-template-columns: repeat(2, 1fr); }
    .instructors-grid   { grid-template-columns: repeat(2, 1fr); }
    .apply-layout       { grid-template-columns: 1fr; }
}

/* ── 768px — tablet ──────────────────────────────────────── */
@media (max-width: 768px) {
    .section-padding { padding: 72px 0; }
    .courses-slider-section { padding: 64px 0; }
    .about-section, .courses-section, .why-us-section,
    .testimonials-section, .cta-section, .stats-bar { padding: 72px 0; }

    .top-bar { display: none; }

    .hero-section { padding: 80px 0 64px; min-height: auto; }
    .hero-title { font-size: clamp(30px, 6vw, 44px); }

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

    .testimonials-grid { grid-template-columns: 1fr; }

    .cta-card { padding: 48px 28px; }
    .cta-card__actions { flex-direction: column; align-items: center; }

    .footer-grid { grid-template-columns: 1fr; gap: 32px; }
    .footer-bottom { flex-direction: column; text-align: center; }

    .services-grid     { grid-template-columns: repeat(2, 1fr); }
    .gallery-grid      { grid-template-columns: repeat(2, 1fr); }
    .form-row          { grid-template-columns: 1fr; }
    .error-404-actions { flex-direction: column; align-items: center; }
    .inner-page-hero   { padding: 60px 0 44px; min-height: 220px; }
    .blog-single-grid  { grid-template-columns: 1fr; }
    .blog-sidebar      { position: static; }
    .blog-grid         { grid-template-columns: 1fr; }

    /* News / Instructors / Apply */
    .news-grid          { grid-template-columns: repeat(2, 1fr); }
    .instructors-grid   { grid-template-columns: repeat(2, 1fr); }
    .apply-layout       { grid-template-columns: 1fr; }
}

/* ── 480px — mobile ──────────────────────────────────────── */
@media (max-width: 480px) {
    .container { padding: 0 16px; }
    .hero-section { padding: 72px 0 56px; }
    .hero-title { font-size: clamp(28px, 7vw, 36px); }
    .hero-eyebrow { font-size: 11px; }
    .scan-stats { grid-template-columns: repeat(3,1fr); }
    .hero-actions { flex-direction: column; }
    .hero-actions .btn { width: 100%; justify-content: center; }

    .stats-grid { grid-template-columns: repeat(2,1fr); gap: 32px; }
    .stat-item::after { display: none !important; }

    .courses-filter { gap: 6px; }
    .filter-btn { padding: 7px 14px; font-size: 13px; }

    .cta-card { padding: 40px 20px; border-radius: 16px; }
    .btn-lg { padding: 14px 28px; }

    .site-header__inner { height: 60px; }

    .services-grid     { grid-template-columns: 1fr; }
    .gallery-grid      { grid-template-columns: 1fr; }
    .course-tabs       { gap: 4px; }
    .course-tab        { padding: 8px 14px; font-size: 0.82rem; }
    .page-article      { padding: 24px 18px; }
    .contact-form-card { padding: 24px 18px; }

    /* News / Instructors / Apply */
    .news-grid          { grid-template-columns: 1fr; }
    .instructors-grid   { grid-template-columns: 1fr; }
    .apply-layout       { grid-template-columns: 1fr; }
    .apply-form-card    { padding: 24px 18px; }
}