/* ========================================
   女王AI获客工作室 - 设计Token变量
   紫罗兰 + 玫瑰金主题
   ======================================== */

:root {
  /* === 主色系 === */
  --color-primary: #6B2FA0;
  --color-primary-light: #8B4FC0;
  --color-primary-dark: #4A1A70;
  --color-primary-10: rgba(107, 47, 160, 0.10);
  --color-primary-20: rgba(107, 47, 160, 0.20);
  --color-primary-30: rgba(107, 47, 160, 0.30);

  --color-accent: #B76E79;
  --color-accent-light: #D4949E;
  --color-accent-dark: #9A555F;

  /* === 中性色系 === */
  --color-white: #FFFFFF;
  --color-off-white: #F8F6F9;
  --color-light-gray: #EDE8F0;
  --color-mid-gray: #9B8FA6;
  --color-dark-gray: #4A3F52;
  --color-black: #1A1118;

  /* === 功能色 === */
  --color-success: #4CAF50;
  --color-error: #E53935;
  --color-warning: #FFA726;

  /* === 渐变 === */
  --gradient-hero: linear-gradient(135deg, #6B2FA0 0%, #B76E79 100%);
  --gradient-hero-reverse: linear-gradient(135deg, #B76E79 0%, #6B2FA0 100%);
  --gradient-card: linear-gradient(180deg, rgba(107, 47, 160, 0.04) 0%, rgba(183, 110, 121, 0.04) 100%);
  --gradient-section: linear-gradient(180deg, var(--color-off-white) 0%, var(--color-white) 100%);
  --gradient-text: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);

  /* === 字体 === */
  --font-primary: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --font-display: 'Noto Serif SC', 'PingFang SC', serif;

  /* === 字号 === */
  --fs-hero: clamp(2rem, 5vw, 3.5rem);
  --fs-h1: clamp(1.75rem, 4vw, 2.5rem);
  --fs-h2: clamp(1.5rem, 3vw, 2rem);
  --fs-h3: clamp(1.25rem, 2.5vw, 1.5rem);
  --fs-body: clamp(0.9rem, 1.2vw, 1rem);
  --fs-small: 0.875rem;
  --fs-caption: 0.75rem;

  /* === 行高 === */
  --lh-heading: 1.3;
  --lh-body: 1.7;

  /* === 间距 === */
  --sp-xs: 0.5rem;
  --sp-sm: 1rem;
  --sp-md: 1.5rem;
  --sp-lg: 2rem;
  --sp-xl: 3rem;
  --sp-2xl: 4rem;
  --sp-section: clamp(3rem, 8vw, 6rem);

  /* === 圆角 === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  /* === 阴影 === */
  --shadow-sm: 0 1px 3px rgba(107, 47, 160, 0.08);
  --shadow-md: 0 4px 12px rgba(107, 47, 160, 0.12);
  --shadow-lg: 0 8px 24px rgba(107, 47, 160, 0.16);
  --shadow-card: 0 2px 8px rgba(74, 26, 112, 0.10);
  --shadow-card-hover: 0 8px 16px rgba(74, 26, 112, 0.18);

  /* === 过渡 === */
  --transition-fast: 150ms ease;
  --transition-normal: 300ms ease;
  --transition-slow: 500ms ease;

  /* === 容器宽度 === */
  --container-max: 1200px;
  --container-narrow: 800px;

  /* === z-index层级 === */
  --z-base: 1;
  --z-dropdown: 10;
  --z-sticky: 50;
  --z-fixed: 100;
  --z-overlay: 200;
  --z-modal: 300;
}
