// Section 03 — Problem narrative (human-language)
const ProblemSection = () => {
  return (
    <section className="screen bg-paper" data-screen-label="03 Problem">
      <div className="wrap">
        <div className="eyebrow reveal">Po ludzku</div>
        <h2 className="big-title reveal reveal-d1" style={{ marginBottom: 48, maxWidth: 1100 }}>
          W starych blokach ciepłą wodę<br/>
          <span className="italic">robi</span> piecyk w każdej kuchni.
        </h2>
        <div className="problem-narrative">
          <p className="reveal reveal-d2">
            W budynkach zbudowanych przed 2000 rokiem w&nbsp;każdym mieszkaniu wisi
            gazowy <strong>piecyk przepływowy</strong>. Co to znaczy dla zarządcy?
            Tyle urządzeń ile mieszkań. Tyle corocznych przeglądów. Tyle
            potencjalnych awarii. I tyle potencjalnych tragedii.
          </p>
          <p className="reveal reveal-d2">
            Każdy z tych piecyków wymaga sprawnej wentylacji, sprawnego komina,
            regularnego czyszczenia i świadomego użytkownika. <strong>Wystarczy jeden
            zapchany przewód</strong>, żeby tlenek węgla zabił lokatora we śnie.
          </p>
          <p className="kicker reveal reveal-d3">
            A wszystko to — żeby umyć ręce ciepłą wodą.
          </p>
          <p className="reveal reveal-d4">
            Od lat istnieje alternatywa. <strong>Jedna pompa ciepła w piwnicy</strong>
            robi ciepłą wodę dla całego budynku. Gaz znika z mieszkań. Mieszkańcy
            odkręcają kran i dostają wodę — tak samo jak w bloku z ciepłownią
            miejską.
          </p>
        </div>
      </div>
    </section>
  );
};
window.ProblemSection = ProblemSection;