/* ============================================================
   variables.css — Dalog 设计令牌
   来源: dalog-web/PLAN.md §6
   必须最先加载,后续所有 CSS 文件继承这些变量
   ============================================================ */

:root {
  /* ----------------------------------------------------------
     1. 主色板
     ---------------------------------------------------------- */
  --color-primary:        #165DFF;
  --color-primary-hover:  #0E4AD8;
  --color-primary-soft:   #E8F0FF;
  --color-accent:         #FF7D00;
  --color-accent-hover:   #E66E00;

  /* ----------------------------------------------------------
     2. 文本色板(对比度均满足 WCAG AA)
     ---------------------------------------------------------- */
  --color-text-primary:   #1D2129;
  --color-text-secondary: #4E5969;
  --color-text-tertiary:  #86909C;
  --color-text-inverse:   #FFFFFF;

  /* ----------------------------------------------------------
     3. 背景 / 边框
     ---------------------------------------------------------- */
  --color-bg:             #FFFFFF;
  --color-bg-soft:        #F7F8FA;
  --color-bg-elevated:    #FFFFFF;
  --color-border:         #E5E6EB;
  --color-border-soft:    #F2F3F5;

  /* ----------------------------------------------------------
     4. 股票涨跌色(中股惯例:红涨绿跌)
     ---------------------------------------------------------- */
  --color-stock-up:       #E11D48;
  --color-stock-up-bg:    #FEF2F4;
  --color-stock-down:     #16A34A;
  --color-stock-down-bg:  #ECFDF5;

  /* ----------------------------------------------------------
     5. 渐变(Hero / 装饰用)
     ---------------------------------------------------------- */
  --gradient-hero:        linear-gradient(135deg, #165DFF 0%, #4080FF 50%, #00C6FF 100%);
  --gradient-cta:         linear-gradient(135deg, #FF7D00 0%, #FF4A0 100%);
  --gradient-section:     linear-gradient(180deg, #F7F8FA 0%, #FFFFFF 100%);

  /* ----------------------------------------------------------
     6. 字体
     ---------------------------------------------------------- */
  --font-family: -apple-system, BlinkMacSystemFont, "PingFang SC",
                 "Microsoft YaHei", "Segoe UI", Roboto, "Helvetica Neue",
                 Arial, sans-serif;

  --font-size-hero:    clamp(2.25rem, 4.5vw, 3.5rem);
  --font-size-h2:      clamp(1.625rem, 2.8vw, 2.25rem);
  --font-size-h3:      clamp(1.25rem, 1.8vw, 1.5rem);
  --font-size-h4:      1.125rem;
  --font-size-body:    1rem;
  --font-size-small:   0.875rem;
  --font-size-xs:      0.75rem;

  --font-weight-bold:    700;
  --font-weight-semibold: 600;
  --font-weight-medium:  500;
  --font-weight-normal:  400;

  --line-height-tight:   1.25;
  --line-height-normal:  1.5;
  --line-height-loose:   1.75;

  /* ----------------------------------------------------------
     7. 间距(8 点栅格)
     ---------------------------------------------------------- */
  --space-1:  8px;
  --space-2:  16px;
  --space-3:  24px;
  --space-4:  32px;
  --space-5:  48px;
  --space-6:  64px;
  --space-7:  96px;
  --space-8:  128px;

  /* ----------------------------------------------------------
     8. 容器与栅格
     ---------------------------------------------------------- */
  --container-max: 1200px;
  --container-pad-desktop: 24px;
  --container-pad-mobile:  16px;

  --section-pad-desktop: 96px;
  --section-pad-mobile:  56px;

  /* ----------------------------------------------------------
     9. 圆角
     ---------------------------------------------------------- */
  --radius-sm:   6px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   20px;
  --radius-full: 9999px;

  /* ----------------------------------------------------------
     10. 阴影层级
     ---------------------------------------------------------- */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.12);
  --shadow-cta: 0 8px 20px rgba(255, 125, 0, 0.35);

  /* ----------------------------------------------------------
     11. 动效时长
     ---------------------------------------------------------- */
  --duration-fast:  120ms;
  --duration-base:  200ms;
  --duration-slow:  360ms;
  --ease-out:       cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:    cubic-bezier(0.4, 0, 0.2, 1);

  /* ----------------------------------------------------------
     12. 层级(z-index)
     ---------------------------------------------------------- */
  --z-base:    1;
  --z-elevated: 10;
  --z-sticky:   100;
  --z-overlay:  500;
  --z-modal:    1000;

  /* ----------------------------------------------------------
     13. 断点(参考用,CSS @media 直接用数值)
     ---------------------------------------------------------- */
  /* --bp-xs: 576px; */
  /* --bp-md: 768px; */
  /* --bp-lg: 1024px; */
  /* --bp-xl: 1280px; */
}

/* ----------------------------------------------------------
    全局基线
    ---------------------------------------------------------- */
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-family);
  font-size: var(--font-size-body);
  line-height: var(--line-height-normal);
  color: var(--color-text-primary);
  background-color: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 减弱动效偏好(可访问性) */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}