// Audience.jsx — "Who we serve"
function Audience() {
  return (
    <section id="audience" className="al-section">
      <div className="al-container al-audience">
        <div className="al-audience-copy">
          <div className="al-eyebrow">WHO WE SERVE</div>
          <h2 className="al-h2">Open to every curious kid in Austin.</h2>
          <p className="al-lede">
            No prior experience required. No tryouts, no entry exam, no fees.
            If you're 10 or older and you've ever wondered how a rocket stays pointed up
            or why planes turn by rolling — you belong here.
          </p>
          <div className="al-stats">
            <div className="al-stat">
              <div className="al-stat-k">100%</div>
              <div className="al-stat-v">Free, forever</div>
            </div>
            <div className="al-stat">
              <div className="al-stat-k">10+</div>
              <div className="al-stat-v">Minimum age</div>
            </div>
            <div className="al-stat">
              <div className="al-stat-k">0</div>
              <div className="al-stat-v">Prereqs</div>
            </div>
          </div>
        </div>
        <div className="al-audience-photo">
          <div className="al-photo-placeholder">
            <i data-lucide="image" />
            <div>Student photo: hands working on a balsa glider fuselage</div>
          </div>
        </div>
      </div>
    </section>
  );
}
window.Audience = Audience;