diff --git a/layouts/partials/article-link/card-related.html b/layouts/partials/article-link/card-related.html
index f84bdd81..f576763a 100644
--- a/layouts/partials/article-link/card-related.html
+++ b/layouts/partials/article-link/card-related.html
@@ -1,4 +1,3 @@
-{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
 {{ with .Params.externalUrl }}
 <a href="{{ . }}" target="_blank" rel="external" class="min-w-full">
   {{ else }}
@@ -10,30 +9,30 @@
       {{- range first 6 . }}
       <meta property="og:image" content="{{ . | absURL }}" />{{ end -}}
       {{- else -}}
-      {{- $images := $.Resources.ByType "image" -}}
-      {{- $featured := $images.GetMatch "*feature*" -}}
-      {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
-      {{ if and .Params.featureimage (not $featured) }}
-      {{- $url:= .Params.featureimage -}}
-      {{ $featured = resources.GetRemote $url }}
-      {{ end }}
-      {{- if not $featured }}{{ with .Site.Params.defaultFeaturedImage }}{{ $featured = resources.Get . }}{{ end }}{{ end -}}
-      {{- with $featured -}}
-      {{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
-        {{ with . }}
-        <div class="w-full thumbnail_card_related nozoom" style="background-image:url({{ .RelPermalink }});"></div>
+        {{ $images := $.Resources.ByType "image" }}
+        {{ $featuredImage := $images.GetMatch "*feature*" }}
+        {{ if not $featuredImage }}
+          {{ $featuredImage = $images.GetMatch "{*cover*,*thumbnail*}" }}
         {{ end }}
-      {{ else }}
-        {{ with .Resize "600x" }}
-        <div class="w-full thumbnail_card_related nozoom" style="background-image:url({{ .RelPermalink }});"></div>
+        {{ if and (not $featuredImage) .Params.featureimage }}
+          {{ $featuredImage = resources.GetRemote .Params.featureimage }}
+        {{ end }}
+        {{ if not $featuredImage }}
+          {{ $featuredImage = resources.Get .Site.Params.defaultFeaturedImage }}
+        {{ end }}
+        {{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
+        {{ if and ($featuredImage) (not (or ($disableImageOptimization) (strings.HasSuffix $featuredImage.Name ".svg"))) }}
+          {{ $featuredImage = $featuredImage.Resize "600x" }}
+        {{ end }}
+        {{ with $featuredImage }}
+          {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+          <div class="w-full thumbnail_card_related nozoom {{ $className }}"></div>
+        {{ else }}
+          {{ with $.Site.Params.images }}
+            <meta property="og:image" content="{{ index . 0 | absURL }}" />
         {{ end }}
       {{ end }}
-      {{- else -}}
-      {{- with $.Site.Params.images }}
-      <meta property="og:image" content="{{ index . 0 | absURL }}" />{{ end -}}
-      {{- end -}}
-      {{- end -}}
-
+    {{ end }}
 
       {{ if and .Draft .Site.Params.article.showDraftLabel }}
       <span class="absolute top-0 right-0 m-2">
diff --git a/layouts/partials/article-link/card.html b/layouts/partials/article-link/card.html
index c876e35d..0ce06e75 100644
--- a/layouts/partials/article-link/card.html
+++ b/layouts/partials/article-link/card.html
@@ -1,4 +1,3 @@
-{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
 {{ with .Params.externalUrl }}
 <a href="{{ . }}" target="_blank" rel="external" class="min-w-full">
   {{ else }}
@@ -10,30 +9,33 @@
       {{- range first 6 . }}
       <meta property="og:image" content="{{ . | absURL }}" />{{ end -}}
       {{- else -}}
-      {{- $images := $.Resources.ByType "image" -}}
-      {{- $featured := $images.GetMatch "*feature*" -}}
-      {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
-      {{ if and .Params.featureimage (not $featured) }}
-      {{- $url:= .Params.featureimage -}}
-      {{ $featured = resources.GetRemote $url }}
-      {{ end }}
-      {{- if not $featured }}{{ with .Site.Params.defaultFeaturedImage }}{{ $featured = resources.Get . }}{{ end }}{{ end -}}
-      {{ if .Params.hideFeatureImage }}{{ $featured = false }}{{ end }}
-      {{- with $featured -}}
-      {{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
-        {{ with . }}
-        <div class="w-full thumbnail_card nozoom" style="background-image:url({{ .RelPermalink }});"></div>
+        {{ $images := $.Resources.ByType "image" }}
+        {{ $featuredImage := $images.GetMatch "*feature*" }}
+        {{ if not $featuredImage }}
+          {{ $featuredImage = $images.GetMatch "{*cover*,*thumbnail*}" }}
         {{ end }}
-      {{ else }}
-        {{ with .Resize "600x" }}
-        <div class="w-full thumbnail_card nozoom" style="background-image:url({{ .RelPermalink }});"></div>
+        {{ if and (not $featuredImage) .Params.featureimage }}
+          {{ $featuredImage = resources.GetRemote .Params.featureimage }}
+        {{ end }}
+        {{ if not $featuredImage }}
+          {{ $featuredImage = resources.Get .Site.Params.defaultFeaturedImage }}
+        {{ end }}
+        {{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
+        {{ if and ($featuredImage) (not (or ($disableImageOptimization) (strings.HasSuffix $featuredImage.Name ".svg"))) }}
+          {{ $featuredImage = $featuredImage.Resize "600x" }}
+        {{ end }}
+        {{ if .Params.hideFeatureImage }}
+          {{ $featuredImage = false }}
+        {{ end }}
+        {{ with $featuredImage }}
+          {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+          <div class="w-full thumbnail_card nozoom {{ $className }}"></div>
+        {{ else }}
+          {{ with $.Site.Params.images }}
+            <meta property="og:image" content="{{ index . 0 | absURL }}" />
         {{ end }}
       {{ end }}
-      {{- else -}}
-      {{- with $.Site.Params.images }}
-      <meta property="og:image" content="{{ index . 0 | absURL }}" />{{ end -}}
-      {{- end -}}
-      {{- end -}}
+    {{ end }}
 
 
       {{ if and .Draft .Site.Params.article.showDraftLabel }}
diff --git a/layouts/partials/article-link/simple.html b/layouts/partials/article-link/simple.html
index 5299d663..e56a2afd 100644
--- a/layouts/partials/article-link/simple.html
+++ b/layouts/partials/article-link/simple.html
@@ -14,8 +14,6 @@
 {{ $articleImageClasses = delimit (slice $articleImageClasses "thumbnailshadow md:mr-7") " " }}
 {{ end }}
 
-{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
-
 {{ $articleInnerClasses := "" }}
 {{ if .Site.Params.list.showCards }}
 {{ $articleInnerClasses = delimit (slice $articleInnerClasses "p-4") " " }}
@@ -37,30 +35,33 @@
     {{- range first 6 . }}
     <meta property="og:image" content="{{ . | absURL }}" />{{ end -}}
     {{- else -}}
-    {{- $images := $.Resources.ByType "image" -}}
-    {{- $featured := $images.GetMatch "*feature*" -}}
-    {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
-    {{ if and .Params.featureimage (not $featured) }}
-    {{- $url:= .Params.featureimage -}}
-    {{ $featured = resources.GetRemote $url }}
-    {{ end }}
-    {{- if not $featured }}{{ with .Site.Params.defaultFeaturedImage }}{{ $featured = resources.Get . }}{{ end }}{{ end -}}
-    {{ if .Params.hideFeatureImage }}{{ $featured = false }}{{ end }}
-    {{- with $featured -}}
-    {{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
-        {{ with . }}
-        <div class="{{ $articleImageClasses }}" style="background-image:url({{ .RelPermalink }});"></div>
-        {{ end }}
+      {{ $images := $.Resources.ByType "image" }}
+      {{ $featuredImage := $images.GetMatch "*feature*" }}
+      {{ if not $featuredImage }}
+        {{ $featuredImage = $images.GetMatch "{*cover*,*thumbnail*}" }}
+      {{ end }}
+      {{ if and (not $featuredImage) .Params.featureimage }}
+        {{ $featuredImage = resources.GetRemote .Params.featureimage }}
+      {{ end }}
+      {{ if not $featuredImage }}
+        {{ $featuredImage = resources.Get .Site.Params.defaultFeaturedImage }}
+      {{ end }}
+      {{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
+      {{ if and ($featuredImage) (not (or ($disableImageOptimization) (strings.HasSuffix $featuredImage.Name ".svg"))) }}
+        {{ $featuredImage = $featuredImage.Resize "600x" }}
+      {{ end }}
+      {{ if .Params.hideFeatureImage }}
+        {{ $featuredImage = false }}
+      {{ end }}
+      {{ with $featuredImage }}
+        {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+        <div class="{{ $articleImageClasses }} {{ $className }}"></div>
       {{ else }}
-        {{ with .Resize "600x"  }}
-        <div class="{{ $articleImageClasses }}" style="background-image:url({{ .RelPermalink }});"></div>
+        {{ with $.Site.Params.images }}
+          <meta property="og:image" content="{{ index . 0 | absURL }}" />
         {{ end }}
       {{ end }}
-    {{- else -}}
-    {{- with $.Site.Params.images }}
-    <meta property="og:image" content="{{ index . 0 | absURL }}" />{{ end -}}
-    {{- end -}}
-    {{- end -}}
+    {{ end }}
 
 
     <div class="{{ $articleInnerClasses }}">
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 424f8c98..78509d3e 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -45,6 +45,38 @@
   {{ if $cssCustom }}
   {{ $assets.Add "css" (slice $cssCustom) }}
   {{ end }}
+
+  {{ $images := slice }}
+  {{ $backgroundAndfeaturedImages := slice }}
+  {{ range .Site.Pages }}
+    {{ $images = $images | append (.Page.Resources.ByType "image") }}
+    {{ if .Params.featureimage }}
+      {{ $backgroundAndfeaturedImages = $backgroundAndfeaturedImages | append (resources.GetRemote .Params.featureimage) }}
+    {{ end }}
+  {{ end }}
+  {{ $backgroundAndfeaturedImages = $backgroundAndfeaturedImages | append ($images.Match "{*background*,*feature*,*cover*,*thumbnail*}") }}
+  {{ $siteParams := slice .Site.Params.defaultFeaturedImage .Site.Params.defaultBackgroundImage }}
+  {{ range $siteParams }}
+    {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
+      {{ $backgroundAndfeaturedImages = $backgroundAndfeaturedImages | append (resources.GetRemote .) }}
+    {{ else }}
+      {{ $backgroundAndfeaturedImages = $backgroundAndfeaturedImages | append (resources.Get .) }}
+    {{ end }}
+  {{ end }}
+  {{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
+  {{ range $backgroundAndfeaturedImages }}
+    {{ $backgroundAndfeaturedImages := . }}
+    {{ if not (or ($disableImageOptimization) (strings.HasSuffix .Name ".svg")) }}
+      {{ $backgroundAndfeaturedImages = .Resize "600x" }}
+    {{ end }}
+    {{ with $backgroundAndfeaturedImages }}
+      {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+      {{ $cssBackgroundImage := printf ".%s { background-image: url(\"%s\"); }" $className .RelPermalink }}
+      {{ $cssBackgroundImage = $cssBackgroundImage | resources.FromString "css/background-image.css" }}
+      {{ $assets.Add "css" (slice $cssBackgroundImage) }}
+    {{ end }}
+  {{ end }}
+
   {{ $bundleCSS := $assets.Get "css" | resources.Concat "css/main.bundle.css" | resources.Minify | resources.Fingerprint
   (.Site.Params.fingerprintAlgorithm | default "sha512") }}
   <link type="text/css" rel="stylesheet" href="{{ $bundleCSS.RelPermalink }}"
diff --git a/layouts/partials/hero/background.html b/layouts/partials/hero/background.html
index c3adf2e0..674df3c8 100644
--- a/layouts/partials/hero/background.html
+++ b/layouts/partials/hero/background.html
@@ -1,62 +1,55 @@
-{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
-
-{{- $images := .Resources.ByType "image" -}}
-{{- $featured := $images.GetMatch "*background*" -}}
-{{- if not $featured }}{{ $featured = $images.GetMatch "*feature*" }}{{ end -}}
-{{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
-
-{{ if and .Params.featureimage (not $featured) }}
-{{- $url:= .Params.featureimage -}}
-{{ $featured = resources.GetRemote $url }}
+{{ $images := .Resources.ByType "image" }}
+{{ $backgroundImage := $images.GetMatch "*background*" }}
+{{ if not $backgroundImage }}
+  {{ $backgroundImage := $images.GetMatch "*feature*" }}
 {{ end }}
-
-{{- if not $featured }}
- {{ with .Site.Params.defaultBackgroundImage }}
-  {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
-   {{ $featured = resources.GetRemote . }}
-  {{ else }}
-   {{ $featured = resources.Get . }}
+{{ if not $backgroundImage }}
+  {{ $backgroundImage = $images.GetMatch "{*cover*,*thumbnail*}" }}
+{{ end }}
+{{ if and (not $backgroundImage) .Params.featureimage }}
+  {{ $backgroundImage = resources.GetRemote .Params.featureimage }}
+{{ end }}
+{{ if not $backgroundImage }}
+  {{ with .Site.Params.defaultBackgroundImage }}
+    {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
+      {{ $backgroundImage = resources.GetRemote . }}
+    {{ else }}
+      {{ $backgroundImage = resources.Get . }}
+    {{ end }}
   {{ end }}
- {{ end }}
-{{ end -}}
+{{ end }}
+{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
+{{ if and ($backgroundImage) (not (or ($disableImageOptimization) (strings.HasSuffix $backgroundImage.Name ".svg"))) }}
+  {{ $backgroundImage = $backgroundImage.Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
+{{ end }}
 
 {{ $isParentList := eq (.Scratch.Get "scope") "list"  }}
-{{ $shouldBlur := $.Params.layoutBackgroundBlur | default (or 
-        (and ($.Site.Params.article.layoutBackgroundBlur | default true) (not $isParentList)) 
+{{ $shouldBlur := $.Params.layoutBackgroundBlur | default (or
+        (and ($.Site.Params.article.layoutBackgroundBlur | default true) (not $isParentList))
         (and ($.Site.Params.list.layoutBackgroundBlur | default true) ($isParentList))
     ) }}
-{{ $shouldAddHeaderSpace := $.Params.layoutBackgroundHeaderSpace | default (or 
-        (and ($.Site.Params.article.layoutBackgroundHeaderSpace | default true) (not $isParentList)) 
+{{ $shouldAddHeaderSpace := $.Params.layoutBackgroundHeaderSpace | default (or
+        (and ($.Site.Params.article.layoutBackgroundHeaderSpace | default true) (not $isParentList))
         (and ($.Site.Params.list.layoutBackgroundHeaderSpace | default true) ($isParentList))
     ) }}
-{{- with $featured -}}
 
-{{ if $shouldAddHeaderSpace | default true}}
-<div id="hero" class="h-[150px] md:h-[200px]"></div>
-{{ end }}
-
-{{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
-    {{ with . }}
-    <div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
-    style="background-image:url({{ .RelPermalink }});">
-    {{ end }}
-{{ else }}
-    {{ with .Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
-    <div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
-    style="background-image:url({{ .RelPermalink }});">
-    {{ end }}
-{{ end }}
-
-    <div class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal">
+{{ with $backgroundImage }}
+  {{ if $shouldAddHeaderSpace | default true}}
+    <div id="hero" class="h-[150px] md:h-[200px]"></div>
+  {{ end }}
+  {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+  <div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom {{ $className }}">
+    <div
+      class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal">
     </div>
     <div
-        class="absolute inset-0 opacity-60 bg-gradient-to-t from-neutral dark:from-neutral-800 to-neutral-100 dark:to-neutral-800 mix-blend-normal">
+      class="absolute inset-0 opacity-60 bg-gradient-to-t from-neutral dark:from-neutral-800 to-neutral-100 dark:to-neutral-800 mix-blend-normal">
     </div>
-</div>
-{{ if $shouldBlur | default false }}
-<div id="background-blur" class="fixed opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl"></div>
-{{ $backgroundBlur := resources.Get "js/background-blur.js" }}
-{{ $backgroundBlur = $backgroundBlur | resources.Minify | resources.Fingerprint ($.Site.Params.fingerprintAlgorithm | default "sha512") }}
-<script type="text/javascript" src="{{ $backgroundBlur.RelPermalink }}" integrity="{{ $backgroundBlur.Data.Integrity }}" data-target-id="background-blur"></script>
+  </div>
+  {{ if $shouldBlur | default false }}
+    <div id="background-blur" class="fixed opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl"></div>
+    {{ $backgroundBlur := resources.Get "js/background-blur.js" }}
+    {{ $backgroundBlur = $backgroundBlur | resources.Minify | resources.Fingerprint ($.Site.Params.fingerprintAlgorithm | default "sha512") }}
+    <script type="text/javascript" src="{{ $backgroundBlur.RelPermalink }}" integrity="{{ $backgroundBlur.Data.Integrity }}" data-target-id="background-blur"></script>
+  {{ end }}
 {{ end }}
-{{- end -}}
diff --git a/layouts/partials/hero/basic.html b/layouts/partials/hero/basic.html
index 54e84ed3..de8e0882 100644
--- a/layouts/partials/hero/basic.html
+++ b/layouts/partials/hero/basic.html
@@ -1,37 +1,29 @@
-{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
-
-{{- $images := .Resources.ByType "image" -}}
-{{- $featured := $images.GetMatch "*background*" -}}
-{{- if not $featured }}{{ $featured = $images.GetMatch "*feature*" }}{{ end -}}
-{{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
-
-{{ if and .Params.featureimage (not $featured) }}
-  {{- $url:= .Params.featureimage -}}
-  {{ $featured = resources.GetRemote $url }}
+{{ $images := .Resources.ByType "image" }}
+{{ $backgroundImage := $images.GetMatch "*background*" }}
+{{ if not $backgroundImage }}
+  {{ $backgroundImage := $images.GetMatch "*feature*" }}
 {{ end }}
-
-{{- if not $featured }}
+{{ if not $backgroundImage }}
+  {{ $backgroundImage = $images.GetMatch "{*cover*,*thumbnail*}" }}
+{{ end }}
+{{ if and (not $backgroundImage) .Params.featureimage }}
+  {{ $backgroundImage = resources.GetRemote .Params.featureimage }}
+{{ end }}
+{{ if not $backgroundImage }}
   {{ with .Site.Params.defaultBackgroundImage }}
     {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
-      {{ $featured = resources.GetRemote . }}
+      {{ $backgroundImage = resources.GetRemote . }}
     {{ else }}
-      {{ $featured = resources.Get . }}
+      {{ $backgroundImage = resources.Get . }}
     {{ end }}
   {{ end }}
-{{ end -}}
+{{ end }}
+{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
+{{ if and ($backgroundImage) (not (or ($disableImageOptimization) (strings.HasSuffix $backgroundImage.Name ".svg"))) }}
+  {{ $backgroundImage = $backgroundImage.Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
+{{ end }}
 
-{{- with $featured -}}
-  {{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg") }}
-    {{ with . }}
-      <div
-        class="w-full h-36 md:h-56 lg:h-72 single_hero_basic nozoom"
-        style="background-image:url({{ .RelPermalink }});"></div>
-    {{ end }}
-  {{ else }}
-    {{ with .Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
-      <div
-        class="w-full h-36 md:h-56 lg:h-72 single_hero_basic nozoom"
-        style="background-image:url({{ .RelPermalink }});"></div>
-    {{ end }}
-  {{ end }}
-{{- end -}}
+{{ with $backgroundImage }}
+  {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+  <div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom {{ $className }}"></div>
+{{ end }}
diff --git a/layouts/partials/hero/thumbAndBackground.html b/layouts/partials/hero/thumbAndBackground.html
index 2a8448cb..841f83ec 100644
--- a/layouts/partials/hero/thumbAndBackground.html
+++ b/layouts/partials/hero/thumbAndBackground.html
@@ -1,98 +1,77 @@
-{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
-
-{{- $images := .Resources.ByType "image" -}}
-{{- $background := $images.GetMatch "*background*" -}}
-
-{{- if not $background }}
+{{ $images := .Resources.ByType "image" }}
+{{ $backgroundImage := $images.GetMatch "*background*" }}
+{{ if not $backgroundImage }}
   {{ with .Site.Params.defaultBackgroundImage }}
     {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
-      {{ $background = resources.GetRemote . }}
+      {{ $backgroundImage = resources.GetRemote . }}
     {{ else }}
-      {{ $background = resources.Get . }}
+      {{ $backgroundImage = resources.Get . }}
     {{ end }}
   {{ end }}
-{{ end -}}
-
-{{- if not $background }}{{ $background = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
-{{- if not $background }}{{ $background = $images.GetMatch "*feature*" }}{{ end -}}
-{{- $featured := $images.GetMatch "*feature*" -}}
-{{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
-{{ if .Params.featureimage }}
-  {{- $url:= .Params.featureimage -}}
-  {{- if not $featured }}{{ $featured = resources.GetRemote $url }}{{ end -}}
 {{ end }}
-{{- if not $featured }}{{ $featured = $images.GetMatch "*background*" }}{{ end -}}
+{{ if not $backgroundImage }}
+  {{ $backgroundImage = $images.GetMatch "{*cover*,*thumbnail*}" }}
+{{ end }}
+{{ if not $backgroundImage }}
+  {{ $backgroundImage := $images.GetMatch "*feature*" }}
+{{ end }}
+{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
+{{ if and ($backgroundImage) (not (or ($disableImageOptimization) (strings.HasSuffix $backgroundImage.Name ".svg"))) }}
+  {{ $backgroundImage = $backgroundImage.Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
+{{ end }}
 
-{{- if not $featured }}
+{{ $featuredImage := $images.GetMatch "*feature*" }}
+{{ if not $featuredImage }}
+  {{ $featuredImage = $images.GetMatch "{*cover*,*thumbnail*}" }}
+{{ end }}
+{{ if and (not $featuredImage) .Params.featureimage }}
+  {{ $featuredImage = resources.GetRemote .Params.featureimage }}
+{{ end }}
+{{ if not $featuredImage }}
+  {{ $featuredImage = resources.Get .Site.Params.defaultFeaturedImage }}
+{{ end }}
+{{ if not $featuredImage }}
+  {{ $featuredImage := $images.GetMatch "*background*" }}
+{{ end }}
+{{ if not $featuredImage }}
   {{ with .Site.Params.defaultFeaturedImage }}
     {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
-      {{ $featured = resources.GetRemote . }}
+      {{ $featuredImage = resources.GetRemote . }}
     {{ else }}
-      {{ $featured = resources.Get . }}
+      {{ $featuredImage = resources.Get . }}
     {{ end }}
   {{ end }}
-{{ end -}}
+{{ end }}
+{{ if and ($featuredImage) (not (or ($disableImageOptimization) (strings.HasSuffix $featuredImage.Name ".svg"))) }}
+  {{ $featuredImage = $featuredImage.Resize "600x" }}
+{{ end }}
 
-{{ $isParentList := eq (.Scratch.Get "scope") "list" }}
+{{ $isParentList := eq (.Scratch.Get "scope") "list"  }}
 {{ $shouldBlur := $.Params.layoutBackgroundBlur | default (or
-  (and ($.Site.Params.article.layoutBackgroundBlur | default true) (not $isParentList))
-  (and ($.Site.Params.list.layoutBackgroundBlur | default true) ($isParentList))
-  )
-}}
+        (and ($.Site.Params.article.layoutBackgroundBlur | default true) (not $isParentList))
+        (and ($.Site.Params.list.layoutBackgroundBlur | default true) ($isParentList))
+    ) }}
 
-{{- with $featured -}}
-  {{ if or $disableImageOptimization (strings.HasSuffix . ".svg") }}
-    {{ with . }}
-      <div
-        class="w-full rounded-md h-36 md:h-56 lg:h-72 single_hero_basic nozoom"
-        style="background-image:url({{ .RelPermalink }});"></div>
-    {{ end }}
-  {{ else }}
-    {{ with .Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
-      <div
-        class="w-full rounded-md h-36 md:h-56 lg:h-72 single_hero_basic nozoom"
-        style="background-image:url({{ .RelPermalink }});"></div>
-    {{ end }}
-  {{ end }}
-{{- end -}}
+{{ with $featuredImage }}
+  {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+  <div class="w-full rounded-md h-36 md:h-56 lg:h-72 single_hero_basic nozoom {{ $className }}"></div>
+{{ end }}
 
-{{- with $background -}}
-
-  {{ if or $disableImageOptimization (strings.HasSuffix . ".svg") }}
-    {{ with . }}
-      <div
-        class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
-        style="background-image:url({{ .RelPermalink }});">
-        <div
-          class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal"></div>
-        <div
-          class="absolute inset-0 opacity-30 dark:opacity-60 bg-gradient-to-t from-neutral dark:from-neutral-800 to-neutral dark:to-neutral-800 mix-blend-normal"></div>
-      </div>
-    {{ end }}
-  {{ else }}
-    {{ with .Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
-      <div
-        class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
-        style="background-image:url({{ .RelPermalink }});">
-        <div
-          class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal"></div>
-        <div
-          class="absolute inset-0 opacity-30 dark:opacity-60 bg-gradient-to-t from-neutral dark:from-neutral-800 to-neutral dark:to-neutral-800 mix-blend-normal"></div>
-      </div>
-    {{ end }}
-  {{ end }}
-
-{{- end -}}
+{{ with $backgroundImage }}
+  {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+  <div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom {{ $className }}">
+    <div
+      class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal">
+    </div>
+    <div
+      class="absolute inset-0 opacity-30 dark:opacity-60 bg-gradient-to-t from-neutral dark:from-neutral-800 to-neutral dark:to-neutral-800 mix-blend-normal">
+    </div>
+  </div>
+{{ end }}
 
 {{ if $shouldBlur | default false }}
-  <div
-    id="background-blur"
-    class="fixed opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl"></div>
+  <div id="background-blur" class="fixed opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl"></div>
   {{ $backgroundBlur := resources.Get "js/background-blur.js" }}
-  {{ $backgroundBlur = $backgroundBlur | resources.Minify | resources.Fingerprint (.Site.Params.fingerprintAlgorithm | default "sha512") }}
-  <script
-    type="text/javascript"
-    src="{{ $backgroundBlur.RelPermalink }}"
-    integrity="{{ $backgroundBlur.Data.Integrity }}"
-    data-target-id="background-blur"></script>
+  {{ $backgroundBlur = $backgroundBlur | resources.Minify | resources.Fingerprint ($.Site.Params.fingerprintAlgorithm | default "sha512") }}
+  <script type="text/javascript" src="{{ $backgroundBlur.RelPermalink }}" integrity="{{ $backgroundBlur.Data.Integrity }}" data-target-id="background-blur"></script>
 {{ end }}
diff --git a/layouts/partials/term-link/card.html b/layouts/partials/term-link/card.html
index 280a74d4..31fdc225 100644
--- a/layouts/partials/term-link/card.html
+++ b/layouts/partials/term-link/card.html
@@ -1,32 +1,29 @@
 <a href="{{ .Page.RelPermalink }}" class="min-w-full">
   <div
     class="border border-neutral-200 dark:border-neutral-700 border-2 rounded overflow-hidden shadow-2xl relative">
-    {{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
-
     {{- with site.Params.images -}}
       {{- range first 6 . }}
         <meta property="og:image" content="{{ . | absURL }}">
       {{ end -}}
     {{- else -}}
-      {{- $images := .Page.Resources.ByType "image" -}}
-      {{- $featured := $images.GetMatch "*feature*" -}}
-      {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
-      {{- with $featured -}}
-        {{ if $disableImageOptimization }}
-          {{ with . }}
-            <div class="w-full thumbnail_card nozoom" style="background-image:url({{ .RelPermalink }});"></div>
-          {{ end }}
-        {{ else }}
-          {{ with .Resize "600x" }}
-            <div class="w-full thumbnail_card nozoom" style="background-image:url({{ .RelPermalink }});"></div>
-          {{ end }}
+      {{ $images := .Page.Resources.ByType "image" }}
+      {{ $featuredImage := $images.GetMatch "*feature*" }}
+      {{ if not $featuredImage }}
+        {{ $featuredImage = $images.GetMatch "{*cover*,*thumbnail*}" }}
+      {{ end }}
+      {{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
+      {{ if and ($featuredImage) (not (or ($disableImageOptimization) (strings.HasSuffix $featuredImage.Name ".svg"))) }}
+        {{ $featuredImage = $featuredImage.Resize "600x" }}
+      {{ end }}
+      {{ with $featuredImage }}
+        {{ $className := printf "background-image-%s" (md5 .RelPermalink) }}
+        <div class="w-full thumbnail_card_related nozoom {{ $className }}"></div>
+      {{ else }}
+        {{ with site.Params.images }}
+          <meta property="og:image" content="{{ index . 0 | absURL }}" />
         {{ end }}
-      {{- else -}}
-        {{- with site.Params.images }}
-          <meta property="og:image" content="{{ index . 0 | absURL }}">
-        {{ end -}}
-      {{- end -}}
-    {{- end -}}
+      {{ end }}
+    {{ end }}
 
     {{ if site.Params.taxonomy.showTermCount | default true }}
       <span class="absolute bottom-0 right-0 m-2">