diff --git a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-between.sample.scss b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-between.sample.scss
index f2f59bb785..649c773d72 100644
--- a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-between.sample.scss
+++ b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-between.sample.scss
@@ -1,6 +1,6 @@
 @use '@swisspost/design-system-styles/core' as post;
 
-@include post.between(sm, lg) {
+@include post.media-breakpoint-between(sm, lg) {
   .custom-class {
     display: block; // Show the element on screens between 600px and 1024px
   }
diff --git a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-max-width.sample.scss b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-max-width.sample.scss
index 141a63b85b..2ce253755f 100644
--- a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-max-width.sample.scss
+++ b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-max-width.sample.scss
@@ -1,6 +1,6 @@
 @use '@swisspost/design-system-styles/core' as post;
 
-@include post.max(lg) {
+@include post.media-breakpoint-down(lg) {
   .custom-class {
     display: none; // Hide the element on screens narrower than 1024px
   }
diff --git a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-min-width.sample.scss b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-min-width.sample.scss
index f5a6011b8d..4d7b394358 100644
--- a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-min-width.sample.scss
+++ b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-min-width.sample.scss
@@ -4,7 +4,7 @@
   display: none; // By default, this element is hidden
 }
 
-@include post.min(lg) {
+@include post.media-breakpoint-up(lg) {
   .custom-class {
     display: block; // On screens 1024px or wider, this element is shown
   }
diff --git a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-single.sample.scss b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-single.sample.scss
index be2e23cf59..fbd1583045 100644
--- a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-single.sample.scss
+++ b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints-single.sample.scss
@@ -1,6 +1,6 @@
 @use '@swisspost/design-system-styles/core' as post;
 
-@include post.only(md) {
+@include post.media-breakpoint-only(md) {
   .custom-class {
     display: block; // Show this element only on medium screens (≥780px and <1024px)
   }
diff --git a/packages/styles/src/components/topic-teaser.scss b/packages/styles/src/components/topic-teaser.scss
index 8379774bf7..8b690f0fc1 100644
--- a/packages/styles/src/components/topic-teaser.scss
+++ b/packages/styles/src/components/topic-teaser.scss
@@ -13,7 +13,6 @@
 @use './../mixins/icons' as icons-mx;
 
 .topic-teaser {
-
   &:not(.topic-teaser-reverse) {
     @each $breakpoint in topic-teaser.$grid-breakpoints-upper {
       @include media-breakpoint-only($breakpoint) {
diff --git a/packages/styles/src/functions/_breakpoint.scss b/packages/styles/src/functions/_breakpoint.scss
index 9484096159..80fc330437 100644
--- a/packages/styles/src/functions/_breakpoint.scss
+++ b/packages/styles/src/functions/_breakpoint.scss
@@ -10,6 +10,10 @@
     @error 'Breakpoint #{$breakpoint} does not exist.';
   }
 
+  @if ($index == list.length($breakpoints)) {
+    @return null;
+  }
+
   @return list.nth($breakpoints, $index + 1);
 }
 
diff --git a/packages/styles/src/layout/index.scss b/packages/styles/src/layout/index.scss
index ac9d412b97..bbcfd6e205 100644
--- a/packages/styles/src/layout/index.scss
+++ b/packages/styles/src/layout/index.scss
@@ -41,7 +41,7 @@ tokens.$default-map: layout.$post-grid;
 }
 
 @each $breakpoint, $device-size in breakpoints.$grid-breakpoints {
-  @include media.min($breakpoint) {
+  @include media.media-breakpoint-up($breakpoint) {
     $infix: if($device-size == 0, '', '-#{$breakpoint}');
 
     .col#{$infix} {
diff --git a/packages/styles/src/layout/temp/_tokens.scss b/packages/styles/src/layout/temp/_tokens.scss
index b7569521cd..99425a0807 100644
--- a/packages/styles/src/layout/temp/_tokens.scss
+++ b/packages/styles/src/layout/temp/_tokens.scss
@@ -20,15 +20,15 @@ $_post-grid-desktop: (
 );
 
 :root {
-  @include media.max(sm) {
+  @include media.media-breakpoint-down(sm) {
     @include tokens.from($_post-grid-mobile);
   }
 
-  @include media.between(sm, lg) {
+  @include media.media-breakpoint-between(sm, lg) {
     @include tokens.from($_post-grid-tablet);
   }
 
-  @include media.min(lg) {
+  @include media.media-breakpoint-up(lg) {
     @include tokens.from($_post-grid-desktop);
   }
 }
diff --git a/packages/styles/src/mixins/_media.scss b/packages/styles/src/mixins/_media.scss
index 95372f0902..96fa910381 100644
--- a/packages/styles/src/mixins/_media.scss
+++ b/packages/styles/src/mixins/_media.scss
@@ -1,24 +1,24 @@
 @use '../functions/breakpoint';
 
-@mixin min($breakpoint) {
+@mixin media-breakpoint-up($breakpoint) {
   @media screen and (min-width: breakpoint.min-width($breakpoint)) {
     @content;
   }
 }
 
-@mixin max($breakpoint) {
+@mixin media-breakpoint-down($breakpoint) {
   @media screen and (max-width: breakpoint.max-width($breakpoint)) {
     @content;
   }
 }
 
-@mixin between($breakpoint-min, $breakpoint-max) {
+@mixin media-breakpoint-between($breakpoint-min, $breakpoint-max) {
   @media screen and (min-width: breakpoint.min-width($breakpoint-min)) and (max-width: breakpoint.max-width($breakpoint-max)) {
     @content;
   }
 }
 
-@mixin only($breakpoint) {
+@mixin media-breakpoint-only($breakpoint) {
   @media screen and (min-width: breakpoint.min-width($breakpoint)) and (max-width: breakpoint.max-width($breakpoint)) {
     @content;
   }
diff --git a/packages/styles/src/themes/bootstrap/_core.scss b/packages/styles/src/themes/bootstrap/_core.scss
index a110b20b0c..2302be09c6 100644
--- a/packages/styles/src/themes/bootstrap/_core.scss
+++ b/packages/styles/src/themes/bootstrap/_core.scss
@@ -9,6 +9,5 @@
 // Optional Sass map overrides here
 
 @import 'bootstrap/scss/maps';
-@import 'bootstrap/scss/mixins';
 
 @import './overrides-mixins';
diff --git a/packages/styles/src/themes/bootstrap/_overrides-mixins.scss b/packages/styles/src/themes/bootstrap/_overrides-mixins.scss
index c730feab8c..80bd8d4a4c 100644
--- a/packages/styles/src/themes/bootstrap/_overrides-mixins.scss
+++ b/packages/styles/src/themes/bootstrap/_overrides-mixins.scss
@@ -1,5 +1,40 @@
 @use './../../variables/components/tooltips';
 
+@import 'bootstrap/scss/vendor/rfs';
+
+// Deprecate
+@import 'bootstrap/scss/mixins/deprecate';
+
+// Helpers
+@import 'bootstrap/scss/mixins/color-mode';
+@import 'bootstrap/scss/mixins/color-scheme';
+@import 'bootstrap/scss/mixins/image';
+@import 'bootstrap/scss/mixins/resize';
+@import 'bootstrap/scss/mixins/visually-hidden';
+@import 'bootstrap/scss/mixins/reset-text';
+@import 'bootstrap/scss/mixins/text-truncate';
+
+// Utilities
+@import 'bootstrap/scss/mixins/utilities';
+
+// Components
+@import 'bootstrap/scss/mixins/backdrop';
+@import 'bootstrap/scss/mixins/buttons';
+@import 'bootstrap/scss/mixins/caret';
+@import 'bootstrap/scss/mixins/pagination';
+@import 'bootstrap/scss/mixins/lists';
+@import 'bootstrap/scss/mixins/forms';
+@import 'bootstrap/scss/mixins/table-variants';
+
+// Skins
+@import 'bootstrap/scss/mixins/border-radius';
+@import 'bootstrap/scss/mixins/box-shadow';
+@import 'bootstrap/scss/mixins/gradients';
+@import 'bootstrap/scss/mixins/transition';
+
+// Layout
+@import 'bootstrap/scss/mixins/clearfix';
+
 // Keep this mixin override: it is necessary to clear Bootstrap styles for .is-(in)valid and .(in)valid-feedback
 @mixin form-validation-state(
   $state,
diff --git a/packages/styles/src/tokens/_device.scss b/packages/styles/src/tokens/_device.scss
index a69c60f20b..4102964296 100644
--- a/packages/styles/src/tokens/_device.scss
+++ b/packages/styles/src/tokens/_device.scss
@@ -5,15 +5,15 @@
 @use './../mixins/media';
 
 :root {
-  @include media.max(sm) {
+  @include media.media-breakpoint-down(sm) {
     @include tokens.from(device.$post-mobile);
   }
 
-  @include media.between(sm, lg) {
+  @include media.media-breakpoint-between(sm, lg) {
     @include tokens.from(device.$post-tablet);
   }
 
-  @include media.min(lg) {
+  @include media.media-breakpoint-up(lg) {
     @include tokens.from(device.$post-desktop);
   }
 }
diff --git a/packages/styles/src/utilities/_mixins.scss b/packages/styles/src/utilities/_mixins.scss
index ed6615811d..81883691e1 100644
--- a/packages/styles/src/utilities/_mixins.scss
+++ b/packages/styles/src/utilities/_mixins.scss
@@ -14,7 +14,7 @@
     @if ($min-width == 0) {
       @include generate-utilities($properties, $value, $prefix, $suffix);
     } @else {
-      @include media.min($breakpoint) {
+      @include media.media-breakpoint-up($breakpoint) {
         $infix: '-#{$breakpoint}';
         @include generate-utilities($properties, $value, $prefix, $suffix, $infix);
       }
diff --git a/packages/styles/src/variables/components/_stepper.scss b/packages/styles/src/variables/components/_stepper.scss
index 7dc24521ad..60bab4b596 100644
--- a/packages/styles/src/variables/components/_stepper.scss
+++ b/packages/styles/src/variables/components/_stepper.scss
@@ -35,4 +35,3 @@ $stepper-link-color: var(--post-gray-60);
 
 $stepper-link-current-color: var(--post-gray-80);
 $stepper-link-current-font-weight: type.$font-weight-bold;
-
diff --git a/packages/styles/tests/components/grid.test.scss b/packages/styles/tests/components/grid.test.scss
deleted file mode 100644
index 9c7ba9a296..0000000000
--- a/packages/styles/tests/components/grid.test.scss
+++ /dev/null
@@ -1,7 +0,0 @@
-@use 'sass:map';
-@use 'sass:meta';
-@use 'tests/jest';
-@use 'src/components/grid';
-
-// Check if component forwards options
-@include jest.true(map.has-key(meta.module-variables('grid'), 'font-base-path'));
diff --git a/packages/styles/tests/functions/breakpoint.test.scss b/packages/styles/tests/functions/breakpoint.test.scss
new file mode 100644
index 0000000000..3a262640a0
--- /dev/null
+++ b/packages/styles/tests/functions/breakpoint.test.scss
@@ -0,0 +1,16 @@
+@use 'tests/jest';
+@use 'sass:map';
+@use 'src/functions/breakpoint';
+@use 'src/variables/breakpoints';
+
+// it should return the next available breakpoint
+@include jest.equal(lg, breakpoint.next(md));
+
+// it should return null if the breakpoint is the last one available
+@include jest.equal(null, breakpoint.next(xl));
+
+// it should return the min-width corresponding to the breakpoint
+@include jest.equal(map.get(breakpoints.$grid-breakpoints, sm), breakpoint.min-width(sm));
+
+// it should return the max-width corresponding to the breakpoint
+@include jest.equal(map.get(breakpoints.$grid-breakpoints, sm) - 0.01, breakpoint.max-width(xs));