import AccreditationCard from "./AccreditationCard";

const accreditations = [
  {
    logo: "https://storage.googleapis.com/uxpilot-auth.appspot.com/5688d070b4-3c6c0b3c66f21c272558.png",
    logoAlt: "French Ministry of Higher Education Logo",
    title: "Ministère de l'Enseignement Supérieur",
    subtitle: "National Institutional Accreditation",
    description: "Fully recognized by the French government as a degree-granting institution, ensuring our diplomas meet national educational standards.",
  },
  {
    logo: "https://storage.googleapis.com/uxpilot-auth.appspot.com/e2bd5be26e-fb4f2f04e138848db7e4.png",
    logoAlt: "European Association for Quality Assurance Logo",
    title: "ENQA",
    subtitle: "European Quality Assurance",
    description: "Compliant with the Standards and Guidelines for Quality Assurance in the European Higher Education Area (ESG).",
  },
  {
    logo: "https://storage.googleapis.com/uxpilot-auth.appspot.com/b97d101d24-d2eeb52206ef7f99965a.png",
    logoAlt: "Global Liberal Arts Alliance Logo",
    title: "GLAA",
    subtitle: "International Programmatic Certification",
    description: "Certified member of the Global Liberal Arts Alliance, affirming our commitment to interdisciplinary education globally.",
  },
];

export default function AccreditationGrid() {
  return (
    <section id="accreditation-grid" className="py-20 bg-ui-bg">
      <div className="max-w-[1440px] mx-auto px-6 lg:px-8">
        <div className="mb-12">
          <div className="acc-section-title font-bold text-ui-text mb-4">Recognized Issuing Bodies</div>
          <p className="text-ui-muted text-lg">Our institutional and programmatic accreditations ensure global recognition of our degrees.</p>
        </div>
        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
          {accreditations.map((item) => (
            <AccreditationCard key={item.title} {...item} />
          ))}
        </div>
      </div>
    </section>
  );
}