:root {
    /* ==================== RWD 文字大小系統（11 級，無縫連接）==================== */
    --fs-5xl: clamp(2.5rem, 6vw, 3rem); /* H1 特殊 (40-48px) */
    --fs-4xl: clamp(2rem, 5vw, 2.5rem); /* H1 (32-40px) */
    --fs-3xl: clamp(1.75rem, 4vw, 2rem); /* H2 (28-32px) */
    --fs-2xl: clamp(1.5rem, 3.5vw, 1.75rem); /* H3 (24-28px) */
    --fs-xl: clamp(1.25rem, 3vw, 1.5rem); /* H4 (20-24px) */
    --fs-lg: clamp(1.125rem, 2.5vw, 1.25rem); /* H5 (18-20px) */
    --fs-md: clamp(1rem, 2vw, 1.125rem); /* H6 (16-18px) */
    --fs-base: clamp(0.875rem, 1.8vw, 1rem); /* P 內文 (14-16px) */
    --fs-sm: clamp(0.8125rem, 1.5vw, 0.875rem); /* small (13-14px) */
    --fs-xs: clamp(0.75rem, 1.2vw, 0.8125rem); /* 註解 (12-13px) */
    --fs-2xs: clamp(0.6875rem, 1vw, 0.75rem); /* 極小字 (11-12px) */

    /* ==================== 特殊用途字型大小 ==================== */
    --fs-display: clamp(
        2.5rem,
        8vw,
        4.5rem
    ); /* 展示用大字 (40-72px) 跑馬燈、超大標題等 */

    /* ==================== 字重系統 (配合 Noto Sans TC) ==================== */
    --fw-thin: 100; /* 符號分隔線 */
    --fw-light: 300; /* 大標題、精緻風格 */
    --fw-regular: 400; /* 內文、一般文字 */
    --fw-medium: 500; /* 小標題、次強調 */
    --fw-semibold: 600; /* 中標、按鈕、標籤 */
    --fw-bold: 700; /* 重要標題、CTA */

    /* ==================== 基礎顏色 ==================== */
    --black: black;
    --white: white;
    --transparent: rgba(255, 255, 255, 0);

    /* ==================== 基礎顏色不透明度變體 ==================== */
    /* 白色不透明度 */
    --white-opacity-5: #ffffff0d;
    --white-opacity-10: #ffffff1a;
    --white-opacity-20: #fff3;

    /* 黑色不透明度 */
    --black-opacity-5: #0000000d;
    --black-opacity-10: #0000001a;
    --black-opacity-30: #0000004d;
    --black-opacity-50: #00000080;

    /* ==================== 灰階色系 ==================== */
    --gray-50: #fafafa;
    --gray-100: #f2f2f2;
    --gray-200: #d9d9d9;
    --gray-300: #d4d4d4;
    --gray-400: #a3a3a3;
    --gray-500: #999;
    --gray-600: #666;
    --gray-700: #404040;
    --gray-800: #333;
    --gray-900: #171717;
    --gray-950: #0a0a0a;

    /* 灰色不透明度 */
    --gray-opacity-10: #8080801a;
    --gray-opacity-20: #80808033;

    /* 品牌色請參考 brand.css */

    /* ==================== 佈局變數 ==================== */
    --nav-height: 199px; /* 導航列高度預估值（桌面版），JS 載入後由 ResizeObserver 覆蓋為精確值 */
}

@media screen and (max-width: 1199.98px) {
    :root {
        --nav-height: 75px; /* 導航列高度預估值（手機版，僅 logo bar） */
    }
}