my-app/src/pages/RoomBooking.jsx

@@ -32,7 +32,12 @@ export function RoomBooking({ bookings, showSuccessBanner, lastCreatedBooking, o
 					</div>
 				</div>
 			)}
-			<h1 className={styles.pageHeading}>Lokalbokning</h1>
+			<div className={styles.header}>
+				<div className={styles.badge}>Lokalbokning</div>
+				<h1 className={styles.pageHeading}>Lokalbokning - Campus Kista</h1>
+				<div className={styles.subtitle}>Reservera lokaler för möten och studier</div>
+			</div>
+			
 			<h2 className={styles.sectionHeading}>Ny bokning</h2>
 
 			<div className={styles.roomCategoryCards}>

my-app/src/pages/RoomBooking.module.css

@@ -1,15 +1,41 @@
 .pageContainer {
-	color: var(--text-primary);
-	background-color: var(--bg-primary);
-	padding: var(--container-padding);
+	max-width: 1200px;
+	margin: 0 auto;
+	padding: var(--spacing-2xl);
 	min-height: 100vh;
 }
 
+.header {
+	margin-bottom: var(--spacing-2xl);
+	padding-bottom: var(--spacing-xl);
+	border-bottom: 1px solid var(--border-light);
+}
+
+.badge {
+	display: inline-block;
+	background-color: var(--color-primary);
+	color: var(--color-white);
+	padding: var(--spacing-xs) var(--spacing-md);
+	border-radius: var(--border-radius-md);
+	font-size: 0.875rem;
+	font-weight: var(--font-weight-semibold);
+	margin-bottom: var(--spacing-md);
+	text-transform: uppercase;
+	letter-spacing: 0.5px;
+}
+
 .pageHeading {
-	font-size: var(--font-size-6xl);
-	font-weight: var(--font-weight-medium);
-	font-family: var(--font-header);
 	color: var(--text-primary);
+	margin: 0 0 var(--spacing-md) 0;
+	font-size: 2.5rem;
+	font-weight: var(--font-weight-bold);
+	line-height: 1.2;
+}
+
+.subtitle {
+	color: var(--text-secondary);
+	font-size: 1.1rem;
+	font-weight: var(--font-weight-medium);
 }
 
 .sectionHeading {