概要
中小企業向け AI 業務改善コンサル「Clair Agent」を架空クライアントと想定して制作した、ランディングページのサンプル実装です。
Hero 右側には KPI スパークライン・ライブログ・3D 視差を備える動くダッシュボード UI モックを配置し、技術力とデザイン表現力の両方が伝わるよう構成しました。Instrument Serif × Noto Sans JP の混植、レイヤード背景、マグネティックボタン、スクロールカウントアップ等のマイクロインタラクションを盛り込みつつ、Concerns → Services → Workflow → Timeline → Plans → FAQ の LP 王道セクションを一通り網羅しています。
全要素を `.ca-root` 配下にスコープし、メインサイト (biz) のスタイルと完全分離。掲載されている社名・数値・お客様の声・住所はすべて架空です。検索エンジンには `noindex` で除外設定済み。
主な機能
- 動くダッシュボード UI モック（KPI・ライブログ・3D 視差）
- マグネティックボタン・カウントアップ・スパークライン
- Hero → Concerns → Services → Workflow → Plans → FAQ の構成
- prefers-reduced-motion 対応 / レスポンシブ対応