diff --git a/art/cloudscape/cloud.png b/art/cloudscape/cloud.png
new file mode 100644
index 0000000..3f7db89
Binary files /dev/null and b/art/cloudscape/cloud.png differ
diff --git a/art/cloudscape/index.html b/art/cloudscape/index.html
new file mode 100644
index 0000000..356a194
--- /dev/null
+++ b/art/cloudscape/index.html
@@ -0,0 +1,155 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
+  <title>Cloudscape</title>
+  <style>
+    *,
+    :before,
+    :after {
+      box-sizing: inherit;
+    }
+
+    html,
+    body {
+      padding: 0;
+      margin: 0;
+      box-sizing: border-box;
+    }
+
+    h1,
+    body {
+      padding: 0;
+      margin: 0;
+    }
+
+    body {
+      background-color: #859cc4;
+      background-image: linear-gradient(to bottom, #4379ef, #859cc4);
+      background-size: 100% 80vh;
+      background-position: top;
+      background-repeat: no-repeat;
+      --cloudyHeaderBottom: max(35vh, 10rem);
+    }
+
+    main {
+      margin: 0 auto;
+      max-width: 80rem;
+    }
+
+    :root {
+      padding: 40vh 1rem 1rem;
+      font-size: 1.2em;
+      font-family: Inter, sans-serif;
+      --scrollLengthPx: 0;
+    }
+
+    .scene {
+      --durationSeconds: 120;
+      --duration: calc(var(--durationSeconds) * 1s);
+      --viewPointDelta: var(--cloudyHeaderBottom);
+      --travelDistance: 200vh;
+      z-index: -2;
+      position: fixed;
+      top: 0;
+      left: 0;
+      right: 0;
+      height: 100lvh;
+      overflow: hidden;
+      perspective: calc(0.25 * var(--cloudyHeaderBottom) + 0.75 * 35vmax);
+      perspective-origin: 50vw 80vh;
+    }
+
+    .sky {
+      transform-style: preserve-3d;
+      -webkit-backface-visibility: hidden;
+      backface-visibility: hidden;
+      --duration: 240s;
+    }
+
+    .cloud {
+      --height: 90vh;
+      pointer-events: none;
+      position: absolute;
+      left: -205vw;
+      right: -205vw;
+      top: calc(8vh - var(--viewPointDelta));
+      height: var(--height);
+      background-image: url("cloud.png");
+      background-size: auto 100%;
+      background-repeat: repeat-x;
+      background-position: calc(50% + cos(230 * var(--n)) * var(--height)) 50%;
+      animation-name: zoom;
+      animation-duration: var(--duration);
+      animation-timing-function: linear;
+      animation-delay: calc(-0.1 * var(--duration) * var(--n));
+      animation-iteration-count: infinite;
+      -webkit-backface-visibility: hidden;
+      backface-visibility: hidden;
+    }
+
+    /*
+    #brand {
+      position: absolute;
+      left: 1rem;
+      right: 1rem;
+      bottom: calc(-35vh + var(--viewPointDelta));
+      font-family: Inter, sans-serif;
+      font-weight: bold;
+      text-align: center;
+      font-size: min(8vmax, 15vw, 7.7rem);
+    } */
+
+    @keyframes zoom {
+      0% {
+        opacity: 0;
+        transform: translate3d(
+          0,
+          calc(4 * var(--viewPointDelta)),
+          calc(-1 * var(--travelDistance))
+        );
+      }
+
+      20% {
+        opacity: 1;
+      }
+
+      90% {
+        opacity: 1;
+      }
+
+      100% {
+        opacity: 0;
+        transform: translate3d(
+          0,
+          calc(-1 * var(--viewPointDelta) + calc(var(--cloudyHeaderBottom) - 35vh)),
+          calc(0.33333 * var(--travelDistance))
+        );
+      }
+    }
+  </style>
+</head>
+
+<body>
+  <div class="scene">
+    <div class="sky">
+      <div class="cloud" will-change style="--n: 0"></div>
+      <div class="cloud" will-change style="--n: 1"></div>
+      <div class="cloud" will-change style="--n: 2"></div>
+      <div class="cloud" will-change style="--n: 3"></div>
+      <div class="cloud" will-change style="--n: 4"></div>
+      <div class="cloud" will-change style="--n: 5"></div>
+      <div class="cloud" will-change style="--n: 6"></div>
+      <div class="cloud" will-change style="--n: 7"></div>
+      <div class="cloud" will-change style="--n: 8"></div>
+      <div class="cloud" will-change style="--n: 9"></div>
+    </div>
+  </div>
+  <main>
+
+  </main>
+</body>
+
+</html>
diff --git a/sitemap.xml b/sitemap.xml
index 83df0e1..86e09b3 100644
--- a/sitemap.xml
+++ b/sitemap.xml
@@ -263,7 +263,7 @@
     
       <url>
         <loc>/feed.xml</loc>
-        <lastmod>2025-06-27T04:07:03.115Z</lastmod>
+        <lastmod>2025-06-27T16:39:00.460Z</lastmod>
       </url>
     
   
