diff --git a/apps/scandic-web/components/ContentType/CollectionPage/collectionPage.module.css b/apps/scandic-web/components/ContentType/CollectionPage/collectionPage.module.css
index e8c840c63..c6ced3fef 100644
--- a/apps/scandic-web/components/ContentType/CollectionPage/collectionPage.module.css
+++ b/apps/scandic-web/components/ContentType/CollectionPage/collectionPage.module.css
@@ -59,18 +59,16 @@
   justify-items: start;
 }
 
-.intro {
-  display: grid;
-  max-width: var(--max-width-text-block);
-  gap: var(--Space-x3);
-}
-
 .heading {
   color: var(--Text-Heading);
   text-wrap: balance;
   hyphens: auto;
 }
 
+.preamble {
+  max-width: var(--max-width-text-block);
+}
+
 .content {
   display: flex;
   flex-direction: column;
diff --git a/apps/scandic-web/components/ContentType/CollectionPage/index.tsx b/apps/scandic-web/components/ContentType/CollectionPage/index.tsx
index 0be6e7f7e..5d2a78c66 100644
--- a/apps/scandic-web/components/ContentType/CollectionPage/index.tsx
+++ b/apps/scandic-web/components/ContentType/CollectionPage/index.tsx
@@ -101,7 +101,7 @@ export async function CollectionPage() {
           <div className={styles.headerContent}>
             {showHero ? (
               <Typography variant="Body/Lead text">
-                <p>{header.preamble}</p>
+                <p className={styles.preamble}>{header.preamble}</p>
               </Typography>
             ) : (
               <>
@@ -109,7 +109,7 @@ export async function CollectionPage() {
                   <h1 className={styles.heading}>{header.heading}</h1>
                 </Typography>
                 <Typography variant="Body/Lead text">
-                  <p>{header.preamble}</p>
+                  <p className={styles.preamble}>{header.preamble}</p>
                 </Typography>
                 {header.top_primary_button?.url ? (
                   <ButtonLink