Tone down hero name, crop new avatar, drop em-dashes

Make the name a quiet heading and let the one-line thesis lead the hero.
Replace the portrait with a center-cropped 4:5 version of the new photo
(downscaled 1.2 MB -> 91 KB) and drop the now-pointless grayscale hover.
Remove em-dashes from copy (restructured prose; en-dashes for year ranges;
mid-dot in the page titles).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/assets/style.css

@@ -1,5 +1,5 @@
 /*
-	thiessen.io — personal site
+	thiessen.io personal site
 	Swiss-minimal direction. Display: Space Grotesk · Body: Hanken Grotesk · Mono: Space Mono.
 	One accent (signal cobalt), used only for links and the live timeline node.
 */
@@ -138,22 +138,22 @@ a { color: inherit; }
 
 .hero__name {
 	font-family: var(--font-display);
-	font-weight: 600;
-	font-size: clamp(3rem, 9.5vw, 7rem);
-	line-height: 0.92;
-	letter-spacing: -0.035em;
+	font-weight: 500;
+	font-size: clamp(1.5rem, 2.6vw, 1.9rem);
+	line-height: 1.1;
+	letter-spacing: -0.005em;
 	margin: 0;
 }
 
 .hero__lead {
 	font-family: var(--font-display);
-	font-weight: 400;
-	font-size: clamp(1.35rem, 2.7vw, 2rem);
-	line-height: 1.18;
-	letter-spacing: -0.01em;
+	font-weight: 500;
+	font-size: clamp(1.5rem, 3.2vw, 2.35rem);
+	line-height: 1.16;
+	letter-spacing: -0.015em;
 	color: var(--ink);
-	max-width: 30ch;
-	margin: 1.75rem 0 0;
+	max-width: 26ch;
+	margin: 1rem 0 0;
 }
 
 .hero__meta {
@@ -194,12 +194,8 @@ a { color: inherit; }
 	object-fit: cover;
 	border-radius: 6px;
 	border: 1px solid var(--mist);
-	filter: grayscale(100%) contrast(1.02);
-	transition: filter 0.4s ease;
 }
 
-.portrait img:hover { filter: grayscale(0%); }
-
 /* ---------- profile ---------- */
 
 .prose p {

src/pages/404.js

@@ -7,7 +7,7 @@ const NotFoundPage = () => (
   <Layout>
     <Helmet>
       <html lang="en" />
-      <title>Not found — Dennis Thiessen</title>
+      <title>Not found · Dennis Thiessen</title>
     </Helmet>
     <div className="wrap notfound">
       <p className="eyebrow">Error 404</p>

src/pages/index.js

@@ -4,26 +4,26 @@ import { Helmet } from 'react-helmet'
 import Layout from '../components/layout'
 import avatar from '../assets/images/avatar.jpg'
 
-const SITE_TITLE = 'Dennis Thiessen — Data, Analytics & AI Engineer'
+const SITE_TITLE = 'Dennis Thiessen · Data, Analytics & AI Engineer'
 const SITE_DESCRIPTION =
   'Dennis Thiessen is a Staff Data, Analytics & AI Engineer in Bern, Switzerland, building the data pipelines and ML infrastructure that production systems run on.'
 
 const EMAIL = 'dennis@thiessen.io'
 const LINKEDIN = 'https://www.linkedin.com/in/dennis-thiessen'
 
-// Career as a pipeline — most recent first. Each node is a role.
+// Career as a pipeline, most recent first. Each node is a role.
 const ROLES = [
   {
-    year: '2023 — PRESENT',
+    year: '2023 – PRESENT',
     company: 'Swisscom',
     location: 'Bern, CH',
     title: 'Staff Data, Analytics & AI Engineer',
     description:
-      'ETL and streaming pipelines in Python, Kafka and SAP BODS feeding a Teradata warehouse — and migrating the legacy stack onto AWS (Glue, Redshift, Lambda, Step Functions, Airflow).',
+      'ETL and streaming pipelines in Python, Kafka and SAP BODS feeding a Teradata warehouse, while migrating the legacy stack onto AWS (Glue, Redshift, Lambda, Step Functions, Airflow).',
     live: true,
   },
   {
-    year: '2020 — 2023',
+    year: '2020 – 2023',
     company: 'Bosch Semiconductor',
     location: 'Dresden, DE',
     title: 'Senior Data Engineer',
@@ -31,7 +31,7 @@ const ROLES = [
       'Containerised ML inference (Docker, Kubernetes, Ansible) into 24/7 semiconductor production lines, and built Python, Java and C# data services over Oracle and Hadoop/Impala.',
   },
   {
-    year: '2018 — 2020',
+    year: '2018 – 2020',
     company: 'Fraunhofer CML',
     location: 'Hamburg, DE',
     title: 'Research Software Engineer',
@@ -39,7 +39,7 @@ const ROLES = [
       'Optimisation-based crew-scheduling decision support in C#/.NET, plus research microservices and a Jenkins CI/CD pipeline with quality gates.',
   },
   {
-    year: '2017 — 2018',
+    year: '2017 – 2018',
     company: 'Vizrt',
     location: 'Bergen, NO',
     title: 'DevOps Engineer',
@@ -47,7 +47,7 @@ const ROLES = [
       'A distributed video-transcoding backend in Python and C++, with automated audio/video integration testing for reliable releases.',
   },
   {
-    year: '2015 — 2017',
+    year: '2015 – 2017',
     company: 'Generali',
     location: 'Hamburg, DE',
     title: 'Software Engineer & IT Consultant',
@@ -105,7 +105,7 @@ const IndexPage = () => (
             I build the pipelines and platforms that move data and run models in production.
           </p>
           <p className="hero__meta">
-            <strong>Staff Data, Analytics &amp; AI Engineer at Swisscom</strong> — based in Bern,
+            <strong>Staff Data, Analytics &amp; AI Engineer at Swisscom</strong>, based in Bern,
             Switzerland, with 8+ years across data engineering, ML infrastructure and DevOps.
           </p>
           <nav className="actions">
@@ -124,9 +124,9 @@ const IndexPage = () => (
         <h2 className="section__label">Profile</h2>
         <div className="prose">
           <p>
-            I work where <strong>software engineering meets operations</strong> — designing ETL/ELT
-            and streaming pipelines, containerising ML inference, and turning monolithic data
-            processes into event-driven, serverless systems.
+            I work where <strong>software engineering meets operations</strong>. I design ETL/ELT and
+            streaming pipelines, containerise ML inference, and turn monolithic data processes into
+            event-driven, serverless systems.
           </p>
           <p>
             Right now I&apos;m at Swisscom in Bern, moving a legacy Teradata and Oracle stack onto
@@ -176,7 +176,7 @@ const IndexPage = () => (
         <h2 className="section__label">Contact</h2>
         <div>
           <p className="contact__intro">
-            Open to interesting problems in data, ML and platform engineering — in Switzerland or
+            Open to interesting problems in data, ML and platform engineering, in Switzerland or
             remote. Email is the fastest way to reach me.
           </p>
           <a className="contact__email" href={`mailto:${EMAIL}`}>