/* ═══════════════════════════════════════════
   腾讯云架构师技术同盟 · 新人指南
   核心样式
═══════════════════════════════════════════ */

/* 字体 */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;900&display=swap');

body {
  font-family: 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 
               'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  scroll-behavior: smooth;
}

/* 文字渐变 */
.text-gradient {
  background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 50%, #6366f1 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Hero 标题专用渐变 — 更大胆 */
.hero-title-gradient {
  background: linear-gradient(135deg, #2563eb 0%, #0891b2 40%, #7c3aed 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-size: 200% 200%;
  animation: gradientShift 6s ease infinite;
}

@keyframes gradientShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* ── Hero 入场动画 ────────────────────────── */
.hero-fade-in {
  opacity: 0;
  transform: translateY(28px);
  animation: heroFadeIn 0.8s ease-out forwards;
}
.hero-delay-1 { animation-delay: 0.15s; }
.hero-delay-2 { animation-delay: 0.3s; }
.hero-delay-3 { animation-delay: 0.45s; }
.hero-delay-4 { animation-delay: 0.6s; }

@keyframes heroFadeIn {
  to { opacity: 1; transform: translateY(0); }
}

/* ── Hero 背景 blob 呼吸动画 ──────────────── */
.hero-blob {
  animation: blobFloat 12s ease-in-out infinite;
}
.hero-blob-2 { animation-delay: -4s; }
.hero-blob-3 { animation-delay: -8s; }

@keyframes blobFloat {
  0%, 100% { transform: translate(var(--tw-translate-x, 0), var(--tw-translate-y, 0)) scale(1); }
  33% { transform: translate(var(--tw-translate-x, 0), var(--tw-translate-y, 0)) scale(1.08) translateY(-10px); }
  66% { transform: translate(var(--tw-translate-x, 0), var(--tw-translate-y, 0)) scale(0.95) translateY(8px); }
}

/* ── Hero Logo 水印浮动 ───────────────────── */
.hero-logo-float {
  animation: logoFloat 8s ease-in-out infinite;
}
@keyframes logoFloat {
  0%, 100% { transform: translate(25%, -50%) rotate(0deg); }
  50% { transform: translate(25%, -52%) rotate(3deg); }
}

/* ── Hero 品牌形象图 ─────────────────────── */
.hero-mascot-wrap {
  animation: mascotFloat 6s ease-in-out infinite;
}
@keyframes mascotFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}
.hero-mascot-wrap img {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.hero-mascot-wrap:hover img {
  transform: scale(1.03);
}

/* 网格背景 */
.grid-bg {
  background-image: 
    linear-gradient(rgba(37, 99, 235, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37, 99, 235, 0.04) 1px, transparent 1px);
  background-size: 40px 40px;
}

/* ── 按钮 ───────────────────────────────── */
.btn-primary {
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: white;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #1d4ed8, #1e40af);
  transform: translateY(-1px);
}

.btn-secondary {
  background: white;
  color: #374151;
  border: 1.5px solid #e5e7eb;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}
.btn-secondary:hover {
  border-color: #2563eb;
  color: #2563eb;
  transform: translateY(-1px);
}

/* ── 区块标题徽章 ────────────────────────── */
.section-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #2563eb;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  letter-spacing: 0.05em;
}
.section-badge::before {
  content: '';
  width: 6px;
  height: 6px;
  background: #2563eb;
  border-radius: 50%;
}

.section-badge-purple {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
  color: #7c3aed;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  letter-spacing: 0.05em;
}
.section-badge-purple::before {
  content: '';
  width: 6px;
  height: 6px;
  background: #7c3aed;
  border-radius: 50%;
}

.section-badge-green {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  color: #16a34a;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  letter-spacing: 0.05em;
}
.section-badge-green::before {
  content: '';
  width: 6px;
  height: 6px;
  background: #16a34a;
  border-radius: 50%;
}

.section-badge-orange {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #ea580c;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  letter-spacing: 0.05em;
}
.section-badge-orange::before {
  content: '';
  width: 6px;
  height: 6px;
  background: #ea580c;
  border-radius: 50%;
}

/* ── 资源标签链接 ────────────────────────── */
.tag-link {
  display: inline-flex;
  align-items: center;
  background: #eff6ff;
  color: #2563eb;
  font-size: 0.7rem;
  font-weight: 500;
  padding: 0.25rem 0.625rem;
  border-radius: 6px;
  border: 1px solid #bfdbfe;
  text-decoration: none;
  transition: all 0.15s;
}
.tag-link:hover {
  background: #dbeafe;
  border-color: #93c5fd;
}

.tag-link-orange {
  display: inline-flex;
  align-items: center;
  background: #fff7ed;
  color: #ea580c;
  font-size: 0.7rem;
  font-weight: 500;
  padding: 0.25rem 0.625rem;
  border-radius: 6px;
  border: 1px solid #fed7aa;
  text-decoration: none;
  transition: all 0.15s;
}
.tag-link-orange:hover {
  background: #ffedd5;
}

.tag-link-green {
  display: inline-flex;
  align-items: center;
  background: #f0fdf4;
  color: #16a34a;
  font-size: 0.7rem;
  font-weight: 500;
  padding: 0.25rem 0.625rem;
  border-radius: 6px;
  border: 1px solid #bbf7d0;
  text-decoration: none;
  transition: all 0.15s;
}
.tag-link-green:hover {
  background: #dcfce7;
}

.tag-link-purple {
  display: inline-flex;
  align-items: center;
  background: #f5f3ff;
  color: #7c3aed;
  font-size: 0.7rem;
  font-weight: 500;
  padding: 0.25rem 0.625rem;
  border-radius: 6px;
  border: 1px solid #ddd6fe;
  text-decoration: none;
  transition: all 0.15s;
}
.tag-link-purple:hover {
  background: #ede9fe;
}

/* ── 资源导航项 ─────────────────────────── */
.res-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: #4b5563;
  text-decoration: none;
  padding: 0.25rem 0.375rem;
  border-radius: 6px;
  transition: all 0.15s;
}
.res-item:hover {
  background: #f3f4f6;
  color: #111827;
}

/* ── 任务卡片 ────────────────────────────── */

/* ── 卡片展开区 ────────────────────────── */
.card-expand {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.45s cubic-bezier(0.4,0,0.2,1), opacity 0.35s ease, margin 0.35s ease;
  opacity: 0;
  margin-top: 0;
}
.card-expand.open {
  opacity: 1;
  margin-top: 1rem;
}
.card-expand-arrow {
  transition: transform 0.3s ease;
}
.card-expand-arrow.rotated {
  transform: rotate(180deg);
}

/* ── 联络库 Tab ──────────────────────── */
.ct-tab {
  padding: 0.3rem 0.75rem;
  border-radius: 9999px;
  font-size: 0.7rem;
  font-weight: 500;
  color: #6b7280;
  background: transparent;
  border: 1.5px solid #e5e7eb;
  cursor: pointer;
  transition: all 0.2s;
}
.ct-tab:hover { border-color: #86efac; color: #16a34a; }
.ct-tab.active { background: #16a34a; border-color: #16a34a; color: white; }

/* ── 联络库人名标签 ────────────────── */
.person-tag { display: inline-flex; font-size: 0.7rem; font-weight: 500; padding: 3px 8px; border-radius: 6px; }
.person-blue { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }
.person-orange { background: #fff7ed; color: #ea580c; border: 1px solid #fed7aa; }
.person-green { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
.person-purple { background: #f5f3ff; color: #7c3aed; border: 1px solid #ddd6fe; }
.person-gray { background: #f9fafb; color: #4b5563; border: 1px solid #e5e7eb; }

.task-btn {
  background: #eff6ff;
  color: #2563eb;
  padding: 0.375rem 0.875rem;
  border-radius: 8px;
  border: 1px solid #bfdbfe;
  text-decoration: none;
  transition: all 0.15s;
}
.task-btn:hover {
  background: #dbeafe;
  border-color: #93c5fd;
}

.task-btn-outline {
  background: transparent;
  color: #6b7280;
  padding: 0.375rem 0.875rem;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  text-decoration: none;
  transition: all 0.15s;
}
.task-btn-outline:hover {
  border-color: #2563eb;
  color: #2563eb;
  background: #eff6ff;
}

/* ── FAQ ────────────────────────────────── */
.faq-tab {
  padding: 0.5rem 1.25rem;
  border-radius: 9999px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #6b7280;
  background: transparent;
  border: 1.5px solid #e5e7eb;
  cursor: pointer;
  transition: all 0.2s;
}
.faq-tab:hover {
  border-color: #93c5fd;
  color: #2563eb;
}
.faq-tab.active {
  background: #2563eb;
  border-color: #2563eb;
  color: white;
}

.faq-question {
  cursor: pointer;
}
.faq-question.open {
  background: #f8faff;
}
.faq-question.open i {
  transform: rotate(180deg);
}
.faq-answer {
  border-top: 1px solid #f3f4f6;
}

/* ── 弹窗 ────────────────────────────────── */
#qr-modal.active {
  display: flex;
}

/* ── 导航激活态 ─────────────────────────── */
.nav-link.active {
  color: #2563eb;
  font-weight: 500;
}

/* ── 移动端导航抽屉 ─────────────────────── */
#mobile-nav-drawer {
  will-change: transform;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
#mobile-nav-drawer.open {
  transform: translateY(0);
}
.mobile-nav-bg {
  opacity: 0;
  transition: opacity 0.3s ease;
}
#mobile-nav-overlay.open .mobile-nav-bg {
  opacity: 1;
}
.mobile-nav-item {
  transition: transform 0.15s ease, background 0.15s ease;
}
.mobile-nav-item:active {
  transform: scale(0.97);
}

/* ── 桌面端侧边导航指示器 ───────────────── */
.side-dot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 4px;
}
.side-dot span:first-child {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.side-dot.active span:first-child {
  width: 10px;
  height: 10px;
  background: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}
.side-label {
  position: absolute;
  right: 100%;
  margin-right: 10px;
  white-space: nowrap;
  font-size: 0.75rem;
  font-weight: 500;
  color: #374151;
  background: white;
  padding: 4px 10px;
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  border: 1px solid #f3f4f6;
  opacity: 0;
  transform: translateX(4px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: none;
}
.side-dot:hover .side-label {
  opacity: 1;
  transform: translateX(0);
}
#side-nav.visible {
  opacity: 1;
}

/* ── 动画 ────────────────────────────────── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
.fade-in-up {
  animation: fadeInUp 0.6s ease-out forwards;
}

/* ── 滚动动画 ────────────────────────────── */
.scroll-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.scroll-reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

/* ── 积分行为加分表 ─────────────────────── */
.score-table-wrap {
  margin-top: 1.25rem;
}
.score-module {
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  overflow: hidden;
  margin-bottom: 0.75rem;
  transition: box-shadow 0.25s ease;
}
.score-module:hover {
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.score-module-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1.25rem;
  cursor: pointer;
  user-select: none;
  transition: background 0.2s;
}
.score-module-header:hover {
  background: #fafbfc;
}
.score-module-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.875rem;
}
.score-module-title {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.score-module-title span:first-child {
  font-weight: 600;
  font-size: 0.9375rem;
  color: #1f2937;
}
.score-module-title span:last-child {
  font-size: 0.75rem;
  color: #9ca3af;
  margin-top: 0.125rem;
}
.score-module-count {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 0.2rem 0.625rem;
  border-radius: 9999px;
  flex-shrink: 0;
}
.score-module-arrow {
  color: #9ca3af;
  font-size: 0.7rem;
  transition: transform 0.3s ease;
  flex-shrink: 0;
}
.score-module.open .score-module-arrow {
  transform: rotate(180deg);
}
.score-module-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s cubic-bezier(0.4,0,0.2,1);
}
.score-module.open .score-module-body {
  max-height: 600px;
}
.score-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
}
.score-table thead th {
  text-align: left;
  padding: 0.625rem 1.25rem;
  font-weight: 600;
  font-size: 0.75rem;
  color: #6b7280;
  border-top: 1px solid #f3f4f6;
  border-bottom: 1px solid #f3f4f6;
}
.score-table tbody td {
  padding: 0.625rem 1.25rem;
  color: #374151;
  border-bottom: 1px solid #f9fafb;
  vertical-align: middle;
}
.score-table tbody tr:last-child td {
  border-bottom: none;
}
.score-table tbody tr:hover {
  background: #fafbfc;
}
.score-badge {
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.2rem 0.625rem;
  border-radius: 0.375rem;
  white-space: nowrap;
}

/* 模块配色 */
.score-mod-study .score-module-icon { background: #eff6ff; color: #2563eb; }
.score-mod-study .score-module-count { background: #eff6ff; color: #2563eb; }
.score-mod-study .score-badge { background: #eff6ff; color: #2563eb; }
.score-mod-study .score-table thead { background: #fafbff; }

.score-mod-event .score-module-icon { background: #fff7ed; color: #ea580c; }
.score-mod-event .score-module-count { background: #fff7ed; color: #ea580c; }
.score-mod-event .score-badge { background: #fff7ed; color: #ea580c; }
.score-mod-event .score-table thead { background: #fffbf5; }

.score-mod-community .score-module-icon { background: #f0fdf4; color: #16a34a; }
.score-mod-community .score-module-count { background: #f0fdf4; color: #16a34a; }
.score-mod-community .score-badge { background: #f0fdf4; color: #16a34a; }
.score-mod-community .score-table thead { background: #f7fdf9; }

.score-mod-referral .score-module-icon { background: #f5f3ff; color: #7c3aed; }
.score-mod-referral .score-module-count { background: #f5f3ff; color: #7c3aed; }
.score-mod-referral .score-badge { background: #f5f3ff; color: #7c3aed; }
.score-mod-referral .score-table thead { background: #faf8ff; }

.score-mod-brand .score-module-icon { background: #ecfeff; color: #0891b2; }
.score-mod-brand .score-module-count { background: #ecfeff; color: #0891b2; }
.score-mod-brand .score-badge { background: #ecfeff; color: #0891b2; }
.score-mod-brand .score-table thead { background: #f5feff; }

/* ═══════════════════════════════════════════
   增强动画系统（高级感版）
═══════════════════════════════════════════ */

/* ── 滚动进度条 ──────────────────────────── */
.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  background: linear-gradient(90deg, #2563eb, #0891b2, #7c3aed);
  z-index: 9999;
  width: 0%;
  transition: width 0.1s linear;
  border-radius: 0 2px 2px 0;
  opacity: 0.85;
}

/* ── Hero 视差层 ─────────────────────────── */
.hero-section {
  perspective: 1200px;
}
.hero-parallax-slow {
  will-change: transform;
  transition: transform 0.1s linear;
}
.hero-parallax-fast {
  will-change: transform;
  transition: transform 0.1s linear;
}

/* ── 导航栏毛玻璃增强 ────────────────────── */
#topnav {
  transition: box-shadow 0.4s ease, background 0.4s ease, backdrop-filter 0.4s ease;
  backdrop-filter: blur(12px) saturate(1.8);
  -webkit-backdrop-filter: blur(12px) saturate(1.8);
}
#topnav.scrolled {
  box-shadow: 0 1px 20px rgba(0,0,0,0.06);
  background: rgba(255,255,255,0.92);
}

/* ── 卡片精致光影 ────────────────────────── */
.resource-card,
.growth-path-card,
.task-card {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.3s ease;
}
.resource-card:hover,
.growth-path-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px -8px rgba(0,0,0,0.08), 0 4px 12px -2px rgba(0,0,0,0.04);
}
.task-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px -6px rgba(0,0,0,0.07), 0 2px 8px -1px rgba(0,0,0,0.03);
}

/* 卡片内光泽（hover 时微妙的渐变光泽扫过） */
.resource-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,0) 40%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 60%);
  background-size: 250% 250%;
  background-position: 100% 100%;
  opacity: 0;
  transition: opacity 0.5s ease, background-position 0.8s ease;
  pointer-events: none;
  z-index: 1;
}
.resource-card:hover::before {
  opacity: 0.3;
  background-position: 0% 0%;
}
.resource-card {
  position: relative;
  overflow: hidden;
}

/* ── Section 间弧形分割 ──────────────────── */
.section-curve {
  margin-top: -1px;
  margin-bottom: -1px;
  line-height: 0;
  overflow: hidden;
}

/* ── Section 间渐变过渡带（旧，已由弧形分割替代）── */
.section-fade-bridge {
  display: none;
}

/* ── 交错入场动画 ────────────────────────── */
.stagger-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.stagger-reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

/* 从左侧滑入 */
.stagger-reveal-left {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.stagger-reveal-left.revealed {
  opacity: 1;
  transform: translateX(0);
}

/* 从右侧滑入 */
.stagger-reveal-right {
  opacity: 0;
  transform: translateX(40px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.stagger-reveal-right.revealed {
  opacity: 1;
  transform: translateX(0);
}

/* 缩放入场 */
.stagger-reveal-scale {
  opacity: 0;
  transform: scale(0.85);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.stagger-reveal-scale.revealed {
  opacity: 1;
  transform: scale(1);
}

/* ── Section 标题入场动画 ────────────────── */
.section-title-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.section-title-reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

/* section badge 弹入 */
.badge-pop {
  opacity: 0;
  transform: scale(0.6) translateY(10px);
  transition: opacity 0.5s cubic-bezier(0.34, 1.56, 0.64, 1),
              transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.badge-pop.revealed {
  opacity: 1;
  transform: scale(1) translateY(0);
}



/* ── Step 卡片图标脉冲 ───────────────────── */
.step-card .step-icon {
  position: relative;
}
.step-card .step-icon::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 0.75rem;
  background: inherit;
  opacity: 0;
  animation: iconPulseRing 3s ease-in-out infinite;
}
@keyframes iconPulseRing {
  0%, 100% { transform: scale(1); opacity: 0; }
  50% { transform: scale(1.4); opacity: 0.15; }
}

/* ── FAQ 平滑展开动画 ────────────────────── */
.faq-answer {
  border-top: 1px solid #f3f4f6;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1),
              opacity 0.3s ease,
              padding 0.3s ease;
  padding-top: 0;
  padding-bottom: 0;
}
.faq-answer.faq-open {
  opacity: 1;
  padding-top: 0;
  padding-bottom: 1rem;
}

/* FAQ 问题箭头旋转 */
.faq-question i {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ── FAQ Tab 切换动画 ────────────────────── */
.faq-tab-content {
  transition: opacity 0.3s ease;
}
.faq-tab-content.tab-entering {
  animation: tabSlideIn 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes tabSlideIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ── 任务卡片序号动画 ────────────────────── */
.task-card .w-7 {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
              background 0.3s ease;
}
.task-card:hover .w-7 {
  transform: scale(1.15) rotate(-5deg);
}

/* ── 成长阶梯表行高亮动画 ────────────────── */
.growth-table-row {
  transition: background 0.3s ease, transform 0.2s ease;
}
.growth-table-row:hover {
  transform: translateX(4px);
}

/* ── 数据卡片微光 ────────────────────────── */
.data-card-shine {
  position: relative;
  overflow: hidden;
}
.data-card-shine::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.05), transparent);
  animation: cardShine 8s ease-in-out infinite;
  pointer-events: none;
}
@keyframes cardShine {
  0%, 100% { left: -100%; }
  40%, 60% { left: 150%; }
}

/* ── 按钮点击涟漪 ────────────────────────── */
.btn-primary, .btn-secondary, .task-btn {
  position: relative;
  overflow: hidden;
}
.btn-primary::after, .btn-secondary::after, .task-btn::after {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255,255,255,0.25);
  transform: translate(-50%, -50%);
  transition: width 0.5s ease, height 0.5s ease, opacity 0.5s ease;
  opacity: 0;
  pointer-events: none;
}
.btn-primary:active::after, .btn-secondary:active::after, .task-btn:active::after {
  width: 300px;
  height: 300px;
  opacity: 1;
  transition: 0s;
}

/* ── 导航栏增强过渡 ──────────────────────── */
#topnav {
  transition: box-shadow 0.3s ease, background 0.3s ease;
}
#topnav.scrolled {
  box-shadow: 0 1px 8px rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.98);
}



/* ── 成长路径卡片数字计数 ────────────────── */
.count-up {
  display: inline-block;
  min-width: 2ch;
}

/* ── 平滑锚点滚动 ───────────────────────── */
html {
  scroll-behavior: smooth;
}

/* ── 减少动画偏好支持 ────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .scroll-progress { display: none; }
}

/* ── 响应式 ─────────────────────────────── */
@media (max-width: 640px) {
  .hero-section {
    min-height: calc(100vh - 3.5rem);
  }
  .score-table thead th,
  .score-table tbody td {
    padding: 0.5rem 0.875rem;
    font-size: 0.75rem;
  }
  .score-module-header {
    padding: 0.75rem 1rem;
  }
  /* 移动端缩小动画幅度 */
  .stagger-reveal { transform: translateY(20px); }
  .stagger-reveal-left { transform: translateX(-20px); }
  .stagger-reveal-right { transform: translateX(20px); }
}