import HomeFaqSection from "@/components/faq/faq-section";
import SolutionsHero from "@/components/solutions/solutions-hero";
import SolutionsChooseUs from "@/components/solutions/solutions-choose-us";
import SolutionsBenefits from "@/components/solutions/solutions-benefits";
import SolutionsFunFact from "@/components/solutions/solutions-funfact";
import MainSec3Footer from "@/components/common/main-sec3-footer";
import SiteHeader from "@/components/common/site-header";
import type { Metadata } from "next";

export const metadata: Metadata = {
  title: "Solutions",
  description: "Product solutions — mapped from solutions.html",
};

export default function SolutionsPage() {
  return (
    <>
      <SiteHeader />
      {/* main-sec4 */}
      <section className="main-sec4 v2">
        <SolutionsHero />
      </section>
      {/* End main-sec4 */}

      <SolutionsChooseUs />

      {/* main-sec5 */}
      <section className="main-sec5">
        <SolutionsBenefits />
        <SolutionsFunFact />
      </section>
      {/* End main-sec5 */}

      <section className="faq-sec space">
        <div className="carousel-container">
          <div className="sec-title">
            <span
              className="sub-title"
              data-aos="fade-up"
              data-aos-duration="900"
              data-aos-delay="300"
            >
              Asked Questions
            </span>
            <h2
              className="title"
              data-aos="fade-up"
              data-aos-duration="900"
              data-aos-delay="400"
            >
              Frequently Asked Questions
            </h2>
            <p data-aos="fade-up" data-aos-duration="700" data-aos-delay="400">
              Our FAQ section covers everything you need to know, from setup and
              functionality to customization and support
            </p>
          </div>
          <HomeFaqSection />
        </div>
      </section>
      <MainSec3Footer />
    </>
  );
}