﻿/* ══════════════════════════════════════════════════════════════════════
   黃金體驗官網 前台樣式（紫金圓角版）                           2026-11-10 重寫

   這支是整支重寫，舊版（大江時期累積、約 7,000 行）已不再沿用。
   ‧ class 名稱維持不變，View 與資料庫裡的內容不用改就能套上新外觀。
   ‧ 只保留黃金官網實際用得到的樣式；大江時期的劑型、功效、原料、據點、
     財報、實驗室等頁面樣式已拿掉（那些頁面目前選單也沒有連過去）。
   ‧ AI 查詢助手（Home/AIHelper）的樣式寫在該 View 自己的 <style> 裡，
     只讀這裡的色票變數，所以變數名稱要保留。

   目錄
     00 字型（中文預設微軟正黑體）
     01 色票與尺寸變數（含舊名稱對照）
     02 基礎：版面、文字、連結、焦點
     03 區塊與標題文字
     04 按鈕
     05 頁首（桌機選單、下拉、搜尋、語系、手機選單）
     06 麵包屑
     07 磁磚卡片與深色帶
     08 大廣告輪播
     09 常見問題
     10 編輯器內容（ap-editor／ed-＊／geit-＊）
     11 列表、搜尋、分頁
     12 表單、聯絡我們
     13 彈出視窗
     14 頁尾、Cookie 提示
     15 右側浮動按鈕
     16 其他相容用的舊 class
     17 減少動態
   ══════════════════════════════════════════════════════════════════════ */


/* ── 00 字型 ───────────────────────────────────────────────────────────
   中文一律用系統的微軟正黑體（Mac／iPhone 沒有，會用蘋方）；
   2026-11-13 起內文英文不再下載 Roboto，直接用微軟正黑的英文字；
   只保留英文標題與數字用的 Cormorant（本機 fonts/cormorant，cormorant.css 載入）。
   之後要換成其他中文字型（例如貓體），改下面 --font-zh 一個變數即可。 */


/* ── 01 色票與尺寸變數 ───────────────────────────────────────────────── */
:root {
    /* 品牌色（與後台 Areas/Backend/Content/CSS/Style.css 同一組） */
    --geit-gold:        #E0B870;   /* Logo 金：只放深底 */
    --geit-gold-lit:    #F0DCB4;   /* 淡金：深底次要文字、hover */
    --geit-gold-deep:   #956B20;   /* 淺底上可讀的金 */
    --geit-gold-ink:    #7A5617;   /* 淺底小字用的深金 */
    --geit-violet:      #9464E4;   /* Logo 紫：深底 accent */
    --geit-violet-deep: #5B3A9E;   /* 淺底行動色 */
    --geit-violet-2:    #4A2E82;
    --geit-violet-3:    #3A2366;
    --geit-lilac:       #EFE7FB;   /* 淡紫底 */
    --geit-lilac-2:     #F6F2FC;
    --geit-lilac-line:  #D9C7F5;
    --geit-plum:        #17121F;   /* 紫黑：深色區塊 */
    --geit-plum-2:      #221A2D;
    --geit-ground:      #FBF9F5;   /* 象牙：全站底色 */
    --geit-surface:     #FFFFFF;
    --geit-ink:         #1C1720;
    --geit-ink-2:       #4A434F;   /* 內文次要 */
    --geit-ink-3:       #6B6370;   /* 註解（對象牙 5.4:1） */
    --geit-line:        #E6DFD3;   /* 帶金的細線 */
    --geit-line-2:      #F1ECE3;
    --geit-line-d:      rgba(224,184,112,.24);  /* 深底上的細線 */
    --geit-on-dark:     #FBF9F5;
    --geit-on-dark-2:   #CFC6D8;

    /* 圓角 */
    --r-xl:   32px;   /* 大區塊：深色帶、輪播、結尾 CTA */
    --r-lg:   20px;   /* 卡片 */
    --r-md:   12px;   /* 輸入框、卡片內的圖 */
    --r-sm:   8px;
    --r-pill: 999px;

    /* 陰影 */
    --shadow-1: 0 1px 2px rgba(23,18,31,.04), 0 6px 18px rgba(23,18,31,.05);
    --shadow-2: 0 14px 36px rgba(23,18,31,.12);

    /* 字型 */
    --font-zh:    'Microsoft JhengHei', '微軟正黑體', 'PingFang TC', 'Heiti TC', 'Noto Sans TC';
    --font-sans:  var(--font-zh), 'Segoe UI', sans-serif;
    --font-serif: 'Cormorant', var(--font-zh), Georgia, serif;
    --font-latin-display: 'Cormorant', Georgia, serif;
    --lh-body: 1.8;
    --ls-body: .03em;

    /* 版面 */
    --header-height: 64px;   /* _Layout 會依實際高度覆寫 */
    --sec-gap: clamp(28px, 4vw, 64px);
    --container-pad: clamp(16px, 3vw, 28px);

    /* ── 舊變數名稱：View、資料庫內容、AIHelper 的 <style> 還在用，對到新色票 ── */
    --ap-ground: var(--geit-ground);
    --ap-surface: var(--geit-surface);
    --ap-surface-2: var(--geit-lilac-2);
    --ap-dark: var(--geit-plum);
    --ap-ink: var(--geit-ink);
    --ap-ink-2: var(--geit-ink-3);
    --ap-ink-3: var(--geit-ink-3);
    --ap-line: var(--geit-line);
    --ap-red: var(--geit-violet-deep);
    --ap-red-d: var(--geit-violet-2);
    --ap-tile-r: var(--r-lg);
    --ap-tile-r-sm: var(--r-md);
    --ap-pill: var(--r-pill);
    --ap-gap: 24px;
    --ap-nav-bg: rgba(251,249,245,.86);

    --tci-color-1: var(--geit-violet-deep);
    --tci-color-2: #F4F1EA;
    --tci-color-3: var(--geit-violet-2);
    --tci-color-4: var(--geit-violet-3);
    --tci-color-5: var(--geit-lilac-line);
    --tci-color-6: var(--geit-lilac);
    --tci-color-7: var(--geit-ink-2);
    --tci-color-8: #A79DAE;
    --tci-color-9: #EDE7DD;
    --tci-color-10: #FFFFFF;
    --tci-ink: var(--geit-ink);
    --tci-muted: var(--geit-ink-3);
    --tci-line: var(--geit-line);
    --tci-surface: var(--geit-ground);
    --tci-surface-2: #F4F1EA;
    --tci-accent: var(--geit-violet-deep);
    --tci-accent-soft: var(--geit-lilac-2);
    --ing-gold: var(--geit-gold-deep);
    --ing-gold-soft: #FBF6EC;
    --ing-gold-line: var(--geit-line);
}

:lang(zh) { --lh-body: 2.0; }

@media (min-width: 1200px) {
    :root { --header-height: 78px; }
}


/* ── 02 基礎 ─────────────────────────────────────────────────────────── */
html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-height) + 12px);
    scrollbar-gutter: stable;
}

body {
    font-family: var(--font-sans);
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: .025em;
    color: var(--geit-ink);
    background: var(--geit-ground);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Bootstrap 開 modal 會在 body 補 padding-right，搭配 scrollbar-gutter 會多出一條空白 */
body, .fixed-bottom { padding-right: 0 !important; }
.sticky-top { margin-right: 0 !important; }

[v-cloak] { display: none !important; }

p {
    line-height: var(--lh-body);
    letter-spacing: var(--ls-body);
    margin-bottom: 1rem;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--geit-ink);
    line-height: 1.35;
    letter-spacing: .02em;
    text-wrap: balance;
}

h1, h2, h3 { font-family: var(--font-serif); }
h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 600; }
h3 { font-size: clamp(1.2rem, 2.2vw, 1.6rem); font-weight: 600; }
h4 { font-size: clamp(1.05rem, 1.8vw, 1.3rem); font-weight: 600; }

ol, ul { padding-left: 1.25rem; }

a { color: var(--geit-violet-deep); text-decoration: none; }
a:hover { color: var(--geit-violet-3); }

/* 選單類連結維持深色，不吃上面的紫色 */
a.nav-link, a.nav-link:hover { color: inherit; }

img { max-width: 100%; }

iframe {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: var(--r-md);
}

hr {
    height: 1px;
    border: 0;
    opacity: 1;
    background: var(--geit-line);
    margin: 24px 0;
}

::selection { background: var(--geit-lilac-line); color: var(--geit-ink); }

:focus-visible {
    outline: 2px solid var(--geit-violet-deep);
    outline-offset: 2px;
}

/* 文章裡的錨點區塊（div_數字）捲動時讓出頁首高度 */
div[id^="div_"] { scroll-margin-top: calc(var(--header-height) + 16px); }

/* 寬螢幕放寬內容寬度 */
@media (min-width: 1600px) {
    .container-sm, .container-lg { max-width: 1480px; }
}


/* ── 03 區塊與標題文字 ───────────────────────────────────────────────── */
.ap-sec {
    background: transparent;
    padding: var(--sec-gap) 0 0;
    margin-bottom: 0 !important;
}

.ap-sec > .container-sm,
.ap-sec > .container-lg {
    padding-left: var(--container-pad);
    padding-right: var(--container-pad);
}

.ap-head { margin-bottom: clamp(16px, 2.2vw, 28px); }

/* AI 查詢助手頁：上方已經有頁首，不再多空一段 */
.ap-aihelper.ap-sec { padding-top: 0; }

/* 小標（英文大寫眉標） */
.ap-eyebrow,
.ap-band__eyebrow {
    display: block;
    font-family: var(--font-latin-display);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--geit-gold-deep);
    margin-bottom: .4rem;
}

.ap-display {
    font-family: var(--font-serif);
    font-size: clamp(2rem, 4.2vw, 3.1rem);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .03em;
    color: var(--geit-ink);
    margin-bottom: .5rem;
}

.ap-headline {
    font-family: var(--font-serif);
    font-size: clamp(1.6rem, 2.8vw, 2.3rem);
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: .03em;
    color: var(--geit-ink);
    margin-bottom: 0;
}

.ap-title {
    font-family: var(--font-serif);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: .03em;
    color: var(--geit-ink);
}

.ap-sub {
    font-size: clamp(.98rem, 1.15vw, 1.1rem);
    line-height: var(--lh-body);
    letter-spacing: var(--ls-body);
    color: var(--geit-ink-2);
    margin-bottom: 0;
}

.ap-body {
    font-size: 15px;
    line-height: var(--lh-body);
    letter-spacing: var(--ls-body);
    color: var(--geit-ink-2);
    margin-bottom: 0;
}

.ap-fine {
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: .06em;
    color: var(--geit-ink-3);
}

/* 頁面大標（h1 裡包 <b>，第二行 <span> 為淡色副句） */
.ap-greeting b { display: block; color: var(--geit-ink); font-weight: 700; }
.ap-greeting span { display: block; color: var(--geit-ink-3); font-weight: 600; }

/* 「看更多」文字連結 */
.ap-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: var(--ls-body);
    color: var(--geit-violet-deep) !important;
    text-decoration: none;
    white-space: nowrap;
}
.ap-link::after {
    content: "\203A";
    font-size: 1.3em;
    line-height: 1;
    transform: translateY(-1px);
    transition: transform .2s ease;
}
.ap-link:hover { color: var(--geit-violet-3) !important; }
.ap-link:hover::after { transform: translate(3px, -1px); }

/* 大標題版型（_H1Style_6） */
.h1style-pd-title { color: var(--geit-ink) !important; }
.h1style-pd-sub { max-width: 62ch; }

.services-pd-title,
.contact-pd-title { color: var(--geit-ink) !important; }


/* ── 04 按鈕 ─────────────────────────────────────────────────────────── */
.custom-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 44px;
    padding: 10px 26px;
    border: 1px solid var(--geit-violet-deep);
    border-radius: var(--r-pill);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: .08em;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.custom-btn:active { transform: translateY(0); }
.custom-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(91,58,158,.3); }

/* 主要（紫底白字）。舊名稱 btn-red 沿用 */
.btn-red,
a.btn-red {
    background: var(--geit-violet-deep);
    border-color: var(--geit-violet-deep);
    color: #FFFFFF !important;
}
.btn-red:hover,
a.btn-red:hover {
    background: var(--geit-violet-2) !important;
    border-color: var(--geit-violet-2);
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

/* 次要（白底紫框） */
.btn-outline-red {
    background: #FFFFFF;
    border-color: var(--geit-lilac-line);
    color: var(--geit-violet-deep) !important;
}
.btn-outline-red:hover {
    background: var(--geit-lilac-2) !important;
    border-color: var(--geit-violet-deep);
    color: var(--geit-violet-3) !important;
    transform: translateY(-1px);
}

/* 深底上的按鈕：主要＝金底，次要＝金框 */
.ap-tile--dark .btn-red,
.ap-band .btn-red,
.ap-banner__copy .btn-red {
    background: var(--geit-gold);
    border-color: var(--geit-gold);
    color: var(--geit-plum) !important;
    font-weight: 700;
}
.ap-tile--dark .btn-red:hover,
.ap-band .btn-red:hover,
.ap-banner__copy .btn-red:hover {
    background: var(--geit-gold-lit) !important;
    border-color: var(--geit-gold-lit);
    color: var(--geit-plum) !important;
}
.ap-tile--dark .btn-outline-red,
.ap-tile--over .btn-outline-red,
.ap-banner__copy .btn-outline-red {
    background: transparent;
    border-color: rgba(224,184,112,.65);
    color: var(--geit-gold-lit) !important;
}
.ap-tile--dark .btn-outline-red:hover,
.ap-tile--over .btn-outline-red:hover,
.ap-banner__copy .btn-outline-red:hover {
    background: rgba(224,184,112,.14) !important;
    border-color: var(--geit-gold);
    color: var(--geit-gold) !important;
}

/* Bootstrap 按鈕統一換成品牌色與膠囊形 */
.btn { border-radius: var(--r-pill); letter-spacing: .04em; }
.btn-primary {
    --bs-btn-bg: var(--geit-violet-deep);
    --bs-btn-border-color: var(--geit-violet-deep);
    --bs-btn-hover-bg: var(--geit-violet-2);
    --bs-btn-hover-border-color: var(--geit-violet-2);
    --bs-btn-active-bg: var(--geit-violet-3);
    --bs-btn-active-border-color: var(--geit-violet-3);
    --bs-btn-focus-shadow-rgb: 91, 58, 158;
}
.btn-dark {
    --bs-btn-bg: var(--geit-plum);
    --bs-btn-border-color: var(--geit-plum);
    --bs-btn-color: var(--geit-gold-lit);
    --bs-btn-hover-bg: var(--geit-plum-2);
    --bs-btn-hover-border-color: var(--geit-plum-2);
    --bs-btn-hover-color: var(--geit-gold);
}


/* ── 05 頁首 ─────────────────────────────────────────────────────────── */
#top_Menu {
    background: transparent !important;
    border-bottom: 1px solid var(--geit-line);
    box-shadow: none;
}
/* 毛玻璃底放在 ::before，避免 backdrop-filter 讓 fixed 的手機選單跑位 */
#top_Menu::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--ap-nav-bg);
    -webkit-backdrop-filter: saturate(180%) blur(16px);
    backdrop-filter: saturate(180%) blur(16px);
    pointer-events: none;
}
#top_Menu.nav-oc-open { z-index: 1046; }

#top_Menu .navbar { padding-top: .35rem; padding-bottom: .35rem; }

/* 只套桌機選單；手機選單（#mobileNavArea）也在 #top_Menu 裡，另外設定 */
#top_Menu > .navbar > .nav .nav-link {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .08em;
    color: var(--geit-ink-2) !important;
    border-radius: var(--r-pill);
    padding: .5rem 1rem !important;
    transition: background-color .2s ease, color .2s ease;
}
#top_Menu > .navbar > .nav .nav-link:hover,
#top_Menu > .navbar > .nav .nav-item:hover > .nav-link {
    background: var(--geit-lilac);
    color: var(--geit-violet-3) !important;
}

/* 2026-11-11 主選單膠囊群組：白底細框的大膠囊，裡面每一項也是膠囊；目前所在的那一項紫底白字 */
#top_Menu .geit-navpill {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 2px;
    margin-left: clamp(8px, 1.4vw, 20px);
    padding: 4px;
    background: #FFFFFF;
    border: 1px solid var(--geit-line);
    border-radius: var(--r-pill);
}
#top_Menu > .navbar > .nav .geit-navpill > .nav-item > .nav-link {
    font-size: 15px;
    padding: .45rem 1.05rem !important;
    white-space: nowrap;
}
#top_Menu > .navbar > .nav .nav-link.is-active,
#top_Menu > .navbar > .nav .nav-item:hover > .nav-link.is-active {
    background: var(--geit-violet-deep);
    color: #FFFFFF !important;
}
#top_Menu > .navbar > .nav .collapse .nav-link.is-active {
    background: var(--geit-lilac);
    color: var(--geit-violet-3) !important;
    font-weight: 500;
}

/* 舊版用底線標 hover，改成上面的膠囊底色 */
.Submenu_Hover { border: 0 !important; }

/* 桌機下拉：浮在頁首下方的圓角面板 */
#top_Menu .collapse.position-absolute {
    left: 16px !important;
    right: 16px;
    width: auto !important;
    margin-top: 6px !important;
    background: rgba(255,255,255,.96) !important;
    -webkit-backdrop-filter: saturate(180%) blur(16px);
    backdrop-filter: saturate(180%) blur(16px);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-2);
    padding: 6px 10px;
}
#top_Menu .collapse.position-absolute > .nav { justify-content: center; gap: 2px; }
#top_Menu .collapse.position-absolute .nav-link {
    font-size: 15px;
    font-weight: 400;
    color: var(--geit-ink-2) !important;
}
#top_Menu .custom-hover:hover {
    background: var(--geit-lilac);
    color: var(--geit-violet-3) !important;
}

/* 頁首右側的 AI 查詢助手按鈕 */
#top_Menu .custom-btn.btn-red {
    background: var(--geit-plum);
    border-color: var(--geit-plum);
    color: var(--geit-gold) !important;
    padding: 8px 22px;
    min-height: 42px;
}
#top_Menu .custom-btn.btn-red:hover {
    background: var(--geit-plum-2) !important;
    border-color: var(--geit-plum-2);
    color: var(--geit-gold-lit) !important;
}

/* 展開式搜尋框 */
.search-input-magic {
    width: 0;
    opacity: 0;
    padding: 0;
    border: 0;
    border-radius: var(--r-pill) !important;
    background: #FFFFFF;
    transition: width .35s cubic-bezier(.4,0,.2,1), opacity .35s ease, padding .35s ease;
}
.search-input-magic.is-open {
    width: 260px;
    opacity: 1;
    padding: .45rem 2.75rem .45rem 1.1rem;
    border: 1px solid var(--geit-line);
}
.search-input-magic.is-open:focus {
    border-color: var(--geit-violet-deep);
    box-shadow: 0 0 0 .2rem rgba(91,58,158,.18);
}

/* 語系切換（國旗下拉） */
.geit-lang__btn {
    display: inline-flex;
    align-items: center;
    border: 0;
    background: transparent;
    padding: .45rem .6rem !important;
}
.geit-lang__flag {
    width: 1.3rem;
    height: .95rem;
    border-radius: 3px;
    background-size: cover;
    box-shadow: 0 0 0 1px var(--geit-line);
}
.geit-lang__menu {
    border: 1px solid var(--geit-line);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-2);
    padding: 6px;
}
.geit-lang__menu .dropdown-item {
    border-radius: var(--r-sm);
    padding: .45rem .75rem;
    color: var(--geit-ink-2);
}
.geit-lang__menu .dropdown-item:hover { background: var(--geit-lilac-2); color: var(--geit-violet-3); }
.geit-lang__menu .dropdown-item.active,
.geit-lang__menu .dropdown-item:active {
    background: var(--geit-lilac);
    color: var(--geit-violet-3);
    font-weight: 500;
}

/* 手機選單 */
#mobileNavArea {
    background: rgba(251,249,245,.97);
    -webkit-backdrop-filter: saturate(180%) blur(16px);
    backdrop-filter: saturate(180%) blur(16px);
    border-left: 1px solid var(--geit-line);
}
#mobileNavArea .offcanvas-header { border-bottom: 1px solid var(--geit-line); }
#mobileNavArea .offcanvas-title { font-family: var(--font-serif); }
#mobileNavArea .nav-item.bg_RedLine_1 { border-bottom: 1px solid var(--geit-line-2); }
#mobileNavArea .nav-link {
    border-radius: 0;
    color: var(--geit-ink) !important;
    background: transparent;
}
#mobileNavArea .nav-link:hover { background: var(--geit-lilac-2); }
#mobileNavArea .Submenu_Hover .nav-link { color: var(--geit-ink-3) !important; border-radius: var(--r-sm); }

.geit-lang-m__item {
    display: inline-flex;
    align-items: center;
    padding: .3rem .75rem;
    border: 1px solid var(--geit-line);
    border-radius: var(--r-pill);
    background: #FFFFFF;
    color: var(--geit-ink-2);
    font-size: .9rem;
    text-decoration: none;
}
.geit-lang-m__item.active {
    border-color: var(--geit-violet-deep);
    background: var(--geit-lilac);
    color: var(--geit-violet-3);
}


/* ── 06 麵包屑 ───────────────────────────────────────────────────────── */
.crumb-pd {
    padding-top: clamp(18px, 2.4vw, 30px);
    margin-bottom: 0 !important;
    font-size: 14px;
    color: var(--geit-ink-3);
}
.crumb-pd > .container-sm {
    padding-left: var(--container-pad);
    padding-right: var(--container-pad);
}
.crumb-pd a { color: var(--geit-ink-3); transition: color .2s ease; }
/* 麵包屑後面緊接的區塊不要再空一大段 */
.crumb-pd + .ap-sec { padding-top: clamp(14px, 2vw, 24px); }
.crumb-pd a:hover { color: var(--geit-violet-deep); }
.crumb-pd .mx-2 { color: var(--geit-line); }

/* 2026-11-11 子選單分頁籤（_Breadcrumb 依選單輸出）：一排上圓角的頁籤，目前頁紫色底線。手機可左右滑 */
.geit-subnav { margin-top: 10px; }
.geit-subnav > .container-sm {
    padding-left: var(--container-pad);
    padding-right: var(--container-pad);
}
.geit-subnav__list {
    display: flex;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-x: auto;
    scrollbar-width: none;
    border-bottom: 1px solid var(--geit-line);
}
.geit-subnav__list::-webkit-scrollbar { display: none; }
.geit-subnav__link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-bottom: -1px;
    padding: 8px 18px;
    border-bottom: 2px solid transparent;
    border-radius: var(--r-md) var(--r-md) 0 0;
    font-size: 15px;
    letter-spacing: .04em;
    white-space: nowrap;
    color: var(--geit-ink-2);
    text-decoration: none;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.geit-subnav__link:hover { background: var(--geit-lilac-2); color: var(--geit-violet-deep); }
.geit-subnav__link.is-active {
    background: var(--geit-lilac-2);
    border-bottom-color: var(--geit-violet-deep);
    color: var(--geit-violet-3);
    font-weight: 600;
}
.geit-subnav + .ap-sec { padding-top: clamp(18px, 2.4vw, 32px); }


/* ── 07 磁磚卡片與深色帶 ─────────────────────────────────────────────── */
.ap-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--geit-surface);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease, border-color .35s ease;
}
a.ap-tile:hover,
button.ap-tile:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-2);
    border-color: var(--geit-lilac-line);
}

.ap-tile__pad { padding: clamp(24px, 3vw, 40px); }
.ap-tile__pad.ap-tile__pad--sm { padding: clamp(14px, 3.5vw, 20px); }

/* 滿版出血圖 */
.ap-tile__bleed {
    flex: 1 1 auto;
    min-height: 190px;
    overflow: hidden;
}
.ap-tile__bleed[style*="aspect-ratio"] { flex: 0 0 auto; }
.ap-tile__bleed > picture,
.ap-tile__bleed img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s cubic-bezier(.2,.7,.3,1);
}
.ap-tile:hover .ap-tile__bleed img { transform: scale(1.04); }

/* 深色卡片 */
.ap-tile--dark {
    background: var(--geit-plum);
    border-color: var(--geit-line-d);
    color: var(--geit-on-dark);
}
.ap-tile--dark .ap-title,
.ap-tile--dark .ap-headline,
.ap-tile--dark .ap-display,
.ap-tile--dark .contact-pd-title,
.ap-tile--dark .services-pd-title,
.ap-tile--dark .h1style-pd-title { color: var(--geit-gold) !important; }
.ap-tile--dark .ap-sub,
.ap-tile--dark .ap-body,
.ap-tile--dark .contact-pd-sub { color: var(--geit-on-dark-2) !important; }
.ap-tile--dark .ap-eyebrow { color: var(--geit-gold); }

/* 深色卡片裝飾：右上角兩個細線圓 */
.ap-tile--dark::before,
.ap-tile--dark::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}
.ap-tile--dark::before {
    right: -110px; top: -110px;
    width: 340px; height: 340px;
    border: 1px solid rgba(224,184,112,.22);
}
.ap-tile--dark::after {
    right: -50px; top: -50px;
    width: 220px; height: 220px;
    border: 1px solid rgba(148,100,228,.28);
}
.ap-tile--dark > * { position: relative; z-index: 1; }

/* 圖片疊字卡 */
.ap-tile--over {
    min-height: clamp(280px, 34vw, 440px);
    justify-content: flex-end;
    border: 0;
    background: var(--geit-plum);
}
.ap-tile--over > picture { display: contents; }
.ap-tile--over .ap-tile__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    transition: transform .6s cubic-bezier(.2,.7,.3,1);
}
a.ap-tile--over:hover .ap-tile__img { transform: scale(1.04); }
.ap-tile__scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(0deg, rgba(23,18,31,.82) 0%, rgba(23,18,31,.25) 50%, rgba(23,18,31,0) 75%);
    pointer-events: none;
}
.ap-tile__copy {
    position: relative;
    z-index: 2;
    padding: clamp(22px, 3vw, 36px);
}
.ap-tile--over .ap-title,
.ap-tile--over .ap-headline,
.ap-tile--over .services-pd-label { color: #FFFFFF !important; }
.ap-tile--over .ap-body,
.ap-tile--over .ap-sub { color: rgba(255,255,255,.88); }
.ap-tile--over .ap-eyebrow { color: var(--geit-gold-lit); }
.ap-tile--over .ap-link { color: var(--geit-gold-lit) !important; }
.ap-tile--over .ap-link:hover { color: var(--geit-gold) !important; }

/* 服務展示-1（_Services_3）：大螢幕時圖片卡不要太高 */
@media (min-width: 1200px) {
    .services3-pd .ap-tile--over { min-height: clamp(280px, 20vw, 380px); }
}

/* 服務展示卡（_Services_9）標題連結 */
.services-pd-label a { color: var(--geit-ink) !important; transition: color .2s ease; }
.services-pd-label a:hover { color: var(--geit-violet-deep) !important; }

/* 為何選擇黃金體驗（Layout 4 的 HTML 骨架，存在資料庫 Layout.LayoutData） */
.ap-band {
    position: relative;
    overflow: hidden;
    background: var(--geit-plum);
    border-radius: var(--r-xl);
    padding: clamp(40px, 6vw, 76px) clamp(20px, 4vw, 48px) !important;
    color: var(--geit-on-dark);
}
.ap-band::before {
    content: "";
    position: absolute;
    left: -140px; bottom: -200px;
    width: 440px; height: 440px;
    border-radius: 50%;
    border: 1px solid rgba(224,184,112,.2);
    pointer-events: none;
}
.ap-band__head {
    position: relative;
    text-align: center;
    margin-bottom: clamp(26px, 3.4vw, 46px);
}
.ap-band .ap-band__eyebrow { color: var(--geit-gold); }
.ap-band .ap-band__title { color: var(--geit-on-dark) !important; margin-bottom: .6rem; }
.ap-band .ap-band__sub {
    color: var(--geit-on-dark-2) !important;
    max-width: 60ch;
    margin-inline: auto;
}
.ap-band__grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(14px, 2vw, 24px);
    text-align: center;
}
.ap-band__stat {
    padding: clamp(18px, 2.4vw, 28px) 12px;
    border: 1px solid var(--geit-line-d);
    border-radius: var(--r-lg);
    background: rgba(255,255,255,.03);
}
.ap-band__stat br { display: none; }
.ap-band__num {
    display: block;
    font-family: var(--font-latin-display);
    font-size: clamp(2.4rem, 4vw, 3.4rem);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: .02em;
    color: var(--geit-gold) !important;
}
.ap-band__lab {
    display: block;
    margin-top: 6px;
    font-size: 14px;
    line-height: 1.6;
    letter-spacing: .1em;
    color: var(--geit-on-dark-2) !important;
}
@media (max-width: 767.98px) {
    .ap-band__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* ── 08 大廣告輪播 ───────────────────────────────────────────────────── */
.ap-banner__frame {
    position: relative;
    border-radius: var(--r-xl);
    overflow: hidden;
    background: var(--geit-plum);
    isolation: isolate;
}
.ap-banner .carousel-item { background: var(--geit-plum); }
.ap-banner .carousel-item:has(iframe) { aspect-ratio: 16 / 9; }
.ap-banner .carousel-item iframe { border-radius: 0; height: 100%; }
.WH_24_9 { aspect-ratio: 24 / 9; overflow: hidden; }

.ap-banner__hit { display: block; position: absolute; inset: 0; z-index: 0; }
.ap-banner__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ap-banner__overlay {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    align-items: flex-end;
    text-align: left;
    pointer-events: none;
}
.ap-banner__overlay .custom-btn,
.ap-banner__overlay a { pointer-events: auto; }
.ap-banner__copy {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: clamp(24px, 3.4vw, 52px);
}
.ap-banner__copy .ap-headline,
.ap-banner__copy .banner-pd-title { color: #FFFFFF; }
.ap-banner__copy .ap-title,
.ap-banner__copy .banner-pd-sub { color: var(--geit-gold-lit); }
.ap-banner__copy .ap-body,
.ap-banner__copy .banner-pd-desc { color: rgba(255,255,255,.88); }
.ap-banner__copy .Banner_h2 {
    font-size: clamp(1.6rem, 2.8vw, 2.4rem);
    line-height: 1.35;
    letter-spacing: .03em;
}
.ap-banner__copy .Banner_Det {
    font-size: 15px;
    line-height: var(--lh-body);
    letter-spacing: var(--ls-body);
    font-weight: 400;
}

/* 左右切換：圓形細框按鈕，滑入輪播時才出現 */
.ap-banner .banner-pd-arrow {
    width: 8% !important;
    min-width: 56px;
    height: 100%;
    top: 0;
    z-index: 4;
    opacity: 0;
    transition: opacity .25s ease;
}
.ap-banner__frame:hover .banner-pd-arrow,
.ap-banner .banner-pd-arrow:focus-visible { opacity: 1; }
.banner-pd-arrow-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(224,184,112,.7);
    background: rgba(23,18,31,.35);
    color: var(--geit-gold-lit);
    font-size: 1.1rem;
    transition: background .25s ease, border-color .25s ease, color .25s ease;
}
.banner-pd-arrow:hover .banner-pd-arrow-ico {
    background: var(--geit-gold);
    border-color: var(--geit-gold);
    color: var(--geit-plum);
}

/* 下方指示點：膠囊 */
.ap-banner .banner-pd-indicators { z-index: 4; margin-bottom: 1rem; }
.banner-pd-indicators [data-bs-target] {
    width: 24px;
    height: 4px;
    border: 0;
    border-radius: var(--r-pill);
    background: rgba(255,255,255,.5);
    opacity: 1;
    transition: width .25s ease, background-color .25s ease;
}
.banner-pd-indicators .active { width: 40px; background: var(--geit-gold); }

.carousel-control-next, .carousel-control-prev { width: 5% !important; }

/* 手機：有文案的 slide 改成「圖在上、文字在下」 */
@media (max-width: 767.98px) {
    .ap-banner__frame { border-radius: var(--r-lg); container-type: inline-size; }
    .ap-banner .carousel-item.ap-banner__slide--copy { aspect-ratio: auto; overflow: visible; }
    .ap-banner .ap-banner__slide--copy > .position-relative { height: auto !important; overflow: visible !important; }
    .ap-banner__slide--copy .ap-banner__img { position: static; height: auto; aspect-ratio: 24 / 9; }
    .ap-banner__slide--copy .ap-banner__hit { bottom: auto; height: auto; aspect-ratio: 24 / 9; }
    .ap-banner__slide--copy .ap-banner__overlay {
        position: static;
        display: block;
        background: var(--geit-plum);
        pointer-events: auto;
    }
    .ap-banner__slide--copy .ap-banner__overlay .ap-tile__scrim { display: none; }
    .ap-banner__copy { padding: 18px 18px 22px; }
    .ap-banner__copy .Banner_h2 { font-size: 21px; line-height: 1.45; }
    .ap-banner__copy .ap-title { font-size: 16px; }
    .ap-banner__copy .Banner_Det { font-size: 14px; line-height: 1.75; }
    .ap-banner__copy .banner-pd-cta { min-height: 40px; padding: 7px 18px; font-size: 14px; }
    .ap-banner .banner-pd-indicators { top: calc(37.5cqw - 26px); bottom: auto; margin-bottom: 0; }
    .ap-banner .banner-pd-arrow { display: none; }
}


/* ── 09 常見問題 ─────────────────────────────────────────────────────── */
.tci-faq__title { color: var(--geit-ink); }
.tci-faq__frame {
    max-width: 100%;
    background: transparent;
    border: 0;
    padding: 0;
}
.tci-faq .accordion { display: flex; flex-direction: column; gap: 12px; }
.tci-faq .accordion-item {
    background: var(--geit-surface);
    border: 1px solid var(--geit-line) !important;
    border-radius: var(--r-lg) !important;
    overflow: hidden;
    transition: border-color .2s ease;
}
.tci-faq .accordion-item:has(.accordion-button:not(.collapsed)) { border-color: var(--geit-lilac-line) !important; }
.tci-faq .accordion-header { margin: 0; font-size: inherit; }
.tci-faq .accordion-button,
.tci-faq .accordion-button.collapsed {
    background: transparent;
    color: var(--geit-ink);
    font-family: var(--font-sans);
    font-size: 17px;
    font-weight: 500;
    line-height: 1.6;
    letter-spacing: .04em;
    padding: 18px 24px;
    border: 0;
    border-radius: 0 !important;
    box-shadow: none;
}
.tci-faq .accordion-button.collapsed:hover { color: var(--geit-violet-deep); }
.tci-faq .accordion-button:not(.collapsed) { background: transparent; color: var(--geit-violet-3); }
.tci-faq .accordion-button:focus { box-shadow: inset 0 0 0 2px rgba(91,58,158,.3); }

/* 右側＋／－圓鈕 */
.tci-faq .accordion-button::after {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    margin-left: 16px;
    border-radius: 50%;
    border: 0;
    background: var(--geit-lilac) !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
    content: "\002B";
    color: var(--geit-violet-deep);
    font-size: 1.15rem;
    font-weight: 500;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: none;
    transition: background-color .2s ease, color .2s ease;
}
.tci-faq .accordion-button:not(.collapsed)::after {
    content: "\2212";
    background: var(--geit-violet-deep) !important;
    color: #FFFFFF;
}
.tci-faq .accordion-body {
    padding: 0 24px 22px;
    font-size: 16px;
    line-height: var(--lh-body);
    color: var(--geit-ink-2);
}
.tci-faq .accordion-body > :last-child { margin-bottom: 0; }

/* 問答答案裡的免責段 */
.qna-disclaimer {
    font-size: 13px;
    color: var(--geit-ink-3);
    border-top: 1px dashed var(--geit-line);
    padding-top: 10px;
    margin-top: 12px;
}

/* 其他地方用到的 Bootstrap 摺疊（非 FAQ） */
.accordion-item { border-color: var(--geit-line); }
.accordion-button:not(.collapsed) { background: var(--geit-lilac-2); color: var(--geit-violet-3); box-shadow: none; }
.accordion-button:focus { box-shadow: 0 0 0 .2rem rgba(91,58,158,.2); }


/* ── 10 編輯器內容 ───────────────────────────────────────────────────── */
.ap-editor {
    background: var(--geit-surface);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
    padding: clamp(24px, 3.4vw, 48px) !important;
}
.EditPlace a,
.ap-editor a { color: var(--geit-violet-deep); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(91,58,158,.35); }
.EditPlace a:hover,
.ap-editor a:hover { color: var(--geit-violet-3); text-decoration-color: currentColor; }
.ap-editor img { border-radius: var(--r-md); height: auto; }
.ap-editor figure.image { text-align: center; }
.ap-editor h2 { margin-top: 1.6em; margin-bottom: .6em; }
.ap-editor h3 { margin-top: 1.4em; margin-bottom: .5em; }
.ap-editor > :first-child { margin-top: 0; }
.ap-editor > :last-child { margin-bottom: 0; }
.ap-editor ul, .ap-editor ol { padding-left: 1.4rem; }
.ap-editor li { margin-bottom: .35em; line-height: var(--lh-body); }
.ap-editor blockquote {
    margin: 1.4em 0;
    padding: 18px 24px;
    background: var(--geit-lilac-2);
    border-radius: var(--r-md);
    color: var(--geit-ink-2);
}
.ap-editor table { width: 100%; border-collapse: collapse; }
.ap-editor table th,
.ap-editor table td { border: 1px solid var(--geit-line); padding: 10px 14px; }
.ap-editor table th { background: var(--geit-lilac-2); }

/* 舊版 vw 標題字級（資料庫內容還有用到） */
@media (min-width: 992px) { .vw-lg-title-3 { font-size: 3vw; } }
@media (max-width: 991.98px) { .vw-title-5 { font-size: 5vw; } }

/* ed-＊：章節化的上稿結構（內容含 ed-block 時 _EditorData_8 會加 ap-editor--grid） */
.ap-editor--grid { background: transparent; border: 0; padding: 0 !important; display: grid; gap: 16px; }
.ap-editor--grid > .ed-block,
.ap-editor--grid > .ed-hero {
    background: var(--geit-surface);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
    padding: clamp(22px, 3vw, 40px);
}
.ap-editor .ed-hero { padding-bottom: clamp(22px, 2.8vw, 38px); }
.ap-editor .ed-hero__title { font-family: var(--font-serif); font-size: clamp(1.9rem, 3.4vw, 2.8rem); font-weight: 700; line-height: 1.4; margin: 0 0 clamp(14px, 1.6vw, 20px); }
.ap-editor .ed-hero__lead { font-size: clamp(1.02rem, 1.3vw, 1.2rem); line-height: 1.95; color: var(--geit-ink); max-width: 62ch; margin: 0; }
.ap-editor .ed-hero__note { max-width: 66ch; margin: 1.1em 0 0; color: var(--geit-ink-2); }
.ap-editor .ed-hero__sub { margin: 0 0 clamp(14px, 1.6vw, 20px); font-size: clamp(1.15rem, 1.7vw, 1.5rem); font-weight: 600; line-height: 1.6; }
.ap-editor .ed-hero__aside { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); align-items: center; justify-items: start; margin-top: clamp(20px, 2.4vw, 30px); }
.ap-editor .ed-hero__aside img { width: 100%; max-width: 124px; height: auto; }
.ap-editor .ed-facts { display: flex; flex-direction: column; margin-top: clamp(20px, 2.4vw, 30px); }
.ap-editor .ed-fact { display: flex; align-items: baseline; gap: 14px; padding: clamp(9px, 1.1vw, 13px) 0; border-bottom: 1px solid var(--geit-line); }
.ap-editor .ed-fact:last-child { border-bottom: 0; }
.ap-editor .ed-fact__n { flex: 0 0 auto; min-width: 4.2em; font-family: var(--font-latin-display); font-size: clamp(1.6rem, 2.2vw, 2.1rem); font-weight: 600; line-height: 1.2; color: var(--geit-gold-deep); }
.ap-editor .ed-fact__l { font-size: 14px; line-height: 1.6; color: var(--geit-ink-2); }
.ap-editor .ed-facts--row { flex-direction: row; flex-wrap: wrap; gap: clamp(20px, 3vw, 52px); padding-top: clamp(16px, 2vw, 22px); border-top: 1px solid var(--geit-line); }
.ap-editor .ed-facts--row .ed-fact { display: block; padding: 0; border-bottom: 0; }
.ap-editor .ed-facts--row .ed-fact__n,
.ap-editor .ed-facts--row .ed-fact__l { display: block; min-width: 0; }
.ap-editor .ed-block { padding: clamp(24px, 3vw, 42px) 0; border-top: 1px solid var(--geit-line); }
/* 2026-11-11 卡片版（--grid）的 ed-block 要保留左右內距：上一行 .ap-editor .ed-block 的 padding 左右是 0，
   兩者權重相同、後寫的贏，所以這裡要寫在它後面再補一次 */
.ap-editor--grid > .ed-block { border-top: 1px solid var(--geit-line); padding: clamp(22px, 3vw, 40px); }
.ap-editor .ed-block__h { position: relative; padding-top: 18px; margin: 0 0 1.1em; font-family: var(--font-serif); font-size: clamp(1.15rem, 1.5vw, 1.4rem); font-weight: 600; line-height: 1.6; }
.ap-editor .ed-block__h::before { content: ""; position: absolute; top: 0; left: 0; width: 32px; height: 3px; border-radius: 3px; background: var(--geit-gold); }
.ap-editor .ed-block--intro .ed-block__h { font-size: clamp(1.6rem, 2.6vw, 2.2rem); font-weight: 700; }
.ap-editor .ed-block__b > :first-child { margin-top: 0; }
.ap-editor .ed-block__b > :last-child { margin-bottom: 0; }
.ap-editor .ed-block__b p { max-width: 68ch; margin-bottom: 1.1em; color: var(--geit-ink-2); }
.ap-editor .ed-sub { margin: clamp(20px, 2.2vw, 30px) 0 .5em; font-size: 1rem; font-weight: 600; letter-spacing: .04em; }
.ap-editor .ed-block__b > .ed-sub:first-child { margin-top: 0; }
.ap-editor .ed-sub .ed-sub__en { color: var(--geit-gold-deep); }
.ap-editor .ed-list { list-style: none; max-width: 68ch; padding: 0; margin: 0 0 1.1em; }
.ap-editor .ed-list li { position: relative; padding-left: 22px; margin-bottom: .55em; color: var(--geit-ink-2); }
.ap-editor .ed-list li::before { content: ""; position: absolute; left: 0; top: .7em; width: 8px; height: 8px; border-radius: 50%; background: var(--geit-gold); }
.ap-editor .ed-list li:last-child { margin-bottom: 0; }
.ap-editor .ed-list--rows { display: flex; flex-direction: column; margin-bottom: 0; }
.ap-editor .ed-list--rows li { display: flex; align-items: center; min-height: 2.8em; margin-bottom: 0; padding-top: .5em; padding-bottom: .5em; border-bottom: 1px solid var(--geit-line); }
.ap-editor .ed-list--rows li:last-child { border-bottom: 0; }
.ap-editor .ed-list--rows li::before { top: 50%; transform: translateY(-50%); }
.ap-editor .ed-list--2col { columns: 2; column-gap: clamp(28px, 3.5vw, 52px); }
.ap-editor .ed-list--2col li { break-inside: avoid; }
.ap-editor .ed-list--num { counter-reset: ednum; }
.ap-editor .ed-list--num li { padding-left: 30px; }
.ap-editor .ed-list--num li::before { counter-increment: ednum; content: counter(ednum) "."; top: 0; width: auto; height: auto; border-radius: 0; background: none; color: var(--geit-violet-deep); font-size: 14px; font-weight: 700; line-height: inherit; }
.ap-editor .ed-list--def li { margin-bottom: .95em; }
.ap-editor .ed-key { display: block; margin-bottom: .1em; font-weight: 600; color: var(--geit-ink); }
.ap-editor .ed-prose2 { columns: 2; column-gap: clamp(32px, 4vw, 56px); }
.ap-editor .ed-steps { counter-reset: edstep; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: clamp(12px, 1.4vw, 18px); margin: clamp(22px, 2.6vw, 32px) 0 0; padding: 0; }
.ap-editor .ed-steps li { padding: clamp(18px, 1.8vw, 24px); border: 1px solid var(--geit-line); border-radius: var(--r-lg); background: var(--geit-ground); }
.ap-editor .ed-steps li::before { counter-increment: edstep; content: counter(edstep, decimal-leading-zero); display: block; margin-bottom: 10px; font-family: var(--font-latin-display); font-size: 30px; font-weight: 600; line-height: 1; color: var(--geit-gold-deep); }
/* 2026-11-12 CKEditor 39 的清單功能（舊版 List）存檔時會把 <ul>／<ol>／<li> 的 class 與 style 全部拿掉，
   所以清單的 class 改掛在外層 <div>：<div class="ed-list"><ul>…</ul></div>。
   li 的樣式本來就是後代選擇器，兩種寫法都適用；這裡補「清單本身」那一層（div 不當排版容器，交給裡面的 ul／ol）。
   舊寫法 <ul class="…"> 仍然有效，只是在 CKEditor 裡存過一次就會掉 class。 */
.ap-editor div.ed-list > ul, .ap-editor div.ed-list > ol,
.ap-editor div.ed-steps > ul, .ap-editor div.ed-steps > ol,
.ap-editor div.pd-langs > ul,
div.geit-cv__list > ul { list-style: none; margin: 0; padding: 0; }
.ap-editor div.ed-steps,
.ap-editor div.pd-langs { display: block; }
.ap-editor div.ed-steps > ul,
.ap-editor div.ed-steps > ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: clamp(12px, 1.4vw, 18px); }
.ap-editor div.pd-langs > ul { display: flex; flex-wrap: wrap; gap: 8px; }
.ap-editor .ed-step__t { display: block; margin-bottom: .45em; font-weight: 600; color: var(--geit-ink); }
.ap-editor .ed-step__d { display: block; font-size: 15px; line-height: 1.9; color: var(--geit-ink-2); }
.ap-editor .ed-flow { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 6px; margin: clamp(16px, 1.8vw, 22px) 0; padding: 0; }
.ap-editor .ed-flow li { padding: 7px 14px; border: 1px solid var(--geit-line); border-radius: var(--r-pill); font-size: 14px; color: var(--geit-ink-2); white-space: nowrap; }
.ap-editor .ed-flow li + li::before { content: "→"; margin: 0 12px 0 -20px; color: var(--geit-gold-deep); }
.ap-editor .ed-files { display: flex; flex-wrap: wrap; gap: 10px; margin: clamp(16px, 1.8vw, 22px) 0; }
.ap-editor a.ed-file { display: inline-flex; align-items: center; gap: 6px; padding: 9px 18px; border: 1px solid var(--geit-line); border-radius: var(--r-pill); background: var(--geit-surface); color: var(--geit-ink); font-size: 14px; text-decoration: none; transition: border-color .2s ease, color .2s ease; }
.ap-editor a.ed-file:hover { border-color: var(--geit-violet-deep); color: var(--geit-violet-deep); }
.ap-editor a.ed-file i { margin: 0 !important; font-size: 15px; }
.ap-editor .ed-tablewrap { overflow-x: auto; margin: clamp(20px, 2.4vw, 28px) 0; border: 1px solid var(--geit-line); border-radius: var(--r-lg); }
.ap-editor .ed-table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 15px; color: var(--geit-ink-2); }
.ap-editor .ed-table th,
.ap-editor .ed-table td { padding: clamp(10px, 1.1vw, 14px) clamp(12px, 1.2vw, 16px); border: 0; border-right: 1px solid var(--geit-line); border-bottom: 1px solid var(--geit-line); text-align: left; vertical-align: top; line-height: 1.8; }
.ap-editor .ed-table th:last-child,
.ap-editor .ed-table td:last-child { border-right: 0; }
.ap-editor .ed-table tbody tr:last-child td { border-bottom: 0; }
.ap-editor .ed-table thead th { background: var(--geit-plum); border-right-color: rgba(224,184,112,.2); border-bottom-color: var(--geit-plum); color: var(--geit-gold-lit); font-weight: 500; white-space: nowrap; }
.ap-editor .ed-table tbody tr:nth-child(even) { background: var(--geit-ground); }
.ap-editor .ed-table p { max-width: none; margin: 0; }
.ap-editor .ed-figure { margin: clamp(20px, 2.4vw, 28px) 0; }
.ap-editor .ed-figure:first-child { margin-top: 0; }
.ap-editor .ed-figure:last-child { margin-bottom: 0; }
.ap-editor .ed-figure img { display: block; width: auto; max-width: 100%; height: auto; margin-inline: auto; }
.ap-editor .ed-figures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); align-items: start; margin: clamp(20px, 2.4vw, 28px) 0; }
.ap-editor .ed-figures .ed-figure { margin: 0; }
.ap-editor .ed-figures .ed-figure:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; max-width: calc(50% - 10px); }
.ap-editor .ed-media { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: clamp(18px, 2.4vw, 36px); align-items: center; margin: clamp(22px, 2.6vw, 32px) 0; }
.ap-editor .ed-media--right { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.ap-editor .ed-media__figure { margin: 0; }
.ap-editor .ed-media__figure img { display: block; width: auto; max-width: 100%; height: auto; margin-inline: auto; }
.ap-editor .ed-media__figure video { display: block; width: 100%; height: auto; border-radius: var(--r-md); }
.ap-editor .ed-media__body > :first-child { margin-top: 0; }
.ap-editor .ed-media__body > :last-child { margin-bottom: 0; }
.ap-editor .ed-note { margin-top: .6em; font-size: 13px; line-height: 1.8; color: var(--geit-ink-3); }
.ap-editor .ed-sign { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; margin: clamp(20px, 2.4vw, 30px) 0 0; padding-top: clamp(16px, 2vw, 22px); border-top: 1px solid var(--geit-line); }
.ap-editor .ed-sign__role { font-weight: 600; color: var(--geit-ink); }
.ap-editor .ed-sign__img { max-width: 220px; height: auto; }

@media (min-width: 768px) {
    .ap-editor .ed-media__figure img,
    .ap-editor .ed-media__figure video { max-height: clamp(220px, 26vw, 340px); }
}
@media (max-width: 767.98px) {
    .ap-editor .ed-figures { grid-template-columns: 1fr; }
    .ap-editor .ed-media,
    .ap-editor .ed-media--right { grid-template-columns: 1fr; gap: 14px; }
    .ap-editor .ed-media--right .ed-media__figure { order: -1; }
    .ap-editor .ed-list--2col,
    .ap-editor .ed-prose2 { columns: 1; }
    .ap-editor .ed-flow li + li::before { margin-left: -14px; margin-right: 8px; }
    /* 表格在手機改成一列一張卡，td 用 data-label 顯示欄名 */
    .ap-editor .ed-tablewrap { overflow-x: visible; border: 0; border-radius: 0; }
    .ap-editor .ed-table { display: block; min-width: 0; }
    .ap-editor .ed-table thead { display: none; }
    .ap-editor .ed-table tbody { display: block; }
    .ap-editor .ed-table tbody tr,
    .ap-editor .ed-table tbody tr:nth-child(even) { display: block; margin-bottom: 12px; padding: 16px 18px; border: 1px solid var(--geit-line); border-radius: var(--r-lg); background: var(--geit-surface); }
    .ap-editor .ed-table tbody tr:last-child { margin-bottom: 0; }
    .ap-editor .ed-table tbody tr[data-group]::before { content: attr(data-group); display: block; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--geit-line); font-weight: 600; color: var(--geit-ink); }
    .ap-editor .ed-table tbody td { display: block; padding: 6px 0; border: 0; }
    .ap-editor .ed-table tbody td[data-span] { display: none; }
    .ap-editor .ed-table tbody td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 2px; font-size: 12px; letter-spacing: .08em; color: var(--geit-ink-3); }
}

/* geit-＊：黃金體驗上稿用的內容區塊（存在資料庫 Article_Row 的編輯器內容） */

/* 合作流程三步驟 */
.geit-process { padding-block: .5rem; }
.geit-process__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.geit-process__step {
    position: relative;
    padding: 2rem 1.6rem 1.8rem;
    background: var(--geit-ground);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
}
.geit-process__no { display: block; font-family: var(--font-latin-display); font-size: 2.75rem; font-weight: 600; line-height: 1; color: var(--geit-gold-deep); margin-bottom: .75rem; }
.geit-process__t { font-family: var(--font-serif); font-size: 1.15rem; font-weight: 600; margin-bottom: .6rem; color: var(--geit-ink); }
.geit-process__d { font-size: .95rem; line-height: 1.9; color: var(--geit-ink-2); margin-bottom: 0; }

/* 案例內文 */
.geit-case { max-width: 68ch; margin-inline: auto; }
.geit-case__meta {
    font-family: var(--font-latin-display);
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--geit-gold-deep);
    padding-bottom: .9rem;
    border-bottom: 1px solid var(--geit-line);
    margin-bottom: 2rem;
}
.geit-case h2,
.geit-case h3 {
    position: relative;
    font-family: var(--font-serif);
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.5;
    margin: 2rem 0 .65rem;
    padding-left: 1rem;
    color: var(--geit-ink);
}
.geit-case h2::before,
.geit-case h3::before {
    content: "";
    position: absolute;
    left: 0; top: .3em; bottom: .3em;
    width: 4px;
    border-radius: 4px;
    background: var(--geit-gold);
}
.geit-case h2:first-of-type,
.geit-case h3:first-of-type { margin-top: 0; }
.geit-case p { font-size: .98rem; line-height: 2; color: var(--geit-ink-2); }
.geit-case__link a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-top: .5rem;
    padding: .6rem 1.6rem;
    border: 1px solid var(--geit-violet-deep);
    border-radius: var(--r-pill);
    color: var(--geit-violet-deep);
    text-decoration: none;
    font-size: .9rem;
    letter-spacing: .08em;
    transition: background-color .2s ease, color .2s ease;
}
.geit-case__link a:hover,
.geit-case__link a:focus-visible { background: var(--geit-violet-deep); color: #FFFFFF; }

/* 案例：左文右圖 */
.geit-case-wrap .geit-case { margin-inline: 0; max-width: none; }
.geit-case-wrap__fig { margin: 0; }
.geit-case-wrap__fig a { display: block; }
.geit-case-wrap__fig img {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
    box-shadow: 0 18px 40px -24px rgba(23,18,31,.35);
}
@media (min-width: 992px) {
    .geit-case-wrap__fig { position: sticky; top: calc(var(--header-height) + 1.5rem); }
}
@media (max-width: 991.98px) {
    .geit-case-wrap__fig { margin-bottom: 1.5rem; }
}

/* 產業經驗：文字＋圖片，偶數區塊左右交換 */
.geit-ind { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 2.5rem; padding-block: 1rem; }
.geit-ind__tag {
    grid-column: 1;
    justify-self: start;
    align-self: end;
    display: inline-block;
    padding: .25rem .9rem;
    border: 1px solid var(--geit-gold);
    border-radius: var(--r-pill);
    font-family: var(--font-latin-display);
    font-size: .9rem;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--geit-gold-deep);
}
.geit-ind__t { grid-column: 1; font-family: var(--font-serif); font-size: 1.6rem; font-weight: 600; line-height: 1.5; margin: .75rem 0 0; color: var(--geit-ink); }
.geit-ind__d { grid-column: 1; font-size: .95rem; line-height: 1.95; color: var(--geit-ink-2); margin: 0; }
.geit-ind__img { grid-column: 2; grid-row: 1 / span 3; margin: 0; }
.geit-ind__img img { display: block; width: 100%; height: auto; border: 1px solid var(--geit-line); border-radius: var(--r-lg); }
/* 產業經驗每一段的功能清單（原本寫在 <ul>／<li> 的 inline style，CKEditor 存檔會被拿掉，2026-11-12 改成外層 div 的 class） */
.geit-ind__list ul { list-style: none; margin: 1rem 0 0; padding: 0; border-top: 1px solid var(--geit-line); }
.geit-ind__list li { padding: .5rem 0; border-bottom: 1px solid var(--geit-line); font-size: .86rem; line-height: 1.7; }
.ap-sec:nth-of-type(even) .geit-ind__tag,
.ap-sec:nth-of-type(even) .geit-ind__t,
.ap-sec:nth-of-type(even) .geit-ind__d { grid-column: 2; }
.ap-sec:nth-of-type(even) .geit-ind__img { grid-column: 1; }

/* 技術履歷 */
.geit-cv { max-width: 78ch; margin-inline: auto; }
.geit-cv__note { font-size: .9rem; line-height: 1.95; color: var(--geit-ink-2); padding-bottom: 1.25rem; border-bottom: 1px solid var(--geit-line); margin-bottom: 2.25rem; }
.geit-cv__era { margin-bottom: 2.5rem; }
.geit-cv__period { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 600; line-height: 1.5; color: var(--geit-gold-deep); margin: 0 0 .15rem; }
.geit-cv__role { font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: var(--geit-ink-3); margin: 0 0 1rem; }
.geit-cv__list { list-style: none; margin: 0; padding: 0; border: 1px solid var(--geit-line); border-radius: var(--r-lg); overflow: hidden; background: var(--geit-surface); }
.geit-cv__list li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 1.5rem; align-items: baseline; padding: .9rem 1.25rem; border-bottom: 1px solid var(--geit-line-2); }
.geit-cv__list li:last-child { border-bottom: 0; }
.geit-cv__name { grid-column: 1; grid-row: 1 / span 2; font-size: .98rem; font-weight: 600; color: var(--geit-ink); padding-left: .8rem; border-left: 3px solid var(--geit-gold); }
.geit-cv__stack { grid-column: 2; font-size: .85rem; line-height: 1.6; color: var(--geit-ink-2); font-variant-numeric: tabular-nums; }
.geit-cv__tail { grid-column: 2; font-size: .8rem; letter-spacing: .06em; color: var(--geit-gold-deep); margin-top: .25rem; }

/* 技術標籤 */
.geit-tags { max-width: 78ch; margin-inline: auto; }
.geit-tags__head { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 600; color: var(--geit-ink); margin: 0 0 .6rem; }
.geit-tags__lead { font-size: .95rem; line-height: 1.95; color: var(--geit-ink-2); margin-bottom: 1.5rem; }
.geit-tags__row { display: flex; flex-wrap: wrap; gap: .5rem; }
.geit-tags__item {
    display: inline-block;
    padding: .4rem 1rem;
    border: 1px solid var(--geit-line);
    border-radius: var(--r-pill);
    background: var(--geit-surface);
    font-size: .88rem;
    color: var(--geit-ink);
}

@media (max-width: 991.98px) {
    .geit-process__grid { grid-template-columns: 1fr; gap: 1rem; }
    .geit-ind { grid-template-columns: 1fr; gap: 1.25rem; }
    .geit-ind__tag, .geit-ind__t, .geit-ind__d, .geit-ind__img,
    .ap-sec:nth-of-type(even) .geit-ind__tag,
    .ap-sec:nth-of-type(even) .geit-ind__t,
    .ap-sec:nth-of-type(even) .geit-ind__d,
    .ap-sec:nth-of-type(even) .geit-ind__img { grid-column: 1; grid-row: auto; }
}
@media (max-width: 767.98px) {
    .geit-cv__list li { grid-template-columns: 1fr; row-gap: .25rem; }
    .geit-cv__name, .geit-cv__stack, .geit-cv__tail { grid-column: 1; grid-row: auto; }
    .geit-cv__stack, .geit-cv__tail { padding-left: .95rem; }
}


/* ── 11 列表、搜尋、分頁 ─────────────────────────────────────────────── */
.ap-srch__filter { background: var(--geit-surface); }
.ap-srch__filter .ap-tile__pad { padding: clamp(20px, 2.4vw, 30px); }

.ap-srch__lab {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .12em;
    color: var(--geit-ink-3);
    white-space: nowrap;
}

/* 搜尋輸入框（膠囊） */
.ap-srch__box {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    background: var(--geit-ground);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-pill);
    padding: 6px 18px;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.ap-srch__box:focus-within {
    background: #FFFFFF;
    border-color: var(--geit-violet-deep);
    box-shadow: 0 0 0 .2rem rgba(91,58,158,.15);
}
.ap-srch__box i { flex: 0 0 auto; color: var(--geit-ink-3); font-size: .95rem; line-height: 1; }
.ap-srch__box input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    font-family: inherit;
    font-size: 15px;
    line-height: 1.5;
    color: var(--geit-ink);
}
.ap-srch__reset { padding: 8px 20px; min-height: 44px; font-size: 14px; }

.ap-srch__grp { display: flex; align-items: flex-start; gap: 14px; }
.ap-srch__grp + .ap-srch__grp { margin-top: 12px; }
.ap-srch__grp > .ap-srch__lab { flex: 0 0 auto; min-width: 56px; padding-top: 10px; }

/* 篩選標籤 */
.ap-chipset { display: flex; flex-wrap: wrap; gap: 8px; }
.ap-chiptag {
    min-height: 40px;
    padding: 6px 16px;
    border: 1px solid var(--geit-line);
    border-radius: var(--r-pill);
    background: #FFFFFF;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
    color: var(--geit-ink-2);
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.ap-chiptag:hover { border-color: var(--geit-violet-deep); color: var(--geit-violet-deep); }
.ap-chiptag.on { background: var(--geit-violet-deep); border-color: var(--geit-violet-deep); color: #FFFFFF; }
.ap-chiptag:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(91,58,158,.28); }

.ap-srch__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin: clamp(20px, 2.4vw, 30px) 0 14px;
}
.ap-srch__grid > [class*="col-"] { display: flex; }
.ap-srch__grid .ap-tile { width: 100%; }

/* 列表卡片（作品、最新消息、搜尋結果） */
.ap-news__img { background: var(--geit-lilac-2); }
.ap-news .ap-news__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 20px 22px 22px;
}
.ap-news__title {
    color: var(--geit-ink) !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color .2s ease;
}
.ap-news:hover .ap-news__title { color: var(--geit-violet-deep) !important; }
.ap-news .ap-body {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ap-news__cta { margin-top: auto; padding-top: 14px; }
/* 搜尋關鍵字高亮 */
.ap-news__title .lab_tcicolor_1,
.ap-news .ap-body .lab_tcicolor_1 { color: var(--geit-violet-deep) !important; background: var(--geit-lilac); border-radius: 4px; padding: 0 2px; }

.ap-news__cut.form-select {
    border: 1px solid var(--geit-line);
    border-radius: var(--r-pill);
    box-shadow: none;
    font-size: 14px;
    padding: 6px 34px 6px 16px;
}
.ap-news__cut.form-select:focus { border-color: var(--geit-violet-deep); box-shadow: 0 0 0 .2rem rgba(91,58,158,.15); }

/* 文章頁頁首（分類／日期） */
.ap-arthead__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; margin-bottom: 10px; }
.ap-arthead__meta .ap-eyebrow { display: inline; margin: 0; }

/* 分頁 */
.pagination {
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    --bs-pagination-color: var(--geit-ink-2);
    --bs-pagination-bg: #FFFFFF;
    --bs-pagination-border-color: var(--geit-line);
    --bs-pagination-hover-color: var(--geit-violet-deep);
    --bs-pagination-hover-bg: var(--geit-lilac-2);
    --bs-pagination-hover-border-color: var(--geit-lilac-line);
    --bs-pagination-focus-color: var(--geit-violet-deep);
    --bs-pagination-focus-bg: var(--geit-lilac-2);
    --bs-pagination-focus-box-shadow: 0 0 0 .2rem rgba(91,58,158,.2);
    --bs-pagination-active-color: #FFFFFF;
    --bs-pagination-active-bg: var(--geit-violet-deep);
    --bs-pagination-active-border-color: var(--geit-violet-deep);
    --bs-pagination-disabled-color: #B9B0C0;
    --bs-pagination-disabled-bg: #FFFFFF;
    --bs-pagination-disabled-border-color: var(--geit-line-2);
}
.pagination .page-link {
    min-width: 40px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-pill) !important;
    margin: 0 !important;
    font-size: 14px;
}


/* ── 12 表單、聯絡我們 ───────────────────────────────────────────────── */
.form-control,
.form-select {
    min-height: 46px;
    border: 1px solid #D9CFC0;
    border-radius: var(--r-md);
    background-color: #FFFFFF;
    color: var(--geit-ink);
    transition: border-color .2s ease, box-shadow .2s ease;
}
textarea.form-control { min-height: 120px; }
.form-control.rounded-pill,
.search-input-magic { min-height: 0; }
.form-control:focus,
.form-select:focus {
    border-color: var(--geit-violet-deep);
    box-shadow: 0 0 0 .2rem rgba(91,58,158,.15);
}
.form-control::placeholder { color: #9A91A3; }

.input-group-text {
    border: 1px solid #D9CFC0;
    border-radius: var(--r-md);
    background: var(--geit-lilac-2);
    color: var(--geit-ink-2);
}
.input-group > .input-group-text { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .form-control { border-top-left-radius: 0; border-bottom-left-radius: 0; }

.col-form-label { color: var(--geit-ink); font-weight: 500; font-size: 15px; }
input[type=checkbox],
input[type=radio] { accent-color: var(--geit-violet-deep); }

/* 聯絡我們頁 */
.contactview-pd-card .ap-tile__pad { padding: clamp(24px, 3.4vw, 48px); }
.contactview-pd .text-danger { color: #B42318 !important; }

/* 首頁「與專家聯絡」區塊（_TalkToExpert_21） */
.expert-pd > .container-sm > .ap-tile { overflow: visible; }


/* ── 13 彈出視窗 ─────────────────────────────────────────────────────── */
.modal-content {
    border: 0;
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: var(--shadow-2);
}
.modal-header { border-bottom: 1px solid var(--geit-line); }
.modal-header.btn-red {
    background: var(--geit-plum);
    border: 0;
    color: var(--geit-gold) !important;
}
.modal-header.btn-red .modal-title { font-family: var(--font-serif); color: var(--geit-gold); }
.modal-footer { border-top: 1px solid var(--geit-line); }

.dropdown-menu { border-color: var(--geit-line); border-radius: var(--r-md); }
.dropdown-item:active { background: var(--geit-lilac); color: var(--geit-violet-3); }


/* ── 14 頁尾、Cookie 提示 ────────────────────────────────────────────── */
#footer_Menu {
    margin-top: var(--sec-gap) !important;
    background: var(--geit-plum-2);
    color: var(--geit-on-dark-2);
    border-top: 1px solid rgba(224,184,112,.35);
    padding: clamp(28px, 4vw, 48px) 0 28px;
}
#footer_Menu strong {
    font-family: var(--font-serif);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .06em;
    color: var(--geit-gold-lit);
}
#footer_Menu .nav-link {
    padding: 0;
    font-size: 14px;
    line-height: 2.1;
    letter-spacing: var(--ls-body);
    color: var(--geit-on-dark-2) !important;
}
#footer_Menu .nav-link:hover { color: var(--geit-gold) !important; }

/* 2026-11-11 滿版頁尾：品牌欄＋選單欄＋版權列 */
#footer_Menu .geit-ft__brand { display: flex; flex-direction: column; gap: 8px; }
#footer_Menu .geit-ft__logo { display: inline-flex; flex-direction: column; gap: 2px; text-decoration: none; }
#footer_Menu .geit-ft__zh {
    font-family: var(--font-serif);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: .14em;
    color: var(--geit-gold);
}
#footer_Menu .geit-ft__en {
    font-family: var(--font-latin-display);
    font-size: 14px;
    letter-spacing: .2em;
    color: var(--geit-gold-lit);
}
#footer_Menu .geit-ft__co { font-size: 14px; color: var(--geit-on-dark-2); }
#footer_Menu .geit-ft__col strong { display: block; margin-bottom: 4px; }
#footer_Menu .geit-ft__copy {
    margin-top: clamp(24px, 3vw, 40px);
    padding-top: 18px;
    padding-left: var(--container-pad);
    padding-right: var(--container-pad);
    border-top: 1px solid var(--geit-line-d);
}
#footer_Menu .small {
    font-size: 13px;
    letter-spacing: .06em;
    color: #A79DAE;
}
#footer_Menu .small a { color: var(--geit-gold-lit); }

/* Cookie 提示（_Layout 裡是 fixed-bottom bg-dark） */
#footer_Menu .fixed-bottom.bg-dark {
    left: 16px;
    right: 16px;
    bottom: 16px;
    max-width: 960px;
    margin-inline: auto;
    padding: 16px 20px !important;
    background: var(--geit-plum) !important;
    color: var(--geit-on-dark) !important;
    border: 1px solid var(--geit-line-d);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-2) !important;
    opacity: 1 !important;
}
#footer_Menu .fixed-bottom .text-sm { font-size: 14px; color: var(--geit-on-dark-2) !important; }
#footer_Menu .fixed-bottom a.text-info { color: var(--geit-gold-lit) !important; text-decoration-color: rgba(240,220,180,.5); }
#footer_Menu .fixed-bottom .btn { min-height: 40px; padding: 6px 18px; }
#footer_Menu .fixed-bottom .btn-outline-light {
    background: transparent !important;
    border: 1px solid rgba(224,184,112,.5) !important;
    color: var(--geit-gold-lit) !important;
}
#footer_Menu .fixed-bottom .btn-outline-light:hover { border-color: var(--geit-gold) !important; color: var(--geit-gold) !important; }
#footer_Menu .fixed-bottom .btn-primary {
    background: var(--geit-gold) !important;
    border: 1px solid var(--geit-gold) !important;
    color: var(--geit-plum) !important;
    font-weight: 700;
}
#footer_Menu .fixed-bottom .btn-primary:hover { background: var(--geit-gold-lit) !important; border-color: var(--geit-gold-lit) !important; }


/* ── 15 右側浮動按鈕（回到頂端、文章目錄） ───────────────────────────── */
.div_SideBar {
    position: fixed;
    right: 8px;
    top: 50%;
    top: 50svh;
    transform: translateY(-50%);
    z-index: 1030;
    pointer-events: none;
}
.div_SideBar .btn {
    border: 1px solid transparent;
    box-shadow: var(--shadow-1) !important;
    transition: transform .2s ease, background-color .2s ease;
}
.div_SideBar .btn:hover { transform: translateY(-2px); }
.div_SideBar .btn-red { background: var(--geit-violet-deep); color: #FFFFFF !important; }
.div_SideBar .btn-red:hover { background: var(--geit-violet-2); }

#anchorMenu {
    border: 1px solid var(--geit-line) !important;
    border-radius: var(--r-lg) !important;
    background: rgba(255,255,255,.96) !important;
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    backdrop-filter: saturate(180%) blur(14px);
    box-shadow: var(--shadow-2) !important;
    padding: 8px !important;
}
#anchorMenu a {
    padding: 6px 10px;
    border-radius: var(--r-sm);
    color: var(--geit-ink-2) !important;
}
#anchorMenu a:hover { background: var(--geit-lilac-2); color: var(--geit-violet-3) !important; }

.hover-red { word-wrap: break-word; overflow-wrap: break-word; hyphens: auto; }

@media (max-width: 991.98px) {
    div.div_SideBar button { opacity: .75; }
}
@media (max-width: 767.98px) {
    #anchorMenu { width: 170px !important; }
    .hover-red { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
}


/* ── 16 其他相容用的舊 class ─────────────────────────────────────────── */
.lab_tcicolor_1 { color: var(--geit-violet-deep); }
.lab_tcicolor_2 { color: var(--tci-color-2); }
.text-info { color: var(--geit-violet-deep) !important; }
.bg_RedLine_1 { border-bottom: 1px solid var(--geit-line); }
.bg_Color_3 { background-color: var(--geit-violet-2); }
.bg_Color_6 { background-color: var(--geit-lilac); }
.modal-dialog_MaxW_800 { max-width: 800px; }

/* 舊版輪播大標字級（未包在 ap-banner__copy 內時） */
@media (min-width: 768px) {
    .Banner_h2 { font-size: 38px; letter-spacing: .1em; line-height: 1.34; }
    .Banner_Det { font-size: 18px; line-height: 1.86; letter-spacing: .12em; font-weight: 500; }
}
@media (max-width: 767.98px) {
    .Banner_h2 { font-size: 20px; line-height: 1.3; }
    .Banner_Det { font-size: 15px; line-height: 1.5; }
}


/* ── 18 產品頁（Views/Search/Product_Info） ─────────────────────────── */
/* 四個分頁在同一份 HTML：外層 .pd 的 data-tab 決定顯示哪一塊（Vue 掛載前先顯示產品介紹） */
.pd[data-tab="intro"] .pd-panel:not([data-panel="intro"]),
.pd[data-tab="plans"] .pd-panel:not([data-panel="plans"]),
.pd[data-tab="faq"] .pd-panel:not([data-panel="faq"]),
.pd[data-tab="apply"] .pd-panel:not([data-panel="apply"]),
.pd[data-tab="apply"] .pd-ctawrap { display: none; }
.pd-tabs { position: relative; z-index: 2; }

/* 頁首主視覺：深紫圓角大區塊 */
.pd-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr));
    gap: clamp(28px, 4vw, 48px);
    align-items: center;
    padding: clamp(32px, 6vw, 72px);
    border-radius: var(--r-xl);
    background: var(--geit-plum);
    color: var(--geit-on-dark);
}
.pd-hero::before,
.pd-hero::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}
.pd-hero::before { right: -120px; top: -120px; width: 420px; height: 420px; border: 1px solid rgba(224,184,112,.28); }
.pd-hero::after  { right: -60px;  top: -60px;  width: 300px; height: 300px; border: 1px solid rgba(148,100,228,.35); }
.pd-hero--solo { grid-template-columns: minmax(0, 1fr); }
.pd-hero__copy { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 20px; }
.pd-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: var(--font-latin-display);
    font-size: 17px;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--geit-gold);
}
.pd-hero__eyebrow::after { content: ""; width: 40px; height: 1px; background: currentColor; }
.pd-hero__title {
    margin: 0;
    font-family: var(--font-serif);
    font-size: clamp(2rem, 4.6vw, 3.4rem);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .04em;
    color: var(--geit-on-dark);
    text-wrap: balance;
}
.pd-hero__lead { max-width: 38em; font-size: clamp(1rem, 1.25vw, 1.15rem); line-height: var(--lh-body); color: var(--geit-on-dark-2); }
.pd-hero__lead > :last-child { margin-bottom: 0; }
.pd-hero__btns { display: flex; flex-wrap: wrap; gap: 12px; }
.pd-hero .custom-btn { min-height: 52px; padding-inline: 28px; font-size: 16px; }
.pd-hero .btn-red { background: var(--geit-gold); border-color: var(--geit-gold); color: var(--geit-plum) !important; font-weight: 700; }
.pd-hero .btn-red:hover { background: var(--geit-gold-lit) !important; border-color: var(--geit-gold-lit); color: var(--geit-plum) !important; }
.pd-hero .btn-outline-red { background: transparent; border-color: rgba(224,184,112,.6); color: var(--geit-gold-lit) !important; }
.pd-hero .btn-outline-red:hover { background: rgba(224,184,112,.14) !important; border-color: var(--geit-gold); color: var(--geit-gold) !important; }
.pd-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 6px 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--geit-line-d);
}
.pd-hero__stats > div { display: flex; flex-direction: column; }
.pd-hero__stats dt { font-family: var(--font-latin-display); font-size: 38px; font-weight: 600; line-height: 1.1; color: var(--geit-gold); }
.pd-hero__stats dd { margin: 0; font-size: 14px; line-height: 1.6; color: var(--geit-on-dark-2); }
.pd-hero__media { position: relative; z-index: 1; }
.pd-hero__media img { display: block; width: 100%; height: auto; border-radius: var(--r-lg); }

/* 區塊標題列：左標題、右按鈕 */
.pd-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px 24px;
    margin-bottom: clamp(16px, 2.2vw, 28px);
}

/* Excel 式對照表（功能、價格共用） */
.pd-table {
    overflow-x: auto;
    overflow-y: hidden;   /* 2026-11-12 只要橫向捲動；overflow-x 設 auto 時直向也會變 auto，表格多出 1px 就冒出直向捲軸、擠窄表格 */
    background: var(--geit-surface);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
}
.pd-table table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 15px; }
.pd-table th,
.pd-table td { padding: 12px 16px; border-top: 1px solid var(--geit-line-2); text-align: center; vertical-align: middle; line-height: 1.6; }
.pd-table th[scope="row"] { padding-left: 24px; text-align: left; font-weight: 400; color: var(--geit-ink); }
.pd-table thead th {
    border-top: 0;
    padding-top: 18px;
    padding-bottom: 18px;
    background: var(--geit-plum);
    color: var(--geit-gold-lit);
    font-weight: 500;
    white-space: nowrap;
}
.pd-table thead th:first-child { padding-left: 24px; text-align: left; }
.pd-table td.is-featured { background: rgba(239,231,251,.45); }
.pd-table thead th.is-featured { background: var(--geit-violet-3); }
.pd-group th {
    padding: 10px 24px !important;
    background: #F4F1EA;
    border-top: 1px solid var(--geit-line) !important;
    font-family: var(--font-serif);
    font-size: 16px;
    font-weight: 600 !important;
    color: var(--geit-violet-2) !important;
    text-align: left !important;
}
.pd-yes { color: var(--geit-violet-deep); vertical-align: middle; }
.pd-no { color: #B9B0C0; }
.pd-txt { font-size: 14px; color: var(--geit-ink-2); }

/* 手機：功能對照改成卡片（比照後台列表：一筆一張卡，欄位以「方案：值」列出） */
.pd-cards { display: none; }
@media (max-width: 767.98px) {
    .pd-feat { display: none; }
    .pd-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
}
.pd-card {
    padding: 18px 18px 6px;
    background: var(--geit-surface);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
}
.pd-card__h { margin-bottom: 6px; font-family: var(--font-serif); font-size: 18px; font-weight: 600; color: var(--geit-violet-2); }
.pd-card__row { display: flex; flex-direction: column; gap: 8px; padding: 12px 0; border-top: 1px solid var(--geit-line-2); }
.pd-card__t { font-size: 15px; font-weight: 500; color: var(--geit-ink); }
.pd-card__vals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 12px; }
.pd-card__v { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; font-size: 14px; color: var(--geit-ink-2); }

/* 價格表 */
.pd-plan { display: block; font-family: var(--font-serif); font-size: 20px; font-weight: 600; color: var(--geit-gold); white-space: normal; }
.pd-plan__sub { display: block; margin-top: 4px; font-size: 13px; font-weight: 400; color: var(--geit-on-dark-2); white-space: normal; }
.pd-badge {
    display: inline-block;
    margin-top: 6px;
    padding: 0 10px;
    border-radius: var(--r-pill);
    background: var(--geit-gold);
    color: var(--geit-plum);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.7;
}
.pd-money { font-family: var(--font-latin-display); font-size: 26px; font-weight: 600; color: var(--geit-ink); }
.pd-per { margin-left: 2px; font-size: 13px; color: var(--geit-ink-3); }
.pd-was { display: block; font-size: 13px; color: var(--geit-ink-3); }
.pd-row--price td { padding-top: 18px; padding-bottom: 18px; }
.pd-row--cta td { padding-top: 18px; padding-bottom: 20px; }
.pd-row--cta .custom-btn { min-height: 42px; padding: 8px 18px; font-size: 14px; white-space: nowrap; }
.pd-price[data-cycle="1"] .pd-c:not([data-c="1"]),
.pd-price[data-cycle="2"] .pd-c:not([data-c="2"]),
.pd-price[data-cycle="3"] .pd-c:not([data-c="3"]),
.pd-price[data-cycle="4"] .pd-c:not([data-c="4"]),
.pd-price[data-cycle="5"] .pd-c:not([data-c="5"]) { display: none; }
/* 2026-11-11 Vue 掛上前還沒有 data-cycle：每格只顯示第一個週期（＝預設週期） */
.pd-price:not([data-cycle]) .pd-c + .pd-c { display: none; }

/* 計費週期切換：膠囊按鈕組 */
.pd-cycle {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 4px;
    background: var(--geit-surface);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-pill);
}
.pd-cycle__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    padding: 6px 16px;
    border: 0;
    border-radius: var(--r-pill);
    background: transparent;
    color: var(--geit-ink-2);
    font: inherit;
    font-size: 15px;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease;
}
.pd-cycle__btn:hover { background: var(--geit-lilac-2); color: var(--geit-violet-3); }
.pd-cycle__btn.is-on { background: var(--geit-violet-deep); color: #FFFFFF; }
.pd-cycle__btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(91,58,158,.3); }
.pd-cycle__save { font-size: 12px; color: var(--geit-gold-deep); }
.pd-cycle__btn.is-on .pd-cycle__save { color: var(--geit-gold-lit); }

/* AI 小助手卡、申請提示、結尾 CTA */
.pd-ai {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 16px 24px;
    margin-top: clamp(16px, 2vw, 24px);
    padding: 28px 32px;
    border-radius: var(--r-lg);
    background: var(--geit-plum);
    color: var(--geit-on-dark);
}
.pd-ai__t { margin: 0 0 6px; font-family: var(--font-serif); font-size: 22px; font-weight: 600; color: var(--geit-gold); }
.pd-ai__d { margin: 0; max-width: 40em; color: var(--geit-on-dark-2); }
.pd-ai .btn-red { background: var(--geit-gold); border-color: var(--geit-gold); color: var(--geit-plum) !important; font-weight: 700; }
.pd-ai .btn-red:hover { background: var(--geit-gold-lit) !important; border-color: var(--geit-gold-lit); }
.pd-apply {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 16px 24px;
    padding: 24px 28px;
    border: 1px dashed var(--geit-gold-deep);
    border-radius: var(--r-lg);
    background: #FBF6EC;
}
.pd-apply .ap-body { max-width: 46em; color: var(--geit-ink); }
.pd-cta {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: clamp(40px, 6vw, 72px) clamp(24px, 4vw, 48px);
    border-radius: var(--r-xl);
    background: var(--geit-plum);
    color: var(--geit-on-dark);
    text-align: center;
}
.pd-cta::before {
    content: "";
    position: absolute;
    left: -100px;
    bottom: -160px;
    width: 380px;
    height: 380px;
    border: 1px solid rgba(224,184,112,.25);
    border-radius: 50%;
    pointer-events: none;
}
.pd-cta .pd-hero__eyebrow::after { display: none; }
.pd-cta__t { position: relative; margin: 0; font-family: var(--font-serif); font-size: clamp(1.8rem, 3.4vw, 2.6rem); font-weight: 600; color: var(--geit-on-dark); }
.pd-cta__d { position: relative; max-width: 36em; margin: 0; color: var(--geit-on-dark-2); }
.pd-cta .btn-red { position: relative; min-height: 52px; padding-inline: 30px; background: var(--geit-gold); border-color: var(--geit-gold); color: var(--geit-plum) !important; font-weight: 700; }
.pd-cta .btn-red:hover { background: var(--geit-gold-lit) !important; border-color: var(--geit-gold-lit); }

/* 產品文章裡的語系標籤（ed-block 內用 <ul class="pd-langs">） */
.ap-editor .pd-langs { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.ap-editor .pd-langs li { padding: 6px 14px; border-radius: var(--r-pill); background: var(--geit-lilac); color: var(--geit-violet-3); font-size: 14px; }

@media (max-width: 575.98px) {
    .pd-hero__stats dt { font-size: 30px; }
    .pd-ai, .pd-apply { padding: 22px; }
}


/* ── 響應式總整理 ─────────────────────────────────────────────────────── */
@media (max-width: 991.98px) {
    .ap-srch__grp { flex-direction: column; gap: 8px; }
    .ap-srch__grp > .ap-srch__lab { padding-top: 0; }
    .ap-srch__box { max-width: 480px; }
}
@media (max-width: 767.98px) {
    :root { --r-xl: 24px; }
    .ap-tile--over { min-height: 260px; }
}
@media (max-width: 575.98px) {
    .ap-display { font-size: 1.75rem; }
    .ap-title { font-size: 18px; }
    .ap-link { white-space: normal; }
    .ap-tile__pad { padding: 22px 18px; }
    .ap-chiptag { font-size: 13px; padding: 5px 14px; }
}

/* ── 19 會員與下單（Views/Member、Views/Order，2026-11-12） ─────────── */
.geit-acc { padding-bottom: var(--sec-gap); }
.geit-acc__title { font-size: clamp(26px, 3vw, 36px); margin-bottom: 8px; }
.geit-acc__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.geit-acc__foot { margin: 20px 0 0; text-align: center; color: var(--geit-ink-3); }

.geit-card {
    background: var(--geit-surface);
    border: 1px solid var(--geit-line);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-1);
    padding: clamp(20px, 3vw, 36px);
}
.geit-card--narrow { max-width: 480px; margin: 0 auto; }
.geit-card--mid { max-width: 760px; margin: 0 auto; }
.geit-card__h { font-size: 20px; font-weight: 700; margin: 0 0 16px; color: var(--geit-violet-3); }

.geit-form .form-control,
.geit-form .form-select { border-radius: var(--r-md); border-color: var(--geit-line); padding: 10px 14px; }
.geit-form .form-control:focus { border-color: var(--geit-violet); box-shadow: 0 0 0 3px rgba(148,100,228,.18); }
.geit-form .form-control[readonly] { background: var(--geit-lilac-2); }
.geit-form .form-label { font-weight: 600; color: var(--geit-ink-2); margin-bottom: 6px; }
.geit-form__h { font-size: 16px; font-weight: 700; color: var(--geit-violet-deep); margin: 28px 0 12px; padding-top: 16px; border-top: 1px dashed var(--geit-line); }
.geit-form > .geit-form__h:first-of-type { border-top: 0; padding-top: 0; margin-top: 8px; }
.geit-form .form-check-input:checked { background-color: var(--geit-violet-deep); border-color: var(--geit-violet-deep); }
.geit-req { color: #B4231F; }

.geit-link { color: var(--geit-violet-deep); text-decoration: none; font-weight: 600; }
.geit-link:hover { text-decoration: underline; }
.geit-link-btn { background: none; border: 0; padding: 0; color: var(--geit-violet-deep); font-weight: 700; text-decoration: underline; }

.geit-note { background: var(--geit-lilac-2); border: 1px solid var(--geit-lilac-line); border-radius: var(--r-md); padding: 12px 16px; margin: 0 0 16px; font-size: 15px; }
.geit-note--warn { background: #FFF7E8; border-color: #F0DCB4; color: var(--geit-gold-ink); }

.geit-or { display: flex; align-items: center; gap: 12px; margin: 18px 0; color: var(--geit-ink-3); font-size: 14px; }
.geit-or::before, .geit-or::after { content: ""; flex: 1; height: 1px; background: var(--geit-line); }

.geit-btn-google {
    display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%;
    padding: 11px 18px; border: 1px solid var(--geit-line); border-radius: var(--r-pill);
    background: #fff; color: var(--geit-ink); font-weight: 600; text-decoration: none; transition: background .15s;
}
.geit-btn-google:hover { background: var(--geit-lilac-2); color: var(--geit-ink); }
.geit-btn-google--inline { display: inline-flex; width: auto; }

.geit-terms {
    max-height: 260px; overflow: auto; margin: 0 0 14px; padding: 14px 18px;
    background: var(--geit-ground); border: 1px solid var(--geit-line); border-radius: var(--r-md);
    font-size: 14px; line-height: 1.75;
}
.geit-terms h3, .geit-terms h4 { font-size: 15px; font-weight: 700; margin: 12px 0 6px; }
.geit-terms ol, .geit-terms ul { padding-left: 1.4em; margin-bottom: 8px; }
.geit-terms-more { margin: -4px 0 14px; }
.geit-terms-more summary { cursor: pointer; color: var(--geit-violet-deep); font-weight: 600; margin-bottom: 8px; }

.geit-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.geit-choice { padding: 8px 0; }

/* 步驟 */
.geit-steps { display: flex; gap: 8px; list-style: none; padding: 0; margin: 0 auto 24px; max-width: 640px; }
.geit-steps__item { flex: 1; display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: var(--r-pill); background: var(--geit-line-2); color: var(--geit-ink-3); font-size: 14px; font-weight: 600; }
.geit-steps__n { flex: none; width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #fff; color: var(--geit-ink-3); }
.geit-steps__item.is-on { background: var(--geit-violet-deep); color: #fff; }
.geit-steps__item.is-on .geit-steps__n { color: var(--geit-violet-deep); }
.geit-steps__item.is-done { background: var(--geit-lilac); color: var(--geit-violet-deep); }
.geit-steps__item.is-done .geit-steps__n { background: var(--geit-violet-deep); color: var(--geit-gold-lit); }

/* 下單版面：左表單、右摘要 */
.geit-order { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; align-items: start; }
.geit-order__side { position: sticky; top: calc(var(--header-height) + 16px); }
@media (max-width: 991.98px) {
    .geit-order { grid-template-columns: 1fr; }
    .geit-order__side { position: static; order: -1; }
}
.geit-summary__plan { font-size: 17px; margin-bottom: 4px; }
.geit-summary__dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin: 12px 0; font-size: 14px; }
.geit-summary__dl dt { font-weight: 500; color: var(--geit-ink-3); }
.geit-summary__dl dd { margin: 0; text-align: right; }
.geit-summary__total { display: flex; justify-content: space-between; align-items: baseline; font-size: 15px; margin: 8px 0; padding-top: 10px; border-top: 1px solid var(--geit-line); }
.geit-summary__total strong { font-size: 24px; color: var(--geit-violet-deep); }

/* 繳費週期 */
.geit-cycles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-bottom: 8px; }
.geit-cycle { position: relative; cursor: pointer; margin: 0; }
.geit-cycle input { position: absolute; opacity: 0; pointer-events: none; }
.geit-cycle__box { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border: 1.5px solid var(--geit-line); border-radius: var(--r-md); background: #fff; transition: border-color .15s, box-shadow .15s; }
.geit-cycle__t { font-weight: 700; }
.geit-cycle__p { font-size: 18px; color: var(--geit-violet-deep); font-weight: 700; }
.geit-cycle__s { font-size: 12px; color: var(--geit-ink-3); }
.geit-cycle input:checked + .geit-cycle__box { border-color: var(--geit-violet-deep); box-shadow: 0 0 0 3px rgba(91,58,158,.15); background: var(--geit-lilac-2); }
.geit-cycle input:focus-visible + .geit-cycle__box { outline: 2px solid var(--geit-violet); outline-offset: 2px; }

/* 訂單明細表 */
.geit-kv { width: 100%; border-collapse: separate; border-spacing: 0; margin: 16px 0; font-size: 15px; border: 1px solid var(--geit-line); border-radius: var(--r-md); overflow: hidden; }
.geit-kv th, .geit-kv td { padding: 10px 14px; border-bottom: 1px solid var(--geit-line-2); vertical-align: top; }
.geit-kv tbody tr:last-child th, .geit-kv tbody tr:last-child td { border-bottom: 0; }
.geit-kv tbody th { width: 34%; background: var(--geit-lilac-2); font-weight: 600; color: var(--geit-ink-2); }
.geit-kv--list thead th { background: var(--geit-lilac-2); font-weight: 600; font-size: 14px; }
.geit-kv--list tbody th { width: auto; }

.geit-badge { display: inline-block; padding: 3px 12px; border-radius: var(--r-pill); font-size: 13px; font-weight: 700; background: var(--geit-line-2); color: var(--geit-ink-2); white-space: nowrap; }
.geit-badge--1 { background: #FFF7E8; color: var(--geit-gold-ink); }
.geit-badge--2 { background: var(--geit-lilac); color: var(--geit-violet-deep); }
.geit-badge--7 { background: #FDECEC; color: #B4231F; }

/* 完成頁 */
.geit-result { width: 64px; height: 64px; margin: 0 auto 12px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 34px; }
.geit-result--ok { background: var(--geit-lilac); color: var(--geit-violet-deep); }
.geit-result--fail { background: #FFF7E8; color: var(--geit-gold-deep); }
.geit-open { text-align: center; background: linear-gradient(135deg, var(--geit-violet-3), var(--geit-violet-deep)); color: var(--geit-on-dark); border-radius: var(--r-lg); padding: 20px; margin: 16px 0; }
.geit-open__t { margin: 0; color: var(--geit-gold-lit); font-weight: 600; letter-spacing: .08em; }
.geit-open__d { font-size: 28px; font-weight: 700; margin: 4px 0 8px; color: var(--geit-gold); }
.geit-open__d small { font-size: 14px; font-weight: 500; color: var(--geit-on-dark-2); }

/* 上選單會員入口：窄螢幕只留圖示 */
.geit-member-link { white-space: nowrap; }
@media (max-width: 1399.98px) { .geit-member-link span { display: none; } }



/* ── 17 減少動態 ─────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .ap-tile,
    .ap-tile__bleed img,
    .ap-tile__img,
    .custom-btn,
    .ap-link::after,
    .search-input-magic,
    .banner-pd-indicators [data-bs-target],
    .div_SideBar .btn { transition: none !important; }
    a.ap-tile:hover,
    .ap-tile:hover .ap-tile__bleed img,
    .custom-btn:hover { transform: none !important; }
}
