/* ============================================================
   Responsive behaviour (Sprint 11)
   ============================================================ */
@media (max-width: 1500px) {
  .hindices { gap: 16px; }
  .grid-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1300px) {
  .grid-main { grid-template-columns: 1fr; }
  .grid-mid { grid-template-columns: 1fr 1fr; }
  .wl { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1120px) {
  :root { --w-sidebar: 62px; }
  .navitem .nlabel, .nbadge, .datastatus { display: none; }
  .navitem { justify-content: center; }
  .hindices .hidx:nth-child(n+3) { display: none; }
}
@media (max-width: 960px) {
  .grid-kpis { grid-template-columns: repeat(2, 1fr); }
  .grid-mid { grid-template-columns: 1fr; }
  .grid-bottom { grid-template-columns: 1fr; }
  .hindices { display: none; }
}
@media (max-width: 680px) {
  .grid-kpis { grid-template-columns: 1fr; }
  .wl { grid-template-columns: repeat(2, 1fr); }
  .huser__name, .brand__sub { display: none; }
}

/* Sprint 11A: movers stack to one column on narrow screens (1366×768 keeps two). */
@media (max-width: 1120px) { .movers { grid-template-columns: 1fr; } }

/* Sprint 11D: 6-index header wraps gracefully; sector strip reflows. */
@media (max-width: 1500px) { .hindices .hidx__name { font-size: 9px; } .hindices .hidx__val { font-size: 12px; } }
/* Below 1200px the strip stays on ONE line and scrolls. `flex-wrap: wrap` used
   to push tiles onto a second row inside a fixed-height header, which clipped
   them vertically — the same "half a price" problem in a different direction. */
@media (max-width: 1200px) { .hindices { max-width: 460px; } }
@media (max-width: 680px) { .breadth__stats { grid-template-columns: 1fr 1fr 1fr; } }

/* Sprint 11E: Market Pulse + breadth stats reflow. */
@media (max-width: 1200px) { .pulse { grid-template-columns: repeat(3, 1fr); } .breadth__stats { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 680px) { .pulse { grid-template-columns: repeat(2, 1fr); } .breadth__stats { grid-template-columns: 1fr 1fr; } }
