"use client";

import { ContainerScroll } from "@/components/ui/container-scroll-animation";

export default function HeroScrollDemo() {
  return (
    <div className="flex flex-col overflow-hidden">
      <ContainerScroll
        titleComponent={
          <>
            <p className="text-base font-medium uppercase tracking-[0.3em] text-neutral-500 dark:text-neutral-400">
              Strategieberatung & Konzeption
            </p>
            <h1 className="text-4xl font-semibold text-black dark:text-white">
              Gemeinsam entwickeln wir die richtige digitale Strategie für Ihr Unternehmen
            </h1>
          </>
        }
      >
        <img
          src="/Domain-Einrichtung%20%26%20Verwaltung.gif"
          alt="Domain-Einrichtung und Verwaltung"
          height={720}
          width={1400}
          className="mx-auto h-full max-h-[540px] w-full rounded-2xl object-cover object-center"
          draggable={false}
        />
      </ContainerScroll>
    </div>
  );
}