www-2021/src/components/FemtoHeader.svelte

<div class="femtoHeader">
  <svg
    width="128"
    height="100"
    viewBox="0 0 32 25"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
  >
    <path
      d="M0 0H14.6453V4.5H5.05011V10.0714H14.2846V14.3571H5.05011V25H0V0Z"
      fill="#FFFFFF"
    />
    <path
      d="M20.7094 15.6786L17.2104 13.1786L21.3587 8.75L15.4068 7.5L16.7054 3.5L22.2605 6.03572L21.5751 0H25.8317L25.1463 6.03572L30.7014 3.5L32 7.5L26.0481 8.75L30.1964 13.1786L26.6974 15.6786L23.7034 10.4286L20.7094 15.6786Z"
      fill="#FFFFFF"
    />
  </svg>
  <h2>Satellite communications, done differently.</h2>

  <div class="introText">
    <p>
      The FemtoStar Project is a global community developing a satellite
      constellation for secure, open, and private communications - anywhere on
      planet Earth.
    </p>
  </div>
</div>

<style>
  div {
    display: flex;
    width: 100%;
    background-color: #00111d;
    color: #ffffff;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  svg {
    padding-top: 1em;
  }

  h2 {
    margin-top: 0.5em;
  }

  .introText {
    width: 100%;
    color: #ffffff;
  }

  p {
    max-width: 512px;
  }
</style>