/* =====================================================================
   中国机械工程学会压力容器分会 - 官网样式表
   设计稿来源：Figma（1:1 像素级还原）
   技术规范：移动端优先，CSS3 Media Query，rem/vw 自适应
   基准：html font-size = 10px（1rem = 10px），方便 Figma px 值转换
   ===================================================================== */


/* =====================================================================
   一、CSS 重置与全局基础样式
   ===================================================================== */

*, *::before, *::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* 基准字号：10px，使 1rem = 10px，便于与 Figma 标注对应 */
html {
  font-size: 62.5%; /* 10px / 16px * 100% = 62.5% */
  scroll-behavior: smooth;
  /* 防止布局偏移 CLS = 0 */
  overflow-x: hidden;
}

body {
  /* Figma: Inter, Noto Sans SC/JP, sans-serif */
  font-family: 'Inter', 'Noto Sans SC', 'Noto Sans JP', -apple-system,
               BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 1.4rem;       /* Figma 默认正文 14px */
  color: #364153;          /* Figma 中等文字色 */
  background-color: #ffffff;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  text-decoration: none;
  color: inherit;
}

ul, ol {
  list-style: none;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

button {
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
}

/* =====================================================================
   二、容器（Container）
   Figma: 最大内容宽度 1280px，居中，水平 padding 32px
   ===================================================================== */

.container {
  max-width: 128rem;    /* 1280px */
  width: 100%;
  margin: 0 auto;
  padding: 0 3.2rem;    /* Figma: 内边距 32px */
}


/* =====================================================================
   三、Header / 导航栏
   Figma: 总高度 165px，背景 #fff，阴影 0 1px 3px rgba(0,0,0,0.1)
   包含 Logo 行（97px）+ 导航行（68px）
   ===================================================================== */

.site-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #ffffff;
  /* Figma 阴影：0px 1px 3px rgba(0,0,0,0.1), 0px 1px 2px rgba(0,0,0,0.1) */
  -webkit-box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
}

.header-inner {
  max-width: 128rem;    /* 1280px */
  margin: 0 auto;
  padding: 0 3.2rem;    /* Figma: 32px padding */
}

/* --- Logo 行：Figma height 97px，border-bottom --- */
.header-logo-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* Figma 导航栏 Logo 行高度：97px */
  height: 9.7rem;
  border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
}

.logo-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* Figma: gap 16px between logo and title */
  gap: 1.6rem;
}

/* Logo 图片：Figma 135.531px × 64px */
.logo-img {
  width: 13.55rem;    /* 135.5px */
  height: 6.4rem;     /* 64px */
  object-fit: contain;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* Logo 标题：Figma font-bold 24px #1e2939，line-height 32px */
.logo-title {
  font-size: 2.4rem;    /* 24px */
  font-weight: 700;
  color: #1e2939;
  line-height: 3.2rem;  /* 32px */
  white-space: nowrap;
}

/* 分隔符：Figma color #99a1af */
.logo-divider {
  color: #99a1af;
  margin: 0 0.2rem;
}

/* --- 导航行：Figma height 68px（Navigation 36px + 上下各 16px 间距） --- */
.main-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  /* Figma 导航行高度：68px */
  height: 6.8rem;
}

/* 导航列表 */
.nav-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  gap: 0;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.nav-item {
  position: relative;
}

.nav-item--dropdown .nav-link {
  padding-right: 0.8rem;
}

/* 导航链接：Figma 14px #364153，padding 12px 左右，height 36px */
.nav-link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.4rem;          /* Figma 图标与文字间距 */
  padding: 0.8rem 1.2rem;  /* Figma: py-8px px-12px */
  height: 3.6rem;        /* Figma: 36px */
  font-size: 1.4rem;     /* 14px */
  font-weight: 400;
  color: #364153;        /* Figma 默认导航色 */
  line-height: 2rem;     /* 20px */
  white-space: nowrap;
  -webkit-transition: color 0.2s ease;
          transition: color 0.2s ease;
}

/* 激活状态：Figma color #e7000b，font-medium */
.nav-link.active {
  color: #e7000b;         /* Figma 主题红色 */
  font-weight: 500;
}

.nav-link:hover {
  color: #e7000b;
}

/* 下拉箭头图标：Figma 14×14px */
.nav-arrow {
  width: 1.4rem;      /* 14px */
  height: 1.4rem;     /* 14px */
  display: inline-block;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.nav-dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 16rem;
  background: #ffffff;
  border: 0.1rem solid rgba(0, 0, 0, 0.08);
  border-radius: 0.8rem;
  -webkit-box-shadow: 0 0.8rem 1.6rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.8rem 1.6rem rgba(0, 0, 0, 0.1);
  padding: 0.8rem 0;
  display: none;
  z-index: 1200;
}

.nav-item--dropdown:hover .nav-dropdown-menu {
  display: block;
}

.nav-dropdown-link {
  display: block;
  padding: 0.8rem 1.2rem;
  font-size: 1.4rem;
  line-height: 2rem;
  color: #364153;
  white-space: nowrap;
}

.nav-dropdown-link:hover {
  color: #e7000b;
  background: #fef2f2;
}

/* 移动端菜单按钮（PC端隐藏） */
.menu-toggle {
  display: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.5rem;
  padding: 0.5rem;
  cursor: pointer;
  background: none;
  border: none;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.menu-toggle span {
  display: block;
  width: 2.4rem;
  height: 0.2rem;
  background: #364153;
  -webkit-transition: all 0.3s ease;
          transition: all 0.3s ease;
}

/* 搜索框：Figma width 201px, height 34px, border #d1d5dc, border-radius 4px */
.search-form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 20.1rem;    /* 201px */
  height: 3.4rem;    /* 34px */
  -ms-flex-negative: 0;
      flex-shrink: 0;
  margin-left: 1.6rem;
}

.search-input {
  width: 100%;
  height: 100%;
  /* Figma: pl-12px pr-32px py-6px */
  padding: 0.6rem 3.2rem 0.6rem 1.2rem;
  border: 0.1rem solid #d1d5dc;  /* Figma border color */
  border-radius: 0.4rem;          /* Figma border-radius 4px */
  font-size: 1.4rem;
  color: rgba(10, 10, 10, 0.5);  /* Figma placeholder color */
  background: #ffffff;
  outline: none;
  font-family: inherit;
  -webkit-transition: border-color 0.2s ease;
          transition: border-color 0.2s ease;
}

.search-input:focus {
  border-color: #e7000b;
}

.search-input::-webkit-input-placeholder {
  color: rgba(10, 10, 10, 0.5);
}

.search-input::-moz-placeholder {
  color: rgba(10, 10, 10, 0.5);
}

.search-input::placeholder {
  color: rgba(10, 10, 10, 0.5);
}

.search-btn {
  position: absolute;
  right: 0.8rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0;
  cursor: pointer;
}

/* 搜索图标：Figma 16×16px */
.search-icon {
  width: 1.6rem;    /* 16px */
  height: 1.6rem;   /* 16px */
}


/* =====================================================================
   四、Main 主内容区
   ===================================================================== */

.site-main {
  /* 主内容区在 header 下方自然排列 */
}


/* =====================================================================
   五、Hero 横幅
   Figma: height 300px，背景图 + rgba(0,0,0,0.4) 遮罩
   H1: font-medium 36px white，line-height 40px
   副标题: 20px white，opacity 0.9，line-height 28px
   ===================================================================== */

.hero {
  position: relative;
  /* Figma Hero 高度：300px */
  height: 30rem;
  overflow: hidden;
}

/* 背景图：居中裁切，上下左右铺满容器 */
.hero-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  max-width: none;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  pointer-events: none;
}

/* 遮罩层：Figma rgba(0,0,0,0.4) 首页 */
.hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}

/* 出版信息页遮罩加深 */
.hero-overlay--dark {
  background: rgba(0, 0, 0, 0.5);
}

/* 联系我们页 Hero 渐变遮罩 */
.hero-overlay--contact {
  background: -webkit-linear-gradient(left, rgba(130, 24, 26, 0.8), rgba(193, 0, 7, 0.7));
  background: linear-gradient(to right, rgba(130, 24, 26, 0.8), rgba(193, 0, 7, 0.7));
}

.hero-content {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* Figma: gap 12px between title/line/subtitle */
  gap: 1.2rem;
  height: 100%;
}

.hero-line {
  width: 6.4rem;
  height: 0.4rem;
  background: #ffffff;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* H1：Figma font-medium 36px white，line-height 40px（首页） */
.hero-title {
  font-size: 3.6rem;    /* 36px */
  font-weight: 500;
  color: #ffffff;
  line-height: 4rem;    /* 40px */
  white-space: nowrap;
}

/* 出版信息页大标题 48px */
.hero-title--large {
  font-size: 4.8rem;
  line-height: 4.8rem;
}

/* 副标题：Figma 20px white，opacity 0.9，line-height 28px，letter-spacing 2px */
.hero-subtitle {
  font-size: 2rem;      /* 20px */
  font-weight: 400;
  color: #ffffff;
  line-height: 2.8rem;  /* 28px */
  opacity: 0.9;
  letter-spacing: 0.2rem;  /* 2px */
  white-space: nowrap;
}


/* =====================================================================
   六、页面内容容器（首页）
   Figma: padding-top 48px，sections 之间 gap 48px
   ===================================================================== */

.page-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4.8rem;
  padding-top: 4.8rem;
  padding-bottom: 4.8rem;
}

.section {
  width: 100%;
}

/* =====================================================================
   六·二、面包屑导航（出版信息页）
   Figma: bg #f9fafb, border-bottom rgba(0,0,0,0.1), height 45px
   ===================================================================== */

.breadcrumb-bar {
  background: #f9fafb;
  border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
  height: 4.5rem;    /* Figma: 45px */
}

.breadcrumb-inner {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.breadcrumb {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.8rem;       /* Figma: gap 8px */
  font-size: 1.4rem;
  color: #4a5565;
  line-height: 2rem;
}

.breadcrumb-item {
  color: #4a5565;
  -webkit-transition: color 0.2s ease;
          transition: color 0.2s ease;
}

.breadcrumb-item:hover {
  color: #e7000b;
}

.breadcrumb-item--current {
  color: #101828;
  font-weight: 500;
  cursor: default;
}

.breadcrumb-icon {
  width: 1.6rem;
  height: 1.6rem;
  margin-right: 0.4rem;
  vertical-align: middle;
  display: inline-block;
}

.breadcrumb-arrow {
  width: 1.6rem;
  height: 1.6rem;
  opacity: 0.6;
}

/* =====================================================================
   六·三、出版信息主内容区
   Figma: left 159px, width 1216px, 侧边栏 256px + 内容区 flex-1
   ===================================================================== */

.page-wrap {
  padding: 3.2rem 0 4.8rem;   /* Figma: 上下间距 */
}

.content-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 3.2rem;       /* Figma: gap 32px */
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

/* 左侧侧边栏：Figma 256px × 199px */
.sidebar {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 25.6rem;    /* 256px */
  background: #ffffff;
  border: 0.1rem solid rgba(0, 0, 0, 0.1);
  border-radius: 1rem;
  overflow: hidden;
}

/* 侧边栏红头：Figma bg #e7000b, 63px height */
.sidebar-header {
  background: #e7000b;
  color: #ffffff;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 2.7rem;
  padding: 1.2rem 1.8rem;   /* Figma: 18px left, 12px top */
  height: 6.3rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* 侧边栏导航 */
.sidebar-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.sidebar-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 1.2rem 1.6rem;   /* Figma: pl-16px pr-16px */
  font-size: 1.6rem;
  color: #364153;
  line-height: 2.4rem;
  border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
  -webkit-transition: background 0.2s ease, color 0.2s ease;
          transition: background 0.2s ease, color 0.2s ease;
}

.sidebar-link:last-child {
  border-bottom: none;
}

.sidebar-link:hover {
  background: #f9fafb;
  color: #e7000b;
}

/* 激活项：Figma bg #fef2f2, color #e7000b, border-left 4px #e7000b */
.sidebar-link.active {
  background: #fef2f2;
  color: #e7000b;
  border-left: 0.4rem solid #e7000b;
  font-weight: 500;
}

.sidebar-arrow {
  width: 1.8rem;
  height: 1.8rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* 右侧学术期刊面板：Figma 白底、圆角、阴影 */
.journals-panel {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
  background: #ffffff;
  border-radius: 1rem;
  -webkit-box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

/* 标题：Figma border-bottom 2px #e7000b */
.journals-title {
  font-size: 2.4rem;
  font-weight: 500;
  color: #101828;
  line-height: 3.2rem;
  padding: 3.2rem 3.2rem 0;
  border-bottom: 0.2rem solid #e7000b;
  margin-bottom: 0;
  padding-bottom: 1.4rem;   /* 与 border 对齐 */
}

.journals-body {
  padding: 3.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2.4rem;
}

.journals-intro {
  font-size: 1.6rem;
  color: #0a0a0a;
  line-height: 2.4rem;
}

.journals-subtitle {
  font-size: 1.8rem;
  font-weight: 500;
  color: #0a0a0a;
  line-height: 2.7rem;
  margin: 0;
}

.journals-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.6rem;
}

.journals-list li {
  font-size: 1.6rem;
  color: #0a0a0a;
  line-height: 2.4rem;
}

.journals-contact {
  font-size: 1.6rem;
  color: #0a0a0a;
  line-height: 2.4rem;
  margin: 0;
}

.journals-contact a {
  color: #0a0a0a;
}

.journals-contact a:hover {
  color: #e7000b;
  text-decoration: underline;
}

/* =====================================================================
   六·四、学会动态新闻列表（1:480）
   Figma: 列表项 128×96 缩略图 + 标题 18px + 日期 + 详情按钮 60×32
   ===================================================================== */

.news-list-panel {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
}

.news-list-cards {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.news-list-item {
  border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
}

.news-list-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.6rem;
  padding: 0 0 1.6rem;
  min-height: 14.5rem;
  -webkit-transition: background 0.2s ease;
          transition: background 0.2s ease;
}

.news-list-link:hover {
  background: #f9fafb;
}

.news-list-link--no-thumb {
  min-height: auto;
  padding: 1.2rem 0;
}

.news-list-thumb {
  width: 12.8rem;
  height: 9.6rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  border-radius: 0.4rem;
  object-fit: cover;
  background: #e8edf2;
}

.news-list-body {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
}

.news-list-title {
  font-size: 1.8rem;
  font-weight: 500;
  color: #101828;
  line-height: 2.8rem;
  margin-bottom: 0.8rem;
}

.news-list-meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.4rem;
  font-size: 1.4rem;
  color: #6a7282;
}

.news-list-date-icon {
  width: 1.4rem;
  height: 1.4rem;
}

.news-list-btn {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 6rem;
  height: 3.2rem;
  background: #e7000b;
  color: #ffffff;
  font-size: 1.4rem;
  border-radius: 0.4rem;
}

.news-pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.8rem;
  padding: 3.2rem 0 0;
  border-top: 0.1rem solid rgba(0, 0, 0, 0.1);
}

.news-page-btn,
.news-page-num {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-width: 3.4rem;
  height: 3rem;
  padding: 0 1rem;
  font-size: 1.4rem;
  font-weight: 500;
  border: 0.1rem solid rgba(0, 0, 0, 0.1);
  border-radius: 0.4rem;
  color: #0a0a0a;
}

.news-page-num.active {
  background: #e7000b;
  border-color: #e7000b;
  color: #ffffff;
}

.news-page-num:not(.active):hover {
  border-color: #e7000b;
  color: #e7000b;
}

/* =====================================================================
   六·五、学会动态文章详情（1:726）
   ===================================================================== */

.article-panel {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
  background: #ffffff;
  border-radius: 1rem;
  -webkit-box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
  padding: 3.2rem;
  overflow: hidden;
}

.article-header {
  padding-bottom: 1.6rem;
  border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
  margin-bottom: 1.6rem;
}

.article-title {
  font-size: 3rem;
  font-weight: 500;
  color: #101828;
  line-height: 1.25;
  margin-bottom: 1.6rem;
}

.article-meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  font-size: 1.4rem;
  color: #4a5565;
}

.article-meta-icon {
  width: 1.6rem;
  height: 1.6rem;
  margin-right: 0.4rem;
  vertical-align: middle;
}

.article-img {
  width: 100%;
  max-height: 48.6rem;
  object-fit: cover;
  border-radius: 1rem;
  margin-bottom: 3.2rem;
  background: #e8edf2;
}

.article-body {
  font-size: 1.6rem;
  color: #0a0a0a;
  line-height: 2.4rem;
}

.article-body p {
  margin-bottom: 1.6rem;
}

.article-body h3 {
  font-size: 1.8rem;
  font-weight: 500;
  margin: 2.4rem 0 1.2rem;
}

.article-body ul,
.article-body ol {
  margin: 0 0 1.6rem 2rem;
  list-style-position: outside;
}

.article-body li {
  margin-bottom: 0.4rem;
}

.article-credit {
  text-align: right;
  margin-top: 2.4rem;
  color: #6a7282;
}

.article-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 3.2rem;
  padding-top: 2.4rem;
  border-top: 0.1rem solid rgba(0, 0, 0, 0.1);
}

.article-nav-back {
  font-size: 1.4rem;
  color: #364153;
}

.article-nav-back:hover {
  color: #e7000b;
}

.article-nav-adjacent {
  font-size: 1.4rem;
  color: #364153;
}

.article-nav-adjacent a:hover {
  color: #e7000b;
}

.article-nav-sep {
  margin: 0 0.8rem;
  color: #d1d5dc;
}

/* =====================================================================
   六·六、会员服务页（1:922）- 资料下载卡片
   ===================================================================== */

.member-service-body {
  padding: 3.2rem;
}

.member-service-body .journals-subtitle {
  margin-top: 1.6rem;
  margin-bottom: 0.8rem;
}

.member-download-section {
  margin-top: 3.2rem;
  padding-top: 3.2rem;
  border-top: 0.1rem solid rgba(0, 0, 0, 0.1);
}

.member-download-title {
  padding-bottom: 1.4rem;
  border-bottom: 0.2rem solid #e7000b;
  margin-bottom: 2.4rem;
}

.download-cards {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border: 0.1rem solid rgba(0, 0, 0, 0.1);
  border-radius: 1rem;
  overflow: hidden;
}

.download-card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 1.2rem;
  border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
}

.download-card:last-child {
  border-bottom: none;
}

.download-card-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.2rem;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
}

.download-card-icon {
  width: 3.2rem;
  height: 3.2rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background: #fef2f2;
  border-radius: 0.4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.download-card-icon img {
  width: 1.6rem;
  height: 1.6rem;
}

.download-card-name {
  font-size: 1.4rem;
  font-weight: 500;
  color: #101828;
  margin-bottom: 0.4rem;
}

.download-card-desc {
  font-size: 1.2rem;
  color: #4a5565;
  margin-bottom: 0.4rem;
}

.download-card-meta {
  font-size: 1.2rem;
  color: #6a7282;
}

.download-card-btn {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 4.8rem;
  height: 2.8rem;
  background: #e7000b;
  color: #ffffff;
  font-size: 1.2rem;
  font-weight: 500;
  border-radius: 0.4rem;
}

.download-card-btn:hover {
  opacity: 0.9;
}

/* --- 左对齐标题（红色竖条 + 文字）--- */
.section-heading-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* Figma: gap 12px */
  gap: 1.2rem;
  /* Figma: height 32px */
  height: 3.2rem;
  margin-bottom: 2.4rem;   /* Figma: gap 24px before content */
}

/* 红色竖条：Figma bg #e7000b，4px × 32px */
.section-bar {
  display: block;
  width: 0.4rem;    /* 4px */
  height: 3.2rem;   /* 32px */
  background: #e7000b;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* 标题：Figma font-medium 24px #0a0a0a，line-height 32px */
.section-title-left {
  font-size: 2.4rem;    /* 24px */
  font-weight: 500;
  color: #0a0a0a;
  line-height: 3.2rem;
  white-space: nowrap;
}


/* =====================================================================
   七、Section 1：新闻动态 + 精选图片
   Figma: 左侧精选图 620px + 右侧新闻面板 572px，gap 24px，总高 439px
   ===================================================================== */

.news-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* Figma: gap = 644px(news left) - 620px(image width) = 24px */
  gap: 2.4rem;
  min-height: 43.9rem;   /* Figma: 439px */
}

/* 左侧精选媒体：Figma 620px × 439px，圆角 10px，阴影 */
.featured-media {
  position: relative;
  /* Figma: 精选图片宽度 620px */
  width: 62rem;
  height: 43.9rem;       /* Figma: 439px，与新闻区同高 */
  -ms-flex-negative: 0;
      flex-shrink: 0;
  border-radius: 1rem;   /* Figma: 10px */
  overflow: hidden;
  /* Figma 阴影：0px 10px 15px -3px rgba(0,0,0,0.1), 0px 4px 6px -4px rgba(0,0,0,0.1) */
  -webkit-box-shadow: 0 1rem 1.5rem -0.3rem rgba(0, 0, 0, 0.1),
                      0 0.4rem 0.6rem -0.4rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 1rem 1.5rem -0.3rem rgba(0, 0, 0, 0.1),
                      0 0.4rem 0.6rem -0.4rem rgba(0, 0, 0, 0.1);
}

.featured-slider {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.featured-track {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  -webkit-transition: -webkit-transform 0.45s ease;
  transition: -webkit-transform 0.45s ease;
  transition: transform 0.45s ease;
  transition: transform 0.45s ease, -webkit-transform 0.45s ease;
}

.featured-slide {
  min-width: 100%;
  height: 100%;
  position: relative;
  display: block;
  overflow: hidden;
}

.featured-slide--no-img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  height: 100%;
  background: linear-gradient(135deg, #1e2939 0%, #364153 100%);
}

.featured-slide--no-img .featured-caption {
  position: static;
  height: auto;
  background: transparent;
}

/* 精选图片：铺满轮播区域，object-cover */
.featured-img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  max-width: none;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  display: block;
}

/* 底部渐变文字遮罩：Figma top-[343px] h-[96px]，渐变 from rgba(0,0,0,0.7) to transparent */
.featured-caption {
  position: absolute;
  z-index: 2;
  bottom: 0;
  left: 0;
  right: 0;
  /* Figma: height 96px，padding-top 24px，padding-left 24px */
  height: 9.6rem;
  padding: 2.4rem 2.4rem 0;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0));
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.2rem;
}

/* 图片标题：Figma font-medium 18px white，line-height 28px */
.featured-caption-title {
  font-size: 1.8rem;    /* 18px */
  font-weight: 500;
  color: #ffffff;
  line-height: 2.8rem;  /* 28px */
  white-space: nowrap;
}

/* 图片副文字：Figma 14px white，opacity 0.9，line-height 20px */
.featured-caption-sub {
  font-size: 1.4rem;    /* 14px */
  font-weight: 400;
  color: #ffffff;
  line-height: 2rem;    /* 20px */
  opacity: 0.9;
  white-space: nowrap;
}

/* 轮播点：Figma top-[415px]（容器底部 16px 处），left 290px */
.slider-dots {
  position: absolute;
  z-index: 3;
  /* Figma: top 415px，容器 439px，dots 8px → bottom = 439-415-8=16px */
  bottom: 1.6rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* Figma: gap 8px */
  gap: 0.8rem;
}

/* 轮播点：Figma 8×8px，半圆 */
.slider-dot {
  display: block;
  width: 0.8rem;      /* 8px */
  height: 0.8rem;     /* 8px */
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);  /* Figma: rgba(255,255,255,0.5) */
}

/* 激活轮播点：Figma 纯白 */
.slider-dot.active {
  background: #ffffff;
}

/* 右侧新闻面板：Figma 572px × 439px，bg white，border，圆角 10px */
.news-panel {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
  border: 0.1rem solid rgba(0, 0, 0, 0.1);
  border-radius: 1rem;    /* Figma: 10px */
  overflow: hidden;
  background: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

/* 标签栏：Figma height 49px（48px 内容 + 1px border-bottom） */
.news-tabs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* 标签按钮：Figma height 48px，font-medium 16px */
.news-tab {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 4.8rem;        /* 48px */
  font-size: 1.6rem;     /* 16px */
  font-weight: 500;
  color: #4a5565;        /* Figma 默认标签色 */
  background: none;
  border: none;
  cursor: pointer;
  position: relative;
  -webkit-transition: all 0.2s ease;
          transition: all 0.2s ease;
}

/* 激活标签：Figma bg #fef2f2，color #e7000b，左侧红条 4px */
.news-tab.active {
  background: #fef2f2;
  color: #e7000b;
}

.news-tab.active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  /* Figma: 激活标签左侧红条 4px × 48px */
  width: 0.4rem;
  height: 100%;
  background: #e7000b;
}

/* 新闻列表：Figma padding 16px，gap 4px */
.news-list {
  padding: 1.6rem 1.6rem 1rem;    /* Figma: padding-left 16px，top-[65px] = tab 49px + gap 16px */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  /* Figma: gap 4px between items */
  gap: 0.4rem;
  overflow: hidden;
}

/* 新闻列表项：Figma height 36px，padding 8px，flex justify-between */
.news-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  /* Figma: padding 8px（pt-[8px] px-[8px]） */
  padding: 0.8rem;
  min-height: 3.6rem;    /* Figma: 36px */
  border-radius: 0.4rem;  /* Figma: 4px */
  gap: 0.8rem;
  -webkit-transition: background 0.15s ease;
          transition: background 0.15s ease;
}

.news-item:hover {
  background: #fef2f2;
}

/* 新闻链接：Figma 14px #364153，overflow ellipsis */
.news-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.2rem;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
  overflow: hidden;
  font-size: 1.4rem;    /* 14px */
  color: #364153;
  line-height: 2rem;    /* 20px */
  white-space: nowrap;
}

.news-link:hover {
  color: #e7000b;
}

/* 新闻项目符号：Figma color #99a1af */
.news-bullet {
  color: #99a1af;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-size: 1.4rem;
}

.news-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 新闻日期：Figma 12px #99a1af，line-height 16px */
.news-date {
  font-size: 1.2rem;    /* 12px */
  color: #99a1af;
  line-height: 1.6rem;  /* 16px */
  white-space: nowrap;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}


/* =====================================================================
   八、Section 2：学术交流
   Figma: 居中标题 + 两侧渐变线，4 列卡片网格 gap 24px，分页按钮
   ===================================================================== */

.academic-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  /* Figma: 内部 gap 32px */
  gap: 3.2rem;
}

/* 居中标题行：Figma height 32px，两侧 gradient 装饰线 */
.section-heading-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 3.2rem;    /* Figma: 32px */
}

/* 装饰线：Figma gradient from transparent to #d1d5dc */
.section-line {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 0.1rem;
}

/* 左侧渐变线：transparent → #d1d5dc（从右到左） */
.section-line:first-child {
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(#d1d5dc));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), #d1d5dc);
}

/* 右侧渐变线：#d1d5dc → transparent */
.section-line:last-child {
  background: -webkit-gradient(linear, left top, right top, from(#d1d5dc), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(to right, #d1d5dc, rgba(0, 0, 0, 0));
}

/* 居中标题：Figma font-medium 24px #1e2939，padding 32px */
.section-title-center {
  font-size: 2.4rem;    /* 24px */
  font-weight: 500;
  color: #1e2939;
  line-height: 3.2rem;
  /* Figma: padding 32px 两侧 */
  padding: 0 3.2rem;
  white-space: nowrap;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* 4 列卡片网格：Figma gap 24px */
.academic-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 2.4rem 1fr 2.4rem 1fr 2.4rem 1fr;
  grid-template-columns: repeat(4, 1fr);
  gap: 2.4rem;    /* Figma: 24px */
}

/* 学术卡片：Figma bg white，圆角 10px，阴影，flex 垂直排列 */
.academic-card {
  background: #ffffff;
  border-radius: 1rem;    /* Figma: 10px */
  overflow: hidden;
  /* Figma 阴影：0px 4px 6px -1px rgba(0,0,0,0.1), 0px 2px 4px -2px rgba(0,0,0,0.1) */
  -webkit-box-shadow: 0 0.4rem 0.6rem -0.1rem rgba(0, 0, 0, 0.1),
                      0 0.2rem 0.4rem -0.2rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.4rem 0.6rem -0.1rem rgba(0, 0, 0, 0.1),
                      0 0.2rem 0.4rem -0.2rem rgba(0, 0, 0, 0.1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-transition: -webkit-box-shadow 0.2s ease;
          transition: -webkit-box-shadow 0.2s ease;
          transition: box-shadow 0.2s ease;
          transition: box-shadow 0.2s ease, -webkit-box-shadow 0.2s ease;
}

.academic-card:hover {
  -webkit-box-shadow: 0 0.8rem 1.5rem -0.2rem rgba(0, 0, 0, 0.15);
          box-shadow: 0 0.8rem 1.5rem -0.2rem rgba(0, 0, 0, 0.15);
}

/* 卡片图片容器：Figma height 192px */
.card-img-wrap {
  width: 100%;
  height: 19.2rem;    /* Figma: 192px */
  overflow: hidden;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* 卡片图片：object-cover */
.card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  -webkit-transition: -webkit-transform 0.3s ease;
          transition: -webkit-transform 0.3s ease;
          transition: transform 0.3s ease;
          transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.academic-card:hover .card-img {
  -webkit-transform: scale(1.03);
          transform: scale(1.03);
}

/* 卡片内容区：Figma padding 16px，gap 12px */
.card-body {
  padding: 1.6rem;    /* Figma: 16px */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.2rem;        /* Figma: 12px */
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* 卡片标题：Figma font-medium 14px #1e2939，line-height 22.75px，最多 2 行 */
.card-title {
  font-size: 1.4rem;    /* 14px */
  font-weight: 500;
  color: #1e2939;
  /* Figma: line-height 22.75px */
  line-height: 1.625;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.card-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: auto;
}

/* 日期区域：Figma flex items-center，gap 4px，12px #6a7282 */
.card-date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.4rem;        /* Figma: 4px */
  font-size: 1.2rem;  /* 12px */
  color: #6a7282;
  line-height: 1.6rem;
}

/* 日期图标：Figma 14×14px */
.card-date-icon {
  width: 1.4rem;     /* 14px */
  height: 1.4rem;    /* 14px */
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* 详情链接：Figma font-medium 12px #e7000b */
.card-link {
  font-size: 1.2rem;    /* 12px */
  font-weight: 500;
  color: #e7000b;
  line-height: 1.6rem;
}

.card-link:hover {
  text-decoration: underline;
}

/* 分页控制：Figma height 38px，居中 */
.pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.8rem;       /* Figma: gap 8px */
  height: 3.8rem;    /* Figma: 38px */
}

/* 分页按钮：Figma 38×38px，bg white，border #d1d5dc，border-radius 4px */
.page-btn {
  width: 3.8rem;     /* 38px */
  height: 3.8rem;    /* 38px */
  border: 0.1rem solid #d1d5dc;
  border-radius: 0.4rem;   /* 4px */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: #ffffff;
  cursor: pointer;
  -webkit-transition: border-color 0.2s ease;
          transition: border-color 0.2s ease;
}

.page-btn:hover {
  border-color: #e7000b;
}

/* 上一页禁用状态：Figma opacity 0.5 */
.page-btn--prev {
  opacity: 0.5;
}

.page-btn img {
  width: 0.8rem;
  height: 1.2rem;
}

/* 分页点容器 */
.page-dots {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.8rem;      /* Figma: gap 8px */
}

/* 分页点：Figma 8×8px */
.page-dot {
  display: block;
  width: 0.8rem;    /* 8px */
  height: 0.8rem;   /* 8px */
  border-radius: 50%;
  background: #d1d5dc;   /* Figma: #d1d5dc */
}

/* 激活分页点：Figma #e7000b，宽 16px 变成药丸形 */
.page-dot.active {
  width: 1.6rem;         /* 16px */
  border-radius: 0.8rem;
  background: #e7000b;
}


/* =====================================================================
   九、Section 3：会员天地
   Figma: 左对齐标题，3 列等宽卡片，高度 234px
   ===================================================================== */

.member-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

/* 3 列等宽网格：Figma gap 24px */
.member-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 2.4rem 1fr 2.4rem 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.4rem;    /* Figma: 24px */
}

/* 会员卡片：Figma bg white，border rgba(0,0,0,0.1)，border-radius 10px，padding 24px */
.member-card {
  border: 0.1rem solid rgba(0, 0, 0, 0.1);
  border-radius: 1rem;    /* Figma: 10px */
  padding: 2.4rem;        /* Figma: 24px */
  background: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  /* Figma: height 234px（最小高度） */
  min-height: 23.4rem;
}

/* 第一张卡片：渐变背景
   Figma: linear-gradient(148.99deg, #fef2f2 0%, #fff 100%)，border #ffe2e2 */
.member-card--gradient {
  background: -webkit-gradient(linear, 295.27deg at 0% 0%, #fef2f2 0%, #ffffff 100%);
  background: linear-gradient(148.99deg, #fef2f2 0%, #ffffff 100%);
  border-color: #ffe2e2;
}

/* 会员服务图标：Figma 32×32px，top 24px left 24px */
.member-icon {
  width: 3.2rem;     /* 32px */
  height: 3.2rem;    /* 32px */
  /* Figma: top 24px，距离顶部 padding 对应，gap 约 12px before title */
  margin-bottom: 1.2rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* 卡片标题：Figma font-medium 18px #0a0a0a，line-height 27px */
.member-card-title {
  font-size: 1.8rem;    /* 18px */
  font-weight: 500;
  color: #0a0a0a;
  line-height: 2.7rem;  /* 27px */
  margin-bottom: 1.2rem;
}

/* 会员服务描述：Figma 14px #4a5565，line-height 20px */
.member-card-desc {
  font-size: 1.4rem;    /* 14px */
  color: #4a5565;
  line-height: 2rem;    /* 20px */
  margin-bottom: auto;
}

/* 会员入会须知列表：Figma 14px #364153，gap 8px，line-height 20px */
.member-card-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.8rem;      /* Figma: 8px */
  margin-bottom: auto;
}

.member-card-list li {
  font-size: 1.4rem;    /* 14px */
  color: #364153;
  line-height: 2rem;    /* 20px */
}

/* 卡片内链接：Figma 14px #e7000b，top 160px（距卡片顶），mt-auto 推到底部 */
.member-card-link {
  font-size: 1.4rem;    /* 14px */
  color: #e7000b;
  line-height: 2rem;    /* 20px */
  margin-top: 1.6rem;
  display: block;
}

.member-card-link:hover {
  text-decoration: underline;
}

/* 资料下载列表：Figma gap 8px */
.download-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.8rem;    /* Figma: 8px */
}

/* 下载列表项：Figma flex items-center，gap 8px */
.download-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.8rem;    /* Figma: 8px */
  height: 2rem;   /* Figma: 20px line-height */
}

/* 下载图标：Figma 14×14px */
.download-icon {
  width: 1.4rem;     /* 14px */
  height: 1.4rem;    /* 14px */
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

/* 下载链接：Figma 14px #1e2939，line-height 20px */
.download-link {
  font-size: 1.4rem;    /* 14px */
  color: #1e2939;
  line-height: 2rem;    /* 20px */
}

.download-link:hover {
  color: #e7000b;
  text-decoration: underline;
}


/* =====================================================================
   十、Section 4：联系我们
   Figma: 左对齐标题，灰底白边 box，2 列联系信息
   ===================================================================== */

.contact-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

/* 联系信息大框：Figma bg #f9fafb，border rgba(0,0,0,0.1)，圆角 10px，padding 33px */
.contact-box {
  background: #f9fafb;
  border: 0.1rem solid rgba(0, 0, 0, 0.1);
  border-radius: 1rem;    /* Figma: 10px */
  padding: 3.3rem;        /* Figma: 33px */
}

/* 2 列网格：Figma gap 32px */
.contact-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 3.2rem 1fr;
  grid-template-columns: repeat(2, 1fr);
  gap: 3.2rem;    /* Figma: 32px */
}

/* 联系列标题：Figma font-medium 18px #0a0a0a，line-height 27px */
.contact-col-title {
  font-size: 1.8rem;    /* 18px */
  font-weight: 500;
  color: #0a0a0a;
  line-height: 2.7rem;  /* 27px */
  margin-bottom: 1.6rem;
}

/* 联系信息列表：Figma 16px #364153，gap 12px，line-height 24px */
.contact-info-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.2rem;    /* Figma: 12px（联系方式），工作时间 8px */
}

.contact-info-list li {
  font-size: 1.6rem;    /* Figma: 16px */
  color: #364153;
  line-height: 2.4rem;  /* Figma: 24px */
}

/* 工作时间的列表 gap 改为 8px */
.contact-col:last-child .contact-info-list {
  gap: 0.8rem;
}

.contact-info-list strong {
  font-weight: 700;
  color: #364153;
}


/* =====================================================================
   十一、Section 5：友情链接
   Figma: 左对齐标题，4 列 logo 网格 gap 16px，分页指示点
   ===================================================================== */

.links-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.6rem;
}

/* 4 列网格：Figma gap 16px，height 130px */
.links-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1.6rem 1fr 1.6rem 1fr 1.6rem 1fr;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.6rem;    /* Figma: 16px */
}

.links-slider {
  width: 100%;
  overflow: hidden;
}

.links-track {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-transition: -webkit-transform 0.45s ease;
  transition: -webkit-transform 0.45s ease;
  transition: transform 0.45s ease;
  transition: transform 0.45s ease, -webkit-transform 0.45s ease;
}

.links-page {
  min-width: 100%;
}

/* 友链卡片：Figma bg white，border rgba(0,0,0,0.1)，圆角 10px，flex 垂直居中 */
.link-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.2rem;       /* Figma: 12px */
  /* Figma: py-17px px-1px */
  padding: 1.7rem 0.1rem;
  border: 0.1rem solid rgba(0, 0, 0, 0.1);
  border-radius: 1rem;    /* Figma: 10px */
  background: #ffffff;
  text-align: center;
  -webkit-transition: -webkit-box-shadow 0.2s ease;
          transition: -webkit-box-shadow 0.2s ease;
          transition: box-shadow 0.2s ease;
          transition: box-shadow 0.2s ease, -webkit-box-shadow 0.2s ease;
  min-height: 13rem;      /* Figma: height 130px */
}

.link-item:hover {
  -webkit-box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.1);
}

/* Logo 图片：Figma 64px wide，border-radius 4px，object-contain */
.link-logo {
  width: 6.4rem;        /* Figma: 64px */
  height: auto;
  max-height: 6.4rem;   /* Figma: ~64px */
  object-fit: contain;
  border-radius: 0.4rem;  /* Figma: 4px */
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* 机构名称：Figma 14px #364153，居中 */
.link-name {
  font-size: 1.4rem;    /* 14px */
  color: #364153;
  line-height: 2rem;    /* 20px */
  text-align: center;
}

/* 分页指示点：Figma 宽点 #e7000b + 圆点 #d1d5dc */
.links-pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.8rem;
}

.links-dot {
  display: block;
  height: 0.8rem;    /* Figma: 8px */
  width: 0.8rem;     /* Figma: 8px */
  border-radius: 50%;
  background: #d1d5dc;
}

/* 激活点：Figma #e7000b，width 24px，药丸形 */
.links-dot--active {
  width: 2.4rem;         /* Figma: 24px */
  border-radius: 0.8rem;
  background: #e7000b;
}


/* =====================================================================
   十二、Footer
   Figma: bg #1e2939，height 291px，3 列内容 + 版权行
   内容区 left 159px（127+32）width 1216px
   ===================================================================== */

.site-footer {
  background: #1e2939;
  /* Figma: footer 高度 291px，内容从 top 62.5px 开始 */
  padding-top: 6.25rem;   /* 62.5px */
  margin-top: 0;
}

.footer-inner {
  padding-bottom: 0;
}

/* 3 列内容行：Figma flex justify-between */
.footer-columns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 3.2rem;    /* Figma: gap between cols */
  padding-bottom: 3.2rem;
}

.footer-col {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* Footer 列标题：Figma font-medium 18px white，line-height 27px */
.footer-col-title {
  font-size: 1.8rem;    /* 18px */
  font-weight: 500;
  color: #ffffff;
  line-height: 2.7rem;  /* 27px */
  margin-bottom: 1.6rem;
}

/* Footer 文字段落：Figma 14px #d1d5dc，line-height 20px */
.footer-col p {
  font-size: 1.4rem;    /* 14px */
  color: #d1d5dc;
  line-height: 2rem;    /* 20px */
  margin-bottom: 0.8rem;
}

/* 快速链接列表：Figma gap 8px */
.footer-links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.8rem;
}

.footer-links a {
  font-size: 1.4rem;    /* 14px */
  color: #d1d5dc;
  line-height: 2rem;    /* 20px */
  -webkit-transition: color 0.2s ease;
          transition: color 0.2s ease;
}

.footer-links a:hover {
  color: #ffffff;
}

/* 版权行：Figma border-top #364153，padding-top 25px，文字居中 14px #99a1af */
.footer-copyright {
  border-top: 0.1rem solid #364153;
  padding-top: 2.5rem;   /* Figma: 25px */
  padding-bottom: 2.5rem;
  text-align: center;
}

.footer-copyright p {
  font-size: 1.4rem;    /* 14px */
  color: #99a1af;
  line-height: 2rem;    /* 20px */
}


/* =====================================================================
   十二·五、图片降级处理（无图片时的 CSS 占位颜色）
   确保在图片未加载时页面仍具有良好视觉效果（CLS=0）
   ===================================================================== */

/* Hero 背景降级：使用与学会主题匹配的深蓝渐变 */
.hero {
  background: linear-gradient(135deg, #1e2939 0%, #2d3e52 60%, #364153 100%);
}

/* 精选图片降级：深灰色 */
.featured-img {
  background: #c8d0d8;
}

/* 学术卡片图片降级：浅蓝灰色 */
.card-img {
  background: #e8edf2;
}

/* Logo 降级：失败时使用 SVG 占位 */
.logo-img {
  background: transparent;
}

/* 友链 Logo 降级 */
.link-logo {
  background: #f0f2f5;
  min-height: 4rem;
}

/* 会员服务图标降级：显示为红色色块 */
.member-icon {
  /* background: #e7000b; */
  border-radius: 0.4rem;
}

/* =====================================================================
   十三、响应式布局（移动端优先 Media Queries）
   断点：< 768px 移动端，768px~1023px 平板，≥ 1024px 桌面
   ===================================================================== */

/* ===== 移动端（< 768px）===== */
@media screen and (max-width: 767px) {

  html {
    font-size: 55%;   /* 略微缩小基准以适配小屏 */
  }

  /* Header */
  .header-logo-row {
    height: auto;
    padding: 1.4rem 0;
  }

  .logo-img {
    width: 8rem;
    height: 4rem;
  }

  .logo-title {
    font-size: 1.5rem;
  }

  /* 移动端显示菜单按钮，隐藏导航列表（收起状态） */
  .menu-toggle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    order: 1;
  }

  .main-nav {
    height: auto;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding: 1rem 0;
    gap: 1rem;
  }

  /* 搜索框在移动端全宽 */
  .search-form {
    width: 100%;
    order: 3;
    margin-left: 0;
  }

  /* 导航列表默认隐藏，点击 toggle 展开 */
  .nav-list {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    width: 100%;
    order: 4;
    gap: 0.2rem;
  }

  .nav-list.nav-open {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .nav-item {
    width: 100%;
  }

  .nav-dropdown-menu {
    position: static;
    display: block;
    min-width: 100%;
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
    padding: 0 0 0.4rem;
    background: #fafafa;
  }

  .nav-dropdown-link {
    padding: 0.8rem 2.4rem;
    border-bottom: 0.1rem solid rgba(0, 0, 0, 0.05);
  }

  .nav-link {
    width: 100%;
    padding: 1rem 1.2rem;
    height: auto;
    border-bottom: 0.1rem solid rgba(0, 0, 0, 0.05);
  }

  /* Hero */
  .hero {
    height: 20rem;
  }

  .hero-title {
    font-size: 2rem;
    white-space: normal;
    line-height: 1.3;
  }

  .hero-title--large {
    font-size: 2.4rem;
  }

  .hero-subtitle {
    font-size: 1.3rem;
    white-space: normal;
  }

  .page-container {
    gap: 3.2rem;
    padding-top: 2.4rem;
    padding-bottom: 2.4rem;
  }

  /* 出版信息页 */
  .page-wrap {
    padding: 2rem 0 3rem;
  }

  .journals-title {
    font-size: 2rem;
    padding: 2rem 2rem 0;
    padding-bottom: 1rem;
  }

  .journals-body {
    padding: 2rem;
    gap: 1.6rem;
  }

  .journals-intro,
  .journals-list li {
    font-size: 1.4rem;
  }

  /* 首页：新闻区、学术交流、会员天地等垂直堆叠 */
  .news-section {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    min-height: auto;
  }

  .featured-media {
    width: 100%;
    height: 22rem;
  }

  .featured-img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    max-width: none;
  }

  .featured-caption-title {
    font-size: 1.5rem;
    white-space: normal;
  }

  .featured-caption-sub {
    white-space: normal;
  }

  .news-panel {
    min-height: 30rem;
  }

  .academic-grid {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }

  .member-grid {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }

  .contact-grid {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .contact-box {
    padding: 2rem;
  }

  .contact-info-list li {
    font-size: 1.4rem;
  }

  .links-grid {
    -ms-grid-columns: 1fr 1.6rem 1fr;
    grid-template-columns: repeat(2, 1fr);
  }

  /* 出版信息 / 学会动态 / 会员服务：内容区垂直堆叠 */
  .content-wrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }

  .sidebar {
    width: 100%;
  }

  /* 新闻列表移动端 */
  .news-list-link {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    min-height: auto;
    padding-bottom: 1.2rem;
  }

  .news-list-thumb {
    width: 10rem;
    height: 7.5rem;
  }

  .news-list-title {
    font-size: 1.5rem;
  }

  .article-title {
    font-size: 2.2rem;
  }

  .breadcrumb {
    font-size: 1.2rem;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }

  /* Footer：垂直堆叠 */
  .footer-columns {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 2.4rem;
  }

  .site-footer {
    padding-top: 3.2rem;
  }

  /* 标题文字允许换行 */
  .section-title-left,
  .section-title-center {
    white-space: normal;
  }
}

/* ===== 平板端（768px ~ 1023px）===== */
@media screen and (min-width: 768px) and (max-width: 1023px) {

  /* Hero */
  .hero {
    height: 22rem;
  }

  .hero-title {
    font-size: 3.2rem;
    white-space: normal;
  }

  .hero-subtitle {
    font-size: 1.6rem;
    white-space: normal;
  }

  /* 首页：新闻区、学术交流、会员天地 平板竖排 */
  .news-section {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    min-height: auto;
  }

  .featured-media {
    width: 100%;
    height: 30rem;
  }

  .featured-img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    max-width: none;
  }

  .academic-grid {
    -ms-grid-columns: 1fr 2.4rem 1fr;
    grid-template-columns: repeat(2, 1fr);
  }

  .member-grid {
    -ms-grid-columns: 1fr 2.4rem 1fr;
    grid-template-columns: repeat(2, 1fr);
  }

  .links-grid {
    -ms-grid-columns: 1fr 1.6rem 1fr;
    grid-template-columns: repeat(2, 1fr);
  }

  /* 出版信息：平板侧边栏缩小 */
  .content-wrap {
    gap: 2rem;
  }

  .sidebar {
    width: 22rem;
  }

  /* Logo 标题缩小 */
  .logo-title {
    font-size: 2rem;
  }
}

/* ===== 大屏（≥ 1280px）精确还原 Figma 设计 ===== */
@media screen and (min-width: 1280px) {
  .academic-grid {
    -ms-grid-columns: 1fr 2.4rem 1fr 2.4rem 1fr 2.4rem 1fr;
    grid-template-columns: repeat(4, 1fr);
  }

  .member-grid {
    -ms-grid-columns: 1fr 2.4rem 1fr 2.4rem 1fr;
    grid-template-columns: repeat(3, 1fr);
  }

  .links-grid {
    -ms-grid-columns: 1fr 1.6rem 1fr 1.6rem 1fr 1.6rem 1fr;
    grid-template-columns: repeat(4, 1fr);
  }

  .sidebar {
    width: 25.6rem;
  }
}

/* =====================================================================
   联系我们页 (page-contact.html)
   ===================================================================== */

.page-wrap--contact {
  padding-top: 4.8rem;
  padding-bottom: 4.8rem;
}

.contact-section-title {
  font-size: 2.4rem;
  font-weight: 500;
  color: #1e2939;
  text-align: center;
  margin-bottom: 3.2rem;
}

.contact-cards {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-bottom: 4rem;
}

@media screen and (min-width: 600px) {
  .contact-cards {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (min-width: 992px) {
  .contact-cards {
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: repeat(4, 1fr);
  }
}

.contact-card {
  background: #ffffff;
  border-radius: 1rem;
  -webkit-box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
  padding: 2.4rem;
  text-align: center;
}

.contact-card-icon {
  width: 4.8rem;
  height: 4.8rem;
  margin: 0 auto 1.6rem;
}

.contact-card-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.contact-card-title {
  font-size: 1.6rem;
  font-weight: 500;
  color: #1e2939;
  margin-bottom: 0.8rem;
}

.contact-card-value {
  font-size: 1.4rem;
  color: #6a7282;
  line-height: 2rem;
}

.contact-map {
  border-radius: 1rem;
  overflow: hidden;
  -webkit-box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1);
  margin-bottom: 4rem;
  background: #eee;
}

.contact-map iframe {
  display: block;
  min-height: 50rem;
}

.contact-form-panel {
  background: #ffffff;
  border-radius: 1rem;
  -webkit-box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1), 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
  padding: 3.2rem;
  border: 0.1rem solid rgba(0, 0, 0, 0.06);
}

.contact-form-title {
  font-size: 2.4rem;
  font-weight: 500;
  color: #1e2939;
  text-align: center;
  margin-bottom: 0.8rem;
}

.contact-form-subtitle {
  font-size: 1.6rem;
  color: #6a7282;
  text-align: center;
  margin-bottom: 2.4rem;
}

.contact-form {
  max-width: 89.6rem;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2.4rem;
}

.contact-form-row {
  margin-bottom: 0;
}

.contact-form-row--three {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 2.4rem;
}

@media screen and (min-width: 768px) {
  .contact-form-row--three {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: repeat(3, 1fr);
  }
}

.contact-form-field {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.8rem;
}

.contact-form-label {
  font-size: 1.4rem;
  font-weight: 500;
  color: #364153;
}

.contact-form-label .required {
  color: #e7000b;
}

.contact-form-input,
.contact-form-textarea {
  width: 100%;
  border: 0.1rem solid #d1d5dc;
  border-radius: 1rem;
  padding: 1.2rem 1.6rem;
  font-size: 1.6rem;
  line-height: 1.5;
  font-family: inherit;
  color: #1e2939;
  background: #ffffff;
  outline: none;
  -webkit-transition: border-color 0.2s ease, -webkit-box-shadow 0.2s ease;
  transition: border-color 0.2s ease, -webkit-box-shadow 0.2s ease;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, -webkit-box-shadow 0.2s ease;
}

.contact-form-input:focus,
.contact-form-textarea:focus {
  border-color: #e7000b;
  -webkit-box-shadow: 0 0 0 0.3rem rgba(231, 0, 11, 0.12);
          box-shadow: 0 0 0 0.3rem rgba(231, 0, 11, 0.12);
}

.contact-form-input::placeholder,
.contact-form-textarea::placeholder {
  color: rgba(10, 10, 10, 0.5);
}

.contact-form-textarea {
  display: block;
  min-height: 21.8rem;
  resize: vertical;
}

.contact-form-actions {
  text-align: center;
}

.contact-form-submit {
  background: #e7000b;
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 500;
  padding: 1.2rem 3.6rem;
  border-radius: 1rem;
  -webkit-box-shadow: 0 0.4rem 0.6rem rgba(0, 0, 0, 0.1), 0 0.2rem 0.4rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.4rem 0.6rem rgba(0, 0, 0, 0.1), 0 0.2rem 0.4rem rgba(0, 0, 0, 0.1);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.8rem;
  margin-bottom: 1.6rem;
  cursor: pointer;
  border: none;
  -webkit-transition: background 0.2s ease, -webkit-transform 0.2s ease;
  transition: background 0.2s ease, -webkit-transform 0.2s ease;
  transition: background 0.2s ease, transform 0.2s ease;
  transition: background 0.2s ease, transform 0.2s ease, -webkit-transform 0.2s ease;
}

.contact-form-submit:hover {
  background: #c10007;
  -webkit-transform: translateY(-0.1rem);
          transform: translateY(-0.1rem);
}

.contact-form-submit-icon {
  width: 1.8rem;
  height: 1.8rem;
}

.contact-form-note {
  font-size: 1.4rem;
  color: #6a7282;
  line-height: 2rem;
}

@media screen and (max-width: 767px) {
  .contact-form-panel {
    padding: 2rem 1.6rem;
  }

  .contact-form-title {
    font-size: 2rem;
  }

  .contact-form-subtitle {
    font-size: 1.4rem;
    margin-bottom: 1.6rem;
  }

  .contact-form {
    gap: 1.6rem;
  }

  .contact-form-row--three {
    gap: 1.6rem;
  }

  .contact-form-input,
  .contact-form-textarea {
    font-size: 1.4rem;
    padding: 1rem 1.2rem;
    border-radius: 0.8rem;
  }

  .contact-form-textarea {
    min-height: 16rem;
  }

  .contact-form-submit {
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 1.2rem;
  }

  .contact-form-note {
    font-size: 1.2rem;
  }
}

/* 技术咨询页 (page-service-consulting.html) */
.consulting-body .consulting-qr {
  margin-top: 3rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 1.6rem;
}

.consulting-qr-box {
  position: relative;
  width: 22.8rem;
  height: 22.8rem;
}

.consulting-qr-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.consulting-qr-placeholder {
  display: none;
  width: 22.8rem;
  height: 22.8rem;
  background: #eee;
  border-radius: 0.8rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 1.2rem;
  color: #999;
}

.consulting-qr-tip {
  font-size: 1.4rem;
  color: #6a7282;
}

/* 搜索结果页 (page-search-results.html) */
.page-wrap--search {
  padding-top: 4.8rem;
  padding-bottom: 4.8rem;
}

.search-results-summary {
  font-size: 1.6rem;
  color: #1e2939;
  margin-bottom: 2.4rem;
}

.search-results-count {
  color: #e7000b;
  font-weight: 500;
}

.search-results-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.6rem;
}

.search-result-card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.6rem;
  padding: 2rem;
  background: #fff;
  border-radius: 1rem;
  -webkit-box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1);
  -webkit-transition: box-shadow 0.2s;
  -o-transition: box-shadow 0.2s;
  transition: box-shadow 0.2s;
}

.search-result-card:hover {
  -webkit-box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.12);
          box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.12);
}

.search-result-icon {
  width: 4.8rem;
  height: 4.8rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.search-result-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.search-result-icon-fallback {
  font-size: 2.4rem;
  display: none;
}

.search-result-body {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  min-width: 0;
}

.search-result-title {
  font-size: 1.6rem;
  font-weight: 500;
  color: #1e2939;
  margin-bottom: 0.4rem;
  line-height: 2.4rem;
}

.search-result-card:hover .search-result-title {
  color: #e7000b;
}

.search-result-meta {
  font-size: 1.4rem;
  color: #6a7282;
}
