fix: row thumbnail cell is 3:2 landscape, holds its own aspect ratio

Was stretching to body height via items-stretch; give the image cell
aspect-[3/2] and self-start so a 3:2 thumbnail displays at its intended
ratio instead of being cropped to the row height.

2 files changed, 22 insertions, 23 deletions

diff --git a/assets/css/main.min.css b/assets/css/main.min.css
index 44735f9..048b8e7 100644
--- a/assets/css/main.min.css
+++ b/assets/css/main.min.css
@@ -1648,11 +1648,6 @@ button,
 
 /* Legacy type-* classes for compatibility (with badge styling) */
 
-.type-tech {
-  color: var(--type-tech);
-  background-color: rgba(168, 85, 247, 0.1);
-}
-
 .type-life {
   color: var(--type-life);
   background-color: rgba(245, 158, 11, 0.1);
@@ -1663,6 +1658,11 @@ button,
   background-color: rgba(0, 255, 136, 0.1);
 }
 
+.type-link {
+  color: var(--type-link);
+  background-color: rgba(56, 189, 248, 0.1);
+}
+
 /* Card component */
 
 .card {
@@ -2460,6 +2460,10 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
   margin-left: 0.5rem;
 }
 
+.ml-auto {
+  margin-left: auto;
+}
+
 .mt-0\.5 {
   margin-top: 0.125rem;
 }
@@ -2546,6 +2550,10 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
   display: none;
 }
 
+.aspect-\[3\/2\] {
+  aspect-ratio: 3/2;
+}
+
 .aspect-video {
   aspect-ratio: 16 / 9;
 }
@@ -2554,10 +2562,6 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
   height: 0.25rem;
 }
 
-.h-24 {
-  height: 6rem;
-}
-
 .h-3 {
   height: 0.75rem;
 }
@@ -2602,10 +2606,6 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
   max-height: 24rem;
 }
 
-.min-h-\[10rem\] {
-  min-height: 10rem;
-}
-
 .min-h-\[calc\(100vh-200px\)\] {
   min-height: calc(100vh - 200px);
 }
@@ -2622,10 +2622,6 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
   width: 5rem;
 }
 
-.w-24 {
-  width: 6rem;
-}
-
 .w-3 {
   width: 0.75rem;
 }
@@ -2856,6 +2852,10 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
   border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
 }
 
+.self-start {
+  align-self: flex-start;
+}
+
 .overflow-hidden {
   overflow: hidden;
 }
@@ -2987,11 +2987,6 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
   background-color: var(--surface);
 }
 
-.object-contain {
-  -o-object-fit: contain;
-     object-fit: contain;
-}
-
 .object-cover {
   -o-object-fit: cover;
      object-fit: cover;
@@ -5279,6 +5274,10 @@ html.theme-light .hero-name {
     height: 12rem;
   }
 
+  .md\:h-64 {
+    height: 16rem;
+  }
+
   .md\:w-1\/3 {
     width: 33.333333%;
   }
diff --git a/layouts/partials/project-row.html b/layouts/partials/project-row.html
index 5a65f35..7a1e209 100644
--- a/layouts/partials/project-row.html
+++ b/layouts/partials/project-row.html
@@ -24,7 +24,7 @@
 
 <article class="group flex flex-col md:flex-row {{ if $reverse }}md:flex-row-reverse{{ end }} gap-6 items-stretch border-l-4 border-accent bg-surface/30 rounded-lg overflow-hidden transition-all duration-200 hover:-translate-y-1 hover:shadow-lg hover:bg-surface/50">
   <!-- Visual (decorative duplicate of the title link; hidden from AT) -->
-  <a href="{{ $p.RelPermalink }}" tabindex="-1" aria-hidden="true" class="md:w-1/3 flex-shrink-0 flex items-center justify-center bg-bg/40 min-h-[10rem]">
+  <a href="{{ $p.RelPermalink }}" tabindex="-1" aria-hidden="true" class="md:w-1/3 flex-shrink-0 self-start flex items-center justify-center bg-bg/40 aspect-[3/2] overflow-hidden">
     {{ if $imageURL }}
       <img src="{{ $imageURL }}" alt="" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-200" loading="lazy" />
     {{ else }}