38 lines
1.5 KiB
TypeScript
38 lines
1.5 KiB
TypeScript
import TarotReadingClient from './TarotReadingClient';
|
|
|
|
// 타로 리딩 공개 라우트 — 서버 Hero(라이트 관용구, app/showcase 참고) + 클라이언트 리딩 마운트.
|
|
|
|
const KOR_BODY = { letterSpacing: '-0.01em' } as const;
|
|
|
|
export default function TarotPage() {
|
|
return (
|
|
<>
|
|
<section style={{ background: 'var(--jsm-surface)' }}>
|
|
<div className="mx-auto max-w-6xl px-6 pt-20 pb-16 lg:px-8 lg:pt-28 lg:pb-20">
|
|
<div className="max-w-2xl">
|
|
<span
|
|
className="inline-flex items-center gap-2 font-mono text-[11px] uppercase tracking-[0.22em]"
|
|
style={{ color: 'var(--jsm-accent)' }}
|
|
>
|
|
<span className="inline-block h-1 w-1 rounded-full" style={{ background: 'var(--jsm-accent)' }} />
|
|
tarot reading
|
|
</span>
|
|
<h1
|
|
className="mt-6 font-extrabold break-keep"
|
|
style={{ color: 'var(--jsm-ink)', fontSize: 'clamp(2.3rem, 6vw, 3.6rem)', lineHeight: 1.1, letterSpacing: '-0.035em' }}
|
|
>
|
|
타로 리딩
|
|
<span style={{ color: 'var(--jsm-accent)' }}>.</span>
|
|
</h1>
|
|
<p className="mt-7 break-keep text-lg leading-relaxed" style={{ color: 'var(--jsm-ink-soft)', ...KOR_BODY }}>
|
|
3장의 카드로 과거·현재·미래의 흐름을 읽습니다.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<TarotReadingClient />
|
|
</>
|
|
);
|
|
}
|