/* ============================================
   深圳市德艺科技实业有限公司官网
   Design Tokens（严格按 REDESIGN_PLAN.md）
   - 克制留白 / 纯色块 / 东方质感
   ============================================ */

:root {
  /* ========== 色彩系统 ========== */
  /* 主色调 - 稳重克制 */
  --color-primary: #1C1C1C;          /* 墨黑 - 主标题、导航 */
  --color-secondary: #4A4A4A;        /* 炭灰 - 正文 */
  --color-accent: #8B6914;           /* 古铜金 - 强调、CTA */

  /* 辅助色 - 高级质感 */
  --color-warm-ivory: #F8F6F0;       /* 暖象牙白 - 背景底色 */
  --color-parchment: #EDE8DB;        /* 羊皮纸色 - 卡片背景 */
  --color-stone: #A89F91;            /* 石灰 - 次级信息 */
  --color-cream: #FFFEF9;            /* 奶白 - 纯净背景 */

  /* 功能色 */
  --color-success: #2D5016;          /* 深橄榄绿 */
  --color-warning: #8B6914;          /* 与强调色保持同一语义（克制） */
  --color-error: #8A2F2F;            /* 深酒红（克制） */
  --color-info: #2B4D64;             /* 深蓝灰（克制） */

  /* 细线与分隔 */
  --color-border: #D4CFC4;           /* 细线边框 */
  --color-divider: #E8E4DB;          /* 分隔线 */

  /* 兼容旧变量（便于渐进迁移） */
  --color-white: var(--color-cream);
  --color-light-gray: var(--color-warm-ivory);
  --color-gray: var(--color-secondary);
  --color-dark: var(--color-primary);
  --color-dark-gray: #2A2A2A;

  /* 旧工程中出现的浅色变体（本方案拒绝渐变，但保留用于 hover/弱对比） */
  --color-primary-light: #2A2A2A;
  --color-primary-lighter: #3A3A3A;
  --color-secondary-light: #6A6A6A;
  --color-secondary-lighter: #8A8A8A;
  --color-accent-light: #9C7718;

  /* ========== 字体系统 ========== */
  /* 中文字体 */
  --font-cn-heading: "思源宋体", "Source Han Serif SC", "Noto Serif SC", "Songti SC", serif;
  --font-cn-body: "思源黑体", "Source Han Sans SC", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* 英文/品牌字体 */
  --font-en-display: "Cormorant Garamond", "Times New Roman", serif;
  --font-en-body: "Inter", "Helvetica Neue", Arial, system-ui, -apple-system, sans-serif;

  /* 兼容旧变量 */
  --font-family-sans: var(--font-cn-body);
  --font-family-serif: var(--font-cn-heading);
  --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  /* 字号体系 */
  --text-hero: clamp(48px, 6vw, 72px);      /* 首屏主标题 */
  --text-section: clamp(32px, 4vw, 48px);   /* 板块标题 */
  --text-card: clamp(20px, 2.5vw, 28px);    /* 卡片标题 */
  --text-body: 16px;                         /* 正文 */
  --text-caption: 14px;                      /* 辅助说明 */
  --text-small: 12px;                        /* 小字 */

  /* 行高 */
  --leading-tight: 1.2;
  --leading-normal: 1.6;
  --leading-relaxed: 1.8;

  /* 字间距 */
  --tracking-wide: 0.15em;                   /* 品牌名称 */
  --tracking-normal: 0.05em;                 /* 标题 */

  /* 兼容旧字号与行高（尽量映射到新体系） */
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 24px;
  --font-size-3xl: 28px;
  --font-size-4xl: 32px;
  --font-size-5xl: 40px;
  --font-size-6xl: 48px;

  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;

  --line-height-tight: var(--leading-tight);
  --line-height-normal: var(--leading-normal);
  --line-height-relaxed: var(--leading-relaxed);
  --line-height-loose: 2;

  --letter-spacing-tight: 0.02em;
  --letter-spacing-normal: var(--tracking-normal);
  --letter-spacing-wide: var(--tracking-wide);

  /* ========== 间距与布局系统 ========== */
  --space-unit: 8px;
  --space-xs: calc(var(--space-unit) * 1);   /* 8px */
  --space-sm: calc(var(--space-unit) * 2);   /* 16px */
  --space-md: calc(var(--space-unit) * 3);   /* 24px */
  --space-lg: calc(var(--space-unit) * 5);   /* 40px */
  --space-xl: calc(var(--space-unit) * 8);   /* 64px */
  --space-2xl: calc(var(--space-unit) * 12); /* 96px */
  --space-3xl: calc(var(--space-unit) * 16); /* 128px */

  /* 兼容旧 spacing 命名 */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 12px;
  --spacing-lg: 16px;
  --spacing-xl: 24px;
  --spacing-2xl: 32px;
  --spacing-3xl: 48px;
  --spacing-4xl: 64px;
  --spacing-5xl: 80px;

  /* 内容最大宽度 */
  --max-width-content: 1200px;
  --max-width-wide: 1440px;
  --max-width-full: 1600px;

  /* 网格系统 */
  --grid-columns: 12;
  --grid-gap: 32px;

  /* ========== 断点系统 ========== */
  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;

  /* ========== 形状与动效（克制） ========== */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 18px;
  --radius-2xl: 24px;
  --radius-full: 9999px;

  /* 兼容旧圆角变量 */
  --border-radius-none: 0;
  --border-radius-sm: 4px;
  --border-radius-md: var(--radius-md);
  --border-radius-lg: var(--radius-lg);
  --border-radius-xl: var(--radius-xl);
  --border-radius-2xl: var(--radius-2xl);
  --border-radius-full: var(--radius-full);

  /* 阴影（克制、偏暖） */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-sm: 0 6px 18px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 12px 40px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.12);
  --shadow-xl: 0 28px 80px rgba(0, 0, 0, 0.14);
  --shadow-2xl: 0 36px 120px rgba(0, 0, 0, 0.16);
  --shadow-inner: inset 0 1px 2px rgba(0, 0, 0, 0.05);

  /* 过渡效果 */
  --transition-fast: 150ms ease;
  --transition-base: 220ms ease;
  --transition-slow: 360ms ease;

  /* 边框 */
  --border-width-thin: 1px;
  --border-width-base: 2px;
  --border-width-thick: 4px;

  /* ========== Z-index 层级 ========== */
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal-backdrop: 400;
  --z-modal: 500;
  --z-popover: 600;
  --z-tooltip: 700;
}
