/* =========================================================================
   Wavez Creatives — Landing styles
   Ported verbatim from the approved design (resources/ui-reference/).
   Do NOT redesign — these rules preserve the approved spacing, animations
   and mobile responsiveness. Component styling stays inline in the markup,
   exactly as in the approved file.
   ========================================================================= */

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: #0B0F12; }
::selection { background: #0D7A5F; color: #fff; }

@keyframes wz-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes wz-float   { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }

#creator-track::-webkit-scrollbar,
#freelancer-track::-webkit-scrollbar { height: 0; width: 0; display: none; }
#creator-track, #freelancer-track { scrollbar-width: none; }

@media (max-width: 1024px) {
  .wz-cols { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 900px) {
  .wz-nav-links, .wz-nav-actions { display: none !important; }
  .wz-burger { display: inline-flex !important; }
  .wz-split { flex-direction: column !important; align-items: flex-start !important; }
  .wz-hero-art { max-width: 100% !important; width: 100% !important; justify-content: flex-start !important; }
  .wz-grid4 { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 640px) {
  .wz-cols { grid-template-columns: 1fr !important; }
  .wz-stats { flex-wrap: wrap !important; gap: 18px 28px !important; }
  .wz-stats > div { flex: 1 1 38% !important; }
  .wz-hero-art { flex-wrap: nowrap !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch; padding-bottom: 14px !important; scrollbar-width: none; }
  .wz-hero-art::-webkit-scrollbar { display: none; }
  .wz-hero-art > div { margin-top: 0 !important; }
  .wz-root { padding-bottom: 80px !important; }
  .wz-mobile-cta { display: flex !important; }
}
@media (max-width: 400px) {
  .wz-chips { grid-template-columns: 1fr !important; }
}