/* token-rules breakpoints, loaded after the shared ones. */

@media (max-width: 900px) {
  .rules-section .section-intro h2 { margin-top: 32px; font-size: 40px; line-height: 40px; }
  .rules-section { min-height: 0; padding: 80px 0; }
  .rules-grid { display: flex; width: 100%; gap: 10px; margin-top: 48px; padding-inline: 16px; overflow-x: auto; scroll-padding-inline: 16px; scroll-snap-type: x mandatory; }
  .rules-grid { scrollbar-width: none; }
  .rules-grid::-webkit-scrollbar { display: none; }
  .rule-card { width: 330px; min-height: 380px; flex: none; padding: 40px 24px 24px; border: 1px solid rgba(0,0,0,.1) !important; scroll-snap-align: start; }
  .rule-illustration { width: 205px; height: 142px; margin-bottom: 30px; }
}