OGP画像: タイトルをメインに、スローガンを小さく横並びに

- タイトル 48px 太字を最上部に
- スローガンは24pxで横並び（だれもが しあわせに 暮らせるまちへ）
- グラデーションカラーでアクセント

1 files changed, 25 insertions, 44 deletions

diff --git a/src/pages/og/[slug].png.ts b/src/pages/og/[slug].png.ts
index 0481681..3c695f0 100644
--- a/src/pages/og/[slug].png.ts
+++ b/src/pages/og/[slug].png.ts
@@ -74,70 +74,49 @@ export async function GET({ params }: { params: { slug: string } }) {
                 flex: "1",
               },
               children: [
-                // 3-line slogan as the main element
+                // Page title as the main element
+                {
+                  type: "div",
+                  props: {
+                    style: {
+                      fontSize: "48px",
+                      fontWeight: "700",
+                      lineHeight: "1.2",
+                      letterSpacing: "-0.02em",
+                    },
+                    children: title,
+                  },
+                },
+                // 3-line slogan (inline, smaller)
                 {
                   type: "div",
                   props: {
                     style: {
                       display: "flex",
-                      flexDirection: "column",
-                      gap: "4px",
+                      gap: "14px",
+                      fontSize: "24px",
+                      fontWeight: "500",
+                      color: "#a5b4fc",
                     },
                     children: [
+                      { type: "div", props: { children: "だれもが" } },
                       {
                         type: "div",
                         props: {
-                          style: {
-                            fontSize: "46px",
-                            fontWeight: "800",
-                            lineHeight: "1.15",
-                            color: "#ffffff",
-                          },
-                          children: "だれもが",
-                        },
-                      },
-                      {
-                        type: "div",
-                        props: {
-                          style: {
-                            fontSize: "46px",
-                            fontWeight: "800",
-                            lineHeight: "1.15",
-                            color: "#c7d2fe",
-                          },
+                          style: { color: "#c7d2fe" },
                           children: "しあわせに",
                         },
                       },
                       {
                         type: "div",
                         props: {
-                          style: {
-                            fontSize: "46px",
-                            fontWeight: "800",
-                            lineHeight: "1.15",
-                            color: "#a5b4fc",
-                          },
+                          style: { color: "#e0e7ff" },
                           children: "暮らせるまちへ",
                         },
                       },
                     ],
                   },
                 },
-                // Page title
-                {
-                  type: "div",
-                  props: {
-                    style: {
-                      fontSize: "26px",
-                      fontWeight: "500",
-                      lineHeight: "1.3",
-                      color: "#e0e7ff",
-                      paddingTop: "8px",
-                      borderTop: "1px solid rgba(255,255,255,0.15)",
-                    },
-                    children: title,
-                  },
-                },
                 // Name + domain
                 {
                   type: "div",
@@ -147,15 +126,17 @@ export async function GET({ params }: { params: { slug: string } }) {
                       gap: "16px",
                       fontSize: "20px",
                       fontWeight: "400",
-                      color: "rgba(255,255,255,0.55)",
+                      color: "rgba(255,255,255,0.45)",
+                      paddingTop: "12px",
+                      borderTop: "1px solid rgba(255,255,255,0.1)",
                     },
                     children: [
                       { type: "div", props: { children: "小平市議 安竹洋平" } },
                       {
                         type: "div",
                         props: {
-                          children: "yasutakeyohei.com",
                           style: { opacity: "0.6" },
+                          children: "yasutakeyohei.com",
                         },
                       },
                     ],