diff --git a/hugo/assets/js/main.js b/hugo/assets/js/main.js
deleted file mode 100644
index 26b9fca..0000000
--- a/hugo/assets/js/main.js
+++ /dev/null
@@ -1,46 +0,0 @@
-var root = document.documentElement;
-let vh = window.innerHeight * 0.01;
-root.style.setProperty('--vh', `${vh}px`);
-
-// We listen to the resize event
-window.addEventListener('resize', () => {
-  // We execute the same script as before
-      let vh = window.innerHeight * 0.01;
-      root.style.setProperty('--vh', `${vh}px`);
-});
-
-function timeDifference(current, previous) {
-
-  var msPerMinute = 60 * 1000;
-  var msPerHour = msPerMinute * 60;
-  var msPerDay = msPerHour * 24;
-  var msPerMonth = msPerDay * 30;
-  var msPerYear = msPerDay * 365;
-
-  var elapsed = current - previous;
-
-  if (elapsed < msPerMinute) {
-       return Math.round(elapsed/1000) + ' seconds ago';   
-  }
-
-  else if (elapsed < msPerHour) {
-       return Math.round(elapsed/msPerMinute) + ' minutes ago';   
-  }
-
-  else if (elapsed < msPerDay ) {
-       return Math.round(elapsed/msPerHour ) + ' hours ago';   
-  }
-
-  else if (elapsed < msPerMonth) {
-      return 'approximately ' + Math.round(elapsed/msPerDay) + ' days ago';   
-  }
-
-  else if (elapsed < msPerYear) {
-      return 'approximately ' + Math.round(elapsed/msPerMonth) + ' months ago';   
-  }
-
-  else {
-      return 'approximately ' + Math.round(elapsed/msPerYear ) + ' years ago';   
-  }
-}
-
diff --git a/hugo/assets/scripts/main.js b/hugo/assets/scripts/main.js
new file mode 100644
index 0000000..b336f2a
--- /dev/null
+++ b/hugo/assets/scripts/main.js
@@ -0,0 +1,15 @@
+/*
+Use a window's inner dimensions for viewport units.
+This fixes some mobile bugs
+*/
+
+var root = document.documentElement;
+let vh = window.innerHeight * 0.01;
+root.style.setProperty('--vh', `${vh}px`);
+
+// We listen to the resize event
+window.addEventListener('resize', () => {
+  // We execute the same script as before
+      let vh = window.innerHeight * 0.01;
+      root.style.setProperty('--vh', `${vh}px`);
+});
\ No newline at end of file
diff --git a/hugo/assets/scripts/search.js b/hugo/assets/scripts/search.js
new file mode 100644
index 0000000..e8dc3ef
--- /dev/null
+++ b/hugo/assets/scripts/search.js
@@ -0,0 +1,225 @@
+/*
+tutorials used:
+- https://aaronluna.dev/blog/add-search-to-static-site-lunrjs-hugo-vanillajs/#codepen-with-final-code
+- https://victoria.dev/blog/add-search-to-hugo-static-sites-with-lunr/
+*/
+
+let pagesIndex, searchIndex
+const MAX_SUMMARY_LENGTH = 30
+const SENTENCE_BOUNDARY_REGEX = /\b\.\s/gm
+const WORD_REGEX = /\b(\w*)[\W|\s|\b]?/gm
+
+async function initSearch() {
+	try {
+		const response = await fetch("/index.json");
+		pagesIndex = await response.json();
+		searchIndex = lunr(function () {
+			this.field("title");
+			this.field("content");
+			this.ref("href");
+			pagesIndex.forEach((page) => this.add(page));
+		});
+	} catch (e) {
+		console.log(e);
+	}
+	console.log("Search index initialized")
+	// Get the query parameter(s)
+	const params = new URLSearchParams(window.location.search)
+	const query = params.get('query')
+
+	// Perform a search if there is a query
+	if (query) {
+		// Retain the search input in the form when displaying results
+		document.getElementById('search-input').setAttribute('value', query)
+
+		// Update the list with results
+		console.log("search performed")
+		let results = searchSite(query)
+		renderSearchResults(query, results)
+	}
+}
+
+initSearch();
+
+function searchSite(query) {
+	const originalQuery = query;
+	query = getLunrSearchQuery(query);
+	let results = getSearchResults(query);
+	return results.length
+	? results
+	: query !== originalQuery
+	? getSearchResults(originalQuery)
+	: [];
+}
+
+function getLunrSearchQuery(query) {
+	const searchTerms = query.split(" ");
+	if (searchTerms.length === 1) {
+	return query;
+	}
+	query = "";
+	for (const term of searchTerms) {
+	query += `+${term} `;
+	}
+	return query.trim();
+}
+
+function getSearchResults(query) {
+	return searchIndex.search(query).flatMap((hit) => {
+	if (hit.ref == "undefined") return [];
+	let pageMatch = pagesIndex.filter((page) => page.href === hit.ref)[0];
+	pageMatch.score = hit.score;
+	return [pageMatch];
+	});
+}
+
+function renderSearchResults(query, results) {
+	clearSearchResults();
+	updateSearchResults(query, results);
+}
+
+function clearSearchResults() {
+	const results = document.querySelector("#search-results");
+	while (results.firstChild) results.removeChild(results.firstChild);
+}
+
+function updateSearchResults(query, results) {
+	document.getElementById("results-query").innerHTML = query;
+	document.querySelector("#search-results").innerHTML = results
+	.map(
+		(hit) => `
+	<li class="search-result-item" data-score="${hit.score.toFixed(2)}">
+		<a href="${hit.href}" class="search-result-page-title">${createTitleBlurb(query, hit.title)}</a>
+		<p>${createSearchResultBlurb(query, hit.content)}</p>
+	</li>
+	`
+	)
+	.join("");
+	const searchResultListItems = document.querySelectorAll("#search-results li");
+	document.getElementById("results-count").innerHTML = searchResultListItems.length;
+	document.getElementById("results-count-text").innerHTML = searchResultListItems.length === 1 ? "result" : "results";
+	// searchResultListItems.forEach(
+	//   (li) => (li.firstElementChild.style.color = getColorForSearchResult(li.dataset.score))
+	// );
+}
+
+function createTitleBlurb(query, title) {
+	const searchQueryRegex = new RegExp(createQueryStringRegex(query), "gmi");
+	return title.replace(
+		searchQueryRegex,
+		"<strong>$&</strong>"
+		)
+}
+
+function createSearchResultBlurb(query, pageContent) {
+	const searchQueryRegex = new RegExp(createQueryStringRegex(query), "gmi");
+	const searchQueryHits = Array.from(
+	pageContent.matchAll(searchQueryRegex),
+	(m) => m.index
+	);
+	const sentenceBoundaries = Array.from(
+	pageContent.matchAll(SENTENCE_BOUNDARY_REGEX),
+	(m) => m.index
+	);
+	let searchResultText = "";
+	let lastEndOfSentence = 0;
+	for (const hitLocation of searchQueryHits) {
+	if (hitLocation > lastEndOfSentence) {
+		for (let i = 0; i < sentenceBoundaries.length; i++) {
+			if (sentenceBoundaries[i] > hitLocation) {
+			const startOfSentence = i > 0 ? sentenceBoundaries[i - 1] + 1 : 0;
+			const endOfSentence = sentenceBoundaries[i];
+			lastEndOfSentence = endOfSentence;
+			parsedSentence = pageContent.slice(startOfSentence, endOfSentence).trim();
+			searchResultText += `${parsedSentence} ... `;
+			break;
+			}
+		}
+	}
+	const searchResultWords = tokenize(searchResultText);
+	const pageBreakers = searchResultWords.filter((word) => word.length > 50);
+	if (pageBreakers.length > 0) {
+		searchResultText = fixPageBreakers(searchResultText, pageBreakers);
+	}
+	if (searchResultWords.length >= MAX_SUMMARY_LENGTH) break;
+	}
+	return ellipsize(searchResultText, MAX_SUMMARY_LENGTH).replace(
+	searchQueryRegex,
+	"<strong>$&</strong>"
+	);
+}
+
+function createQueryStringRegex(query) {
+	const searchTerms = query.split(" ");
+	if (searchTerms.length == 1) {
+	return query;
+	}
+	query = "";
+	for (const term of searchTerms) {
+	query += `${term}|`;
+	}
+	query = query.slice(0, -1);
+	return `(${query})`;
+}
+
+function tokenize(input) {
+	const wordMatches = Array.from(input.matchAll(WORD_REGEX), (m) => m);
+	return wordMatches.map((m) => ({
+	word: m[0],
+	start: m.index,
+	end: m.index + m[0].length,
+	length: m[0].length,
+	}));
+}
+
+function fixPageBreakers(input, largeWords) {
+	largeWords.forEach((word) => {
+	const chunked = chunkify(word.word, 20);
+	input = input.replace(word.word, chunked);
+	});
+	return input;
+}
+
+function chunkify(input, chunkSize) {
+	let output = "";
+	let totalChunks = (input.length / chunkSize) | 0;
+	let lastChunkIsUneven = input.length % chunkSize > 0;
+	if (lastChunkIsUneven) {
+	totalChunks += 1;
+	}
+	for (let i = 0; i < totalChunks; i++) {
+	let start = i * chunkSize;
+	let end = start + chunkSize;
+	if (lastChunkIsUneven && i === totalChunks - 1) {
+		end = input.length;
+	}
+	output += input.slice(start, end) + " ";
+	}
+	return output;
+}
+
+function ellipsize(input, maxLength) {
+	const words = tokenize(input);
+	if (words.length <= maxLength) {
+	return input;
+	}
+	return input.slice(0, words[maxLength].end) + "...";
+}
+
+if (!String.prototype.matchAll) {
+	String.prototype.matchAll = function (regex) {
+	"use strict";
+	function ensureFlag(flags, flag) {
+		return flags.includes(flag) ? flags : flags + flag;
+	}
+	function* matchAll(str, regex) {
+		const localCopy = new RegExp(regex, ensureFlag(regex.flags, "g"));
+		let match;
+		while ((match = localCopy.exec(str))) {
+			match.index = localCopy.lastIndex - match[0].length;
+			yield match;
+		}
+	}
+	return matchAll(this, regex);
+	};
+}
\ No newline at end of file
diff --git a/hugo/assets/scss/base/links.scss b/hugo/assets/scss/base/links.scss
deleted file mode 100644
index 67593a3..0000000
--- a/hugo/assets/scss/base/links.scss
+++ /dev/null
@@ -1,30 +0,0 @@
-a {
-	transition: all 0.1s ease-out;
-	@media (prefers-reduced-motion) {
-		transition: none;
-	}
-	&:link {
-		color: var(--link-color);
-		text-decoration-thickness: .125rem;
-		text-underline-offset: 0.125em;
-		text-decoration-skip-ink: none;
-	}
-	&:visited {
-		color: var(--link-visited);
-	}
-	&:focus {
-		outline: none;
-		background: var(--primary-accent);
-		color: var(--primary-accent-text);	
-		padding: 4px;
-		border-radius: 2px;
-		text-decoration: none;
-	}
-	&:hover {
-		text-decoration-thickness: 0.25em;
-		text-underline-offset: 0.25em;
-	}
-	&:active {
-
-	}
- }
\ No newline at end of file
diff --git a/hugo/assets/scss/base/list.scss b/hugo/assets/scss/base/list.scss
deleted file mode 100644
index 399da53..0000000
--- a/hugo/assets/scss/base/list.scss
+++ /dev/null
@@ -1,50 +0,0 @@
-.list {
-	.container {
-		display: grid;
-		grid-template-columns: repeat(auto-fill, minmax(240px,1fr));
-		gap: 3em;
-	}
-	.list-item {
-		color: inherit;
-		text-decoration: none;
-		transition: color 0.2s ease-in-out;
-		&__link {
-			display: block;
-			&:focus {
-				background: unset;
-				padding: unset;
-				@include focus-outline;
-				&:link {
-					color: var(--link-color);
-				}
-				&:visited {
-					color: var(--link-visited);
-				}
-			}
-			
-			&:hover {
-			}
-			
-			&:active {
-			
-			}
-		}
-		&__image {
-			width: 100%;
-			height: auto;
-		}
-		&__title {
-			font-size: 1.5em;
-			font-weight: 700;
-			margin: 1.5em 0 0.5em;
-		}
-		&__summary {
-			margin-bottom: 0.5em;
-			line-height: 1.4;
-		}
-		&__date {
-			display: block;
-			margin-bottom: 1em;
-		}
-	}
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/base/mixins.scss b/hugo/assets/scss/base/mixins.scss
deleted file mode 100644
index 42ea976..0000000
--- a/hugo/assets/scss/base/mixins.scss
+++ /dev/null
@@ -1,42 +0,0 @@
-@mixin box-shadow {
-	box-shadow: 0 1px 1px rgba(0,0,0,0.11), 
-		0 2px 2px rgba(0,0,0,0.11), 
-		0 4px 4px rgba(0,0,0,0.11), 
-		0 6px 8px rgba(0,0,0,0.11),
-		0 8px 16px rgba(0,0,0,0.11);
-}
-
-@mixin box-shadow-heavy {
-	box-shadow: 0 2px 1px rgba(0,0,0,0.09), 
-               0 4px 2px rgba(0,0,0,0.09), 
-               0 8px 4px rgba(0,0,0,0.09), 
-               0 16px 8px rgba(0,0,0,0.09),
-               0 32px 16px rgba(0,0,0,0.09);
-}
-
-@mixin focus-outline {
-	outline: solid;
-	outline-color: var(--primary-accent);
-	outline-offset: 4px;
-}
-
-@function css-function( $function, $values... ) {
-	@return 
-		 $function
-		 + unquote( '(' )
-		 + $values
-		 + unquote( ')' )
-	;
-}
-
-@function css-min( $values... ) {
-	@return css-function( min, $values );
-}
-
-@function css-max( $values... ) {
-	@return css-function( max, $values );
-}
-
-@function css-clamp( $values... ) {
-	@return css-function( clamp, $values );
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/base/page.scss b/hugo/assets/scss/base/page.scss
deleted file mode 100644
index 38937ef..0000000
--- a/hugo/assets/scss/base/page.scss
+++ /dev/null
@@ -1,152 +0,0 @@
-.page-title {font-size: 2.5em; font-weight: 700}
-.page {
-	font-size: 1em;
-	@media (min-width: 600px) {font-size: 1.25em;}
-	max-width: 960px;
-	margin: 0 auto;
-	@media (min-width: 960px) {
-		display: grid;
-		grid-template-columns: minmax(45ch,65ch) 1fr;
-		grid-template-rows: auto auto;
-		grid-template-areas:
-			"header header"
-			"content meta";
-	}
-	.section {
-		padding: 1em 0;
-		grid-area: content;
-
-	}
-	.page-header {
-		padding: 2em 0;
-		grid-area: header;
-	}
-	.meta {
-		grid-area: meta;
-	}
-	.page-summary {margin: 1em 0;}
-	.page-cover {width: 100%;}
-
-	h1,h2,h3,h4,h5,h6 {
-		line-height: 1.2;
-		margin-bottom: 1rem;
-		margin-top: 2rem;
-		font-weight: 700;
-	}
-	p {
-		line-height: 1.4;
-		margin-bottom: 1em;
-	}
-	a {word-wrap: break-word;}
-	h1 {font-size: 2.49em}
-	h2 {font-size: 2.07em}
-	h3 {font-size: 1.728em}
-	h4 {font-size: 1.44em}
-	h5 {font-size: 1.2em}
-	h6 {font-size: 1em}
-
-	h1 {font-size: 1.8em}
-	h2 {font-size: 1.600em}
-	h3 {font-size: 1.423em}
-	h4 {font-size: 1.265em}
-	h5 {font-size: 1.125em}
-	h6 {font-size: 1em}
-
-	blockquote {
-		font-size: 1em;
-		margin: 1em 0;
-		border-left: 0.25rem solid black;
-		padding-left: 0.5em;
-		line-height: 1.4;
-	}
-
-	pre {
-		font-family: monospace;
-		background: #333;
-		color: white;
-		padding: 1em;
-		line-height: 1.4;
-		overflow-x: scroll;
-		margin-bottom: 1em;
-	}
-	ul {list-style: disc; margin: 1em 0;}
-	li {margin-bottom: 1em; line-height: 1.4; margin-left: 1em;}
-	ol {list-style: decimal; margin: 1em 0;}
-	dl {margin: 1em 0; line-height: 1.4;}
-	dt {font-weight: 700;}
-	dd {margin-left: 1em;}
-	em {font-style: italic}
-	strong {font-weight: 700}
-	sup {
-		position: relative;
-		font-size: 0.8em;
-		a {position: relative; top: -0.5em;}
-	}
-	table {
-		text-align: center;
-		thead {
-			font-weight: 700;
-		}
-		th, td {border: 1px solid black; padding: 0.5em;}
-	}
-	figure {
-		img {
-			width: 100%;
-			margin-bottom: -0.125em;
-		}
-		figcaption {
-			background: #212121;
-			color: white;
-			font-style: italic;
-			padding: 1em;
-			font-size: 0.8em;
-			line-height: 1.2;
-		}
-		margin-bottom: 1em;
-	}
-
-	img {
-		width: 100%;
-		margin-bottom: 1em;
-	}
-
-}
-
-.tags {
-	display: flex;
-	flex-flow: row wrap;
-	gap: 0.25em;
-	li {
-		list-style: none;
-		border-radius: 4px;
-		margin-left: 1em;
-		margin-bottom: 0;
-	}
-}
-
-.meta .container {height: 100%; margin-top: 0.75rem;}
-article .container *:first-child {margin-top: 0;}
-
-#TableOfContents {
-	position: sticky;
-	top: 2rem;
-	@media (min-width: 960px) {top: 96px;}
-	max-width: max-content;
-	font-size: 0.75em;
-	margin: 2em 0;
-	ul {list-style: none; margin: 0;}
-	li {margin-bottom: 0; margin-left: 0;}
-	li li {margin-left: 1em;}
-	a {
-		background: unset;
-		text-decoration-thickness: unset;
-		text-underline-offset: unset;
-		color: inherit;
-		text-decoration: none;
-		transition: color 0.2s ease-in-out;
-		&:hover {
-			color: #0060ff;
-			text-decoration: underline;
-		}
-	}
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/base/paper.scss b/hugo/assets/scss/base/paper.scss
deleted file mode 100644
index 6940658..0000000
--- a/hugo/assets/scss/base/paper.scss
+++ /dev/null
@@ -1,22 +0,0 @@
-:root {
-	--paper-padding: 4em;
-}
-
-body {position: relative;}
-main {background: #ddd; z-index: 1; position: relative;}
-main:before {
-	content: '';
-	position: absolute;
-	width: calc(var(--container-width) + 2 * var(--paper-padding));
-	height: 100%;
-	z-index: 0;
-	left: calc(50% - (var(--container-width) + 2 * var(--paper-padding)) / 2);
-	box-shadow: 0px 0px 6px rgba(0,0,0,0.2);
-	background: white;
-}
-footer {z-index: 1;}
-main > * {position: relative; z-index: 1}
-
-.site-header {box-shadow: 0px 2px 6px rgba(0,0,0,0.2);}
-.site-nav {box-shadow: 0px -2px 6px rgba(0,0,0,0.2);}
-.site-footer {box-shadow: 0px -2px 3px rgba(0,0,0,0.2);}
\ No newline at end of file
diff --git a/hugo/assets/scss/base/sections.scss b/hugo/assets/scss/base/sections.scss
deleted file mode 100644
index b7b5f7d..0000000
--- a/hugo/assets/scss/base/sections.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-html {
-	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
-	scroll-behavior: smooth;
-}
-body {
-	display: flex;
-	flex-flow: column;
-	min-height: calc(var(--vh, 1vh) * 100);
-}
-main {flex-grow: 1;}
-.section {
-	padding: 2em 0;
-	@media (min-width: 600px) {padding: 3em 0}
-	@media (min-width: 62em) {padding: 4em 0}
-}
-.container {
-	width: 100%;
-	max-width: 960px;
-	margin: 0 auto;
-	padding: 0 1em;
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/base/variables.scss b/hugo/assets/scss/base/variables.scss
deleted file mode 100644
index 215cf00..0000000
--- a/hugo/assets/scss/base/variables.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-$container-width: 960px;
-$nav-height: 4em;
-$header-height: 4em;
-
-:root {
-	--container-width: #{$container-width};
-	--nav-height: #{$nav-height};
-	--header-height: #{$header-height};
-	--link-color: rgb(0,96,255);
-	--link-visited: rgb(140, 74, 194);
-	--primary-accent: rgb(0,96,255);
-	--primary-accent-transparent: rgba(0,96,255,0.25);
-	--primary-accent-text: #fff;
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/components/button.scss b/hugo/assets/scss/components/button.scss
deleted file mode 100644
index 14418aa..0000000
--- a/hugo/assets/scss/components/button.scss
+++ /dev/null
@@ -1,84 +0,0 @@
-.button {
-	width: 100%;
-	@media (min-width: 33.75em) {
-		width: max-content;
-	}
-	font-size: clamp(1em,2vw,1em);
-	padding: 1em;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	text-decoration: none;
-	border-radius: 0.25em;
-	font-weight: 700;
-	gap: 1em;
-	&:link {
-
-	}
-	
-	&:visited {
-	
-	}
-	
-	&:focus {
-		padding: 1em;
-		border-radius: 0.25em;
-		@include focus-outline;
-	}
-	
-	&:hover {
-		
-	}
-	
-	&:active {
-	
-	}
-}
-
-.button.primary {
-	background: var(--primary-accent);
-	color: var(--primary-accent-text);
-	&:link {
-
-	}
-	
-	&:visited {
-	
-	}
-	
-	&:focus {
-		
-	}
-	
-	&:hover {
-		background: var(--primary-accent-transparent);
-	}
-	
-	&:active {
-	
-	}
-}
-.button.secondary {
-	background: white;
-	border: 2px solid var(--primary-accent);
-	color: var(--primary-accent);
-	&:link {
-
-	}
-	
-	&:visited {
-	
-	}
-	
-	&:focus {
-		
-	}
-	
-	&:hover {
-		background: var(--primary-accent-transparent);
-	}
-	
-	&:active {
-	
-	}
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/components/pullquote.scss b/hugo/assets/scss/components/pullquote.scss
deleted file mode 100644
index 9cfa309..0000000
--- a/hugo/assets/scss/components/pullquote.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-@mixin pullquote {
-	content: attr(data-pullquote);
-	font-size: 1em;
-	line-height: 1.2;
-	display: flex;
-	font-family: serif;
-	color: #555;
-	padding: 1em;
-	font-size: 1.25em;
-}
-.has-pullquote{
-	&.before:before {
-	@include pullquote;
-	margin-bottom: 1rem;
-	}
-	&.after:after {
-	@include pullquote;
-	margin-top: 1rem;
-	}
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/content/index.scss b/hugo/assets/scss/content/index.scss
deleted file mode 100644
index ddee674..0000000
--- a/hugo/assets/scss/content/index.scss
+++ /dev/null
@@ -1,72 +0,0 @@
-#index {
-	.h-feed {
-		display: grid;
-		overflow: auto;
-		.heading {
-			font-size: 1.5em;
-			font-weight: 700;
-			margin: 1em 0;
-		}
-		hr {
-			margin: 0;
-		}
-	}
-	.h-card {
-		place-self: center;
-		max-width: 60ch;
-		width: 100%;
-	}
-	.h-entry {
-		margin: 1em 0;
-		padding: 1em 0;
-		header {
-			display: flex;
-			align-items: center;
-			gap: 1em;
-			margin-bottom: 0.5em;
-			.icon {
-				padding: 0.5rem;
-				display: inline-flex;
-				background: black;
-				border-radius: 100em;
-				svg {
-					width: 20px;
-					height: 20px;
-					fill: white;
-				}
-			}
-		}
-	}
-	.reply {
-		line-height: 1.5;
-		
-		.p-name {
-			margin-bottom: 1em;
-			display: flex;
-			align-items: center;
-			gap: 0.5em;
-			
-			.u-url {
-
-			}
-		}
-		.p-summary {
-			font-style: italic;
-		}
-		.meta {
-			margin-top: 1em;
-		}
-	}
-	.note {
-		line-height: 1.5;
-		.e-content {
-			font-size: 1.2em;
-			p {
-				margin: 1em 0;
-			}
-		}
-		.meta {
-			margin-top: 1em;
-		}
-	}
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/libraries/photoswipe.scss b/hugo/assets/scss/libraries/photoswipe.scss
deleted file mode 100644
index fb9f3e8..0000000
--- a/hugo/assets/scss/libraries/photoswipe.scss
+++ /dev/null
@@ -1,663 +0,0 @@
-/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
-/*
-	Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
-*/
-/* pswp = photoswipe */
-.pswp {
-	display: none;
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	left: 0;
-	top: 0;
-	overflow: hidden;
-	-ms-touch-action: none;
-	touch-action: none;
-	z-index: 1500;
-	-webkit-text-size-adjust: 100%;
-	/* create separate layer, to avoid paint on window.onscroll in webkit/blink */
-	-webkit-backface-visibility: hidden;
-	outline: none; }
-	.pswp * {
-	  -webkit-box-sizing: border-box;
-				 box-sizing: border-box; }
-	.pswp img {
-	  max-width: none; }
- 
- /* style is added when JS option showHideOpacity is set to true */
- .pswp--animate_opacity {
-	/* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
-	opacity: 0.001;
-	will-change: opacity;
-	/* for open/close transition */
-	-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
-			  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
- 
- .pswp--open {
-	display: block; }
- 
- .pswp--zoom-allowed .pswp__img {
-	/* autoprefixer: off */
-	cursor: -webkit-zoom-in;
-	cursor: -moz-zoom-in;
-	cursor: zoom-in; }
- 
- .pswp--zoomed-in .pswp__img {
-	/* autoprefixer: off */
-	cursor: -webkit-grab;
-	cursor: -moz-grab;
-	cursor: grab; }
- 
- .pswp--dragging .pswp__img {
-	/* autoprefixer: off */
-	cursor: -webkit-grabbing;
-	cursor: -moz-grabbing;
-	cursor: grabbing; }
- 
- /*
-	 Background is added as a separate element.
-	 As animating opacity is much faster than animating rgba() background-color.
- */
- .pswp__bg {
-	position: absolute;
-	left: 0;
-	top: 0;
-	width: 100%;
-	height: 100%;
-	background: #000;
-	opacity: 0;
-	-webkit-transform: translateZ(0);
-			  transform: translateZ(0);
-	-webkit-backface-visibility: hidden;
-	will-change: opacity; }
- 
- .pswp__scroll-wrap {
-	position: absolute;
-	left: 0;
-	top: 0;
-	width: 100%;
-	height: 100%;
-	overflow: hidden; }
- 
- .pswp__container,
- .pswp__zoom-wrap {
-	-ms-touch-action: none;
-	touch-action: none;
-	position: absolute;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0; }
- 
- /* Prevent selection and tap highlights */
- .pswp__container,
- .pswp__img {
-	-webkit-user-select: none;
-	-moz-user-select: none;
-	-ms-user-select: none;
-		 user-select: none;
-	-webkit-tap-highlight-color: transparent;
-	-webkit-touch-callout: none; }
- 
- .pswp__zoom-wrap {
-	position: absolute;
-	width: 100%;
-	-webkit-transform-origin: left top;
-	-ms-transform-origin: left top;
-	transform-origin: left top;
-	/* for open/close transition */
-	-webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
-			  transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); }
- 
- .pswp__bg {
-	will-change: opacity;
-	/* for open/close transition */
-	-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
-			  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
- 
- .pswp--animated-in .pswp__bg,
- .pswp--animated-in .pswp__zoom-wrap {
-	-webkit-transition: none;
-	transition: none; }
- 
- .pswp__container,
- .pswp__zoom-wrap {
-	-webkit-backface-visibility: hidden; }
- 
- .pswp__item {
-	position: absolute;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	overflow: hidden; }
- 
- .pswp__img {
-	position: absolute;
-	width: auto;
-	height: auto;
-	top: 0;
-	left: 0; }
- 
- /*
-	 stretched thumbnail or div placeholder element (see below)
-	 style is added to avoid flickering in webkit/blink when layers overlap
- */
- .pswp__img--placeholder {
-	-webkit-backface-visibility: hidden; }
- 
- /*
-	 div element that matches size of large image
-	 large image loads on top of it
- */
- .pswp__img--placeholder--blank {
-	background: #222; }
- 
- .pswp--ie .pswp__img {
-	width: 100% !important;
-	height: auto !important;
-	left: 0;
-	top: 0; }
- 
- /*
-	 Error message appears when image is not loaded
-	 (JS option errorMsg controls markup)
- */
- .pswp__error-msg {
-	position: absolute;
-	left: 0;
-	top: 50%;
-	width: 100%;
-	text-align: center;
-	font-size: 14px;
-	line-height: 16px;
-	margin-top: -8px;
-	color: #CCC; }
- 
- .pswp__error-msg a {
-	color: #CCC;
-	text-decoration: underline; }
-
-/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
-/*
-
-	Contents:
-
-	1. Buttons
-	2. Share modal and links
-	3. Index indicator ("1 of X" counter)
-	4. Caption
-	5. Loading indicator
-	6. Additional styles (root element, top bar, idle state, hidden state, etc.)
-
-*/
-/*
-	
-	1. Buttons
-
- */
-/* <button> css reset */
-.pswp__button {
-	width: 44px;
-	height: 44px;
-	position: relative;
-	background: none;
-	cursor: pointer;
-	overflow: visible;
-	-webkit-appearance: none;
-	display: block;
-	border: 0;
-	padding: 0;
-	margin: 0;
-	float: right;
-	opacity: 0.75;
-	-webkit-transition: opacity 0.2s;
-			  transition: opacity 0.2s;
-	-webkit-box-shadow: none;
-			  box-shadow: none; }
-	.pswp__button:focus, .pswp__button:hover {
-	  opacity: 1; }
-	.pswp__button:active {
-	  outline: none;
-	  opacity: 0.9; }
-	.pswp__button::-moz-focus-inner {
-	  padding: 0;
-	  border: 0; }
- 
- /* pswp__ui--over-close class it added when mouse is over element that should close gallery */
- .pswp__ui--over-close .pswp__button--close {
-	opacity: 1; }
- 
- .pswp__button,
- .pswp__button--arrow--left:before,
- .pswp__button--arrow--right:before {
-	background: url('/lib/pswp4/default-skin.png') 0 0 no-repeat;
-	background-size: 264px 88px;
-	width: 44px;
-	height: 44px; }
- 
- @media (-webkit-min-device-pixel-ratio: 1.1), (-webkit-min-device-pixel-ratio: 1.09375), (min-resolution: 105dpi), (min-resolution: 1.1dppx) {
-	/* Serve SVG sprite if browser supports SVG and resolution is more than 105dpi */
-	.pswp--svg .pswp__button,
-	.pswp--svg .pswp__button--arrow--left:before,
-	.pswp--svg .pswp__button--arrow--right:before {
-	  background-image: url('/lib/pswp4/default-skin.svg'); }
-	.pswp--svg .pswp__button--arrow--left,
-	.pswp--svg .pswp__button--arrow--right {
-	  background: none; } }
- 
- .pswp__button--close {
-	background-position: 0 -44px; }
- 
- .pswp__button--share {
-	background-position: -44px -44px; }
- 
- .pswp__button--fs {
-	display: none; }
- 
- .pswp--supports-fs .pswp__button--fs {
-	display: block; }
- 
- .pswp--fs .pswp__button--fs {
-	background-position: -44px 0; }
- 
- .pswp__button--zoom {
-	display: none;
-	background-position: -88px 0; }
- 
- .pswp--zoom-allowed .pswp__button--zoom {
-	display: block; }
- 
- .pswp--zoomed-in .pswp__button--zoom {
-	background-position: -132px 0; }
- 
- /* no arrows on touch screens */
- .pswp--touch .pswp__button--arrow--left,
- .pswp--touch .pswp__button--arrow--right {
-	visibility: hidden; }
- 
- /*
-	 Arrow buttons hit area
-	 (icon is added to :before pseudo-element)
- */
- .pswp__button--arrow--left,
- .pswp__button--arrow--right {
-	background: none;
-	top: 50%;
-	margin-top: -50px;
-	width: 70px;
-	height: 100px;
-	position: absolute; }
- 
- .pswp__button--arrow--left {
-	left: 0; }
- 
- .pswp__button--arrow--right {
-	right: 0; }
- 
- .pswp__button--arrow--left:before,
- .pswp__button--arrow--right:before {
-	content: '';
-	top: 35px;
-	background-color: rgba(0, 0, 0, 0.3);
-	height: 30px;
-	width: 32px;
-	position: absolute; }
- 
- .pswp__button--arrow--left:before {
-	left: 6px;
-	background-position: -138px -44px; }
- 
- .pswp__button--arrow--right:before {
-	right: 6px;
-	background-position: -94px -44px; }
- 
- /*
- 
-	 2. Share modal/popup and links
- 
-  */
- .pswp__counter,
- .pswp__share-modal {
-	-webkit-user-select: none;
-	-moz-user-select: none;
-	-ms-user-select: none;
-		 user-select: none; }
- 
- .pswp__share-modal {
-	display: block;
-	background: rgba(0, 0, 0, 0.5);
-	width: 100%;
-	height: 100%;
-	top: 0;
-	left: 0;
-	padding: 10px;
-	position: absolute;
-	z-index: 1600;
-	opacity: 0;
-	-webkit-transition: opacity 0.25s ease-out;
-			  transition: opacity 0.25s ease-out;
-	-webkit-backface-visibility: hidden;
-	will-change: opacity; }
- 
- .pswp__share-modal--hidden {
-	display: none; }
- 
- .pswp__share-tooltip {
-	z-index: 1620;
-	position: absolute;
-	background: #FFF;
-	top: 56px;
-	border-radius: 2px;
-	display: block;
-	width: auto;
-	right: 44px;
-	-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
-			  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
-	-webkit-transform: translateY(6px);
-		 -ms-transform: translateY(6px);
-			  transform: translateY(6px);
-	-webkit-transition: -webkit-transform 0.25s;
-			  transition: transform 0.25s;
-	-webkit-backface-visibility: hidden;
-	will-change: transform; }
-	.pswp__share-tooltip a {
-	  display: block;
-	  padding: 8px 12px;
-	  color: #000;
-	  text-decoration: none;
-	  font-size: 14px;
-	  line-height: 18px; }
-	  .pswp__share-tooltip a:hover {
-		 text-decoration: none;
-		 color: #000; }
-	  .pswp__share-tooltip a:first-child {
-		 /* round corners on the first/last list item */
-		 border-radius: 2px 2px 0 0; }
-	  .pswp__share-tooltip a:last-child {
-		 border-radius: 0 0 2px 2px; }
- 
- .pswp__share-modal--fade-in {
-	opacity: 1; }
-	.pswp__share-modal--fade-in .pswp__share-tooltip {
-	  -webkit-transform: translateY(0);
-			-ms-transform: translateY(0);
-				 transform: translateY(0); }
- 
- /* increase size of share links on touch devices */
- .pswp--touch .pswp__share-tooltip a {
-	padding: 16px 12px; }
- 
- a.pswp__share--facebook:before {
-	content: '';
-	display: block;
-	width: 0;
-	height: 0;
-	position: absolute;
-	top: -12px;
-	right: 15px;
-	border: 6px solid transparent;
-	border-bottom-color: #FFF;
-	-webkit-pointer-events: none;
-	-moz-pointer-events: none;
-	pointer-events: none; }
- 
- a.pswp__share--facebook:hover {
-	background: #3E5C9A;
-	color: #FFF; }
-	a.pswp__share--facebook:hover:before {
-	  border-bottom-color: #3E5C9A; }
- 
- a.pswp__share--twitter:hover {
-	background: #55ACEE;
-	color: #FFF; }
- 
- a.pswp__share--pinterest:hover {
-	background: #CCC;
-	color: #CE272D; }
- 
- a.pswp__share--download:hover {
-	background: #DDD; }
- 
- /*
- 
-	 3. Index indicator ("1 of X" counter)
- 
-  */
- .pswp__counter {
-	position: absolute;
-	left: 0;
-	top: 0;
-	height: 44px;
-	font-size: 13px;
-	line-height: 44px;
-	color: #FFF;
-	opacity: 0.75;
-	padding: 0 10px; }
- 
- /*
-	 
-	 4. Caption
- 
-  */
- .pswp__caption {
-	position: absolute;
-	left: 0;
-	bottom: 0;
-	width: 100%;
-	min-height: 44px; }
-	.pswp__caption small {
-	  font-size: 11px;
-	  color: #BBB; }
- 
- .pswp__caption__center {
-	text-align: center;
-	max-width: 50ch;
-	margin: 0 auto;
-	font-size: 1em;
-	padding: 10px;
-	line-height: 20px;
-	color: #CCC;}
- 
- .pswp__caption--empty {
-	display: none; }
- 
- /* Fake caption element, used to calculate height of next/prev image */
- .pswp__caption--fake {
-	visibility: hidden; }
- 
- /*
- 
-	 5. Loading indicator (preloader)
- 
-	 You can play with it here - http://codepen.io/dimsemenov/pen/yyBWoR
- 
-  */
- .pswp__preloader {
-	width: 44px;
-	height: 44px;
-	position: absolute;
-	top: 0;
-	left: 50%;
-	margin-left: -22px;
-	opacity: 0;
-	-webkit-transition: opacity 0.25s ease-out;
-			  transition: opacity 0.25s ease-out;
-	will-change: opacity;
-	direction: ltr; }
- 
- .pswp__preloader__icn {
-	width: 20px;
-	height: 20px;
-	margin: 12px; }
- 
- .pswp__preloader--active {
-	opacity: 1; }
-	.pswp__preloader--active .pswp__preloader__icn {
-	  /* We use .gif in browsers that don't support CSS animation */
-	  background: url('/lib/pswp4/preloader.gif') 0 0 no-repeat; }
- 
- .pswp--css_animation .pswp__preloader--active {
-	opacity: 1; }
-	.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn {
-	  -webkit-animation: clockwise 500ms linear infinite;
-				 animation: clockwise 500ms linear infinite; }
-	.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut {
-	  -webkit-animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite;
-				 animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite; }
- 
- .pswp--css_animation .pswp__preloader__icn {
-	background: none;
-	opacity: 0.75;
-	width: 14px;
-	height: 14px;
-	position: absolute;
-	left: 15px;
-	top: 15px;
-	margin: 0; }
- 
- .pswp--css_animation .pswp__preloader__cut {
-	/* 
-			 The idea of animating inner circle is based on Polymer ("material") loading indicator 
-			  by Keanu Lee https://blog.keanulee.com/2014/10/20/the-tale-of-three-spinners.html
-		 */
-	position: relative;
-	width: 7px;
-	height: 14px;
-	overflow: hidden; }
- 
- .pswp--css_animation .pswp__preloader__donut {
-	-webkit-box-sizing: border-box;
-			  box-sizing: border-box;
-	width: 14px;
-	height: 14px;
-	border: 2px solid #FFF;
-	border-radius: 50%;
-	border-left-color: transparent;
-	border-bottom-color: transparent;
-	position: absolute;
-	top: 0;
-	left: 0;
-	background: none;
-	margin: 0; }
- 
- @media screen and (max-width: 1024px) {
-	.pswp__preloader {
-	  position: relative;
-	  left: auto;
-	  top: auto;
-	  margin: 0;
-	  float: right; } }
- 
- @-webkit-keyframes clockwise {
-	0% {
-	  -webkit-transform: rotate(0deg);
-				 transform: rotate(0deg); }
-	100% {
-	  -webkit-transform: rotate(360deg);
-				 transform: rotate(360deg); } }
- 
- @keyframes clockwise {
-	0% {
-	  -webkit-transform: rotate(0deg);
-				 transform: rotate(0deg); }
-	100% {
-	  -webkit-transform: rotate(360deg);
-				 transform: rotate(360deg); } }
- 
- @-webkit-keyframes donut-rotate {
-	0% {
-	  -webkit-transform: rotate(0);
-				 transform: rotate(0); }
-	50% {
-	  -webkit-transform: rotate(-140deg);
-				 transform: rotate(-140deg); }
-	100% {
-	  -webkit-transform: rotate(0);
-				 transform: rotate(0); } }
- 
- @keyframes donut-rotate {
-	0% {
-	  -webkit-transform: rotate(0);
-				 transform: rotate(0); }
-	50% {
-	  -webkit-transform: rotate(-140deg);
-				 transform: rotate(-140deg); }
-	100% {
-	  -webkit-transform: rotate(0);
-				 transform: rotate(0); } }
- 
- /*
-	 
-	 6. Additional styles
- 
-  */
- /* root element of UI */
- .pswp__ui {
-	-webkit-font-smoothing: auto;
-	visibility: visible;
-	opacity: 1;
-	z-index: 1550; }
- 
- /* top black bar with buttons and "1 of X" indicator */
- .pswp__top-bar {
-	position: absolute;
-	left: 0;
-	top: 0;
-	height: 44px;
-	width: 100%; }
- 
- .pswp__caption,
- .pswp__top-bar,
- .pswp--has_mouse .pswp__button--arrow--left,
- .pswp--has_mouse .pswp__button--arrow--right {
-	-webkit-backface-visibility: hidden;
-	will-change: opacity;
-	-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
-			  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
- 
- /* pswp--has_mouse class is added only when two subsequent mousemove events occur */
- .pswp--has_mouse .pswp__button--arrow--left,
- .pswp--has_mouse .pswp__button--arrow--right {
-	visibility: visible; }
- 
- .pswp__top-bar,
- .pswp__caption {
-	background-color: rgba(0, 0, 0, 0.5); }
- 
- /* pswp__ui--fit class is added when main image "fits" between top bar and bottom bar (caption) */
- .pswp__ui--fit .pswp__top-bar,
- .pswp__ui--fit .pswp__caption {
-	background-color: rgba(0, 0, 0, 0.5); }
- 
- /* pswp__ui--idle class is added when mouse isn't moving for several seconds (JS option timeToIdle) */
- .pswp__ui--idle .pswp__top-bar {
-	opacity: 0; }
- 
- .pswp__ui--idle .pswp__button--arrow--left,
- .pswp__ui--idle .pswp__button--arrow--right {
-	opacity: 0; }
- 
- /*
-	 pswp__ui--hidden class is added when controls are hidden
-	 e.g. when user taps to toggle visibility of controls
- */
- .pswp__ui--hidden .pswp__top-bar,
- .pswp__ui--hidden .pswp__caption,
- .pswp__ui--hidden .pswp__button--arrow--left,
- .pswp__ui--hidden .pswp__button--arrow--right {
-	/* Force paint & create composition layer for controls. */
-	opacity: 0.001; }
- 
- /* pswp__ui--one-slide class is added when there is just one item in gallery */
- .pswp__ui--one-slide .pswp__button--arrow--left,
- .pswp__ui--one-slide .pswp__button--arrow--right,
- .pswp__ui--one-slide .pswp__counter {
-	display: none; }
- 
- .pswp__element--disabled {
-	display: none !important; }
- 
- .pswp--minimal--dark .pswp__top-bar {
-	background: none; }
- 
\ No newline at end of file
diff --git a/hugo/assets/scss/main.scss b/hugo/assets/scss/main.scss
deleted file mode 100644
index 747fc67..0000000
--- a/hugo/assets/scss/main.scss
+++ /dev/null
@@ -1,19 +0,0 @@
-@import "base/reset.scss";
-@import "base/variables.scss";
-@import "base/mixins.scss";
-@import "base/sections.scss";
-@import "base/page.scss";
-@import "base/list.scss";
-
-@import "base/links.scss";
-//@import "base/paper.scss";
-@import "libraries/photoswipe.scss";
-
-@import "components/pullquote.scss";
-@import "components/button.scss";
-
-@import "content/index.scss";
-
-@import "partials/site-header.scss";
-@import "partials/site-footer.scss";
-@import "partials/h-card.scss";
\ No newline at end of file
diff --git a/hugo/assets/scss/partials/h-card.scss b/hugo/assets/scss/partials/h-card.scss
deleted file mode 100644
index 8ff76d1..0000000
--- a/hugo/assets/scss/partials/h-card.scss
+++ /dev/null
@@ -1,47 +0,0 @@
-.h-card {
-	display: grid;
-	grid-template-areas:
-		"header"
-		"name"
-		"note";
-	.p-note, .u-email, .u-impp, .p-gender-identity, .u-url, p.p-name {
-		display: none;
-	}
-	header {
-		background-image: url('/header.jpg');
-		background-size: cover;
-		background-position: center;
-		aspect-ratio: 2;
-		display: grid;
-		place-items: center;
-	}
-	section {
-		padding: 1em;
-	}
-	.e-note {
-		grid-area: note;
-		p {
-			margin: 1em 0;
-			max-width: 55ch;
-		}
-	}
-	.u-photo {
-		width: 100px;
-		height: 100px;
-		background: rgba(0,0,0,0.5);
-		padding: 2px;
-		border-radius: 100em;
-		box-sizing: border-box;
-	}
-	.u-author {
-		display: unset;
-		font-weight: 700;
-		text-decoration: none;
-		color: inherit;
-	}
-	span.p-nickname {
-		color: #555;
-		&:before {content: '('}
-		&:after {content: ')'}
-	}
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/partials/site-footer.scss b/hugo/assets/scss/partials/site-footer.scss
deleted file mode 100644
index b982b13..0000000
--- a/hugo/assets/scss/partials/site-footer.scss
+++ /dev/null
@@ -1,94 +0,0 @@
-.site-footer {
-	background: #fff;
-	color: #212121;
-	padding: 2em 0 calc(2em + 4em);
-	@media (min-width: 960px) {
-		padding: 2em 0;
-	}
-	hr {
-		display: none;
-	}
-	.container {
-		display: flex;
-		flex-flow: row wrap;
-		justify-content: space-between;
-		gap: 2em;
-	}
-	.external-links {
-		margin: 0 auto;
-		display: grid;
-		grid-template-columns: repeat(6,1fr);
-		gap: 1em;
-		margin-top: 2rem;
-		a {
-			width: 2em;
-			aspect-ratio: 1;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			text-decoration: none;
-			color: inherit;
-		}
-		i {font-size: 1.6em;}
-	}
-	.footer-copy {
-		font-family: monospace;
-		width: 100%;
-		h1 {
-			font-weight: 700;
-			font-size: 1.21em;
-			margin-bottom: 1em;
-		}
-		h2 {
-			font-weight: 700;
-			font-size: 1.1em;
-			margin-bottom: 0.7rem;
-			margin-top: 1rem;
-		}
-		h3 {
-			font-weight: 700;
-			font-size: 1em;
-			margin-bottom: 0.5rem;
-			margin-top: 1rem;
-		}
-		ul {
-			display: flex;
-			flex-flow: column;
-			gap: 0.5rem;
-		}
-		p {
-			line-height: 1.4;
-			max-width: 55ch;
-		}
-		a h3 {
-			display: inline-block;
-		}
-	}
-	.git-lastcommit {
-		margin-bottom: 0.7rem;
-		display: grid;
-		grid-template-areas:
-			"time time"
-			"hash subj";
-		grid-template-columns: max-content 1fr;
-		time {
-			grid-area: time;
-			display: flex;
-			justify-content: start;
-			align-items: center;
-			padding: 0.25rem 0;
-		}
-		p {
-			grid-area: subj;
-			padding: 1em;
-		}
-		a {
-			grid-area: hash;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			border-radius: 0.25rem;
-			font-family: monospace;
-		}
-	}
-}
\ No newline at end of file
diff --git a/hugo/assets/scss/partials/site-header.scss b/hugo/assets/scss/partials/site-header.scss
deleted file mode 100644
index 777994e..0000000
--- a/hugo/assets/scss/partials/site-header.scss
+++ /dev/null
@@ -1,134 +0,0 @@
-.site-header {
-	z-index: 10;
-	a {
-		text-decoration: none;
-		color: inherit;
-		&:link {
-
-		}
-		
-		&:visited {
-		
-		}
-		
-		&:focus {
-			background: var(--primary-accent-transparent);
-			padding: unset;
-			border-radius: unset;
-		}
-		
-		&:hover {
-			
-		}
-		
-		&:active {
-		
-		}
-	}
-	.container {
-		display: flex;
-		flex-flow: row wrap;
-		justify-content: space-between;
-	}
-	background: var(--ui-background);
-	color: var(--ui-text);
-	
-}
-
-.site-masthead {
-	display: flex;
-	flex-flow: row-reverse;
-	align-items: center;
-	padding: 1em 0;
-	gap: 1em;
-	flex: 1;
-	@media (min-width: $container-width) {
-		flex: unset;
-	}
-}
-.site-icon {
-	width: 2em;
-	height: 2em;
-	border-radius: 100em;
-}
-.site-title {
-	margin: 0;
-	line-height: 1;
-	font-size: 1em;
-}
-
-.site-nav {
-	flex-grow: 1;
-	position: fixed;
-	bottom: 0;
-	left: 0;
-	width: 100vw;
-	background: var(--ui-background);
-	color: var(--ui-text-muted);
-	z-index: 2;
-	ul {
-		height: var(--nav-height);
-		max-width: $container-width;
-		margin: 0 auto;
-		display: flex;
-		justify-content: space-around;
-		li {
-			flex: 1;
-			border-bottom: 4px solid var(--ui-background-track);
-			&.active {
-				color: var(--ui-text-bold);
-				border-bottom: 6px solid var(--primary-accent);
-				font-weight: 700;
-			}
-			a {
-				display: flex;
-				flex-flow: column;
-				align-items: center;
-				justify-content: center;
-				height: 100%;
-				span {padding: 0.25em;}
-				svg {
-					width: 1em;
-					height: 1em;
-				}
-				&:link {
-
-				}
-				
-				&:visited {
-				
-				}
-				
-				&:focus {
-					background: var(--primary-accent-transparent);
-					padding: unset;
-					border-radius: unset;
-				}
-				
-				&:hover {
-					
-				}
-				
-				&:active {
-				
-				}
-			}
-		}
-	}
-	box-shadow: 0px -2px 2px rgba(0,0,0,0.2);
-	@media (min-width: $container-width) {
-		position: unset;
-		bottom: unset;
-		left: unset;
-		flex-grow: unset;
-		width: 20em;
-		box-shadow: unset;
-	}
-}
-
-@media (min-width: $container-width) {
-	.site-header {
-		position: sticky;
-		top: 0;
-	}
-}
diff --git a/hugo/assets/styles/common/base.scss b/hugo/assets/styles/common/base.scss
new file mode 100644
index 0000000..f4a24f8
--- /dev/null
+++ b/hugo/assets/styles/common/base.scss
@@ -0,0 +1,45 @@
+$site-max-width: 100rem;
+
+:root {
+	--site-max-width: #{$site-max-width};
+	--nav-height: 4rem;
+	--header-height: 4.5rem;
+	--footer-height: 3rem;
+}
+
+html {
+	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+	scroll-behavior: smooth;
+	background: var(--ui-background);
+	color: var(--ui-text);
+}
+
+/* Single column layout, where main content stretches to fill. */
+body {
+	display: flex;
+	flex-flow: column;
+	min-height: calc(var(--vh, 1vh) * 100);
+	max-width: 100vw;
+	margin: auto;
+}
+main {flex-grow: 1;}
+
+/*
+Sections are primary block units, usually of type <section>.
+Containers are an immediate child <div>, purely for constraining width.
+*/
+.section {
+	padding: 2em 0; /* we apply a vertical padding only to sections */
+}
+.container {
+	width: 100%;
+	max-width: var(--site-max-width);
+	margin: 0 auto;
+	padding: 0 1em; /* and we apply a horizontal padding only to containers */
+}
+
+/* Ensure consistent colors for text selection */
+::selection {
+	background: var(--primary-accent);
+	color: var(--primary-accent-text);
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/common/colors.scss b/hugo/assets/styles/common/colors.scss
new file mode 100644
index 0000000..dd38f34
--- /dev/null
+++ b/hugo/assets/styles/common/colors.scss
@@ -0,0 +1,35 @@
+:root {
+	--link-color: #3371cf;
+	--link-visited: #594288;
+
+	--primary-accent: rgb(0, 123, 255);
+	--primary-accent-transparent: rgba(0, 123, 255,0.25);
+	--primary-accent-text: #fff;
+
+	--ui-background: #eee;
+	--ui-text: #111;
+	--ui-text-muted: #666;
+	--ui-text-bold: #000;
+
+	--ui-overlay: #fff;
+	--ui-overlay-text: var(--ui-text);
+}
+
+@media (prefers-color-scheme: dark) {
+	:root {
+		--link-color: #8fb1df;
+		--link-visited: #a089d4;
+
+		--primary-accent: rgb(0, 123, 255);
+		--primary-accent-transparent: rgba(64, 156, 255, 0.45);
+		--primary-accent-text: #fff;
+
+		--ui-background: #212121;
+		--ui-text: #eee;
+		--ui-text-muted: #999;
+		--ui-text-bold: #fff;
+
+		--ui-overlay: #333;
+		--ui-overlay-text: var(--ui-text);
+	}
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/common/content.scss b/hugo/assets/styles/common/content.scss
new file mode 100644
index 0000000..5bad456
--- /dev/null
+++ b/hugo/assets/styles/common/content.scss
@@ -0,0 +1,187 @@
+.e-content {
+	/* text */
+	h1 {font-size: 1.8em}
+	h2 {font-size: 1.6em}
+	h3 {font-size: 1.423em}
+	h4 {font-size: 1.265em}
+	h5 {font-size: 1.125em}
+	h6 {font-size: 1em}
+	h1, h2, h3, h4, h5, h6 {
+		line-height: 1.2;
+		margin-bottom: 1rem;
+		margin-top: 2rem;
+		font-weight: 700;
+	}
+	p {
+		line-height: 2;
+		margin-bottom: 1em;
+		max-width: 80ch;
+	}
+	a {
+		word-wrap: break-word;
+	}
+	/* semantics */ 
+	em {font-style: italic}
+	strong {font-weight: 700}
+	/* text formatting */
+	--script-size: 0.65em;
+	sup {
+		position: relative;
+		font-size: var(--script-size);
+		top: -1em;
+	}
+	sub {
+		position: relative;
+		font-size: var(--script-size);
+	}
+	@supports #{'selector\(:has(kbd))'} {
+		/* style individual keys only (for the innermost <kbd> element) */
+		kbd kbd,
+		kbd:not(:has(kbd)) {
+			font-family: monospace;
+			padding: 0.25em;
+			background: var(--ui-overlay);
+			color: var(--ui-overlay-text);
+		}
+	}
+	@supports not #{'selector\(:has(kbd))'} {
+		/* style the entire key sequence */
+		kbd {
+			font-family: monospace;
+			padding: 0.25em;
+			background: var(--ui-overlay);
+			color: var(--ui-overlay-text);
+		}
+		/* and prevent double-styling for nested keys */
+		kbd kbd {
+			background: none;
+		}
+	}
+	mark {
+		background: var(--primary-accent-transparent);
+		color: var(--ui-text);
+		--pad-x-highlight: 0.125em;
+		padding-left: var(--pad-x-highlight);
+		padding-right: var(--pad-x-highlight);
+	}
+	abbr[title]:after {
+		content: '?';
+		font-size: var(--script-size);
+		color: var(--ui-text-muted);
+	}
+	/* lists */
+	ul {list-style: disc; margin: 1em 0;}
+	li {margin-bottom: 1em; line-height: 1.4; margin-left: 1em;}
+	ol {list-style: decimal; margin: 1em 0;}
+	dl {margin: 1em 0; line-height: 1.4;}
+	dt {font-weight: 700;}
+	dd {margin-left: 1em;}
+	/* block elements */
+	img {
+		width: 100%;
+		margin-bottom: 1em;
+	}
+	blockquote {
+		font-style: italic;
+		font-size: 1em;
+		margin: 1em 0;
+		border-left: 0.25rem solid var(--ui-text-bold);
+		padding-left: 0.75em;
+		line-height: 1.4;
+	}
+	pre {
+		font-family: monospace;
+		background: var(--ui-overlay);
+		color: var(--ui-overlay-text);
+		padding: 1em;
+		line-height: 2;
+		overflow-x: auto;
+		white-space: pre;
+		display: grid;
+		tab-size: 3;
+		margin-bottom: 1em;
+	}
+	code {
+		font-family: monospace;
+		background: var(--ui-overlay);
+		color: var(--ui-overlay-text);
+		padding: 0.25rem;
+	}
+	:not(.highlight) > pre {
+		line-height: 1.5;
+		background: var(--ui-overlay);
+		padding: 1em;
+	}
+	pre code {
+		background: inherit;
+		padding: 0;
+	}
+	pre code > span {
+		padding: 0 1em;
+	}
+	.highlight pre {
+		padding: 1em 0;
+	}
+	/* figures */
+	figure {
+		margin-bottom: 1em;
+	}
+	figure img {
+		width: 100%;
+		margin-bottom: -0.125em;
+	}
+	figcaption {
+		background: #212121;
+		color: white;
+		font-style: italic;
+		padding: 1em;
+		font-size: 0.8em;
+		line-height: 1.2;
+	}
+	/* tables */
+	table {text-align: center;}
+	thead {
+		font-weight: 700;
+		background: var(--ui-overlay);
+		color: var(--ui-overlay-text);
+	}
+	th, td {
+		border: 1px solid var(--ui-text);
+		padding: 0.5em;
+	}
+	/* hugo-specific citation footnote */
+	cite sup {
+		position: inherit;
+		font-size: inherit;
+		a {
+			padding: 0.25em;
+		}
+		&:before {
+			content: ' [';
+		}
+		&:after {
+			content: ']';
+		}
+	}
+	/* the actual footnotes section */
+	.footnotes {
+		hr {
+			display: flex;
+			align-items: center;
+			border: 0;
+			&:before {
+				content: 'Footnotes';
+				color: var(--ui-text);
+				text-transform: uppercase;
+				font-weight: 900;
+				font-size: 0.8em;
+			}
+			&:after {
+				content: '';
+				width: 100%;
+				margin-left: 1rem;
+				border-bottom: 1px solid var(--ui-text-muted);
+			}
+		}
+	}
+}
\ No newline at end of file
diff --git a/hugo/assets/scss/base/reset.scss b/hugo/assets/styles/common/reset.scss
similarity index 100%
rename from hugo/assets/scss/base/reset.scss
rename to hugo/assets/styles/common/reset.scss
diff --git a/hugo/assets/styles/features/headings.scss b/hugo/assets/styles/features/headings.scss
new file mode 100644
index 0000000..4c26678
--- /dev/null
+++ b/hugo/assets/styles/features/headings.scss
@@ -0,0 +1,80 @@
+h2.heading {
+	border-bottom: 1px solid var(--ui-text-muted);
+	padding-bottom: 1rem;
+}
+
+/* headings with no numbers */
+
+article:not([autonumbering]) .heading {
+	position: relative;
+	margin-right: 2.5rem;
+	&__anchor-link {
+		display: inline-flex;
+		align-content: center;
+		margin-left: 0.25em;
+		position: absolute;
+		right: -2.5rem;
+		top: 3px;
+		font-size: 1rem;
+	}
+}
+
+/* headings with autonumbering support */
+
+body {counter-reset: h2}
+h2 {counter-reset: h3}
+h3 {counter-reset: h4}
+h4 {counter-reset: h5}
+
+article[autonumbering] {
+	h2:before {
+		counter-increment: h2;
+		content: counter(h2) " ";
+	}
+	h3:before {
+		counter-increment: h3;
+		content: counter(h2) "." counter(h3) " ";
+	}
+	h4:before {
+		counter-increment: h4;
+		content: counter(h2) "." counter(h3) "." counter(h4) " ";
+	}
+	h2:before,
+	h3:before,
+	h4:before
+	{
+		margin-right: 1em;
+		font-family: monospace;
+		font-size: 1rem;
+	}
+
+	.heading {
+		display: grid;
+		grid-template-columns: 1fr auto;
+		grid-template-rows: auto auto;
+		grid-gap: 0.5rem;
+		&__text {
+			grid-column: span 2;
+		}
+		&__anchor-link {
+			font-size: 1rem;
+			grid-column: 2;
+			grid-row: 1;
+			justify-self: end;
+		}
+	}
+
+	#TableOfContents :is(ol, ul) {
+		counter-reset: item;
+	}
+	#TableOfContents li:before {
+		content: counters(item, ".") ". ";
+		counter-increment: item;
+		font-family: monospace;
+	}
+	#TableOfContents ol ol,
+	#TableOfContents ul ul
+	{
+		margin-left: 0;
+	}
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/features/links.scss b/hugo/assets/styles/features/links.scss
new file mode 100644
index 0000000..b74dee5
--- /dev/null
+++ b/hugo/assets/styles/features/links.scss
@@ -0,0 +1,29 @@
+a:link {
+	transition: all 0.1s ease-out;
+	color: var(--link-color);
+	text-decoration-thickness: .0625rem;
+	text-underline-offset: 0.125em;
+	text-decoration-skip-ink: none;
+}
+
+a:visited {
+	color: var(--link-visited);
+}
+
+a:focus {
+	outline: none;
+	background: var(--primary-accent);
+	color: var(--primary-accent-text);
+	border-radius: 2px;
+	text-decoration: none;
+	padding: 4px;
+}
+
+a:hover {
+	text-decoration-thickness: 0.125em;
+	text-underline-offset: 0.25em;
+}
+
+@media (prefers-reduced-motion) {
+	a:link {transition: none}
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/features/search.scss b/hugo/assets/styles/features/search.scss
new file mode 100644
index 0000000..fe448fa
--- /dev/null
+++ b/hugo/assets/styles/features/search.scss
@@ -0,0 +1,66 @@
+.search-results__title {
+	display: block;
+	font-size: 2em;
+	line-height: 1;
+	margin-bottom: 1em;
+}
+
+.search-results strong {
+	font-weight: 900;
+	background: var(--primary-accent-transparent);
+	color: var(--ui-text-bold);
+}
+
+#search-results {
+	display: flex;
+	flex-flow: column;
+	max-width: 80ch;
+}
+
+#search-results li:not(:first-child) {
+	border-top: 1px solid var(--ui-text-muted);
+}
+
+#search-results li {
+	padding: 1em 0;
+}
+
+.search-result-page-title {
+	font-size: 1.25em;
+	display: block;
+	margin-bottom: 1rem;
+}
+
+.search-result-item p {
+	line-height: 1.5;
+}
+
+#search-form {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	max-width: 100%;
+}
+
+#search-input {
+	background: var(--ui-overlay);
+	color: var(--ui-overlay-text);
+	filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.15));
+	border-radius: 100rem;
+	border: 0;
+	padding: 0.5rem 1rem;
+	margin-right: 0.5rem;
+	flex-shrink: 1;
+	height: 2rem;
+	box-sizing: border-box;
+}
+
+#search-submit {
+	padding: 0.5rem 1rem;
+	border: 0;
+	background: var(--primary-accent);
+	color: var(--primary-accent-text);
+	border-radius: 4px;
+	height: 2rem;
+	filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.15));
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/features/syntax-highlighting.scss b/hugo/assets/styles/features/syntax-highlighting.scss
new file mode 100644
index 0000000..cd64de9
--- /dev/null
+++ b/hugo/assets/styles/features/syntax-highlighting.scss
@@ -0,0 +1,110 @@
+/* syntax highlighting */
+
+.highlight {
+
+	--error: #cc0000;
+	--keyword: #3361a7;
+	--class: #f57900;
+	--variable: #c049dd;
+	--number: #32940b;
+	--operator: #5400c2;
+	--highlight: rgb(230, 230, 196);
+
+	@media (prefers-color-scheme: dark) {
+	
+		--error: #f85e5e;
+		--keyword: #e0d56e;
+		--class: #b872f1;
+		--variable: #68aff1;
+		--number: #53ca24;
+		--operator: #fffd6f;
+		--highlight: #444;
+	}
+
+}
+
+/* Background */ .bg { background-color: #f8f8f8; }
+/* PreWrapper */ .chroma { background-color: #f8f8f8; }
+/* Other */ .chroma .x { color: var(--ui-text-bold) }
+/* Error */ .chroma .err { color: var(--error) }
+/* CodeLine */ .chroma .cl { color: var(--ui-text) }
+/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
+/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; }
+/* LineHighlight */ .chroma .hl { background-color: var(--highlight) }
+/* LineNumbersTable */ .chroma .lnt { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
+/* LineNumbers */ .chroma .ln { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
+/* Line */ .chroma .line { display: flex; white-space: pre }
+/* Keyword */ .chroma .k { color: var(--keyword); font-weight: bold }
+/* KeywordConstant */ .chroma .kc { color: var(--keyword); font-weight: bold }
+/* KeywordDeclaration */ .chroma .kd { color: var(--keyword); font-weight: bold }
+/* KeywordNamespace */ .chroma .kn { color: var(--keyword); font-weight: bold }
+/* KeywordPseudo */ .chroma .kp { color: var(--keyword); font-weight: bold }
+/* KeywordReserved */ .chroma .kr { color: var(--keyword); font-weight: bold }
+/* KeywordType */ .chroma .kt { color: var(--keyword); font-weight: bold }
+/* Name */ .chroma .n { color: var(--ui-text-bold) }
+/* NameAttribute */ .chroma .na { color: var(--keyword) }
+/* NameBuiltin */ .chroma .nb { color: var(--name) }
+/* NameBuiltinPseudo */ .chroma .bp { color: #3465a4 }
+/* NameClass */ .chroma .nc { color: var(--ui-text-bold) }
+/* NameConstant */ .chroma .no { color: var(--ui-text-bold) }
+/* NameDecorator */ .chroma .nd { color: var(--class); font-weight: bold }
+/* NameEntity */ .chroma .ni { color: var(--name) }
+/* NameException */ .chroma .ne { color: var(--error); font-weight: bold }
+/* NameFunction */ .chroma .nf { color: var(--ui-text-bold) }
+/* NameFunctionMagic */ .chroma .fm { color: var(--ui-text-bold) }
+/* NameLabel */ .chroma .nl { color: var(--name) }
+/* NameNamespace */ .chroma .nn { color: var(--ui-text-bold) }
+/* NameOther */ .chroma .nx { color: var(--class)}
+/* NameProperty */ .chroma .py { color: var(--ui-text-bold) }
+/* NameTag */ .chroma .nt { color: var(--keyword); font-weight: bold }
+/* NameVariable */ .chroma .nv { color: var(--variable) }
+/* NameVariableClass */ .chroma .vc { color: var(--ui-text-bold)}
+/* NameVariableGlobal */ .chroma .vg { color: var(--ui-text-bold) }
+/* NameVariableInstance */ .chroma .vi { color: var(--ui-text-bold) }
+/* NameVariableMagic */ .chroma .vm { color: var(--ui-text-bold) }
+/* Literal */ .chroma .l { color: var(--ui-text-bold) }
+/* LiteralDate */ .chroma .ld { color: var(--ui-text-bold) }
+/* LiteralString */ .chroma .s { color: var(--variable) }
+/* LiteralStringAffix */ .chroma .sa { color: var(--variable) }
+/* LiteralStringBacktick */ .chroma .sb { color: var(--variable) }
+/* LiteralStringChar */ .chroma .sc { color: var(--variable) }
+/* LiteralStringDelimiter */ .chroma .dl { color: var(--variable) }
+/* LiteralStringDoc */ .chroma .sd { color: var(--keyword); font-style: italic }
+/* LiteralStringDouble */ .chroma .s2 { color: var(--variable) }
+/* LiteralStringEscape */ .chroma .se { color: var(--variable) }
+/* LiteralStringHeredoc */ .chroma .sh { color: var(--variable) }
+/* LiteralStringInterpol */ .chroma .si { color: var(--variable) }
+/* LiteralStringOther */ .chroma .sx { color: var(--variable) }
+/* LiteralStringRegex */ .chroma .sr { color: var(--variable) }
+/* LiteralStringSingle */ .chroma .s1 { color: var(--number) }
+/* LiteralStringSymbol */ .chroma .ss { color: var(--variable) }
+/* LiteralNumber */ .chroma .m { color: var(--number); font-weight: bold }
+/* LiteralNumberBin */ .chroma .mb { color: var(--number); font-weight: bold }
+/* LiteralNumberFloat */ .chroma .mf { color: var(--number); font-weight: bold }
+/* LiteralNumberHex */ .chroma .mh { color: var(--number); font-weight: bold }
+/* LiteralNumberInteger */ .chroma .mi { color: var(--number); font-weight: bold }
+/* LiteralNumberIntegerLong */ .chroma .il { color: var(--number); font-weight: bold }
+/* LiteralNumberOct */ .chroma .mo { color: var(--number); font-weight: bold }
+/* Operator */ .chroma .o { color: var(--operator); font-weight: bold }
+/* OperatorWord */ .chroma .ow { color: var(--keyword); font-weight: bold }
+/* Punctuation */ .chroma .p { color: var(--variable); font-weight: bold }
+/* Comment */ .chroma .c { color: var(--ui-text-muted); font-style: italic }
+/* CommentHashbang */ .chroma .ch { color: var(--ui-text-muted); font-style: italic }
+/* CommentMultiline */ .chroma .cm { color: var(--ui-text-muted); font-style: italic }
+/* CommentSingle */ .chroma .c1 { color: var(--ui-text-muted); font-style: italic }
+/* CommentSpecial */ .chroma .cs { color: var(--ui-text-muted); font-style: italic }
+/* CommentPreproc */ .chroma .cp { color: var(--ui-text-muted); font-style: italic }
+/* CommentPreprocFile */ .chroma .cpf { color: var(--ui-text-muted); font-style: italic }
+/* Generic */ .chroma .g { color: var(--ui-text-bold) }
+/* GenericDeleted */ .chroma .gd { color: var(--error) }
+/* GenericEmph */ .chroma .ge { color: var(--ui-text-bold); font-style: italic }
+/* GenericError */ .chroma .gr { color: var(--error) }
+/* GenericHeading */ .chroma .gh { color: var(--ui-text-bold); font-weight: bold }
+/* GenericInserted */ .chroma .gi { color: var(--ui-text) }
+/* GenericOutput */ .chroma .go { color: var(--ui-text-bold); font-style: italic }
+/* GenericPrompt */ .chroma .gp { color: var(--ui-text) }
+/* GenericStrong */ .chroma .gs { color: var(--ui-text-bold); font-weight: bold }
+/* GenericSubheading */ .chroma .gu { color: var(--ui-text-bold); font-weight: bold }
+/* GenericTraceback */ .chroma .gt { color: var(--error); font-weight: bold }
+/* GenericUnderline */ .chroma .gl { color: var(--ui-text-bold); text-decoration: underline }
+/* TextWhitespace */ .chroma .w { color: var(--ui-text-muted); }
\ No newline at end of file
diff --git a/hugo/assets/styles/mixins/fab-unit.scss b/hugo/assets/styles/mixins/fab-unit.scss
new file mode 100644
index 0000000..77a7270
--- /dev/null
+++ b/hugo/assets/styles/mixins/fab-unit.scss
@@ -0,0 +1,69 @@
+/*
+* https://www.smashingmagazine.com/2022/12/fabunit-smart-way-control-synchronize-typo-space/
+*
+* Specify a minimum size and an optimum size (to be shown at the "target range")
+*/
+
+@use "sass:math";
+
+
+/* Helper functions */
+
+$rem-base: 16px;
+
+@function strip-units($number) {
+  @if (math.is-unitless($number)) {
+      @return $number;
+    } @else {
+      @return math.div($number, $number * 0 + 1);
+  }
+}
+
+@function rem($size){
+  @if (math.compatible($size, 1rem) and not math.is-unitless($size)) {
+    @return $size;
+  } @else {
+    @return math.div(strip-units($size), strip-units($rem-base)) * 1rem;
+  }
+}
+
+
+/* Default values fab-unit 🪄 */
+
+$screen-min: 320;
+$screen-opt-start: 960;
+$screen-opt-end: 1440;
+$screen-max: 2000;  // $screen-opt-end | int > $screen-opt-end | false
+$aspect-ratio: math.div(16, 9);  // smaller values for larger aspect ratios
+
+
+/* Magic function fab-unit 🪄 */
+
+@function fab-unit(
+    $size-min, 
+    $size-opt, 
+    $screen-min: $screen-min, 
+    $screen-opt-start: $screen-opt-start, 
+    $screen-opt-end: $screen-opt-end, 
+    $screen-max: $screen-max,
+    $aspect-ratio: $aspect-ratio
+  ) {
+  $screen-factor: min(100vw, 100vh * $aspect-ratio);
+  $steep-slope: math.div(($size-opt - $size-min), ($screen-opt-start - $screen-min)) * 100 > 1;
+  $slope1: calc(rem($size-min) + ($size-opt - $size-min) * ($screen-factor - rem($screen-min)) / ($screen-opt-start - $screen-min));
+  $slope2: calc($screen-factor / $screen-opt-end * $size-opt);
+  @if $screen-max {
+    $size-max: math.div(rem($screen-max), $screen-opt-end) * $size-opt;
+    @if $steep-slope {
+      @return clamp(rem($size-min), $slope1, clamp(rem($size-opt), $slope2, $size-max));
+    } @else {
+      @return clamp(clamp(rem($size-min), $slope1, rem($size-opt)), $slope2, $size-max);
+    }
+  } @else {
+    @if $steep-slope {
+      @return clamp(rem($size-min), $slope1, max(rem($size-opt), $slope2));
+    } @else {
+      @return max(clamp(rem($size-min), $slope1, rem($size-opt)), $slope2);
+    }
+  }
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/mixins/shadow.scss b/hugo/assets/styles/mixins/shadow.scss
new file mode 100644
index 0000000..64cd996
--- /dev/null
+++ b/hugo/assets/styles/mixins/shadow.scss
@@ -0,0 +1,24 @@
+@mixin shadow-low {
+	box-shadow: 0 1px 1px rgba(0,0,0,0.11), 
+		0 2px 2px rgba(0,0,0,0.11), 
+		0 4px 4px rgba(0,0,0,0.11), 
+		0 6px 8px rgba(0,0,0,0.11),
+		0 8px 16px rgba(0,0,0,0.11);
+}
+
+@mixin shadow-high {
+	box-shadow: 0 2px 1px rgba(0,0,0,0.09), 
+		0 4px 2px rgba(0,0,0,0.09), 
+		0 8px 4px rgba(0,0,0,0.09), 
+		0 16px 8px rgba(0,0,0,0.09),
+		0 32px 16px rgba(0,0,0,0.09);
+}
+
+@mixin shadow-soft {
+	box-shadow: 0 1px 2px rgba(0,0,0,0.07), 
+		0 2px 4px rgba(0,0,0,0.07), 
+		0 4px 8px rgba(0,0,0,0.07), 
+		0 8px 16px rgba(0,0,0,0.07),
+		0 16px 32px rgba(0,0,0,0.07), 
+		0 32px 64px rgba(0,0,0,0.07);
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/partials/h-card.scss b/hugo/assets/styles/partials/h-card.scss
new file mode 100644
index 0000000..48bc9a7
--- /dev/null
+++ b/hugo/assets/styles/partials/h-card.scss
@@ -0,0 +1,75 @@
+@import "../mixins/shadow.scss";
+
+.h-card {
+	--border-radius: 0.5em;
+	@include shadow-low;
+	border-radius: var(--border-radius);
+	max-width: 80ch;
+	header {
+		background-image: url('/header.jpg');
+		background-size: cover;
+		background-position: center;
+		width: 100%;
+		aspect-ratio: 2;
+		display: grid;
+		place-items: end start;
+		border-top-left-radius: var(--border-radius);
+		border-top-right-radius: var(--border-radius);
+	}
+	.u-logo {
+		height: 60%;
+		width: 30%;
+		background: rgba(0,0,0,0.5);
+		border-radius: var(--border-radius);
+		margin-left: 1em;
+		margin-bottom: 1em;
+	}
+	.display-name {
+		display: flex;
+		flex-flow: column;
+		padding-left: 1em;
+		.p-name {
+			&::after {display: none;}
+			&:focus {padding: unset; color: unset; background: unset;}
+			text-decoration: none;
+			color: inherit;
+			font-weight: 900;
+			font-size: 1.5em;
+			line-height: 1.5em;
+			margin-top: 0.5em;
+		}
+		.p-nickname:not(.p-name) {
+			font-size: 1em;
+			line-height: 1.5em;
+			opacity: 0.75;
+			margin-bottom: 0.5em;
+		}
+		background: var(--ui-overlay);
+		color: var(--ui-overlay-text);
+	}
+	section {
+		> .p-name,
+		> .u-email,
+		> .u-impp,
+		> .u-url,
+		> .p-note,
+		> .p-gender-identity
+		{
+			display: none;
+		}
+	}
+	.e-note {
+		font-size: 1em;
+		line-height: 1.5em;
+		p {
+			margin-bottom: 0.5em;
+		}
+		padding: 1em;
+		padding-top: 0;
+		background: var(--ui-overlay);
+		color: var(--ui-overlay-text);
+		border-bottom-left-radius: var(--border-radius);
+		border-bottom-right-radius: var(--border-radius);
+	}
+	margin-bottom: 1em;
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/print.scss b/hugo/assets/styles/print.scss
new file mode 100644
index 0000000..086d16b
--- /dev/null
+++ b/hugo/assets/styles/print.scss
@@ -0,0 +1,29 @@
+@import "common/reset";
+@import "common/colors";
+@import "common/base";
+@import "common/content";
+
+@import "partials/h-card";
+
+@import "features/headings";
+
+#search-form,
+.header-nav,
+.docs-nav,
+.site-footer,
+.edit-link,
+.footnote-backref,
+.heading__anchor-link,
+.section-nav
+{
+	display: none;
+}
+.page-header {padding: 0;}
+
+.page abbr[title]::after {
+	content: " (" attr(title) ") ";
+}
+
+a[href^="http"]:after {
+	content: " (" attr(href) ") ";
+}
\ No newline at end of file
diff --git a/hugo/assets/styles/screen.scss b/hugo/assets/styles/screen.scss
new file mode 100644
index 0000000..759c7d2
--- /dev/null
+++ b/hugo/assets/styles/screen.scss
@@ -0,0 +1,11 @@
+@import "common/reset";
+@import "common/colors";
+@import "common/base";
+@import "common/content";
+
+@import "partials/h-card";
+
+@import "features/headings";
+@import "features/syntax-highlighting";
+@import "features/search";
+@import "features/links";
\ No newline at end of file
diff --git a/hugo/index.html b/hugo/index.html
new file mode 100644
index 0000000..3278f7f
--- /dev/null
+++ b/hugo/index.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>bunny's pillow fort</title>
+	<style>
+		body {
+			display: flex;
+			flex-flow: column;
+		}
+		main {
+			flex-grow: 1;
+		}
+		.section {
+			padding: 1em 0;
+		}
+		.container {
+			padding: 0 1em;
+			max-width: 960px;
+		}
+	</style>
+</head>
+<body>
+	<header class="site-header">
+		<div class="container">
+
+		</div>
+	</header>
+	<main>
+		<section class="section">
+			<div class="container">
+
+			</div>
+		</section>
+	</main>
+	<footer class="site-footer">
+		<div class="container">
+
+		</div>
+	</footer>
+</body>
+</html>
\ No newline at end of file
diff --git a/hugo/layouts/_default/_markup/render-heading.html b/hugo/layouts/_default/_markup/render-heading.html
new file mode 100644
index 0000000..1076ca4
--- /dev/null
+++ b/hugo/layouts/_default/_markup/render-heading.html
@@ -0,0 +1,6 @@
+<h{{.Level}} class="heading" id="{{.Anchor | safeURL}}">
+	<span class="heading__text">{{.Text | safeHTML}}</span>
+	<a class="heading__anchor-link" href="#{{.Anchor | safeURL}}">
+		[link]
+	</a>
+</h{{.Level}}>
\ No newline at end of file
diff --git a/hugo/layouts/_default/baseof.html b/hugo/layouts/_default/baseof.html
index 2c572ea..e3af638 100644
--- a/hugo/layouts/_default/baseof.html
+++ b/hugo/layouts/_default/baseof.html
@@ -1,119 +1,33 @@
 <!DOCTYPE html>
 <html lang="{{.Site.Language.Lang }}" xml:lang="{{.Site.Language.Lang }}">
 <head>
-		<meta charset="UTF-8">
-		<meta name="viewport" content="width=device-width, initial-scale=1.0">
-		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
-		{{ $style := resources.Get "scss/main.scss" | toCSS | minify | fingerprint }}
-		{{ $js := resources.Get "js/main.js" | minify | minify | fingerprint }}
-		<link rel="stylesheet" href="{{ $style.Permalink }}" integrity="{{ $style.Data.Integrity }}" media="screen">
-		<script type="text/javascript" src="{{ $js.Permalink }}" integrity="{{ $js.Data.Integrity }}"></script>
-		{{ $icon := "/avatar.png" | absURL }}
-		<link rel="shortcut icon" href='{{ $icon }}' sizes="400x400">
-		{{ if .IsPage }}<meta name="keywords" content='{{ delimit .Params.tags " "}}'>{{ end }}
-		{{ if .IsHome }}<title>{{ .Site.Title }}</title>
-		<title itemprop="name">{{ .Site.Title }}</title>
-		<meta property="og:title" content="{{ .Site.Title }}" />
-		<meta name="twitter:title" content="{{ .Site.Title }}" />
-		<meta itemprop="name" content="{{ .Site.Title }}" />
-		{{ else }}<title>{{ .Title }} | {{ .Site.Title }}</title>
-		<title itemprop="name">{{ .Title }} | {{ .Site.Title }}</title>
-		<meta property="og:title" content="{{ .Title }} | {{ .Site.Title }}" />
-		<meta name="twitter:title" content="{{ .Title }} | {{ .Site.Title }}" />
-		<meta itemprop="name" content="{{ .Title }} | {{ .Site.Title }}" />{{ end }}
-		<meta name="application-name" content="{{ .Site.Title }}" />
-		<meta property="og:site_name" content="{{ .Site.Title }}" />
-		<meta name="description" content="{{ .Summary }}">
-		<meta itemprop="description" content="{{ .Summary }}" />
-		<meta property="og:description" content="{{ .Summary }}" />
-		<meta name="twitter:description" content="{{ .Summary }}" />
-		<base href="{{ .Permalink }}">
-		<link rel="canonical" href="{{ .Permalink }}" itemprop="url" /> 
-		<meta name="url" content="{{ .Permalink }}" />
-		<meta name="twitter:url" content="{{ .Permalink }}" /> 
-		<meta property="og:url" content="{{ .Permalink }}" />
-		{{ with .Params.cover }}<meta itemprop="image" content="{{ . | absURL }}" />
-		<meta property="og:image" content="{{ . | absURL }}" /> 
-		<meta name="twitter:image" content="{{ . | absURL }}" />
-		<meta name="twitter:image:src" content="{{ . | absURL }}" />{{ else }}
-		<meta itemprop="image" content='{{ $icon }}' />
-		<meta property="og:image" content='{{ $icon }}' />
-		<meta name="twitter:image" content='{{ $icon }}' />
-		<meta name="twitter:image:src" content='{{ $icon }}' />{{ end }}
-		<meta property="og:updated_time" content={{ .Lastmod.Format "2006-01-02T15:04:05Z0700" | safeHTML }} />
-		{{ if isset .Params "date" }}<meta property="og:type" content="article" />
-		<script defer type="application/ld+json">
-			{
-			  "@context": "http://schema.org",
-			  "@type": "Article",
-			  "headline": {{ .Title }},
-			  "author": {
-				 "@type": "Person",
-				 "name": "{{ .Params.author }}"
-			  },
-			  "datePublished": "{{ .Date.Format "2006-01-02" }}",
-			  "description": {{ .Summary }},
-			  "wordCount": {{ .WordCount }},
-			  "mainEntityOfPage": "True",
-			  "dateModified": "{{ .Lastmod.Format "2006-01-02" }}",
-			  "image": {
-				 "@type": "imageObject",
-				 "url": "{{ with .Params.cover }}{{ . }}{{ end }}"
-			  },
-			  "publisher": {
-				 "@type": "Person",
-				 "name": "{{ .Site.Title }}",
-				 "logo": {
-					"@type": "imageObject",
-					"url": {{ $icon }}
-				 }
-			  }
-			}
-		 </script>
-		{{ else }}<meta property="og:type" content="website" /> 
-		<meta name="author" content="{{ .Params.author }}" />
-		<script defer type="application/ld+json">
-		  { 
-			 "@context": "http://schema.org", 
-			 "@type": "WebSite", 
-			 "url": {{ .Permalink }}, 
-			 "name": "{{ .Title }}", 
-			 "logo": {{ $icon }}
-		  }
-		</script>{{ end }}
-		<meta property="article:publisher" content="{{ .Params.author }}" />
-		{{ with.Params.author }}<meta property="og:article:author" content="{{ . }}" />
-		<meta property="article:author" content="{{ . }}" /> 
-		<meta name="author" content="{{ . }}" />{{ end }}
-		{{ with.Params.category }}<meta name="news_keywords" content="{{ . }}" />
-		<meta property="article:section" content="{{ . }}" />{{ end }}
-		<meta property="og:article:published_time" content={{ .Date.Format "2006-01-02T15:04:05Z0700" | safeHTML }} /> 
-		<meta property="article:published_time" content={{ .Date.Format "2006-01-02T15:04:05Z0700" | safeHTML }} />
-		<link rel="sitemap" type="application/xml" title="Sitemap" href="{{ .Site.BaseURL }}sitemap.xml" /> 
-		{{ with .OutputFormats.Get "RSS" }}<link href="{{ .Permalink }}" rel="alternate" type="application/rss+xml" title="{{ $.Site.Title }}" />
-		<link href="{{ .Permalink }}" rel="feed" type="application/rss+xml" title="{{ $.Site.Title }}" />{{ end }}
-		<meta name="robots" content="index,follow" /> 
-		<meta name="googlebot" content="index,follow" />
-		<link rel="manifest" href="{{ .Site.BaseURL }}manifest.json" />
-		<meta name="theme-color" content="#ffffff" /> 
-		<meta name="msapplication-TileColor" content="#ffffff" />
-		<meta name="imagemode" content="force" />
-		<meta name="coverage" content="Worldwide" /> 
-		<meta name="distribution" content="Global" />
-		<meta name="HandheldFriendly" content="True" /> 
-		<meta name="msapplication-tap-highlight" content="no" />
-		<meta name="apple-mobile-web-app-title" content="{{ .Site.Title }}" /> 
-		<meta name="apple-mobile-web-app-capable" content="yes" />
-		<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
-		<meta name="apple-touch-fullscreen" content="yes" />
-		{{ block "head" . }}
-		{{ end }}
-	</head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+{{ $screen := resources.Get "styles/screen.scss" | toCSS | minify | fingerprint }}
+<link rel="stylesheet"
+	href="{{ $screen.Permalink }}"
+	integrity="{{ $screen.Data.Integrity }}"
+	media="screen" />
+{{ $print := resources.Get "styles/print.scss" | toCSS | minify | fingerprint }}
+<link rel="stylesheet"
+	href="{{ $print.Permalink }}"
+	integrity="{{ $print.Data.Integrity }}"
+	media="print" />
+{{ $script := resources.Get "scripts/main.js" | js.Build "script.js" | minify | fingerprint }}
+<script type="text/javascript"
+	src="{{ $script.Permalink }}"
+	integrity="{{ $script.Data.Integrity }}">
+</script>
+{{ partial "styles/external-links.html" . }}
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
+{{ partial "seo.html" . }}
+{{ block "head" . }}
+{{ end }}
+</head>
 	<body>
-		{{ partial "site-header.html" . }}
 		{{ block "main" . }}
 		{{ end }}
-		{{ partial "site-footer.html" .}}
 	</body>
-</html>
+</html>
\ No newline at end of file
diff --git a/hugo/layouts/_default/comment.html b/hugo/layouts/_default/comment.html
index 8c79ba1..c44a0fb 100644
--- a/hugo/layouts/_default/comment.html
+++ b/hugo/layouts/_default/comment.html
@@ -7,6 +7,9 @@
 				<p>In reply to: <a href="{{.Params.inReplyTo}}" class="u-in-reply-to">{{.Params.inReplyTo}}</a></p>
 				<p>Original: <a href="{{.Params.original}}" class="u-syndication">{{.Params.original}}</a></p>
 			</header>
+			<section class="e-content">
+				{{.Content}}
+			</section>
 		</article>
 	</div>
 </main>
diff --git a/hugo/layouts/index.json b/hugo/layouts/index.json
new file mode 100644
index 0000000..d423a62
--- /dev/null
+++ b/hugo/layouts/index.json
@@ -0,0 +1,8 @@
+{{- $.Scratch.Add "pagesIndex" slice -}}
+{{- range $index, $page := .Site.RegularPages -}}
+    {{- if gt (len $page.Content) 0 -}}
+      {{- $pageData := (dict "title" $page.Title "href" $page.Permalink "content" $page.Plain) -}}
+      {{- $.Scratch.Add "pagesIndex" $pageData -}}
+    {{- end -}}
+{{- end -}}
+{{- $.Scratch.Get "pagesIndex" | jsonify -}}
\ No newline at end of file
diff --git a/hugo/layouts/partials/h-card.html b/hugo/layouts/partials/h-card.html
index 3a9c81e..7bf4929 100644
--- a/hugo/layouts/partials/h-card.html
+++ b/hugo/layouts/partials/h-card.html
@@ -1,6 +1,6 @@
 <address class="h-card">
 	<header>
-		<img src="{{.Site.BaseURL}}avatar.png" alt="avatar" class="u-photo u-logo">
+		<img src="{{.Site.BaseURL}}avatar2.png" alt="avatar" class="u-photo u-logo">
 	</header>
 	<section>
 		<h1 class="display-name">
diff --git a/hugo/layouts/partials/seo.html b/hugo/layouts/partials/seo.html
new file mode 100644
index 0000000..556d500
--- /dev/null
+++ b/hugo/layouts/partials/seo.html
@@ -0,0 +1,132 @@
+	{{ "<!-- title -->" | safeHTML }}
+	<title itemprop="name">{{ .Title }} | {{ .Site.Title }}</title>
+	<meta property="og:title" content="{{ .Title }}" />
+	<meta name="twitter:title" content="{{ .Title }}" />
+	<meta name="application-name" content="{{ .Site.Title }}" />
+	<meta property="og:site_name" content="{{ .Site.Title }}" />
+
+	{{- with or .Description .Summary .Site.Params.description }}
+	{{ "<!-- description -->" | safeHTML }}
+	<meta name="description" content="{{.}}">
+	<meta itemprop="description" content="{{.}}" />
+	<meta property="og:description" content="{{.}}" />
+	<meta name="twitter:description" content="{{.}}" />
+	{{ end -}}
+	{{ "<!-- url -->" | safeHTML }}
+	<base href="{{ .Permalink | absURL }}">
+	<link rel="canonical" href="{{ .Permalink | absURL }}" itemprop="url" />
+	<meta name="url" content="{{ .Permalink | absURL }}" />
+	<meta name="twitter:url" content="{{ .Permalink | absURL }}" /> 
+	<meta property="og:url" content="{{ .Permalink | absURL }}" />
+
+	{{- $cover := ($.Resources.ByType "image").GetMatch "{*cover*,*thumbnail*,*featured*}" -}}
+	{{ $icon := resources.GetMatch (default "" .Site.Params.icon) -}}
+	{{- $staticIcon := "icon.png" | absURL -}}
+	{{- with or .Params.cover $cover $icon }}
+	{{ "<!-- image -->" | safeHTML }}
+	<meta itemprop="image" content='{{ .Permalink | absURL }}' />
+	<meta property="og:image" content='{{ .Permalink | absURL }}' />
+	{{- with .Width }}
+	<meta property="og:image:width" content='{{ . }}' />
+	{{- end }}
+	{{- with .Height }}
+	<meta property="og:image:height" content='{{ . }}' />
+	{{- end }}
+	<meta name="twitter:image" content='{{ .Permalink | absURL }}' />
+	<meta name="twitter:image:src" content='{{ .Permalink | absURL }}' />
+	{{- else }}
+	{{ "<!-- image -->" | safeHTML }}
+	<meta itemprop="image" content='{{ $staticIcon }}' />
+	<meta property="og:image" content='{{ $staticIcon }}' />
+	<meta name="twitter:image" content='{{ $staticIcon }}' />
+	<meta name="twitter:image:src" content='{{ $staticIcon }}' />
+	{{- end -}}
+
+	{{/*=== author ===*/}}
+	{{ with or .Params.author .Site.Params.author -}}
+	{{ "<!-- author -->" | safeHTML }}
+	<meta property="article:publisher" content="{{ . }}" />
+	<meta property="og:article:author" content="{{ . }}" />
+	<meta property="article:author" content="{{ . }}" /> 
+	<meta name="author" content="{{ . }}" />
+	{{- end -}}
+
+	{{/*=== published and updated ===*/}}
+	{{ "<!-- time -->" | safeHTML }}
+	{{- with .Date }}
+	<meta property="og:article:published_time" content={{ .Format "2006-01-02T15:04:05Z0700" | safeHTML }} /> 
+	<meta property="article:published_time" content={{ .Format "2006-01-02T15:04:05Z0700" | safeHTML }} />
+	{{ end -}}
+	{{ with .Lastmod -}}
+	<meta property="og:updated_time" content={{ .Format "2006-01-02T15:04:05Z0700" | safeHTML }} />
+	{{ end -}}
+
+	{{/*=== section and keywords ===*/}}
+	{{- with.Params.category -}}
+	<meta name="news_keywords" content="{{ . }}" />
+	<meta property="article:section" content="{{ . }}" />
+	{{- end -}}
+	{{- with .Params.tags }}
+	<meta name="keywords" content='{{ delimit . " "}}'>
+	{{- end -}}
+
+	{{- if isset .Params "date" -}}
+	{{ "<!-- article metadata -->" | safeHTML }}
+	<meta property="og:type" content="article" />
+	<script defer type="application/ld+json">
+		{
+			"@context": "http://schema.org",
+			"@type": "Article",
+			"headline": {{ .Title }},
+			"author": {
+				"@type": "Person",
+				"name": "{{ or .Params.author .Site.Params.author }}"
+			},
+			"datePublished": "{{ .Date.Format "2006-01-02" }}",
+			"description": {{ or .Description .Summary }},
+			"wordCount": {{ .WordCount }},
+			"mainEntityOfPage": "True",
+			"dateModified": "{{ .Lastmod.Format "2006-01-02" }}",
+			"image": {
+				"@type": "imageObject",
+				"url": "{{ with or .Params.cover $cover $icon }}{{ .Permalink | absURL }}{{ end }}"
+			},
+			"publisher": {
+				"@type": "Person",
+				"name": "{{ or .Params.author .Site.Params.author .Site.Title }}",
+				"logo": {
+				"@type": "imageObject",
+				"url": {{with $icon}}{{.Permalink}}{{else}}{{$staticIcon}}{{end}}
+				}
+			}
+		}
+	</script>
+	{{- else -}}
+	{{ "<!-- webpage metadata -->" | safeHTML }}
+	<meta property="og:type" content="website" />
+	<script defer type="application/ld+json">
+		{ 
+			"@context": "http://schema.org", 
+			"@type": "WebSite", 
+			"url": {{ .Permalink }}, 
+			"name": "{{ .Site.Title }}", 
+			"logo": {{with $icon}}{{.Permalink}}{{else}}{{$staticIcon}}{{end}}
+		}
+	</script>
+	{{- end -}}
+
+	{{/* auxiliary info */}}
+	{{ "<!-- site presentation -->" | safeHTML }}
+	{{- with $icon }}
+	<link rel="shortcut icon" href='{{ .Permalink }}' sizes="{{.Width}}x{{.Height}}">
+	{{- else -}}
+	<link rel="shortcut icon" href='{{ $staticIcon }}' sizes="512x512">
+	{{- end }}
+	<meta name="theme-color" content="#ffffff" />
+	<meta name="msapplication-TileColor" content="#ffffff" />
+	<link rel="sitemap" type="application/xml" title="Sitemap" href="{{ .Site.BaseURL }}sitemap.xml" /> 
+	{{ with .OutputFormats.Get "RSS" -}}
+	<link href="{{ .Permalink }}" rel="feed alternate" type="application/rss+xml" title="{{ $.Site.Title }}" />
+	{{- end }}
+	<meta name="robots" content="index,follow" />
+	<meta name="googlebot" content="index,follow" />
diff --git a/hugo/layouts/partials/site-footer.html b/hugo/layouts/partials/site-footer.html
deleted file mode 100644
index 00ad607..0000000
--- a/hugo/layouts/partials/site-footer.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<footer class="site-footer">
-	<hr>
-	<div class="container">
-		<ul class="breadcrumbs">
-			{{ template "breadcrumb" (dict "p1" . "p2" .) }}
-		</ul>
-		<a href="#top">back to top</a>
-	</div>
-</footer>
-
-{{ define "breadcrumb" }}
-  {{ if .p1.Parent }}
-    {{ template "breadcrumb" (dict "p1" .p1.Parent "p2" .p2 )  }}
-  {{ else if not .p1.IsHome }}
-    {{ template "breadcrumb" (dict "p1" .p1.Site.Home "p2" .p2 )  }}
-  {{ end }}
-  <li{{ if eq .p1 .p2 }} class="active"{{ end }}>
-    <a href="{{ .p1.RelPermalink }}">{{ .p1.Title }}</a>
-  </li>
-{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/partials/site-header.html b/hugo/layouts/partials/site-header.html
deleted file mode 100644
index 8b23c67..0000000
--- a/hugo/layouts/partials/site-header.html
+++ /dev/null
@@ -1,27 +0,0 @@
-<header class="site-header">
-	<div class="container">
-		<a href="/" class="site-masthead">
-			<p class="site-title">a</p>
-		</a>
-		<nav class="site-nav">
-			<ul>
-				{{ $currentPage := . }}
-				{{ range .Site.Menus.main }}
-				<li class='
-				{{ if or ($currentPage.IsMenuCurrent "main" .) (eq $currentPage.Section .Identifier) }}
-				active
-				{{ end }}'>
-					 <a href="{{ .URL | absLangURL }}">
-						{{ .Pre }}
-						<span>{{ .Name }}</span>
-						{{ .Post }}
-					 </a>
-				</li>
-				{{ end }}
-			</ul>
-		</nav>
-	</div>
-</header>
-<div style="position: relative;">
-<div id="top" style="scroll-margin-top: var(--header-height);"></div>
-</div>
\ No newline at end of file
diff --git a/hugo/layouts/partials/styles/external-links.html b/hugo/layouts/partials/styles/external-links.html
new file mode 100644
index 0000000..0db6089
--- /dev/null
+++ b/hugo/layouts/partials/styles/external-links.html
@@ -0,0 +1,15 @@
+<style>
+a[href^="http"]:after {
+	content: "🡕";
+}
+
+a[href^="{{.Site.BaseURL}}"]:after
+{
+	display: none !important;
+}
+
+a[href^="http://localhost"]:after
+{
+	display: none !important;
+}
+</style>
\ No newline at end of file
diff --git a/hugo/layouts/search/list.html b/hugo/layouts/search/list.html
new file mode 100644
index 0000000..8319ad3
--- /dev/null
+++ b/hugo/layouts/search/list.html
@@ -0,0 +1,21 @@
+{{ define "main" }}
+<main>
+	<div class="search-results section">
+		<header>
+			<div class="container">
+				<h2 class="search-results__title"><span id="results-count"></span> <span id="results-count-text"></span> for "<span id="results-query"></span>"</h2>
+			</div>
+		</header>
+		<section>
+			<div class="container">
+				<ul id="search-results">
+	
+				</ul>
+			</div>
+		</section>
+	</div>
+</main>
+<style>
+	a[href="#top"] {display: none;}
+</style>
+{{ end }}
\ No newline at end of file
diff --git a/hugo/static/avatar2.png b/hugo/static/avatar2.png
new file mode 100644
index 0000000..d6e6e04
Binary files /dev/null and b/hugo/static/avatar2.png differ