/* 全局 CSS 变量 - 颜色和字体 */
:root {
    /* ========== 颜色变量 ========== */

    /* 主色调 */
    --color-accent: #ccb899;

    /* 表面色系 */
    --color-surface-50: #FAF9F6;
    --color-surface-100: #F5F5F0;
    --color-surface-200: #E6E6E0;
    --color-surface-900: #2D2A26;

    /* ========== 字体变量 ========== */

    /* 字体家族 - 统一使用 Outfit */
    --font-sans: 'Outfit', 'Google Sans', sans-serif;
    --font-display: 'Outfit', 'Google Sans', sans-serif;
    --font-serif: Georgia, 'Times New Roman', serif;
    --font-mono: Monaco, Menlo, 'Courier New', monospace;

    /* 字体大小 */
    --font-size-xs: 0.75rem;
    /* 12px */
    --font-size-sm: 0.875rem;
    /* 14px */
    --font-size-base: 1rem;
    /* 16px */
    --font-size-lg: 1.125rem;
    /* 18px */
    --font-size-xl: 1.25rem;
    /* 20px */
    --font-size-2xl: 1.5rem;
    /* 24px */
    --font-size-3xl: 1.875rem;
    /* 30px */
    --font-size-4xl: 2.25rem;
    /* 36px */
    --font-size-5xl: 3rem;
    /* 48px */
    --font-size-6xl: 3.75rem;
    /* 60px */
    --font-size-7xl: 4.5rem;
    /* 72px */
    --font-size-8xl: 6rem;
    /* 96px */

    /* 字重 */
    --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: 1.25;
    --line-height-snug: 1.375;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.625;
    --line-height-loose: 2;

    /* 字间距 */
    --letter-spacing-tighter: -0.05em;
    --letter-spacing-tight: -0.025em;
    --letter-spacing-normal: 0em;
    --letter-spacing-wide: 0.025em;
    --letter-spacing-wider: 0.05em;
    --letter-spacing-widest: 0.1em;

    /* ========== 布局变量 ========== */

    /* 容器最大宽度 */
    --container-max-width: 1240px;

    /* 圆角 */
    --radius-sm: 0.125rem;
    /* 2px */
    --radius-base: 0.25rem;
    /* 4px */
    --radius-md: 0.375rem;
    /* 6px */
    --radius-lg: 0.5rem;
    /* 8px */
    --radius-xl: 0.75rem;
    /* 12px */
    --radius-2xl: 1.5rem;
    /* 24px */
    --radius-3xl: 2rem;
    /* 32px */
    --radius-full: 9999px;

    /* 间距 */
    --spacing-px: 1px;
    --spacing-1: 0.25rem;
    /* 4px */
    --spacing-2: 0.5rem;
    /* 8px */
    --spacing-3: 0.75rem;
    /* 12px */
    --spacing-4: 1rem;
    /* 16px */
    --spacing-5: 1.25rem;
    /* 20px */
    --spacing-6: 1.5rem;
    /* 24px */
    --spacing-8: 2rem;
    /* 32px */
    --spacing-10: 2.5rem;
    /* 40px */
    --spacing-12: 3rem;
    /* 48px */
    --spacing-16: 4rem;
    /* 64px */
    --spacing-20: 5rem;
    /* 80px */
    --spacing-24: 6rem;
    /* 96px */

    /* Z-index 层级 */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;
}

/* ========== 全局样式 ========== */

/* 基础字体设置 */
body {
    font-family: var(--font-sans);
    color: var(--color-surface-900);
    background-color: var(--color-surface-50);
}

/* 标题字体 */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-display);
}

/* 选择文本颜色 */
::selection {
    background-color: var(--color-accent);
    color: var(--color-white);
}

::-moz-selection {
    background-color: var(--color-accent);
    color: var(--color-white);
}

/* 平滑滚动 */
html {
    scroll-behavior: smooth;
}

/* 链接样式 */
a {
    transition: color 0.2s ease;
}

/* 按钮基础样式 */
button {
    font-family: var(--font-sans);
    transition: all 0.2s ease;
}

/* 输入框基础样式 */
input,
textarea,
select {
    font-family: var(--font-sans);
}