/* ===================================================================
   大成汇官网 · main.css
   设计令牌 / 基础重置 / 排版 / 布局容器
   =================================================================== */

:root {
    /* ---- 深空配色 ---- */
    --bg-cosmos:      #0A0E1A;   /* 主背景 深空 */
    --bg-secondary:   #111827;   /* 次级背景 */
    --bg-elevated:    #161E2E;   /* 卡片/面板 */

    --c-cyan:         #40B8F0;   /* 主强调 海蓝 */
    --c-cyan-soft:    #22D3EE;
    --c-blue:         #3B82F6;   /* 次强调 蓝 */
    --c-blue-soft:    #60A5FA;
    --c-purple:       #8B5CF6;   /* 辅助 紫 */
    --c-purple-soft:  #A78BFA;
    --c-orange:       #FB923C;   /* 警示/数据 橙 */
    --c-green:        #10B981;   /* 成功 绿 */

    /* 对比色（暖橘）：静态品牌强调色，不再随天气联动 */
    --c-contrast:     hsl(22 90% 62%);

    --text-primary:   #E5E7EB;   /* 正文 */
    --text-secondary: #9CA3AF;   /* 辅助 */
    --text-dim:       #6B7280;   /* 弱化 */

    --border-glass:   rgba(255,255,255,0.10);
    --border-glow:    rgba(64,184,240,0.35);
    --border:         var(--border-glass);   /* 通用边框变量别名 */

    /* ---- 分层浮层令牌默认值（与 includes/front_theme.php derive() 暗色基准一致；主题会按 data-theme 覆盖） ----
       供顶部导航滚动遮罩 / 底部隐私同意栏等全局浮层组件使用，确保在未应用 data-theme 或自定义主题未注入时也有安全兜底 */
    --bg-drawer:      rgba(16,22,36,0.97);
    --surface-hover:  color-mix(in srgb, var(--c-cyan) 12%, transparent);
    --surface-active: color-mix(in srgb, var(--c-cyan) 20%, transparent);
    --glass-bg:       rgba(255,255,255,0.04);
    --glass-border:   rgba(255,255,255,0.08);
    --drawer-shadow:  rgba(0,0,0,0.40);
    --hairline:       rgba(255,255,255,0.10);

    /* ---- 字体 ---- */
    --font-cn: "PingFang SC", "Microsoft YaHei", "Source Han Sans SC", "Noto Sans SC", sans-serif;
    --font-en: "Orbitron", "Rajdhani", "Segoe UI", sans-serif;

    /* ---- 间距尺度 ---- */
    --sp-1: 8px;  --sp-2: 16px; --sp-3: 24px; --sp-4: 40px;
    --sp-5: 64px; --sp-6: 96px; --sp-7: 128px;

    /* ---- 动效曲线（premium 缓动） ---- */
    --ease-premium: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth:  cubic-bezier(0.4, 0, 0.2, 1);

    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;

    --maxw: 1440px;
    --nav-h: 84px;            /* 固定导航高度，供 scroll-padding-top 使用 */
}

/* ---- 重置 ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    scroll-padding-top: var(--nav-h);       /* 锚点跳转时给固定导航留位，避免顶到栏下 */
}

body {
    font-family: var(--font-cn);
    background: var(--bg-cosmos);
    color: var(--text-primary);
    line-height: 1.7;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    scroll-padding-top: var(--nav-h);
    /* 吸底隐私条是 fixed bottom:0，滚到页底会盖住页脚；预留等于其高度的内边距留出空白，
       吸底条覆盖该空白而非页脚内容（变量隐藏时为 0px，无条时不留空隙）。 */
    padding-bottom: var(--consent-bar-height, 0px);
}

/* 滚动体验：取消整屏强制吸附，回归自然平滑滚动，确保页面内容完整可达 */

/* 全局星空渐变底色 */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    background:
        radial-gradient(1200px 600px at 80% -10%, rgba(64,184,240,0.10), transparent 60%),
        radial-gradient(900px 500px at 10% 10%, rgba(139,92,246,0.10), transparent 60%),
        var(--bg-cosmos);
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
ul { list-style: none; }

/* ---- 排版 ---- */
h1, h2, h3, h4 { font-weight: 700; line-height: 1.25; letter-spacing: .5px; }
.gradient-text {
    background: linear-gradient(100deg, var(--c-cyan) 0%, var(--c-blue) 45%, var(--c-purple) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* ---- 布局容器 ---- */
.container { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--sp-3); }

/* ---- 通用 section ---- */
.section { padding: var(--sp-7) 0; position: relative; }
.section-head { text-align: center; max-width: 720px; margin: 0 auto var(--sp-5); }
.section-tag {
    font-family: var(--font-en);
    font-size: 13px;
    letter-spacing: 4px;
    color: var(--c-cyan);
    margin-bottom: var(--sp-2);
}
.section-title { font-size: clamp(28px, 4vw, 44px); margin-bottom: var(--sp-2); }
.section-desc { color: var(--text-secondary); font-size: 16px; }

.center-btn { text-align: center; margin-top: var(--sp-5); }

/* ---- 玻璃拟态基础类 ---- */
.glass {
    background: var(--glass-bg, rgba(255,255,255,0.04));
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    border: 1px solid var(--border-glass);
    border-radius: var(--radius-md);
}

/* 页面内容淡入（与加载序列交叉淡入淡出） */
.page-shell { opacity: 0; transform: translateY(12px); transition: opacity .6s var(--ease-premium), transform .6s var(--ease-premium); }
body.page-ready .page-shell { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    .page-shell { opacity: 1 !important; transform: none !important; transition: none !important; }
}
