diff --git a/assets/css/about-hero.css b/assets/css/about-hero.css
index 2554966..793b697 100644
--- a/assets/css/about-hero.css
+++ b/assets/css/about-hero.css
@@ -6,6 +6,80 @@
   position: relative;
 }
 
+body.intro-about {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+body.intro-about::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
+}
+
+html:has(body.intro-about) {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+html:has(body.intro-about)::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
+}
+
+body.intro-about .site-header,
+body.intro-about .site-footer {
+  display: none !important;
+}
+
+body.intro-about .hero-section {
+  min-height: 100vh;
+}
+
+body.intro-about .about-theme-toggle {
+  position: fixed;
+  top: 18px;
+  right: 18px;
+  z-index: 40;
+  width: 72px;
+  height: 72px;
+  background: transparent !important;
+  border: none !important;
+  border-radius: 0;
+  color: color-mix(in srgb, var(--text-primary) 82%, var(--color-primary) 18%);
+  box-shadow: none;
+  backdrop-filter: none;
+  -webkit-backdrop-filter: none;
+}
+
+body.intro-about .about-theme-toggle::before {
+  display: none;
+  content: none;
+}
+
+body.intro-about .about-theme-toggle svg {
+  width: 60px;
+  height: 60px;
+}
+
+body.intro-about .about-theme-toggle:hover,
+body.intro-about .about-theme-toggle:focus-visible {
+  background: transparent !important;
+  border: none !important;
+  color: color-mix(in srgb, var(--text-primary) 72%, var(--color-primary) 28%);
+  box-shadow: none;
+}
+
+body.intro-about .about-theme-toggle:hover {
+  transform: translateY(-1px);
+}
+
+body.intro-about .about-theme-toggle:hover::before,
+body.intro-about .about-theme-toggle:focus-visible::before {
+  display: none;
+}
+
 .hero-section {
   padding: 40px 0;
   background-color: var(--bg-body);
@@ -131,7 +205,10 @@ html:not([data-theme="dark"]) .hero-waves {
 
 .hero-title {
   display: flex;
+  flex-direction: column;
+  align-items: center;
   justify-content: center;
+  gap: clamp(2px, 0.6vw, 10px);
   margin: 0 0 1.2rem;
   overflow: visible;
   --hero-title-gradient: linear-gradient(135deg, var(--text-primary) 0%, var(--color-primary) 100%);
@@ -442,6 +519,11 @@ html:not([data-theme="dark"]) .hero-title-svg::before {
 }
 
 @media (max-width: 768px) {
+  body.intro-about .about-theme-toggle {
+    top: 12px;
+    right: 12px;
+  }
+
   .hero-title {
     margin-bottom: 1rem;
   }
diff --git a/assets/js/hero-waves.js b/assets/js/hero-waves.js
index 83e37af..a2f53d4 100644
--- a/assets/js/hero-waves.js
+++ b/assets/js/hero-waves.js
@@ -15,15 +15,15 @@
   let rafId = null;
 
   const waveDefs = [
-    { yRatio: 0.3, amplitude: 22, wavelength: 940, speed: 0.5, alpha: 0.98 },
-    { yRatio: 0.45, amplitude: 16, wavelength: 1020, speed: 0.58, alpha: 0.92 },
-    { yRatio: 0.65, amplitude: 14, wavelength: 1160, speed: 0.6, alpha: 0.9 },
+    { yRatio: 0.3, amplitude: 24, wavelength: 940, speed: 0.5, alpha: 0.98 },
+    { yRatio: 0.45, amplitude: 14, wavelength: 1020, speed: 0.58, alpha: 0.92 },
+    { yRatio: 0.65, amplitude: 10, wavelength: 1160, speed: 0.6, alpha: 0.9 },
   ];
 
   const palettes = {
     light: {
-      gradient: ['#e8f3ff', '#cfe6fb', '#558ec1', '#2476af', '#2b6fb3'],
-      waves: ['rgba(170, 215, 245, 0.91)', 'rgba(120, 185, 230, 0.93)', 'rgba(80, 155, 210, 0.95)'],
+      gradient: ['#d6e8fa', '#a7c8e8', '#6f9fc8', '#4f84b6', '#376e9f'],
+      waves: ['rgba(124, 167, 205, 0.96)', 'rgba(90, 143, 190, 0.97)', 'rgba(62, 118, 169, 0.98)'],
     },
     dark: {
       gradient: ['#0d1117', '#111d2b', '#14334d', '#17507a', '#1b6aa6'],
diff --git a/assets/js/home-hero.js b/assets/js/home-hero.js
index 71ed5d2..aa26089 100644
--- a/assets/js/home-hero.js
+++ b/assets/js/home-hero.js
@@ -3,38 +3,189 @@
   if (!hero) return;
 
   const body = document.body;
-  const desktopQuery = window.matchMedia('(min-width: 900px)');
-  let hasScrolled = false;
+  const header = document.querySelector('.site-header');
+  const titleSvg = hero.querySelector('.hero-title-svg');
+  const scrollIndicator = hero.querySelector('.hero-scroll-indicator');
+  const scrollArrow = scrollIndicator ? scrollIndicator.querySelector('.scroll-arrow') : null;
+  const scrollText = scrollIndicator ? scrollIndicator.querySelector('.scroll-text') : null;
 
-  const applyState = () => {
+  const desktopQuery = window.matchMedia('(min-width: 900px)');
+  const reducedMotionQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
+  const anime = window.anime;
+  const hasAnime = typeof anime === 'function';
+
+  let arrowPulse = null;
+  let didIntro = false;
+  let ticking = false;
+
+  const stopArrowPulse = () => {
+    if (!arrowPulse) return;
+    arrowPulse.pause();
+    arrowPulse = null;
+  };
+
+  const startArrowPulse = () => {
+    if (!hasAnime || reducedMotionQuery.matches || !scrollArrow) return;
+    stopArrowPulse();
+    scrollArrow.style.animation = 'none';
+    anime.remove(scrollArrow);
+    anime.set(scrollArrow, {
+      translateY: 0,
+      opacity: 0.5,
+      rotate: 45,
+    });
+    arrowPulse = anime({
+      targets: scrollArrow,
+      translateY: [0, 6, 0],
+      opacity: [0.5, 1, 0.5],
+      rotate: 45,
+      duration: 1600,
+      easing: 'easeInOutSine',
+      loop: true,
+    });
+  };
+
+  const clearInlineState = () => {
+    if (header) {
+      header.style.transform = '';
+    }
+    if (scrollIndicator) {
+      scrollIndicator.style.opacity = '';
+      scrollIndicator.style.transform = '';
+    }
+  };
+
+  const animateScrollState = (isAtTop) => {
+    if (!hasAnime || reducedMotionQuery.matches) return;
+
+    if (header) {
+      anime.remove(header);
+      anime({
+        targets: header,
+        translateY: isAtTop ? '-100%' : '0%',
+        duration: isAtTop ? 500 : 380,
+        easing: isAtTop ? 'easeInOutCubic' : 'easeOutCubic',
+      });
+    }
+
+    if (scrollIndicator) {
+      anime.remove(scrollIndicator);
+      anime({
+        targets: scrollIndicator,
+        opacity: isAtTop ? 1 : 0,
+        duration: isAtTop ? 380 : 260,
+        easing: isAtTop ? 'easeOutCubic' : 'easeOutQuad',
+      });
+    }
+  };
+
+  const applyState = (animated) => {
     if (!desktopQuery.matches) {
       body.classList.remove('home-hero-initial', 'home-hero-scrolled');
+      stopArrowPulse();
+      clearInlineState();
       return;
     }
 
-    if (hasScrolled || window.scrollY > 6) {
-      body.classList.remove('home-hero-initial');
-      body.classList.add('home-hero-scrolled');
-    } else {
-      body.classList.add('home-hero-initial');
-      body.classList.remove('home-hero-scrolled');
+    const isAtTop = window.scrollY <= 6;
+    body.classList.toggle('home-hero-initial', isAtTop);
+    body.classList.toggle('home-hero-scrolled', !isAtTop);
+
+    if (animated) {
+      animateScrollState(isAtTop);
+    } else if (hasAnime) {
+      if (header) {
+        anime.remove(header);
+      }
+      if (scrollIndicator) {
+        anime.remove(scrollIndicator);
+      }
     }
+
+    if (isAtTop) {
+      startArrowPulse();
+    } else {
+      stopArrowPulse();
+    }
+  };
+
+  const playIntro = () => {
+    if (didIntro || !hasAnime || reducedMotionQuery.matches || !desktopQuery.matches || window.scrollY > 6) {
+      return;
+    }
+
+    didIntro = true;
+    if (titleSvg) {
+      anime.set(titleSvg, { opacity: 0, translateY: 14, scale: 1.01 });
+    }
+    if (scrollArrow) {
+      anime.set(scrollArrow, { opacity: 0, translateY: 8, rotate: 45 });
+    }
+    if (scrollText) {
+      anime.set(scrollText, { opacity: 0, translateY: 8 });
+    }
+
+    const timeline = anime.timeline({
+      easing: 'easeOutCubic',
+    });
+
+    if (titleSvg) {
+      timeline.add({
+        targets: titleSvg,
+        opacity: 1,
+        translateY: -8,
+        scale: 1.06,
+        duration: 860,
+        easing: 'easeOutExpo',
+      });
+    }
+
+    if (scrollArrow || scrollText) {
+      timeline.add({
+        targets: [scrollArrow, scrollText].filter(Boolean),
+        opacity: (el) => (el === scrollArrow ? [0, 1] : [0, 1]),
+        translateY: 0,
+        rotate: (el) => (el === scrollArrow ? 45 : 0),
+        duration: 420,
+        delay: anime.stagger(80),
+      }, '-=300');
+    }
+
+    timeline.finished.then(() => {
+      startArrowPulse();
+    });
   };
 
   const onScroll = () => {
-    hasScrolled = window.scrollY > 6;
-    applyState();
+    if (ticking) return;
+    ticking = true;
+    window.requestAnimationFrame(() => {
+      applyState(true);
+      ticking = false;
+    });
   };
 
   const onResize = () => {
-    if (!desktopQuery.matches) {
-      hasScrolled = false;
-    }
-    applyState();
+    applyState(false);
   };
 
-  applyState();
+  const onReducedMotionChange = () => {
+    if (reducedMotionQuery.matches) {
+      stopArrowPulse();
+      if (scrollArrow) {
+        scrollArrow.style.animation = 'none';
+      }
+    } else if (window.scrollY <= 6 && desktopQuery.matches) {
+      startArrowPulse();
+    }
+    applyState(false);
+  };
+
+  applyState(false);
+  playIntro();
+
   window.addEventListener('scroll', onScroll, { passive: true });
   window.addEventListener('resize', onResize);
   desktopQuery.addEventListener('change', onResize);
+  reducedMotionQuery.addEventListener('change', onReducedMotionChange);
 })();
diff --git a/assets/js/theme-toggle.js b/assets/js/theme-toggle.js
index 136e11a..2400328 100644
--- a/assets/js/theme-toggle.js
+++ b/assets/js/theme-toggle.js
@@ -1,5 +1,30 @@
-const themeToggle = document.querySelector('.theme-toggle');
+const themeToggles = document.querySelectorAll('.theme-toggle');
 const html = document.documentElement;
+const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');
+const supportsViewTransition = typeof document.startViewTransition === 'function';
+const viewTransitionStyleId = 'itstudio-view-transition-style';
+let isThemeTransitioning = false;
+
+function ensureViewTransitionStyles() {
+  if (!supportsViewTransition || document.getElementById(viewTransitionStyleId)) {
+    return;
+  }
+
+  const style = document.createElement('style');
+  style.id = viewTransitionStyleId;
+  style.textContent = `
+    ::view-transition-old(root),
+    ::view-transition-new(root) {
+      animation: none;
+      mix-blend-mode: normal;
+    }
+
+    ::view-transition-group(root) {
+      animation: none;
+    }
+  `;
+  document.head.appendChild(style);
+}
 
 function updateLogoColor(theme) {
   const logoText = document.querySelector('#logo-text-cn');
@@ -21,19 +46,95 @@ function getPreferredTheme() {
 function setTheme(theme) {
   html.setAttribute('data-theme', theme);
   localStorage.setItem('theme', theme);
+  themeToggles.forEach((toggle) => {
+    toggle.setAttribute('aria-pressed', theme === 'dark' ? 'true' : 'false');
+  });
   updateLogoColor(theme);
 }
 
 const initialTheme = getPreferredTheme();
 setTheme(initialTheme);
+ensureViewTransitionStyles();
 
-if (themeToggle) {
-  themeToggle.addEventListener('click', () => {
+function getToggleCenter(toggle) {
+  if (!toggle) {
+    return {
+      x: window.innerWidth / 2,
+      y: window.innerHeight / 2,
+    };
+  }
+
+  const rect = toggle.getBoundingClientRect();
+  return {
+    x: rect.left + rect.width / 2,
+    y: rect.top + rect.height / 2,
+  };
+}
+
+function getTransitionOrigin(event, toggle) {
+  const hasPointerPoint = Number.isFinite(event.clientX) && Number.isFinite(event.clientY) && (event.clientX !== 0 || event.clientY !== 0);
+  if (hasPointerPoint) {
+    return {
+      x: event.clientX,
+      y: event.clientY,
+    };
+  }
+
+  return getToggleCenter(toggle);
+}
+
+function getRevealRadius(x, y) {
+  const maxX = Math.max(x, window.innerWidth - x);
+  const maxY = Math.max(y, window.innerHeight - y);
+  return Math.hypot(maxX, maxY);
+}
+
+function switchThemeWithScatter(theme, origin) {
+  if (isThemeTransitioning || prefersReducedMotion.matches || !supportsViewTransition) {
+    setTheme(theme);
+    return;
+  }
+
+  isThemeTransitioning = true;
+  const x = origin.x;
+  const y = origin.y;
+  const endRadius = getRevealRadius(x, y);
+  const clipFrom = `circle(0px at ${x}px ${y}px)`;
+  const clipTo = `circle(${endRadius}px at ${x}px ${y}px)`;
+
+  const transition = document.startViewTransition(() => {
+    setTheme(theme);
+  });
+
+  transition.ready
+    .then(() => {
+      document.documentElement.animate(
+        {
+          clipPath: [clipFrom, clipTo],
+        },
+        {
+          duration: 650,
+          easing: 'cubic-bezier(0.22, 1, 0.36, 1)',
+          pseudoElement: '::view-transition-new(root)',
+        }
+      );
+    })
+    .catch(() => {})
+    .finally(() => {
+      transition.finished.finally(() => {
+        isThemeTransitioning = false;
+      });
+    });
+}
+
+themeToggles.forEach((themeToggle) => {
+  themeToggle.addEventListener('click', (event) => {
     const currentTheme = html.getAttribute('data-theme');
     const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
-    setTheme(newTheme);
+    const origin = getTransitionOrigin(event, themeToggle);
+    switchThemeWithScatter(newTheme, origin);
   });
-}
+});
 
 window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
   if (!localStorage.getItem('theme')) {
diff --git a/assets/js/vendor/anime.min.js b/assets/js/vendor/anime.min.js
new file mode 100644
index 0000000..ed9da8a
--- /dev/null
+++ b/assets/js/vendor/anime.min.js
@@ -0,0 +1,8 @@
+/*
+ * anime.js v3.2.2
+ * (c) 2023 Julian Garnier
+ * Released under the MIT license
+ * animejs.com
+ */
+
+!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):n.anime=e()}(this,function(){"use strict";var i={update:null,begin:null,loopBegin:null,changeBegin:null,change:null,changeComplete:null,loopComplete:null,complete:null,loop:1,direction:"normal",autoplay:!0,timelineOffset:0},M={duration:1e3,delay:0,endDelay:0,easing:"easeOutElastic(1, .5)",round:0},j=["translateX","translateY","translateZ","rotate","rotateX","rotateY","rotateZ","scale","scaleX","scaleY","scaleZ","skew","skewX","skewY","perspective","matrix","matrix3d"],l={CSS:{},springs:{}};function C(n,e,t){return Math.min(Math.max(n,e),t)}function u(n,e){return-1<n.indexOf(e)}function o(n,e){return n.apply(null,e)}var w={arr:function(n){return Array.isArray(n)},obj:function(n){return u(Object.prototype.toString.call(n),"Object")},pth:function(n){return w.obj(n)&&n.hasOwnProperty("totalLength")},svg:function(n){return n instanceof SVGElement},inp:function(n){return n instanceof HTMLInputElement},dom:function(n){return n.nodeType||w.svg(n)},str:function(n){return"string"==typeof n},fnc:function(n){return"function"==typeof n},und:function(n){return void 0===n},nil:function(n){return w.und(n)||null===n},hex:function(n){return/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(n)},rgb:function(n){return/^rgb/.test(n)},hsl:function(n){return/^hsl/.test(n)},col:function(n){return w.hex(n)||w.rgb(n)||w.hsl(n)},key:function(n){return!i.hasOwnProperty(n)&&!M.hasOwnProperty(n)&&"targets"!==n&&"keyframes"!==n}};function d(n){n=/\(([^)]+)\)/.exec(n);return n?n[1].split(",").map(function(n){return parseFloat(n)}):[]}function c(r,t){var n=d(r),e=C(w.und(n[0])?1:n[0],.1,100),a=C(w.und(n[1])?100:n[1],.1,100),o=C(w.und(n[2])?10:n[2],.1,100),n=C(w.und(n[3])?0:n[3],.1,100),u=Math.sqrt(a/e),i=o/(2*Math.sqrt(a*e)),c=i<1?u*Math.sqrt(1-i*i):0,s=i<1?(i*u-n)/c:-n+u;function f(n){var e=t?t*n/1e3:n,e=i<1?Math.exp(-e*i*u)*(+Math.cos(c*e)+s*Math.sin(c*e)):(1+s*e)*Math.exp(-e*u);return 0===n||1===n?n:1-e}return t?f:function(){var n=l.springs[r];if(n)return n;for(var e=0,t=0;;)if(1===f(e+=1/6)){if(16<=++t)break}else t=0;return n=e*(1/6)*1e3,l.springs[r]=n}}function q(e){return void 0===e&&(e=10),function(n){return Math.ceil(C(n,1e-6,1)*e)*(1/e)}}var H=function(b,e,M,t){if(0<=b&&b<=1&&0<=M&&M<=1){var x=new Float32Array(11);if(b!==e||M!==t)for(var n=0;n<11;++n)x[n]=k(.1*n,b,M);return function(n){return b===e&&M===t||0===n||1===n?n:k(r(n),e,t)}}function r(n){for(var e=0,t=1;10!==t&&x[t]<=n;++t)e+=.1;var r=e+.1*((n-x[--t])/(x[t+1]-x[t])),a=O(r,b,M);if(.001<=a){for(var o=n,u=r,i=b,c=M,s=0;s<4;++s){var f=O(u,i,c);if(0===f)return u;u-=(k(u,i,c)-o)/f}return u}if(0===a)return r;for(var l,d,p=n,h=e,g=e+.1,m=b,v=M,y=0;0<(l=k(d=h+(g-h)/2,m,v)-p)?g=d:h=d,1e-7<Math.abs(l)&&++y<10;);return d}};function r(n,e){return 1-3*e+3*n}function k(n,e,t){return((r(e,t)*n+(3*t-6*e))*n+3*e)*n}function O(n,e,t){return 3*r(e,t)*n*n+2*(3*t-6*e)*n+3*e}e={linear:function(){return function(n){return n}}},t={Sine:function(){return function(n){return 1-Math.cos(n*Math.PI/2)}},Expo:function(){return function(n){return n?Math.pow(2,10*n-10):0}},Circ:function(){return function(n){return 1-Math.sqrt(1-n*n)}},Back:function(){return function(n){return n*n*(3*n-2)}},Bounce:function(){return function(n){for(var e,t=4;n<((e=Math.pow(2,--t))-1)/11;);return 1/Math.pow(4,3-t)-7.5625*Math.pow((3*e-2)/22-n,2)}},Elastic:function(n,e){void 0===e&&(e=.5);var t=C(n=void 0===n?1:n,1,10),r=C(e,.1,2);return function(n){return 0===n||1===n?n:-t*Math.pow(2,10*(n-1))*Math.sin((n-1-r/(2*Math.PI)*Math.asin(1/t))*(2*Math.PI)/r)}}},["Quad","Cubic","Quart","Quint"].forEach(function(n,e){t[n]=function(){return function(n){return Math.pow(n,e+2)}}}),Object.keys(t).forEach(function(n){var r=t[n];e["easeIn"+n]=r,e["easeOut"+n]=function(e,t){return function(n){return 1-r(e,t)(1-n)}},e["easeInOut"+n]=function(e,t){return function(n){return n<.5?r(e,t)(2*n)/2:1-r(e,t)(-2*n+2)/2}},e["easeOutIn"+n]=function(e,t){return function(n){return n<.5?(1-r(e,t)(1-2*n))/2:(r(e,t)(2*n-1)+1)/2}}});var e,t,s=e;function P(n,e){if(w.fnc(n))return n;var t=n.split("(")[0],r=s[t],a=d(n);switch(t){case"spring":return c(n,e);case"cubicBezier":return o(H,a);case"steps":return o(q,a);default:return o(r,a)}}function a(n){try{return document.querySelectorAll(n)}catch(n){}}function I(n,e){for(var t,r=n.length,a=2<=arguments.length?e:void 0,o=[],u=0;u<r;u++)u in n&&(t=n[u],e.call(a,t,u,n))&&o.push(t);return o}function f(n){return n.reduce(function(n,e){return n.concat(w.arr(e)?f(e):e)},[])}function p(n){return w.arr(n)?n:(n=w.str(n)?a(n)||n:n)instanceof NodeList||n instanceof HTMLCollection?[].slice.call(n):[n]}function h(n,e){return n.some(function(n){return n===e})}function g(n){var e,t={};for(e in n)t[e]=n[e];return t}function x(n,e){var t,r=g(n);for(t in n)r[t]=(e.hasOwnProperty(t)?e:n)[t];return r}function D(n,e){var t,r=g(n);for(t in e)r[t]=(w.und(n[t])?e:n)[t];return r}function V(n){var e,t,r,a,o,u,i;return w.rgb(n)?(e=/rgb\((\d+,\s*[\d]+,\s*[\d]+)\)/g.exec(t=n))?"rgba("+e[1]+",1)":t:w.hex(n)?(e=(e=n).replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(n,e,t,r){return e+e+t+t+r+r}),e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e),"rgba("+parseInt(e[1],16)+","+parseInt(e[2],16)+","+parseInt(e[3],16)+",1)"):w.hsl(n)?(t=/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(t=n)||/hsla\((\d+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)/g.exec(t),n=parseInt(t[1],10)/360,u=parseInt(t[2],10)/100,i=parseInt(t[3],10)/100,t=t[4]||1,0==u?r=a=o=i:(r=c(u=2*i-(i=i<.5?i*(1+u):i+u-i*u),i,n+1/3),a=c(u,i,n),o=c(u,i,n-1/3)),"rgba("+255*r+","+255*a+","+255*o+","+t+")"):void 0;function c(n,e,t){return t<0&&(t+=1),1<t&&--t,t<1/6?n+6*(e-n)*t:t<.5?e:t<2/3?n+(e-n)*(2/3-t)*6:n}}function B(n){n=/[+-]?\d*\.?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?(%|px|pt|em|rem|in|cm|mm|ex|ch|pc|vw|vh|vmin|vmax|deg|rad|turn)?$/.exec(n);if(n)return n[1]}function m(n,e){return w.fnc(n)?n(e.target,e.id,e.total):n}function v(n,e){return n.getAttribute(e)}function y(n,e,t){var r,a,o;return h([t,"deg","rad","turn"],B(e))?e:(r=l.CSS[e+t],w.und(r)?(a=document.createElement(n.tagName),(n=n.parentNode&&n.parentNode!==document?n.parentNode:document.body).appendChild(a),a.style.position="absolute",a.style.width=100+t,o=100/a.offsetWidth,n.removeChild(a),n=o*parseFloat(e),l.CSS[e+t]=n):r)}function $(n,e,t){var r;if(e in n.style)return r=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),e=n.style[e]||getComputedStyle(n).getPropertyValue(r)||"0",t?y(n,e,t):e}function b(n,e){return w.dom(n)&&!w.inp(n)&&(!w.nil(v(n,e))||w.svg(n)&&n[e])?"attribute":w.dom(n)&&h(j,e)?"transform":w.dom(n)&&"transform"!==e&&$(n,e)?"css":null!=n[e]?"object":void 0}function W(n){if(w.dom(n)){for(var e,t=n.style.transform||"",r=/(\w+)\(([^)]*)\)/g,a=new Map;e=r.exec(t);)a.set(e[1],e[2]);return a}}function X(n,e,t,r){var a=u(e,"scale")?1:0+(u(a=e,"translate")||"perspective"===a?"px":u(a,"rotate")||u(a,"skew")?"deg":void 0),o=W(n).get(e)||a;return t&&(t.transforms.list.set(e,o),t.transforms.last=e),r?y(n,o,r):o}function T(n,e,t,r){switch(b(n,e)){case"transform":return X(n,e,r,t);case"css":return $(n,e,t);case"attribute":return v(n,e);default:return n[e]||0}}function E(n,e){var t=/^(\*=|\+=|-=)/.exec(n);if(!t)return n;var r=B(n)||0,a=parseFloat(e),o=parseFloat(n.replace(t[0],""));switch(t[0][0]){case"+":return a+o+r;case"-":return a-o+r;case"*":return a*o+r}}function Y(n,e){var t;return w.col(n)?V(n):/\s/g.test(n)?n:(t=(t=B(n))?n.substr(0,n.length-t.length):n,e?t+e:t)}function F(n,e){return Math.sqrt(Math.pow(e.x-n.x,2)+Math.pow(e.y-n.y,2))}function Z(n){for(var e,t=n.points,r=0,a=0;a<t.numberOfItems;a++){var o=t.getItem(a);0<a&&(r+=F(e,o)),e=o}return r}function G(n){if(n.getTotalLength)return n.getTotalLength();switch(n.tagName.toLowerCase()){case"circle":return 2*Math.PI*v(n,"r");case"rect":return 2*v(t=n,"width")+2*v(t,"height");case"line":return F({x:v(t=n,"x1"),y:v(t,"y1")},{x:v(t,"x2"),y:v(t,"y2")});case"polyline":return Z(n);case"polygon":return e=n.points,Z(n)+F(e.getItem(e.numberOfItems-1),e.getItem(0))}var e,t}function Q(n,e){var e=e||{},n=e.el||function(n){for(var e=n.parentNode;w.svg(e)&&w.svg(e.parentNode);)e=e.parentNode;return e}(n),t=n.getBoundingClientRect(),r=v(n,"viewBox"),a=t.width,t=t.height,e=e.viewBox||(r?r.split(" "):[0,0,a,t]);return{el:n,viewBox:e,x:+e[0],y:+e[1],w:a,h:t,vW:e[2],vH:e[3]}}function z(n,e){var t=/[+-]?\d*\.?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?/g,r=Y(w.pth(n)?n.totalLength:n,e)+"";return{original:r,numbers:r.match(t)?r.match(t).map(Number):[0],strings:w.str(n)||e?r.split(t):[]}}function A(n){return I(n?f(w.arr(n)?n.map(p):p(n)):[],function(n,e,t){return t.indexOf(n)===e})}function _(n){var t=A(n);return t.map(function(n,e){return{target:n,id:e,total:t.length,transforms:{list:W(n)}}})}function R(e){for(var t=I(f(e.map(function(n){return Object.keys(n)})),function(n){return w.key(n)}).reduce(function(n,e){return n.indexOf(e)<0&&n.push(e),n},[]),a={},n=0;n<t.length;n++)!function(n){var r=t[n];a[r]=e.map(function(n){var e,t={};for(e in n)w.key(e)?e==r&&(t.value=n[e]):t[e]=n[e];return t})}(n);return a}function J(n,e){var t,r=[],a=e.keyframes;for(t in e=a?D(R(a),e):e)w.key(t)&&r.push({name:t,tweens:function(n,t){var e,r=g(t),a=(/^spring/.test(r.easing)&&(r.duration=c(r.easing)),w.arr(n)&&(2===(e=n.length)&&!w.obj(n[0])?n={value:n}:w.fnc(t.duration)||(r.duration=t.duration/e)),w.arr(n)?n:[n]);return a.map(function(n,e){n=w.obj(n)&&!w.pth(n)?n:{value:n};return w.und(n.delay)&&(n.delay=e?0:t.delay),w.und(n.endDelay)&&(n.endDelay=e===a.length-1?t.endDelay:0),n}).map(function(n){return D(n,r)})}(e[t],n)});return r}function K(i,c){var s;return i.tweens.map(function(n){var n=function(n,e){var t,r={};for(t in n){var a=m(n[t],e);w.arr(a)&&1===(a=a.map(function(n){return m(n,e)})).length&&(a=a[0]),r[t]=a}return r.duration=parseFloat(r.duration),r.delay=parseFloat(r.delay),r}(n,c),e=n.value,t=w.arr(e)?e[1]:e,r=B(t),a=T(c.target,i.name,r,c),o=s?s.to.original:a,u=w.arr(e)?e[0]:o,a=B(u)||B(a),r=r||a;return w.und(t)&&(t=o),n.from=z(u,r),n.to=z(E(t,u),r),n.start=s?s.end:0,n.end=n.start+n.delay+n.duration+n.endDelay,n.easing=P(n.easing,n.duration),n.isPath=w.pth(e),n.isPathTargetInsideSVG=n.isPath&&w.svg(c.target),n.isColor=w.col(n.from.original),n.isColor&&(n.round=1),s=n})}var U={css:function(n,e,t){return n.style[e]=t},attribute:function(n,e,t){return n.setAttribute(e,t)},object:function(n,e,t){return n[e]=t},transform:function(n,e,t,r,a){var o;r.list.set(e,t),e!==r.last&&!a||(o="",r.list.forEach(function(n,e){o+=e+"("+n+") "}),n.style.transform=o)}};function nn(n,u){_(n).forEach(function(n){for(var e in u){var t=m(u[e],n),r=n.target,a=B(t),o=T(r,e,a,n),t=E(Y(t,a||B(o)),o),a=b(r,e);U[a](r,e,t,n.transforms,!0)}})}function en(n,e){return I(f(n.map(function(o){return e.map(function(n){var e,t,r=o,a=b(r.target,n.name);if(a)return t=(e=K(n,r))[e.length-1],{type:a,property:n.name,animatable:r,tweens:e,duration:t.end,delay:e[0].delay,endDelay:t.endDelay}})})),function(n){return!w.und(n)})}function tn(n,e){function t(n){return n.timelineOffset||0}var r=n.length,a={};return a.duration=r?Math.max.apply(Math,n.map(function(n){return t(n)+n.duration})):e.duration,a.delay=r?Math.min.apply(Math,n.map(function(n){return t(n)+n.delay})):e.delay,a.endDelay=r?a.duration-Math.max.apply(Math,n.map(function(n){return t(n)+n.duration-n.endDelay})):e.endDelay,a}var rn=0;var N,S=[],an=("undefined"!=typeof document&&document.addEventListener("visibilitychange",function(){L.suspendWhenDocumentHidden&&(n()?N=cancelAnimationFrame(N):(S.forEach(function(n){return n._onDocumentVisibility()}),an()))}),function(){!(N||n()&&L.suspendWhenDocumentHidden)&&0<S.length&&(N=requestAnimationFrame(on))});function on(n){for(var e=S.length,t=0;t<e;){var r=S[t];r.paused?(S.splice(t,1),e--):(r.tick(n),t++)}N=0<t?requestAnimationFrame(on):void 0}function n(){return document&&document.hidden}function L(n){var c,s=0,f=0,l=0,d=0,p=null;function h(n){var e=window.Promise&&new Promise(function(n){return p=n});return n.finished=e}e=x(i,n=n=void 0===n?{}:n),t=J(r=x(M,n),n),n=_(n.targets),r=tn(t=en(n,t),r),a=rn,rn++;var e,t,r,a,k=D(e,{id:a,children:[],animatables:n,animations:t,duration:r.duration,delay:r.delay,endDelay:r.endDelay});h(k);function g(){var n=k.direction;"alternate"!==n&&(k.direction="normal"!==n?"normal":"reverse"),k.reversed=!k.reversed,c.forEach(function(n){return n.reversed=k.reversed})}function m(n){return k.reversed?k.duration-n:n}function o(){s=0,f=m(k.currentTime)*(1/L.speed)}function v(n,e){e&&e.seek(n-e.timelineOffset)}function y(e){for(var n=0,t=k.animations,r=t.length;n<r;){for(var a=t[n],o=a.animatable,u=a.tweens,i=u.length-1,c=u[i],i=(i&&(c=I(u,function(n){return e<n.end})[0]||c),C(e-c.start-c.delay,0,c.duration)/c.duration),s=isNaN(i)?1:c.easing(i),f=c.to.strings,l=c.round,d=[],p=c.to.numbers.length,h=void 0,g=0;g<p;g++){var m=void 0,v=c.to.numbers[g],y=c.from.numbers[g]||0,m=c.isPath?function(e,t,n){function r(n){return e.el.getPointAtLength(1<=t+(n=void 0===n?0:n)?t+n:0)}var a=Q(e.el,e.svg),o=r(),u=r(-1),i=r(1),c=n?1:a.w/a.vW,s=n?1:a.h/a.vH;switch(e.property){case"x":return(o.x-a.x)*c;case"y":return(o.y-a.y)*s;case"angle":return 180*Math.atan2(i.y-u.y,i.x-u.x)/Math.PI}}(c.value,s*v,c.isPathTargetInsideSVG):y+s*(v-y);!l||c.isColor&&2<g||(m=Math.round(m*l)/l),d.push(m)}var b=f.length;if(b)for(var h=f[0],M=0;M<b;M++){f[M];var x=f[M+1],w=d[M];isNaN(w)||(h+=x?w+x:w+" ")}else h=d[0];U[a.type](o.target,a.property,h,o.transforms),a.currentValue=h,n++}}function b(n){k[n]&&!k.passThrough&&k[n](k)}function u(n){var e=k.duration,t=k.delay,r=e-k.endDelay,a=m(n);if(k.progress=C(a/e*100,0,100),k.reversePlayback=a<k.currentTime,c){var o=a;if(k.reversePlayback)for(var u=d;u--;)v(o,c[u]);else for(var i=0;i<d;i++)v(o,c[i])}!k.began&&0<k.currentTime&&(k.began=!0,b("begin")),!k.loopBegan&&0<k.currentTime&&(k.loopBegan=!0,b("loopBegin")),a<=t&&0!==k.currentTime&&y(0),(r<=a&&k.currentTime!==e||!e)&&y(e),t<a&&a<r?(k.changeBegan||(k.changeBegan=!0,k.changeCompleted=!1,b("changeBegin")),b("change"),y(a)):k.changeBegan&&(k.changeCompleted=!0,k.changeBegan=!1,b("changeComplete")),k.currentTime=C(a,0,e),k.began&&b("update"),e<=n&&(f=0,k.remaining&&!0!==k.remaining&&k.remaining--,k.remaining?(s=l,b("loopComplete"),k.loopBegan=!1,"alternate"===k.direction&&g()):(k.paused=!0,k.completed||(k.completed=!0,b("loopComplete"),b("complete"),!k.passThrough&&"Promise"in window&&(p(),h(k)))))}return k.reset=function(){var n=k.direction;k.passThrough=!1,k.currentTime=0,k.progress=0,k.paused=!0,k.began=!1,k.loopBegan=!1,k.changeBegan=!1,k.completed=!1,k.changeCompleted=!1,k.reversePlayback=!1,k.reversed="reverse"===n,k.remaining=k.loop,c=k.children;for(var e=d=c.length;e--;)k.children[e].reset();(k.reversed&&!0!==k.loop||"alternate"===n&&1===k.loop)&&k.remaining++,y(k.reversed?k.duration:0)},k._onDocumentVisibility=o,k.set=function(n,e){return nn(n,e),k},k.tick=function(n){u(((l=n)+(f-(s=s||l)))*L.speed)},k.seek=function(n){u(m(n))},k.pause=function(){k.paused=!0,o()},k.play=function(){k.paused&&(k.completed&&k.reset(),k.paused=!1,S.push(k),o(),an())},k.reverse=function(){g(),k.completed=!k.reversed,o()},k.restart=function(){k.reset(),k.play()},k.remove=function(n){cn(A(n),k)},k.reset(),k.autoplay&&k.play(),k}function un(n,e){for(var t=e.length;t--;)h(n,e[t].animatable.target)&&e.splice(t,1)}function cn(n,e){var t=e.animations,r=e.children;un(n,t);for(var a=r.length;a--;){var o=r[a],u=o.animations;un(n,u),u.length||o.children.length||r.splice(a,1)}t.length||r.length||e.pause()}return L.version="3.2.1",L.speed=1,L.suspendWhenDocumentHidden=!0,L.running=S,L.remove=function(n){for(var e=A(n),t=S.length;t--;)cn(e,S[t])},L.get=T,L.set=nn,L.convertPx=y,L.path=function(n,e){var t=w.str(n)?a(n)[0]:n,r=e||100;return function(n){return{property:n,el:t,svg:Q(t),totalLength:G(t)*(r/100)}}},L.setDashoffset=function(n){var e=G(n);return n.setAttribute("stroke-dasharray",e),e},L.stagger=function(n,e){var i=(e=void 0===e?{}:e).direction||"normal",c=e.easing?P(e.easing):null,s=e.grid,f=e.axis,l=e.from||0,d="first"===l,p="center"===l,h="last"===l,g=w.arr(n),m=g?parseFloat(n[0]):parseFloat(n),v=g?parseFloat(n[1]):0,y=B(g?n[1]:n)||0,b=e.start||0+(g?m:0),M=[],x=0;return function(n,e,t){if(d&&(l=0),p&&(l=(t-1)/2),h&&(l=t-1),!M.length){for(var r,a,o,u=0;u<t;u++)s?(r=p?(s[0]-1)/2:l%s[0],a=p?(s[1]-1)/2:Math.floor(l/s[0]),r=r-u%s[0],a=a-Math.floor(u/s[0]),o=Math.sqrt(r*r+a*a),"x"===f&&(o=-r),M.push(o="y"===f?-a:o)):M.push(Math.abs(l-u)),x=Math.max.apply(Math,M);c&&(M=M.map(function(n){return c(n/x)*x})),"reverse"===i&&(M=M.map(function(n){return f?n<0?-1*n:-n:Math.abs(x-n)}))}return b+(g?(v-m)/x:m)*(Math.round(100*M[e])/100)+y}},L.timeline=function(u){var i=L(u=void 0===u?{}:u);return i.duration=0,i.add=function(n,e){var t=S.indexOf(i),r=i.children;function a(n){n.passThrough=!0}-1<t&&S.splice(t,1);for(var o=0;o<r.length;o++)a(r[o]);t=D(n,x(M,u)),t.targets=t.targets||u.targets,n=i.duration,t.autoplay=!1,t.direction=i.direction,t.timelineOffset=w.und(e)?n:E(e,n),a(i),i.seek(t.timelineOffset),e=L(t),a(e),r.push(e),n=tn(r,u);return i.delay=n.delay,i.endDelay=n.endDelay,i.duration=n.duration,i.seek(0),i.reset(),i.autoplay&&i.play(),i},i},L.easing=P,L.penner=s,L.random=function(n,e){return Math.floor(Math.random()*(e-n+1))+n},L});
\ No newline at end of file
diff --git a/functions.php b/functions.php
index 5a57975..b0659fd 100644
--- a/functions.php
+++ b/functions.php
@@ -124,8 +124,9 @@ function itstudio_enqueue_scripts() {
 
     if ($is_about) {
         wp_enqueue_style('itstudio-about-hero', get_template_directory_uri() . '/assets/css/about-hero.css', array('itstudio-content'), '2.1.2');
-        wp_enqueue_script('itstudio-about-hero-waves', get_template_directory_uri() . '/assets/js/hero-waves.js', array(), '1.0.0', true);
-        wp_enqueue_script('itstudio-about-hero', get_template_directory_uri() . '/assets/js/home-hero.js', array(), '1.0.0', true);
+        wp_enqueue_script('itstudio-animejs', get_template_directory_uri() . '/assets/js/vendor/anime.min.js', array(), '3.2.2', true);
+        wp_enqueue_script('itstudio-about-hero-waves', get_template_directory_uri() . '/assets/js/hero-waves.js', array('itstudio-animejs'), '1.0.0', true);
+        wp_enqueue_script('itstudio-about-hero', get_template_directory_uri() . '/assets/js/home-hero.js', array('itstudio-animejs'), '1.0.0', true);
     }
 
     // 仅在便民服务页加载（包含 /services fallback）
diff --git a/page-about.php b/page-about.php
index 81a8db0..ede0941 100644
--- a/page-about.php
+++ b/page-about.php
@@ -6,6 +6,27 @@ get_header();
 <main class="site-main">
     <canvas class="hero-waves" aria-hidden="true"></canvas>
     <section class="hero-section">
+        <button
+            type="button"
+            class="theme-toggle about-theme-toggle"
+            aria-label="Toggle Theme"
+            data-cn-aria-label="切换主题"
+            data-en-aria-label="Toggle Theme">
+            <svg class="sun-icon" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
+                <circle cx="12" cy="12" r="5"></circle>
+                <line x1="12" y1="1" x2="12" y2="3"></line>
+                <line x1="12" y1="21" x2="12" y2="23"></line>
+                <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
+                <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
+                <line x1="1" y1="12" x2="3" y2="12"></line>
+                <line x1="21" y1="12" x2="23" y2="12"></line>
+                <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
+                <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
+            </svg>
+            <svg class="moon-icon" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
+                <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
+            </svg>
+        </button>
         <div class="container">
             <div class="hero-content">
                 <h1 class="hero-title">
@@ -19,217 +40,6 @@ get_header();
             <span class="scroll-text" data-cn="向下滑动开始" data-en="Scroll to begin"></span>
         </div>
     </section>
-
-    <section class="services-section">
-        <div class="container">
-            <div class="services-provided">
-                <h2 data-cn="# 服务提供" data-en="# Our Services"></h2>
-                <div class="services-grid-box">
-                    <a href="#" class="service-item service-resources">
-                        <div class="service-icon">
-                            <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
-    <circle class="svc-soft" cx="36" cy="36" r="24" />
-    <path class="svc-stroke" d="M17 24h14l4 5h20a4 4 0 0 1 4 4v22a4 4 0 0 1-4 4H17a4 4 0 0 1-4-4V28a4 4 0 0 1 4-4z" />
-    <rect class="svc-soft-strong" x="23" y="33" width="26" height="17" rx="2.6" />
-    <path class="svc-accent" d="M28 38h16M28 43h12M28 48h9" />
-    <path class="svc-muted" d="M51 35v13M51 48l3-3M51 48l-3-3" />
-</svg>
-                        </div>
-                        <span data-cn="资源站" data-en="Resources"></span>
-                    </a>
-
-                    <a href="#" class="service-item service-mirror">
-                        <div class="service-icon">
-                            <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
-    <circle class="svc-soft" cx="36" cy="36" r="24" />
-    <circle class="svc-stroke" cx="36" cy="36" r="17" />
-    <path class="svc-muted" d="M19 36h34M36 19c5 4.7 7.8 10.5 7.8 17S41 48.3 36 53M36 19c-5 4.7-7.8 10.5-7.8 17S31 48.3 36 53" />
-    <path class="svc-accent" d="M50 29l7 7-7 7" />
-    <path class="svc-accent" d="M57 36H45" />
-    <path class="svc-accent" d="M22 43l-7-7 7-7" />
-    <path class="svc-accent" d="M15 36h12" />
-</svg>
-                        </div>
-                        <span data-cn="校内镜像站" data-en="Mirror Site"></span>
-                    </a>
-
-                    <a href="#" class="service-item service-git">
-                        <div class="service-icon">
-                            <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
-    <circle class="svc-soft" cx="36" cy="36" r="24" />
-    <rect class="svc-stroke" x="12" y="19" width="30" height="30" rx="4" />
-    <path class="svc-muted" d="M17 27h20M17 33h14" />
-    <circle class="svc-dot" cx="49" cy="24" r="3" />
-    <circle class="svc-dot" cx="49" cy="37" r="3" />
-    <circle class="svc-dot" cx="56" cy="47" r="3" />
-    <path class="svc-accent" d="M41 24h8" />
-    <path class="svc-accent" d="M49 24v13" />
-    <path class="svc-accent" d="M49 37c4 0 7 3 7 7" />
-</svg>
-                        </div>
-                        <span data-cn="代码托管" data-en="Git Hosting"></span>
-                    </a>
-
-                    <a href="#" class="service-item service-minecraft">
-                        <div class="service-icon">
-                            <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
-    <circle class="svc-soft" cx="36" cy="36" r="24" />
-    <path class="svc-stroke" d="M36 15l20 11v23L36 60 16 49V26l20-11z" />
-    <path class="svc-muted" d="M16 26l20 11 20-11M36 60V37" />
-    <path class="svc-accent" d="M20 23h32" />
-    <rect class="svc-soft-strong" x="24" y="40" width="6" height="6" rx="1.2" />
-    <rect class="svc-soft-strong" x="34" y="43" width="5" height="5" rx="1.1" />
-    <rect class="svc-dot" x="43" y="39" width="6" height="6" rx="1.2" />
-</svg>
-                        </div>
-                        <span data-cn="Minecraft服务器" data-en="Minecraft Server"></span>
-                    </a>
-
-                    <a href="#" class="service-item service-forum">
-                        <div class="service-icon">
-                            <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
-    <circle class="svc-soft" cx="36" cy="36" r="24" />
-    <path class="svc-stroke" d="M11 28a6 6 0 0 1 6-6h22a6 6 0 0 1 6 6v13a6 6 0 0 1-6 6H28l-8 7v-7h-3a6 6 0 0 1-6-6V28z" />
-    <path class="svc-accent" d="M36 19a6 6 0 0 1 6-6h13a6 6 0 0 1 6 6v9a6 6 0 0 1-6 6h-5l-4 4v-4h-4a6 6 0 0 1-6-6v-9z" />
-    <circle class="svc-dot" cx="24" cy="35" r="1.8" />
-    <circle class="svc-dot" cx="31" cy="35" r="1.8" />
-    <circle class="svc-dot" cx="46" cy="24" r="1.7" />
-    <circle class="svc-dot" cx="52" cy="24" r="1.7" />
-</svg>
-                        </div>
-                        <span data-cn="OUC论坛" data-en="OUC Forum"></span>
-                    </a>
-
-                    <a href="#" class="service-item service-repair">
-                        <div class="service-icon">
-                            <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
-    <circle class="svc-soft" cx="36" cy="36" r="24" />
-    <rect class="svc-stroke" x="11" y="18" width="37" height="25" rx="4" />
-    <path class="svc-muted" d="M29.5 43v6M22 49h15" />
-    <path class="svc-accent" d="M38 24.5a4.7 4.7 0 0 0-6.5 6.6l-7.2 7.2 3.4 3.4 7.2-7.2a4.7 4.7 0 0 0 6.6-6.5l-3 3-2.6-2.6 2.1-3z" />
-    <path class="svc-accent" d="M50 19l10 10" />
-    <circle class="svc-dot" cx="55" cy="24" r="2" />
-</svg>
-                        </div>
-                        <span data-cn="电脑维修" data-en="PC Repair"></span>
-                    </a>
-
-                    <a href="#" class="service-item service-workshop">
-                        <div class="service-icon">
-                            <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
-    <circle class="svc-soft" cx="36" cy="36" r="24" />
-    <rect class="svc-stroke" x="12" y="17" width="48" height="36" rx="5" />
-    <path class="svc-muted" d="M12 30h48M24 12v10M48 12v10" />
-    <rect class="svc-soft-strong" x="24" y="36" width="24" height="13" rx="3" />
-    <path class="svc-accent" d="M29 42l4 4 9-9" />
-    <circle class="svc-dot" cx="22" cy="24" r="1.8" />
-    <circle class="svc-dot" cx="30" cy="24" r="1.8" />
-</svg>
-                        </div>
-                        <span data-cn="五八工坊预约" data-en="Workshop Booking"></span>
-                    </a>
-
-                    <a href="#" class="service-item service-campus">
-                        <div class="service-icon">
-                            <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
-    <circle class="svc-soft" cx="36" cy="36" r="24" />
-    <path class="svc-stroke" d="M36 14l18 8v14c0 12-7 20-18 25-11-5-18-13-18-25V22l18-8z" />
-    <path class="svc-muted" d="M36 24c-4.5 0-8 3.5-8 8 0 5.5 8 13 8 13s8-7.5 8-13c0-4.5-3.5-8-8-8z" />
-    <circle class="svc-soft-strong" cx="36" cy="32" r="3.2" />
-    <circle class="svc-soft-strong" cx="52" cy="22" r="5.2" />
-    <path class="svc-accent" d="M49.5 22H54.5M52 19.5v5" />
-</svg>
-                        </div>
-                        <span data-cn="OUC便民服务" data-en="OUC Services"></span>
-                    </a>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section">
-        <div class="container">
-            <div class="content-grid">
-                <div class="announcements-column">
-                    <h2 data-cn="# 公告通知" data-en="# Announcements"></h2>
-                    <div class="post-list">
-                        <?php
-                        $announcements = new WP_Query(array(
-                            'post_type' => 'announcement',
-                            'post_status' => 'publish',
-                            'posts_per_page' => 5,
-                            'orderby' => 'date',
-                            'order' => 'DESC',
-                            'ignore_sticky_posts' => true,
-                            'no_found_rows' => true
-                        ));
-
-                        if ($announcements->have_posts()) :
-                            while ($announcements->have_posts()) : $announcements->the_post();
-                        ?>
-                            <article class="post-item">
-                                <div class="post-content-wrapper">
-                                    <h3 class="post-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
-                                    <div class="post-excerpt">
-                                        <?php the_excerpt(); ?>
-                                    </div>
-                                    <div class="post-meta">
-                                        <span class="post-author"><?php echo get_the_author(); ?></span>
-                                        <time datetime="<?php echo get_the_date('c'); ?>"><?php echo get_the_date('Y年m月d日'); ?></time>
-                                    </div>
-                                </div>
-                            </article>
-                        <?php
-                            endwhile;
-                            wp_reset_postdata();
-                        else :
-                        ?>
-                            <p data-cn="暂无公告" data-en="No announcements found."></p>
-                        <?php endif; ?>
-                    </div>
-                </div>
-
-                <div class="blog-column">
-                    <h2 data-cn="# 技术博客" data-en="# Blog"></h2>
-                    <div class="post-list">
-                        <?php
-                        $blogs = new WP_Query(array(
-                            'post_type' => 'post',
-                            'post_status' => 'publish',
-                            'posts_per_page' => 5,
-                            'orderby' => 'date',
-                            'order' => 'DESC',
-                            'ignore_sticky_posts' => true,
-                            'no_found_rows' => true
-                        ));
-
-                        if ($blogs->have_posts()) :
-                            while ($blogs->have_posts()) : $blogs->the_post();
-                        ?>
-                            <article class="post-item">
-                                <div class="post-content-wrapper">
-                                    <h3 class="post-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
-                                    <div class="post-excerpt">
-                                        <?php the_excerpt(); ?>
-                                    </div>
-                                    <div class="post-meta">
-                                        <span class="post-author"><?php echo get_the_author(); ?></span>
-                                        <time datetime="<?php echo get_the_date('c'); ?>"><?php echo get_the_date('Y年m月d日'); ?></time>
-                                    </div>
-                                </div>
-                            </article>
-                        <?php
-                            endwhile;
-                            wp_reset_postdata();
-                        else :
-                        ?>
-                            <p data-cn="暂无博客文章" data-en="No blog posts found."></p>
-                        <?php endif; ?>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section>
 </main>
 
 <?php get_footer(); ?>