/* ============================================================
   共用樣式（index.html 與 news.html 共用）
   ============================================================ */

/* 跑馬燈無限流動動畫 */
@keyframes ticker {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-100%, 0, 0); }
}
.animate-ticker {
    display: inline-block;
    padding-left: 100%;
    white-space: nowrap;
    animation: ticker 40s linear infinite;
}
.animate-ticker:hover {
    animation-play-state: paused; /* 滑鼠移上去暫停，方便閱讀 */
}
/* 錨點跳轉時為固定導覽列＋跑馬燈預留空間 */
section[id] { scroll-margin-top: 130px; }
body {
    font-family: 'Noto Sans TC', 'Poppins', sans-serif;
}
/* 科技感動態背景微光 */
.glow-sphere {
    filter: blur(120px);
    opacity: 0.15;
    pointer-events: none;
}

/* 企業 Logo 依主題切換：深色背景用白字版、淺色背景用黑字版 */
.logo-on-dark { display: inline-block; }
.logo-on-light { display: none; }
html.light .logo-on-dark { display: none; }
html.light .logo-on-light { display: inline-block; }

/* Hero 軌道旋轉：中央 Logo 靜止，僅外圈環繞中心旋轉 */
@keyframes orbit-spin { to { transform: rotate(360deg); } }
@keyframes orbit-spin-reverse { to { transform: rotate(-360deg); } }
.orbit { transform-box: view-box; transform-origin: 200px 200px; }
.orbit-cw-slow { animation: orbit-spin 26s linear infinite; }
.orbit-ccw     { animation: orbit-spin-reverse 20s linear infinite; }
.orbit-cw-fast { animation: orbit-spin 14s linear infinite; }
@media (prefers-reduced-motion: reduce) {
    .orbit { animation: none; }
}

/* 主題切換時的平滑過渡 */
body, header, footer, section, nav, form, table, thead, tbody, tr, td, th,
input, textarea, select, ul, li, h1, h2, h3, h4, h5, p, label,
[class*="bg-brand"], [class*="bg-slate"], [class*="bg-white"],
[class*="border-white"], [class*="text-slate"], [class*="text-white"] {
    transition: background-color .35s ease, border-color .35s ease, color .35s ease;
}

/* ============================================================
   淺色模式 (Light Mode) — 以 html.light 提高特異性覆寫 Tailwind
   ============================================================ */
html.light { color-scheme: light; }

/* --- 背景 --- */
html.light body { background-color: #eef2f9; }
html.light .bg-brand-dark { background-color: #eef2f9; }
html.light .bg-brand-dark\/80 { background-color: rgba(238, 242, 249, 0.85); }
html.light .bg-brand-navy { background-color: #ffffff; }
html.light .bg-brand-navy\/40 { background-color: rgba(226, 232, 243, 0.6); }
html.light .bg-brand-navy\/30 { background-color: rgba(226, 232, 243, 0.5); }
html.light .bg-brand-slate\/40,
html.light .bg-brand-slate\/50,
html.light .bg-brand-slate\/60,
html.light .bg-brand-slate\/80 { background-color: #ffffff; }
html.light .bg-slate-950\/60 { background-color: #e9eef7; }
html.light .bg-slate-900,
html.light .bg-slate-900\/40,
html.light .bg-slate-950 { background-color: #f1f5f9; }
html.light .bg-slate-950\/80 { background-color: #f8fafc; }
html.light .bg-white\/5 { background-color: rgba(15, 23, 42, 0.04); }
html.light .bg-white\/10 { background-color: rgba(15, 23, 42, 0.06); }

/* 卡片在淺色下加上柔和陰影增加層次 */
html.light .bg-brand-slate\/40,
html.light .bg-brand-slate\/50,
html.light .bg-brand-slate\/60,
html.light .bg-brand-slate\/80 {
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 12px 28px -16px rgba(15, 23, 42, 0.18);
}

/* --- 文字 --- */
html.light .text-white { color: #0f172a; }
html.light .text-slate-100 { color: #1e293b; }
html.light .text-slate-300 { color: #334155; }
html.light .text-slate-400 { color: #475569; }
html.light .text-slate-500 { color: #64748b; }
html.light .text-brand-blue { color: #0e7490; }
html.light .text-brand-orange { color: #ea580c; }
html.light .text-emerald-400 { color: #059669; }
html.light .text-amber-400 { color: #b45309; }
html.light .text-cyan-400 { color: #0e7490; }
html.light .text-purple-400 { color: #7c3aed; }
html.light .hover\:text-white:hover { color: #0f172a; }
html.light .hover\:text-brand-blue:hover { color: #0891b2; }

/* 圖片上方說明文字（深色漸層遮罩之上）維持白色 */
html.light .media-caption .text-white { color: #ffffff; }

/* --- 邊框 / 分隔線 --- */
html.light .border-white\/5 { border-color: rgba(15, 23, 42, 0.08); }
html.light .border-white\/10 { border-color: rgba(15, 23, 42, 0.12); }
html.light .border-white\/20 { border-color: rgba(15, 23, 42, 0.18); }
html.light .hover\:border-white\/20:hover { border-color: rgba(15, 23, 42, 0.22); }
html.light .divide-white\/5 > :not([hidden]) ~ :not([hidden]) { border-color: rgba(15, 23, 42, 0.08); }

/* --- 互動 hover 背景 --- */
html.light .hover\:bg-white\/5:hover { background-color: rgba(15, 23, 42, 0.04); }
html.light .hover\:bg-white\/10:hover { background-color: rgba(15, 23, 42, 0.06); }

/* --- 背景微光在淺色下降低強度 --- */
html.light .glow-sphere { opacity: 0.10; }

/* 快訊摘要折疊：預設顯示 3 行，點「閱讀全文」展開全部 */
.news-clamp {
    max-height: 4.9em;   /* 約 3 行（leading-relaxed 1.625 × 3） */
    overflow: hidden;
}