/* =============================================
   CSS 变量 - 天津国昊装饰装修工程有限公司官网
   所有颜色、字体、间距统一从此文件引用
   断点：移动端 768px
   ============================================= */

:root {
  /* 颜色 */
  --color-primary:      #1a5276; /* 主色：深蓝，专业感 */
  --color-primary-dark: #154360; /* 主色深色，用于 hover */
  --color-accent:       #e67e22; /* 强调色：橙色，装修活力 */
  --color-accent-dark:  #ca6f1e; /* 强调色深色，用于 hover */
  --color-accent-strong:#b35309; /* 深橙：浅底上的小号文字，满足 WCAG 对比度 */
  --color-accent-hover: #9a4708; /* 深橙按钮 hover，需比 accent-strong 更深 */
  --color-accent-on-dark: #f5b783; /* 深色背景上的橙色文字 */
  --color-bg:           #f8f9fa; /* 页面背景 */
  --color-bg-section:   #ffffff; /* 交替 section 背景 */
  --color-text:         #2c3e50; /* 正文色 */
  --color-text-muted:   #667377; /* 浅色背景次要文字 */
  --color-text-on-dark: #9aa5a8; /* 深色背景次要文字 */
  --color-white:        #ffffff;
  --color-border:       #dee2e6; /* 通用边框 */

  /* 字体 */
  --font-base: -apple-system, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", sans-serif;
  /* 工程感字体：用于数字、英文小标、电话号码。
     原栈以 Consolas 兜底，Windows 上会渲染成代码字体，与 Mac 上的 DIN 观感差异很大。
     现改为一条各平台都落在 DIN 系窄体上的链，不引入网络字体（规避 CDN 与 FOUT）：
       macOS/iOS  → DIN Alternate（系统自带）
       Windows10+ → Bahnschrift（微软基于 DIN 的变体字，系统自带）
       Android    → Roboto Condensed
       旧系统兜底 → Arial Narrow */
  --font-technical: "DIN Alternate", "Bahnschrift SemiCondensed", "Bahnschrift",
                    "Roboto Condensed", "Arial Narrow", sans-serif;
  --font-size-base: 16px;
  --font-size-sm:   14px;
  --font-size-lg:   18px;
  --font-size-xl:   24px;
  --font-size-2xl:  36px;
  --line-height-base: 1.7;

  /* 工程蓝图网格底纹（叠在深色背景上，营造图纸质感） */
  --blueprint:
    linear-gradient(rgba(255, 255, 255, 0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.09) 1px, transparent 1px);

  /* 间距（8px 基准倍数） */
  --space-1:  8px;
  --space-2:  16px;
  --space-3:  24px;
  --space-4:  32px;
  --space-6:  48px;
  --space-8:  64px;

  /* 阴影 */
  --shadow-card: 0 2px 12px rgba(0, 0, 0, 0.08);
  --shadow-nav:  0 2px 8px rgba(0, 0, 0, 0.12);

  /* 圆角 */
  --radius-card: 8px;
  --radius-btn:  4px;

  /* 过渡 */
  --transition-base: 0.25s ease;
}
