/*============================================================================
  CROSS-ENVIRONMENT DESIGN SYSTEM MEDIA LAYERS
============================================================================*/
@media (max-width: 1200px) {
    .about-narrative-grid { gap: 40px; }
    .gg-heading { font-size: 36px; }
}

@media (max-width: 992px) {
    .trusted-marquee-section { padding: 24px 0; }
    .marquee-wrapper-box { flex-direction: column; align-items: flex-start; gap: 24px; }
    .trust-badge-meta { border-right: none; border-bottom: 2px solid var(--border-color); padding-right: 0; padding-bottom: 16px; width: 100%; }
    
    .about-narrative-grid { grid-template-columns: 1fr; gap: 60px; }
    .about-graphic-workspace { max-width: 600px; margin: 0 auto; padding: 20px; }
    .about-hero-image { height: 450px; }
    .gg-section { padding: 80px 0; }
}

@media (max-width: 576px) {
    .gg-heading { font-size: 30px; }
    .about-metrics-row { grid-template-columns: 1fr; gap: 32px; }
    .floating-hud-experience-badge { padding: 16px; }
    .hud-big-number { font-size: 36px; }
    .primary-system-btn { width: 100%; justify-content: center; }
}