/* HTML元素基本样式 */
html {
  box-sizing: border-box;        /* 定义盒模型计算方式，包含边框和内边距 */
  font-size: 100%;
  -ms-overflow-style: scrollbar; /* IE/Edge 滚动条样式显示 */
}

*, ::after, ::before {
  box-sizing: inherit;
}

/* 全局盒模型设置（避免其他元素干扰） */
* {
	margin: 0;
  padding: 0;
  box-sizing: border-box;
}


body {
  background-color: var(--nv-site-bg); /* CSS变量：站点背景色 */
  color: var(--nv-text-color);         /* CSS变量：文本颜色 */
  font-size: var(--bodyfontsize);      /* CSS变量：正文字体大小 */
  line-height: var(--bodylineheight);  /* CSS变量：正文行高 */
  letter-spacing: var(--bodyletterspacing); /* CSS变量：正文字符间距 */
  font-family: var(--bodyfontfamily), var(--nv-fallback-ff); /* CSS变量：正文字体族和备用字体 */
  text-transform: var(--bodytexttransform); /* CSS变量：正文文本转换 */
  font-weight: var(--bodyfontweight);  /* CSS变量：正文字体粗细 */
  overflow-x: hidden;
  direction: ltr;                      /* 文本方向：从左到右 */
  -webkit-font-smoothing: antialiased; /* WebKit字体平滑渲染 */
  -moz-osx-font-smoothing: grayscale; /* Firefox macOS字体平滑渲染 */
  margin: 0;
  padding: 0;
}

div {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-family: inherit;
  font-style: inherit;
  vertical-align: baseline;
}

span {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-family: inherit;
  font-style: inherit;
  vertical-align: baseline;
}

header {
  position: relative;
  display: block;
}

main {
  display: block;
  flex: 1 auto;
}

nav {
  display: block;
}

ul {
  list-style: none;
  padding-left: var(--listpad, 0);
  margin: 0;
  padding: 0;
}

li {
  display: block;
  position: relative;
  margin: 0;
}

a {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

a:hover {
  color: #FF1493;
}

img {
  height: auto;
  max-width: 100%;
  border: 0;
}

.img-shadow {
  filter: drop-shadow(0 5px 15px rgba(0,0,0,0.3));
}

figure {
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: 400;
  margin-bottom: 30px;
  font-family: var(--headingsfontfamily), var(--nv-fallback-ff);
}

p {
  margin-bottom: 30px;
  margin: 0;
}

hr {
  color: inherit;
  height: 0;
  border: 0;
  border-top: 2px solid;
  margin: 10px 0 20px;
  display: inline-block;
  width: 100%;
}

/* 自定义元素样式 */
.wrapper {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  position: relative;
  transition: all 0.3s cubic-bezier(0.79, 0.14, 0.15, 0.86); /* 自定义贝塞尔曲线动画过渡 */
}

.header {
  margin: 0 !important; 
  padding:0 !important;    /* padding:0：设置元素的内边距（padding）为0，消除内容与边框之间的默认空白。!important：强制该样式优先级最高，确保即使其他CSS规则试图覆盖内边距设置，此规则仍会生效。*/
  width: 100%;             /* 设置元素的宽度为父容器的100%。这使header元素会占据其父级容器的全部可用宽度，实现全屏宽效果。*/
  /* border: 1px solid green; /* 为元素添加一个1像素宽的红色实线边框。这可以直观显示header元素的边界范围，常用于调试布局。*/
}


/* 基础容器样式 - 响应式宽度控制 */
.site-width-setter {
  /* 宽度限制 */
  max-width: 1200px;     /* 最大宽度限制 */
  min-width: 320px;      /* 最小宽度限制（适配移动端） */
  width: 100%;           /* 默认宽度100% */
  
  /* 边界控制 */
  margin: 0 auto;         /* 水平居中 */
  padding: 0 0;           /* 左右内边距, 防止内容贴边 */
  box-sizing: border-box; /* 盒模型计算包含边框和内边距 */
  
  /* border: 1px solid green; */
}

.site-header{position:relative}

/* 移动端适配 - 在768px以下屏幕调整边距 */
@media (max-width: 768px) {
  .site-width-setter {
    /* text-align: left !important; 保持左对齐 */
    padding: 0 15px;             /* 移动端减少内边距 */
    /* border-radius: 4px;          移动端减小圆角 */
  }
}

/* 设置导航菜单文本左边距为0 */
.header-navigation-menu {
	margin-top: 20 !important;     /* 强制清除上外边距 */
  margin-bottom: 0 !important;
  margin-left: 0 !important;    /* 强制清除左外边距 */
  margin-right: 0 !important;
  
  padding-top: 5 !important;    /* 强制清除上内边距 */
  padding-bottom: 5 !important;
  padding-left: 0 !important;   /* 强制清除左内边距 */
  padding-right: 0 !important;
  
  text-align: left !important;  /* 确保文本左对齐 */
  /* border: 1px solid blue;        蓝色边框 */
}

.container {
  width: 100%;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 auto;
  max-width: var(--container); /* CSS变量：容器最大宽度 */
}

/* 确保菜单项垂直居中 */
.primary-menu-ul {
  display: flex;
  flex-wrap: wrap; /* 允许子元素换行显示（响应式关键特性） */
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
  /* gap: 10px;       直接设置项目间距 */
  
  font-size: 16px;
  font-weight: var(--h1fontweight);
}

.primary-menu-ul.menu-ul-gap-s {
	gap: 5px;        /* 直接设置项目间距 */
}

.primary-menu-ul.menu-ul-gap-l {
	gap: 20px;       /* 直接设置项目间距 */
}

.menu-item {
  display: inline-block; /* 确保水平排列 */
}

/* 第一个菜单项取消左边距（可选） */
.menu-item:first-child {
  margin-left: 0;
}

/* 最后一个菜单项取消右边距（可选） */
.menu-item:last-child {
  margin-right: 0;
}

.menu-item a {
  text-decoration: none;
  color: inherit; /* 或者设置为你想要的颜色 */
}

.site-menu-image {
	width: 100% !important;
  display: flex;           /* 启用弹性布局 */
  
  text-align: center;     /* 让内部内联/内联块元素居中 */
  margin: 0 auto;         /* 保持水平居中 */
}

.site-menu-image img {
	max-width: 800px;   /* 最大宽度 */
  max-height: 120px;  /* 最大高度 */
  width: auto;        /* 宽度自适应 */
  height: auto;       /* 高度自适应 */
  
  justify-content: center; /* 水平居中 */
  align-items: center;     /* 垂直居中（可选） */
  
  /* display: inline-block;  保持图片默认内联特性 */
  object-fit: contain;    /* 关键：保持比例完整显示 */
  display: block;         /* 确保块级元素特性 */
}

.align-center {
  display: block;      /* 确保块级元素特性 */
  text-align: center;  /* 保持垂直居中 */
  margin: 0 auto;      /* 保持水平居中 */
}

.align-full {
  width: 100vw;                   /* 宽度设为100%视口宽度（占满整个屏幕宽度） */
  max-width: 100vw;               /* 最大宽度限制为100%视口宽度（防止内容被拉伸超出屏幕） */
  margin-left: calc(50% - 50vw);  /* 动态计算左侧边距：通过50%父容器宽度减去50%视口宽度，实现水平居中效果 */
  margin-right: calc(50% - 50vw); /* 动态计算右侧边距：与左侧对称，确保元素在视口中完美居中 */
  padding: 0 7.5px;               /* 添加水平方向内边距（左右各7.5px），避免内容紧贴边缘 */
}

.row {
  display: flex;   /* 启用Flex弹性布局 */
  flex-wrap: wrap; /* 允许子元素换行显示（响应式关键特性） */
  margin: 0 -15px; /* 负边距技巧：抵消内部元素的左右边距通常配合子元素的padding: 0 15px使用实现内容区域100%宽度时的完美对齐 */
}

.row-wrapper {
  justify-content: space-between; /* 左右元素自动分离 */
  width: 100%;                    /* 确保容器占满父级宽度 */
  align-items: center;
  
  display: grid;   /* 启用CSS Grid网格布局 */
  grid-template-columns: auto auto; /* CSS网格：两列等宽自适应 auto auto 表示两列宽度根据内容自动调整 */
  min-height: var(--height, auto);  /* CSS变量：高度，默认auto */
  
  /* 新增：强制子元素单行显示 */
  white-space: nowrap;     /* 防止内容换行 */
  overflow: hidden;        /* 隐藏溢出内容（可选） */
  text-overflow: ellipsis; /* 溢出显示省略号（可选） */
  
  /* 强制清除所有默认间距 */
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  
  padding-top: 10 !important;
  padding-bottom: 10 !important;
}

.site-logo {
  align-items: center;  /* 垂直居中对齐内部内容 */
  display: flex;        /* 启用Flex布局：使内部元素（如文字/图标）可以灵活排列 */
  /* align-items: stretch; /* 关键：强制子元素高度拉伸至容器高度 */
}

.site-logo img {
  max-width: 32px;
  max-height: 25px;
  display: block;
  margin: 0 auto;
}

.site-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  
  font-size: 24px;
  font-weight: var(--h1fontweight);
  line-height: var(--bodylineheight);
  letter-spacing: var(--bodyletterspacing);
  text-transform: var(--texttransform, var(--bodytexttransform));
  margin: 0;
}

.site-login {
	align-items: center; /* 垂直居中对齐内部内容 */
  justify-content: flex-end;
  /* margin-left: auto; 右侧元素自动左移占据剩余空间 */
}

.site-login li {
	font-size: 14px;     /* CSS变量：按钮字体大小 */
  font-weight: normal; /* CSS变量：按钮字体粗细 */
  color: #000000;
}

/* 必须设置元素尺寸 */
.menu-button {
  display: inline-flex;   /* 或inline-block */
  align-items: center;    /* 垂直居中核心代码 */
  justify-content: center; /* 水平居中（可选） */
  text-align: center;
  border-radius: 4px;
  padding: auto;
  transition: all 0.3s ease;
  min-width: 60px;        /* 设置最小宽度 */
  height: 28px;           /* 设置高度 */
  box-sizing: border-box; /* 确保padding不影响总高度 */
  
  font-size: 14px;     /* CSS变量：按钮字体大小 */
  font-weight: normal;           /* CSS变量：按钮字体粗细 */
  color: #000000;
}

.menu-button:hover {
  background-color: #0056B3; /* 蓝色背景 */
  color: #FFFFFF !important;            /* 文字变白 */
}

.menu-button:hover a {
  color: #FFFFFF !important; /* 强制覆盖默认样式 */
  text-decoration: none;     /* 去除下划线 */
}

.nav-welcome {
  font-size: 14px !important;           /* CSS变量：按钮字体大小 */
  font-weight: normal !important;       /* CSS变量：按钮字体粗细 */
  color: #000000;
}

.nav-logout {
  background-color: #D3D3D3; /* 浅灰色背景 */
  border: 1px solid #CCCCCC; /* 灰色边框 */
}

/* 登录按钮样式 */
.nav-log {
  background-color: #FFFFFF; /* 白色背景 */
  border: 1px solid #CCCCCC; /* 蓝色边框 */
}

/* 邮箱按钮样式 */
.nav-reg {
  background-color: #D3D3D3; /* 浅灰色背景 */
  border: 1px solid #CCCCCC; /* 灰色边框 */
}

.site-block-cover {
  align-items: center;          /* 垂直居中对齐子元素（Flex布局特性） */
  background-position: 50%;     /* 背景图片居中显示 */
  box-sizing: border-box;       /* 盒模型计算包含边框和内边距 */
  display: flex;                /* 启用Flex弹性布局 */
  justify-content: center;      /* 水平居中对齐子元素 */
  min-height: 430px;            /* 最小高度430像素（保证基础展示区域） */
  overflow: hidden;             /* 隐藏内容溢出部分 */
  overflow: clip;               /* 现代裁剪属性（替代hidden，更严格的裁剪方式） */
  padding: 1em;                 /* 内边距1em（增加内容与边界的间距） */
  position: relative;           /* 相对定位（为子元素的绝对定位提供参考坐标） */
}

.site-block-cover-background {
  bottom: 0;                     /* 绝对定位：贴合父容器底部 */
  left: 0;                       /* 绝对定位：贴合父容器左侧 */
  right: 0;                      /* 绝对定位：贴合父容器右侧 */
  top: 0;                        /* 绝对定位：贴合父容器顶部 */
  position: absolute;            /* 绝对定位（覆盖父容器全区域） */
  z-index: 1;                    /* 堆叠层级1（位于内容层之上） */
}

.site-block-cover-image-background {
  border: none;                  /* 移除图片边框 */
  bottom: 0; left: 0; right: 0; top: 0; /* 绝对定位填满容器（四边贴合） */
  box-shadow: none;              /* 移除图片阴影 */
  height: 100%;                  /* 高度100%（填满父容器） */
  margin: 0;                     /* 清除外边距 */
  max-height: none;              /* 取消最大高度限制 */
  max-width: none;               /* 取消最大宽度限制 */
  object-fit: cover;             /* 图片覆盖容器（保持比例填充整个区域） */
  outline: none;                 /* 移除焦点轮廓 */
  padding: 0;                    /* 清除内边距 */
  position: absolute;            /* 绝对定位 */
  width: 100%;                   /* 宽度100%（填满父容器） */
  z-index: 0;                     /* 堆叠层级0（位于背景层最底层） */
}

.site-block-cover-inner-container {
  line-height: 1.5;              /* 控制行与行之间的垂直距离，值越大间距越宽。1.5倍字体大小，通用适配 */
  color: inherit;                /* 继承父级文字颜色 */
  width: 100%;                   /* 宽度100%（与父容器等宽） */
  z-index: 1;                    /* 堆叠层级1（与背景层同级，覆盖背景） */
}

.site-block-spacer {
  display: block;
  border: none;
  /* border: 1px solid blue; */ 
}

.text-align-center {
  text-align: center;
}

.text-align-left {
  text-align: left;
  /* text-align: left !important; 强制内部文本左对齐 */
}

.text-color-black {
  /* color: inherit; */
  /* color:#121212; */
  /* color: black !important; */
  color: black;
}

.site-block-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--style--block-gap, 0.5em); /* 块间距变量 */
}

.site-block-buttons.is-content-justification-center {
  justify-content: center;
}

.site-block-buttons.is-content-justification-left {
  justify-content: flex-start;
}

.site-block-button {
  display: inline-block;
  margin: 10px 0 !important;      /* 上下10px，左右保持0 */
  border-radius: 8px !important;             /* 设置30px圆角 */
}

.site-block-button:hover {
  background-color: #0056B3;
  transform: translateY(-2px);
}

.site-block-button:hover a {
  color: #FFFFFF !important;
  text-decoration: none;
}

.site-block-button-link {
  box-sizing: border-box;
  cursor: pointer;
  display: inline-block;
  text-align: center;
  word-break: break-word;
  box-shadow: none;
  padding: calc(0.667em + 2px) calc(1.333em + 2px);
  transition: all 0.3s ease;
  text-decoration: none;
}

.is-content-justification-center {
  justify-content: center;
}

.is-content-justification-left {
  justify-content: flex-start;
}

.is-layout-flex {
  display: flex;  /* 启用Flex弹性布局模式，核心作用：将容器转换为Flex布局容器，其直接子元素自动成为Flex项目（Item） */
}

.is-style-primary {
  /* --normal-button-color: #0056B3; */
  background: var(--primarybtnbg);                  /* CSS变量：主按钮背景色 */
  color: var(--primarybtncolor);                    /* CSS变量：主按钮文字颜色 */
  border-style: solid;
  border-color: var(--normal-button-color);                       /* 继承当前文字颜色 */
  fill: var(--normal-button-color);                               /* SVG填充颜色 */
  border-width: var(--primarybtnborderwidth, 0);    /* CSS变量：主按钮边框宽度 */
  /* border-radius: var(--primarybtnborderradius, 3px); CSS变量：主按钮圆角 */
  /* padding: var(--primarybtnpadding, 13px 15px);     /* CSS变量：主按钮内边距 */
  font-weight: var(--btnfontweight, 700);           /* CSS变量：按钮字体粗细 */
  font-size: var(--btnfs, var(--bodyfontsize));     /* CSS变量：按钮字体大小 */
  line-height: var(--btnlineheight, 1.6);           /* CSS变量：按钮行高 */
  letter-spacing: var(--btnletterspacing, var(--bodyletterspacing)); /* CSS变量：按钮字符间距 */
  text-transform: var(--btntexttransform, none);    /* CSS变量：按钮文本转换 */
}

.is-style-secondary {
  background-color: var(--secondarybtnbg); /* CSS变量：次按钮背景色 */
  color: var(--secondarybtncolor);         /* CSS变量：次按钮文字颜色 */
  border-style: solid;
  border-color: currentColor;              /* 继承当前文字颜色 */
  fill: currentColor;                      /* SVG填充颜色 */
  border-width: var(--secondarybtnborderwidth, 0);     /* CSS变量：次按钮边框宽度 */
  /* border-radius: var(--secondarybtnborderradius, 3px); CSS变量：次按钮圆角 */
  /* padding: var(--secondarybtnpadding, 7px 12px);       CSS变量：次按钮内边距 */
  font-weight: var(--btnfontweight, 700);              /* CSS变量：按钮字体粗细 */
  font-size: var(--btnfs, var(--bodyfontsize));        /* CSS变量：按钮字体大小 */
  line-height: var(--btnlineheight, 1.6);              /* CSS变量：按钮行高 */
  letter-spacing: var(--btnletterspacing);             /* CSS变量：按钮字符间距 */
  text-transform: var(--btntexttransform, none);       /* CSS变量：按钮文本转换 */
}

.site-block-columns {
  align-items: normal !important;
  box-sizing: border-box;
  display: flex;
  justify-content: center;     /* 水平居中所有子元素 */
  flex-wrap: wrap !important;  /* 允许换行（备用方案） */
  gap: var(--column-gap);      /* 使用CSS变量控制间距 */
}

.site-block-columns.vertically-aligned-center {
  align-items: center;         /* 当元素同时拥有这两个类时，垂直居中对齐子元素 */
  margin: 0 auto;
}

.site-block-column {
  /* flex: 1;                     关键：子元素按比例分配剩余空间 */
  
  /* 动态宽度计算 */
  flex: 1 1 calc((100% - (var(--column-count) - 1) * var(--column-gap)) / var(--column-count));
  /* flex: 0 0 auto; 第一个0：禁止元素扩展（flex-grow:0）, 第二个0：禁止元素收缩（flex-shrink:0），第三个auto：宽度完全由flex-basis决定 */
  /* flex: 0 0 auto;             关键修改：移除flex-grow:1的强制扩展属性 禁止自动扩展，完全遵循flex-basis设置 */
  min-width: 200px;              /* 最小宽度（防止内容溢出） */
  max-width: 100%;               /* 防止超出父容器 */
  
  flex-grow: 1;                /* 保持扩展能力, Flex布局属性：允许该列按比例扩展填充父容器剩余空间（实现等宽列的关键） */
  flex-shrink: 1;              /* 保持收缩能力 */
  overflow-wrap: break-word;   /* 长文本处理：当单词过长超出容器宽度时，在单词内强制换行（如长URL/自定义字符串） */
  word-break: break-word;      /* 增强换行控制：与overflow-wrap协同作用，确保任何文本（包括连续字母数字串）在必要时换行 */
}

.site-block-column h4{
	font-size:18px;
  font-weight:bold;
}

.site-block-column > h2 {
	margin-top: 12px;    /* 标题与上方内容间距 */
  margin-bottom: 12px; /* 标题与下方内容间距 */
}

.site-block-column > h3 {
	margin-top: 10px;    /* 标题与上方内容间距 */
  margin-bottom: 10px; /* 标题与下方内容间距 */
}

.site-block-column > h4 {
	margin-top: 8px;      /* 标题与上方内容间距 */
  margin-bottom: 8px;   /* 标题与下方内容间距 */
}

.site-list-normal {
	box-sizing: border-box;
  font-size:16px;
}

.site-list-normal li a{
	color: black;              /* 强制链接文字继承白色 */
  text-decoration: none;       /* 可选：移除链接下划线 */
}

.site-block-list {
  box-sizing: border-box;
  font-size:16px;
}

.site-block-list li a {
  color: #FFFFFF;              /* 强制链接文字继承白色 */
  text-decoration: none;       /* 可选：移除链接下划线 */
}

/* 可选：添加悬停效果增强交互性 */
.site-block-list li a:hover {
  animation: colorCycle 4s infinite alternate;
  color: var(--soft-color1);  /* 初始颜色 */
  text-decoration: none;      /* 悬停时不显示下划线 */
}

/* 定义颜色变换动画 */
@keyframes colorCycle {
  0% { color: var(--soft-color1); }   /* 浅灰绿 */
  33% { color: var(--soft-color2); }  /* 淡粉紫 */
  66% { color: var(--soft-color3); }  /* 柔雾蓝 */
  100% { color: var(--soft-color4); } /* 浅杏色 */
}

/* 定义柔和色系变量 */
:root {
  --soft-color1: #FF1493;  /* 深粉色 */
  --soft-color2: #32CD32;  /* 酸橙绿 */
  --soft-color3: #1E90FF;  /* 道奇蓝 */
  --soft-color4: #7B68EE;  /* 浅杏色 - 类似米白 */
}

.is-vertically-aligned-center {
  align-self: center;
}

/* 列数控制类（通过添加此类动态改变列数） */
.columns-2 { --column-count: 2; --column-gap: 80px; }
.columns-3 { --column-count: 3; --column-gap: 80px; }
.columns-4 { --column-count: 4; --column-gap: 20px; }
.columns-5 { --column-count: 5; --column-gap: 20px; }

/* 通过CSS变量动态控制列数（可选） */
/* 默认3列 */
:root {
  --column-gap: 80px;
  --column-count: 3;
}

/* 小屏幕（如平板）切换为2列 */
@media (max-width: 900px) {
  :root {
    --column-count: 2;
  }
}

/* 超小屏幕（如手机）切换为1列 */
@media (max-width: 600px) {
  :root {
    --column-count: 1;
  }
}

.set-div-rounded-corner {
  border-radius: 30px;        /* 设置30px圆角 */
  border: 1px solid #808080;  /* 灰色边框（#808080是标准灰色） */
  background-color: #FAFAFA;  /* 白色背景 象牙色 */
  padding: 40px 20px;         /* 可选：添加内边距让内容不贴边 */
}

.site-block-image {
  margin-bottom: 1em;
}

.site-block-image figure {
  margin: 0;
  padding: 0;
}

.site-block-image img {
  max-width: 100%;      /* 限制图片最大宽度不超过父容器宽度，防止图片溢出容器 */
  height: auto;         /* 保持图片原始宽高比例，避免强制拉伸导致变形 */
  object-fit: contain;  /* 确保图片完整显示（不裁剪），同时保持宽高比，容器内留白时自动居中 */
}

.site-block-image.is-style-rounded img {
  border-radius: 50%;
}

.site-block-image.set-image-rounded-corner img {
	border-radius: 30px;
}

.set-dark-background-color {
  background-color: var(--nv-dark-bg) !important;
}

.set-light-background-color {
  background-color: var(--nv-light-bg) !important;
}

.set-site-background-color {
  background-color: var(--nv-site-bg) !important;
}

.set-text-color-color {
  color: var(--nv-text-color) !important;
}

.set-text-dark-bg-color {
  color: var(--nv-text-dark-bg) !important;
}

.footor-content {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 2px 0px 2px 0px;
}

.column {
  flex: 1;
  text-align: left !important;
  padding: 10px 0px 10px 0px;
  box-sizing: border-box;
  min-width: 160px !important;
  border: none !important; /* 移除边框 */
}


/* 响应式考虑 - 如果需要在小屏幕上调整 */
@media (max-width: 480px) {
  .header {
    min-width: 100%;
  }
  
  .header--row:first-child {
    flex-direction: column;
    text-align: center;
  }
  
  .primary-menu-ul {
    flex-wrap: wrap;
    justify-content: center;
  }
  
  .menu-item {
    margin: 5px;
  }
}

.col {
  padding: 0 15px;
  margin: 0 auto;
  flex-grow: 1;
  max-width: 100%;
}

.cnrs-main {
  flex: 1 auto;
}

.nv-content-wrap {
  --listpad: 20px;
  --liststyle: disc;
}

.entry-content {
  word-break: break-word;
}


/* 从主题CSS文件中提取的body相关样式 */
:root {
  --container: 748px;
  --postwidth: 100%;
  --primarybtnbg: var(--nv-primary-accent);
  --secondarybtnbg: rgba(0, 0, 0, 0);
  --primarybtnhoverbg: var(--nv-secondary-accent);
  --secondarybtnhoverbg: var(--nv-dark-bg);
  --primarybtncolor: #010101;
  --secondarybtncolor: var(--nv-dark-bg);
  --primarybtnhovercolor: #FFFFFF;
  --secondarybtnhovercolor: var(--nv-text-dark-bg);
  --primarybtnborderradius: 0;
  --secondarybtnborderradius: 0;
  --secondarybtnborderwidth: 2px;
  --btnpadding: 12px 24px;
  --primarybtnpadding: 12px 24px;
  --secondarybtnpadding: 10px 22px;
  --btnfs: 14px;
  --btnlineheight: 1.6em;
  --bodyfontfamily: Arial, Helvetica, sans-serif;
  --bodyfontsize: 16px;
  --bodylineheight: 1.7em;
  --bodyletterspacing: 0px;
  --bodyfontweight: 400;
  --bodytexttransform: none;
  --h1fontsize: 39px;
  --h1fontweight: 600;
  --h1lineheight: 1.2em;
  --h1letterspacing: 0px;
  --h1texttransform: none;
  --h2fontsize: 28px;
  --h2fontweight: 600;
  --h2lineheight: 1.3em;
  --h2letterspacing: 0px;
  --h2texttransform: none;
  --h3fontsize: 20px;
  --h3fontweight: 600;
  --h3lineheight: 1.3em;
  --h3letterspacing: 0px;
  --h3texttransform: none;
  --h4fontsize: 16px;
  --h4fontweight: 600;
  --h4lineheight: 1.3em;
  --h4letterspacing: 0px;
  --h4texttransform: none;
  --h5fontsize: 14px;
  --h5fontweight: 600;
  --h5lineheight: 1.3em;
  --h5letterspacing: 0px;
  --h5texttransform: none;
  --h6fontsize: 14px;
  --h6fontweight: 600;
  --h6lineheight: 1.3em;
  --h6letterspacing: 0px;
  --h6texttransform: none;
  --formfieldborderwidth: 2px;
  --formfieldborderradius: 0;
  --formfieldbgcolor: var(--nv-site-bg);
  --formfieldbordercolor: var(--nv-light-bg);
  --formfieldcolor: var(--nv-text-color);
  --formfieldpadding: 10px 12px 10px 12px;
  --nv-primary-accent: #00BFFF; /* #FF69B4; */
  --nv-secondary-accent: #AB641D;
  --nv-site-bg: #FFFFFF;
  --nv-light-bg: #ededed;
  --nv-dark-bg: #14171c;
  --nv-text-color: #2b2b2b;
  --nv-text-dark-bg: #ffffff;
  --nv-c-1: #77b978;
  --nv-c-2: #f37262;
  --nv-fallback-ff: Arial, Helvetica, sans-serif;
}

/* 按类名称大小顺序排列的类样式 */

.current-menu-item > a:not([href*="#"]) {
  color: var(--activecolor);
}

.nav-menu-primary {
  position: relative;
}

/* 响应式媒体查询 */
@media (min-width: 576px) {
  :root {
    --container: 992px;
    --postwidth: 50%;
    --btnpadding: 12px 24px;
    --primarybtnpadding: 12px 24px;
    --secondarybtnpadding: 10px 22px;
    --btnfs: 14px;
    --btnlineheight: 1.6em;
    --bodyfontsize: 16px;
    --bodylineheight: 1.7em;
    --bodyletterspacing: 0px;
    --h1fontsize: 55px;
    --h1lineheight: 1.3em;
    --h1letterspacing: 0px;
    --h2fontsize: 34px;
    --h2lineheight: 1.3em;
    --h2letterspacing: 0px;
    --h3fontsize: 20px;
    --h3lineheight: 1.3em;
    --h3letterspacing: 0px;
    --h4fontsize: 16px;
    --h4lineheight: 1.3em;
    --h4letterspacing: 0px;
    --h5fontsize: 14px;
    --h5lineheight: 1.3em;
    --h5letterspacing: 0px;
    --h6fontsize: 14px;
    --h6lineheight: 1.3em;
    --h6letterspacing: 0px;
  }
  
  .hide-on-mobile {
    display: inline-block;
  }
}

@media (min-width: 769px) {
  .hide-on-mobile {
    display: inline-block;
  }
}

@media (min-width: 960px) {
  :root {
    --container: 1170px;
    --postwidth: 50%;
    --btnpadding: 12px 24px;
    --primarybtnpadding: 12px 24px;
    --secondarybtnpadding: 10px 22px;
    --btnfs: 16px;
    --btnlineheight: 1.6em;
    --bodyfontsize: 17px;
    --bodylineheight: 1.7em;
    --bodyletterspacing: 0px;
    --h1fontsize: 70px;
    --h1lineheight: 1.3em;
    --h1letterspacing: 0px;
    --h2fontsize: 46px;
    --h2lineheight: 1.3em;
    --h2letterspacing: 0px;
    --h3fontsize: 24px;
    --h3lineheight: 1.3em;
    --h3letterspacing: 0px;
    --h4fontsize: 20px;
    --h4lineheight: 1.3em;
    --h4letterspacing: 0px;
    --h5fontsize: 16px;
    --h5lineheight: 1.3em;
    --h5letterspacing: 0px;
    --h6fontsize: 16px;
    --h6lineheight: 1.3em;
    --h6letterspacing: 0px;
  }
  
  .hide-on-desktop {
    display: none;
  }
  
  .cnrs-main > .container .col {
    max-width: 70%;
  }
  
  .cnrs-main > .container > .row {
    flex-wrap: nowrap;
  }
}

@media (max-width: 576px) {
  .hide-on-mobile {
    display: none;
  }
}

@media (max-width: 959px) {
  .hide-on-tablet {
    display: none;
  }
}


.project-header {
  text-align: center;
  margin-bottom: 40px;
  padding: 20px;
}

.project-header h1 {
  font-size: 2.5rem;
  font-weight:bold;
  color: #2c3e50;
  margin-bottom: 10px;
  position: relative;
  display: inline-block;
}

.project-header h1::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 100px;
  height: 4px;
  background: linear-gradient(to right, #3498db, #8e44ad);
  border-radius: 2px;
}

.project-header p {
  font-size: 1.1rem;
  color: #7f8c8d;
  max-width: 600px;
  margin: 0 auto;
}


:root {
  --grid-columns: 4; /* 默认4列 */
}

.grid-container {
  display: grid;
  /* grid-template-columns: repeat(4, 1fr); */
  grid-template-columns: repeat(var(--grid-columns), 1fr); /* 使用变量控制列数 */
  gap: 30px;
}

.elevated-shadow {
	background: white;
  border-radius: 15px; /* 可选圆角 */
  box-shadow: 
    0 10px 30px rgba(0,0,0,0.15),  /* 主阴影 */
    0 4px 8px rgba(0,0,0,0.1),     /* 次阴影 */
    0 1px 3px rgba(0,0,0,0.05);     /* 微阴影 */
  overflow: hidden;
  transition: all 0.3s ease;
  height: 100%;
}

/* 悬停效果增强立体感 
.elevated-shadow:hover {
  transform: translateY(-10px);
  box-shadow: 
    0 15px 40px rgba(0,0,0,0.2),
    0 6px 12px rgba(0,0,0,0.15);
}
*/

/* 霓虹发光效果 */
.neon-glow {
  border-radius: 12px;
  box-shadow: 
    0 0 15px rgba(59,130,246,0.5),    /* 蓝色发光 */
    0 0 25px rgba(59,130,246,0.3),
    inset 0 0 10px rgba(255,255,255,0.7); /* 内发光 */
  background: #1e293b; /* 深色背景增强对比 */
}

/* 玻璃拟态效果 */
.glass-morphism {
  background: rgba(255,255,255,0.1);
  backdrop-filter: blur(10px);
  box-shadow: 
    0 8px 32px rgba(31,38,135,0.2),
    inset 0 0 20px rgba(255,255,255,0.2);
  border: 1px solid rgba(255,255,255,0.2);
}


.post-card {
  background: white;
  border-radius: 15px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  transition: all 0.4s ease;
  height: 100%;
}

.post-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.picture-box {
  position: relative;
  height: 200px;
}

.picture-img {
  height: 100%;
  width: 100%;
}

.thumbs-back {
  display: block;
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: center;
  transition: transform 0.5s ease;
}

.post-card:hover .thumbs-back {
  transform: scale(1.05);
}

.post-content {
  padding: 25px;
}

.grid-title {
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 15px;
  color: #2c3e50;
}

.grid-title a {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
}

.grid-title a:hover {
  color: #3498db;
}

.grid-info {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  font-size: 0.9rem;
  color: #7f8c8d;
  margin-bottom: 15px;
}

.grid-info span {
  display: flex;
  align-items: center;
  gap: 5px;
}

.grid-author {
  display: flex;
  align-items: center;
}

.meta-author-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 5px;
}

.meta-author-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.grid-inf-l {
  display: flex;
  gap: 15px;
}

.views, .date {
  display: flex;
  align-items: center;
  gap: 5px;
}

.grid-inf-l span {
  font-size: 0.9rem;
}

.g-cat {
  background: #3498db;
  color: white;
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 0.8rem;
  transition: background 0.3s ease;
}

.g-cat:hover {
  background: #0056B3;
}

.g-cat:hover a {
  color: #FFFFFF !important;
}

/* 响应式设计 */
@media (max-width: 1200px) {
  .grid-container {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 900px) {
  .grid-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .grid-container {
    grid-template-columns: 1fr;
  }
  
  .project-header h1 {
    font-size: 2rem;
  }
}



/* collections css */

/* 基础重置和变量定义 */
:root {
  --be-white: #fff;
  --be-body: #333;
  --be-bg-body: #f5f5f5;
  --be-bg-white: #fff;
  --be-border: #ddd;
  --be-bg-blue: #4d8cb8;
  --be-bg-ht: #c40000;
  --be-grey-9: #999;
  --be-shadow: rgba(0, 0, 0, 0.1);
}

/*
body {
  font-family: "Microsoft YaHei", Helvetica, Arial, sans-serif;
  color: var(--be-body);
  line-height: 1.6;
  background: var(--be-bg-body);
}
*/

.clear {
  clear: both;
}

/* 分类标题区域 */
.acx-cat-title {
  text-align: center;
  margin: 20px 0;
}

.group-title {
  display: block;
  margin: 0 auto;
  max-width: 800px;
}

.sites-cat-name {
  position: relative;
  font-size: 2.4rem;
  margin: 10px 0;
  text-align: center;
}

.sites-cat-name a {
  color: inherit;
  text-decoration: none;
}

.sites-cat-name a:hover {
  color: var(--be-bg-blue);
}

.sites-cat-des {
  color: var(--be-grey-9);
  text-align: center;
  margin: 5px 0;
}

/* 网站容器 */
.sites-container {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -5px;
}

/* 网站区域 */
.sites-area {
  position: relative;              /* 相对定位：为内部绝对定位元素（如装饰元素/工具提示）提供定位基准 */
  float: left;                     /* 左浮动布局：实现水平排列的卡片布局（需配合父容器清除浮动） */
  line-height: 150%;               /* 行高设置：150%的行高增加文本垂直间距，提升长文本阅读体验 */
  padding: 0 5px;                  /* 内边距设置：左右5px内边距增加卡片内边距，上下0防止垂直方向空间浪费 */
  transition-duration: .5s;        /* 过渡动画时长：设置0.5秒的过渡持续时间，用于平滑属性变化（如悬停效果、尺寸变化等） */
  width: 25%;                      /* 宽度设置：25%宽度配合父容器实现四列等宽布局（sites-4表示四列布局系统） */
}

@media screen and (max-width: 900px) {
  .sites-area {
    width: 33.33333333333333%;
  }
}

@media screen and (max-width: 768px) {
  .sites-area {
    width: 50%;
  }
}

/* 网站项目 */
.sites-post {
  position: relative;
  background: var(--be-bg-white);
  overflow: hidden;
  z-index: 0;
  margin: 0 0 10px;
  padding: 10px 15px;
  border-radius: 8px;
  box-shadow: 0 0 0 1px var(--be-shadow);
}

.sites-to-url {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

/* 网站图标 */
.sites-ico {
  text-align: left;
  margin: 5px 0;
  transition: all .5s;
  display:flex;
  align-items:center;
  gap:10px;
}

.sites-img {
  max-width: 20px;
  height: auto;
  vertical-align: middle;
}

/* 网站标题 */
.sites-title {
  position: relative;        /* 相对定位：为子元素绝对定位提供参考上下文 */
  white-space: nowrap;       /* 禁止文本换行：保持标题在单行显示 */
  word-wrap: normal;         /* 单词换行控制：此处设为normal表示按默认规则处理长单词（与nowrap配合时实际不会换行） */
  text-overflow: ellipsis;   /* 文本溢出处理：当内容超出容器时显示省略号 */
  overflow: hidden;          /* 溢出内容处理：隐藏超出容器边界的部分（与text-overflow配合实现截断效果） */
  display: block;            /* 块级显示：使元素占据整行宽度 */
  z-index: 2;                /* 堆叠层级：确保标题显示在可能重叠元素的上层 */
  margin: 4px 0 0;
  font-size: 16px;
}

.sites-title a {
  color: inherit;            /* 颜色继承：使用父容器.sites-title的文字颜色 */
  text-decoration: none;     /* 移除下划线：禁用链接默认的下划线装饰 */
}

.sites-title a:hover {
  color: var(--be-bg-blue);  /* 悬停时文字颜色：使用CSS变量--be-bg-blue定义的蓝色 */
}

/* 网站描述 */
.sites-excerpt {
  position: relative;
  font-size: 12px;
  color: var(--be-grey-9);
  white-space: nowrap;
  word-wrap: normal;
  text-overflow: ellipsis;
  overflow: hidden;
  opacity: 1;
  z-index: 2;
  margin: 5px 0;
}

/* 网站链接按钮区域 */
.sites-link-but {
  position: relative;
  z-index: 2;
  margin: 8px 0 0;
}

.sites-link {
  float: left;
}

.sites-more {
  float: right;
}

.sites-link a,
.sites-more a {
  color: inherit;
  text-decoration: none;
}

.be, .ri {
  /* 占位符样式，实际项目中应替换为具体图标字体 */
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: #eee;
  border-radius: 3px;
}

/* 响应式设计 */
@media screen and (max-width: 1200px) {
  .sites-cat-name {
    font-size: 2rem;
  }
}

@media screen and (max-width: 768px) {
  .acx-cat-title {
    margin: 15px 0;
  }
  
  .sites-cat-name {
    font-size: 1.8rem;
  }
  
  .sites-container {
    margin: 0 -3px;
  }
  
  .sites-area {
    padding: 0 3px;
  }
  
  .sites-post {
    padding: 8px 12px;
    margin: 0 0 8px;
  }
  
  .sites-title {
    font-size: 1rem;
  }
  
  .sites-excerpt {
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 480px) {
  .sites-area {
    width: 100%;
  }
  
  .sites-cat-name {
    font-size: 1.6rem;
  }
}