diff --git a/public/cases/mini-projects-showcase/index.html b/public/cases/mini-projects-showcase/index.html
index 0c531f1..eac3e12 100644
--- a/public/cases/mini-projects-showcase/index.html
+++ b/public/cases/mini-projects-showcase/index.html
@@ -786,6 +786,23 @@
             </div>
           </div>
 
+          <div class="mp-showcase-specimen-row">
+            <div class="mp-showcase-specimen__card">
+              <p class="mp-showcase-specimen__label"><code>mp-card--horizontal-right</code> + <code>mp-card--link</code></p>
+              <a class="mp-card mp-card--link mp-card--horizontal mp-card--horizontal-right" href="#" aria-label="Horizontal с картинкой справа — пример карточки">
+                <div class="mp-card__media" aria-hidden="true">
+                  <img class="mp-card__image" src="../../assets/shared/placeholder.webp" alt="" width="360" height="203" loading="lazy" decoding="async" />
+                </div>
+                <div class="mp-card__body">
+                  <h3 class="mp-card__title">Horizontal — картинка справа <span class="mp-card__ext" aria-hidden="true"></span></h3>
+                  <ul class="mp-card__tags" aria-label="Тип проекта"><li class="mp-card__tag">приложение</li></ul>
+                  <p class="mp-card__desc">Та же горизонтальная карточка, но превью закреплено справа.</p>
+                </div>
+              </a>
+            </div>
+            <div class="mp-showcase-specimen__desc"><p class="section__prose"><strong>Картинка справа.</strong> Добавьте модификатор <code>mp-card--horizontal-right</code> к горизонтальной карточке.</p></div>
+          </div>
+
           <div class="mp-showcase-specimen-row">
             <div class="mp-showcase-specimen__card">
               <p class="mp-showcase-specimen__label"><code>mp-card--compact</code> + <code>mp-card--link</code></p>
diff --git a/public/css/main.css b/public/css/main.css
index 20d08fc..6c04bb5 100644
--- a/public/css/main.css
+++ b/public/css/main.css
@@ -3773,6 +3773,15 @@ html[data-theme="dark"] .mp-card--stack-bottom .mp-card__tag {
   aspect-ratio: 16 / 9;
 }
 
+.mp-card--horizontal-right .mp-card__media {
+  order: 2;
+  padding: 1.15rem 1.15rem 1.15rem 0;
+}
+
+.mp-card--horizontal-right .mp-card__body {
+  order: 1;
+}
+
 .mp-card--horizontal.mp-card--hor-image .mp-card__image {
   object-fit: contain;
   aspect-ratio: 1;
@@ -3833,6 +3842,15 @@ html[data-theme="dark"] .mp-card--stack-bottom .mp-card__tag {
   .mp-card--horizontal .mp-card__body {
     padding: 1.15rem 1.25rem 1.35rem 1.25rem;
   }
+
+  .mp-card--horizontal-right .mp-card__media {
+    order: 1;
+    padding: 1.15rem 1.25rem 0;
+  }
+
+  .mp-card--horizontal-right .mp-card__body {
+    order: 2;
+  }
 }
 
 @media (prefers-reduced-motion: reduce) {
diff --git a/public/en/cases/mini-projects-showcase/index.html b/public/en/cases/mini-projects-showcase/index.html
index 08de5b7..6cb721f 100644
--- a/public/en/cases/mini-projects-showcase/index.html
+++ b/public/en/cases/mini-projects-showcase/index.html
@@ -786,6 +786,17 @@
             </div>
           </div>
 
+          <div class="mp-showcase-specimen-row">
+            <div class="mp-showcase-specimen__card">
+              <p class="mp-showcase-specimen__label"><code>mp-card--horizontal-right</code> + <code>mp-card--link</code></p>
+              <a class="mp-card mp-card--link mp-card--horizontal mp-card--horizontal-right" href="#" aria-label="Horizontal with image on the right — example card">
+                <div class="mp-card__media" aria-hidden="true"><img class="mp-card__image" src="../../../assets/shared/placeholder.webp" alt="" width="360" height="203" loading="lazy" decoding="async" /></div>
+                <div class="mp-card__body"><h3 class="mp-card__title">Horizontal — image on the right <span class="mp-card__ext" aria-hidden="true"></span></h3><ul class="mp-card__tags" aria-label="Project type"><li class="mp-card__tag">app</li></ul><p class="mp-card__desc">The same horizontal card with the preview fixed on the right.</p></div>
+              </a>
+            </div>
+            <div class="mp-showcase-specimen__desc"><p class="section__prose"><strong>Image on the right.</strong> Add <code>mp-card--horizontal-right</code> to a horizontal card.</p></div>
+          </div>
+
           <div class="mp-showcase-specimen-row">
             <div class="mp-showcase-specimen__card">
               <p class="mp-showcase-specimen__label"><code>mp-card--compact</code> + <code>mp-card--link</code></p>
diff --git a/src/partials/mini-projects-showcase-specimens.en.html b/src/partials/mini-projects-showcase-specimens.en.html
index e9ad5af..553f4dd 100644
--- a/src/partials/mini-projects-showcase-specimens.en.html
+++ b/src/partials/mini-projects-showcase-specimens.en.html
@@ -148,6 +148,17 @@
             </div>
           </div>
 
+          <div class="mp-showcase-specimen-row">
+            <div class="mp-showcase-specimen__card">
+              <p class="mp-showcase-specimen__label"><code>mp-card--horizontal-right</code> + <code>mp-card--link</code></p>
+              <a class="mp-card mp-card--link mp-card--horizontal mp-card--horizontal-right" href="#" aria-label="Horizontal with image on the right — example card">
+                <div class="mp-card__media" aria-hidden="true"><img class="mp-card__image" src="{{assetPrefix}}assets/shared/placeholder.webp" alt="" width="360" height="203" loading="lazy" decoding="async" /></div>
+                <div class="mp-card__body"><h3 class="mp-card__title">Horizontal — image on the right <span class="mp-card__ext" aria-hidden="true"></span></h3><ul class="mp-card__tags" aria-label="Project type"><li class="mp-card__tag">app</li></ul><p class="mp-card__desc">The same horizontal card with the preview fixed on the right.</p></div>
+              </a>
+            </div>
+            <div class="mp-showcase-specimen__desc"><p class="section__prose"><strong>Image on the right.</strong> Add <code>mp-card--horizontal-right</code> to a horizontal card.</p></div>
+          </div>
+
           <div class="mp-showcase-specimen-row">
             <div class="mp-showcase-specimen__card">
               <p class="mp-showcase-specimen__label"><code>mp-card--compact</code> + <code>mp-card--link</code></p>
diff --git a/src/partials/mini-projects-showcase-specimens.html b/src/partials/mini-projects-showcase-specimens.html
index 30d8b31..57951b4 100644
--- a/src/partials/mini-projects-showcase-specimens.html
+++ b/src/partials/mini-projects-showcase-specimens.html
@@ -148,6 +148,23 @@
             </div>
           </div>
 
+          <div class="mp-showcase-specimen-row">
+            <div class="mp-showcase-specimen__card">
+              <p class="mp-showcase-specimen__label"><code>mp-card--horizontal-right</code> + <code>mp-card--link</code></p>
+              <a class="mp-card mp-card--link mp-card--horizontal mp-card--horizontal-right" href="#" aria-label="Horizontal с картинкой справа — пример карточки">
+                <div class="mp-card__media" aria-hidden="true">
+                  <img class="mp-card__image" src="{{assetPrefix}}assets/shared/placeholder.webp" alt="" width="360" height="203" loading="lazy" decoding="async" />
+                </div>
+                <div class="mp-card__body">
+                  <h3 class="mp-card__title">Horizontal — картинка справа <span class="mp-card__ext" aria-hidden="true"></span></h3>
+                  <ul class="mp-card__tags" aria-label="Тип проекта"><li class="mp-card__tag">приложение</li></ul>
+                  <p class="mp-card__desc">Та же горизонтальная карточка, но превью закреплено справа.</p>
+                </div>
+              </a>
+            </div>
+            <div class="mp-showcase-specimen__desc"><p class="section__prose"><strong>Картинка справа.</strong> Добавьте модификатор <code>mp-card--horizontal-right</code> к горизонтальной карточке.</p></div>
+          </div>
+
           <div class="mp-showcase-specimen-row">
             <div class="mp-showcase-specimen__card">
               <p class="mp-showcase-specimen__label"><code>mp-card--compact</code> + <code>mp-card--link</code></p>