'优化课程'

app/globals.css

@@ -17,14 +17,33 @@
   --animate-float: float 6s ease-in-out infinite;
 }
 
-:root {
+:root,
+.light {
   --background: #ffffff;
   --foreground: #0f172a;
+  --card: #ffffff;
+  --card-foreground: #0f172a;
+  --muted: #f1f5f9;
+  --muted-foreground: #64748b;
+  --border: #e2e8f0;
+  --accent: #f59e0b;
+  --accent-foreground: #1c1917;
+  --accent-muted: rgba(245, 158, 11, 0.2);
+  --gradient-accent: rgba(251, 191, 36, 0.15);
 }
 
 .dark {
   --background: #0f172a;
   --foreground: #f8fafc;
+  --card: rgba(255, 255, 255, 0.05);
+  --card-foreground: #f8fafc;
+  --muted: rgba(255, 255, 255, 0.05);
+  --muted-foreground: #94a3b8;
+  --border: rgba(255, 255, 255, 0.08);
+  --accent: #f59e0b;
+  --accent-foreground: #1c1917;
+  --accent-muted: rgba(245, 158, 11, 0.2);
+  --gradient-accent: rgba(251, 191, 36, 0.15);
 }
 
 @keyframes scroll {
@@ -42,6 +61,57 @@
   50% { transform: translateY(-10px); }
 }
 
+/* 课程页 - 渐变背景动画 */
+@keyframes gradient-shift {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.85; }
+}
+
+.animate-gradient {
+  animation: gradient-shift 8s ease-in-out infinite;
+}
+
+/* 卡片悬停光效 */
+@keyframes shimmer {
+  0% { background-position: -200% 0; }
+  100% { background-position: 200% 0; }
+}
+
+.hover-shimmer {
+  position: relative;
+  overflow: hidden;
+}
+
+.hover-shimmer::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(
+    90deg,
+    transparent,
+    rgba(255, 255, 255, 0.05),
+    transparent
+  );
+  background-size: 200% 100%;
+  opacity: 0;
+  transition: opacity 0.3s;
+}
+
+.hover-shimmer:hover::after {
+  opacity: 1;
+  animation: shimmer 1.5s ease-in-out;
+}
+
+/* CTA 徽章轻微浮动 */
+@keyframes float-badge {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-2px); }
+}
+
+.animate-float-badge {
+  animation: float-badge 3s ease-in-out infinite;
+}
+
 body {
   background: var(--background);
   color: var(--foreground);