<LandingSection>
	<LandingHeader
		eyebrow="Status pages"
		description={
			<>
				Publish incidents and maintenance from <strong>the dashboard your team already watches</strong>.
			</>
		}
	>
		Tell customers before they ask
	</LandingHeader>
	<CtaGroup>
		<Button color="brand" mix={[landingCtaChrome()]}>Create a status page</Button>
		<LinkButton href="/examples/status" variant="surface" mix={[landingCtaChrome()]}>
			See an example
		</LinkButton>
	</CtaGroup>
</LandingSection>

<LandingSection tone="tinted" spacing="compact" inset>
	<LandingHeader eyebrow="Integrations" description="…">
		Alerts where your team already talks
	</LandingHeader>
</LandingSection>

<LandingSection tone="brand" spacing="cta" align="center" inset>
	<LandingHeader description="…" align="center">
		Five monitors free, forever
	</LandingHeader>
	<CtaGroup>…</CtaGroup>
</LandingSection>