diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4edcd770..f08dfd99 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,8 +10,9 @@ Introducing theme variables! CSS variables beginning with `--theme-` will adjust
 
 ### CSS Logical Properties
 
-* Continued migrating physical directional properties to their logical equivalents (see #1084) -- `templates/_card-layout.scss`, `templates/_main-with-sidebar.scss`, `_footer.scss`, `_navigation.scss`, `_menu.scss`, `_menu-item.scss`, `_menu-list.scss`, and `_sidebar-menu.scss`. 59 `bidi()` calls removed.
-* Where a property has no logical equivalent safe across the supported matrix (`background-position`, and a CSS `transform` that visually flips a directional glyph), kept the physical value with an explicit `[dir='rtl']` override instead.
+* RTL support now relies on CSS logical properties.
+* Where a property has no supported logical equivalent (e.g. `background-position`), RTL support is with an explicit `[dir='rtl']` override instead.
+* **Deprecated** `@mixin bidi()` The mixin is still exported and available for your use, but you are encouraged to phase it out.
 
 ### Browser Support
 
@@ -61,10 +62,6 @@ Introducing theme variables! CSS variables beginning with `--theme-` will adjust
 * (breaking) Standardized interactive component states on `:focus-visible` instead of `:focus`.
 * (breaking) Click/pick form elements now use :focus-visible but input/typing fields keep :focus.
 
-### CSS Logical Properties
-
-* Started migrating physical directional properties to their logical equivalents 
-
 ## Component changes
 
 ### Feature Card
diff --git a/assets/sass/protocol/components/_breadcrumb.scss b/assets/sass/protocol/components/_breadcrumb.scss
index cbf1dd4f..9a79eceb 100644
--- a/assets/sass/protocol/components/_breadcrumb.scss
+++ b/assets/sass/protocol/components/_breadcrumb.scss
@@ -28,9 +28,13 @@
 
         + .mzp-c-breadcrumb-item {
             &::before {
+                content: '\2192';
                 font-weight: normal;
                 margin: 0 0.25em;
-                @include bidi(((content, '\2192', '\2190'),));
+
+                [dir='rtl'] & {
+                    content: '\2190';
+                }
             }
         }
 
diff --git a/assets/sass/protocol/components/_button.scss b/assets/sass/protocol/components/_button.scss
index 1d7e7caa..3955eb07 100644
--- a/assets/sass/protocol/components/_button.scss
+++ b/assets/sass/protocol/components/_button.scss
@@ -240,9 +240,9 @@
 }
 
 .mzp-c-button-icon-start {
-    @include bidi(((margin-right, 0.5ch, 0), (margin-left, 0, 0.5ch),));
+    margin-inline: 0 0.5ch;
 }
 
 .mzp-c-button-icon-end {
-    @include bidi(((margin-left, 0.5ch, 0), (margin-right, 0, 0.5ch),));
+    margin-inline: 0.5ch 0;
 }
diff --git a/assets/sass/protocol/components/_card.scss b/assets/sass/protocol/components/_card.scss
index 5c134818..480c1ca1 100644
--- a/assets/sass/protocol/components/_card.scss
+++ b/assets/sass/protocol/components/_card.scss
@@ -54,13 +54,15 @@
 
     &.mzp-has-video .mzp-c-card-tag,
     &.mzp-has-audio .mzp-c-card-tag {
+        background-position: center left;
         background-repeat: no-repeat;
         line-height: 1.8;
         min-height: 25px;
-        @include bidi((
-            (background-position, center left, center right),
-            (padding-left, $spacing-xl, padding-right, 0),
-        ));
+        padding-inline-start: $spacing-xl;
+
+        [dir='rtl'] & {
+            background-position: center right;
+        }
     }
 
     &.mzp-has-video .mzp-c-card-tag {
diff --git a/assets/sass/protocol/components/_inline-list.scss b/assets/sass/protocol/components/_inline-list.scss
index 21abb5a2..08d4e6dd 100644
--- a/assets/sass/protocol/components/_inline-list.scss
+++ b/assets/sass/protocol/components/_inline-list.scss
@@ -5,12 +5,14 @@
 @use '../includes/lib' as *;
 
 .mzp-c-inline-list {
-    margin: $layout-md 0 0 ($layout-md * -1);
+    margin-top: $layout-md;
+    margin-bottom: 0;
+    margin-inline: ($layout-md * -1) 0;
 
     li {
         display: inline-block;
         margin-bottom: $layout-xs;
-        margin-left: $layout-md; // this technique works for RTL without needing bidi styles
+        margin-inline-start: $layout-md;
         white-space: nowrap;
 
         &:last-child {
diff --git a/assets/sass/protocol/components/_language-switcher.scss b/assets/sass/protocol/components/_language-switcher.scss
index 1d0f37a8..4d28eff2 100644
--- a/assets/sass/protocol/components/_language-switcher.scss
+++ b/assets/sass/protocol/components/_language-switcher.scss
@@ -12,7 +12,8 @@
     .mzp-c-language-switcher-link {
         display: inline-block;
         font-size: var(--theme-body-font-size-sm); // just want smaller text size, so don't use full mixin
-        @include bidi(((margin, 0 $spacing-lg $spacing-sm 0, 0 0 $spacing-sm $spacing-lg),));
+        margin-block: 0 $spacing-sm;
+        margin-inline-end: $spacing-lg;
     }
 
     // hide the <label> visually should a language link be shown instead.
diff --git a/assets/sass/protocol/components/_modal.scss b/assets/sass/protocol/components/_modal.scss
index 03ded356..9bc46e95 100644
--- a/assets/sass/protocol/components/_modal.scss
+++ b/assets/sass/protocol/components/_modal.scss
@@ -57,7 +57,7 @@ html.mzp-is-noscroll {
     position: relative;
 
     & > header {
-        @include bidi(((padding-right, $spacing-xl * 2, padding-left, 0),));
+        padding-inline-end: $spacing-xl * 2;
 
         h2 {
             @include text-heading-xs;
@@ -75,7 +75,7 @@ html.mzp-is-noscroll {
     position: absolute;
     top: 9px;
     z-index: 99;
-    @include bidi(((right, $spacing-sm, left, auto),));
+    inset-inline-end: $spacing-sm;
 
     .mzp-c-modal-button-close {
         @include image-replaced;
diff --git a/assets/sass/protocol/components/_notification-bar.scss b/assets/sass/protocol/components/_notification-bar.scss
index 03a0a011..a27a8cea 100644
--- a/assets/sass/protocol/components/_notification-bar.scss
+++ b/assets/sass/protocol/components/_notification-bar.scss
@@ -87,11 +87,11 @@
 
         @media #{$mq-sm} {
             background-color: $color-marketing-gray-40;
+            border-radius: 0 $border-radius-sm $border-radius-sm 0;
             padding: 0;
             margin: 0;
             height: 100%;
             width: 40px;
-            border-radius: 0 $border-radius-sm $border-radius-sm 0;
 
             &:hover,
             &:focus-visible {
diff --git a/assets/sass/protocol/components/_picto.scss b/assets/sass/protocol/components/_picto.scss
index d83af705..c898e8e2 100644
--- a/assets/sass/protocol/components/_picto.scss
+++ b/assets/sass/protocol/components/_picto.scss
@@ -37,10 +37,7 @@
     .mzp-t-picto-side {
         .mzp-c-picto {
             position: relative;
-            @include bidi((
-                (padding-left, $layout-xl, 0),
-                (padding-right, 0, $layout-xl),
-            ));
+            padding-inline-start: $layout-xl;
         }
 
         .mzp-c-picto-image {
@@ -49,10 +46,7 @@
             position: absolute;
             text-align: center;
             width: $layout-lg;
-            @include bidi((
-                (left, 0, auto),
-                (right, auto, 0),
-            ));
+            inset-inline-start: 0;
         }
     }
 }
diff --git a/assets/sass/protocol/components/_sticky-promo.scss b/assets/sass/protocol/components/_sticky-promo.scss
index 115959f4..d5cdfaf2 100644
--- a/assets/sass/protocol/components/_sticky-promo.scss
+++ b/assets/sass/protocol/components/_sticky-promo.scss
@@ -39,17 +39,18 @@ $logos: (
     z-index: 10;
     animation: 600ms ease 300ms both;
     opacity: 0;
-    @include bidi((
-        (right, $spacing-md, auto),
-        (left, auto, $spacing-md),
-    ));
+    inset-inline-end: $spacing-md;
 
     &.mzp-js-show-on-load {
         animation-delay: 1000ms;
     }
 
     &.mzp-a-slide-in {
-        @include bidi(((animation-name, mzp-a-slide-in-right, mzp-a-slide-in-left),));
+        animation-name: mzp-a-slide-in-right; /* stylelint-disable-line no-unknown-animations */
+
+        [dir='rtl'] & {
+            animation-name: mzp-a-slide-in-left; /* stylelint-disable-line no-unknown-animations */
+        }
     }
 
     &.mzp-a-fade-out {
@@ -81,7 +82,10 @@ $logos: (
             background-position: top left;
             background-repeat: no-repeat;
             padding: (40px + $spacing-lg) 0 0;
-            @include bidi(((background-position, top left, top right),));
+
+            [dir='rtl'] & {
+                background-position: top right;
+            }
         }
     }
 }
@@ -97,15 +101,16 @@ $logos: (
     background-size: 20px 20px;
     border: none;
     height: 20px;
+    inset-inline-end: 0;
     margin: $spacing-sm;
     position: absolute;
-    right: 0;
     top: 0;
     width: 20px;
-    @include bidi((
-        (right, 0, auto),
-        (left, auto, 0),
-    ));
+
+    // need to do this manually because @include image-replaced; declares a direction
+    [dir='rtl'] & {
+        inset-inline: 0 auto;
+    }
 
     &:hover,
     &:focus-visible {
diff --git a/assets/sass/protocol/components/forms/_button-container.scss b/assets/sass/protocol/components/forms/_button-container.scss
index 9f26778f..434f9a17 100644
--- a/assets/sass/protocol/components/forms/_button-container.scss
+++ b/assets/sass/protocol/components/forms/_button-container.scss
@@ -47,8 +47,8 @@
         }
 
         .mzp-c-button + .mzp-c-button {
+            margin-inline-start: forms.$field-h-spacing;
             margin-top: 0;
-            @include bidi(((margin-left, forms.$field-h-spacing, margin-right, 0),));
         }
 
         // align end
diff --git a/assets/sass/protocol/components/forms/_choice.scss b/assets/sass/protocol/components/forms/_choice.scss
index 15b8b9ee..3ad794f4 100644
--- a/assets/sass/protocol/components/forms/_choice.scss
+++ b/assets/sass/protocol/components/forms/_choice.scss
@@ -22,7 +22,7 @@
 // wrapper around the label and control
 .mzp-c-choice {
     box-sizing: border-box;
-    clear: left;
+    clear: inline-start;
     margin-bottom: 0;
     margin-top: forms.$line-height-shim; // other labels have a bit of line height, mock that here for better vertical spacing
     min-height: forms.$choice-height;
@@ -34,8 +34,8 @@
     }
 
     .mzp-c-choices.mzp-l-choices-inline & {
-        @include bidi(((padding-right, forms.$field-h-spacing, padding-left, 0),));
         display: inline-block;
+        padding-inline-end: forms.$field-h-spacing;
         vertical-align: top;
     }
 }
@@ -45,8 +45,8 @@
     margin-bottom: 0;
     padding-top: 3px;
     padding-bottom: 0;
+    padding-inline-start: forms.$choice-spacing;
     vertical-align: top;
-    @include bidi(((padding-left, forms.$choice-spacing, padding-right, 0),));
 
     .mzp-c-choices & {
         font-weight: normal;
@@ -63,10 +63,10 @@
     &[type='checkbox'],
     &[type='radio'] {
         box-sizing: border-box;
+        inset-inline-start: 0;
         position: absolute;
         top: 0;
         z-index: 1;
-        @include bidi(((left, 0, right, auto),));
     }
 
     // IE8 and lower don't support some of this, but they also don't support media queries
@@ -93,11 +93,11 @@
             cursor: pointer;
             display: block;
             height: forms.$choice-height;
+            inset-inline-start: 0;
             position: absolute;
             text-align: center;
             top: 0;
             width: forms.$choice-height;
-            @include bidi(((left, 0, right, auto),));
         }
 
         &[type='radio'] + label::before {
@@ -123,10 +123,6 @@
             transform: rotate(45deg);
             transform-origin: bottom right;
             width: 0.35rem;
-            @include bidi((
-                (left, 0.03rem, auto),
-                (right, auto, 0.83rem),
-            ));
         }
 
         &[type='radio']:checked + label::before {
@@ -261,13 +257,13 @@
     }
 
     .mzp-c-choice-label + & {
+        padding-inline-start: forms.$choice-spacing;
         padding-top: forms.$info-v-spacing;
-        @include bidi(((padding-left, forms.$choice-spacing, padding-right, 0),));
     }
 
     .mzp-c-choice + & {
         margin-top: forms.$label-v-spacing * -1;
-        @include bidi(((padding-left, forms.$choice-spacing, padding-right, 0),));
+        padding-inline-start: forms.$choice-spacing;
     }
 
     .mzp-c-choice-msg + & {
diff --git a/assets/sass/protocol/components/logos/_logo.scss b/assets/sass/protocol/components/logos/_logo.scss
index cdaf763f..a1225baf 100644
--- a/assets/sass/protocol/components/logos/_logo.scss
+++ b/assets/sass/protocol/components/logos/_logo.scss
@@ -18,12 +18,16 @@ $logo-sizes: (
 
 .mzp-c-logo {
     @include image-replaced;
+    background-position: top left;
     background-repeat: no-repeat;
     background-size: contain;
     display: block;
     margin-bottom: $layout-sm;
     margin-top: 0;
-    @include bidi(((background-position, top left, top right),));
+
+    [dir='rtl'] & {
+        background-position: top right;
+    }
 
     &.mzp-t-logo-xs {
         height: $layout-xs;
@@ -65,9 +69,13 @@ $logo-sizes: (
         margin-right: auto;
 
         @media #{$mq-md} {
+            background-position: top left;
             margin-left: 0;
             margin-right: 0;
-            @include bidi(((background-position, top left, top right),));
+
+            [dir='rtl'] & {
+                background-position: top right;
+            }
         }
     }
 }
diff --git a/assets/sass/protocol/components/logos/_wordmark.scss b/assets/sass/protocol/components/logos/_wordmark.scss
index 7d13313a..6b9d2da8 100644
--- a/assets/sass/protocol/components/logos/_wordmark.scss
+++ b/assets/sass/protocol/components/logos/_wordmark.scss
@@ -15,13 +15,17 @@ $logo-sizes: (
 
 .mzp-c-wordmark {
     @include image-replaced;
+    background-position: top left;
     background-size: contain;
     background-repeat: no-repeat;
     display: block;
     margin-bottom: $layout-sm;
     margin-top: 0;
     max-width: 100%;
-    @include bidi(((background-position, top left, top right),));
+
+    [dir='rtl'] & {
+        background-position: top right;
+    }
 
     &.mzp-t-wordmark-xs {
         height: $layout-xs;
@@ -63,9 +67,13 @@ $logo-sizes: (
         margin-right: auto;
 
         @media #{$mq-md} {
+            background-position: top left;
             margin-left: 0;
             margin-right: 0;
-            @include bidi(((background-position, top left, top right),));
+
+            [dir='rtl'] & {
+                background-position: top right;
+            }
         }
     }
 }
diff --git a/docs/02-usage/02-framework.md b/docs/02-usage/02-framework.md
index a153b555..65e825cd 100644
--- a/docs/02-usage/02-framework.md
+++ b/docs/02-usage/02-framework.md
@@ -44,6 +44,13 @@ bidi mixin to reverse that direction for other languages. Refer to
 @include bidi(((content, '\2192', '\2190'),));
 ```
 
+Protocol's own components no longer use this mixin internally – we've moved to
+[CSS logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values)
+instead, which handle direction natively without a `[dir='rtl']` override. The
+mixin remains available for consumers who already depend on it; see the
+[Migration Guide](/docs/usage/migration) if you'd like to move your own Sass
+to logical properties too.
+
 ### at2x
 at2x is a helpful mixin for applying a high-resolution background image, for
 display on high definition screens (a.k.a. “retina”). It automatically outputs
diff --git a/docs/02-usage/migration.md b/docs/02-usage/migration.md
index 71089af1..ef470e27 100644
--- a/docs/02-usage/migration.md
+++ b/docs/02-usage/migration.md
@@ -466,6 +466,29 @@ Image size recommendations are now based on column layout rather than card size:
 | 3-column (`mzp-l-card-third`) | 600px | 1200px |
 | 2-column (`mzp-l-card-half`) | 930px | 1860px |
 
+## Bidi Mixin Deprecation
+
+Protocol's own components no longer use the `@include bidi(...)` Sass mixin –
+it's been replaced internally by [CSS logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values). The mixin itself is **not removed** and 
+remains available if your own Sass still calls it, but we recommend migrating when convenient.
+
+**Migration steps:**
+1. Find each `@include bidi(...)` call in your Sass.
+2. Replace directional properties with their logical equivalent, e.g. `margin-left`/`margin-right` → `margin-inline-start`/`margin-inline-end`, `left`/`right` → `inset-inline-start`/`inset-inline-end`, `float: left`/`right` → `float: inline-start`/`inline-end`.
+3. Properties with no logical equivalent (`background-position`, `content`, `animation-name`, etc.) still need an explicit `[dir='rtl'] &` override with the physical property.
+
+**Find usages in your codebase:**
+
+VS Code Find (with **Use Regular Expression** enabled):
+```text
+Find: @include bidi\(
+```
+
+Terminal:
+```bash
+grep -rn "@include bidi(" --include="*.scss" .
+```
+
 ## After Migration
 
 1. Run your build to check for any Sass compilation errors
diff --git a/theme/assets/sass/components/_pen.scss b/theme/assets/sass/components/_pen.scss
index add1394e..4d8f7320 100755
--- a/theme/assets/sass/components/_pen.scss
+++ b/theme/assets/sass/components/_pen.scss
@@ -42,8 +42,8 @@
 .Pen-previewButton {
     color: var(--theme-link-color);
     font-weight: bold;
+    margin-inline-start: $spacing-lg;
     @include text-body-sm;
-    @include bidi(((margin-left, $spacing-lg, margin-right, $spacing-lg),));
 
     &:hover,
     &:active {