Update content

src/layouts/Layout.astro

@@ -113,23 +113,20 @@ const { title } = Astro.props;
     font-style: italic;
   }
 
-  html {
+  *,
+  *::before,
+  *::after {
+    margin: 0;
     box-sizing: border-box;
   }
 
-  *,
-  *:before,
-  *:after {
-    margin: 0;
-    box-sizing: inherit;
-  }
-
   body {
-    font-size: clamp(1.5rem, 4vw, 2rem);
+    font-size: clamp(1.5rem, 0.91vi + 1.27rem, 2rem);
     font-family: "Ysabeau", sans-serif;
-    line-height: 1.4;
+    line-height: 1.35;
     background-color: var(--gray-1);
     color: var(--gray-12);
+    text-wrap: pretty;
   }
 
   img {
@@ -144,6 +141,7 @@ const { title } = Astro.props;
   h5,
   h6 {
     font: inherit;
+    text-wrap: balance;
   }
 
   ol,
@@ -165,8 +163,12 @@ const { title } = Astro.props;
   .link {
     font-weight: 600;
     padding-bottom: 0em;
-    transition: color 200ms;
+    transition: color 200ms, text-decoration-color 200ms;
-    color: var(--accent-12);
+    color: var(--accent-11);
+    text-decoration: underline;
+    text-decoration-thickness: 1px;
+    text-underline-offset: 0.15em;
+    text-decoration-color: var(--accent-6);
   }
 
   .link[href^="http://"]::after, .link[href^="https://"]::after
@@ -177,10 +179,12 @@ const { title } = Astro.props;
     font-weight: 600;
     position: relative;
     top: -0.5em;
+    text-decoration: none;
   }
 
   .link:hover {
-    color: var(--accent-11);
+    color: var(--accent-12);
+    text-decoration-color: var(--accent-12);
   }
 
   .separator-after::after {
@@ -192,7 +196,7 @@ const { title } = Astro.props;
 
   .container {
     max-width: 1080px;
-    padding: 1.5rem;
+    padding: 4vw;
     margin: 3rem auto;
     word-wrap: break-word;
   }

src/pages/index.astro

@@ -11,34 +11,32 @@ import Layout from "../layouts/Layout.astro";
 
     <section class="space-after">
       <ul class="list">
-        <li>I make web apps that look nice and work well for everyone.</li>
+        <li>I design web apps with emphasis on simplicity, lightness, speed, accessibility and sustainability.</li>
+        <li>I’m one of the founding members of <a class="link" href="https://druit.org/" lang="cs">druit.org</a>, a small tech cooperative based in Prague.</li>
+        <li>I contribute to <a class="link" href="https://nolog.cz" lang="cs">nolog.cz</a>,
+          a collective of people who provides social movements with privacy-focused
+          IT infrastructure.
+        </li>
         <li>I experiment with <a
             class="link"
             href="https://docs.racket-lang.org/pollen/index.html"
             >computational typesetting</a
           > for my school theses.
         </li>
-        <li>I contribute to <a class="link" href="https://nolog.cz">nolog.cz</a>,
-          a collective of people who provides social movements with privacy-focused
-          IT infrastructure.
-        </li>
       </ul>
     </section>
 
     <section class="contact-section">
-      <h2>Contact:</h2>
+      <h2>Links:</h2>
       <ul class="contact-list">
         <li>
-          <a class="link" href='https://witter.cz/@uwundrej"'>Mastodon</a>
+          <a class="link" href="https://bsky.app/profile/nyv.lt">Bluesky</a>
-        </li>
-        <li>
-          <a class="link" href="https://twitter.com/uwundrej">X</a>
         </li>
         <li>
           <a class="link" href="https://github.com/onvlt">GitHub</a>
         </li>
         <li>
-          <a class="link" href="https://git.nolog.cz/uwundrej">git.nolog.cz</a>
+          <a class="link" href="https://git.nolog.cz/onvlt">git.nolog.cz</a>
         </li>
       </ul>
     </section>
@@ -47,7 +45,10 @@ import Layout from "../layouts/Layout.astro";
 
 <style>
   .intro {
+    font-size: 1.25em;
+    line-height: 1.15;
     max-width: 40ch;
+    font-weight: 500;
   }
 
   .intro em {
@@ -60,6 +61,7 @@ import Layout from "../layouts/Layout.astro";
 
   .list li {
     padding-inline-start: var(--bullet-offset);
+    margin-block: 0.25em;
   }
 
   .list li::before {