// Schedule.jsx — Saturday session flow
function Schedule() {
  const blocks = [
    { tag: '00:00 — 00:45', title: 'Lesson or guest speaker', body: 'Aerodynamics, aviation careers, engineering concepts — one focused topic, one clear takeaway.' },
    { tag: '00:45 — 01:30', title: 'Hands-on project work', body: 'CAD design, model rocketry, drone builds, glider construction. You build; mentors coach.' },
    { tag: '01:30 — 02:00', title: 'Group discussion & industry insight', body: 'Q&A, case studies, career mapping. Close the loop on what you just learned and made.' },
  ];
  return (
    <section id="schedule" className="al-section al-section-dark">
      <div className="al-container">
        <div className="al-schedule-header">
          <div>
            <div className="al-eyebrow" style={{color: '#93C5FD'}}>PROGRAM STRUCTURE</div>
            <h2 className="al-h2 on-dark">Every Saturday, two hours, three sections.</h2>
          </div>
          <div className="al-schedule-badge">
            <i data-lucide="calendar" />
            <div>
              <div className="al-badge-l1">8-week program</div>
              <div className="al-badge-l2">Every Saturday · 10:00 AM — 12:00 PM</div>
            </div>
          </div>
        </div>
        <div className="al-schedule-grid">
          {blocks.map((b, i) => (
            <div key={i} className="al-schedule-card">
              <div className="al-schedule-num">0{i+1}</div>
              <div className="al-schedule-tag">{b.tag}</div>
              <h3 className="al-schedule-title">{b.title}</h3>
              <p className="al-schedule-body">{b.body}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Schedule = Schedule;
