/* ==========================================================================
   BUSIFY — GLOBAL RESPONSIVE OVERRIDES
   Most component/page rules already carry their own breakpoints inline
   (kept next to the rule they modify, per component). This file holds
   cross-cutting rules that apply across many components/pages.
   ========================================================================== */

@media (max-width: 767px) {
  .hide-on-mobile { display: none !important; }
  .page-head { flex-direction: column; align-items: stretch; }
  .page-actions { width: 100%; }
  .page-actions .btn { flex: 1; }
  .card, .stat-card { padding: var(--space-4); }
  .section { padding: var(--space-8) var(--space-4); }
  .hero { padding: var(--space-8) var(--space-4); }
  .pain-solution { grid-template-columns: 1fr; }
  .split-section { padding: var(--space-7) var(--space-4); }
  .split-row { grid-template-columns: 1fr; gap: var(--space-5); padding: var(--space-6) 0; }
  .split-row.is-reversed .split-media { order: 1; }
  .split-row.is-reversed .split-copy { order: 2; }
  .split-copy p { max-width: none; }
}

@media (min-width: 768px) {
  .hide-on-desktop { display: none !important; }
}

@media (max-width: 1023px) {
  .app-shell.is-collapsed { grid-template-columns: var(--sidebar-width-collapsed) 1fr; }
}