diff --git a/src/features/flights-map/components/FlightsMapStartPage.scss b/src/features/flights-map/components/FlightsMapStartPage.scss
index d7cbd51c..83445736 100644
--- a/src/features/flights-map/components/FlightsMapStartPage.scss
+++ b/src/features/flights-map/components/FlightsMapStartPage.scss
@@ -248,7 +248,7 @@
   }
 
   &__title {
-    font-size: 18px;
+    font-size: fonts.$font-size-xl;
     font-weight: fonts.$font-bold;
     color: colors.$text-color;
     margin: 0 0 vars.$space-s;
diff --git a/src/features/online-board/components/BoardDetailsHeader/BoardDetailsHeader.scss b/src/features/online-board/components/BoardDetailsHeader/BoardDetailsHeader.scss
index 226ac906..b4a32415 100644
--- a/src/features/online-board/components/BoardDetailsHeader/BoardDetailsHeader.scss
+++ b/src/features/online-board/components/BoardDetailsHeader/BoardDetailsHeader.scss
@@ -70,10 +70,10 @@
     display: flex;
     flex-direction: column;
     font-weight: fonts.$font-medium;
-    font-size: 18px;
+    font-size: fonts.$font-size-xl;
   }
   &__primary {
-    font-size: 18px;
+    font-size: fonts.$font-size-xl;
     font-weight: fonts.$font-medium;
     color: colors.$text-color;
   }
diff --git a/src/features/online-board/components/DayTabs/DayTabs.scss b/src/features/online-board/components/DayTabs/DayTabs.scss
index ed28db05..1d8e2538 100644
--- a/src/features/online-board/components/DayTabs/DayTabs.scss
+++ b/src/features/online-board/components/DayTabs/DayTabs.scss
@@ -30,7 +30,7 @@
     border: none;
     cursor: pointer;
     color: colors.$light-gray;
-    font-size: 20px;
+    font-size: fonts.$font-size-xl1;
     line-height: 1;
     padding: 0;
 
diff --git a/src/features/online-board/components/FlightsMiniList/FlightsMiniList.scss b/src/features/online-board/components/FlightsMiniList/FlightsMiniList.scss
index 24275498..6af0885b 100644
--- a/src/features/online-board/components/FlightsMiniList/FlightsMiniList.scss
+++ b/src/features/online-board/components/FlightsMiniList/FlightsMiniList.scss
@@ -91,7 +91,7 @@
   // Depart/arrive times inside the mini-list item: 20px / 500 / colors.$blue-dark
   // (dark navy) to match Angular's big time-group.
   &__time {
-    font-size: 20px;
+    font-size: fonts.$font-size-xl1;
     font-weight: fonts.$font-medium;
     color: colors.$blue-dark;
     line-height: 1;
diff --git a/src/features/online-board/components/FullRouteTimeline/FullRouteTimeline.scss b/src/features/online-board/components/FullRouteTimeline/FullRouteTimeline.scss
index 2f05a154..5480b7c9 100644
--- a/src/features/online-board/components/FullRouteTimeline/FullRouteTimeline.scss
+++ b/src/features/online-board/components/FullRouteTimeline/FullRouteTimeline.scss
@@ -44,7 +44,7 @@
     gap: 8px;
 
     &--times {
-      font-size: 18px;
+      font-size: fonts.$font-size-xl;
       font-weight: fonts.$font-medium;
       color: colors.$blue-dark;
     }
diff --git a/src/features/online-board/components/OnlineBoardDetailsPage.scss b/src/features/online-board/components/OnlineBoardDetailsPage.scss
index 06eda1cf..4e8ed645 100644
--- a/src/features/online-board/components/OnlineBoardDetailsPage.scss
+++ b/src/features/online-board/components/OnlineBoardDetailsPage.scss
@@ -33,7 +33,7 @@
   // Route-strip times. Angular: 20px/500/colors.$blue-dark bold navy; strike-through
   // slot underneath renders at 12px in the brand orange.
   &__time {
-    font-size: 20px;
+    font-size: fonts.$font-size-xl1;
     font-weight: fonts.$font-medium;
     color: colors.$blue-dark;
     line-height: 1.1;
@@ -420,7 +420,7 @@
 
   &__accordion-title {
     padding: vars.$space-xl vars.$space-xl vars.$space-s;
-    font-size: 18px;
+    font-size: fonts.$font-size-xl;
     font-weight: fonts.$font-bold;
     color: colors.$text-color;
     border-top: 1px solid colors.$border;
diff --git a/src/features/online-board/components/OnlineBoardFilter.scss b/src/features/online-board/components/OnlineBoardFilter.scss
index 7e77b703..c98212b0 100644
--- a/src/features/online-board/components/OnlineBoardFilter.scss
+++ b/src/features/online-board/components/OnlineBoardFilter.scss
@@ -120,7 +120,7 @@
       border-radius: 0 vars.$border-radius vars.$border-radius 0;
       background: colors.$white;
       color: colors.$light-gray;
-      font-size: 18px;
+      font-size: fonts.$font-size-xl;
       line-height: vars.$standard-button-height;
       cursor: pointer;
       padding: 0;
diff --git a/src/features/online-board/components/OnlineBoardSearchPage.scss b/src/features/online-board/components/OnlineBoardSearchPage.scss
index 0e1dcbad..538e0641 100644
--- a/src/features/online-board/components/OnlineBoardSearchPage.scss
+++ b/src/features/online-board/components/OnlineBoardSearchPage.scss
@@ -37,7 +37,7 @@
 
   &__error-title {
     margin: 0 0 vars.$space-m;
-    font-size: 18px;
+    font-size: fonts.$font-size-xl;
     color: colors.$red;
   }
 
diff --git a/src/features/online-board/components/OnlineBoardStartPage.scss b/src/features/online-board/components/OnlineBoardStartPage.scss
index 26613b3d..920bdad5 100644
--- a/src/features/online-board/components/OnlineBoardStartPage.scss
+++ b/src/features/online-board/components/OnlineBoardStartPage.scss
@@ -63,7 +63,7 @@
   @media (max-width: vars.$media-breakpoint-mobile) {
     section.frame h2 {
       padding: 20px;
-      font-size: 20px;
+      font-size: fonts.$font-size-xl1;
       line-height: 28px;
       padding-bottom: 0px;
       padding-top: 30px;
diff --git a/src/features/popular-requests/components/PopularRequestsPanel.scss b/src/features/popular-requests/components/PopularRequestsPanel.scss
index 2e349ea6..c31f4975 100644
--- a/src/features/popular-requests/components/PopularRequestsPanel.scss
+++ b/src/features/popular-requests/components/PopularRequestsPanel.scss
@@ -15,7 +15,7 @@
   }
 
   &__title {
-    font-size: 20px;
+    font-size: fonts.$font-size-xl1;
     margin: 0;
     padding-bottom: 50px;
     font-weight: fonts.$font-regular;
diff --git a/src/features/schedule/components/DayGroupedFlightList.scss b/src/features/schedule/components/DayGroupedFlightList.scss
index 5c0726be..b8aa45d3 100644
--- a/src/features/schedule/components/DayGroupedFlightList.scss
+++ b/src/features/schedule/components/DayGroupedFlightList.scss
@@ -94,7 +94,7 @@
   &__date {
     margin: 0;
     color: colors.$blue-dark;
-    font-size: 18px;
+    font-size: fonts.$font-size-xl;
     font-weight: fonts.$font-medium;
   }
 
diff --git a/src/features/schedule/components/ScheduleStartPage.scss b/src/features/schedule/components/ScheduleStartPage.scss
index f55e6af1..96706900 100644
--- a/src/features/schedule/components/ScheduleStartPage.scss
+++ b/src/features/schedule/components/ScheduleStartPage.scss
@@ -60,7 +60,7 @@
   @media (max-width: vars.$media-breakpoint-mobile) {
     section.frame h2 {
       padding: 20px;
-      font-size: 20px;
+      font-size: fonts.$font-size-xl1;
       line-height: 28px;
       padding-bottom: 0px;
       padding-top: 30px;
@@ -278,7 +278,7 @@
   }
 
   .bottom-description-title {
-    font-size: 20px;
+    font-size: fonts.$font-size-xl1;
     font-weight: fonts.$font-regular;
   }
 
diff --git a/src/features/schedule/components/WeekTabs.scss b/src/features/schedule/components/WeekTabs.scss
index 058b7f43..8bffed6b 100644
--- a/src/features/schedule/components/WeekTabs.scss
+++ b/src/features/schedule/components/WeekTabs.scss
@@ -15,7 +15,7 @@
     background: transparent;
     border: none;
     color: colors.$light-gray;
-    font-size: 18px;
+    font-size: fonts.$font-size-xl;
     width: 28px;
     cursor: pointer;
     border-radius: vars.$border-radius;
diff --git a/src/ui/city-autocomplete/CityAutocomplete.scss b/src/ui/city-autocomplete/CityAutocomplete.scss
index 22d1a1d4..34c455fb 100644
--- a/src/ui/city-autocomplete/CityAutocomplete.scss
+++ b/src/ui/city-autocomplete/CityAutocomplete.scss
@@ -43,7 +43,7 @@
       border: none;
       background: transparent;
       cursor: pointer;
-      font-size: 18px;
+      font-size: fonts.$font-size-xl;
       color: colors.$light-gray;
 
       &::before {
diff --git a/src/ui/flights/FlightCard.scss b/src/ui/flights/FlightCard.scss
index fd2c8055..08a1319c 100644
--- a/src/ui/flights/FlightCard.scss
+++ b/src/ui/flights/FlightCard.scss
@@ -111,7 +111,7 @@
 
   &__chevron {
     color: colors.$blue;
-    font-size: 18px;
+    font-size: fonts.$font-size-xl;
     transition: transform 150ms ease;
 
     &--open {