html {
        scroll-behavior: smooth;
      }

      body {
        font-family: "Nunito Sans", ui-sans-serif, system-ui, sans-serif;
      }

      .hero-grid {
        background-image:
          linear-gradient(rgba(37, 99, 235, 0.045) 1px, transparent 1px),
          linear-gradient(90deg, rgba(37, 99, 235, 0.045) 1px, transparent 1px);
        background-size: 48px 48px;
      }

      .soft-grid {
        background-image:
          linear-gradient(rgba(14, 165, 233, 0.08) 1px, transparent 1px),
          linear-gradient(90deg, rgba(16, 185, 129, 0.07) 1px, transparent 1px);
        background-size: 44px 44px;
      }

      .dashboard-float {
        animation: dashboardFloat 7s ease-in-out infinite;
      }

      .fade-up {
        animation: fadeUp 0.8s ease both;
      }

      @keyframes dashboardFloat {
        0%,
        100% {
          transform: translate3d(0, 0, 0) rotate(0.001deg);
        }
        50% {
          transform: translate3d(0, -10px, 0) rotate(0.001deg);
        }
      }

      @keyframes fadeUp {
        from {
          opacity: 0;
          transform: translateY(18px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }
