diff --git a/themes/intotheeast/css/style.css b/themes/intotheeast/css/style.css
index d782128..6e0d9da 100644
--- a/themes/intotheeast/css/style.css
+++ b/themes/intotheeast/css/style.css
@@ -780,6 +780,30 @@ body::after {
     }
 }
 
+.skip-link {
+    position: absolute;
+    left: -10000px;
+    top: auto;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+}
+.skip-link:focus-visible {
+    left: 0;
+    top: 0;
+    width: auto;
+    height: auto;
+    overflow: visible;
+    padding: var(--space-2) var(--space-4);
+    background: var(--color-accent);
+    color: var(--color-accent-on);
+    font-family: var(--font-ui);
+    font-size: var(--text-sm);
+    font-weight: 600;
+    text-decoration: none;
+    z-index: 9999;
+}
+
 :focus-visible {
     outline: 2px solid var(--color-accent);
     outline-offset: 2px;
diff --git a/themes/intotheeast/templates/partials/base.html.twig b/themes/intotheeast/templates/partials/base.html.twig
index 0d5ae1b..72dcd2e 100644
--- a/themes/intotheeast/templates/partials/base.html.twig
+++ b/themes/intotheeast/templates/partials/base.html.twig
@@ -13,6 +13,7 @@
     {{ assets.js()|raw }}
 </head>
 <body class="{% if page.template == 'map' %}map-page{% endif %}{% if page.template == 'home' or page.template == 'trip' %} home-page{% endif %}{% if page.template == 'story' %} template-story{% endif %}">
+    <a class="skip-link" href="#main-content">Skip to main content</a>
     <header class="site-header">
         <a class="site-title" href="{{ base_url_absolute }}">into the east</a>
         {% block nav %}
@@ -22,7 +23,7 @@
         </nav>
         {% endblock %}
     </header>
-    <main class="site-main">
+    <main class="site-main" id="main-content">
         {% block content %}{% endblock %}
     </main>
     {{ assets.js('bottom')|raw }}
