3 files changed, 8 insertions, 5 deletions
diff --git a/apps/website/src/components/base/Header.astro b/apps/website/src/components/base/Header.astro
index 5292380..7d24c8f 100644
--- a/apps/website/src/components/base/Header.astro
+++ b/apps/website/src/components/base/Header.astro
@@ -29,7 +29,7 @@ let className: string | string[] = [];
 if (align !== 'inherit')
 	className.push(`text-${align}`);
 
-if (size === 'xxl')
+if (size === 'xxl' || size === 'xl')
 	className.push('page-header');
 
 if (attr.class)
@@ -53,6 +53,9 @@ className = className.join(' ');
 
     h2 {
         font-size: theme("fontSize.header");
+		&.page-header {
+			font-size: theme("fontSize.header-page");
+		}
         font-weight: 600;
     }
 
diff --git a/apps/website/src/components/base/Paragraph.astro b/apps/website/src/components/base/Paragraph.astro
index 5ceaf6e..db0bff6 100644
--- a/apps/website/src/components/base/Paragraph.astro
+++ b/apps/website/src/components/base/Paragraph.astro
@@ -4,7 +4,7 @@ import type { HTMLAttributes } from 'astro/types';
 const sizes = {
 	xs: 'text-xs',
 	sm: 'text-sm',
-	md: 'text-md',
+	md: 'text-inherit',
 	lg: 'text-lg',
 	xl: 'text-xl',
 };
diff --git a/apps/website/src/components/base/Section.astro b/apps/website/src/components/base/Section.astro
index ce87ecb..092c069 100644
--- a/apps/website/src/components/base/Section.astro
+++ b/apps/website/src/components/base/Section.astro
@@ -19,7 +19,7 @@ const {
 const twoColumn = Astro.slots.has('left') || Astro.slots.has('right');
 
 const className = `max-w-[${maxWidth}] ${wFull ? 'w-full' : `w-[${maxWidth}]`} px-5 md:p-0 flex gap-x-20 gap-y-4${
-	twoColumn ? ` ${maxWidth === 'none' ? 'justify-center' : 'justify-between md:justify-evenly lg:justify-between'} ${colReverse ? 'flex-col-reverse' : 'flex-col'} md:flex-row md:items-center md:flex-row` : ''
+	twoColumn ? ` ${maxWidth === 'none' ? 'justify-center' : 'justify-between md:justify-evenly lg:justify-between'} ${colReverse ? 'flex-col-reverse' : 'flex-col'} md:flex-row items-center md:flex-row` : ''
 }${props.class ? ` ${props.class}` : ''}`;
 ---
 
@@ -27,11 +27,11 @@ const className = `max-w-[${maxWidth}] ${wFull ? 'w-full' : `w-[${maxWidth}]`} p
 	<div class={className} {...props}>
 		{twoColumn
 			? (
-				<div class="flex flex-col items-start text-left relative">
+				<div class="flex flex-col items-center text-center w-full md:w-auto md:items-start md:text-left relative">
 					<slot name="left"></slot>
 				</div>
 
-				<div class="flex flex-col items-start text-left relative">
+				<div class="flex flex-col items-center text-center w-full md:w-auto md:items-start md:text-left relative">
 					<slot name="right"></slot>
 				</div>
 			)