/* ============================================================
   RESPONSIVE — Mobile-first breakpoints
   --bp-md: 900px  (tablet / small desktop)
   --bp-sm: 600px  (mobile)
   ============================================================ */

@media (max-width: 900px) {
  /* Services */
  .srv-grid { grid-template-columns: 1fr; }

  /* Stats & Problem */
  .stats-gr,
  .prob-gr { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }

  /* Multi-column sections collapse to single column */
  .about-gr,
  .moncon-gr,
  .eq-gr    { grid-template-columns: 1fr; gap: 2rem; }

  /* Footer */
  .ft-gr { grid-template-columns: 1fr 1fr; gap: 2rem; }

  /* Hero */
  .hero h1       { font-size: 2.6rem; }
  .hero-stats    { gap: 1.5rem; }

  /* MONCON params */
  .par-gr { grid-template-columns: repeat(2, 1fr); }

  /* Value cards */
  .val-gr { grid-template-columns: 1fr; }

  /* Architecture flow */
  .arch-fl { flex-direction: column; gap: 1rem; }
  .arch-a  { transform: rotate(90deg); }

  /* CTA box */
  .cta-bx { padding: 2.5rem 1.5rem; }

  /* Image rows */
  .img-row { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  /* Hero */
  .hero-stats { flex-direction: column; gap: 1rem; }

  /* About */
  .about-feats { grid-template-columns: 1fr; }

  /* Footer */
  .ft-gr  { grid-template-columns: 1fr; }
  .ft-bar { flex-direction: column; gap: 0.5rem; text-align: center; }

  /* MONCON params */
  .par-gr { grid-template-columns: 1fr; }

  /* Stats / Problem / Dashboard */
  .prob-gr,
  .stats-gr,
  .dash-m { grid-template-columns: 1fr; }

  /* Image strip */
  .img-strip { grid-template-columns: 1fr; }
}