/* ============================================================
   FGXpress｜設計 Token 
   ------------------------------------------------------------
   品牌調性：單色金屬質感（黑／白／灰／銀），大留白、精緻、克制。
   對齊 FanGeX（鈁格子）金屬鉻質 logo。
   要調品牌長相只改這裡，全站一起變。
   ============================================================ */
:root {
  /* --- 底色與面：冷灰、乾淨 --- */
  --c-bg:          #F4F5F7;  /* 頁面底：冷淺灰 */
  --c-surface:     #FFFFFF;  /* 卡片面 */
  --c-surface-2:   #FAFBFC;  /* 次層面（收合區） */

  --c-ink:         #16181D;  /* 主文字：近黑 */
  --c-ink-2:       #464B54;  /* 次文字 */
  --c-ink-soft:    #8A9099;  /* 輔助/說明 */
  --c-line:        #E5E7EB;  /* 細分隔線 */
  --c-line-2:      #EEF0F2;

  /* --- 主行動色：石墨近黑（premium CTA） --- */
  --c-primary:     #1B1E24;
  --c-primary-600: #0A0C10;  /* hover / 按下 */
  --c-primary-050: #F0F1F3;  /* 選中淡底（冷調） */
  --c-primary-ring:#1B1E2433;/* 選中外框（半透明） */
  --c-accent:      #2E6BD6;  /* 藍色重點：目前所在章節（與 hover 灰區別） */

  /* --- 金屬銀漸層：用在品牌字標/進度/精緻點綴（少量） --- */
  --c-metal:       linear-gradient(135deg, #B8BCC4 0%, #EDEFF2 42%, #A7ADB6 100%);
  --c-metal-line:  linear-gradient(90deg, #C9CDD3, #EDEFF2, #AEB4BC);

  --c-success:     #2F8F6B;
  --c-warn:        #B07D2B;
  --c-danger:      #C0453B;

  /* --- 圓角：俐落、不過圓 --- */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-pill: 999px;

  /* --- 間距（8pt 系統） --- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px; --s-7: 48px;

  /* --- 陰影：冷、克制、premium --- */
  --sh-1: 0 1px 2px rgba(20, 22, 28, .06);
  --sh-2: 0 8px 24px rgba(20, 22, 28, .10);
  --sh-3: 0 18px 48px rgba(20, 22, 28, .18);

  /* --- 字級 --- */
  --f-xs: 12px; --f-sm: 13px; --f-md: 15px;
  --f-lg: 19px; --f-xl: 24px; --f-2xl: 32px;

  --font-sans: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei",
               system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* 版心寬 / 預約卡尺寸 */
  --content-max: 480px;         /* 手機優先窄版心，桌機置中 */
  --sheet-h: min(88vh, 720px);  /* 預約卡固定高度（內部捲動） */
}