export default function Example() {
  return (
    <Box
      css={{
        display: "flex",
        width: "100%",
        rowGap: "$100",
        flexDirection: "column",
        marginTop: "50px",
      }}
    >
      <Accordion.Root type={ACCORDION_TYPE.single} collapsible={true}>
        <Accordion.Item value="item-1">
          <Accordion.Trigger
            css={{
              fontSize: theme.fontSizes[500],
              fontFamily: theme.fonts.headline,
            }}
          >
            This header is too large
          </Accordion.Trigger>
          <Accordion.Content>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris in
            augue in felis pharetra finibus. In sagittis aliquam augue. Lorem
            ipsum dolor sit amet, consectetur adipiscing elit.
          </Accordion.Content>
        </Accordion.Item>
      </Accordion.Root>
    </Box>
  );
}