From 1071b068748a265329fb8db8eba01eaaa6a8347d Mon Sep 17 00:00:00 2001
From: Mike Karl <karl.mike2002@gmail.com>
Date: Tue, 28 Oct 2025 20:17:09 +0100
Subject: [PATCH] Update polka background styling in global CSS and adjust
 Section component padding for improved layout and visual consistency.

---
 app/components/section.tsx |  2 +-
 app/globals.css            | 12 ++++++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/app/components/section.tsx b/app/components/section.tsx
index ded7758..aff3821 100644
--- a/app/components/section.tsx
+++ b/app/components/section.tsx
@@ -19,7 +19,7 @@ export default function Section({
 
     const variantClasses = {
         default: "bg-stone-900",
-        hero: "polka lg:pt-40",
+        hero: "polka pt-20 lg:pt-40",
         minimal: "bg-transparent"
     };
 
diff --git a/app/globals.css b/app/globals.css
index 53b0dbd..fa289b6 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -15,12 +15,24 @@ body {
 }
 
 .polka{
+  overflow: hidden;
+}
+
+.polka::before{
+  content: "";
+  position: absolute;
+  width: 10000%;
+  height: 10000%;
+  top: -5000%;
+  left: -5000%;
+  z-index: -1;
   background-image: radial-gradient(#0c0a09 20%, #292524 22%);
   background-size: 80px 80px;
   animation-name: background_keyframes;
   animation-duration: 8s;
   animation-iteration-count: infinite;
   animation-timing-function: linear;
+  transform: rotate(30deg);
 }
 
 @keyframes background_keyframes {