/* =========================================================
   云梦智能 · Design Tokens
   Source of truth: DESIGN.md §4 (color), §5 (type), §6 (spacing)
   All page CSS must reference these variables via var(--token).
   ========================================================= */

:root {
  /* ---- Brand & semantic color (DESIGN.md §4) ---- */
  --color-primary: #146EF5;
  --color-primary-strong: #0B4FD8;
  --color-primary-soft: #E7F0FE;
  --color-secondary: #00B8D9;
  --color-secondary-soft: #DDF6FB;
  --color-accent: #FF7A45;
  --color-accent-soft: #FFE8DD;
  --color-ai-lime: #A7E92F;

  --color-bg: #F6F8FB;
  --color-bg-grad: linear-gradient(180deg, #F8FAFD 0%, #EEF4FA 100%);
  --color-surface: #FFFFFF;
  --color-surface-soft: #EEF4FA;
  --color-surface-elev: #FBFCFE;

  --color-text: #0B1220;
  --color-text-strong: #060912;
  --color-muted: #526071;
  --color-muted-soft: #8A95A4;
  --color-border: #DCE4EE;
  --color-border-soft: #ECF1F7;
  --color-divider: rgba(11, 18, 32, 0.06);

  --color-success: #16A34A;
  --color-warning: #F59E0B;
  --color-error: #DC2626;

  /* Dark canvas (footer / single technical block) */
  --color-dark: #0B1220;
  --color-dark-soft: #131B2C;
  --color-dark-border: rgba(255, 255, 255, 0.10);
  --color-dark-text: rgba(255, 255, 255, 0.92);
  --color-dark-muted: rgba(255, 255, 255, 0.62);

  /* ---- Type system (DESIGN.md §5) ---- */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "HarmonyOS Sans SC", "Microsoft YaHei", "Helvetica Neue", "Noto Sans SC",
    "Noto Sans", Roboto, Arial, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", ui-monospace, "Cascadia Code",
    "Source Code Pro", Menlo, Consolas, monospace;

  /* fluid-ish but capped per DESIGN.md (no vw-based scaling for body) */
  --fs-display: 56px;
  --fs-h1: 48px;
  --fs-h2: 36px;
  --fs-h3: 22px;
  --fs-body-lg: 18px;
  --fs-body: 16px;
  --fs-caption: 13px;
  --fs-button: 15px;

  --lh-display: 1.08;
  --lh-h1: 1.12;
  --lh-h2: 1.18;
  --lh-h3: 1.35;
  --lh-body: 1.75;
  --lh-body-lg: 1.65;
  --lh-caption: 1.5;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-strong: 650;
  --fw-bold: 700;
  --fw-extrabold: 750;

  /* ---- Spacing (DESIGN.md §6 8pt grid) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* ---- Containers ----
     版心断点（user-spec, 2026-05-08）：
       默认 / < 1400px viewport  → 1300px max
       ≥ 1400px (1400 ~ 1920)   → 1400px max
       ≥ 1920px (1920 ~ 2560+)  → 1500px max
     在 viewport < 1300px 时容器以 100% 宽度自然收缩，保留两侧 padding。 */
  --container-max: 1300px;
  --container-wide: 1300px;
  --container-prose: 760px;
  --section-py-desktop: 112px;
  --section-py-tablet: 88px;
  --section-py-mobile: 64px;

  /* ---- Radius ---- */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 999px;

  /* ---- Shadow ---- */
  --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-card-hover: 0 8px 24px rgba(15, 23, 42, 0.08);
  --shadow-pop: 0 16px 40px rgba(15, 23, 42, 0.10);
  --shadow-hero: 0 28px 80px rgba(20, 110, 245, 0.16);
  --shadow-deep: 0 32px 80px rgba(7, 13, 25, 0.20);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in: cubic-bezier(0.55, 0.08, 0.86, 0.36);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 160ms;
  --dur-base: 240ms;
  --dur-slow: 380ms;

  /* ---- Layered z-index ---- */
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-modal: 800;
  --z-toast: 1000;
}

/* DESIGN.md §5 responsive type */
@media (max-width: 1023px) {
  :root {
    --fs-display: 44px;
    --fs-h1: 38px;
    --fs-h2: 30px;
    --fs-h3: 20px;
    --section-py-desktop: var(--section-py-tablet);
  }
}
@media (max-width: 767px) {
  :root {
    --fs-display: 34px;
    --fs-h1: 30px;
    --fs-h2: 26px;
    --fs-h3: 18px;
    --fs-body-lg: 16px;
    --section-py-desktop: var(--section-py-mobile);
    --section-py-tablet: var(--section-py-mobile);
  }
}

/* ---- Wider viewports (≥ 1400px) ----
   1400 ~ 1920 区间的版心宽度。section 间距保持 DESIGN.md §6 默认值，
   typography 字号继续遵守 §5 上限，不在宽屏下放大。 */
@media (min-width: 1400px) {
  :root {
    --container-max: 1400px;
    --container-wide: 1400px;
  }
}

/* ---- Ultra-wide viewports (≥ 1920px) ----
   1920 ~ 2560+ 区间，版心固定 1500px；超过 2560 也保持此宽度，
   两侧留白用于呼吸，不再继续拉伸内容。 */
@media (min-width: 1920px) {
  :root {
    --container-max: 1500px;
    --container-wide: 1500px;
  }
}