Fix issue with section widths

Author: John Goodliff

src/components/layout/section.tsx

@@ -34,8 +34,8 @@ export const Section = forwardRef(
 		ref: ForwardedRef<HTMLElement>,
 	) => {
 		const classNameProps = getClassNameProps(
-			'flex z-10 flex-col justify-center w-full',
-			responsive && 'w-10/12 max-w-5xl lg:w-9/12 xl:w-8/12', // Adjust width based on screen size
+			'flex z-10 flex-col justify-center break-inside-avoid-page',
+			responsive ? 'w-10/12 lg:w-9/12 xl:w-8/12 max-w-5xl' : 'w-full', // Adjust width based on screen size
 			className,
 		);
 		const sectionHeaderClassNameProps = getClassNameProps(