Content 1
---
import Content1Block from "@/components/blocks/content-1.astro"
---
<Content1Block
title="Build better products with a system designed for clarity"
description="A stacked content section that pairs editorial copy with a full-width image below. Use it to explain a feature, process, or value proposition with visual support."
features={[
"Clear headline with supporting description",
"Bullet list for quick feature scanning",
"Action buttons for next steps",
"Full-width image below the content",
]}
buttons={[
{ label: "Get started", href: "#" },
{ label: "Read the guide", href: "#" },
]}
/>Content 2
---
import Content2Block from "@/components/blocks/content-2.astro"
---
<Content2Block
title="Pair editorial copy with a supporting image"
description="Use this block when screenshots, diagrams, or photos need to sit beside copy without turning the whole page into a gallery."
features={[
"Clear headline and intro with supporting copy",
"One media surface with rounded treatment",
"Concise bullet points instead of a heavy card grid",
]}
buttons={[
{ label: "Get started", href: "#" },
{ label: "View examples", href: "#" },
]}
/>Content 3
---
import Content3Block from "@/components/blocks/content-3.astro"
---
<Content3Block
title="A full-width media section with a spread header"
description="This variation uses a spread layout with title and description on the left, action buttons on the right, and a prominent full-width image below."
buttons={[
{ label: "Get started", href: "#" },
{ label: "See layouts", href: "#" },
]}
/>Content 4
---
import Content4Block from "@/components/blocks/content-4.astro"
---
<Content4Block
title="See the difference in every detail"
description="A 1:2 split layout with a smaller text column on the left and a larger image on the right. Use it for feature highlights where the visual should dominate."
features={[
"Compact text column with checklist",
"Larger image area for visual emphasis",
"Asymmetric grid for visual hierarchy",
]}
buttons={[
{ label: "Get started", href: "#" },
{ label: "Compare features", href: "#" },
]}
/>