/* ========== 设计令牌（仅颜色值改为 oklch，其余不动） ========== */
:root {
  --primary: oklch(0.55 0.22 25);
  --primary-5: oklch(0.98 0.001 286.375);
  --primary-10: oklch(0.95 0.05 25);
  --primary-20: oklch(0.92 0.004 286.32);
  --accent-10: oklch(0.95 0.05 25);
  --accent-20: oklch(0.95 0.05 25 / 20%);
  --background: oklch(1 0 0);
  --foreground: oklch(0.235 0.015 65);
  --muted-foreground: oklch(0.552 0.016 285.938);
  --border: oklch(0.92 0.004 286.32);
  --radius: 0.65rem;
}

/* 暗色模式（oklch 值同步） */
.dark {
  --primary: oklch(0.488 0.243 264.376);
  --primary-5: oklch(0.24 0.006 286.033);
  --primary-10: oklch(0.274 0.006 286.033);
  --primary-20: oklch(1 0 0 / 10%);
  --accent-10: oklch(0.274 0.006 286.033);
  --accent-20: oklch(0.274 0.006 286.033 / 20%);
  --background: oklch(0.141 0.005 285.823);
  --foreground: oklch(0.85 0.005 65);
  --muted-foreground: oklch(0.705 0.015 286.067);
  --border: oklch(1 0 0 / 10%);
}

/* ========== 原子类（原内联） ========== */
.flex { display: flex }
.grid { display: grid }
.items-center { align-items: center }
.justify-center { justify-content: center }
.flex-col { flex-direction: column }
.text-center { text-align: center }
.text-left { text-align: left }
.inline-block { display: inline-block }

/* 字体大小 */
.text-base { font-size: 1rem }
.text-lg { font-size: 1.125rem }
.text-xl { font-size: 1.25rem }
.text-2xl { font-size: 1.5rem }
.text-4xl { font-size: 2.25rem }
.text-5xl { font-size: 3rem }
.text-7xl { font-size: 4.5rem }
.text-9xl { font-size: 8rem }

/* 字重 */
.font-bold { font-weight: 700 }
.font-semibold { font-weight: 600 }

/* 间距 */
.mb-2 { margin-bottom: .5rem }
.mb-3 { margin-bottom: .75rem }
.mb-4 { margin-bottom: 1rem }
.mb-6 { margin-bottom: 1.5rem }
.mb-8 { margin-bottom: 2rem }
.mb-10 { margin-bottom: 2.5rem }
.mb-11 { margin-bottom: 2.75rem }
.mb-12 { margin-bottom: 3rem }
.mb-16 { margin-bottom: 4rem }
.mt-4 { margin-top: 1rem }
.mt-6 { margin-top: 1.5rem }
.mt-8 { margin-top: 2rem }
.mt-12 { margin-top: 3rem }
.mt-16 { margin-top: 4rem }
.mx-auto { margin-left: auto; margin-right: auto }

/* 间距-gap */
.gap-3 { gap: .75rem }
.gap-4 { gap: 1rem }
.gap-8 { gap: 2rem }
.gap-16 { gap: 4rem }

/* 栅格 */
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) }

/* 尺寸 */
.w-5 { width: 1.25rem }
.w-6 { width: 1.5rem }
.w-12 { width: 3rem }
.w-48 { width: 12rem }
.w-\[350px\] { width: 350px }
.h-5 { height: 1.25rem }
.h-6 { height: 1.5rem }
.h-12 { height: 3rem }
.h-48 { height: 12rem }
.h-\[350px\] { height: 350px }

/* 最大宽度 */
.max-w-2xl { max-width: 42rem }
.max-w-4xl { max-width: 56rem }
.max-w-6xl { max-width: 72rem }
.max-w-7xl { max-width: 80rem }

/* 内边距 */
.p-6 { padding: 1.5rem }
.p-8 { padding: 2rem }
.p-18 { padding: 4.5rem }
.px-8 { padding-left: 2rem; padding-right: 2rem }
.py-20 { padding-top: 5rem; padding-bottom: 5rem }

/* 圆角 */
.rounded-md { border-radius: .375rem }
.rounded-lg { border-radius: .5rem }
.rounded-full { border-radius: 9999px }

/* 对象适应 */
.object-cover { object-fit: cover }
.object-contain { object-fit: contain }

/* 变换 */
.translate-y-8 { transform: translateY(2rem) }
.scale-110 { transform: scale(1.1) }

/* 阴影 */
.shadow-md { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1) }

/* list 间距 */
.space-y-2 > li:not([hidden]) ~ li { margin-top: .5rem }
.space-y-3 > li:not([hidden]) ~ li { margin-top: .75rem }

/* ========== 业务样式 ========== */
/* 1920×840 固定板块 */
.section-fixed-1920 {
  width: 1920px;
  height: 840px;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  box-sizing: border-box;
}
.section-fixed-1920 .content-1920 {
  width: 1280px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 40px;
  box-sizing: border-box;
}

/* 简易版卡片 */
.card {
  background: var(--background);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .05);
}
.card-content {
  padding: 1.5rem;
}

/* 按钮 */
.btn-primary {
  background: var(--primary);
  color: #fff;
  border: none;
  padding: 0.75rem 1.5rem;
  border-radius: var(--radius);
  cursor: pointer;
  font-size: 1rem;
}
.btn-outline {
  background: transparent;
  color: var(--primary);
  border: 1px solid var(--primary);
  padding: 0.5rem 1.25rem;
  border-radius: var(--radius);
  cursor: pointer;
  font-size: 0.875rem;
}
.btn-primary:hover { background: #0d43b0; }
.btn-outline:hover { background: var(--primary-10); }

/* 文字颜色 */
.text-primary { color: var(--primary); }
.text-foreground { color: var(--foreground); }
.text-muted-foreground { color: var(--muted-foreground); }
.bg-primary-10 { background: var(--primary-10); }
.bg-primary-5 { background: var(--primary-5); }
.bg-muted-30 { background: rgba(239, 241, 245, .3); }
.border-primary-20 { border-color: var(--primary-20); }
.border-border { border-color: var(--border); }

/* ========== 渐变背景（与源文件 100% 一致） ========== */
.bg-gradient-to-br {
  background: linear-gradient(
    to bottom right,
    oklch(0.95 0.05 25 / 10%),   /* primary /10  */
    oklch(1 0 0),                /* background   */
    oklch(0.95 0.05 25 / 20%)    /* accent /20   */
  );
}
.bg-gradient-to-r {
  background: linear-gradient(
    to right,
    oklch(0.95 0.05 25 / 10%),   /* primary /10  */
    oklch(0.95 0.05 25 / 5%),    /* primary /5   */
    oklch(0.95 0.05 25 / 10%)    /* accent /10   */
  );
}