/* ==========================================================================
   佳泰企業網站 — 設計 Token
   對應 02_設計規格表.md 第 1 節（等比縮放）與第 2 節（色彩實測值）
   ========================================================================== */

:root {
  /* --- 色彩：AI 稿像素實測值（預設色盤 mockup）--- */
  --c-navy:        #062046;  /* H1、區段大標 */
  --c-teal:        #004955;  /* 頂列、Footer、卡片標題、導覽、標籤 */
  --c-orange:      #C97D21;  /* CTA、編號、眉標、勾選 */
  --c-text:        #687589;  /* 內文 */
  --c-white:       #FFFFFF;
  --c-bg-hero:     #F7F8F8;
  --c-bg-section:  #F4F4F4;
  --c-teal-soft:   #E8F4F4;
  --c-orange-soft: #FCF4E8;
  --c-check-bg:    #F0E4D2;
  --c-check-bg-sm: #F4E0C4;
  --c-chip:        #F0F0F0;
  --c-border:      #D6DCE0;
  --c-error:       #C0392B;

  --shadow-card: 0 1px 4px rgba(0, 0, 0, .06);

  /* --- 等比縮放（第 1 節）---
     u = 可用視窗寬 ÷ 1294。以 container query 單位計算，
     不含捲軸寬度，避免 Windows 捲軸造成水平捲動。純 CSS，不需 JS。 */
  --design-base: 1294;
  --u: calc(100cqw / 1294);

  /* 下限：字級 12px、線條 1px */
  --u-min-font: 12px;
  --hairline: max(1px, calc(1.5 * var(--u)));

  --radius-card: calc(8 * var(--u));
  --radius-btn: calc(6 * var(--u));
  --transition: 160ms ease;

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

/* --- 正式 CI 色盤（旗標切換：MT_BRAND_PALETTE=ci）---
   取自公司正式 Logo SVG：綠 #139139、深藍 #263676。
   預設不啟用，切換前請先確認品牌方接受整站換色。 */
[data-palette="ci"] {
  --c-navy:        #1B2A5E;
  --c-teal:        #0F7A31;
  --c-orange:      #C97D21;
  --c-teal-soft:   #E6F3EA;
  --c-orange-soft: #FCF4E8;
  --c-text:        #5E6B7E;
}

/* 超寬螢幕：鎖定 1920 的比例，內容置中（第 1 節「縮放上限」） */
.scale-root {
  container-type: inline-size;
  container-name: page;
  max-width: var(--design-max-width, 1920px);
  margin-inline: auto;
  background: var(--c-white);
}

/* 平板與手機改用固定字級階級（第 9.2 節），u 不再驅動字型 */
@media (max-width: 1023px) {
  :root {
    --radius-card: 8px;
    --radius-btn: 6px;
    --hairline: 1px;
  }
}

/* 減少動態 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}