---
import './Support.scss';
import svgSia from '/src/assets/sia.svg?raw';
import svgHns from '/src/assets/hns.svg?raw';
import svgOsi from '/src/assets/osi.svg?raw';
---

<section id="support">
  <div>
    <div class="powered-by">
      <a href="https://sia.tech" title="Sia" class="sia-logo">
        <Fragment set:html={svgSia} />
      </a>
      <a href="https://handshake.org" title="Handshake" class="hns-logo">
        <Fragment set:html={svgHns} />
      </a>
      <a href="https://opensource.org/osd/" title="Open Source Initiative" class="osi-logo">
        <Fragment set:html={svgOsi} />
      </a>
    </div>
    <div class="feature-group">
      <h2>
        Access Web3
      </h2>
      <h3>
        Support Lume Web, help us build
      </h3>
      <p>
        There's a lot of hype around "Web3" and "The Metaverse" as people see money in it, similar to the second .com boom. However, many platforms claiming to be "Web3" are just trying to make money off you and aren't truly secure or decentralized.
      </p>
      <p>
        While some services have technology that can be building blocks for the next internet, many become centralized "SaaS" services that aim to sell something, creating another walled garden with blockchain technology mixed in.
      </p>
      <div>
        <a href="https://lumeweb.com/donate" class="btn-main">Make a donation</a>
      </div>
    </div>
  </div>
</section>