섹션 레이아웃 및 템플릿 스타일 개선

src/app/editor/templates/blogTemplate.ts

@@ -17,6 +17,11 @@ export function createBlogTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "default",
     paddingY: "lg",
+    // 블로그 리스트는 넓은 폭과 충분한 카드 간격을 사용한다.
+    paddingYPx: 72,
+    maxWidthPx: 1120,
+    gapXPx: 32,
+    backgroundColorCustom: "#020617",
     columns,
   } as any;
 

src/app/editor/templates/ctaTemplate.ts

@@ -15,6 +15,11 @@ export function createCtaTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "primary",
     paddingY: "md",
+    // CTA 는 강한 색상과 적당한 여백, 비교적 좁은 폭을 사용한다.
+    paddingYPx: 64,
+    maxWidthPx: 960,
+    gapXPx: 24,
+    backgroundColorCustom: "#0c4a6e",
     columns,
   } as any;
 

src/app/editor/templates/faqTemplate.ts

@@ -15,6 +15,10 @@ export function createFaqTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "default",
     paddingY: "md",
+    // FAQ 는 비교적 좁은 폭과 보통 여백을 사용한다.
+    paddingYPx: 56,
+    maxWidthPx: 720,
+    backgroundColorCustom: "#020617",
     columns,
   } as any;
 

src/app/editor/templates/featuresTemplate.ts

@@ -17,6 +17,11 @@ export function createFeaturesTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "muted",
     paddingY: "md",
+    // 기능 리스트는 비교적 넓은 폭과 보통 수준의 여백을 사용한다.
+    paddingYPx: 72,
+    maxWidthPx: 1040,
+    gapXPx: 32,
+    backgroundColorCustom: "#0f172a",
     columns,
   } as any;
 

src/app/editor/templates/footerTemplate.ts

@@ -15,6 +15,10 @@ export function createFooterTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "muted",
     paddingY: "md",
+    // 푸터는 상대적으로 낮은 높이와 좁은 최대 폭을 사용한다.
+    paddingYPx: 40,
+    maxWidthPx: 800,
+    backgroundColorCustom: "#020617",
     columns,
   } as any;
 

src/app/editor/templates/heroTemplate.ts

@@ -16,6 +16,11 @@ export function createHeroTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "default",
     paddingY: "lg",
+    // 히어로는 가장 여백이 넓고 화면 중앙에 집중되도록 설정한다.
+    paddingYPx: 96,
+    maxWidthPx: 960,
+    gapXPx: 40,
+    backgroundColorCustom: "#020617", // 다크 히어로 섹션
     columns: [
       {
         id: `${sectionId}_col_1`,

src/app/editor/templates/pricingTemplate.ts

@@ -17,6 +17,11 @@ export function createPricingTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "muted",
     paddingY: "lg",
+    // 요금제는 꽤 넓은 여백과 넓은 최대 폭, 넉넉한 컬럼 간격을 사용한다.
+    paddingYPx: 88,
+    maxWidthPx: 1120,
+    gapXPx: 40,
+    backgroundColorCustom: "#0f172a",
     columns,
   } as any;
 

src/app/editor/templates/teamTemplate.ts

@@ -17,6 +17,11 @@ export function createTeamTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "muted",
     paddingY: "lg",
+    // 팀 섹션은 보라 계열 배경과 넓은 폭, 보통 간격을 사용한다.
+    paddingYPx: 80,
+    maxWidthPx: 1120,
+    gapXPx: 32,
+    backgroundColorCustom: "#1e1b4b", // 보라/인디고 계열
     columns,
   } as any;
 

src/app/editor/templates/testimonialsTemplate.ts

@@ -17,6 +17,11 @@ export function createTestimonialsTemplateBlocks(opts: {
   const sectionProps: SectionBlockProps = {
     background: "default",
     paddingY: "lg",
+    // 후기 섹션은 중간 폭과 적당한 카드 간격을 사용한다.
+    paddingYPx: 80,
+    maxWidthPx: 1040,
+    gapXPx: 36,
+    backgroundColorCustom: "#020617",
     columns,
   } as any;