"use client";

import { Container, Stack } from "@mantine/core";
import { ServiceBannerCarousel } from "@/components/commerce/ServiceBannerCarousel";
import { SectionHeader } from "@/components/ui/SectionHeader";
import { commercialLanding } from "@/data/commercial";

export function CommercialServicesSection() {
  return (
    <Container component="section" size="xl" py={100} id="servicos-comerciais">
      <Stack gap={48} align="center" w="100%">
        <SectionHeader
          align="center"
          eyebrow={commercialLanding.eyebrow}
          title={commercialLanding.title}
          description={commercialLanding.description}
        />
        <ServiceBannerCarousel />
      </Stack>
    </Container>
  );
}