/* v13：洞見情報全面回到全站 1180 px 規格，並避開固定 Menu Bar。 */
body.insight-layout-v13 {
  overflow-x: clip;
}

body.insight-layout-v13 .site-header {
  position: fixed !important;
  top: 16px !important;
  right: 0 !important;
  left: 0 !important;
  width: auto !important;
  padding: 0 20px !important;
  background: transparent !important;
}

body.insight-layout-v13 .site-header .nav-shell {
  width: min(1180px, 100%) !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
}

body.insight-layout-v13 > main {
  padding-top: 110px;
}

body.insight-layout-v13 .top-stage {
  padding-top: 24px;
}

body.insight-layout-v13 .wrap,
body.insight-layout-v13 .article-hero,
body.insight-layout-v13 .reading-grid,
body.insight-layout-v13 .related-wide,
body.insight-layout-v13 .resource-inner,
body.insight-layout-v13 .story-spotlight-inner,
body.insight-layout-v13 .layout-review,
body.insight-layout-v13 .story .reading-grid,
body.insight-layout-v13 .story .related-wide {
  width: min(calc(100% - 48px), 1180px) !important;
  max-width: 1180px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.insight-layout-v13 .story .story-stats,
body.insight-layout-v13 .story .story-media,
body.insight-layout-v13 .story .story-gallery,
body.insight-layout-v13 .story .story-evidence {
  max-width: 1180px !important;
}

body.insight-layout-v13 .article-hero {
  margin-top: 0 !important;
}

body.insight-layout-v13 .browse {
  border-top: 1px solid rgba(255, 255, 255, .2);
  background:
    radial-gradient(circle at 88% 6%, rgba(103, 170, 170, .22), transparent 34%),
    #315966 !important;
}

body.insight-layout-v13 .browse .unit-tabs,
body.insight-layout-v13 .browse .article-card {
  border-color: rgba(255, 255, 255, .28);
}

body.insight-layout-v13 .browse + .original-site-footer,
body.insight-layout-v13 .article-page + .original-site-footer {
  border-top: 1px solid rgba(128, 203, 199, .3) !important;
}

@media (max-width: 960px) {
  body.insight-layout-v13 .site-header {
    top: 10px !important;
    padding-inline: 12px !important;
  }

  body.insight-layout-v13 > main {
    padding-top: 82px;
  }

  body.insight-layout-v13 .top-stage {
    padding-top: 20px;
  }
}

@media (max-width: 620px) {
  body.insight-layout-v13 .wrap,
  body.insight-layout-v13 .article-hero,
  body.insight-layout-v13 .reading-grid,
  body.insight-layout-v13 .related-wide,
  body.insight-layout-v13 .resource-inner,
  body.insight-layout-v13 .story-spotlight-inner,
  body.insight-layout-v13 .layout-review,
  body.insight-layout-v13 .story .reading-grid,
  body.insight-layout-v13 .story .related-wide {
    width: min(calc(100% - 32px), 1180px) !important;
  }
}

/* v14：四類文章保留寬幅 Banner；正文與延伸閱讀仍遵守 1180 px。 */
body.insight-layout-v13 .article-page .article-hero {
  width: min(calc(100% - 48px), 1360px) !important;
  max-width: 1360px !important;
}

/* v14：文章總覽改採低彩度藍綠至霧紫，與深藍 Footer 分區。 */
body.insight-layout-v13 .browse {
  background:
    radial-gradient(circle at 88% 16%, rgba(157, 132, 177, .28), transparent 35%),
    radial-gradient(circle at 12% 90%, rgba(87, 166, 166, .2), transparent 32%),
    linear-gradient(112deg, #315d68 0%, #3f5667 48%, #5b496e 100%) !important;
}

@media (max-width: 620px) {
  body.insight-layout-v13 .article-page .article-hero {
    width: min(calc(100% - 32px), 1360px) !important;
  }
}

/* v15：洞見總覽與 Footer 使用同一深藍色，視覺直接連成一體。 */
body.insight-layout-v13 .browse {
  background: #102a3d !important;
}

body.insight-layout-v13 .browse + .original-site-footer {
  border-top-color: transparent !important;
}

/* v15：洞見內頁目前分類只保留共用選單的一條底線。 */
body.insight-layout-v13 .site-header .nav-links a[data-unit][aria-current="page"] {
  text-decoration: none !important;
}

/* V15 綜合修正：文章摘要不再用卡片內卷軸閱讀。 */
body.insight-layout-v13 .article-card .media-reveal p,
body.insight-layout-v13 .article-card:not(.feature):hover .media-reveal p,
body.insight-layout-v13 .article-card:not(.feature):focus-visible .media-reveal p {
  display: -webkit-box !important;
  max-height: none !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.unit-tabs-toggle,
.mobile-section-toggle,
.topic-filter-toggle { display: none; }

/* V15《修改意見 2》：課程花絮目錄桌面版平均分配寬度，並提高閱讀對比。 */
body.insight-layout-v13 .story-index {
  overflow: visible;
  background: #d7e4d4;
}
body.insight-layout-v13 .story-index > span { color: #2e5846; }
body.insight-layout-v13 .story-index > a {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  color: #315b49;
  overflow-wrap: anywhere;
}
body.insight-layout-v13 .story-index > a small { color: #4d775f; }
body.insight-layout-v13 .story-index > a:hover,
body.insight-layout-v13 .story-index > a:focus-visible,
body.insight-layout-v13 .story-index > a.active { background: #bcd7bf; }

/* 使用者確認：課程資訊文章桌面版 Banner 的深色文字區固定向右內縮 100 px。 */
@media (min-width: 821px) {
  body.insight-layout-v13 .article-page.course .course-hero .course-hero-copy {
    width: calc(51% - 100px) !important;
  }
}

@media (max-width: 700px) {
  /* 洞見首頁的四大單元改為單一收合選單。 */
  body.insight-layout-v13 .unit-tabs-toggle {
    display: flex;
    width: 100%;
    min-height: 50px;
    align-items: center;
    justify-content: space-between;
    padding: 11px 16px;
    border: 1px solid rgba(157, 221, 214, .58);
    border-radius: 14px;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    font-weight: 800;
  }
  body.insight-layout-v13 .unit-tabs-toggle b,
  body.insight-layout-v13 .mobile-section-toggle b { transition: transform .2s ease; }
  body.insight-layout-v13 .unit-tabs-toggle[aria-expanded="true"] b,
  body.insight-layout-v13 .mobile-section-toggle[aria-expanded="true"] b { transform: rotate(180deg); }
  body.insight-layout-v13 .unit-tabs { display: none; margin: 8px 0 0; padding: 8px; overflow: visible; border: 1px solid rgba(255,255,255,.2); border-radius: 14px; }
  body.insight-layout-v13 .unit-tabs.is-open { display: grid; grid-template-columns: 1fr 1fr; }
  body.insight-layout-v13 .unit-tabs button { min-width: 0; padding: 12px 7px; white-space: normal; }

  /* 單元內的主題篩選在手機版改為收合選單，避免橫向卷軸。 */
  body.insight-layout-v13 .topic-filter-toggle {
    display: flex;
    width: 100%;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    margin: 22px 0 8px;
    padding: 10px 14px;
    border: 1px solid rgba(157, 221, 214, .58);
    border-radius: 13px;
    background: rgba(255, 255, 255, .1);
    color: #fff;
    font-weight: 800;
  }
  body.insight-layout-v13 .topic-filter-toggle b { transition: transform .2s ease; }
  body.insight-layout-v13 .topic-filter-toggle[aria-expanded="true"] b { transform: rotate(180deg); }
  body.insight-layout-v13 .topic-filters {
    display: none !important;
    width: 100%;
    margin: 0 !important;
    padding: 8px 0 0 !important;
    overflow: visible !important;
  }
  body.insight-layout-v13 .topic-filters.is-open {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  body.insight-layout-v13 .topic-filters button {
    width: 100%;
    min-width: 0 !important;
    white-space: normal !important;
  }

  /* 文章內頁的分類列與章節列統一改為可收合直向選單。 */
  body.insight-layout-v13 .mobile-section-toggle {
    display: flex;
    width: 100%;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border: 1px solid #b9d0c7;
    border-radius: 13px;
    background: #fff;
    color: #1c584f;
    font-weight: 800;
  }
  body.insight-layout-v13 .category-switch.mobile-collapsible { display: block; padding-bottom: 20px; overflow: visible; }
  body.insight-layout-v13 .category-switch.mobile-collapsible > a { display: none; width: 100%; min-width: 0; margin-top: 6px; border: 1px solid #c8d9d2; border-radius: 10px; padding: 10px 12px; }
  body.insight-layout-v13 .category-switch.mobile-collapsible.is-open > a { display: flex; }

  body.insight-layout-v13 .story-index.mobile-collapsible { display: block; width: calc(100% - 32px); margin: 18px 16px 0; padding: 8px; overflow: visible; border-radius: 16px; }
  body.insight-layout-v13 .story-index.mobile-collapsible > span,
  body.insight-layout-v13 .story-index.mobile-collapsible > a { display: none; }
  body.insight-layout-v13 .story-index.mobile-collapsible.is-open > a { display: block; width: 100%; max-width: none; margin-top: 5px; padding: 11px 13px; border-radius: 9px; }

  body.insight-layout-v13 .article-side .side-inner.mobile-collapsible { overflow: visible; }
  body.insight-layout-v13 .article-side .side-inner.mobile-collapsible > nav { display: none; overflow: visible; }
  body.insight-layout-v13 .article-side .side-inner.mobile-collapsible.is-open > nav { display: grid; grid-template-columns: 1fr; gap: 0; }
  body.insight-layout-v13 .article-side .side-inner.mobile-collapsible.is-open > nav a { width: 100%; max-width: none; }

  body.insight-layout-v13 .grant-index.mobile-collapsible > a,
  body.insight-layout-v13 .grant-index.mobile-collapsible > .eyebrow { display: none; }
  body.insight-layout-v13 .grant-index.mobile-collapsible.is-open > a { display: block; }

  /* 手機上的資料表直接在欄內折行，不再產生雙向卷軸。 */
  body.insight-layout-v13 .data-table { margin-inline: 0; overflow: visible; }
  body.insight-layout-v13 .data-table table { min-width: 0; table-layout: fixed; }
  body.insight-layout-v13 .data-table th,
  body.insight-layout-v13 .data-table td { padding: 13px 10px; overflow-wrap: anywhere; font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .unit-tabs-toggle b,
  .mobile-section-toggle b,
  .topic-filter-toggle b { transition: none !important; }
}
