/* Cross-cutting responsive tweaks not owned by a specific component.
   Component/layout files hold their own breakpoints where the rule
   only affects that component. */

@media (max-width: 640px) {
    .page-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-3);
    }

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