/**
 * GGTime GEO - Light Theme Brand Fusion (融合 ggtime.net 品牌美學，維持乾淨白底)
 * 核心色調：電光青 (#22c8e5)、賽博紫 (#8d35d4)、深曜石 (#090d16)、純白 (#ffffff)
 */

:root {
  --gg-cyan: #22c8e5;
  --gg-cyan-deep: #0891b2;
  --gg-cyan-glow: rgba(34, 200, 229, 0.4);
  --gg-cyan-subtle: rgba(34, 200, 229, 0.08);
  --gg-cyan-border: rgba(34, 200, 229, 0.3);
  --gg-violet: #8d35d4;
  --gg-violet-glow: rgba(141, 53, 212, 0.25);
  --gg-obsidian: #090d16;
  --gg-dark-card: #0b111c;
  --gg-ink: #0f172a;
  --gg-slate: #475569;
  --gg-border: #e2e8f0;
  --gg-gradient-brand: linear-gradient(135deg, #22c8e5 0%, #8d35d4 100%);
  --gg-gradient-cyan: linear-gradient(135deg, #22c8e5 0%, #0ea5e9 100%);
  --gg-gradient-cyan-hover: linear-gradient(135deg, #1cb8d4 0%, #0284c7 100%);
}

/* ==========================================================================
   1. 全域基底與字體（維持白底高可讀性，提升現代幾何質感）
   ========================================================================== */
html, body {
  background-color: #ffffff !important;
  color: var(--gg-ink) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans TC", "PingFang TC", "Inter", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background-color: rgba(34, 200, 229, 0.25);
  color: #083344;
}

/* 頂部全頁滾動指示條 (GGTime 經典電光青與賽博紫漸層光條) */
div[style*="scaleX"] { display: none !important; height: 0 !important; opacity: 0 !important; }

/* ==========================================================================
   2. 導覽列 (Navbar) - 晶瑩毛玻璃與細緻分界線
   ========================================================================== */
nav.fixed {
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: 1px solid rgba(34, 200, 229, 0.16) !important;
  box-shadow: 0 4px 24px -2px rgba(15, 23, 42, 0.04) !important;
}

nav.fixed button:hover {
  color: var(--gg-cyan-deep) !important;
}

/* ==========================================================================
   3. 首屏 Hero 區塊 - 純淨白底 + ggtime 頂級大氣空氣感微光暈
   ========================================================================== */
#hero-section {
  position: relative !important;
  background: radial-gradient(ellipse 90% 55% at 50% -15%, rgba(34, 200, 229, 0.13) 0%, transparent 65%),
              radial-gradient(ellipse 60% 40% at 85% 15%, rgba(141, 53, 212, 0.07) 0%, transparent 55%),
              radial-gradient(ellipse 50% 35% at 15% 25%, rgba(34, 200, 229, 0.06) 0%, transparent 50%),
              #ffffff !important;
  border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
}

/* Hero 頂部微裝飾光條 */
#hero-section > div:first-child { height: auto !important; background: transparent !important; }

/* Hero 標題與副標題層次 */
#hero-section h1 {
  color: var(--gg-obsidian) !important;
  letter-spacing: -0.035em !important;
  line-height: 1.16 !important;
  font-weight: 900 !important;
}

#hero-section p {
  color: var(--gg-slate) !important;
  font-weight: 400 !important;
}

/* Hero Badge 膠囊標籤 */
#hero-section .inline-flex.rounded-full {
  background: var(--gg-cyan-subtle) !important;
  border: 1px solid var(--gg-cyan-border) !important;
  color: var(--gg-cyan-deep) !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 12px rgba(34, 200, 229, 0.12) !important;
}

#hero-section .inline-flex.rounded-full svg {
  color: var(--gg-cyan) !important;
}

/* ==========================================================================
   4. 按鈕系統 (Zen Button 規範)
   ========================================================================== */
/* 主要 CTA 按鈕 (電光青漸層底 + 深曜黑字 + 浮起微光) */
button.bg-blue-600, 
a.bg-blue-600,
button[class*="bg-blue-600"],
a[class*="bg-blue-600"] {
  background: var(--gg-gradient-cyan) !important;
  color: #001a24 !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  border: 1px solid rgba(34, 200, 229, 0.6) !important;
  box-shadow: 0 6px 20px -3px var(--gg-cyan-glow) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

button.bg-blue-600:hover, 
a.bg-blue-600:hover,
button[class*="bg-blue-600"]:hover,
a[class*="bg-blue-600"]:hover {
  background: var(--gg-gradient-cyan-hover) !important;
  color: #000c12 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 28px -2px rgba(34, 200, 229, 0.65) !important;
}

/* 次要 Outline 按鈕 (白底晶瑩框 + 青藍字) */
button.border-slate-200:not([disabled]),
button.border-slate-300:not([disabled]) {
  background: rgba(255, 255, 255, 0.95) !important;
  border-color: rgba(34, 200, 229, 0.4) !important;
  color: var(--gg-cyan-deep) !important;
  font-weight: 700 !important;
  transition: all 0.22s ease !important;
}

button.border-slate-200:hover,
button.border-slate-300:hover {
  background: var(--gg-cyan-subtle) !important;
  border-color: var(--gg-cyan) !important;
  color: #0369a1 !important;
  transform: translateY(-1px) !important;
}

/* ==========================================================================
   5. 章節行銷標語 (完全依循 Hero Badge 膠囊風格：Sans-serif、700字重、微光圓弧)
   ========================================================================== */
span.font-mono.tracking-widest {
}

span.font-mono.tracking-widest::before {
  content: "⚡ ";
  font-size: 12px;
  color: var(--gg-cyan);
}

/* ==========================================================================
   6. 卡片與容器美化 (Cards & Panels)
   ========================================================================== */
.bg-white.border.border-slate-200,
.bg-slate-50.border.border-slate-100,
div.rounded-2xl.border,
div.rounded-3xl.border {
  border-color: rgba(226, 232, 240, 0.95) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.bg-white.border.border-slate-200:hover,
div.rounded-2xl.border:hover,
div.rounded-3xl.border:hover {
  border-color: rgba(34, 200, 229, 0.45) !important;
  box-shadow: 0 14px 34px -8px rgba(34, 200, 229, 0.12), 0 4px 12px -2px rgba(141, 53, 212, 0.06) !important;
}

/* ==========================================================================
   7. 比較表格 (SEO vs GEO) - 增強科技旗艦感
   ========================================================================== */
#paradigm-shift-section table thead tr th.bg-blue-900 {
  background: linear-gradient(135deg, #091a29 0%, #04101c 100%) !important;
  color: var(--gg-cyan) !important;
  border-bottom: 2px solid var(--gg-cyan) !important;
}

#paradigm-shift-section table thead tr th.bg-blue-900 span svg {
  color: var(--gg-cyan) !important;
}

/* ==========================================================================
   8. AI SEO 健檢沙盒 (Auditor Sandbox) - 白底框架融入高科技黑曜石 HUD 控制台
   ========================================================================== */
#seo-auditor-tool {
  border: 1px solid rgba(34, 200, 229, 0.35) !important;
  box-shadow: 0 20px 50px -12px rgba(34, 200, 229, 0.16), 0 0 1px 1px rgba(34, 200, 229, 0.2) !important;
}

/* 沙盒中代碼輸出區、JSON-LD 預覽與技術指標轉換為極具 ggtime 質感的深曜石終端機風格 */
#seo-auditor-tool pre,
#seo-auditor-tool code,
#seo-auditor-tool .bg-slate-900,
#seo-auditor-tool .bg-slate-950 {
  background: #060a12 !important;
  color: #38bdf8 !important;
  border: 1px solid rgba(34, 200, 229, 0.25) !important;
  border-radius: 12px !important;
}

/* 健檢沙盒輸入框 */
#seo-auditor-tool input,
#seo-auditor-tool select,
#seo-auditor-tool textarea {
  border: 1.5px solid #cbd5e1 !important;
  transition: all 0.2s ease !important;
}

#seo-auditor-tool input:focus,
#seo-auditor-tool select:focus,
#seo-auditor-tool textarea:focus {
  border-color: var(--gg-cyan) !important;
  box-shadow: 0 0 0 3.5px rgba(34, 200, 229, 0.22) !important;
  outline: none !important;
}

/* ==========================================================================
   9. 路線圖 (Roadmap) - 活躍步驟亮眼青藍指示
   ========================================================================== */
#roadmap-section .bg-blue-600 {
  background: var(--gg-gradient-cyan) !important;
}

#roadmap-section button.border-blue-600 {
  border-color: var(--gg-cyan) !important;
  box-shadow: 0 4px 18px rgba(34, 200, 229, 0.25) !important;
}

/* ==========================================================================
   10. ROI 計算機 (ROI Calculator)
   ========================================================================== */
input[type="range"] {
  accent-color: var(--gg-cyan) !important;
}

#roi-section .text-blue-600 {
  color: var(--gg-cyan-deep) !important;
}

/* ==========================================================================
   11. 預約諮詢區塊 (Booking Container)
   ========================================================================== */
#booking-container {
  border-radius: 1.75rem !important;
  overflow: hidden !important;
  box-shadow: 0 25px 60px -15px rgba(0, 0, 0, 0.16) !important;
  border: 1px solid rgba(34, 200, 229, 0.28) !important;
}

#booking-container > div:first-child {
  background: #050b14 !important;
  position: relative !important;
}

#booking-container > div:first-child::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 10% 20%, rgba(34, 200, 229, 0.28), transparent 60%),
              radial-gradient(circle at 90% 80%, rgba(141, 53, 212, 0.22), transparent 60%);
  pointer-events: none;
}

/* ==========================================================================
   12. 頁尾 (Footer) 與法律彈窗 (Legal Modal)
   ========================================================================== */
footer {
  background: #060a12 !important;
  border-top: 1px solid rgba(34, 200, 229, 0.15) !important;
}

footer a:hover,
footer button:hover {
  color: var(--gg-cyan) !important;
}

#ggtime-legal-modal .bg-blue-600 {
  background: var(--gg-gradient-cyan) !important;
  color: #00121a !important;
  font-weight: 700 !important;
}

/* 全站文字色彩與邊框映射統一 */
.text-blue-600 {
  color: var(--gg-cyan-deep) !important;
}

.text-blue-500 {
  color: #06b6d4 !important;
}

.bg-blue-50 {
  background-color: rgba(34, 200, 229, 0.08) !important;
}

.border-blue-100 {
  border-color: rgba(34, 200, 229, 0.25) !important;
}

.border-blue-500 {
  border-color: var(--gg-cyan) !important;
}

/* ==========================================================================
   13. 中文排版、呼吸感與斷行美化 (Typography & Line-Wrapping Optimization)
   ========================================================================== */
p, li {
  letter-spacing: 0.015em !important;
  line-height: 1.68 !important;
  text-wrap: pretty !important;
}

h1, h2, h3, h4 {
  letter-spacing: -0.015em !important;
  line-height: 1.25 !important;
  text-wrap: balance !important;
}

/* 效益分析卡片條目單行清晰排版 */
#roi-section .space-y-3\.5 > div {
  line-height: 1.5 !important;
  margin-bottom: 0.65rem !important;
}

#roi-section .space-y-3\.5 span {
  letter-spacing: 0.01em !important;
}

/* 專案費用卡片分隔線（對齊預約卡片深藍低調微光細線，非刺眼白線） */
#roi-section .border-blue-800,
#booking-container .border-blue-800 {
  border-color: rgba(30, 64, 175, 0.6) !important;
}
#roi-section [class*="border-blue-800/50"],
#booking-container [class*="border-blue-800/50"] {
  border-color: rgba(30, 64, 175, 0.4) !important;
}

/* 幾倍投報效益專屬徽章 (精緻高質感膠囊，字型端正) */
#roi-section .rounded-full.font-sans {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans TC", "PingFang TC", "Inter", sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ==========================================================================
   14. 5大落地核心建議 (Recommendations Section) 完美對齊 5 欄均分與文字卡規範
   ========================================================================== */
#recommendations-section button {
  outline: none !important;
}

#recommendations-section button:focus {
  outline: none !important;
}

/* 隱藏手機橫向滑動滾動條 */
.no-scrollbar::-webkit-scrollbar {
  display: none !important;
}
.no-scrollbar {
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
}

/* 5 欄按鈕導覽列：手機平滑橫滑，平板與桌面 100% 均分對齊 5 欄 */
.geo-strategy-tabs {
  display: flex !important;
  overflow-x: auto !important;
  gap: 10px !important;
  width: 100% !important;
}

@media (min-width: 768px) {
  .geo-strategy-tabs {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 12px !important;
    overflow-x: visible !important;
    width: 100% !important;
  }
  .geo-strategy-tabs > button {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* 選中狀態：電光青微光邊框（比照路線圖規範），杜絕黑線 */
#recommendations-section button.border-blue-600 {
  border-color: var(--gg-cyan) !important;
  box-shadow: 0 4px 18px rgba(34, 200, 229, 0.28) !important;
}

/* 未選中狀態：柔和淺灰邊框 */
#recommendations-section button.border-slate-200\/60 {
  border-color: rgba(226, 232, 240, 0.8) !important;
}

/* 膠囊一致性保證：永遠 rounded-full，文字不被壓縮，垂直置中 */
#recommendations-section .rounded-full {
  border-radius: 9999px !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

#recommendations-section h3 {
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: #0f172a !important;
}

/* ==========================================================================
   16. ROI 效益徽章 (與頂部標語「⚡ 讓 AI 主動為你帶客的 5 大落地策略！」100% 一致)
   ========================================================================== */
.roi-badge-hero-style {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans TC", "PingFang TC", "Inter", sans-serif !important;
  background: #f0f9ff !important;
  color: #0284c7 !important;
  border: 1px solid #bae6fd !important;
  padding: 5px 16px !important;
  border-radius: 9999px !important;
  font-size: 13px !important;
  letter-spacing: 0.02em !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

/* 在深色卡片與容器中，膠囊完全比照淺色底樣式（維持實體淺藍底、深藍字） */
.bg-gradient-to-br .roi-badge-hero-style,
#roi-section .bg-gradient-to-br .roi-badge-hero-style,
#booking-container span.font-mono.tracking-widest,
#booking-container .rounded-full {
  background: #f0f9ff !important;
  color: #0284c7 !important;
  border: 1px solid #bae6fd !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12) !important;
}

span.font-mono.tracking-widest {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans TC", "PingFang TC", "Inter", sans-serif !important;
  background: #f0f9ff !important;
  color: #0284c7 !important;
  border: 1px solid #bae6fd !important;
  padding: 5px 16px !important;
  border-radius: 9999px !important;
  font-size: 13px !important;
  letter-spacing: 0.02em !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
  text-transform: none !important;
}

span.font-mono.tracking-widest::before {
  content: "⚡ ";
  font-size: 13px;
  color: #eab308;
}

/* ==========================================================================
   執行內容 2/3 版面與 1/3 資訊區自適應網格強制修正
   ========================================================================== */
@media (min-width: 1024px) {
  .lg\:col-span-4,
  div.lg\:col-span-4 {
    grid-column: span 4 / span 4 !important;
    width: 100% !important;
  }
  .lg\:col-span-8,
  div.lg\:col-span-8 {
    grid-column: span 8 / span 8 !important;
    width: 100% !important;
  }
}


/* ==========================================================================
   執行內容卡片網格與置中間距
   ========================================================================== */
.geo-execution-grid {
}
@media (min-width: 640px) {
  .geo-execution-grid {
  }
}

/* 執行內容膠囊：100% 像素級對齊參考卡片（100% 掌控權） */
.geo-execution-badge {
}

/* GEO 健檢儀表板 5 欄位指標卡片專用 */
.geo-metrics-5cols {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
}
@media (max-width: 860px) {
  .geo-metrics-5cols {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 580px) {
  .geo-metrics-5cols {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 380px) {
  .geo-metrics-5cols {
    grid-template-columns: 1fr !important;
  }
}

/* 報告卡片寬度左右放寬為 max-w-6xl (72rem) */
#geo-report-card-section,
.ggtime-audit-inpage-card {
  max-width: 72rem !important;
  width: 100% !important;
}

/* ==========================================================================
   14. 沙盒 4 大頁籤導航與動態變色底線
   ========================================================================== */

/* 網站問題與現況盤點、GEO 五大核心落地建議、落地執行路線圖、投資效益分析比較 統一 max-width: 980px */
#pain-points-section,
#pain-points-section .max-w-6xl,
#geo-report-card-section,
.ggtime-audit-inpage-card,
#recommendations-section,
#recommendations-section .max-w-6xl,
#roadmap-section,
#roadmap-section .max-w-6xl,
#roi-section,
#roi-section .max-w-6xl,
#roi-section .max-w-5xl {
}

/* 頁籤底線：預設絕對不要顯示，開啟的才有淡藍色底線 */
.geo-tab-nav-btn {
}
.geo-tab-nav-btn:hover {
}
.geo-tab-nav-btn.active {
}

/* 報告底部按鈕完全置中 */
.ggtime-audit-modal-footer {
}
.ggtime-audit-modal-footer > div {
}

/* 下載卡片作為點擊連結的 hover 樣式 */
.geo-download-card {
}
.geo-download-card:hover {
}

/* ==========================================================================
   15. 旗艦級列印 (Print / 另存為 PDF) 專用優化樣式
   ========================================================================== */
@media print {
  @page {
    size: A4 portrait;
    margin: 8mm 10mm;
  }

  /* 強制保留色彩與背景 */
  *, *:before, *:after {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    animation: none !important;
    transition: none !important;
  }

  body {
    background: #ffffff !important;
    color: #0f172a !important;
    font-size: 11pt !important;
  }

  /* 隱藏不必要的網頁裝飾與按鈕 */
  nav.fixed,
  .rss-btn-icon-print,
  #booking-section,
  #booking-container,
  div[id*="booking"],
  #booking-section button[type="submit"],
  .fixed.bottom-6,
  #booking-container button,
  .ggtime-audit-modal-footer,
  #btn-modal-share-report {
    display: none !important;
  }

  /* 防止所有動畫容器在列印時被鎖定為透明或窄小變形 */
  div[style*="transform"],
  div[style*="opacity"] {
    transform: none !important;
    opacity: 1 !important;
  }

  /* ==========================================================================
     落地建議區塊 (#recommendations-section) 列印防塌縮與完整雙欄平鋪
     ========================================================================== */
  #recommendations-section {
    background: #ffffff !important;
    padding-top: 10px !important;
    padding-bottom: 20px !important;
    page-break-inside: avoid !important;
    width: 100% !important;
  }

  #recommendations-section .max-w-6xl {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
  }

  /* 五大策略按鈕展開為 5 欄 */
  #recommendations-section .geo-strategy-tabs {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 8px !important;
    overflow: visible !important;
    margin-bottom: 16px !important;
  }

  #recommendations-section .geo-strategy-tabs > button {
    padding: 8px !important;
    border: 1px solid #cbd5e1 !important;
    background: #ffffff !important;
  }

  /* 落地建議內容展示大卡片：強制左右雙欄並排，寬度 100% */
  #recommendations-section .bg-white.border.rounded-3xl,
  #recommendations-section [class*="rounded-3xl"] {
    box-shadow: none !important;
    border: 1px solid #cbd5e1 !important;
    padding: 20px !important;
    overflow: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #recommendations-section [class*="lg:grid-cols-12"] {
    display: flex !important;
    flex-direction: row !important;
    gap: 24px !important;
    align-items: flex-start !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #recommendations-section [class*="lg:col-span-4"] {
    width: 32% !important;
    min-width: 180px !important;
    flex-shrink: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
  }

  #recommendations-section [class*="lg:col-span-8"] {
    width: 65% !important;
    flex-grow: 1 !important;
    display: block !important;
    box-sizing: border-box !important;
  }

  /* 落地建議右側兩張細節卡片：強制雙欄橫向排列，絕不塌陷成細條 */
  #recommendations-section [class*="md:grid-cols-2"],
  #recommendations-section [class*="grid-cols-2"] {
    display: flex !important;
    flex-direction: row !important;
    gap: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #recommendations-section [class*="md:grid-cols-2"] > div,
  #recommendations-section [class*="grid-cols-2"] > div {
    flex: 1 1 50% !important;
    width: 48% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 16px !important;
    box-shadow: none !important;
    transform: none !important;
    opacity: 1 !important;
    min-height: auto !important;
  }

  /* ==========================================================================
     12 週落地執行路線圖區塊 (#roadmap-section) 列印防塌縮與完整雙欄平鋪
     ========================================================================== */
  #roadmap-section {
    background: #ffffff !important;
    padding-top: 10px !important;
    padding-bottom: 20px !important;
    page-break-inside: avoid !important;
    width: 100% !important;
  }

  #roadmap-section .max-w-6xl {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
  }

  /* 四大階段按鈕排成 4 欄 */
  #roadmap-section [class*="grid-cols-2"],
  #roadmap-section [class*="md:grid-cols-4"] {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
    overflow: visible !important;
    margin-bottom: 16px !important;
  }

  #roadmap-section [class*="grid-cols-2"] > button,
  #roadmap-section [class*="md:grid-cols-4"] > button {
    padding: 8px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
  }

  /* 路線圖主卡片：強制左右雙欄並排，寬度 100% */
  #roadmap-section .bg-white.border.rounded-3xl,
  #roadmap-section [class*="rounded-3xl"] {
    box-shadow: none !important;
    border: 1px solid #cbd5e1 !important;
    padding: 20px !important;
    overflow: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #roadmap-section [class*="lg:grid-cols-12"] {
    display: flex !important;
    flex-direction: row !important;
    gap: 24px !important;
    align-items: flex-start !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #roadmap-section [class*="lg:col-span-4"] {
    width: 32% !important;
    min-width: 180px !important;
    flex-shrink: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
  }

  #roadmap-section [class*="lg:col-span-8"] {
    width: 65% !important;
    flex-grow: 1 !important;
    display: block !important;
    box-sizing: border-box !important;
  }

  /* 執行內容卡片網格：優化為極致易讀的單欄條列卡片 (Vertical Step Stack) */
  .geo-execution-grid,
  #roadmap-section .geo-execution-grid,
  #roadmap-section [class*="sm:grid-cols-2"] {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .geo-execution-grid > div,
  #roadmap-section .geo-execution-grid > div,
  #roadmap-section [class*="sm:grid-cols-2"] > div {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    background: #f8fafc !important;
    border: none !important;
    border-left: 3.5px solid #0284c7 !important;
    border-radius: 14px !important;
    padding: 14px 18px !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.03) !important;
    transform: none !important;
    opacity: 1 !important;
    min-height: auto !important;
    transition: all 0.2s ease !important;
  }
  .geo-execution-grid > div:hover,
  #roadmap-section .geo-execution-grid > div:hover {
    background: #f1f5f9 !important;
  }

  /* 文字防擠壓 */
  #roadmap-section h3,
  #roadmap-section h4,
  #roadmap-section h5,
  #roadmap-section p,
  #roadmap-section span,
  #recommendations-section h3,
  #recommendations-section h4,
  #recommendations-section h5,
  #recommendations-section p,
  #recommendations-section span {
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* 健檢儀表板卡片列印優化 */
  #geo-report-card-section,
  .ggtime-audit-inpage-card {
    box-shadow: none !important;
    border: 1px solid #cbd5e1 !important;
    width: 100% !important;
    max-width: 100% !important;
    page-break-inside: avoid !important;
  }

  .geo-metrics-5cols {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 8px !important;
  }
}

@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: translateY(0);
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }

  /* 列印優化：為什麼選擇居居多媒體 (#why-ggtime-section) 消除底部空白與緊貼 footer */
  #why-ggtime-section {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    margin-bottom: 0 !important;
    page-break-inside: avoid !important;
    page-break-after: avoid !important;
    break-after: avoid !important;
  }
  #why-ggtime-section .max-w-6xl {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }
  #why-ggtime-section [class*="mb-20"],
  #why-ggtime-section .grid.mb-20 {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  #why-ggtime-section #booking-section {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
  }
  footer, footer.bg-slate-900, footer[class*="bg-slate-900"] {
    margin-top: 0 !important;
    padding-top: 24px !important;
    page-break-before: avoid !important;
    break-before: avoid !important;
  }


  /* 列印專用 Footer 極致緊湊優化 (防止頁面底端被切) */
  footer, footer.bg-[#06223d], footer[class*="bg-"] {
    background: #06223d !important;
    color: #94a3b8 !important;
    padding-top: 14px !important;
    padding-bottom: 12px !important;
    margin-top: 0 !important;
    font-size: 8.5pt !important;
    page-break-inside: avoid !important;
    page-break-after: avoid !important;
    break-after: avoid !important;
  }
  footer .max-w-6xl {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  footer [class*="grid-cols-3"],
  footer [class*="md:grid-cols-3"] {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    gap: 16px !important;
    padding-bottom: 6px !important;
    margin-bottom: 6px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
  }
  footer [class*="grid-cols-3"] > div,
  footer [class*="md:grid-cols-3"] > div {
    flex: 1 1 32% !important;
    min-width: 0 !important;
  }
  footer p {
    margin-bottom: 2px !important;
    line-height: 1.25 !important;
    font-size: 8pt !important;
  }
  footer h4 {
    margin-bottom: 4px !important;
    font-size: 9pt !important;
    color: #ffffff !important;
  }
  footer [class*="text-slate-500"],
  footer [class*="border-t"] {
    padding-top: 6px !important;
    font-size: 7.5pt !important;
    line-height: 1.2 !important;
  }


  /* ==========================================================================
     五大核心 & 落地路線圖：列印專用底圖完整展示 (解決列印無滾動 progress 導致底圖隱藏)
     ========================================================================== */
  .geo-core-bg,
  .geo-roadmap-bg {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 650px !important;
    transform: translate(-50%, -50%) !important;
    opacity: 0.9 !important;
    display: block !important;
    visibility: visible !important;
    z-index: 0 !important;
  }

  /* 強制展開公路深色柏油與白色虛線、同心圓環 (清除 strokeDashoffset 偏移) */
  .geo-roadmap-bg path,
  .geo-core-bg path,
  .geo-core-bg circle,
  .geo-core-bg line {
    stroke-dashoffset: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* 強制四大站點倒雨滴水滴 Pin 100% 飽滿印出，文字清晰可見 */
  .geo-roadmap-bg g {
    opacity: 1 !important;
    visibility: visible !important;
  }
  .geo-roadmap-bg text {
    fill: #0f172a !important;
    font-weight: 900 !important;
    opacity: 1 !important;
  }

  /* 強制六大 AI 立體水泡 100% 飽滿印出，品牌字樣清晰 */
  .geo-core-bg g {
    opacity: 1 !important;
    visibility: visible !important;
  }
  .geo-core-bg text {
    opacity: 1 !important;
    font-weight: 800 !important;
  }

}
.animate-bounce {
  animation: bounce 1s infinite !important;
}


/* ==========================================================================
   四大核心區塊寬度限制 (max-width: 980px)
   1. 網站問題與現況盤點 (#pain-points-section)
   2. GEO 五大核心落地建議 (#recommendations-section)
   3. 落地執行路線圖 (#roadmap-section)
   4. 投資效益分析比較 (#roi-section)
   ========================================================================== */
/* 限制特定報告卡片寬度，但絕對不限制 .max-w-6xl 與底圖 */
#geo-report-card-section,
.ggtime-audit-inpage-card {
  max-width: 980px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 五大核心 & 落地執行路線圖：中間內容卡片容器嚴格限制為 980px，精巧置中 */
#recommendations-section .max-w-6xl,
#roadmap-section .max-w-6xl {
  max-width: 980px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#paradigm-shift-section .max-w-6xl,
#roi-section .max-w-6xl {
  max-width: 72rem !important;
  width: 100% !important;
}

/* 五大核心 & 落地路線圖 - 真正全螢幕 100vw 滿版底圖 (完全不被 980px 限制) */
.geo-core-bg,
.geo-roadmap-bg {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 100vw !important;
  min-width: 100vw !important;
  max-width: 100vw !important;
  height: 850px !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 五大核心落地建議：整體背景往上移 100px */
#recommendations-section .geo-core-bg {
  top: calc(50% - 100px) !important;
}

/* 落地路線圖：固定背景座標，切換階段時不跟著內容高度重新置中 */
#roadmap-section .geo-roadmap-bg {
  top: -50px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

/* 路線圖站點標籤：大小字永久顯示，不依賴 hover / focus */
#roadmap-section .geo-roadmap-station-label,
#roadmap-section .geo-roadmap-station:hover .geo-roadmap-station-label,
#roadmap-section .geo-roadmap-station:focus .geo-roadmap-station-label {
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

#roadmap-section .geo-roadmap-station-label text {
  visibility: visible !important;
  opacity: 1 !important;
}

/* 頁籤底下徹底不要有線 */
.geo-tab-nav-btn,
.geo-tab-nav-btn:hover,
.geo-tab-nav-btn.active,
.geo-tab-nav-btn:focus {
  border-bottom: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* ✨ 健檢載入動畫上下垂直完全置中 */
.geo-loading-star {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: translateY(1px) !important;
}


/* GEO 5大指標文字卡片 - 防止排版坍縮，維持大方呼吸格局 */
.geo-metric-card {
}
.geo-metric-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
.geo-metric-card-top {
}
.geo-metric-card-title {
}
.geo-metric-card-title h6 {
}
.geo-metric-card-rating {
}
.geo-metric-card-bar-wrap {
}
.geo-metric-card-bar-bg {
}
.geo-metric-card-bar-fill {
}

#hermes-launcher-btn span { display: none !important; }


/* 立體水泡內層連續微浮動動態 (在局部座標系上下浮動，絕對不破壞外層定位) */
@keyframes geoBubbleInnerFloat1 {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-12px); }
}
@keyframes geoBubbleInnerFloat2 {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-15px); }
}
@keyframes geoBubbleInnerFloat3 {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
}
@keyframes geoBubbleInnerFloat4 {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-14px); }
}
@keyframes geoBubbleInnerFloat5 {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-11px); }
}
@keyframes geoBubbleInnerFloat6 {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-16px); }
}

.geo-bubble-inner-1 { animation: geoBubbleInnerFloat1 5s ease-in-out infinite; }
.geo-bubble-inner-2 { animation: geoBubbleInnerFloat2 6.5s ease-in-out infinite; }
.geo-bubble-inner-3 { animation: geoBubbleInnerFloat3 5.8s ease-in-out infinite; }
.geo-bubble-inner-4 { animation: geoBubbleInnerFloat4 6.2s ease-in-out infinite; }
.geo-bubble-inner-5 { animation: geoBubbleInnerFloat5 5.4s ease-in-out infinite; }
.geo-bubble-inner-6 { animation: geoBubbleInnerFloat6 6.8s ease-in-out infinite; }

/* Footer 常態緊湊排版 */
footer, footer.bg-[#06223d] {
  padding-top: 32px !important;
  padding-bottom: 24px !important;
}
footer [class*="gap-8"] {
  gap: 20px !important;
  margin-bottom: 16px !important;
  padding-bottom: 16px !important;
}



/* GEO 五大核心：滿版淡冰藍漸層 */
#recommendations-section {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  background: linear-gradient(
    180deg,
    #ffffff 0%,
    #ffffff 20%,
    #f8fcff 56%,
    #e9f6fd 100%
  ) !important;
}

/* Hero 下載專區：避免長檔名把桌機/平板版面撐出畫面 */
#hero-section .geo-download-card {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
#hero-section .geo-download-card > div:last-child {
  min-width: 0 !important;
  max-width: 100% !important;
}
#hero-section .geo-download-card h3,
#hero-section .geo-download-card p {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}