const sections = [
    {
        title: "Mobilkran",
        text: "Wir glauben an digitale Lösungen, die Menschen verbinden. Technologie soll nicht nur funktionieren, sondern begeistern.",
        image: "/mobilkran.jpg",
    },
    {
        title: "Transport",
        text: "Ein bunter Mix aus Kreativen, Entwicklern und Strategen – vereint durch die Leidenschaft für gute Ideen und sauberen Code.",
        image: "/transport.jpg",
    },
    {
        title: "ADAC Abschleppdienst",
        text: "Transparenz, Empathie und Nachhaltigkeit sind keine Buzzwords für uns, sondern gelebte Prinzipien in jedem Projekt.",
        image: "/abschleppdienst.jpg",
    },
];

export default function Services() {
    return (
        <div className="bg-white py-20 px-6 lg:px-24">
            <h1 className="text-4xl font-bold text-center mb-20 text-gray-800">Dienstleistungen</h1>

            <div className="space-y-28">
                {sections.map((section, index) => (
                    <div
                        key={index}
                        className={`flex flex-col lg:flex-row ${
                            index % 2 === 1 ? "lg:flex-row-reverse" : ""
                        } items-center gap-12`}
                    >
                        {/* Bild */}
                        <div className="w-full lg:w-1/2">
                            <img
                                src={section.image}
                                alt={section.title}
                                className="w-full h-auto rounded-xl shadow-xl object-cover"
                            />
                        </div>

                        {/* Text */}
                        <div className="w-full lg:w-1/2">
                            <h2 className="text-3xl font-semibold text-gray-700 mb-4">{section.title}</h2>
                            <p className="text-gray-600 text-lg leading-relaxed">{section.text}</p>
                        </div>
                    </div>
                ))}
            </div>
        </div>
    );
}
