// highculture.pl marketing index page — sits above Boost and Mood
// and lets the visitor pick a product. Recreates the source index.html
// pattern but as a richer, "house" page.

function HouseLanding() {
  return (
    <div data-hc-product="house">
      <Topbar />
      <Header ctaLabel="Dołącz do listy" />
      <main>
        <section className="hero" style={{ minHeight: "calc(100vh - 104px)", textAlign: "left" }}>
          <div className="container hero-grid">
            <div>
              <p className="eyebrow">High Culture · Manifest</p>
              <h1>Sprawczość<span>w codziennym rytuale.</span></h1>
              <p className="lead">Przełomowe produkty wspomagające procesy poznawcze, odprężenie oraz odporność na stres.</p>
              <p className="sublead" style={{ marginTop: 14 }}>Tworzymy je z naukowcami i prawnikami specjalizującymi się w prawie żywnościowym.</p>
              <div className="cta-row" style={{ marginTop: 28 }}>
                <a className="button button--primary" href="../boost/index.html" target="_top">Poznaj Boost</a>
                <a className="button button--ghost" href="../mood/index.html" target="_top">Poznaj Mood</a>
              </div>
              <p className="proof" style={{ marginTop: 26 }}>Produkty testowało ponad 1000 osób.</p>
              <div className="manifest-strip">
                <div className="manifest-cell"><span className="glyph">◇</span><div><b>Synergia</b><p>Składniki dobrane z przemyślaną proporcją.</p></div></div>
                <div className="manifest-cell"><span className="glyph">☷</span><div><b>Transparentność</b><p>Pełen skład, źródła, certyfikaty.</p></div></div>
                <div className="manifest-cell"><span className="glyph">♜</span><div><b>Premium szkło</b><p>Czarna butelka chroni aktywne związki.</p></div></div>
                <div className="manifest-cell"><span className="glyph">☼</span><div><b>Zgodność</b><p>Z prawem żywnościowym, od pierwszego prototypu.</p></div></div>
              </div>
            </div>
            <div className="hero-art">
              <img className="main-art" src="../../assets/boost/hero-composition.jpg" alt=""
                style={{ width: "min(100%, 540px)" }} />
            </div>
          </div>
        </section>

        <section className="section">
          <div className="container intro-grid">
            <div>
              <h2 className="section-title">Dwa rytuały. Jeden manifest.</h2>
              <p className="kicker">Każdy produkt High Culture odpowiada na inny moment dnia — ale wszystkie powstały z tej samej obsesji na punkcie jakości i transparentności.</p>
              <div className="monogram">HC</div>
            </div>
            <div className="benefit-grid" style={{ gridTemplateColumns: "repeat(2, 1fr)", gap: 18 }}>
              <a className="card product-tile" href="../boost/index.html" target="_top">
                <img src="../../assets/boost/hero-composition.jpg" alt="" />
                <p className="eyebrow" style={{ marginTop: 16, marginBottom: 6, color: "#c57c43" }}>Boost · 50 porcji</p>
                <h3>Skupienie i spokój.</h3>
                <p>Krople do kawy. Synergia ekstraktów roślinnych i grzybowych dla głębokiej pracy.</p>
                <div className="product-tile-foot"><span>od 159,00 zł</span><span className="arrow">→</span></div>
              </a>
              <a className="card product-tile" href="../mood/index.html" target="_top">
                <img src="../../assets/mood/hero-composition.jpg" alt="" />
                <p className="eyebrow" style={{ marginTop: 16, marginBottom: 6, color: "#c7586a" }}>Mood · 10 porcji</p>
                <h3>Rozluźnienie bez odurzenia.</h3>
                <p>Funkcjonalny zamiennik alkoholu — wytrawny, roślinny, na wieczór.</p>
                <div className="product-tile-foot"><span>od 129,00 zł</span><span className="arrow">→</span></div>
              </a>
            </div>
          </div>
        </section>

        <section className="section process">
          <div className="container process-grid">
            <div>
              <h2 className="section-title">Od nauki do innowacji.</h2>
              <p className="kicker">Półtora roku pracy z naukowcami, prawnikami żywnościowymi i ekspertami od jakości — żeby suplement był po prostu suplementem, a nie obietnicą.</p>
            </div>
            <div className="steps">
              <Step icon="◇" title="Synergia" body="Ekstrakty roślinne, aminokwasy i adaptogeny w przemyślanych proporcjach." />
              <Step icon="☷" title="Transparentność" body="Pełen skład, źródła i certyfikaty zawsze dostępne." />
              <Step icon="♜" title="Premium bottle" body="Czarne, matowe szkło chroniące składniki przed UV." />
              <Step icon="☼" title="Odpowiedzialność" body="Tworzymy zgodnie z najwyższymi standardami prawa żywnościowego." />
            </div>
            <img className="lifestyle-img" src="../../assets/mood/lifestyle-calm.jpg" alt="" />
          </div>
        </section>

        <section className="section">
          <div className="container trust-grid">
            <div>
              <h2 className="section-title">Magazyn</h2>
              <p className="kicker">Krótkie eseje o pracy poznawczej, regulacji stresu i kulturze suplementacji.</p>
            </div>
            <div className="trust-cards">
              <TrustCard image="../../assets/boost/trust-lab.jpg" title="Czym jest cytykolina" body="Krótkie wprowadzenie do związku, który napędza Twoją uwagę." />
              <TrustCard image="../../assets/mood/trust-formula.jpg" title="GABA, Reishi i sen" body="Co naprawdę wiemy o adaptogenach na wieczór." />
              <TrustCard image="../../assets/boost/trust-formula.jpg" title="Bez cukru, bez kompromisów" body="Dlaczego rezygnujemy z wypełniaczy, które robią smak." />
              <TrustCard image="../../assets/mood/trust-lab.jpg" title="Mocktail jako rytuał" body="Jak Mood odzyskuje wieczór bez alkoholu." />
            </div>
            <article className="card quote-card">
              <img src="../../assets/boost/founder.jpg" alt="" />
              <div className="quote-mark">"</div>
              <blockquote>High Culture nie zastępuje niczego — tylko mądrze uzupełnia. To dla osób, które już wiedzą, czego chcą od dnia.</blockquote>
              <cite>Krzysztof Kornas,<br />Prezes Zarządu High Culture sp. z o.o.</cite>
            </article>
          </div>
        </section>

        <FinalCta
          image="../../assets/mood/footer-cluster.jpg"
          heading="Bądź pierwszy w kolejce."
          kicker="Premiery, treści i oferty specjalne — bezpośrednio na Twój e-mail."
          ctaLabel="Dołącz do listy"
        />
      </main>
      <Footer />
    </div>
  );
}

window.HouseLanding = HouseLanding;
