/* Wealth Tracker — homepage phone styles.
   Only loaded on screens 860px wide or narrower (see the <link media="..."> tag
   in index.html) — this file never reaches a desktop visitor's browser. */

@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr;gap:44px;}
  .bgrid{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .mock-tiles{grid-template-columns:repeat(2,1fr);}
  .nav-links{display:none;}

  /* .nav itself (justify-content:space-between, no wrap by default — see landing.css)
     was letting .brand and .nav-actions overflow off the right edge on narrow phones once
     .nav-links was hidden and the two remaining groups still didn't fit side by side. */
  .shell{padding:0 20px;}
  .nav{flex-wrap:wrap;row-gap:10px;gap:12px;}
  .brand img{height:36px;}
  .brand span{display:none;}
  .nav-actions{gap:8px;}
  .nav-actions .btn{padding:9px 14px;font-size:13.5px;}
}