:root {
    --bg-color: #05080c; 
    --panel-bg: #0d141f; 
    --text-primary: #e2e8f0;
    --text-secondary: #94a3b8;
    --tech-blue: #0ea5e9; 
    --culture-gold: #b89241; 
    --border-line: #1e293b;
    --vermilion-accent: #b91c1c; 
    --shield-orange: #d9772b;
    --font-heading: 'Noto Serif TC', 'serif', 'PMingLiU', 'SimSun'; 
    --font-body: 'PingFang TC', 'Microsoft JhengHei', 'Segoe UI', sans-serif;
}

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@500;700;900&display=swap');

body {
    font-family: var(--font-body);
    background-color: var(--bg-color);
    background-image: 
        radial-gradient(circle at 50% -20%, #1a2a44 0%, transparent 60%),
        linear-gradient(180deg, rgba(184, 146, 65, 0.02) 0%, transparent 100%);
    color: var(--text-primary);
    line-height: 1.8;
    margin: 0;
    padding: 0;
    letter-spacing: 0.8px;

    /* 👇 新增這三行：消除切片感，升級為旗艦級視覺 */
    background-repeat: no-repeat; /* 絕對禁止背景複製貼上 */
    background-size: cover;       /* 強制背景完美覆蓋整個視窗 */
    background-attachment: fixed; /* 將背景釘死在底層，讓內容在上面滑動 */
}

/* [00] 天際線：信任憑證宣告區 (Top Bar) - 升級為白底高對比 */
.trust-bar {
    background-color: #ffffff; /* 轉換為純白底色，完美包容所有 Logo */
    color: #374151; /* 備用文字改為深灰黑 */
    text-align: center;
    padding: 12px 15px;
    font-size: 0.9rem;
    letter-spacing: 1.5px;
    border-bottom: 3px solid var(--culture-gold); /* 底部邊線改為育昌的傳承金，作為明暗區的完美過渡 */
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5); /* 增加底部陰影，讓天際線浮現於深色背景之上 */
}
.trust-bar img { 
    height: 28px; /* 稍微放大一點 Logo，讓白底上的圖示更具氣勢 */
    vertical-align: middle; 
}
.trust-bar .divider { 
    color: #d1d5db; /* 分隔線改為淺灰色 */
    font-size: 1.2rem;
}
.trust-text-fallback { 
    font-family: var(--font-body); 
    font-weight: 600; 
    color: #111827; /* 備援文字使用極深色 */
}

.container { max-width: 900px; margin: 0 auto; padding: 0 20px 40px 20px; }

header {
    text-align: center;
    padding: 60px 0 50px 0;
    border-bottom: 2px dashed rgba(184, 146, 65, 0.2);
    margin-bottom: 50px;
    position: relative;
}
.brand-core { display: flex; flex-direction: column; align-items: center; margin-bottom: 15px; }

.logo-box { width: 110px; margin-bottom: 25px; display: flex; justify-content: center; align-items: center; }
.logo-box img { max-width: 100%; height: auto; filter: drop-shadow(0 5px 15px rgba(217, 119, 43, 0.4)); }

h1 {
    font-family: var(--font-heading); font-size: 2.8rem; margin: 0 0 10px 0; letter-spacing: 6px; font-weight: 700;
    background: linear-gradient(135deg, #fff 30%, var(--culture-gold) 70%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-shadow: 0 0 20px rgba(184, 146, 65, 0.2);
}
.company-en { font-size: 0.9rem; font-family: 'Segoe UI', sans-serif; color: var(--text-secondary); letter-spacing: 4px; margin-bottom: 20px; text-transform: uppercase; }

.slogan { font-size: 1.2rem; color: var(--text-secondary); font-weight: 300; letter-spacing: 4px; opacity: 0.9; }
.slogan span { color: var(--vermilion-accent); font-weight: bold; margin: 0 10px; }

footer { margin-top: 60px; border-top: 1px solid #1a2233; padding-top: 40px; display: flex; flex-direction: column; align-items: center; }
.cta-btn { display: inline-block; padding: 14px 40px; background-color: rgba(14, 165, 233, 0.05); color: var(--text-primary); text-decoration: none; font-weight: 500; border: 1px solid var(--tech-blue); transition: all 0.4s ease; letter-spacing: 2px; margin-bottom: 40px; }
.cta-btn:hover { background-color: var(--tech-blue); color: #fff; box-shadow: 0 0 20px rgba(14, 165, 233, 0.3); }

.biz-card-info { width: 100%; max-width: 700px; background: linear-gradient(180deg, #0a1018 0%, #05080c 100%); border: 1px solid var(--border-line); padding: 30px; display: grid; grid-template-columns: 1fr; gap: 20px; font-size: 0.95rem; color: var(--text-secondary); }
.info-row { display: flex; align-items: flex-start; border-bottom: 1px dashed #1a2233; padding-bottom: 15px; }
.info-row:last-child { border-bottom: none; padding-bottom: 0; }
.info-label { width: 100px; color: var(--culture-gold); font-family: var(--font-heading); letter-spacing: 2px; flex-shrink: 0; }
.info-data { flex-grow: 1; color: var(--text-primary); }
.info-data span.highlight { color: var(--tech-blue); font-family: monospace; font-size: 1.1em; }
.pm-name { font-family: var(--font-heading); font-size: 1.5rem; color: #fff; letter-spacing: 3px; }
.pm-en { font-family: 'Segoe UI', sans-serif; font-size: 1rem; color: var(--shield-orange); margin-left: 10px; }

/* 名片區實體座標超連結 - 古老與科技碰撞樣式 */
.info-data .map-link {
    color: var(--text-primary);
    text-decoration: none;
    border-bottom: 1px dashed var(--culture-gold); /* 預設：古風黛黑襯托下的古銅金虛線 */
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    display: inline-block;
}

.info-data .map-link:hover {
    color: var(--tech-blue); /* 觸發：科技藍光突穿 */
    border-bottom: 1px solid var(--tech-blue);
    text-shadow: 0 0 10px rgba(14, 165, 233, 0.5); /* 數據光暈效果 */
}

/* =========================================================
   戰情儀表板 (Data Dashboard) - 終極淨化整合版
========================================================= */
.data-dashboard {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
    padding: 30px 20px;
    background: linear-gradient(180deg, rgba(13, 20, 31, 0) 0%, rgba(13, 20, 31, 0.8) 100%);
    border-bottom: 1px solid var(--border-line);
    border-radius: 4px;
}

/* --- 1. 儀表板節點：啟用 Flexbox 解決排版坍塌 --- */
.data-node {
    position: relative;
    transition: background-color 0.4s ease;
    border-radius: 6px; 
    display: flex;             /* 啟動 Flexbox 引擎 */
    flex-direction: column;    /* 強制內容由上往下排 (數字在上、文字在下) */
    align-items: center;       /* 水平置中 */
    justify-content: center;   /* 垂直置中 */
    padding: 20px 10px;
}

/* 確保數字與文字浮在上方，維持絕對清晰 */
.data-value, .data-label {
    position: relative;
    z-index: 2;
}

.data-value {
    font-family: var(--font-heading);
    font-size: 2.5rem;
    font-weight: 900;
    color: var(--culture-gold);
    text-shadow: 0 0 15px rgba(184, 146, 65, 0.3);
    line-height: 1.2;
    margin-bottom: 5px;
}

.data-value .unit {
    font-size: 1.2rem;
    color: var(--tech-blue);
    margin-left: 4px;
}

.data-label {
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: var(--text-secondary);
    letter-spacing: 2px;
}

/* --- 2. 節點分隔線：使用 ::after 繪製 --- */
.data-node:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -10px;
    top: 20%;
    height: 60%;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--border-line), transparent);
    z-index: 3;
}

/* --- 3. 專屬 SVG 浮水印：改用 ::before 避免圖層衝突 --- */
.data-node::before {
    content: '';
    position: absolute;
    right: 5px;
    bottom: 5px;
    width: 80px;       
    height: 80px;
    opacity: 0.08;     
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom right;
    pointer-events: none;
    transform: rotate(-15deg); 
    transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s ease;
    z-index: 0; /* 乖乖墊在最底層 */
}

/* 懸停互動 */
.data-node:hover {
    background-color: rgba(184, 146, 65, 0.04); 
}
.data-node:hover::before {
    transform: scale(1.15) rotate(0deg); 
    opacity: 0.25; 
}

/* 第一格 [1987] - 時光沙漏 */
.data-node:nth-child(1)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b89241' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 22h14'/%3E%3Cpath d='M5 2h14'/%3E%3Cpath d='M17 22v-4.172a2 2 0 0 0-.586-1.414L12 12l-4.414 4.414A2 2 0 0 0 7 17.828V22'/%3E%3Cpath d='M7 2v4.172a2 2 0 0 0 .586 1.414L12 12l4.414-4.414A2 2 0 0 0 17 6.172V2'/%3E%3C/svg%3E") !important; }
/* 第二格 [Zero] - 防禦盾牌 */
.data-node:nth-child(2)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b89241' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3C/svg%3E") !important; }
/* 第三格 [95%] - 雲端資料庫 */
.data-node:nth-child(3)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338bdf8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5' rx='9' ry='3'/%3E%3Cpath d='M3 5V19A9 3 0 0 0 21 19V5'/%3E%3Cpath d='M3 12A9 3 0 0 0 21 12'/%3E%3C/svg%3E") !important; }
/* 第四格 [ESG] - 循環指標 */
.data-node:nth-child(4)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b89241' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12c0 6-4.39 10-9.806 10C7.792 22 4.24 19.665 3 16M2 12C2 6 6.39 2 11.806 2 16.209 2 19.76 4.335 21 8'/%3E%3Cpath d='M3 16h5v-5M21 8h-5v5'/%3E%3C/svg%3E") !important; }

/* --- 4. RWD 手機版微調 --- */
@media (max-width: 600px) {
    .data-dashboard {
        grid-template-columns: 1fr 1fr;
    }
}

/* 語系切換器 UI */
.lang-switch-wrapper {
    margin-left: auto; /* 推到右邊 */
}
.lang-selector {
    background-color: transparent;
    color: #374151;
    border: 1px solid var(--culture-gold);
    padding: 4px 8px;
    border-radius: 4px;
    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}
.lang-selector:hover {
    background-color: rgba(184, 146, 65, 0.1);
}
.lang-selector option {
    background-color: #fff;
    color: #000;
}

/* =========================================================
   Google Translate 原生下拉選單優化 (消除跳行與 Logo 空間)
========================================================= */
#google_translate_element {
    display: flex !important;
    align-items: center !important;
}

/* 徹底壓扁 Google 預設的版權文字空間，防止換行往下掉 */
.goog-te-gadget {
    font-size: 0px !important; 
    color: transparent !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 徹底隱藏 Google 官方 Logo 與圖片 */
.goog-logo-link, .goog-te-gadget img {
    display: none !important;
}

/* 將 Google 的原生下拉選單偽裝成我們的精準選單，並強制等高對齊 */
.goog-te-combo {
    background-color: transparent !important;
    color: #374151 !important;
    border: 1px solid var(--culture-gold) !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    font-family: var(--font-body) !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    cursor: pointer;
    outline: none;
    margin: 0 !important;
    height: 32px !important; /* 🔥 致命設定：強制設定與左側選單完全一樣的高度 */
    vertical-align: middle !important;
}

.goog-te-combo:hover {
    background-color: rgba(184, 146, 65, 0.1) !important;
}
.goog-te-combo option {
    background-color: #fff !important;
    color: #000 !important;
}

/* ⚠️ 終極防護：強制隱藏 Google 頂部翻譯橫幅，防止網頁被往下推 */
.goog-te-banner-frame.skiptranslate {
    display: none !important;
}
body {
    top: 0px !important; 
}
/* =========================================================
   Google 翻譯動態國碼與地址切換裝甲 (光學迷彩)
========================================================= */
.intl-text {
    display: none; /* 預設：對台灣本地隱藏 +886 與 ROC Taiwan */
}

/* 當 Google 翻譯啟動時 (系統會被掛上 translated-ltr)，自動切換顯示！ */
html.translated-ltr .intl-text,
html.translated-rtl .intl-text {
    display: inline;
}

html.translated-ltr .local-text,
html.translated-rtl .local-text {
    display: none; /* 隱藏區域碼 0 */
}

/* =========================================================
   全新卡片式網格佈局 (Card Grid System)
========================================================= */
.matrix-section {
    margin-bottom: 50px;
}

/* --- 網格系統 --- */
.card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
}

/* =========================================================
   旗艦級多色彩光譜卡片系統 (Multi-Color Card System)
========================================================= */

/* =========================================
   1. 修復手機版卡片裝甲消失的問題 (強制全域套用)
   ========================================= */
.tech-card {
    background-color: rgba(15, 23, 42, 0.6); /* 深藍色半透明背景 */
    border: 1px solid #334155;               /* 科技感邊框 */
    border-radius: 12px;                     /* 圓角 */
    padding: 25px;                           /* 內距，防止文字貼邊 */
    margin-bottom: 20px;                     /* 卡片間距 */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(10px);             /* 毛玻璃特效 */
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.tech-card:hover {
    border-color: #38bdf8;                   /* 滑鼠移入邊框發光 */
    transform: translateY(-3px);
}

/* =========================================
   2. 科技感分類標籤 (Cyber Tags)
   ========================================= */
.cyber-tag {
    /* ... 這裡保留您原本的 background, color, border 等設定 ... */
    padding: 4px 12px;
    border-radius: 20px;                     
    font-size: 0.85rem;
    font-weight: bold;
    letter-spacing: 1px;
    
    /* 👇 新增這三行，啟動平滑動畫引擎 👇 */
    display: inline-block;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    cursor: default; /* 如果未來這標籤可以點擊過濾，請改為 pointer */
}

/* 🌟 新增：標籤懸停互動引擎 */
.cyber-tag:hover {
    transform: translateY(-2px) scale(1.03); /* 微微向上浮起並放大 */
    /* 神奇魔法：currentColor 會自動抓取該標籤的文字顏色作為發光色！ */
    filter: brightness(1.3) drop-shadow(0 0 8px currentColor);
    z-index: 2;
}

/* =========================================
   3. 手機與電腦版的排版切換 (Grid 佈局修復)
   ========================================= */
.card-grid {
    display: grid;
    gap: 20px;
    /* 手機版預設：1欄直排 */
    grid-template-columns: 1fr; 
}

/* 平板與電腦大螢幕：2欄並排 */
@media (min-width: 768px) {
    .card-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* --- 2. 矩陣 Beta：實體與運維基建 (沉穩深海藍主題) --- */
.beta-card {
    border-left: 4px solid var(--tech-blue) !important; /* 側邊裝飾線 */
}
.beta-card .card-subtitle { color: #38bdf8; } /* 明亮青藍 */
.beta-card:hover {
    background-color: rgba(14, 165, 233, 0.08) !important; /* 懸停時吸入微量主題色 */
    border-color: rgba(14, 165, 233, 0.4) !important;
    box-shadow: 0 15px 35px rgba(14, 165, 233, 0.15) !important; /* 發出藍色科技光暈 */
}

/* --- 3. 矩陣 Gamma：十核心產品線多彩光譜流轉 --- */

/* 🔴 核心防禦系 (二次認證、PyOS防火牆) -> 警示烈焰橘紅 */
.card-grid .tech-card:nth-child(1), /* 身份二次認證 */
.card-grid .tech-card:nth-child(9)  /* PyOS防火牆 */ {
    border-left: 4px solid #f97316 !important; 
}
.card-grid .tech-card:nth-child(1) .card-subtitle,
.card-grid .tech-card:nth-child(9) .card-subtitle { color: #ffedd5; text-shadow: 0 0 10px rgba(249, 115, 22, 0.2); }
.card-grid .tech-card:nth-child(1):hover,
.card-grid .tech-card:nth-child(9):hover {
    background-color: rgba(249, 115, 22, 0.06) !important;
    border-color: rgba(249, 115, 22, 0.4) !important;
    box-shadow: 0 15px 35px rgba(249, 115, 22, 0.15) !important;
}

/* 🟢 文化傳承系 (系統族譜、宮廟智慧務) -> 古風典雅翡翠綠 */
.card-grid .tech-card:nth-child(2), /* 系統族譜 */
.card-grid .tech-card:nth-child(5)  /* 宮廟智慧務 */ {
    border-left: 4px solid #10b981 !important;
}
.card-grid .tech-card:nth-child(2) .card-subtitle,
.card-grid .tech-card:nth-child(5) .card-subtitle { color: #d1fae5; text-shadow: 0 0 10px rgba(16, 185, 129, 0.2); }
.card-grid .tech-card:nth-child(2):hover,
.card-grid .tech-card:nth-child(5):hover {
    background-color: rgba(16, 185, 129, 0.06) !important;
    border-color: rgba(16, 185, 129, 0.4) !important;
    box-shadow: 0 15px 35px rgba(16, 185, 129, 0.15) !important;
}

/* 🔵 產權守護系 (祭祀公業、微型公業公開) -> 皇家信任靛藍 */
.card-grid .tech-card:nth-child(3), /* 祭祀公業 */
.card-grid .tech-card:nth-child(4)  /* 微型公業公開 */ {
    border-left: 4px solid #6366f1 !important;
}
.card-grid .tech-card:nth-child(3) .card-subtitle,
.card-grid .tech-card:nth-child(4) .card-subtitle { color: #e0e7ff; text-shadow: 0 0 10px rgba(99, 102, 241, 0.2); }
.card-grid .tech-card:nth-child(3):hover,
.card-grid .tech-card:nth-child(4):hover {
    background-color: rgba(99, 102, 241, 0.06) !important;
    border-color: rgba(99, 102, 241, 0.4) !important;
    box-shadow: 0 15px 35px rgba(99, 102, 241, 0.15) !important;
}

/* 🟣 大數據決策系 (紫微合盤、犯罪分析、BI決策) -> 霓虹量子魔幻紫 */
.card-grid .tech-card:nth-child(6), /* 紫微合盤 */
.card-grid .tech-card:nth-child(7), /* 犯罪分析 */
.card-grid .tech-card:nth-child(8)  /* BI決策 */ {
    border-left: 4px solid #a855f7 !important;
}
.card-grid .tech-card:nth-child(6) .card-subtitle,
.card-grid .tech-card:nth-child(7) .card-subtitle,
.card-grid .tech-card:nth-child(8) .card-subtitle { color: #f3e8ff; text-shadow: 0 0 10px rgba(168, 85, 247, 0.2); }
.card-grid .tech-card:nth-child(6):hover,
.card-grid .tech-card:nth-child(7):hover,
.card-grid .tech-card:nth-child(8):hover {
    background-color: rgba(168, 85, 247, 0.06) !important;
    border-color: rgba(168, 85, 247, 0.4) !important;
    box-shadow: 0 15px 35px rgba(168, 85, 247, 0.15) !important;
}

/* 🟡 ESG 終點強調卡片 -> 金煦流光漸層 (維持原本最高規格特調) */
.highlight-card {
    background: linear-gradient(135deg, rgba(13, 20, 31, 0.8) 0%, rgba(184, 146, 65, 0.1) 100%) !important;
    border-left: 4px solid var(--culture-gold) !important;
    border-color: rgba(184, 146, 65, 0.3) !important;
}
.highlight-card .card-subtitle { color: var(--culture-gold); text-shadow: 0 0 10px rgba(184, 146, 65, 0.3); }
.highlight-card:hover {
    background: linear-gradient(135deg, rgba(13, 20, 31, 0.7) 0%, rgba(184, 146, 65, 0.2) 100%) !important;
    border-color: rgba(184, 146, 65, 0.6) !important;
    box-shadow: 0 15px 35px rgba(184, 146, 65, 0.2) !important;
}

/* =========================================================
   旗艦級卡片右下角風格浮水印系統 (Watermark Layer)
========================================================= */

/* --- 1. 定義所有卡片浮水印的基礎核心骨架 --- */
.tech-card::after {
    content: '';
    position: absolute;
    right: -10px;        /* 刻意移出邊界，營造科技裁切感 */
    bottom: -15px;
    width: 130px;        /* 圖標尺寸 */
    height: 130px;
    opacity: 0.03;       /* 🔍 極度低調的預設透明度，絕對不干擾文字閱讀 */
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom right;
    pointer-events: none; /* 防止滑鼠點擊被圖標攔截 */
    transform: rotate(-10deg); /* 增加微幅傾斜，視覺更具動態感 */
    transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s ease;
    z-index: 1;          /* 確保在文字底層 */
}

/* 🔥 核心互動：當滑鼠懸停在卡片上時，底圖同步放大、回正、並微微亮起 */
.tech-card:hover::after {
    transform: scale(1.15) rotate(0deg);
    opacity: 0.08;       /* 懸停時稍微亮起，強化互動反饋 */
}


/* --- 2. 針對不同屬性的卡片，嚴格區分 Beta 與 Gamma 配發專屬 SVG --- */

/* =========================================================
   矩陣 Beta：四張卡片專屬科技浮水印 (Tech Watermarks)
========================================================= */

/* 🔷 第 1 張：[實體基建] - 機房伺服器機櫃 (Server Rack) */
.beta-card:nth-child(1)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%2338bdf8' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='25' y='10' width='50' height='80' rx='5'/%3E%3Crect x='32' y='20' width='36' height='15' rx='2'/%3E%3Ccircle cx='40' cy='27.5' r='2' fill='%2338bdf8' stroke='none'/%3E%3Cline x1='48' y1='27.5' x2='60' y2='27.5'/%3E%3Crect x='32' y='42' width='36' height='15' rx='2'/%3E%3Ccircle cx='40' cy='49.5' r='2' fill='%2338bdf8' stroke='none'/%3E%3Cline x1='48' y1='49.5' x2='60' y2='49.5'/%3E%3Crect x='32' y='64' width='36' height='15' rx='2'/%3E%3Ccircle cx='40' cy='71.5' r='2' fill='%2338bdf8' stroke='none'/%3E%3Cline x1='48' y1='71.5' x2='60' y2='71.5'/%3E%3C/svg%3E") !important;
}

/* 🔷 第 2 張：[終端設備] - 終端主機與檢測脈衝 (Terminal & Pulse) */
.beta-card:nth-child(2)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%2338bdf8' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='15' y='20' width='70' height='45' rx='4'/%3E%3Cpath d='M40 65 L35 85 H65 L60 65'/%3E%3Cline x1='20' y1='85' x2='80' y2='85'/%3E%3Cpolyline points='25,42 40,42 45,32 55,52 60,42 75,42'/%3E%3C/svg%3E") !important;
}

/* 🔷 第 3 張：[災復計畫] - 逆時針 SOS 循環 (SOS Loop - 字體精緻版) */
.beta-card:nth-child(3)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M 75 25 A 35 35 0 1 0 85 50' fill='none' stroke='%2338bdf8' stroke-width='6' stroke-linecap='round' /%3E%3Cpolyline points='73,62 85,50 97,62' fill='none' stroke='%2338bdf8' stroke-width='6' stroke-linecap='round' stroke-linejoin='round' /%3E%3Ctext x='50' y='60' font-family='sans-serif' font-size='24' font-weight='900' fill='%2338bdf8' text-anchor='middle' letter-spacing='2'%3E%3Ctspan%3ESOS%3C/tspan%3E%3C/text%3E%3C/svg%3E") !important;
}

/* 🔷 第 4 張：[專業進駐] - 區域網路拓樸 (Network Topology) */
.beta-card:nth-child(4)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%2338bdf8' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='50' cy='50' r='8'/%3E%3Ccircle cx='50' cy='50' r='18' stroke-dasharray='4 6'/%3E%3Cline x1='50' y1='32' x2='50' y2='15'/%3E%3Ccircle cx='50' cy='10' r='5'/%3E%3Cline x1='65' y1='40' x2='80' y2='26'/%3E%3Ccircle cx='84' cy='22' r='5'/%3E%3Cline x1='65' y1='60' x2='76' y2='76'/%3E%3Ccircle cx='80' cy='80' r='5'/%3E%3Cline x1='35' y1='60' x2='24' y2='76'/%3E%3Ccircle cx='20' cy='80' r='5'/%3E%3Cline x1='35' y1='40' x2='20' y2='26'/%3E%3Ccircle cx='16' cy='22' r='5'/%3E%3C/svg%3E") !important;
}

/* 🔴 矩陣 Gamma - 核心安全系（第1張二次認證、第9張PyOS防火牆） */
.gamma-card:nth-child(1)::after,
.gamma-card:nth-child(9)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f97316' stroke-width='1'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Ccircle cx='12' cy='11' r='3'/%3E%3Cpath d='M12 11v4'/%3E%3C/svg%3E") !important;
}

/* 🟢 矩陣 Gamma - 數位傳承系（第2張族譜平台） */
.gamma-card:nth-child(2)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='%2310b981'%3E%3Cpath d='M50 25 V 40 M20 40 H 80 M20 40 V 50 M50 40 V 50 M80 40 V 50' fill='none' stroke='%2310b981' stroke-width='4' stroke-linejoin='round' stroke-linecap='round'/%3E%3Crect x='35' y='10' width='30' height='15' rx='4' opacity='0.9' /%3E%3Crect x='5' y='50' width='30' height='15' rx='4' opacity='0.9' /%3E%3Crect x='35' y='50' width='30' height='15' rx='4' opacity='0.9' /%3E%3Crect x='65' y='50' width='30' height='15' rx='4' opacity='0.3' /%3E%3Cg transform='translate(78, 62)'%3E%3Ccircle cx='0' cy='0' r='16' fill='%2310b981' opacity='0.1' /%3E%3Ccircle cx='0' cy='0' r='16' fill='none' stroke='%2310b981' stroke-width='4' /%3E%3Cpath d='M -8,-6 A 10,10 0 0,1 6,-8' fill='none' stroke='%2310b981' stroke-width='2' stroke-linecap='round' opacity='0.7'/%3E%3Cline x1='11' y1='11' x2='20' y2='20' stroke='%2310b981' stroke-width='6' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E") !important;
}

/* 🔵 矩陣 Gamma - 產權守護系（第3張祭祀公業、第4張微型公業公開） */
.gamma-card:nth-child(3)::after,
.gamma-card:nth-child(4)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236366f1'%3E%3Cpath d='M1 3 C 2.5 12 8 13 12 13 C 16 13 21.5 12 23 3 C 23.5 7 19 15 12 15 C 5 15 0.5 7 1 3 Z' /%3E%3Crect x='4' y='12.5' width='16' height='1.5' rx='0.5' /%3E%3Crect x='5.5' y='14' width='2.5' height='6' /%3E%3Crect x='16' y='14' width='2.5' height='6' /%3E%3Crect x='3' y='20' width='18' height='2' rx='1' /%3E%3Crect x='10.5' y='16.5' width='3' height='5.5' opacity='0.8' /%3E%3C/svg%3E") !important;
}

/* 🟢 矩陣 Gamma - 信仰科技系（第5張宮廟智慧務） */
.gamma-card:nth-child(5)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50,4 C30.1,4 14,20.1 14,40 C14,65 50,96 50,96 C50,96 86,65 86,40 C86,20.1 69.9,4 50,4 Z' fill='none' stroke='%2310b981' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cg transform='translate(50, 40)' fill='none' stroke='%2310b981' stroke-width='4' stroke-linejoin='round'%3E%3Cpolygon points='0,-16 -13.86,8 13.86,8' /%3E%3Cpolygon points='0,16 -13.86,-8 13.86,-8' /%3E%3Ccircle cx='0' cy='0' r='2.5' fill='%2310b981' stroke='none' /%3E%3C/g%3E%3Cellipse cx='50' cy='90' rx='18' ry='5' fill='%2310b981' opacity='0.4' /%3E%3C/svg%3E") !important;
}

/* 🟣 矩陣 Gamma - 玄學算力系（第6張紫微合盤） */
.gamma-card:nth-child(6)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='%23a855f7'%3E%3Cdefs%3E%3Crect id='yang' x='-8' y='0' width='16' height='2.5' rx='0.5' /%3E%3Cg id='yin'%3E%3Crect x='-8' y='0' width='6.5' height='2.5' rx='0.5' /%3E%3Crect x='1.5' y='0' width='6.5' height='2.5' rx='0.5' /%3E%3C/g%3E%3C/defs%3E%3Cg transform='translate(50,50)'%3E%3Ccircle cx='0' cy='0' r='15' fill='none' stroke='%23a855f7' stroke-width='2'/%3E%3Cpath d='M 0,-15 A 15,15 0 0,1 0,15 A 7.5,7.5 0 0,1 0,0 A 7.5,7.5 0 0,0 0,-15 Z' fill='%23a855f7'/%3E%3Ccircle cx='0' cy='-7.5' r='2.5' fill='%230d141f'/%3E%3Ccircle cx='0' cy='7.5' r='2.5' fill='%23a855f7' /%3E%3C/g%3E%3Cg transform='translate(50,50)'%3E%3Cg transform='rotate(0)'%3E%3Cuse href='%23yang' y='-22' /%3E%3Cuse href='%23yang' y='-26.5' /%3E%3Cuse href='%23yang' y='-31' /%3E%3C/g%3E%3Cg transform='rotate(45)'%3E%3Cuse href='%23yin' y='-22' /%3E%3Cuse href='%23yang' y='-26.5' /%3E%3Cuse href='%23yang' y='-31' /%3E%3C/g%3E%3Cg transform='rotate(90)'%3E%3Cuse href='%23yin' y='-22' /%3E%3Cuse href='%23yang' y='-26.5' /%3E%3Cuse href='%23yin' y='-31' /%3E%3C/g%3E%3Cg transform='rotate(135)'%3E%3Cuse href='%23yin' y='-22' /%3E%3Cuse href='%23yin' y='-26.5' /%3E%3Cuse href='%23yang' y='-31' /%3E%3C/g%3E%3Cg transform='rotate(180)'%3E%3Cuse href='%23yin' y='-22' /%3E%3Cuse href='%23yin' y='-26.5' /%3E%3Cuse href='%23yin' y='-31' /%3E%3C/g%3E%3Cg transform='rotate(225)'%3E%3Cuse href='%23yang' y='-22' /%3E%3Cuse href='%23yin' y='-26.5' /%3E%3Cuse href='%23yin' y='-31' /%3E%3C/g%3E%3Cg transform='rotate(270)'%3E%3Cuse href='%23yang' y='-22' /%3E%3Cuse href='%23yin' y='-26.5' /%3E%3Cuse href='%23yang' y='-31' /%3E%3C/g%3E%3Cg transform='rotate(315)'%3E%3Cuse href='%23yang' y='-22' /%3E%3Cuse href='%23yang' y='-26.5' /%3E%3Cuse href='%23yin' y='-31' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
}

/* 🟣 矩陣 Gamma - 大數據算力系（第7張犯罪分析、第8張BI決策） */
.gamma-card:nth-child(7)::after,
.gamma-card:nth-child(8)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a855f7' stroke-width='1'%3E%3Cpath d='M18 3a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3zM6 15a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3zm12 0a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3zM8.5 18h7m-7-9.5l7 7.5'/%3E%3C/svg%3E") !important;
}

/* 🟡 矩陣 Gamma - ESG強調卡片（第10張偏鄉循環永續）：配發「無限循環重生鈕 (Infinite ESG Loop)」 */
.highlight-card::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b89241' stroke-width='1'%3E%3Cpath d='M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") !important;
}

/* 🌟 樞紐 Alpha 專屬：育昌實體 LOGO 精神浮水印 */
.hero-card::after {
    /* 注意路徑：從 assets/css/ 回推到根目錄的 img/ 資料夾 */
    background-image: url("../../img/LOGO.png") !important;
    width: 220px !important;       /* 🌟 主視覺卡片較寬，將底圖放大展現氣勢 */
    height: 220px !important;
    right: 0px !important;         /* 靠右對齊 */
    bottom: -10px !important;
    opacity: 0.04 !important;      /* 👻 完美半透明隱形感，似有若無的高級渲染 */
    transform: rotate(0deg) !important; /* LOGO 保持端正不傾斜，象徵穩如泰山 */
}

/* 當滑鼠懸停在 Alpha 卡片時，LOGO 微微放大浮現 */
.hero-card:hover::after {
    transform: scale(1.08) rotate(0deg) !important;
    opacity: 0.09 !important;      /* 懸停時稍微亮起，強化互動反饋 */
}

/* =========================================================
   數據儀表板 (Data Dashboard) 專屬浮水印系統 (強化清晰度版)
========================================================= */

/* 1. 賦予儀表板節點容器特性，包覆浮水印不外漏 */
.data-node {
    position: relative;
    overflow: hidden; 
    transition: background-color 0.4s ease;
    border-radius: 6px; 
}

.data-value, .data-label {
    position: relative;
    z-index: 2;
}

/* 2. 定義儀表板浮水印的通用骨架 */
.data-node::after {
    content: '';
    position: absolute;
    right: -5px;
    bottom: -10px;
    width: 85px;       
    height: 85px;
    opacity: 0.08;     /* 🌟 提升預設亮度 (原本 0.04 太暗導致隱形) */
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom right;
    pointer-events: none;
    transform: rotate(-15deg); 
    transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s ease;
    z-index: 1;
}

/* 3. 核心互動：當滑鼠懸停在該數據上時 */
.data-node:hover {
    background-color: rgba(184, 146, 65, 0.04); 
}
.data-node:hover::after {
    transform: scale(1.15) rotate(0deg); 
    opacity: 0.2;      /* 🌟 懸停時亮度同步提升 */
}

/* =========================================================
   頁尾聯絡名片 (Contact Card) 專屬通訊浮水印系統
========================================================= */

/* 1. 強化原本的 .biz-card-info 容器，加上相對定位與溢出隱藏 */
.biz-card-info {
    position: relative;
    overflow: hidden; /* 確保浮水印不會超出名片邊界 */
    transition: border-color 0.4s ease, box-shadow 0.4s ease;
}

/* 確保名片內的文字與連結層級在浮水印上方，維持絕對可讀性 */
.biz-card-info .info-row {
    position: relative;
    z-index: 2;
}

/* 2. 部署「科技藍通訊電話」浮水印 */
.biz-card-info::after {
    content: '';
    position: absolute;
    right: -20px;
    bottom: -30px;
    width: 200px;
    height: 200px;
    opacity: 0.04; /* 保持深海般的隱蔽性，不干擾文字 */
    /* 注入極簡軍規通訊 SVG 圖標 (科技藍) */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338bdf8' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom right;
    pointer-events: none;
    transform: rotate(-15deg); /* 待機傾斜狀態 */
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.6s ease;
    z-index: 1; /* 乖乖沉入底層 */
}

/* 3. 懸停互動：通訊頻道高亮開啟 */
.biz-card-info:hover {
    border-color: rgba(14, 165, 233, 0.4);
    box-shadow: 0 10px 30px rgba(14, 165, 233, 0.1); /* 網格外框發出微弱藍光 */
}

.biz-card-info:hover::after {
    transform: scale(1.1) rotate(0deg); /* 浮水印回正並微幅放大 */
    opacity: 0.12; /* 亮度提升，展現科技藍通訊光暈 */
}

/* =========================================================
   各大矩陣總標題卡片 (Title Card) 與將軍級浮水印
========================================================= */
.title-card {
    margin-bottom: 30px; /* 與下方的卡片網格保持完美安全距離 */
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); /* 🌟 注入平滑動畫引擎 */
    position: relative;
    z-index: 1;
}

/* 🌟 通用發光互動：當鼠標或手指滑過標題卡片時 */
.title-card:hover {
    transform: translateY(-2px); /* 微微浮起 */
    z-index: 10; /* 確保發光時不會被其他元素遮擋 */
}

/* ---------------------------------------------------------
   Beta 總標題：頂部科技藍裝甲線 + 脈衝網格浮水印
--------------------------------------------------------- */
.beta-title {
    border-top: 3px solid var(--tech-blue) !important;
}

/* 🔷 Beta 懸停發光：科技藍光暈 */
.beta-title:hover {
    box-shadow: 0 10px 30px rgba(14, 165, 233, 0.2),   /* 底部擴散光 */
                0 0 15px rgba(14, 165, 233, 0.4) inset; /* 內部微光 */
    border-color: rgba(14, 165, 233, 0.8) !important;   /* 邊框變亮 */
    background-color: rgba(14, 165, 233, 0.05);         /* 背景吸入微量藍光 */
}

.beta-title::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%2338bdf8' stroke-width='1.5'%3E%3Cpath d='M10 50h30l10-20 10 40 10-20h30'/%3E%3Ccircle cx='40' cy='50' r='3' fill='%2338bdf8'/%3E%3Ccircle cx='60' cy='50' r='3' fill='%2338bdf8'/%3E%3C/svg%3E") !important;
    width: 180px !important; height: 180px !important;
}

/* ---------------------------------------------------------
   Gamma 總標題：頂部古銅金裝甲線 + 矩陣方圖浮水印
--------------------------------------------------------- */
.gamma-title {
    border-top: 3px solid var(--culture-gold) !important;
}

/* 🟡 Gamma 懸停發光：古銅金光暈 */
.gamma-title:hover {
    box-shadow: 0 10px 30px rgba(184, 146, 65, 0.15),   /* 底部擴散光 */
                0 0 15px rgba(184, 146, 65, 0.3) inset; /* 內部微光 */
    border-color: rgba(184, 146, 65, 0.8) !important;   /* 邊框變亮 */
    background-color: rgba(184, 146, 65, 0.05);         /* 背景吸入微量金光 */
}

.gamma-title::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b89241' stroke-width='1'%3E%3Cpath d='M12 2L2 12l10 10 10-10L12 2zm0 4l6 6-6 6-6-6 6-6z'/%3E%3C/svg%3E") !important;
    width: 180px !important; height: 180px !important;
}

/* 🌟 矩陣全域標題懸停發光引擎 */
h2, h3 {
    transition: all 0.3s ease;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); /* 預設深色陰影 */
}

h2:hover, h3:hover {
    color: #ffffff;
    text-shadow: 
        0 0 5px rgba(255, 255, 255, 0.6),   /* 內層高光 */
        0 0 15px rgba(14, 165, 233, 0.8),   /* 中層科技藍 */
        0 0 30px rgba(14, 165, 233, 0.5);   /* 外層擴散藍暈 */
    transform: scale(1.02); /* 微微放大產生壓迫感 */
}

/* =========================================================
   小卡片標題 (Card Subtitle) 懸停發光引擎
========================================================= */
.card-subtitle {
    transition: all 0.3s ease; /* 注入平滑動畫引擎 */
}

/* 🌟 通用小卡片標題懸停互動 */
.tech-card:hover .card-subtitle {
    transform: scale(1.02); /* 當滑過整張卡片時，標題微微放大 */
    letter-spacing: 1px;    /* 字距微幅拉開，增加氣勢 */
}

/* 🔷 Beta 矩陣小卡片標題：科技藍光暈 */
.beta-card:hover .card-subtitle {
    color: #ffffff; /* 文字轉為純白 */
    text-shadow: 
        0 0 5px rgba(255, 255, 255, 0.6),   /* 內層高光 */
        0 0 10px rgba(56, 189, 248, 0.8),   /* 中層科技藍 (#38bdf8) */
        0 0 20px rgba(56, 189, 248, 0.5);   /* 外層擴散藍暈 */
}

/* 🔴 Gamma 核心防禦系 (卡片 1, 9)：烈焰橘紅光暈 */
.card-grid .tech-card:nth-child(1):hover .card-subtitle,
.card-grid .tech-card:nth-child(9):hover .card-subtitle {
    color: #ffffff;
    text-shadow: 0 0 5px rgba(255,255,255,0.6), 0 0 10px rgba(249, 115, 22, 0.8), 0 0 20px rgba(249, 115, 22, 0.5);
}

/* 🟢 Gamma 文化傳承系 (卡片 2, 5)：翡翠綠光暈 */
.card-grid .tech-card:nth-child(2):hover .card-subtitle,
.card-grid .tech-card:nth-child(5):hover .card-subtitle {
    color: #ffffff;
    text-shadow: 0 0 5px rgba(255,255,255,0.6), 0 0 10px rgba(16, 185, 129, 0.8), 0 0 20px rgba(16, 185, 129, 0.5);
}

/* 🔵 Gamma 產權守護系 (卡片 3, 4)：靛藍光暈 */
.card-grid .tech-card:nth-child(3):hover .card-subtitle,
.card-grid .tech-card:nth-child(4):hover .card-subtitle {
    color: #ffffff;
    text-shadow: 0 0 5px rgba(255,255,255,0.6), 0 0 10px rgba(99, 102, 241, 0.8), 0 0 20px rgba(99, 102, 241, 0.5);
}

/* 🟣 Gamma 大數據決策系 (卡片 6, 7, 8)：魔幻紫光暈 */
.card-grid .tech-card:nth-child(6):hover .card-subtitle,
.card-grid .tech-card:nth-child(7):hover .card-subtitle,
.card-grid .tech-card:nth-child(8):hover .card-subtitle {
    color: #ffffff;
    text-shadow: 0 0 5px rgba(255,255,255,0.6), 0 0 10px rgba(168, 85, 247, 0.8), 0 0 20px rgba(168, 85, 247, 0.5);
}

/* 🟡 ESG 終點強調卡片 (第10張)：古銅金光暈 */
.highlight-card:hover .card-subtitle {
    color: #ffffff;
    text-shadow: 0 0 5px rgba(255,255,255,0.6), 0 0 10px rgba(184, 146, 65, 0.8), 0 0 20px rgba(184, 146, 65, 0.5);
}

/* =========================================================
   矩陣 Alpha：營造 ERP 卡片專屬裝甲與浮水印
========================================================= */

/* 1. 卡片基礎裝甲線與懸停光暈 (金鋼橘) */
.alpha-card {
    border-left: 4px solid #f59e0b !important;
}

.alpha-card:hover {
    background-color: rgba(245, 158, 11, 0.06) !important;
    border-color: rgba(245, 158, 11, 0.4) !important;
    box-shadow: 0 15px 35px rgba(245, 158, 11, 0.15) !important;
}

/* 2. 標題懸停發光引擎 */
.alpha-card:hover .card-subtitle {
    color: #ffffff;
    text-shadow: 
        0 0 5px rgba(255, 255, 255, 0.6), 
        0 0 10px rgba(245, 158, 11, 0.8), 
        0 0 20px rgba(245, 158, 11, 0.5);
}

/* 3. 右下角專屬科技浮水印：3D 數據鋼骨方塊 */
.alpha-card::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%23f59e0b' stroke-width='4' stroke-linejoin='round'%3E%3Cpolygon points='50,25 75,38 50,51 25,38' /%3E%3Cpolygon points='25,38 50,51 50,77 25,64' /%3E%3Cpolygon points='75,38 50,51 50,77 75,64' /%3E%3Cpath d='M50,10 L50,25' stroke-dasharray='4,4'/%3E%3Cpath d='M50,51 L50,77' stroke-dasharray='4,4'/%3E%3C/svg%3E") !important;
}