/* Breakpoints: Mobile <768px, Tablet 768-1024px, Desktop >1024px */

@media (max-width: 1024px) {
  .hero .container { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  .actions { flex-direction: column; }
  .hero { padding: var(--space-lg) 0; }
  .features, .infographic, .silos, .mini-game, .latest { padding: var(--space-lg) 0; }
}