import { Surface, Section, Container, Stack, Display, Text } from 'ciphercell-homepage';

export const Hero = () => (
  <Surface tone="night">
    <Section spacing="tight">
      <Container>
        <Display>
          Security for the software<br />everything else runs on.
        </Display>
      </Container>
    </Section>
  </Surface>
);

export const OnPaper = () => (
  <Surface>
    <Section spacing="tight">
      <Container>
        <Stack gap={5}>
          <Display as="p">CipherVerifier.<br />Every finding, verified.</Display>
          <Text muted>Set as a paragraph, because the page heading is elsewhere.</Text>
        </Stack>
      </Container>
    </Section>
  </Surface>
);