const checkItems = [
  "Joint Research Initiatives",
  "Student & Faculty Exchange",
  "Industry Integration & Internships",
];

export default function CollaborateInfo() {
  return (
    <div>
      {/* Badge */}
      <div className="inline-flex items-center gap-2 mb-6">
        <span className="w-8 h-[2px] bg-brand-accent"></span>
        <span className="text-sm font-semibold text-brand-light uppercase tracking-wider">Join Our Network</span>
      </div>

      {/* Heading — dùng div tránh main.css override h2 */}
      <div className="ps-heading text-white font-bold mb-6 leading-tight">
        Collaborate <br />With Us
      </div>

      <p className="text-lg text-brand-light opacity-90 mb-8 leading-relaxed max-w-lg">
        We are constantly seeking to expand our network with institutions and organizations that share our commitment to rigorous research and liberal arts education.
      </p>

      <ul className="space-y-4 text-white mb-10 pl-4 pt-5">
        {checkItems.map((item) => (
          <li key={item} className="flex items-center gap-3">
            <i className="fas fa-circle-check text-brand-accent"></i>
            <span>{item}</span>
          </li>
        ))}
      </ul>
    </div>
  );
}