feat: set up a good looking outline for links

src/components/external-link.astro

@@ -13,7 +13,7 @@ const { cssClass, href, title } = Astro.props;
 <a
   class:list={[
     cssClass,
-    "flex min-w-full items-center justify-center gap-4 rounded px-6 py-2 text-lg sm:px-24",
+    "flex min-w-full items-center justify-center gap-4 rounded px-6 py-2 text-lg outline-offset-2 sm:px-24",
   ]}
   {href}
   {title}

src/pages/skills.astro

@@ -32,7 +32,10 @@ const kcStart = new Date(2026, 0, 1);
   <main class="flex items-center justify-center">
     <article>
       <div class="mb-8 flex items-baseline gap-6">
-        <a href="/" title="Zurück" class="text-soft"
+        <a
+          href="/"
+          title="Zurück"
+          class="text-soft rounded-full outline-offset-2"
           ><BackIcon class="size-9" /></a
         >
         <h1>Skills</h1>