// About page — manifesto + colophon.

function AboutPage() {
  return (
    <div className="page-fade-enter">
      <div className="about-shell">
        <section className="about-hero">
          <p className="about-hero__eyebrow">About</p>
          <h1 className="about-hero__title">Tokyo Golf Fashion</h1>
          <p className="about-hero__sub">
            A weekly editorial on how Tokyo dresses for the course — the brands,
            the pieces, and the codes of quiet wealth.
          </p>
          <p className="about-hero__jp" lang="ja">
            東京の、静かな装い。仕立てと素材で語る、誇示しない美学。
          </p>
        </section>

        <section className="about-section">
          <h2>
            <span className="num">§ 01</span>
            What we publish
          </h2>
          <div className="about-section__body">
            <p className="intro">
              Tokyo Golf Fashion reads the Tokyo course through cloth.
            </p>
            <p>
              Quiet cashmere that moves with a full shoulder turn. Trousers cut in
              Ginza for a walk of eighteen holes. Shoes resoled for a decade rather
              than replaced. The city rewards restraint, and Tokyo dresses for golf
              the way it dresses for anything else — with material, proportion, and
              the patience to wait for the right piece.
            </p>
            <p>
              We write about the houses that understand this, the makers who still
              cut by hand, and the pieces that quietly hold their worth. We do not
              cover loud prints, brand logos as statement, or the seasonal noise of
              performance wear. There is plenty of that elsewhere.
            </p>
          </div>
        </section>

        <section className="about-section">
          <h2>
            <span className="num">§ 02</span>
            Our quiet rules
          </h2>
          <div className="about-section__body">
            <p className="intro">Three rules we keep to ourselves.</p>
            <ol className="about-rules">
              <li>
                <span className="num">I.</span>
                <span className="body">
                  We do not take affiliate fees from travel, hotel, or tee-time
                  bookings. The round is not a commission.
                </span>
              </li>
              <li>
                <span className="num">II.</span>
                <span className="body">
                  We do not run product rankings. A good piece is a good piece;
                  a list will not make it better.
                </span>
              </li>
              <li>
                <span className="num">III.</span>
                <span className="body">
                  We do not write about a brand because the brand wants us to.
                  We write because a story asked for us.
                </span>
              </li>
            </ol>
          </div>
        </section>

        <section className="about-section about-section--methodology">
          <h2>
            <span className="num">§ 03</span>
            Methodology
          </h2>
          <div className="about-section__body">
            <p>
              Articles on Tokyo Golf Fashion are drafted with the assistance of AI
              tools and then reviewed and edited by the editorial team before
              publication.
            </p>
            <p>
              The editorial team is responsible for all published content. We
              commit to factual accuracy, disclose affiliate relationships on our
              Disclosure page, and avoid fabricated interviews or quotes.
            </p>
            <p>
              AI-assisted editorial is a young practice. We disclose our
              methodology here rather than on every page.
            </p>
          </div>
        </section>

        <section className="about-section">
          <h2>
            <span className="num">§ 04</span>
            Colophon
          </h2>
          <div className="about-section__body">
            <dl className="about-masthead">
              <div>
                <dt>Frequency</dt>
                <dd>Weekly · published every Friday morning JST</dd>
              </div>
              <div>
                <dt>Volume</dt>
                <dd>Volume I · 2026</dd>
              </div>
              <div>
                <dt>Editorial principles</dt>
                <dd>Fact-first · Quiet Luxury · Archive-first</dd>
              </div>
              <div>
                <dt>Four lenses</dt>
                <dd>History · Craftsman · Material · Reinterpretation</dd>
              </div>
              <div>
                <dt>Contact</dt>
                <dd><a href="mailto:editor@tokyogolffashion.com">editor@tokyogolffashion.com</a></dd>
              </div>
            </dl>
          </div>
        </section>
      </div>
    </div>
  );
}

Object.assign(window, { AboutPage });