Updated version rollout

2026-05-17 13:55:41 +01:00
parent c4d199e20a
commit 7079e32a5f
14 changed files with 928 additions and 55 deletions
@@ -1,5 +1,16 @@
-{{template "site_start" .}}
-<main class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
+{{define "about.html"}}
+{{template "public_shell_start" .}}
+{{template "about_content" .}}
+{{template "public_shell_end" .}}
+{{end}}
+
+{{define "about_partial.html"}}
+{{template "public_nav_oob" .}}
+{{template "about_content" .}}
+{{end}}
+
+{{define "about_content"}}
+<main id="main-content" class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
  <section class="grid gap-10 md:grid-cols-[0.9fr_1.1fr] md:items-start">
    <div class="aspect-[4/5] overflow-hidden bg-neutral-200">
      <img src="{{.Content.AboutImage}}" alt="{{.Content.AboutName}}" class="h-full w-full object-cover">
@@ -60,9 +71,9 @@
      <h2 class="text-3xl font-semibold">Discuss a project</h2>
      <div class="max-w-2xl">
        <p class="text-lg leading-relaxed text-neutral-600">Share the project type, location, budget range, and timeline so the studio can assess whether the work is a good fit.</p>
-        <a href="/contact" class="mt-6 inline-flex bg-neutral-950 px-5 py-3 text-sm font-medium uppercase tracking-[0.18em] text-white hover:bg-neutral-700" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">Start an enquiry</a>
+        <a href="/contact" class="mt-6 inline-flex bg-neutral-950 px-5 py-3 text-sm font-medium uppercase tracking-[0.18em] text-white hover:bg-neutral-700" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">Start an enquiry</a>
      </div>
    </div>
  </section>
 </main>
-{{template "site_end" .}}
+{{end}}
@@ -5,6 +5,16 @@
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>{{if .Title}}{{.Title}} | {{end}}Archi Folio</title>
+  <script>
+    (function () {
+      try {
+        var theme = localStorage.getItem("archi-theme");
+        if (theme === "dark" || theme === "light") {
+          document.documentElement.setAttribute("data-theme", theme);
+        }
+      } catch (_) {}
+    })();
+  </script>
  <link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css">
  <script src="https://cdn.tailwindcss.com"></script>
  <script src="https://unpkg.com/htmx.org@2.0.4"></script>
@@ -14,7 +24,7 @@
 <body class="bg-neutral-50 text-neutral-950 antialiased">
 {{end}}

-{{define "site_start"}}
+{{define "public_shell_start"}}
 {{template "head" .}}
 <div class="drawer drawer-end">
  <input id="site-drawer" type="checkbox" class="drawer-toggle">
@@ -23,15 +33,24 @@
 {{end}}

 {{define "site_header"}}
-<header data-site-header class="fixed inset-x-0 top-0 z-40 transition-all duration-300 {{if eq .Active "home"}}py-7 text-white{{else}}bg-neutral-50/95 py-4 shadow-sm backdrop-blur text-neutral-950{{end}}">
+<header id="site-header" data-site-header class="fixed inset-x-0 top-0 z-40 transition-all duration-300 {{if eq .Active "home"}}py-7 text-white{{else}}bg-neutral-50/95 py-4 shadow-sm backdrop-blur text-neutral-950{{end}}">
+  {{template "site_header_inner" .}}
+</header>
+{{end}}
+
+{{define "site_header_oob"}}
+<header id="site-header" data-site-header class="fixed inset-x-0 top-0 z-40 transition-all duration-300 {{if eq .Active "home"}}py-7 text-white{{else}}bg-neutral-50/95 py-4 shadow-sm backdrop-blur text-neutral-950{{end}}" hx-swap-oob="true">
+  {{template "site_header_inner" .}}
+</header>
+{{end}}
+
+{{define "site_header_inner"}}
  <div class="mx-auto flex max-w-7xl items-center justify-between px-5 md:px-8">
-    <a href="/" class="text-xl font-semibold tracking-normal md:text-3xl" data-header-brand hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">Archi Folio</a>
-    <nav class="hidden items-center gap-4 text-sm uppercase tracking-[0.18em] md:flex md:gap-8" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">
-      <a class="hover:opacity-60 {{if eq .Active "projects"}}font-semibold{{end}}" href="/projects">Projects</a>
-      <a class="hover:opacity-60 {{if eq .Active "about"}}font-semibold{{end}}" href="/about">Studio</a>
-      <a class="hover:opacity-60 {{if eq .Active "services"}}font-semibold{{end}}" href="/services">Services</a>
-      <a class="hover:opacity-60 {{if eq .Active "contact"}}font-semibold{{end}}" href="/contact">Contact</a>
-    </nav>
+    <a href="/" class="text-xl font-semibold tracking-normal md:text-3xl" data-header-brand hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">Archi Folio</a>
+    <div class="hidden items-center gap-6 md:flex">
+      {{template "site_desktop_nav" .}}
+      {{template "theme_toggle" .}}
+    </div>
    <label for="site-drawer" class="grid h-11 w-11 cursor-pointer place-items-center border border-current/30 md:hidden" aria-label="Open menu">
      <span class="grid gap-1.5">
        <span class="block h-px w-5 bg-current"></span>
@@ -40,7 +59,24 @@
      </span>
    </label>
  </div>
-</header>
+{{end}}
+
+{{define "site_desktop_nav"}}
+<nav id="site-desktop-nav" class="hidden items-center gap-4 text-sm uppercase tracking-[0.18em] md:flex md:gap-8" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">
+  <a class="hover:opacity-60 {{if eq .Active "projects"}}font-semibold{{end}}" href="/projects">Projects</a>
+  <a class="hover:opacity-60 {{if eq .Active "about"}}font-semibold{{end}}" href="/about">Studio</a>
+  <a class="hover:opacity-60 {{if eq .Active "services"}}font-semibold{{end}}" href="/services">Services</a>
+  <a class="hover:opacity-60 {{if eq .Active "contact"}}font-semibold{{end}}" href="/contact">Contact</a>
+</nav>
+{{end}}
+
+{{define "site_desktop_nav_oob"}}
+<nav id="site-desktop-nav" class="hidden items-center gap-4 text-sm uppercase tracking-[0.18em] md:flex md:gap-8" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true" hx-swap-oob="true">
+  <a class="hover:opacity-60 {{if eq .Active "projects"}}font-semibold{{end}}" href="/projects">Projects</a>
+  <a class="hover:opacity-60 {{if eq .Active "about"}}font-semibold{{end}}" href="/about">Studio</a>
+  <a class="hover:opacity-60 {{if eq .Active "services"}}font-semibold{{end}}" href="/services">Services</a>
+  <a class="hover:opacity-60 {{if eq .Active "contact"}}font-semibold{{end}}" href="/contact">Contact</a>
+</nav>
 {{end}}

 {{define "footer"}}
@@ -52,7 +88,24 @@
 </footer>
 {{end}}

-{{define "site_end"}}
+{{define "theme_toggle"}}
+<label class="swap swap-rotate grid h-10 w-10 cursor-pointer place-items-center text-current" aria-label="Toggle dark theme">
+  <input type="checkbox" value="dark" class="theme-controller" data-theme-toggle>
+  <svg class="swap-off h-6 w-6 fill-current" aria-label="sun" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+    <path d="M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z"></path>
+  </svg>
+  <svg class="swap-on h-6 w-6 fill-current" aria-label="moon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+    <path d="M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z"></path>
+  </svg>
+</label>
+{{end}}
+
+{{define "public_nav_oob"}}
+{{template "site_header_oob" .}}
+{{template "site_drawer_nav_oob" .}}
+{{end}}
+
+{{define "public_shell_end"}}
    {{template "footer" .}}
    <div id="overlay-root"></div>
  </div>
@@ -60,20 +113,18 @@
    <label for="site-drawer" aria-label="Close menu" class="drawer-overlay bg-neutral-950/45"></label>
    <aside class="flex min-h-full w-[min(22rem,86vw)] flex-col bg-neutral-950/45 text-white shadow-2xl backdrop-blur-xl">
      <div class="flex items-center justify-between border-b border-white/15 px-5 py-4">
-        <a href="/" class="text-xl font-semibold text-white" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">Archi Folio</a>
-        <label for="site-drawer" class="grid h-10 w-10 cursor-pointer place-items-center border border-white/25 text-white" aria-label="Close menu">
-          <span class="relative block h-5 w-5">
-            <span class="absolute left-0 top-1/2 block h-px w-5 rotate-45 bg-current"></span>
-            <span class="absolute left-0 top-1/2 block h-px w-5 -rotate-45 bg-current"></span>
-          </span>
-        </label>
+        <a href="/" class="text-xl font-semibold text-white" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true" data-drawer-link>Archi Folio</a>
+        <div class="flex items-center gap-3">
+          {{template "theme_toggle" .}}
+          <label for="site-drawer" class="grid h-10 w-10 cursor-pointer place-items-center border border-white/25 text-white" aria-label="Close menu">
+            <span class="relative block h-5 w-5">
+              <span class="absolute left-0 top-1/2 block h-px w-5 rotate-45 bg-current"></span>
+              <span class="absolute left-0 top-1/2 block h-px w-5 -rotate-45 bg-current"></span>
+            </span>
+          </label>
+        </div>
      </div>
-      <nav class="grid px-5 py-6 text-2xl font-medium text-white" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">
-        <a class="border-b border-white/15 py-4 text-white {{if eq .Active "projects"}}underline underline-offset-8{{end}}" href="/projects">Projects</a>
-        <a class="border-b border-white/15 py-4 text-white {{if eq .Active "about"}}underline underline-offset-8{{end}}" href="/about">Studio</a>
-        <a class="border-b border-white/15 py-4 text-white {{if eq .Active "services"}}underline underline-offset-8{{end}}" href="/services">Services</a>
-        <a class="border-b border-white/15 py-4 text-white {{if eq .Active "contact"}}underline underline-offset-8{{end}}" href="/contact">Contact</a>
-      </nav>
+      {{template "site_drawer_nav" .}}
      <div class="mt-auto px-5 pb-6 text-sm leading-relaxed text-white">
        <p>{{.Content.Email}}</p>
        <p>{{.Content.Location}}</p>
@@ -84,3 +135,21 @@
 </body>
 </html>
 {{end}}
+
+{{define "site_drawer_nav"}}
+<nav id="site-drawer-nav" class="grid px-5 py-6 text-2xl font-medium text-white" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">
+  <a class="border-b border-white/15 py-4 text-white {{if eq .Active "projects"}}underline underline-offset-8{{end}}" href="/projects" data-drawer-link>Projects</a>
+  <a class="border-b border-white/15 py-4 text-white {{if eq .Active "about"}}underline underline-offset-8{{end}}" href="/about" data-drawer-link>Studio</a>
+  <a class="border-b border-white/15 py-4 text-white {{if eq .Active "services"}}underline underline-offset-8{{end}}" href="/services" data-drawer-link>Services</a>
+  <a class="border-b border-white/15 py-4 text-white {{if eq .Active "contact"}}underline underline-offset-8{{end}}" href="/contact" data-drawer-link>Contact</a>
+</nav>
+{{end}}
+
+{{define "site_drawer_nav_oob"}}
+<nav id="site-drawer-nav" class="grid px-5 py-6 text-2xl font-medium text-white" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true" hx-swap-oob="true">
+  <a class="border-b border-white/15 py-4 text-white {{if eq .Active "projects"}}underline underline-offset-8{{end}}" href="/projects" data-drawer-link>Projects</a>
+  <a class="border-b border-white/15 py-4 text-white {{if eq .Active "about"}}underline underline-offset-8{{end}}" href="/about" data-drawer-link>Studio</a>
+  <a class="border-b border-white/15 py-4 text-white {{if eq .Active "services"}}underline underline-offset-8{{end}}" href="/services" data-drawer-link>Services</a>
+  <a class="border-b border-white/15 py-4 text-white {{if eq .Active "contact"}}underline underline-offset-8{{end}}" href="/contact" data-drawer-link>Contact</a>
+</nav>
+{{end}}
@@ -1,5 +1,16 @@
-{{template "site_start" .}}
-<main class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
+{{define "contact.html"}}
+{{template "public_shell_start" .}}
+{{template "contact_content" .}}
+{{template "public_shell_end" .}}
+{{end}}
+
+{{define "contact_partial.html"}}
+{{template "public_nav_oob" .}}
+{{template "contact_content" .}}
+{{end}}
+
+{{define "contact_content"}}
+<main id="main-content" class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
  <section class="grid gap-10 border-b border-neutral-200 pb-14 md:grid-cols-[0.85fr_1.15fr] md:items-end">
    <div>
      <p class="mb-3 text-sm uppercase tracking-[0.2em] text-neutral-500">Project enquiry</p>
@@ -87,4 +98,4 @@
    </form>
  </section>
 </main>
-{{template "site_end" .}}
+{{end}}
@@ -1,5 +1,16 @@
-{{template "site_start" .}}
-<main>
+{{define "home.html"}}
+{{template "public_shell_start" .}}
+{{template "home_content" .}}
+{{template "public_shell_end" .}}
+{{end}}
+
+{{define "home_partial.html"}}
+{{template "public_nav_oob" .}}
+{{template "home_content" .}}
+{{end}}
+
+{{define "home_content"}}
+<main id="main-content">
  <section class="relative min-h-[88vh] overflow-hidden bg-neutral-950">
    <img src="{{.Content.HeroImage}}" alt="" class="absolute inset-0 h-full w-full object-cover opacity-90">
    <div class="absolute inset-0 bg-gradient-to-b from-black/40 via-black/10 to-black/65"></div>
@@ -7,7 +18,7 @@
      <p class="mb-4 max-w-xl text-sm uppercase tracking-[0.22em] text-white/75">{{.Content.Positioning}}</p>
      <h1 class="max-w-5xl text-5xl font-semibold leading-[0.95] md:text-8xl">{{.Content.HeroTitle}}</h1>
      <p class="mt-6 max-w-2xl text-lg leading-relaxed text-white/80 md:text-xl">{{.Content.HeroSubtitle}}</p>
-      <div class="mt-8 flex flex-wrap gap-3" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">
+      <div class="mt-8 flex flex-wrap gap-3" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">
        <a href="{{.Content.HeroCTAURL}}" class="bg-white px-5 py-3 text-sm font-medium uppercase tracking-[0.18em] text-neutral-950 hover:bg-neutral-200">{{.Content.HeroCTALabel}}</a>
        <a href="{{.Content.SecondaryCTAURL}}" class="border border-white/60 px-5 py-3 text-sm font-medium uppercase tracking-[0.18em] text-white hover:bg-white hover:text-neutral-950">{{.Content.SecondaryCTALabel}}</a>
      </div>
@@ -18,7 +29,7 @@
    <h2 class="text-3xl font-semibold md:text-5xl">{{.Content.IntroTitle}}</h2>
    <div class="max-w-2xl">
      <p class="text-xl leading-relaxed text-neutral-600">{{.Content.IntroText}}</p>
-      <a href="/about" class="mt-6 inline-flex text-sm uppercase tracking-[0.18em] text-neutral-500 hover:text-neutral-950" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">Meet the studio</a>
+      <a href="/about" class="mt-6 inline-flex text-sm uppercase tracking-[0.18em] text-neutral-500 hover:text-neutral-950" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">Meet the studio</a>
    </div>
  </section>

@@ -45,7 +56,7 @@
    </div>
  </section>

-  <section class="px-5 py-20 md:px-8 md:py-28" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">
+  <section class="px-5 py-20 md:px-8 md:py-28" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">
    <div class="mx-auto mb-8 flex max-w-7xl items-end justify-between">
      <h2 class="text-2xl font-semibold md:text-4xl">Featured Projects</h2>
      <a href="/projects" class="text-sm uppercase tracking-[0.18em] text-neutral-500 hover:text-neutral-950">All work</a>
@@ -103,8 +114,8 @@
      <p class="mb-3 text-sm uppercase tracking-[0.2em] text-neutral-500">{{.Content.AboutRole}}</p>
      <h2 class="text-4xl font-semibold md:text-6xl">{{.Content.AboutName}}</h2>
      <p class="mt-6 max-w-2xl text-xl leading-relaxed text-neutral-600">{{.Content.AboutBio}}</p>
-      <a href="/about" class="mt-8 inline-flex bg-neutral-950 px-5 py-3 text-sm font-medium uppercase tracking-[0.18em] text-white hover:bg-neutral-700" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">Studio profile</a>
+      <a href="/about" class="mt-8 inline-flex bg-neutral-950 px-5 py-3 text-sm font-medium uppercase tracking-[0.18em] text-white hover:bg-neutral-700" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">Studio profile</a>
    </div>
  </section>
 </main>
-{{template "site_end" .}}
+{{end}}
@@ -1,5 +1,16 @@
-{{template "site_start" .}}
-<main class="pt-28 md:pt-36">
+{{define "project.html"}}
+{{template "public_shell_start" .}}
+{{template "project_content" .}}
+{{template "public_shell_end" .}}
+{{end}}
+
+{{define "project_partial.html"}}
+{{template "public_nav_oob" .}}
+{{template "project_content" .}}
+{{end}}
+
+{{define "project_content"}}
+<main id="main-content" class="pt-28 md:pt-36">
  <section class="mx-auto max-w-7xl px-5 md:px-8">
    <p class="mb-4 text-sm uppercase tracking-[0.2em] text-neutral-500">{{.Project.Category}} · {{.Project.Status}}</p>
    <div class="grid gap-8 md:grid-cols-[1.2fr_0.8fr] md:items-end">
@@ -34,4 +45,4 @@
    </div>
  </section>
 </main>
-{{template "site_end" .}}
+{{end}}
@@ -1,5 +1,16 @@
-{{template "site_start" .}}
-<main class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
+{{define "projects.html"}}
+{{template "public_shell_start" .}}
+{{template "projects_content" .}}
+{{template "public_shell_end" .}}
+{{end}}
+
+{{define "projects_partial.html"}}
+{{template "public_nav_oob" .}}
+{{template "projects_content" .}}
+{{end}}
+
+{{define "projects_content"}}
+<main id="main-content" class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
  <div class="mb-10 flex flex-col gap-4 md:flex-row md:items-end md:justify-between">
    <div>
      <p class="mb-3 text-sm uppercase tracking-[0.2em] text-neutral-500">Selected work</p>
@@ -7,7 +18,7 @@
    </div>
    <p class="max-w-md text-neutral-600">A visual index of architectural and interior design work.</p>
  </div>
-  <div class="grid gap-x-5 gap-y-10 sm:grid-cols-2 lg:grid-cols-3" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">
+  <div class="grid gap-x-5 gap-y-10 sm:grid-cols-2 lg:grid-cols-3" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">
    {{range .Projects}}
    <a href="/projects/{{.Slug}}" class="group block">
      <div class="aspect-[4/3] overflow-hidden bg-neutral-200">
@@ -25,4 +36,4 @@
    {{end}}
  </div>
 </main>
-{{template "site_end" .}}
+{{end}}
@@ -1,5 +1,16 @@
-{{template "site_start" .}}
-<main class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
+{{define "services.html"}}
+{{template "public_shell_start" .}}
+{{template "services_content" .}}
+{{template "public_shell_end" .}}
+{{end}}
+
+{{define "services_partial.html"}}
+{{template "public_nav_oob" .}}
+{{template "services_content" .}}
+{{end}}
+
+{{define "services_content"}}
+<main id="main-content" class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
  <section class="grid gap-10 border-b border-neutral-200 pb-14 md:grid-cols-[0.82fr_1.18fr] md:items-end">
    <div>
      <p class="mb-3 text-sm uppercase tracking-[0.2em] text-neutral-500">{{.Content.ServiceArea}}</p>
@@ -64,8 +75,8 @@
    <h2 class="text-3xl font-semibold">Ready to discuss a project?</h2>
    <div>
      <p class="max-w-2xl text-lg leading-relaxed text-neutral-600">Use the enquiry form to share the project type, site location, budget range, and timeline.</p>
-      <a href="/contact" class="mt-6 inline-flex bg-neutral-950 px-5 py-3 text-sm font-medium uppercase tracking-[0.18em] text-white hover:bg-neutral-700" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">Start an enquiry</a>
+      <a href="/contact" class="mt-6 inline-flex bg-neutral-950 px-5 py-3 text-sm font-medium uppercase tracking-[0.18em] text-white hover:bg-neutral-700" hx-boost="true" hx-target="#main-content" hx-swap="outerHTML transition:true" hx-push-url="true">Start an enquiry</a>
    </div>
  </section>
 </main>
-{{template "site_end" .}}
+{{end}}