/* MONEY FLOW — RESPONSIVE BREAKPOINTS */

@media (max-width: 1024px) {
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .grid--3 { grid-template-columns: repeat(2, 1fr); }
  .footer__grid { grid-template-columns: repeat(2, 1fr); }
  .hero__title { font-size: var(--text-5xl); }
  .dash-sidebar { display: none; }
  .dash-main { margin-left: 0; }
}

@media (max-width: 768px) {
  :root {
    --nav-height: 60px;
  }

  .nav__links { display: none; }
  .nav__actions .btn { display: none; }
  .nav__hamburger { display: flex; }

  .hero { min-height: 80vh; }
  .hero__title { font-size: var(--text-4xl); }
  .hero__desc { font-size: var(--text-base); }
  .hero__actions { flex-direction: column; }
  .hero__actions .btn { width: 100%; }

  .grid--2,
  .grid--3,
  .grid--4 { grid-template-columns: 1fr; }

  .footer__grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .footer__bottom { flex-direction: column; gap: var(--space-3); text-align: center; }

  .section { padding: var(--space-12) 0; }
  .section-heading__title { font-size: var(--text-3xl); }

  .container { padding: 0 var(--space-4); }

  .mobile-nav { display: block; }
  .page { padding-bottom: 70px; }

  .modal { width: 95%; padding: var(--space-5); }

  h1 { font-size: var(--text-4xl); }
  h2 { font-size: var(--text-3xl); }
  h3 { font-size: var(--text-2xl); }

  /* Lighter animations on mobile */
  .reveal { transform: translateY(15px); }
  .reveal-left { transform: translateX(-20px); }
  .reveal-right { transform: translateX(20px); }
}

@media (max-width: 480px) {
  .hero__title { font-size: var(--text-3xl); }
  .nav { padding: 0 var(--space-4); }
  .card { padding: var(--space-4); }
  .btn--lg { padding: var(--space-3) var(--space-6); font-size: var(--text-sm); }
  .toast { min-width: auto; margin: 0 var(--space-4); }
  .toast-container { left: 0; right: 0; top: var(--space-4); }
}