/**
 * IMT 全局界面层（最后加载，用于统一覆盖 nova-craft / style.css）
 *
 * 1. 固定头部 64px 统一占位：所有非首页页面 body 顶部留白，banner 紧贴导航，无空白、无遮挡
 * 2. 导航中英文上下两行
 * 3. 内页 banner（列表页 / 内容页 / 下载页共用同一套背景方式）
 * 4. 搜索结果列表、文章详情排版
 * 5. 右侧悬浮客服
 */

:root {
  --imt-header-h: 64px;
  --imt-wrap: 1200px;
}

/* ============================================================
   一、头部占位（解决列表页/内容页 banner 空白与遮挡）
   ============================================================ */

header.index-header,
header.index-header.header-bg {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  height: var(--imt-header-h) !important;
  min-height: var(--imt-header-h) !important;
  max-height: var(--imt-header-h) !important;
  overflow: visible !important;
}

header.index-header nav,
header.index-header.header-bg nav {
  height: var(--imt-header-h) !important;
  min-height: 0 !important;
}

header.index-header .nav-menu li,
header.index-header.header-bg .nav-menu li {
  height: var(--imt-header-h) !important;
}

/* 登录态也保持 fixed，否则 body 的顶部留白会把页面整体推下去 */
body.logged-in header.index-header {
  position: fixed !important;
  top: 0 !important;
}

/* 非首页统一让出导航高度：banner 从 64px 处开始，不再是 0 也不留缝 */
body:not(.home) {
  padding-top: var(--imt-header-h);
}

/* 通用宽度容器：grid.css 的 .container 在宽屏下只有 80% 宽，这里统一成固定行宽 */
.imt-wrap {
  position: relative;
  width: 100%;
  max-width: var(--imt-wrap);
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* ============================================================
   二、导航：中文在上、英文在下
   ============================================================ */

header.index-header .nav-menu li > a {
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px;
  line-height: 1.15 !important;
  padding: 0 20px !important;
}

header.index-header .nav-menu li > a .nav-cn {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: inherit;
}

header.index-header .nav-menu li > a .nav-en {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--neutral-500);
  opacity: 0.9;
  transition: color var(--duration-fast) var(--ease-default);
}

header.index-header .nav-menu li > a:hover .nav-en,
header.index-header .nav-menu li.active > a .nav-en {
  color: var(--color-brand-500);
}

/* 移动端抽屉里中英文左对齐 */
@media (max-width: 860px) {
  header.index-header .nav-menu li > a,
  header.index-header.header-bg .nav-menu li > a {
    align-items: flex-start !important;
    text-align: left;
    padding: 14px 22px !important;
  }

  header.index-header .nav-menu li > a .nav-cn {
    font-size: 16px;
  }
}

/* ============================================================
   三、内页 banner（列表页 / 内容页 / 下载页统一背景方式）
   ============================================================ */

.imt-banner {
  position: relative;
  overflow: hidden;
  color: #fff;
  background: #0a0f1e;
  isolation: isolate;
}

.imt-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  transform: scale(1.03);
}

/* 图片上叠一层深色渐变，保证任何底图都能读清文字 */
.imt-banner-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(115deg, rgba(6, 10, 22, 0.94) 0%, rgba(10, 16, 34, 0.8) 46%, rgba(18, 25, 48, 0.9) 100%),
    radial-gradient(900px 380px at 82% 0%, rgba(59, 130, 246, 0.26), transparent 62%);
}

/* 网格纹理，和首页 hero 同一视觉语言 */
.imt-banner::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(72% 90% at 50% 0%, #000 25%, transparent 100%);
  mask-image: radial-gradient(72% 90% at 50% 0%, #000 25%, transparent 100%);
  pointer-events: none;
}

.imt-banner-inner {
  position: relative;
  z-index: 2;
  padding: 36px 0 32px;
}

.imt-crumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
}

.imt-crumb a {
  color: rgba(255, 255, 255, 0.62);
  text-decoration: none;
}

.imt-crumb a:hover {
  color: #fff;
}

.imt-crumb .sep {
  opacity: 0.4;
}

.imt-banner h1,
.imt-banner .imt-banner-title {
  margin: 0;
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: #fff;
  white-space: normal;
}

.imt-banner .en {
  display: block;
  margin-top: 8px;
  font-size: 0.42em;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
}

.imt-banner .imt-banner-desc {
  margin: 12px 0 0;
  max-width: 800px;
  font-size: 14px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.62);
}

/* banner 内搜索框 */
.imt-banner-search {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 620px;
  margin-top: 22px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1.5px solid rgba(255, 255, 255, 0.22);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  overflow: hidden;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.imt-banner-search:focus-within {
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.18);
}

.imt-banner-search input {
  flex: 1 1 auto;
  min-width: 0;
  height: 48px;
  padding: 0 18px 0 22px;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  color: #fff;
  font-size: 15px;
  font-family: var(--font-sans);
}

.imt-banner-search input::placeholder {
  color: rgba(255, 255, 255, 0.45);
  font-size: 14px;
}

.imt-banner-search input:focus::placeholder {
  color: transparent;
}

.imt-banner-search .zhuige-btn-search {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 24px;
  background: linear-gradient(var(--gradient-brand));
  color: #fff;
  border-radius: 0 999px 999px 0;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
}

.imt-banner-search .zhuige-btn-search span {
  display: block;
  width: 20px;
  height: 20px;
  background-image: url(../images/search_gy.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
}

/* ============================================================
   四、搜索结果列表
   ============================================================ */

.imt-list-wrap {
  padding: 32px 0 64px;
}

.imt-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  font-size: 13px;
  color: var(--neutral-500);
}

.imt-list-head strong {
  color: var(--neutral-900);
  font-weight: 700;
}

.imt-hit-list {
  background: #fff;
  border: 1px solid var(--neutral-200);
  border-radius: 20px;
  padding: 6px 26px;
  box-shadow: var(--shadow-sm);
}

.imt-hit {
  display: grid;
  grid-template-columns: 208px minmax(0, 1fr);
  gap: 26px;
  padding: 24px 0;
  border-bottom: 1px solid var(--neutral-100);
  align-items: start;
}

.imt-hit:last-child {
  border-bottom: none;
}

/* 没有封面图时不占左侧栏位 */
.imt-hit.no-cover,
.imt-hit:not(:has(.imt-hit-cover)) {
  grid-template-columns: minmax(0, 1fr);
}

.imt-hit-cover {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: 12px;
  overflow: hidden;
  background: var(--neutral-100);
  border: 1px solid var(--neutral-200);
}

.imt-hit-cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s var(--ease-default);
}

.imt-hit:hover .imt-hit-cover img {
  transform: scale(1.04);
}

.imt-hit-body {
  min-width: 0;
}

.imt-hit-eyebrow {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 9px;
}

.imt-hit-type {
  display: inline-flex;
  align-items: center;
  height: 21px;
  padding: 0 9px;
  border-radius: 6px;
  background: rgba(124, 58, 237, 0.1);
  color: var(--color-brand-500);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.imt-hit-type.is-manual {
  background: rgba(16, 185, 129, 0.12);
  color: #059669;
}

.imt-hit-tag {
  display: inline-flex;
  align-items: center;
  height: 21px;
  padding: 0 8px;
  border-radius: 6px;
  background: var(--neutral-100);
  color: var(--neutral-500);
  font-size: 11px;
  font-weight: 500;
  text-decoration: none !important;
}

.imt-hit-tag:hover {
  background: rgba(124, 58, 237, 0.1);
  color: var(--color-brand-500);
}

.imt-hit-title {
  margin: 0 0 8px;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.01em;
}

.imt-hit-title a {
  color: var(--neutral-900);
  text-decoration: none !important;
  transition: color 0.2s ease;
}

.imt-hit:hover .imt-hit-title a {
  color: var(--color-brand-500);
}

.imt-hit-excerpt {
  margin: 0 0 12px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--neutral-500);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.imt-hit-excerpt a {
  color: inherit;
  text-decoration: none !important;
}

.imt-hit-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 12px;
  color: var(--neutral-300);
}

.imt-hit-meta .dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.6;
}

.imt-hit-meta .imt-hit-cat {
  color: var(--neutral-500);
  text-decoration: none !important;
}

.imt-empty {
  padding: 64px 24px;
  text-align: center;
  background: #fff;
  border: 1px dashed var(--neutral-200);
  border-radius: 20px;
  color: var(--neutral-500);
  font-size: 14px;
}

/* ============================================================
   五、文章详情
   ============================================================ */

/* 内容页（page.php）的旧 banner：留白收紧，顶部不再空 120px */
.zhuige-advert-about {
  padding: 52px 24px 42px !important;
}

.zhuige-advert-about .container {
  padding: 0 !important;
}

.zhuige-advert-about h1 {
  padding: 0 !important;
  font-size: clamp(1.5rem, 3vw, 2.25rem) !important;
  font-weight: 800 !important;
  white-space: normal !important;
}

/* 内容页顶部的页内导航：贴在固定头部下方 */
.zhuige-page-menu {
  z-index: 99;
}

.zhuige-page-menu .zhuige-box {
  padding: 10px 14px !important;
  border-radius: 12px;
}

.imt-post-wrap {
  padding: 32px 0 72px;
}

.imt-post-card {
  background: #fff;
  border: 1px solid var(--neutral-200);
  border-radius: 20px;
  padding: 40px 44px 48px;
  box-shadow: var(--shadow-sm);
}

/* 主题全局 header{position:fixed} 会误伤文章头区块 */
.imt-post-head {
  position: static !important;
  width: auto !important;
  min-height: 0 !important;
  z-index: auto !important;
}

.imt-post-head {
  padding-bottom: 22px;
  margin-bottom: 28px;
  border-bottom: 1px solid var(--neutral-100);
}

.imt-post-eyebrow {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.imt-post-title {
  margin: 0 0 16px;
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: -0.015em;
  color: var(--neutral-900);
}

.imt-post-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 13px;
  color: var(--neutral-300);
}

.imt-post-meta .imt-post-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* 正文排版：字号分梯度、正文不再是 #7f7f7f 一片灰 */
.imt-post-body,
.imt-post-body * {
  color: var(--neutral-700) !important;
  font-size: 16px !important;
  line-height: 1.85 !important;
}

.imt-post-body p {
  margin: 0 0 18px;
}

.imt-post-body h1,
.imt-post-body h2,
.imt-post-body h3 {
  color: var(--neutral-900) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  margin: 34px 0 14px;
}

.imt-post-body h1 { font-size: 26px !important; }
.imt-post-body h2 { font-size: 22px !important; }
.imt-post-body h3 { font-size: 19px !important; }

.imt-post-body strong,
.imt-post-body b {
  color: var(--neutral-900) !important;
}

/* 正文链接：与灰色正文区分开 */
.imt-post-body a,
.imt-post-body a * {
  color: var(--primary, #4f46e5) !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* 代码块 / 粘贴进来的纯链接块：主题给的是深底，正文又被强制成深灰字，
   对比度不足看不清。统一改成浅底深字，长链接自动折行不撑破卡片。 */
.imt-post-body pre {
  background: #f6f7fb !important;
  border: 1px solid var(--neutral-200, #e5e7eb) !important;
  border-radius: 12px !important;
  padding: 16px 18px !important;
  margin: 22px 0 !important;
  overflow-x: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

.imt-post-body pre,
.imt-post-body pre *,
.imt-post-body code,
.imt-post-body kbd {
  color: #1f2937 !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  border: 0 !important;
}

/* 只清掉内部元素底色，pre 自身的浅底要保留 */
.imt-post-body pre *,
.imt-post-body code {
  background: transparent !important;
}

.imt-post-body pre a,
.imt-post-body pre a * {
  color: var(--primary, #4f46e5) !important;
}

/* 内容图：按原图等比缩放，不裁剪、不拉伸、居中 */
.imt-post-body img {
  display: block;
  max-width: 100% !important;
  width: auto !important;
  height: auto !important;
  margin: 26px auto !important;
  border-radius: 10px;
  object-fit: contain !important;
  cursor: zoom-in;
}

/* 相册区块（wp-block-gallery）默认是多列裁切网格，这里改成单列完整显示 */
.imt-post-body .wp-block-gallery,
.imt-post-body .wp-block-gallery.has-nested-images,
.imt-post-body .wp-block-gallery.is-layout-flex {
  display: block !important;
  margin: 26px 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  max-width: 100% !important;
  width: auto !important;
}

.imt-post-body .wp-block-gallery figure.wp-block-image {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  flex: none !important;
  align-self: auto !important;
}

.imt-post-body .wp-block-gallery figure.wp-block-image > a,
.imt-post-body .wp-block-gallery figure.wp-block-image > div {
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  flex: none !important;
}

.imt-post-body .wp-block-gallery figure.wp-block-image img {
  flex: none !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 18px auto !important;
  object-fit: contain !important;
}

.imt-post-body .wp-block-gallery figcaption,
.imt-post-body .wp-block-image figcaption {
  position: static !important;
  margin: 6px auto 18px !important;
  padding: 0 !important;
  background: none !important;
  color: var(--neutral-300) !important;
  font-size: 12.5px !important;
  line-height: 1.6 !important;
  text-align: center !important;
}

/* 窄图不要被撑大 */
.imt-post-body p > img:only-child {
  max-width: min(100%, 100%);
}

.imt-post-foot {
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid var(--neutral-100);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 13px;
  color: var(--neutral-500);
}

.imt-post-foot .label {
  color: var(--neutral-300);
}

.imt-post-foot .imt-hit-tag {
  height: 24px;
  font-size: 12px;
}

/* ============================================================
   六、右侧悬浮客服
   ============================================================ */

.imt-contact {
  position: fixed;
  right: 18px;
  bottom: 108px;
  z-index: 9990;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.imt-contact-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--neutral-200);
  box-shadow: 0 10px 24px -10px rgba(15, 23, 42, 0.28);
  color: var(--neutral-700);
  text-decoration: none !important;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.imt-contact-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -10px rgba(15, 23, 42, 0.34);
}

.imt-contact-item svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

.imt-contact-item.is-phone:hover {
  background: linear-gradient(var(--gradient-brand));
  border-color: transparent;
  color: #fff;
}

.imt-contact-item.is-wechat:hover {
  background: #07c160;
  border-color: transparent;
  color: #fff;
}

.imt-contact-item.is-wa:hover {
  background: #25d366;
  border-color: transparent;
  color: #fff;
}

/* 悬浮气泡 */
.imt-contact-pop {
  position: absolute;
  right: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%) translateX(6px);
  min-width: 160px;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(17, 24, 39, 0.96);
  color: #fff;
  font-size: 12px;
  line-height: 1.6;
  white-space: nowrap;
  box-shadow: 0 12px 30px -10px rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
  pointer-events: none;
}

.imt-contact-pop::after {
  content: '';
  position: absolute;
  right: -5px;
  top: 50%;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  background: rgba(17, 24, 39, 0.96);
  transform: rotate(45deg);
}

.imt-contact-item:hover .imt-contact-pop,
.imt-contact-item:focus .imt-contact-pop {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}

.imt-contact-pop b {
  display: block;
  font-size: 13px;
  font-weight: 600;
}

.imt-contact-pop span {
  color: rgba(255, 255, 255, 0.6);
  font-family: var(--font-mono);
}

@media (max-width: 860px) {
  .imt-contact {
    right: 10px;
    bottom: 76px;
    gap: 7px;
  }

  .imt-contact-item {
    width: 40px;
    height: 40px;
    border-radius: 11px;
  }

  .imt-contact-item svg {
    width: 20px;
    height: 20px;
  }

  /* 移动端气泡改为常显的标签不现实，干脆不做 hover 提示，点击直接拨号/跳转 */
  .imt-contact-pop {
    display: none;
  }
}

/* 首页是一屏布局，客服按钮往下挪一点避免压住搜索区 */
body.home .imt-contact {
  bottom: 72px;
}

/* ============================================================
   七、页脚（内页）
   ============================================================ */

footer {
  padding: 22px 0 !important;
  background: #fff;
  border-top: 1px solid var(--neutral-200);
  font-size: 13px;
  color: var(--neutral-500);
}

footer .container {
  padding: 0 24px !important;
  text-align: left !important;
  max-width: var(--imt-wrap);
}

footer .zhuige-site-links {
  justify-content: flex-start !important;
  padding-bottom: 8px !important;
  gap: 8px;
}

footer .zhuige-copy-link {
  justify-content: space-between !important;
}

footer .zhuige-copyright {
  font-size: 12.5px;
  color: var(--neutral-500);
}

body.home footer {
  border-top: none;
}

@media (max-width: 900px) {
  footer {
    padding: 18px 0 !important;
  }

  footer .container {
    padding: 0 16px !important;
  }
}

/* ============================================================
   八、响应式
   ============================================================ */

/* 抽屉菜单完全遮住底层内容，避免文字透出来 */
@media (max-width: 860px) {
  .nav-menu.open {
    background: #fff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

@media (max-width: 900px) {
  .imt-banner-inner {
    padding: 26px 0 22px;
  }

  .imt-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }

  .imt-hit {
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 16px;
    padding: 18px 0;
  }

  .imt-hit-list {
    padding: 4px 16px;
    border-radius: 16px;
  }

  .imt-hit-title {
    font-size: 16px;
    margin-bottom: 6px;
  }

  .imt-hit-excerpt {
    font-size: 13px;
    -webkit-line-clamp: 2;
    margin-bottom: 8px;
  }

  .imt-post-card {
    padding: 24px 18px 32px;
    border-radius: 16px;
  }

  .imt-post-body,
  .imt-post-body * {
    font-size: 15px !important;
  }

  .imt-banner-search {
    max-width: 100%;
  }
}

@media (max-width: 520px) {
  .imt-hit {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
  }

  .imt-hit-meta {
    gap: 10px;
    font-size: 11px;
  }

  .imt-hit-excerpt {
    display: none;
  }

  .imt-banner h1 {
    font-size: 22px;
  }

  .imt-banner-search input {
    height: 44px;
    font-size: 14px;
    padding: 0 14px 0 16px;
  }

  .imt-banner-search .zhuige-btn-search {
    height: 44px;
    padding: 0 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .imt-hit-cover img,
  .imt-contact-item {
    transition: none !important;
  }
}