Separate Blog and Tech sections

src/pages/index.module.css

@@ -36,9 +36,13 @@
 
 .sectionTitle {
   font-size: 1.5rem;
-  margin-bottom: 1.5rem;
-  padding-bottom: 0.5rem;
-  border-bottom: 1px solid var(--ifm-color-emphasis-200);
+  margin-bottom: 0.25rem;
+}
+
+.sectionDesc {
+  font-size: 0.9rem;
+  color: var(--ifm-color-emphasis-600);
+  margin-bottom: 1rem;
 }
 
 /* Posts */
@@ -87,6 +91,16 @@
   border-radius: 4px;
 }
 
+/* Coming Soon */
+.comingSoon {
+  padding: 2rem;
+  text-align: center;
+  color: var(--ifm-color-emphasis-500);
+  background: var(--ifm-background-surface-color);
+  border: 1px dashed var(--ifm-color-emphasis-300);
+  border-radius: 8px;
+}
+
 /* Works */
 .works {
   display: grid;

src/pages/index.tsx

@@ -16,25 +16,26 @@ function HomepageHeader() {
   );
 }
 
-function RecentPosts() {
+function RecentTech() {
   const posts = [
     {
       title: 'DGX Spark デュアル構成ガイド',
       date: '2026-02-19',
       tag: 'DGX Spark',
-      url: '/blog/dgx-spark-dual',
+      url: '/tech/dgx-spark-dual',
     },
     {
       title: 'DGX SparkでMiniMax-M2.5-REAP-172Bを動かす',
       date: '2026-02-18',
       tag: 'DGX Spark',
-      url: '/blog/dgx-spark-minimax',
+      url: '/tech/dgx-spark-minimax',
     },
   ];
 
   return (
     <section className={styles.section}>
-      <h2 className={styles.sectionTitle}>📝 最近書いたもの</h2>
+      <h2 className={styles.sectionTitle}>💻 Tech</h2>
+      <p className={styles.sectionDesc}>技術記事・検証レポート</p>
       <div className={styles.posts}>
         {posts.map((post, idx) => (
           <Link key={idx} to={post.url} className={styles.postCard}>
@@ -46,8 +47,23 @@ function RecentPosts() {
           </Link>
         ))}
       </div>
+      <Link to="/tech" className={styles.moreLink}>
+        すべて見る →
+      </Link>
+    </section>
+  );
+}
+
+function RecentBlog() {
+  return (
+    <section className={styles.section}>
+      <h2 className={styles.sectionTitle}>📝 Blog</h2>
+      <p className={styles.sectionDesc}>日常の思考・情報収集</p>
+      <div className={styles.comingSoon}>
+        <p>coming soon...</p>
+      </div>
       <Link to="/blog" className={styles.moreLink}>
-        すべての記事を見る →
+        すべて見る →
       </Link>
     </section>
   );
@@ -64,7 +80,8 @@ function Works() {
 
   return (
     <section className={styles.section}>
-      <h2 className={styles.sectionTitle}>🛠 作ったもの</h2>
+      <h2 className={styles.sectionTitle}>🛠 Works</h2>
+      <p className={styles.sectionDesc}>作ったもの</p>
       <div className={styles.works}>
         {works.map((work, idx) => (
           <a
@@ -95,7 +112,8 @@ export default function Home(): React.JSX.Element {
       <main className={styles.main}>
         <HomepageHeader />
         <div className={styles.content}>
-          <RecentPosts />
+          <RecentTech />
+          <RecentBlog />
           <Works />
         </div>
       </main>