diff --git a/assets/css/site.css b/assets/css/site.css
index 2c9ed75..3086535 100644
--- a/assets/css/site.css
+++ b/assets/css/site.css
@@ -1458,6 +1458,19 @@ body#values {
                 box-shadow: none;
                 margin: 0.5rem -0.5rem -0.5rem 0.5rem;
             }
+
+            &#honeycomb {
+                background-position: top 10% right -35%;
+                background-size: 50% auto;
+
+                div {
+                    gap: 1rem;
+
+                    > figure {
+                        max-width: 22.5%;
+                    }
+                }
+            }
         }
     }
 
@@ -1679,15 +1692,6 @@ body#values {
                     width: 25dvh;
                 }
             }
-
-            section#studies {
-                padding-left: 1.5rem;
-                padding-right: 1.5rem;
-
-                article h2 {
-                    font-size: 2.5rem;
-                }
-            }
         }
 
         > footer {
@@ -1701,6 +1705,21 @@ body#values {
         }
     }
 
+    /* case study list adjustments */
+    section#studies {
+        padding-left: 1.5rem;
+        padding-right: 1.5rem;
+
+        article h2 {
+            font-size: 2.5rem;
+        }
+
+        article#honeycomb {
+            background-position: top 10% right -5%;
+            background-size: 35% auto;
+        }
+    }
+
     /* single page docs */
     body#values main > article {
         padding: 10dvh 0 5dvh;
@@ -1861,4 +1880,12 @@ body#values {
     :root {
         --article-grid: 17rem var(--content-width) 7rem;
     }
+
+    /* case study card adjustments */
+    section#studies {
+        article#honeycomb {
+            background-position: top 10% right -5%;
+            background-size: 30% auto;
+        }
+    }
 }
\ No newline at end of file
diff --git a/content/studies/honeycomb/card.png b/content/studies/honeycomb/card.png
new file mode 100644
index 0000000..f9acc24
Binary files /dev/null and b/content/studies/honeycomb/card.png differ
diff --git a/content/studies/honeycomb/index.md b/content/studies/honeycomb/index.md
index d50f221..2eca44d 100644
--- a/content/studies/honeycomb/index.md
+++ b/content/studies/honeycomb/index.md
@@ -11,6 +11,7 @@ hero:
   html: '<div id="grid"><div id="shapes"><div id="square"></div><div id="circle"></div><div id="rectangle"></div><div id="triangle"></div></div></div>'
 list:
   more: "My company needed a design system to unify six very different products as one new edtech platform. We did that while managing very different frontends and skill levels, urgent accessibility needs, and no single framework that everyone could share."
+  img: card.png
   color: yellow
   facts:
     - key: Role
diff --git a/content/studies/legacy/img/card-legacy.png b/content/studies/legacy/card.png
similarity index 100%
rename from content/studies/legacy/img/card-legacy.png
rename to content/studies/legacy/card.png
diff --git a/content/studies/legacy/index.md b/content/studies/legacy/index.md
index 4ac07cc..f8eb5bc 100644
--- a/content/studies/legacy/index.md
+++ b/content/studies/legacy/index.md
@@ -11,7 +11,7 @@ hero:
   svg: kangaroo-eyes.svg
 list:
   more: "Wallabyte supports schools and families through critical paperwork, but was woefully unusable. This case study covers how I approached that challenge—from identifying the highest impact issues to shaping a more coherent forms experience."
-  img: card-legacy.png
+  img: card.png
   color: blue
   facts:
     - key: Role
diff --git a/layouts/index.html b/layouts/index.html
index a7b209c..366edb0 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -31,10 +31,11 @@
     {{- $page := . -}}
     {{- $image := "" -}}
     {{- $color := "" -}}
+    {{- $cardID := .Slug | default .File.ContentBaseName -}}
     {{- with .Params.list.img -}}
       {{- $match := $page.Resources.GetMatch . -}}
       {{- if not $match -}}
-        {{- $match = $page.Resources.GetMatch (printf "img/%s" .) -}}
+        {{- $match = $page.Resources.GetMatch (printf "%s" .) -}}
       {{- end -}}
       {{- with $match -}}
         {{- $image = .RelPermalink -}}
@@ -43,7 +44,7 @@
     {{- with .Params.list.color -}}
       {{- $color = . -}}
     {{- end -}}
-  <article{{ with $color }} color="{{ . }}"{{ end }}{{ with $image }} style="--card-bg: url('{{ . }}');"{{ end }}>
+  <article id="{{ $cardID }}"{{ with $color }} color="{{ . }}"{{ end }}{{ with $image }} style="--card-bg: url('{{ . }}');"{{ end }}>
     <a href="{{ .RelPermalink }}">
       <h2>{{ .Title }}</h2>
       <p>{{ .Summary }}</p>
@@ -73,4 +74,4 @@
   </article>
   {{- end -}}
 </section>
-{{ end }}
\ No newline at end of file
+{{ end }}
diff --git a/layouts/shortcodes/figure.html b/layouts/shortcodes/figure.html
index 4987e44..82d1582 100644
--- a/layouts/shortcodes/figure.html
+++ b/layouts/shortcodes/figure.html
@@ -12,6 +12,7 @@
   {{- with $caption }}
   <figcaption>
     {{ $caption | markdownify }}
+    <a href="{{ $url }}" class="tablet-hide">Expand</a>
   </figcaption>
   {{- end }}
 </figure>
\ No newline at end of file