build: recompile CSS (section-title glitch effect)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

1 files changed, 59 insertions, 0 deletions

diff --git a/assets/css/main.min.css b/assets/css/main.min.css
index aef2fbd..3e91368 100644
--- a/assets/css/main.min.css
+++ b/assets/css/main.min.css
@@ -2153,6 +2153,10 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
 
 /* Hero typography with fluid sizing */
 
+.section-title {
+  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
+}
+
 /* ---- Article prev/next navigation ---- */
 
 .article-nav {
@@ -4833,11 +4837,66 @@ html.theme-light .hero-name {
   }
 }
 
+/* Section title glitch effect (article list pages) */
+
+.section-title {
+  font-family: var(--font-head);
+  font-size: clamp(2rem, 6vw, 3rem);
+  font-weight: 800;
+  line-height: 1.1;
+  letter-spacing: -0.03em;
+  color: var(--text);
+  text-transform: uppercase;
+  text-align: center;
+  display: block;
+  position: relative;
+  width: 100%;
+  margin-bottom: 3rem;
+}
+
+.section-title::before,
+.section-title::after {
+  content: attr(data-text);
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  opacity: 0;
+  font-family: inherit;
+  font-size: inherit;
+  font-weight: inherit;
+  line-height: inherit;
+  letter-spacing: inherit;
+}
+
+.section-title::before {
+  color: #ff2b6d;
+}
+
+.section-title::after  {
+  color: #00e5ff;
+}
+
+.section-title.is-glitching::before {
+  opacity: 0.8;
+  animation: glitch-red 0.45s steps(3) forwards;
+}
+
+.section-title.is-glitching::after {
+  opacity: 0.8;
+  animation: glitch-cyn 0.45s steps(3) forwards;
+}
+
 @media (prefers-reduced-motion: reduce) {
   .hero-name::before,
   .hero-name::after {
     display: none;
   }
+
+  .section-title::before,
+  .section-title::after {
+    display: none;
+  }
 }
 
 .hover\:bg-surface:hover {