diff --git a/assets/sass/fonts.scss b/assets/sass/fonts.scss
index a3f8321ae..8b5202314 100644
--- a/assets/sass/fonts.scss
+++ b/assets/sass/fonts.scss
@@ -119,7 +119,6 @@
     U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
     U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193,
     U+2212, U+2215, U+FEFF, U+FFFD;
-  font-display: block; // Do not display icons until font is fully loaded
 }
 
 body,
diff --git a/assets/sass/search.scss b/assets/sass/search.scss
index 65d0bf7a2..47ea2d884 100644
--- a/assets/sass/search.scss
+++ b/assets/sass/search.scss
@@ -10,138 +10,185 @@ $search-z-index-focus: 12;
     display: none;
   }
 
-  .pagefind-ui__search-input,
-  .pagefind-ui__message {
-    font-family: "Roboto", Arial, Helvetica, sans-serif;
-    font-weight: 400;
-  }
-
-  .pagefind-ui__message {
-    padding: 1rem;
-  }
+  .pagefind-ui {
+    width: 100%;
 
-  .pagefind-ui__results-area {
-    margin-top: 0;
-    max-height: 50vh;
-    padding: 0 1rem;
-    overflow-y: scroll;
+    &__form {
+      position: relative;
+
+      &::before {
+        content: "search";
+        position: absolute;
+        top: 23px;
+        left: 20px;
+        z-index: $search-z-index + 1;
+        font-family: "Material Symbols Rounded";
+        opacity: 0.7;
+        pointer-events: none;
+        line-height: 1;
+      }
+    }
 
-    @media (max-width: #{$breakpoint-md}) {
-      max-height: calc(100dvh - 17rem);
+    &__message {
+      padding: 1rem;
+      margin-bottom: 0;
     }
-  }
 
-  .pagefind-ui__results li:last-child {
-    border-bottom: none;
-  }
+    &__results-area {
+      max-height: 50vh;
+      padding: 0 1rem;
+      overflow-y: scroll;
 
-  input.pagefind-ui__search-input {
-    z-index: $search-z-index;
-    outline: 0.2rem solid transparent;
-    border: var(--border);
-    box-shadow: var(--box-shadow);
-    border-radius: var(--border-radius-l);
+      @media (max-width: #{$breakpoint-md}) {
+        max-height: calc(100dvh - 17rem);
+      }
+    }
 
-    @include focus-indicator(0.2rem);
+    &__results {
+      padding-left: 0;
+      margin-bottom: 0;
+    }
 
-    &::placeholder {
-      opacity: 0.7;
+    &__search-input {
+      z-index: $search-z-index;
+      outline: 0.2rem solid transparent;
+      border: var(--border);
+      box-shadow: var(--box-shadow);
+      border-radius: var(--border-radius-l);
+      height: 64px;
+      background-color: var(--bg-default);
       color: var(--color-body);
+      padding: 0 70px 0 54px;
+      font-size: 2rem;
+      position: relative;
+      display: flex;
+      width: 100%;
+      box-sizing: border-box;
+      font-family: "Roboto", Arial, Helvetica, sans-serif;
+
+      @include focus-indicator(0.2rem);
+
+      &::placeholder {
+        opacity: 0.7;
+        color: var(--color-body);
+      }
+
+      // When results are visible
+      &:has(
+        + .pagefind-ui__search-clear
+          + .pagefind-ui__drawer
+          .pagefind-ui__results-area
+      ) {
+        border-radius: var(--border-radius-l) var(--border-radius-l) 0 0;
+      }
     }
 
-    // This selector is used to identify if search results are visible
-    &:has(
-      + .pagefind-ui__search-clear
-        + .pagefind-ui__drawer
-        .pagefind-ui__results-area
-    ) {
-      border-radius: var(--border-radius-l) var(--border-radius-l) 0 0;
+    &__search-clear {
+      display: none;
     }
-  }
-
-  button.pagefind-ui__search-clear {
-    display: none;
-  }
-
-  .pagefind-ui__suppressed {
-    display: none;
-  }
 
-  .pagefind-ui__form::before {
-    z-index: $search-z-index + 1;
-  }
-
-  .pagefind-ui__drawer {
-    background-color: var(--bg-default);
-    padding: 0;
-    overscroll-behavior: contain;
-    overflow: hidden;
-    position: absolute;
-    width: 100%;
-    z-index: $search-z-index;
-    border: var(--border);
-    border-radius: 0 0 var(--border-radius-l) var(--border-radius-l);
-  }
-
-  .pagefind-ui__result {
-    padding: 2rem 0;
-    margin: 0 1rem;
-    border-top: 0.2rem solid grey;
-  }
-
-  .pagefind-ui__result-inner,
-  .pagefind-ui__result-thumb {
-    margin-top: 0;
-  }
-
-  .pagefind-ui__result-thumb {
-    width: 10rem;
-
-    @media (max-width: #{$breakpoint-md}) {
+    &__suppressed {
       display: none;
     }
-  }
 
-  .pagefind-ui__result-link {
-    color: var(--link-default);
-    text-decoration: underline;
-    border-radius: var(--border-radius-s);
-
-    &:hover,
-    &:focus {
-      color: var(--link-hovered);
+    &__drawer {
+      background-color: var(--bg-default);
+      overscroll-behavior: contain;
+      overflow: hidden;
+      position: absolute;
+      width: 100%;
+      z-index: $search-z-index;
+      border: var(--border);
+      border-radius: 0 0 var(--border-radius-l) var(--border-radius-l);
+      box-sizing: border-box;
     }
-  }
 
-  .pagefind-ui__result-link:hover,
-  .pagefind-ui__result-link:focus {
-    color: var(--link-hovered);
-  }
+    &__result {
+      list-style-type: none;
+      display: flex;
+      align-items: flex-start;
+      gap: 3.2rem;
+      padding: 2rem 0;
+      border-top: 0.2rem solid grey;
+      margin: 0 1rem;
+
+      &-inner,
+      &-thumb {
+        margin-top: 0;
+      }
+
+      &-thumb {
+        width: 10rem;
+
+        @media (max-width: #{$breakpoint-md}) {
+          display: none;
+        }
+      }
+
+      &-title {
+        display: inline-block;
+        font-weight: 700;
+        margin: 0;
+      }
+
+      &-nested {
+        display: flex;
+        flex-direction: column;
+        padding-top: 0.8rem;
+        padding-left: 2.4rem;
+
+        .pagefind-ui__result-link {
+          font-size: 1.8rem;
+        }
+
+        .pagefind-ui__result-link::before {
+          content: "subdirectory_arrow_right";
+          font-family: "Material Symbols Rounded";
+          position: absolute;
+          left: -2.4rem;
+        }
+      }
+
+      &-excerpt {
+        margin-bottom: 0;
+      }
+    }
 
-  .pagefind-ui__result-link {
-    @include focus-indicator(0.2rem);
-  }
+    &__result-link {
+      position: relative;
+      font-size: 2.2rem;
+    }
 
-  .pagefind-ui__result-link::before {
-    top: -0.2rem;
-  }
+    &__button {
+      border: 0.2rem solid var(--link-default);
+      border-radius: var(--border-radius-m);
+      background: transparent;
+      color: var(--body-color);
+      height: 4.8rem;
+      padding: 1.2rem;
+      margin-bottom: 1rem;
+      width: 100%;
+      text-align: center;
+      font-weight: 700;
+      transition:
+        background 0.2s,
+        color 0.2s;
+
+      &:hover,
+      &:focus {
+        background: rgba($link-hovered, 0.15);
+      }
+    }
 
-  .pagefind-ui--reset mark {
-    background-color: var(--bg-accent);
-    color: black;
-  }
+    &__hidden {
+      display: none;
+    }
 
-  button.pagefind-ui__button {
-    border: 0.2rem solid var(--link-default);
-    border-radius: var(--border-radius-m);
-    background: transparent;
-    color: var(--body-color);
-    margin-top: 0;
-    margin-bottom: 1rem;
-
-    &:hover,
-    &:focus {
-      background: rgba($link-hovered, 0.15);
+    &--reset {
+      mark {
+        background-color: var(--bg-accent);
+        color: black;
+      }
     }
   }
 }
diff --git a/layouts/_default/home.html b/layouts/_default/home.html
index 3db687708..4d27432ac 100644
--- a/layouts/_default/home.html
+++ b/layouts/_default/home.html
@@ -7,7 +7,7 @@
         </div>
         <div class="o-startpage__image">
           {{ $image := resources.Get "images/startpage.webp" }}
-          {{ partial "image" (dict "image" $image "eager" true) }}
+          {{ partial "image" (dict "image" $image "eager" true "fetchpriority" "high") }}
         </div>
       </div>
 
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index e6a01a4d3..c4943356f 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -8,7 +8,6 @@
     {{ printf "%s | %s" .Title site.Title }}
   {{ end }}
 </title>
-{{ partialCached "head/js" . }}
 {{ $options := (dict "targetPath" "css/styles.css" "outputStyle" "compressed") }}
 {{ with resources.Get "sass/main.scss" }}
   {{ $style := (resources.ExecuteAsTemplate "sass/main_templated.scss" $ .) | toCSS $options | minify }}
@@ -19,13 +18,15 @@
     as="style"
   />
 {{ end }}
-<link rel="stylesheet" href="/pagefind/pagefind-ui.css" />
 <script src="/pagefind/pagefind-ui.js" defer></script>
 <script type="module">
   await import("/pagefind/pagefind-highlight.js");
   new PagefindHighlight({ highlightParam: "highlight" });
 </script>
 
+{{ partialCached "head/js" . }}
+
+
 <!-- include a favicon for your site if you have it, else omit the line below
      Location of favicon can be in mytheme/static/favicon.ico -->
 <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
diff --git a/layouts/partials/head/js.html b/layouts/partials/head/js.html
index cf3c3c122..c73dbaa29 100644
--- a/layouts/partials/head/js.html
+++ b/layouts/partials/head/js.html
@@ -12,6 +12,7 @@
         src="{{ .RelPermalink }}"
         integrity="{{- .Data.Integrity }}"
         crossorigin="anonymous"
+        defer
       ></script>
     {{- end }}
   {{- end }}
diff --git a/layouts/partials/image.html b/layouts/partials/image.html
index d4c96b815..f4a6145aa 100644
--- a/layouts/partials/image.html
+++ b/layouts/partials/image.html
@@ -50,6 +50,7 @@
     data-decorative="true"
   {{- end }}
   loading="{{ $loading }}"
+  {{ with .fetchpriority }}fetchpriority="{{ . }}"{{ end }}
   srcset="{{ delimit $srcset ", " }}"
   sizes="(max-width: 576px) calc(100vw - 3.2rem), (max-width: 768px) 540px, (max-width: 992px) 720px, (max-width: 1200px) 960px, (max-width: 1400px) 1140px, 1320px"
   style="{{ delimit $styles "; " | safeCSS }}"