/* 为段落添加首行缩进 2 个字符 */
p {
    text-indent: 2em;
}

.hover-img {
  transition: transform 0.3s ease, filter 0.3s ease;
  display: inline-block;
}

.hover-img:hover {
  transform: scale(1.1); /* 放大比例，可调 */
  filter: brightness(1.1) saturate(1.2); /* 提亮加色彩，可自定义 */
}

/* 移除所有超链接下划线 */
a {
    text-decoration: none !important;
}

/* 可选：移除悬停状态的下划线 */
a:hover {
    text-decoration: none !important;
}

textarea {
  height: 100px; /* 或者改成你想要的数值 */
  min-height: 100px;
  max-height: 200px;
}


.brand-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr); /* 默认移动端每行5个 */
  gap: 16px;
  padding: 12px;
  box-sizing: border-box;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

.brand-grid img {
  width: 100%;
  height: auto;
  display: block;
}

/* 桌面端：大于等于 768px 时，每行10个 */
@media (min-width: 768px) {
  .brand-grid {
    grid-template-columns: repeat(10, 1fr);
  }
}


/* 新增 figcaption 样式 */
.brand-grid figcaption {
  color: white;
  text-align: center;  /* 可选：文字居中 */
  margin-top: 8px;     /* 可选：与图片间距 */
}
/* 更具体的选择器 */
.brand-grid-1 figure figcaption {
  color: white !important;
  text-align: center;
  margin-top: 8px;
}


.brand-grid-1 {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 始终保持 3 列 */
  gap: 16px;
  padding: 12px;
  box-sizing: border-box;

  /* 不设 max-width，不限制外层容器宽度 */
  width: 100%;
}

.brand-grid-1 figure {
  margin: 0;
  text-align: center;
}

.brand-grid-1 img {
  width: 100%;             /* 每张图填满单元格 */
  height: auto;
  display: block;
  object-fit: contain;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
}

.brand-grid-1 img:hover {
  transform: scale(1.05);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.brand-grid-1 figcaption {
  margin-top: 8px;
  font-size: 14px;
  color: #333;
}

/* 缩小 Astra 主题主菜单下拉菜单项之间的间距 */
.main-header-menu .sub-menu a {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  line-height: 2 !important; /* 调整行高也可以让它更紧凑 */
}

/* 可选：缩小整个子菜单与父菜单的距离 */
.main-header-menu .sub-menu {
  margin-top: 1 !important;
}


/* 页眉上方的信息代码开始 */
.custom-topbar {
  background-color: #f8f8f8;
  padding: 6px 20px;
  font-size: 14px;
  color: #333;

}

.topbar-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.topbar-right a {
  color: #0073aa;
  margin-left: 12px;
  text-decoration: none;
  font-weight: 500;
}

.topbar-right a:hover {
  text-decoration: underline;
}
/* 页眉上方的信息代码增强：添加搜索框 */
.topbar-right {
  display: flex;
  align-items: center;
  gap: 16px;
}

.topbar-links a {
  color: #0073aa;
  margin-left: 12px;
  text-decoration: none;
  font-weight: 500;
}

.topbar-links a:first-child {
  margin-left: 0;
}

.topbar-links a:hover {
  text-decoration: underline;
}

.topbar-search {
  display: flex;
  align-items: center;
}

.topbar-search input.search-field {
  padding: 4px 8px;
  font-size: 14px;
  border: 1px solid #ccc;
  border-radius: 4px 0 0 4px;
  outline: none;
  height: 32px;
}

.topbar-search button {
  padding: 0;
  margin: 0;
  background-color: #0073aa;
  border: none;
  border-radius: 0 4px 4px 0;
  cursor: pointer;
  height: 32px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.topbar-search button img {
  width: 18px;
  height: 18px;
  filter: brightness(0) invert(1); /* 白色图标效果 */
  transition: filter 0.3s ease;
}

.topbar-search button:hover img {
  filter: brightness(0.8) invert(1);
}
/* 社交图标容器和样式 */
.topbar-social-icons {
  display: flex;
  gap: 12px;
  align-items: center;
}

.topbar-social-icons a {
  display: inline-flex;
  align-items: center;
}

.topbar-social-icons img {
  width: 20px;
  height: 20px;
  transition: transform 0.3s ease;
  filter: none; /* 如果你想用正常颜色图标，这里不需要filter */
}

.topbar-social-icons img:hover {
  transform: scale(1.2);
}
/* 页眉上方的信息代码结束 */


/* 列表的缩进 */
ul.soujin {
  padding-left: 2em;
}
.soujin a:hover {
  color: #000;
}

/* 手机端不显示页脚 */
@media (max-width: 768px) {
  .yejiao {
    display: none !important;
  }
}
/* 手机端aboutus文字显示预留*/
@media (max-width: 768px) {
  .aboutus001 {
    padding-left: 1em;
    padding-right: 1em;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
  }
}
/* EPC工控机的图片放大效果*/
.EPC-picture img {
  transition: transform 0.3s ease, filter 0.3s ease;
}

.EPC-picture img:hover {
  transform: scale(1.05); /* 放大 7% */
  filter: brightness(1.1) saturate(1.2); /* 稍微变亮并增强颜色 */
}

/* EPC增加工控机图标*/
.EPC-title {
  position: relative;
  padding-left: 30px; /* 给图标留出空间 */
}

.EPC-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  background-image: url('https://cesipc.com/wp-content/uploads/2025/06/FANLESS-BOX-PC.svg');
  background-size: contain;
  background-repeat: no-repeat;
}
.EPC-title {
  position: relative;
  padding-left: 40px; /* 原来是 30px，增加一点间隔 */
}

.EPC-title {
  transition: all 0.3s ease;
}

.EPC-title:hover::before {
  transform: translateY(-50%) scale(1.1);
}


/* 给 news-solution 区块内的每篇文章之间添加横线 */
.news-solution li {
  border-bottom: 1px solid #ddd;  /* 添加浅灰色横线 */
  padding: 10px 0;               /* 上下间距 */
  list-style: none;              /* 去掉原点符号（如果有） */
}

/* 最后一项不需要横线 */
.news-solution li:last-child {
  border-bottom: none;
}
.news-solution a {
  font-size: 20px;
  font-weight: bold;
}


/* 文字首行缩进2个字符 */
.shouhang {
  text-indent: 2em;
}

/* 栏目之间的上下间隔 */
.compact-row {
    margin-top: 15px !important;  /* 调整上间距 */
    margin-bottom: 15px !important;  /* 调整下间距 */
    padding: 5px 0 !important;  /* 调整内部留白 */
}
.compact-row .wp-block-image {
    margin: 0 5px !important;  /* 图片水平间距 */
}

/* EPC 类图片效果 */
.EPC img {
  transition: transform 0.3s ease, filter 0.3s ease; /* 过渡效果 */
}

.EPC img:hover {
  transform: scale(1.1); /* 鼠标刷过时放大10% */
  filter: brightness(1.2); /* 提高亮度 */
}

/* === 放大镜主图 + 缩略图整体容器 === */
.zoom-gallery {
  max-width: 320px;
  margin: 0 auto;
}

/* === 主图区域 === */
.zoom-container {
  position: relative;
  width: auto;
  height: auto;
  border: 1px solid #ccc;
  overflow: hidden;
  margin-bottom: 10px;
  border-radius: 6px;
}

#mainImage {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 6px;
}

/* === 放大镜 lens 样式 === */
#zoomLens {
  position: absolute;
  width: 100px;
  height: 100px;
  border: 1px solid #999;
  background-repeat: no-repeat;
  background-size: 600px 600px;
  display: none;
  cursor: crosshair;
  pointer-events: none;
  z-index: 10;
  border-radius: 50%;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}

/* === 缩略图外层滚动容器（超出可横向滚动） === */
.thumbnail-wrapper {
  overflow-x: auto;
  padding-bottom: 4px;
}

/* === 缩略图内部横排 === */
.thumbnail-scroll {
  display: flex;
  gap: 8px;
  width: max-content;
  padding: 4px 2px;
}

/* === 单张缩略图样式 === */
.thumb {
  width: 50px;
  height: 50px;
  object-fit: contain;              /* 完整显示产品比例 */
  background-color: #f4f4f4;        /* 背景防止白色图丢失边界 */
  padding: 2px;
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: 4px;
  transition: transform 0.3s ease, border 0.3s ease, box-shadow 0.3s ease;
  flex-shrink: 0;
  box-sizing: border-box;
}

.thumb:hover,
.thumb.active {
  border-color: #0073aa;
  transform: scale(1.05);
  box-shadow: 0 0 4px rgba(0, 115, 170, 0.3);
}

/* === 滚动条隐藏美化（可选） === */
.thumbnail-wrapper::-webkit-scrollbar {
  height: 6px;
}
.thumbnail-wrapper::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 3px;
}
.thumbnail-wrapper::-webkit-scrollbar-track {
  background: transparent;
}

/* 表格基础样式 */
.biaoge {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  table-layout: auto;
  word-break: break-word;
  white-space: normal;
}

/* 所有单元格样式 */
.biaoge th,
.biaoge td {
  border: 1px solid #ccc;
  padding: 8px;
  text-align: left;
  vertical-align: middle;
}

/* 电脑端：第一列宽度固定为 160px */
.biaoge th:first-child,
.biaoge td:first-child {
  width: 160px;
  min-width: 160px;
  max-width: 160px;
}

/* 手机端样式调整 */
@media (max-width: 768px) {
  .biaoge {
    font-size: 8px;
  }

  .biaoge th:first-child,
  .biaoge td:first-child {
    width: 23%;
    min-width: unset;
    max-width: unset;
  }
}

/* 修改标题文字大小 */
.wp-block-latest-posts__post-title {
    font-size: 22px !important;  /* 设置字体大小为22px */
    font-weight: bold !important;  /* 加粗标题 */
    color: #3375af !important;    /* 设置标题颜色为 #3375af */
    text-decoration: none !important;  /* 去掉默认的链接下划线 */
    margin-bottom: 10px !important;  /* 给标题下方加点间距 */
    transition: all 0.3s ease; /* 添加平滑过渡效果 */
}

/* 鼠标悬停时的效果 */
.wp-block-latest-posts__post-title:hover {
    color: #1d5b8e !important;  /* 设置鼠标滑过时的颜色 */
    font-size: 23px !important;  /* 设置鼠标滑过时的字体大小（轻微变大） */
}

/* 修改摘要的字体样式和缩进 */
.wp-block-latest-posts__post-excerpt {
    text-indent: 4ch !important; /* 摘要首行缩进 2 个字符 */
    font-size: 16px !important;   /* 设置字体大小 */
    line-height: 1.6 !important;  /* 调整行高 */
    color: #444444 !important;    /* 设置颜色 */
    margin-top: 10px !important;  /* 给摘要和其他元素间加点间距 */
}

/* 给每个li项之间添加分隔线 */
.wp-block-latest-posts__list li {
    margin-bottom: 20px !important;  /* 设置每个列表项之间的间距 */
    padding-bottom: 20px;            /* 添加内边距以保证分隔线不紧贴内容 */
    overflow: hidden;                /* 清除浮动 */
}

/* 在每篇文章之间添加分隔线 */
.wp-block-latest-posts__list li:not(:last-child) {
    border-bottom: 1px solid #ddd;  /* 分隔线颜色和样式 */
    padding-bottom: 20px;           /* 给每篇文章添加底部间距 */
}

@media (max-width: 768px) {
  #secondary {
    display: none !important;
  }
}
@media (max-width: 768px) {
  footer .ast-footer-widget,
  footer .ast-footer-navigation,
  footer .ast-footer-menu-wrap,
  footer .footer-widget-area,
  footer .ast-builder-footer-element {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
  }
}

/* 分类目录描述全宽背景色 + 内容居中限制 1200px */
body.category .ast-archive-description {
  position: relative;
  left: 0;
  right: 0;
  width: 100vw;
  max-width: 100vw !important;
  margin-left: calc(-50vw + 50%);
  background-color: #f0f9ff !important;
  padding: 20px 0;  /* 上下间距 */
  border-radius: 0;
}

/* 内部内容限制在1200px以内 */
body.category .ast-archive-description > * {
  max-width: 1200px;
  margin: 0 auto;     /* 居中 */
  padding: 0 20px;    /* 左右空隙，避免文字贴边 */
  box-sizing: border-box;
}
