/* 全局变量与基础样式 */
:root {
  --primaryColor: #06B6D4;
  --secondaryColor: #3B82F6;
  --accentColor: #3B82F6;
  --backgroundColor: #F8FAFC;
  --surfaceColor: #F8FAFC;
  --fontFamily: Helvetica, Arial, sans-serif;
  --baseFontSize: 19px;
  --lineHeight: 1;
  --letterSpacing: 0;
  --borderRadius: 17px;
  --spacing: 28px;
  --maxWidth: 1355px;
  --gridGap: 40px;
}

/* 深色模式变量 */
[data-bs-theme="dark"] {
  --backgroundColor: #0F172A;
  --surfaceColor: #1E293B;
}

/* 全局重置 */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--fontFamily);
  font-size: var(--baseFontSize);
  line-height: var(--lineHeight);
  letter-spacing: var(--letterSpacing);
  background-color: var(--backgroundColor);
  color: #111827;
  transition: background-color .3s, color .3s;
}
[data-bs-theme="dark"] body { color: #F9FAFB; }

/* 主题色扩展 */
.text-primary { color: var(--primaryColor) !important; }
.bg-primary { background-color: var(--primaryColor) !important; }
.btn-primary {
  background-color: var(--primaryColor);
  border-color: var(--primaryColor);
  border-radius: var(--borderRadius);
}
.btn-primary:hover { background-color: #0891B2; border-color: #0891B2; }
.btn-outline-primary {
  color: var(--primaryColor);
  border-color: var(--primaryColor);
  border-radius: var(--borderRadius);
}
.btn-outline-primary:hover { background-color: var(--primaryColor); border-color: var(--primaryColor); }

/* 布局工具 */
.container { max-width: var(--maxWidth) !important; }
.row { --bs-gutter-x: var(--gridGap); }

/* 卡片统一风格 */
.card {
  border-radius: var(--borderRadius);
  background-color: var(--surfaceColor);
  transition: transform .2s, box-shadow .2s;
}
.card:hover { transform: translateY(-4px); box-shadow: 0 12px 24px rgba(0,0,0,.08); }

/* 表单样式 */
.form-control, .form-select {
  border-radius: var(--borderRadius);
  border: 1px solid #D1D5DB;
  background-color: var(--surfaceColor);
  color: inherit;
}
.form-control:focus, .form-select:focus {
  border-color: var(--primaryColor);
  box-shadow: 0 0 0 .2rem rgba(6,182,212,.25);
}

/* 导航栏 */
.navbar-brand { font-size: 1.375rem; }
.navbar-nav .nav-link { font-weight: 500; }

/* Hero 区域 */
.hero {
  background: linear-gradient(135deg, var(--primaryColor) 0%, var(--secondaryColor) 100%);
  color: #fff;
}
.hero h1 { font-size: 2.5rem; }
@media (min-width: 768px) { .hero h1 { font-size: 3rem; } }

/* 页脚 */
footer { background-color: var(--surfaceColor) !important; }

/* 微交互 */
.btn { transition: all .2s; }
.btn:hover { transform: scale(1.03); }

/* 懒加载动画 */
.lazy { opacity: 0; transition: opacity .3s; }
.lazy.loaded { opacity: 1; }
