diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/index.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/index.tsx
index 43f9ceeed..504cfbfdf 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/index.tsx
@@ -5,7 +5,6 @@ import { myStay } from "@/constants/routes/myStay"
 
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
-import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import Title from "@/components/TempDesignSystem/Text/Title"
 import useLang from "@/hooks/useLang"
 
@@ -77,16 +76,6 @@ export default function Header({
           {hotel.name}
         </Title>
       </hgroup>
-      <Subtitle color="uiTextHighContrast" type="two">
-        {intl.formatMessage(
-          {
-            defaultMessage: "Booking number {value}",
-          },
-          {
-            value: booking.confirmationNumber,
-          }
-        )}
-      </Subtitle>
       <Body className={styles.body}>{text}</Body>
       <div className={styles.actions}>
         <AddToCalendar
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
index 66a717a8e..fee5633c7 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
@@ -41,6 +41,16 @@ export default function Room({
   return (
     <article className={styles.room}>
       <header className={styles.header}>
+        <Typography variant="Title/Subtitle/md">
+          <h2>
+            {intl.formatMessage(
+              {
+                defaultMessage: "Booking number {value}",
+              },
+              { value: booking.confirmationNumber }
+            )}
+          </h2>
+        </Typography>
         {booking.rateDefinition.isMemberRate ? (
           <div className={styles.benefits}>
             <>
@@ -60,19 +70,24 @@ export default function Room({
         {booking.guaranteeInfo && (
           <div className={styles.benefits}>
             <MaterialIcon
-              icon="check"
+              icon="check_circle"
               color="Icon/Feedback/Success"
               size={20}
             />
+            <Typography
+              variant="Body/Supporting text (caption)/smBold"
+              className={styles.guaranteeText}
+            >
+              <p>
+                {intl.formatMessage({
+                  defaultMessage: "Booking guaranteed.",
+                })}
+              </p>
+            </Typography>
+            {/* eslint-disable formatjs/no-literal-string-in-jsx */}{" "}
+            {/* eslint-enable formatjs/no-literal-string-in-jsx */}
             <Typography variant="Body/Supporting text (caption)/smRegular">
               <p>
-                <strong>
-                  {intl.formatMessage({
-                    defaultMessage: "Booking guaranteed.",
-                  })}
-                </strong>
-                {/* eslint-disable formatjs/no-literal-string-in-jsx */}{" "}
-                {/* eslint-enable formatjs/no-literal-string-in-jsx */}
                 {intl.formatMessage({
                   defaultMessage:
                     "Your room will remain available for check-in even after 18:00.",
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/room.module.css b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/room.module.css
index 8d0db9055..074ea2a44 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/room.module.css
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/room.module.css
@@ -20,6 +20,10 @@
   width: max-content;
 }
 
+.guaranteeText {
+  color: var(--Text-Feedback-Succes-Accent);
+}
+
 .booking {
   background-color: var(--Base-Background-Primary-Normal);
   border-radius: var(--Corner-radius-Large);
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/index.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/index.tsx
index 498e4347c..32dec7c98 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/index.tsx
@@ -1,4 +1,5 @@
-import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
+import { Typography } from "@scandic-hotels/design-system/Typography"
+
 import { getIntl } from "@/i18n"
 
 import { LinkedReservation } from "./LinkedReservation"
@@ -21,14 +22,16 @@ export default async function Rooms({
     <section className={styles.rooms}>
       <div className={styles.room}>
         {linkedReservations.length ? (
-          <Subtitle color="mainGrey60" type="two">
-            {intl.formatMessage(
-              {
-                defaultMessage: "Room {roomIndex}",
-              },
-              { roomIndex: 1 }
-            )}
-          </Subtitle>
+          <Typography variant="Title/Subtitle/md">
+            <h2 className={styles.roomTitle}>
+              {intl.formatMessage(
+                {
+                  defaultMessage: "Room {roomIndex}",
+                },
+                { roomIndex: 1 }
+              )}
+            </h2>
+          </Typography>
         ) : null}
         <Room
           booking={booking}
@@ -41,14 +44,16 @@ export default async function Rooms({
 
       {linkedReservations.map((reservation, idx) => (
         <div className={styles.room} key={reservation.confirmationNumber}>
-          <Subtitle color="mainGrey60" type="two">
-            {intl.formatMessage(
-              {
-                defaultMessage: "Room {roomIndex}",
-              },
-              { roomIndex: idx + 2 }
-            )}
-          </Subtitle>
+          <Typography variant="Title/Subtitle/md">
+            <h2 className={styles.roomTitle}>
+              {intl.formatMessage(
+                {
+                  defaultMessage: "Room {roomIndex}",
+                },
+                { roomIndex: idx + 2 }
+              )}
+            </h2>
+          </Typography>
           <LinkedReservation
             checkInTime={checkInTime}
             checkOutTime={checkOutTime}
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/rooms.module.css b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/rooms.module.css
index 135d26747..6f643ba1f 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/rooms.module.css
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/rooms.module.css
@@ -7,5 +7,9 @@
 .room {
   display: flex;
   flex-direction: column;
-  gap: var(--Spacing-x2);
+  gap: var(--Space-x025);
+}
+
+.roomTitle {
+  color: var(--Text-Tertiary);
 }
