import React from "react";
import type { SolutionsData } from "../types";

interface SolutionsSectionProps {
  data: SolutionsData;
}

export function SolutionsSection({ data }: SolutionsSectionProps) {

  return (
    <section id="solutions" className="py-10 md:py-14 border-t border-[rgba(255,255,255,0.02)]">
      <div className="max-w-[1200px] mx-auto px-4 md:px-6">
        <h2 className="text-lg md:text-xl mb-4 md:mb-[18px] text-white">{data.title}</h2>
        <div className="grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-[18px]">
          {data.items.map((item, idx) => (
            <div
              key={idx}
              className="bg-huilong-card p-[18px] rounded-lg"
            >
              <h3 className="text-white mb-2 font-semibold">{item.title}</h3>
              <p className="text-huilong-muted text-sm">{item.content}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}