/* ══════════════════════════════════════
   RESPONSIVE — MOBILE (≤ 480px)
══════════════════════════════════════ */
@media (max-width: 480px) {
  :root { --section-pad: 48px 16px; }

  nav { padding: 0 18px; }

  .hero { padding-top: calc(var(--nav-h) + 40px); }

  .stats-bar { grid-template-columns: 1fr; }
  .stat-item { border-right: none; border-bottom: 1px solid var(--brown-border); }
  .stat-item:last-child { border-bottom: none; }

  .proses-grid { grid-template-columns: 1fr; }
  .proses-step { border-right: none; border-bottom: 1px solid var(--brown-border); }
  .proses-step:last-child { border-bottom: none; }

  .marketplace-grid { grid-template-columns: 1fr 1fr; }

  .about-badge { width: 80px; height: 80px; bottom: -12px; right: -12px; }
  .about-badge strong { font-size: 1.3rem; }

  .hero-actions { flex-direction: column; align-items: center; }
  .btn-primary, .btn-outline { width: 100%; max-width: 280px; text-align: center; }

  .wa-btn { width: 100%; }
  
  .footer-logo { font-size: 1.4rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}