function Services() {
  const items = [
    { num: '01', title: 'Career counseling', desc: 'One-on-one sessions mapping your goals to programs and industries — with real data on outcomes, not hype.' },
    { num: '02', title: 'Admission support', desc: 'Document checklists, application review, deadlines, and direct coordination with university admission cells.' },
    { num: '03', title: 'Placement assistance', desc: 'Curated openings, resume review, 9 months of post-enrolment career support across hiring cycles.' },
    { num: '04', title: 'Mentorship program', desc: 'Industry mentors across product, finance, tech and design — matched to your track, available monthly.' },
    { num: '05', title: 'Scholarship guidance', desc: 'We surface the scholarships you actually qualify for and help you complete every application on time.' },
    { num: '06', title: 'Interview & resume prep', desc: 'Mock interviews, feedback cycles, portfolio reviews — built with hiring managers from partner companies.' },
  ];
  return (
    <section className="section services-section" id="services">
      <div className="container">
        <FadeUp>
          <div className="section-head">
            <div className="section-eyebrow">Student services</div>
            <h2 className="section-title">
              From course pick to <span className="serif">career-ready</span>,<br/>we stay with you.
            </h2>
            <p className="section-sub">
              Enrolling is the easy part. Everything that happens after is what separates a transcript from a career.
            </p>
          </div>
        </FadeUp>
        <div className="services-grid">
          {items.map((s, i) => (
            <FadeUp key={s.num} delay={(i % 3) + 1}>
              <div className="service">
                <div className="service-num">{s.num}</div>
                <div className="service-title">{s.title}</div>
                <p>{s.desc}</p>
                <div className="service-arrow">→</div>
              </div>
            </FadeUp>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Services = Services;