function AboutPage() {
  return (
    <>
      <header style={{padding: "120px 64px 64px", background: "var(--cream)", maxWidth: 1180, margin: "0 auto"}}>
        <span className="eyebrow">Our Story</span>
        <h1 className="h-display" style={{marginTop: 16}}>A weekly food ritual,<br/>not a service.</h1>
      </header>

      <section className="section section--cream" style={{paddingTop:0}}>
        <div className="section__inner">
          <div className="about-hero">
            <div className="about-hero__img" style={{backgroundImage:"url(assets/placeholder-oak.svg)"}}/>
            <div className="stack gap-5">
              <p className="about-quote">
                "We started Nourrir because we wanted to eat properly during the week,
                without making it the week's project."
              </p>
              <span className="about-sig">— Founder, The Table</span>
            </div>
          </div>
        </div>
      </section>

      <section className="section section--warm">
        <div className="section__inner" style={{display:"grid", gridTemplateColumns: "1fr 1fr", gap: 64}}>
          <div className="stack gap-4">
            <span className="eyebrow">The Table</span>
            <h2 className="h2">A membership, not a subscription.</h2>
          </div>
          <div className="stack gap-4">
            <p className="lede">
              The Table is the people who eat with us each week. Members get the menu first,
              the priority slot, and the founding-member card — numbered, twenty per cent off,
              capped at ten.
            </p>
            <p className="lede" style={{fontStyle:"italic", opacity:.85}}>
              Never customers. Never subscribers. Always members.
            </p>
          </div>
        </div>
      </section>

      <section className="section section--forest">
        <div className="section__inner" style={{display:"grid", gridTemplateColumns: "1fr 1fr", gap: 64}}>
          <div className="stack gap-4">
            <span className="eyebrow eyebrow--cream">The kitchen</span>
            <h2 className="h2">London. Halal. Always.</h2>
          </div>
          <div className="stack gap-4">
            <p className="lede lede--cream">
              We cook from a single kitchen in London. Every plate is halal. The menu
              changes every week. Delivery included across zones 1–3, every Sunday.
            </p>
          </div>
        </div>
      </section>

      <EmailCapture/>
    </>
  );
}
window.AboutPage = AboutPage;