"use client";

import AnimatedHeroSection from "./animatedHeroSection";
import MobileAnimatedHeroSection from "./mobileAnimatedHeroSection";
import type { PropertyData } from "@/utils/strapi";

interface PropertyHeroWrapperProps {
  propertyData: PropertyData | null;
}

const PropertyHeroWrapper = ({
  propertyData,
}: PropertyHeroWrapperProps) => {
  return (
    <>
      {/* Mobile & Tablet Hero - visible up to lg (hidden at xl and above) */}
      <div className="block xl:hidden">
        <MobileAnimatedHeroSection propertyData={propertyData} />
      </div>

      {/* Desktop Hero - visible at xl and above */}
      <div className="hidden xl:block">
        <AnimatedHeroSection propertyData={propertyData} />
      </div>
    </>
  );
};

export default PropertyHeroWrapper;