/* ============================================================
 * intel.css — 商情資料平台「日光語域」(D2, LAV-DESIGN-EXCELLENCE-PLAN)
 * ------------------------------------------------------------
 * 建立：2026-07-02
 * 概念：深海×日光雙語域的日光端。繼承 design-tokens.css 的字型棧、
 *       間距階、動效曲線；色彩翻轉為暖紙面，古銅金退為節制 accent。
 * 範圍：.intel-page 作用域內的 --i-* 變數與 .intel-* 元件；
 *       不影響深海語域任何頁面。
 * 鐵律：搜尋框即入口／術語旁必有白話／廣告位是版型的一部分。
 * ============================================================ */

.intel-page {
  /* ── 日光色板（與 --gold #C8A96A 同家族）── */
  --i-paper:        #FBF9F4;   /* 頁底 · 暖紙面 */
  --i-paper-raise:  #FFFFFF;   /* 卡片 */
  --i-paper-dim:    #F3F0E7;   /* 次級面 · 表頭 */
  --i-ink:          #1F2C48;   /* 主文 · 深海藍的日光態 */
  --i-ink-dim:      #6E6759;   /* 輔文 */
  --i-ink-faint:    #98917F;   /* 提示 · 佔位 */
  --i-line:         #E5E0D2;   /* 髮絲線 */
  --i-line-strong:  #D8D2C2;
  --i-bronze:       #8A6A2C;   /* 古銅 · 文字級（紙面上可讀）*/
  --i-bronze-fill:  #C8A96A;   /* 古銅 · 按鈕填色（= 全站 --gold）*/
  --i-bronze-ink:   #3A2C10;   /* 古銅填色上的文字 */
  --i-bronze-wash:  #F7F0DE;   /* 白話解讀塊底 */
  --i-bronze-line:  #E2D3A8;
  --i-ok:           #27500A;   /* 營業中 · 綠 ink */
  --i-ok-wash:      #EAF3DE;
  --i-warn:         #633806;   /* 注意 · 琥珀 ink */
  --i-warn-wash:    #FAEEDA;

  background: var(--i-paper);
  color: var(--i-ink);
  font-family: var(--font-body);
  margin: 0;
  scroll-padding-top: 72px;
}

/* ── 頁首（日光殼）── */
.intel-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: color-mix(in srgb, var(--i-paper) 94%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--i-line);
}
.intel-nav {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  max-width: 1080px;
  margin: 0 auto;
  padding: var(--space-3) var(--space-5);
}
.intel-wordmark {
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
  text-decoration: none;
  white-space: nowrap;
}
.intel-wordmark .brand {
  font-family: var(--font-brand);
  font-size: var(--fs-title-sm);
  letter-spacing: 0.14em;
  color: var(--i-bronze);
}
.intel-wordmark .unit {
  font-size: var(--fs-note);
  font-weight: 500;
  color: var(--i-ink);
  border-left: 1px solid var(--i-line-strong);
  padding-left: var(--space-3);
}
.intel-search {
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  max-width: 420px;
  background: var(--i-paper-raise);
  border: 1px solid var(--i-line-strong);
  border-radius: 999px;
  padding: 7px var(--space-4);
  transition: border-color var(--dur-fast) var(--ease-out);
}
.intel-search:focus-within { border-color: var(--i-bronze-fill); }
.intel-search input {
  flex: 1;
  border: 0;
  background: transparent;
  font-family: var(--font-body);
  font-size: var(--fs-note);
  color: var(--i-ink);
  outline: none;
  min-width: 0;
}
.intel-search input::placeholder { color: var(--i-ink-faint); }
.intel-search .hint {
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
  color: var(--i-ink-faint);
}
.intel-nav-links {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  margin-left: auto;
  font-family: var(--font-label);
  font-size: var(--fs-label);
}
.intel-nav-links a { color: var(--i-ink-dim); text-decoration: none; }
.intel-nav-links a:hover { color: var(--i-ink); }
.intel-nav-links a.accent { color: var(--i-bronze); }

/* ── 版心與雙欄 ── */
.intel-main {
  max-width: 1080px;
  margin: 0 auto;
  padding: var(--space-5) var(--space-5) var(--space-8);
}
.intel-columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}
@media (min-width: 1080px) {
  .intel-columns { grid-template-columns: minmax(0, 1fr) 300px; }
}

/* ── 麵包屑 ── */
.intel-crumbs {
  font-size: var(--fs-label);
  color: var(--i-ink-faint);
  margin: var(--space-2) 0 var(--space-5);
}
.intel-crumbs a { color: var(--i-ink-dim); text-decoration: none; }
.intel-crumbs a:hover { color: var(--i-bronze); }
.intel-crumbs .sep { margin: 0 var(--space-2); }

/* ── 公司 hero ── */
.intel-hero { margin-bottom: var(--space-5); }
.intel-hero-row {
  display: flex;
  align-items: center;
  gap: var(--space-5);
}
.intel-hero-row .intel-hero-text { flex: 1; min-width: 0; }
.intel-hero .status-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
  margin-bottom: var(--space-2);
}

/* ── 公司生成印記（由統編幾何化 · 零成本 · 每家獨一）── */
.intel-seal {
  flex-shrink: 0;
  width: 104px;
  height: 104px;
  color: var(--i-bronze);
}
.intel-seal svg { width: 100%; height: 100%; display: block; }
@media (max-width: 720px) {
  .intel-hero-row { flex-direction: row-reverse; gap: var(--space-4); }
  .intel-seal { width: 64px; height: 64px; }
}
.intel-hero h1 {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--fs-display);
  line-height: 1.35;
  margin: 0;
  letter-spacing: 0.01em;
}
.intel-hero .idline {
  font-family: var(--font-mono);
  font-size: var(--fs-note);
  color: var(--i-ink-dim);
  margin-top: var(--space-2);
}
.intel-badge {
  display: inline-block;
  font-size: var(--fs-label);
  font-weight: 500;
  border-radius: 999px;
  padding: 3px var(--space-3);
  white-space: nowrap;
}
.intel-badge.ok   { background: var(--i-ok-wash);   color: var(--i-ok); }
.intel-badge.new  { background: var(--i-warn-wash); color: var(--i-warn); }
.intel-badge.warn { background: #F3E1C6; color: #6B3F10; }

/* ── 搜尋入口 ── */
.intel-kicker {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
  letter-spacing: 0.14em;
  color: var(--i-bronze);
  margin-bottom: var(--space-2);
}
.intel-search-hero {
  padding: var(--space-7) 0 var(--space-6);
  border-bottom: 1px solid var(--i-line);
  margin-bottom: var(--space-5);
}
.intel-search-hero h1 {
  max-width: 760px;
  font-size: var(--fs-display);
  line-height: 1.25;
  font-weight: 500;
  margin: 0;
}
.intel-search-hero p {
  max-width: 720px;
  font-size: var(--fs-body);
  line-height: 1.9;
  color: var(--i-ink-dim);
  margin: var(--space-3) 0 0;
}
.intel-search-large {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-2);
  max-width: 760px;
  margin-top: var(--space-5);
  background: var(--i-paper-raise);
  border: 1px solid var(--i-line-strong);
  border-radius: var(--radius-card);
  padding: var(--space-2);
}
.intel-search-large input {
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--i-ink);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  padding: var(--space-3);
}
.intel-search-large input::placeholder { color: var(--i-ink-faint); }
.intel-search-large button {
  border: 0;
  border-radius: var(--radius-btn);
  background: var(--i-bronze-fill);
  color: var(--i-bronze-ink);
  font-family: var(--font-label);
  font-size: var(--fs-note);
  font-weight: 600;
  padding: 0 var(--space-5);
  cursor: pointer;
}
.intel-sample-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  align-items: center;
  margin-top: var(--space-3);
  color: var(--i-ink-faint);
  font-size: var(--fs-note);
}
.intel-sample-links a {
  color: var(--i-bronze);
  text-decoration: none;
}
.intel-result-list {
  display: grid;
  gap: var(--space-3);
}
.intel-result {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) auto auto;
  gap: var(--space-2) var(--space-4);
  align-items: baseline;
  background: var(--i-paper-raise);
  border: 1px solid var(--i-line);
  border-radius: var(--radius-card);
  color: inherit;
  padding: var(--space-4) var(--space-5);
  text-decoration: none;
}
.intel-result:hover { border-color: var(--i-bronze-line); }
.intel-result .name {
  font-size: var(--fs-body);
  font-weight: 500;
  color: var(--i-ink);
}
.intel-result .meta {
  color: var(--i-ink-faint);
  font-size: var(--fs-note);
}
.intel-result .mono { font-family: var(--font-mono); }
.intel-result .summary {
  grid-column: 1 / -1;
  color: var(--i-ink-dim);
  font-size: var(--fs-note);
  line-height: 1.7;
}
.intel-result .industry {
  grid-column: 1 / -1;
  color: var(--i-bronze);
  font-size: var(--fs-tag);
  font-family: var(--font-mono);
}
.intel-state-note {
  background: #F4E7D2;
  border: 1px solid #E2CC9C;
  border-radius: var(--radius-btn);
  color: #624210;
  font-size: var(--fs-note);
  line-height: 1.8;
  padding: var(--space-3) var(--space-4);
  margin: var(--space-3) 0 var(--space-5);
}

/* ── 統計卡 ── */
.intel-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--space-3);
  margin: var(--space-5) 0;
}
.intel-stat {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  background: var(--i-paper-dim);
  border-radius: var(--radius-btn);
  padding: var(--space-3) var(--space-4);
}
.intel-stat .ico {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  color: var(--i-bronze);
  margin-top: 2px;
}
.intel-stat .ico svg { width: 100%; height: 100%; display: block; }
.intel-stat .body { min-width: 0; }
.intel-stat .k {
  font-size: var(--fs-label);
  color: var(--i-ink-dim);
  margin-bottom: 4px;
}
.intel-stat .v {
  font-size: var(--fs-core);
  font-weight: 500;
  color: var(--i-ink);
}
.intel-stat .v.mono { font-family: var(--font-mono); }

/* ── 白話解讀塊（一級公民）── */
.intel-plain {
  display: flex;
  gap: var(--space-3);
  background: var(--i-bronze-wash);
  border: 1px solid var(--i-bronze-line);
  border-radius: var(--radius-card);
  padding: var(--space-4) var(--space-5);
  margin: var(--space-5) 0;
}
.intel-plain .mark {
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
  letter-spacing: 0.12em;
  color: var(--i-bronze);
  white-space: nowrap;
  padding-top: 3px;
}
.intel-plain p {
  margin: 0;
  font-size: var(--fs-body);
  line-height: 1.85;
  color: #4A3D1E;
}

/* ── 自家原生推薦卡 ── */
.intel-native {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  background: var(--i-paper-raise);
  border: 1px solid var(--i-bronze-line);
  border-radius: var(--radius-card);
  padding: var(--space-4) var(--space-5);
  margin: var(--space-5) 0;
}
.intel-native .tag {
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
  letter-spacing: 0.1em;
  color: var(--i-bronze);
  border: 1px solid var(--i-bronze-line);
  border-radius: 999px;
  padding: 2px var(--space-3);
  white-space: nowrap;
}
.intel-native .body { flex: 1; min-width: 0; }
.intel-native .body strong {
  display: block;
  font-size: var(--fs-body);
  font-weight: 500;
  margin-bottom: 2px;
}
.intel-native .body span {
  font-size: var(--fs-note);
  color: var(--i-ink-dim);
}
.intel-native .cta {
  font-size: var(--fs-note);
  font-weight: 500;
  color: var(--i-bronze-ink);
  background: var(--i-bronze-fill);
  border-radius: var(--radius-btn);
  padding: var(--space-2) var(--space-4);
  text-decoration: none;
  white-space: nowrap;
}

.intel-profile-promotions {
  display: grid;
  gap: var(--space-3);
  margin: var(--space-6) 0;
}

.intel-profile-promotion {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-4);
  border: 1px solid var(--i-bronze-line);
  border-radius: var(--radius-card);
  background: linear-gradient(135deg, var(--i-paper-raise), rgba(200, 169, 106, 0.09));
  color: var(--i-ink);
  text-decoration: none;
}

.intel-profile-promotion:hover {
  border-color: var(--i-bronze);
  box-shadow: 0 10px 24px rgba(31, 44, 72, 0.08);
}

.intel-profile-promotion .tag,
.intel-profile-promotion .disclosure,
.intel-profile-promotion .cta {
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
}

.intel-profile-promotion .tag,
.intel-profile-promotion .cta { color: var(--i-bronze); }
.intel-profile-promotion p { margin: 0; color: var(--i-ink-dim); line-height: 1.65; }
.intel-profile-promotion .disclosure { color: var(--i-ink-faint); }

/* ── 廣告保留位（版型的一部分：固定高、明確標示、不 CLS）── */
.intel-ad {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: var(--space-1);
  background: var(--i-paper-dim);
  border: 1px dashed var(--i-line-strong);
  border-radius: var(--radius-btn);
  color: var(--i-ink-faint);
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
  letter-spacing: 0.1em;
  margin: var(--space-5) 0;
}
.intel-ad.leaderboard { min-height: 90px; }
.intel-ad.rect        { min-height: 250px; }
.intel-ad .label { text-transform: uppercase; }

/* ── 資料區段 ── */
.intel-section { margin: var(--space-6) 0; }
.intel-local-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin: var(--space-4) 0 0;
  padding: 0.65rem var(--space-4);
  border: 1px solid var(--i-line);
  border-radius: var(--radius-card);
  background: color-mix(in srgb, var(--i-paper-raise) 88%, var(--i-bronze-wash));
}
.intel-local-nav-label {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--i-ink);
  font-size: var(--fs-note);
  font-weight: 600;
  white-space: nowrap;
}
.intel-local-nav-mark {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--i-bronze-fill);
  box-shadow: 0 0 0 4px var(--i-bronze-wash);
}
.intel-local-nav-links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.intel-local-nav-links a {
  padding: 0.35rem 0.55rem;
  border-radius: 999px;
  color: var(--i-ink-dim);
  font-size: var(--fs-tag);
  text-decoration: none;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.intel-local-nav-links a:hover,
.intel-local-nav-links a:focus-visible {
  background: var(--i-bronze-wash);
  color: var(--i-ink);
}
.intel-local-nav-links a.accent { color: var(--i-bronze); }
.intel-local-nav-links a[aria-current="page"] {
  background: var(--i-bronze-wash);
  color: var(--i-ink);
  font-weight: 600;
}
.intel-local-nav-links a.accent:hover,
.intel-local-nav-links a.accent:focus-visible { color: var(--i-bronze-ink); }

.intel-report-data-status,
.intel-region-status {
  position: relative;
  padding-left: 1.65rem;
}
.intel-report-data-status::before,
.intel-region-status::before {
  position: absolute;
  top: 50%;
  left: 0.65rem;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  background: var(--i-bronze);
  content: "";
  transform: translateY(-50%);
}
.intel-report-data-status[data-intel-data-state="ready"],
.intel-region-status[data-intel-data-state="ready"] {
  border-color: rgba(88, 119, 92, 0.3);
  color: #466b4b;
}
.intel-report-data-status[data-intel-data-state="ready"]::before,
.intel-region-status[data-intel-data-state="ready"]::before { background: #5b8a62; }
.intel-report-data-status[data-intel-data-state="fallback"],
.intel-region-status[data-intel-data-state="fallback"] {
  border-color: rgba(177, 124, 55, 0.34);
  color: #8a6229;
}
.intel-report-data-status[data-intel-data-state="fallback"]::before,
.intel-region-status[data-intel-data-state="fallback"]::before { background: #b17c37; }
.intel-report-data-status[data-intel-data-state="pending"]::before {
  animation: intel-status-pulse 1.4s ease-in-out infinite;
}
@keyframes intel-status-pulse {
  0%, 100% { opacity: 0.35; transform: translateY(-50%) scale(0.8); }
  50% { opacity: 1; transform: translateY(-50%) scale(1); }
}

@media (max-width: 720px) {
  .intel-local-nav {
    align-items: flex-start;
    flex-direction: column;
    padding: var(--space-3);
  }
  .intel-local-nav-links {
    justify-content: flex-start;
    width: 100%;
  }
  .intel-local-nav-links a { padding-inline: 0.45rem; }
}

.intel-report-card,
.intel-report-panel {
  color: var(--i-ink);
  text-decoration: none;
}
.intel-section > h2 {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--fs-body-lg);
  font-weight: 500;
  margin: 0 0 var(--space-3);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--i-line);
}
.intel-section > h2 .ico {
  width: 20px;
  height: 20px;
  color: var(--i-bronze);
  flex-shrink: 0;
}
.intel-section > h2 .ico svg { width: 100%; height: 100%; display: block; }
.intel-section > h2 .count {
  font-family: var(--font-mono);
  font-size: var(--fs-note);
  color: var(--i-ink-faint);
  font-weight: 400;
}

/* ── 營業項目 · 視覺化分類群（取代 15 顆平鋪 chip 的文字牆）── */
.intel-scope {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-3);
}
.intel-scope-group {
  background: var(--i-paper-raise);
  border: 1px solid var(--i-line);
  border-radius: var(--radius-card);
  padding: var(--space-4);
}
.intel-scope-group-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}
.intel-scope-group-head .ico {
  width: 20px;
  height: 20px;
  color: var(--i-bronze);
  flex-shrink: 0;
}
.intel-scope-group-head .ico svg { width: 100%; height: 100%; display: block; }
.intel-scope-group-head .name {
  font-size: var(--fs-body);
  font-weight: 500;
  color: var(--i-ink);
}
.intel-scope-group ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.intel-scope-group li {
  font-size: var(--fs-note);
  color: var(--i-ink-dim);
  display: flex;
  gap: var(--space-2);
}
.intel-scope-group li .code {
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
  color: var(--i-ink-faint);
  flex-shrink: 0;
  min-width: 54px;
}
.intel-kv { width: 100%; border-collapse: collapse; font-size: var(--fs-body); }
.intel-kv th, .intel-kv td {
  text-align: left;
  padding: var(--space-3) var(--space-2);
  border-bottom: 1px solid var(--i-line);
  vertical-align: top;
}
.intel-kv th {
  width: 30%;
  font-weight: 400;
  color: var(--i-ink-dim);
  white-space: nowrap;
}
.intel-kv td.mono { font-family: var(--font-mono); }

.intel-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.intel-chip {
  font-size: var(--fs-note);
  color: var(--i-ink-dim);
  background: var(--i-paper-raise);
  border: 1px solid var(--i-line);
  border-radius: 999px;
  padding: 4px var(--space-3);
}
.intel-chip .code {
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
  color: var(--i-ink-faint);
  margin-right: var(--space-1);
}

.intel-empty {
  background: var(--i-paper-dim);
  border-radius: var(--radius-btn);
  padding: var(--space-4) var(--space-5);
  font-size: var(--fs-note);
  color: var(--i-ink-dim);
}

/* ── 側欄 ── */
.intel-aside > * + * { margin-top: var(--space-4); }
.intel-source {
  background: var(--i-paper-raise);
  border: 1px solid var(--i-line);
  border-radius: var(--radius-card);
  padding: var(--space-4) var(--space-5);
  font-size: var(--fs-note);
  color: var(--i-ink-dim);
  line-height: 1.8;
}
.intel-source .k {
  font-family: var(--font-mono);
  font-size: var(--fs-tag);
  letter-spacing: 0.1em;
  color: var(--i-ink-faint);
  display: block;
  margin-bottom: var(--space-1);
}
.intel-source .source-time { margin-top: var(--space-3); }

/* ── 頁尾（日光）── */
.intel-footer {
  border-top: 1px solid var(--i-line);
  background: var(--i-paper-dim);
  margin-top: var(--space-8);
}
.intel-footer-inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: var(--space-5);
  font-size: var(--fs-note);
  color: var(--i-ink-dim);
  line-height: 1.9;
}
.intel-footer-inner a { color: var(--i-bronze); text-decoration: none; }
.intel-footer .fineprint {
  font-size: var(--fs-tag);
  color: var(--i-ink-faint);
  margin-top: var(--space-2);
}

@media (max-width: 720px) {
  .intel-search { display: none; }
  .intel-hero h1 { font-size: var(--fs-title); }
  .intel-search-hero h1 { font-size: var(--fs-title); }
  .intel-search-large { grid-template-columns: 1fr; }
  .intel-search-large button {
    min-height: 44px;
    padding: var(--space-3) var(--space-4);
  }
  .intel-result { grid-template-columns: 1fr; }
  .intel-native { flex-direction: column; align-items: flex-start; }
}