const About = () => (
  <section className="section shell" id="about">
    <div className="about-grid">
      <div className="about-photo">
        <Placeholder src="anna_portrait.png" bg="#DCE0D1" label="Portrait">
          <div className="stamp">est. 2017 · MSK</div>
        </Placeholder>
      </div>
      <div>
        <div className="overline">Обо мне</div>
        <h2>Я не делаю <em style={{fontFamily:"var(--serif)",fontStyle:"italic",color:"var(--olive)"}}>шаблон</em>.<br/>Каждые руки — свой дизайн.</h2>
        <p className="about-lede">
          Здравствуйте, я Анна. За восемь лет я поняла одно: красивый маникюр — это не про тренды,
          а про <em>внимание к деталям</em>, которое заметно через экран телефона и через два месяца после визита.
        </p>
        <p className="about-body">
          Работаю в одиночку, без потока — поэтому могу выслушать, подобрать форму под ваши руки и
          придумать дизайн, которого нет ни у кого. Обучаюсь каждый сезон у топ-мастеров СПб и Сеула.
          Всё инструменты стерилизуются в автоклаве, одноразовые — вскрываются при вас.
        </p>
        <div className="about-tags">
          <span className="chip">японская техника</span>
          <span className="chip chip--olive">сертификат CND</span>
          <span className="chip">автоклав Euronda</span>
          <span className="chip chip--blush">беременным — ok</span>
          <span className="chip">без боли</span>
        </div>
        <div className="about-stats">
          <div>
            <div className="n">1 200+</div>
            <div className="l">довольных клиентов</div>
          </div>
          <div>
            <div className="n">14</div>
            <div className="l">пройденных курсов</div>
          </div>
          <div>
            <div className="n">96%</div>
            <div className="l">возвращаются повторно</div>
          </div>
        </div>
      </div>
    </div>
  </section>
);

Object.assign(window, { About });