From ce25b8e3eed0eaeceedf7f6f4e2bac80fe3cd4bc Mon Sep 17 00:00:00 2001
From: Sharif <developersharif@yahoo.com>
Date: Sat, 5 Sep 2026 23:22:21 +0600
Subject: [PATCH] Add Artimic to the footer

Artimic is a separate product, not part of this repository, so it does not
belong in the "Project" column next to the source link. Gives it its own
"More from RealBrain" group alongside realbrain.cc, with a one-line
descriptor since the name alone does not say what it is.

Footer goes to four columns at 900px and two at 560px so the extra group
does not crowd the others.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018pRSdR57Ze9M2meDfYZgYE
---
 src/lib/Footer.svelte | 43 +++++++++++++++++++++++++++++++++++--------
 1 file changed, 35 insertions(+), 8 deletions(-)

diff --git a/src/lib/Footer.svelte b/src/lib/Footer.svelte
index 90ddd73..4c8b21c 100644
--- a/src/lib/Footer.svelte
+++ b/src/lib/Footer.svelte
@@ -41,11 +41,6 @@
               Source on GitHub
             </a>
           </li>
-          <li>
-            <a href="https://realbrain.cc/" target="_blank" rel="noopener noreferrer">
-              RealBrain
-            </a>
-          </li>
           <li>
             <a
               href="https://www.buymeacoffee.com/developersharif"
@@ -57,6 +52,23 @@
           </li>
         </ul>
       </nav>
+
+      <nav aria-label="More from RealBrain">
+        <h2>More from RealBrain</h2>
+        <ul>
+          <li>
+            <a href="https://artimic.com/" target="_blank" rel="noopener noreferrer">
+              Artimic
+            </a>
+            <span class="note">AI design editor</span>
+          </li>
+          <li>
+            <a href="https://realbrain.cc/" target="_blank" rel="noopener noreferrer">
+              RealBrain
+            </a>
+          </li>
+        </ul>
+      </nav>
     </div>
 
     <hr class="divider" />
@@ -79,10 +91,16 @@
     margin-bottom: var(--space-6);
   }
 
-  @media (min-width: 768px) {
+  @media (min-width: 560px) {
     .cols {
-      grid-template-columns: 2fr 1fr 1fr;
-      gap: var(--space-7);
+      grid-template-columns: repeat(2, 1fr);
+    }
+  }
+
+  @media (min-width: 900px) {
+    .cols {
+      grid-template-columns: 2fr 1fr 1fr 1fr;
+      gap: var(--space-6);
     }
   }
 
@@ -120,6 +138,15 @@
     text-decoration: none;
   }
 
+  /* Sits under a product link that needs a word of context. */
+  .note {
+    display: block;
+    margin-top: var(--space-1);
+    color: var(--text-3);
+    font-size: var(--fs-1);
+    line-height: var(--lh-1);
+  }
+
   .base {
     display: grid;
     gap: var(--space-3);