Background Beams

"use client";
import React from "react";
import { BackgroundBeams } from "@/lab/aceternity/ui/background-beams";

export default function BackgroundBeamsDemo() {
  return (
    <div className="h-full w-full bg-neutral-950 relative flex flex-col items-center justify-center antialiased overflow-hidden [container-type:inline-size]">
      <div className="max-w-2xl mx-auto p-4">
        <h1 className="relative z-10 text-[clamp(1.5rem,8cqw,4.5rem)] leading-tight bg-clip-text text-transparent bg-gradient-to-b from-neutral-200 to-neutral-600 text-center font-sans font-bold">
          Join the waitlist
        </h1>
        <p className="text-neutral-500 max-w-lg mx-auto my-2 text-[clamp(0.65rem,1.6cqw,0.875rem)] text-center relative z-10">
          Welcome to MailJet, the best transactional email service on the web. We provide reliable,
          scalable, and customizable email solutions for your business. Whether you&apos;re sending
          order confirmations, password reset emails, or promotional campaigns, MailJet has got you
          covered.
        </p>
        <input
          type="text"
          placeholder="hi@manuarora.in"
          className="rounded-lg border border-neutral-800 focus:ring-2 focus:ring-teal-500 w-full relative z-10 mt-4 bg-neutral-950 placeholder:text-neutral-700 px-3 py-1.5 text-sm text-neutral-200"
        />
      </div>
      <BackgroundBeams />
    </div>
  );
}