diff --git a/.claude/hooks/branch-guard.sh b/.claude/hooks/branch-guard.sh
new file mode 100755
index 0000000..1144a2a
--- /dev/null
+++ b/.claude/hooks/branch-guard.sh
@@ -0,0 +1,33 @@
+#!/bin/bash
+# PreToolUse hook: 保護ブランチ (develop / prod / main) での直接編集をブロック
+set -euo pipefail
+
+PROTECTED_BRANCHES="^(develop|prod|main)$"
+
+# git リポジトリでない場合はスキップ
+if ! git rev-parse --git-dir >/dev/null 2>&1; then
+  exit 0
+fi
+
+BRANCH=$(git rev-parse --abbrev-ref HEAD 2>/dev/null || echo "")
+
+if [ -z "$BRANCH" ]; then
+  exit 0
+fi
+
+if echo "$BRANCH" | grep -qE "$PROTECTED_BRANCHES"; then
+  cat >&2 <<EOF
+BLOCKED: 現在 '${BRANCH}' ブランチで編集しようとしています。保護ブランチには直接コミットしないでください。
+
+feature ブランチを切ってから再度実行してください:
+
+  /branch-from-develop <topic>
+
+または
+
+  git checkout -b feature/<topic>
+EOF
+  exit 2
+fi
+
+exit 0
diff --git a/.claude/settings.json b/.claude/settings.json
index 17a029c..9624a4c 100644
--- a/.claude/settings.json
+++ b/.claude/settings.json
@@ -66,6 +66,12 @@
       {
         "matcher": "Write|Edit",
         "hooks": [
+          {
+            "type": "command",
+            "command": "$CLAUDE_PROJECT_DIR/.claude/hooks/branch-guard.sh",
+            "timeout": 5,
+            "statusMessage": "ブランチ保護チェック中..."
+          },
           {
             "type": "command",
             "command": "$CLAUDE_PROJECT_DIR/.claude/hooks/pre-edit-guard.sh",
diff --git a/app/company/page.tsx b/app/company/page.tsx
index 0f32164..eed644f 100644
--- a/app/company/page.tsx
+++ b/app/company/page.tsx
@@ -1,11 +1,22 @@
 import type { Metadata } from "next";
-import { Card, CardContent } from "@/components/ui/card";
+import Image from "next/image";
 import {
-  Table,
-  TableBody,
-  TableCell,
-  TableRow,
-} from "@/components/ui/table";
+  ArrowRight,
+  Briefcase,
+  Building2,
+  Calculator,
+  Calendar,
+  Coins,
+  Cpu,
+  Hash,
+  MapPin,
+  Phone,
+  Sparkles,
+  TrendingUp,
+  User,
+} from "lucide-react";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Separator } from "@/components/ui/separator";
 
 export const metadata: Metadata = {
   title: "会社概要",
@@ -13,131 +24,264 @@ export const metadata: Metadata = {
     "株式会社 Ic-Growth の会社概要。所在地、設立、代表者、事業内容などをご案内します。",
 };
 
-const rows: { label: string; content: React.ReactNode }[] = [
+const CONTACT_FORM_URL =
+  "https://docs.google.com/forms/d/e/1FAIpQLScEXuDiU9GfCsL2Q4nmK9En8xLd8UzVYR6B95K9IKwNAL6GTQ/viewform";
+
+const MAP_QUERY = "東京都板橋区志村1-30-15";
+
+const heroFacts = [
   {
-    label: "会社名",
-    content: (
-      <>
-        <span className="block text-xs text-muted-foreground">
-          アイシイグロウス
-        </span>
-        株式会社 Ｉｃ－Ｇｒｏｗｔｈ
-      </>
-    ),
+    icon: Building2,
+    label: "Company",
+    value: "株式会社 Ｉｃ－Ｇｒｏｗｔｈ",
+    sub: "アイシイグロウス",
+  },
+  {
+    icon: Calendar,
+    label: "Founded",
+    value: "2020年1月22日",
+    sub: "令和2年",
   },
-  { label: "法人番号", content: "8011401022351" },
   {
-    label: "住所",
+    icon: User,
+    label: "Representative",
+    value: "前田 剛",
+    sub: "代表取締役",
+  },
+] as const;
+
+const detailRows = [
+  { icon: Hash, label: "法人番号", content: "8011401022351" },
+  {
+    icon: MapPin,
+    label: "本社所在地",
     content: (
       <>
-        <strong className="text-foreground">本社:</strong>
-        <br />
         〒174-0056
         <br />
         東京都板橋区志村１丁目３０番１５号
-        <br />
-        <br />
-        Tel:03-3960-3311
       </>
     ),
   },
-  { label: "設立", content: "令和2年（2020年）1月22日" },
-  { label: "代表者", content: "前田 剛" },
-  { label: "資本金", content: "800千円（2024年月日現在）" },
   {
-    label: "事業内容",
+    icon: Phone,
+    label: "電話番号",
     content: (
-      <>
-        経理支援
-        <br />
-        経理システムの導入支援
-        <br />
-        経理分析
-      </>
+      <a
+        href="tel:03-3960-3311"
+        className="text-foreground transition-colors hover:text-primary"
+      >
+        03-3960-3311
+      </a>
     ),
   },
+  { icon: Coins, label: "資本金", content: "800千円（2024年現在）" },
   {
-    label: "弊社サービス",
-    content: (
-      <>
-        <strong className="text-foreground">【経理システム導入支援】</strong>
-        <br />
-        ・勤怠管理システム導入支援
-        <br />
-        ・給与計算システム導入支援
-        <br />
-        ・会計システム導入支援
-        <br />
-        ・請求書発行システム導入支援
-        <br />
-        ・経費精算システム導入支援
-        <br />
-        ・証憑管理システム導入支援
-        <br />
-        ・証憑データ化システム導入支援
-        <br />
-        <br />
-        <strong className="text-foreground">【経理支援】</strong>
-        <br />
-        ・会計データ作成業務
-        <br />
-        ・経理指導
-        <br />
-        ・請求書発行業務
-        <br />
-        ・受取請求書等整理業務
-        <br />
-        ・給与計算業務
-        <br />
-        <br />
-        <strong className="text-foreground">【経営支援】</strong>
-        <br />
-        ・連絡ツール導入支援
-        <br />
-        ・その他システムのご案内
-        <br />
-        ・MAS（経営アドバイザリーサービス）
-        <br />
-        <br />
-        <strong className="text-foreground">【その他】</strong>
-        <br />
-        ・生命保険業務
-        <br />
-        ・相続時資料回収業務
-      </>
-    ),
+    icon: Briefcase,
+    label: "事業内容",
+    content: "経理支援 / 経理システムの導入支援 / 経理分析",
+  },
+] as const;
+
+const serviceCategories = [
+  {
+    icon: Cpu,
+    title: "経理システム導入支援",
+    items: [
+      "勤怠管理システム",
+      "給与計算システム",
+      "会計システム",
+      "請求書発行システム",
+      "経費精算システム",
+      "証憑管理システム",
+      "証憑データ化システム",
+    ],
+  },
+  {
+    icon: Calculator,
+    title: "経理支援",
+    items: [
+      "会計データ作成業務",
+      "経理指導",
+      "請求書発行業務",
+      "受取請求書等整理業務",
+      "給与計算業務",
+    ],
   },
-];
+  {
+    icon: TrendingUp,
+    title: "経営支援",
+    items: [
+      "連絡ツール導入支援",
+      "その他システムのご案内",
+      "MAS（経営アドバイザリーサービス）",
+    ],
+  },
+  {
+    icon: Sparkles,
+    title: "その他",
+    items: ["生命保険業務", "相続時資料回収業務"],
+  },
+] as const;
 
 export default function CompanyPage() {
   return (
-    <div className="bg-gradient-to-b from-muted to-background">
-      <div className="mx-auto max-w-4xl px-5 py-14 md:py-20">
-        <h1 className="mb-10 text-center text-3xl font-bold tracking-wide text-brand-success md:text-4xl">
-          会 社 概 要
-        </h1>
-        <Card className="overflow-hidden">
-          <CardContent className="px-0">
-            <Table className="text-base">
-              <TableBody>
-                {rows.map((row) => (
-                  <TableRow
-                    key={row.label}
-                    className="hover:bg-transparent has-aria-expanded:bg-transparent"
-                  >
-                    <TableCell className="w-32 bg-muted/60 px-5 py-5 align-top font-bold whitespace-normal text-foreground md:w-48">
-                      {row.label}
-                    </TableCell>
-                    <TableCell className="px-5 py-5 align-top leading-loose whitespace-normal text-foreground">
-                      {row.content}
-                    </TableCell>
-                  </TableRow>
-                ))}
-              </TableBody>
-            </Table>
-          </CardContent>
-        </Card>
-      </div>
+    <div>
+      {/* Hero */}
+      <section className="bg-gradient-to-b from-muted to-background px-5 pt-12 pb-12 md:pt-16 md:pb-16">
+        <div className="mx-auto max-w-5xl">
+          <p className="text-center text-sm font-semibold tracking-[0.3em] text-brand-accent uppercase">
+            About Us
+          </p>
+          <h1 className="mt-3 mb-10 text-center text-3xl font-bold tracking-wide text-brand-success md:text-4xl">
+            会 社 概 要
+          </h1>
+          <div className="mb-12 flex justify-center">
+            <Image
+              src="/images/Ic-Growth_color_1.png"
+              alt="Ic-Growth ロゴ"
+              width={500}
+              height={250}
+              priority
+              className="h-auto w-[200px] md:w-[260px]"
+            />
+          </div>
+          <div className="grid gap-4 md:grid-cols-3 md:gap-6">
+            {heroFacts.map((fact) => (
+              <Card key={fact.label}>
+                <CardHeader className="pt-5">
+                  <fact.icon className="size-5 text-brand-accent" />
+                  <CardTitle className="text-xs font-semibold tracking-widest text-muted-foreground uppercase">
+                    {fact.label}
+                  </CardTitle>
+                </CardHeader>
+                <CardContent className="pb-5">
+                  <p className="text-lg leading-snug font-bold text-foreground md:text-xl">
+                    {fact.value}
+                  </p>
+                  {fact.sub && (
+                    <p className="mt-1 text-xs text-muted-foreground">
+                      {fact.sub}
+                    </p>
+                  )}
+                </CardContent>
+              </Card>
+            ))}
+          </div>
+        </div>
+      </section>
+
+      {/* Basic info */}
+      <section className="bg-background px-5 py-14 md:py-16">
+        <div className="mx-auto max-w-3xl">
+          <h2 className="mb-2 text-xl font-bold text-brand-success md:text-2xl">
+            基本情報
+          </h2>
+          <Separator className="mb-8 max-w-12 bg-brand-accent" />
+          <dl className="divide-y divide-border">
+            {detailRows.map((row) => (
+              <div
+                key={row.label}
+                className="grid grid-cols-1 gap-2 py-5 md:grid-cols-[180px_1fr] md:gap-6"
+              >
+                <dt className="flex items-center gap-2 text-sm font-bold text-muted-foreground">
+                  <row.icon className="size-4 text-brand-accent" />
+                  {row.label}
+                </dt>
+                <dd className="leading-loose text-foreground">{row.content}</dd>
+              </div>
+            ))}
+          </dl>
+        </div>
+      </section>
+
+      {/* Services */}
+      <section className="bg-muted px-5 py-14 md:py-20">
+        <div className="mx-auto max-w-6xl">
+          <p className="text-center text-sm font-semibold tracking-[0.3em] text-brand-accent uppercase">
+            Our Services
+          </p>
+          <h2 className="mt-3 mb-10 text-center text-2xl font-bold text-brand-success md:text-3xl">
+            弊社サービス
+          </h2>
+          <div className="grid gap-5 md:grid-cols-2 md:gap-6">
+            {serviceCategories.map((cat) => (
+              <Card key={cat.title}>
+                <CardHeader>
+                  <div className="flex items-center gap-3">
+                    <span className="flex size-10 items-center justify-center rounded-md bg-primary/10 text-primary">
+                      <cat.icon className="size-5" />
+                    </span>
+                    <CardTitle className="text-base font-bold text-foreground md:text-lg">
+                      {cat.title}
+                    </CardTitle>
+                  </div>
+                </CardHeader>
+                <CardContent className="pb-6">
+                  <ul className="space-y-2.5">
+                    {cat.items.map((item) => (
+                      <li
+                        key={item}
+                        className="flex items-start gap-2.5 text-sm leading-relaxed text-muted-foreground"
+                      >
+                        <span className="mt-2 size-1.5 shrink-0 rounded-full bg-brand-accent" />
+                        <span>{item}</span>
+                      </li>
+                    ))}
+                  </ul>
+                </CardContent>
+              </Card>
+            ))}
+          </div>
+        </div>
+      </section>
+
+      {/* Access & CTA */}
+      <section className="bg-background px-5 py-14 md:py-20">
+        <div className="mx-auto grid max-w-6xl gap-8 md:grid-cols-2 md:gap-12">
+          <div>
+            <p className="text-sm font-semibold tracking-[0.3em] text-brand-accent uppercase">
+              Access
+            </p>
+            <h2 className="mt-3 mb-2 text-2xl font-bold text-brand-success md:text-3xl">
+              本社所在地
+            </h2>
+            <Separator className="mb-6 max-w-12 bg-brand-accent" />
+            <p className="leading-loose text-foreground">
+              〒174-0056
+              <br />
+              東京都板橋区志村１丁目３０番１５号
+            </p>
+            <a
+              href="tel:03-3960-3311"
+              className="mt-6 inline-flex items-center gap-2 text-lg font-bold text-foreground transition-colors hover:text-primary"
+            >
+              <Phone className="size-5 text-[#5fc061]" />
+              03-3960-3311
+            </a>
+            <div className="mt-8">
+              <a
+                href={CONTACT_FORM_URL}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="inline-flex items-center gap-2 rounded-md bg-primary px-6 py-3 text-sm font-bold text-primary-foreground shadow-sm transition-colors hover:bg-primary/90"
+              >
+                お問い合わせフォーム
+                <ArrowRight className="size-4" />
+              </a>
+            </div>
+          </div>
+          <div className="overflow-hidden rounded-xl ring-1 ring-border">
+            <iframe
+              src={`https://maps.google.com/maps?q=${encodeURIComponent(MAP_QUERY)}&output=embed`}
+              title="Ic-Growth 本社地図"
+              className="aspect-square w-full md:aspect-auto md:h-full md:min-h-[400px]"
+              loading="lazy"
+              referrerPolicy="no-referrer-when-downgrade"
+            />
+          </div>
+        </div>
+      </section>
     </div>
   );
 }
diff --git a/app/components/SectionComponent1.tsx b/app/components/SectionComponent1.tsx
index ac86083..9fbdc38 100644
--- a/app/components/SectionComponent1.tsx
+++ b/app/components/SectionComponent1.tsx
@@ -5,7 +5,7 @@ export default function SectionComponent1() {
     <section className="relative overflow-hidden bg-gradient-to-b from-muted to-background px-5 py-16 md:px-10 md:py-24">
       <div className="mx-auto flex min-h-[60vh] max-w-6xl flex-col items-center gap-12 md:flex-row">
         <div className="flex-1 space-y-6 text-center md:text-left">
-          <p className="text-sm font-semibold tracking-[0.3em] text-primary uppercase">
+          <p className="text-sm font-semibold tracking-[0.3em] text-brand-accent uppercase">
             Accounting Transformation
           </p>
           <h1 className="text-3xl leading-tight font-bold text-foreground md:text-4xl lg:text-5xl">
diff --git a/app/globals.css b/app/globals.css
index 483853f..5de0c79 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -13,22 +13,26 @@
     "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", system-ui, sans-serif;
 }
 
-html {
-  scroll-behavior: smooth;
-  scroll-padding-top: 75px;
-}
+@layer base {
+  html {
+    scroll-behavior: smooth;
+    scroll-padding-top: 75px;
+  }
 
-body {
-  padding-top: 75px;
-}
+  body {
+    padding-top: 75px;
+  }
 
-a {
-  color: inherit;
-  text-decoration: none;
+  a {
+    color: inherit;
+    text-decoration: none;
+  }
 }
 
 @theme inline {
-  --font-heading: var(--font-sans);
+  --font-heading:
+    var(--font-zen-kaku), "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo",
+    system-ui, sans-serif;
   --color-sidebar-ring: var(--sidebar-ring);
   --color-sidebar-border: var(--sidebar-border);
   --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
@@ -148,6 +152,11 @@ a {
   html {
     @apply font-sans;
   }
+  h1,
+  h2,
+  h3 {
+    font-family: var(--font-heading);
+  }
 }
 
 @keyframes ring {
diff --git a/app/layout.tsx b/app/layout.tsx
index 40452bb..726fe9f 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,9 +1,17 @@
 import type { Metadata } from "next";
+import { Zen_Kaku_Gothic_New } from "next/font/google";
 import "./globals.css";
 import Header from "./components/Header";
 import Footer from "./components/Footer";
 import ScrollToTop from "./components/ScrollToTop";
 
+const zenKaku = Zen_Kaku_Gothic_New({
+  subsets: ["latin"],
+  weight: ["500", "700", "900"],
+  variable: "--font-zen-kaku",
+  display: "swap",
+});
+
 const SITE_NAME = "Ic-Growth";
 const SITE_URL = "https://www.ic-gr.net";
 const SITE_DESCRIPTION =
@@ -37,7 +45,7 @@ export default function RootLayout({
   children: React.ReactNode;
 }) {
   return (
-    <html lang="ja">
+    <html lang="ja" className={zenKaku.variable}>
       <body className="min-h-screen flex flex-col">
         <ScrollToTop />
         <Header />
diff --git a/app/overview/page.tsx b/app/overview/page.tsx
index 198127d..6a37398 100644
--- a/app/overview/page.tsx
+++ b/app/overview/page.tsx
@@ -1,7 +1,13 @@
 import type { Metadata } from "next";
+import type { ComponentType } from "react";
 import Link from "next/link";
-import Image from "next/image";
-import { ArrowRight } from "lucide-react";
+import {
+  ArrowRight,
+  Calculator,
+  Cpu,
+  Phone,
+  TrendingUp,
+} from "lucide-react";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Separator } from "@/components/ui/separator";
 
@@ -11,122 +17,117 @@ export const metadata: Metadata = {
     "Ic-Growth が提供する経理システムの導入支援、経理支援、経営アドバイザリーサービスについてご紹介します。",
 };
 
-const cards = [
-  {
-    href: "#system-support",
-    src: "/images/backup_system.png",
-    alt: "経理システムの導入支援",
-    title: "経理システムの導入支援",
-  },
-  {
-    href: "#business-support",
-    src: "/images/backup_ec.png",
-    alt: "経理支援アイコン",
-    title: "経理支援",
-  },
-  {
-    href: "#msa-support",
-    src: "/images/MAS.png",
-    alt: "MAS",
-    title: "経営アドバイザリーサービス",
-  },
-] as const;
+const CONTACT_FORM_URL =
+  "https://docs.google.com/forms/d/e/1FAIpQLScEXuDiU9GfCsL2Q4nmK9En8xLd8UzVYR6B95K9IKwNAL6GTQ/viewform";
+
+type IconComponent = ComponentType<{ className?: string }>;
 
-const sections = [
+type Service = {
+  id: string;
+  number: string;
+  icon: IconComponent;
+  title: string;
+  lede: string;
+  features: string[];
+  extras?: { number: string; title: string; body: string }[];
+};
+
+const services: Service[] = [
   {
     id: "business-support",
-    eyebrow: "Service 01",
+    number: "01",
+    icon: Calculator,
     title: "経理支援",
-    bg: "bg-muted",
-    body: (
-      <>
-        <p className="leading-loose text-muted-foreground">
-          経理の人材不足が中小企業経営に大きな課題をもたらしています。新しいシステムの導入後の不慣れな時期や経理担当者の一時的な不在時に備え、様々なサービスをご用意しております。
-        </p>
-        <ul className="list-disc space-y-3 pl-6 leading-loose text-muted-foreground">
-          <li>
-            新しいシステムを正しく活用できるスキルと知識を習得していく過程をサポートいたします。
-          </li>
-          <li>
-            AIの活用には数か月分のデータの登録が必要です。
-            <br />
-            初期段階は弊社にて会計データの作成をお手伝い、その後正しくAIを活用できるようにサポートいたします。
-          </li>
-          <li>
-            経理自動化後も経理業務には時間と手間を要します。
-            <br />
-            経理担当者が戦略的な業務に集中できるよう弊社にて会計データ作成を継続することも可能です。
-          </li>
-          <li>請求書の発行、支払請求書の整理などのお手伝いをいたします。</li>
-          <li>給与計算業務のお手伝いをいたします。</li>
-        </ul>
-      </>
-    ),
+    lede: "経理人材の不足や担当者の不在に対して、スキル習得から実務運用まで伴走支援します。",
+    features: [
+      "新しいシステムを正しく活用するスキルと知識の習得をサポート",
+      "AI 活用に必要な初期データを弊社で作成、運用に乗せるまで伴走",
+      "自動化後も会計データ作成を継続し、経理担当者が戦略業務に集中できる環境を維持",
+      "請求書発行・支払請求書整理の代行",
+      "給与計算業務の代行",
+    ],
   },
   {
     id: "system-support",
-    eyebrow: "Service 02",
-    title: "経理システム導入支援（経理の自動化）",
-    bg: "bg-background",
-    body: (
-      <>
-        <p className="leading-loose text-muted-foreground">
-          <strong className="text-foreground">経理の自動化</strong>
-          は、多くの企業や組織にとって欠かせない取り組みとなっています。経理や会計の状況が健全であること、すなわち
-          <strong className="text-foreground">正確性</strong>や
-          <strong className="text-foreground">迅速性</strong>、そして
-          <strong className="text-foreground">透明性</strong>
-          を備えていることは、経営において非常に重要な要素です。
-        </p>
-        <ul className="list-disc space-y-3 pl-6 leading-loose text-muted-foreground">
-          <li>
-            従来の手作業による経理業務は、多くの時間と労力を必要とします。
-          </li>
-          <li>人間による手作業は、エラーやミスの発生が避けられません。</li>
-          <li>
-            意思決定プロセスの改善や戦略的な判断のため迅速な会計データを共有できます。
-          </li>
-          <li>税法や会計基準は頻繁に変更されます。</li>
-          <li>レポートや分析データを自動的に生成できます。</li>
-        </ul>
-      </>
-    ),
+    number: "02",
+    icon: Cpu,
+    title: "経理システム導入支援",
+    lede: "「経理の自動化」で、正確性・迅速性・透明性を備えた会計基盤を構築します。",
+    features: [
+      "手作業に頼らない、時間と労力のかからない経理業務の実現",
+      "人為的なエラー・ミスを構造的に削減",
+      "意思決定に必要な会計データをリアルタイムに共有",
+      "税法や会計基準の変更にシステム側で追従",
+      "レポート・分析データの自動生成",
+    ],
+  },
+  {
+    id: "msa-support",
+    number: "03",
+    icon: TrendingUp,
+    title: "経営アドバイザリーサービス（MAS）",
+    lede: "正確かつ迅速・明瞭な会計を前提に、経営者の戦略的意思決定を伴走支援します。",
+    features: [
+      "市場動向・リスク・成長機会まで含む戦略立案の壁打ち",
+      "P/L・B/S の将来像から資源最適化と事業戦略を逆算",
+      "新規投資・組織再編・新規事業の資金計画",
+      "短中長期のキャッシュフロー管理を財務会計・管理会計の両面から助言",
+      "戦略意思決定とキャッシュフロー管理の継続的フィードバック",
+    ],
+    extras: [
+      {
+        number: "01",
+        title: "戦略的意思決定のサポート",
+        body: "経営陣に会計データを共有しながら、市場動向・リスク・成長機会も踏まえた戦略立案をともに行い、企業の競争力と成長を支えます。P/L・B/S の将来像を必要に応じて細分化し、事業の拡大・縮小・統合・連携につながるコーチングを提供します。",
+      },
+      {
+        number: "02",
+        title: "資金調達と運用の管理サポート",
+        body: "新規設備投資・組織再編・新規プロジェクトの資金計画から、通常運転資金と短中長期にわたるキャッシュフロー管理まで、財務会計・管理会計の両面から戦略的にアドバイスします。戦略的意思決定とフィードバックし合うことで、相互に重要な影響を及ぼす関係を築きます。",
+      },
+    ],
   },
-] as const;
+];
 
 export default function OverviewPage() {
   return (
     <div>
-      <section className="bg-gradient-to-b from-muted to-background px-5 py-12 md:py-16">
+      {/* Hero */}
+      <section className="bg-gradient-to-b from-muted to-background px-5 pt-12 pb-12 md:pt-16 md:pb-16">
         <div className="mx-auto max-w-6xl">
-          <h1 className="mb-10 text-center text-3xl font-bold tracking-wide text-brand-success md:text-4xl">
+          <p className="text-center text-sm font-semibold tracking-[0.3em] text-brand-accent uppercase">
+            Our Services
+          </p>
+          <h1 className="mt-3 mb-6 text-center text-3xl font-bold tracking-wide text-brand-success md:text-4xl">
             事 業 概 要
           </h1>
+          <p className="mx-auto mb-12 max-w-3xl text-center leading-loose text-muted-foreground md:text-lg">
+            会計をエネルギーに変える 3 本柱で、企業の経理基盤と意思決定を支えます。
+          </p>
 
           <div className="grid gap-6 md:grid-cols-3 md:gap-8">
-            {cards.map((card) => (
+            {services.map((service) => (
               <Link
-                key={card.href}
-                href={card.href}
+                key={service.id}
+                href={`#${service.id}`}
                 className="group block focus-visible:outline-none"
               >
                 <Card className="h-full transition-all duration-300 group-hover:-translate-y-1.5 group-hover:shadow-xl group-focus-visible:ring-3 group-focus-visible:ring-primary/40">
-                  <CardHeader className="items-center pt-2">
-                    <div className="flex justify-center">
-                      <Image
-                        src={card.src}
-                        alt={card.alt}
-                        width={100}
-                        height={100}
-                        className="h-24 w-24 object-contain"
-                      />
+                  <CardHeader className="pt-5">
+                    <div className="flex items-center gap-3">
+                      <span className="flex size-12 items-center justify-center rounded-md bg-primary/10 text-primary">
+                        <service.icon className="size-6" />
+                      </span>
+                      <span className="text-xs font-semibold tracking-widest text-brand-accent uppercase">
+                        Service {service.number}
+                      </span>
                     </div>
                   </CardHeader>
-                  <CardContent className="pb-6 text-center">
-                    <CardTitle className="text-lg text-foreground md:text-xl">
-                      {card.title}
+                  <CardContent className="pb-6">
+                    <CardTitle className="mb-3 text-base font-bold text-foreground md:text-lg">
+                      {service.title}
                     </CardTitle>
-                    <span className="mt-3 inline-flex items-center gap-1 text-sm text-primary">
+                    <span className="inline-flex items-center gap-1 text-sm text-primary">
                       詳しく見る
                       <ArrowRight className="size-4 transition-transform group-hover:translate-x-1" />
                     </span>
@@ -138,85 +139,99 @@ export default function OverviewPage() {
         </div>
       </section>
 
-      {sections.map((section) => (
+      {/* Service detail blocks */}
+      {services.map((service, idx) => (
         <section
-          key={section.id}
-          id={section.id}
-          className={`${section.bg} px-5 py-14 md:px-8 md:py-20`}
+          key={service.id}
+          id={service.id}
+          className={`scroll-mt-24 px-5 py-16 md:px-8 md:py-20 ${idx % 2 === 0 ? "bg-muted" : "bg-background"}`}
         >
-          <div className="mx-auto max-w-4xl space-y-5">
+          <div className="mx-auto grid max-w-6xl gap-10 md:grid-cols-[280px_1fr] md:gap-16">
             <div>
-              <p className="text-sm font-semibold tracking-widest text-primary uppercase">
-                {section.eyebrow}
-              </p>
-              <h2 className="mt-2 text-2xl font-bold text-brand-success md:text-3xl">
-                {section.title}
+              <div className="flex items-center gap-3">
+                <span className="flex size-10 items-center justify-center rounded-md bg-primary/10 text-primary">
+                  <service.icon className="size-5" />
+                </span>
+                <span className="text-xs font-semibold tracking-widest text-brand-accent uppercase">
+                  Service {service.number}
+                </span>
+              </div>
+              <h2 className="mt-4 text-2xl font-bold text-brand-success md:text-3xl">
+                {service.title}
               </h2>
-              <Separator className="mt-4 max-w-16 bg-primary" />
+              <Separator className="mt-4 max-w-12 bg-brand-accent" />
+              <p className="mt-6 leading-loose text-muted-foreground">
+                {service.lede}
+              </p>
+            </div>
+            <div>
+              <ul className="space-y-3">
+                {service.features.map((item) => (
+                  <li
+                    key={item}
+                    className="flex items-start gap-3 leading-relaxed text-foreground"
+                  >
+                    <span className="mt-2.5 size-1.5 shrink-0 rounded-full bg-brand-accent" />
+                    <span>{item}</span>
+                  </li>
+                ))}
+              </ul>
+
+              {service.extras && (
+                <div className="mt-10 grid gap-5 md:grid-cols-2">
+                  {service.extras.map((extra) => (
+                    <Card key={extra.number}>
+                      <CardHeader className="pt-5">
+                        <span className="text-xs font-semibold tracking-widest text-brand-accent uppercase">
+                          Case {extra.number}
+                        </span>
+                        <CardTitle className="text-base leading-snug font-bold text-foreground md:text-lg">
+                          {extra.title}
+                        </CardTitle>
+                      </CardHeader>
+                      <CardContent className="pb-6">
+                        <p className="leading-loose text-muted-foreground">
+                          {extra.body}
+                        </p>
+                      </CardContent>
+                    </Card>
+                  ))}
+                </div>
+              )}
             </div>
-            {section.body}
           </div>
         </section>
       ))}
 
-      <section id="msa-support" className="bg-muted px-5 py-14 md:px-8 md:py-20">
-        <div className="mx-auto max-w-4xl space-y-5">
-          <div>
-            <p className="text-sm font-semibold tracking-widest text-primary uppercase">
-              Service 03
-            </p>
-            <h2 className="mt-2 text-2xl font-bold text-brand-success md:text-3xl">
-              経営支援
-            </h2>
-            <h3 className="mt-2 text-lg font-semibold text-brand-success">
-              MAS（経営アドバイザリーサービス）
-            </h3>
-            <Separator className="mt-4 max-w-16 bg-primary" />
-          </div>
-          <p className="leading-loose text-muted-foreground">
-            経営アドバイザリーサービスは、企業や組織にとって非常に重要な役割を果たすものです。
-            <br />
-            <br />
-            ただし経営者が戦略的意思決定をするヒントになる鍵は、経理、会計のコンディションが優良であること、すなわち経理処理が正確かつスピーディであり、さらに明瞭であることが前提条件となります。
-            <br />
-            <br />
-            具体的なサービス内容は各企業、経営者に応じて多種多様なものとなりますが、
-            <br />
-            次の2項目が代表的な弊社の関与事例となっております。
+      {/* CTA */}
+      <section className="bg-background px-5 py-16 md:py-20">
+        <div className="mx-auto max-w-3xl text-center">
+          <p className="text-sm font-semibold tracking-[0.3em] text-brand-accent uppercase">
+            Contact
           </p>
-
-          <div className="grid gap-6 md:grid-cols-2">
-            <Card>
-              <CardHeader>
-                <CardTitle className="text-lg text-foreground">
-                  戦略的意思決定のサポート
-                </CardTitle>
-              </CardHeader>
-              <CardContent className="space-y-3 pb-6 leading-loose text-muted-foreground">
-                <p>
-                  企業の経営陣に対して、会計データを共有しながら戦略的な意思決定を促します。
-                  さらに会計データに留まらず市場動向、情勢、リスク、成長機会などの情報も共有しながら、最適な戦略を一緒に考え企業の競争力を維持し、成長戦略を展開するのに役立てます。
-                </p>
-                <p>
-                  また損益計算書、貸借対照表の将来像を経営戦略に落とし込んでいくイメージでデータを必要に応じて細分化、経営資源を最適に活用、加えて事業の拡大・縮小・統合・連携等に繋がるようにコーチングして参ります。
-                </p>
-              </CardContent>
-            </Card>
-            <Card>
-              <CardHeader>
-                <CardTitle className="text-lg text-foreground">
-                  資金調達と運用に関する管理サポート
-                </CardTitle>
-              </CardHeader>
-              <CardContent className="space-y-3 pb-6 leading-loose text-muted-foreground">
-                <p>
-                  新規設備投資、法人の組織再編、新しいプロジェクトに関する資金計画だけでなく、通常の運転資金と短中長期にわたるキャッシュフロー管理を財務会計、管理会計の両面から戦略的なアドバイスを提供します。
-                </p>
-                <p>
-                  このキャッシュフロー管理と前者の戦略的意思決定とはお互いにフィードバックすることを通して重要な影響を及ぼしあう関係性を持ちます。
-                </p>
-              </CardContent>
-            </Card>
+          <h2 className="mt-3 text-2xl font-bold text-brand-success md:text-3xl">
+            ご相談はこちらから
+          </h2>
+          <p className="mt-4 leading-loose text-muted-foreground">
+            まずはお気軽にお問い合わせください。
+          </p>
+          <div className="mt-8 flex flex-col items-center justify-center gap-4 sm:flex-row">
+            <a
+              href={CONTACT_FORM_URL}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="inline-flex items-center gap-2 rounded-md bg-primary px-6 py-3 text-sm font-bold text-primary-foreground shadow-sm transition-colors hover:bg-primary/90"
+            >
+              お問い合わせフォーム
+              <ArrowRight className="size-4" />
+            </a>
+            <a
+              href="tel:03-3960-3311"
+              className="inline-flex items-center gap-2 text-lg font-bold text-foreground transition-colors hover:text-primary"
+            >
+              <Phone className="size-5 text-[#5fc061]" />
+              03-3960-3311
+            </a>
           </div>
         </div>
       </section>
diff --git a/app/privacy/page.tsx b/app/privacy/page.tsx
index 1dba6a6..7072484 100644
--- a/app/privacy/page.tsx
+++ b/app/privacy/page.tsx
@@ -92,7 +92,7 @@ export default function PrivacyPage() {
         <h1 className="mb-3 text-center text-2xl font-bold text-brand-success md:text-3xl">
           個人情報保護方針について
         </h1>
-        <Separator className="mx-auto mb-8 max-w-16 bg-primary" />
+        <Separator className="mx-auto mb-8 max-w-16 bg-brand-accent" />
         <p className="mb-10 text-muted-foreground">
           株式会社Ｉｃ－Ｇｒｏｗｔｈ（以下「当社」）は、以下のとおり個人情報保護方針を定め、個人情報保護の仕組みを構築し、全従業員に個人情報保護の重要性の認識と取組みを徹底させることにより、個人情報の保護を推進致します。
         </p>
diff --git a/package.json b/package.json
index d6c84fb..1e7cc8d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ic-gr-website",
-  "version": "2.0.1",
+  "version": "2.1.0",
   "private": true,
   "engines": {
     "node": ">=22.0.0"
@@ -34,4 +34,4 @@
     "tailwindcss": "^4.0.0",
     "typescript": "^5.7.0"
   }
-}
+}
\ No newline at end of file