General12

---
import DemoLayout from '@/layouts/DemoLayout.astro';
import { Wrapper, Grid, Frame, Media, Stack, Flow, Layer, Center, Text, Inline, Heading } from 'lism-css/astro';
---

<DemoLayout title="General12">
  <Wrapper isContainer contentSize="full" py="50">
    <Frame ar={['3/2', '16/9', '21/9']} gc="1 / -1" w="stretch" pos="relative">
      <Media src="https://cdn.lism-css.com/random/img" alt="" width="960" height="640" />
      <Layer bgc="rgb(0 0 0 / 20%)" style={{ backdropFilter: 'blur(8px)' }}>
        <Center h="100%" c="white">
          <Inline class="u--trim" fz="4xl" fw="normal" ff="mono" fs="italic" lts="l" px="20" py="10" mbs={['-20', '-30']}>Story</Inline>
        </Center>
      </Layer>
    </Frame>
    <Wrapper contentSize="m" hasGutter mbs={['-50', '-60']} pos="relative">
      <Grid gtc="auto" g="40" bgc="base" p={['40', '50']}>
        <Stack g="30">
          <Heading level="2" class="u--trim" fz="3xl" fw="bold" ff="accent">森と暮らす、静かな時間</Heading>
          <Text class="u--trim" fz="xl" o="pp">季節の移ろいを感じる、木の道具の物語</Text>
        </Stack>
        <Flow fz="m">
          <p>
            工房は、山あいの小さな村にあります。朝は鳥の声で目を覚まし、窓を開けると森の匂いが流れ込んでくる。
            そんな場所で、私たちは毎日木と向き合っています。季節ごとに変わる森の表情は、道具の色や形にも静かに影響を与えています。
          </p>
          <p>
            使う木は、近くの山の手入れで切り出された間伐材が中心です。伐ったあとは十分に乾燥させ、木の反りや癖を見きわめてから加工に入ります。
            急がずに、木の時間に合わせること。それが、狂いの少ない道具をつくるための、いちばんの近道だと考えています。
          </p>
          <p>
            仕上げには、植物由来のオイルを何度も薄く重ねています。使い始めは淡い色をしていますが、手に触れ、光を浴びるうちに、少しずつ深い飴色へと変わっていきます。
            その変化を楽しんでいただくことも、私たちの道具の大切な一部です。
          </p>
          <p>
            森で育った木が道具になり、誰かの暮らしの中で時を重ねていく。私たちは、その長い物語の途中に立ち会っているにすぎません。
            これからも森と暮らしの間に立ち、静かな時間を届ける道具をつくり続けていきます。
          </p>
        </Flow>
      </Grid>
    </Wrapper>
  </Wrapper>
</DemoLayout>