const { Readout } = window.JabberwockeeDesignSystem_646027;
function Awards() {
  const D = window.JW_DATA;
  return (
    <section id="awards" className="jw-section jw-awards">
      <div className="jw-hero-grid" aria-hidden />
      <div className="jw-container" style={{ position: "relative" }}>
        <div className="jw-section-head">
          <h2 style={{ font: "var(--type-display-lg)" }}>Awards &amp; <em>Recognition</em></h2>
        </div>
        <div className="jw-awards-grid">
          {D.awards.map((a, i) => (
            <div key={i} className="jw-award">
              <Readout tone="muted">{String(i + 1).padStart(2, "0")}</Readout>
              <h3 style={{ font: "var(--type-display-sm)", marginTop: 20 }}>{a.award}</h3>
              <p style={{ font: "var(--type-body)", color: "var(--text-strong)", marginTop: 10 }}><em style={{ fontFamily: "var(--font-serif-display)", fontSize: 19 }}>{a.film}</em></p>
              <p style={{ font: "var(--type-body-sm)", color: "var(--text-muted)", marginTop: "auto", paddingTop: 24 }}>{a.org}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Awards = Awards;