/* ======================================
   1. 全局变量与基础配置
   ====================================== */
/* @viewport {
  width: device-width;
  initial-scale: 1;
  user-scalable: no;
} */

:root {
  --theme-color: #1C1B1A;
  --linear-gradient: #1C1B1A;
  --title-color: #1F1F1F;
  --background-color: #F7F8FA;

  /* 语义化缓动曲线 */
  --ease-standard: cubic-bezier(.4, 0, .2, 1);         /* 慢快慢-标准 */
  --ease-slow-start: cubic-bezier(.39, .575, .565, 1); /* 匀速慢起 */
  --ease-fast-end: cubic-bezier(.25, .74, .22, .99);   /* 快慢收尾 */
  /* --ease-pic-hover: cubic-bezier(.76, 0, .24, 1); */
  --ease-pic-hover: cubic-bezier(0.17, 0.35, 0.35, 1); /* 图片切换专用 */
  --ease-modal: cubic-bezier(.165, .84, .44, 1);       /* 弹窗动画专用 */
  --ease-button: cubic-bezier(0.22, 0.72, 0.36, 1);    /* 按钮动画专用 */

  /* 文字色阶 */
  --text-main: #333;
  --text-secondary: #686868;
  --text-placeholder: #999999;

  /* 图片滤镜 */
  --imgwhite: brightness(0) invert(1);
  --imgblack: brightness(0);

  /* 字体族 */
  /* --font-cn: "HarmonyOS_SansSC", sans-serif; */
  --font-en: 'Inter', sans-serif;

  /* 第三方组件字号变量 */
  --font-swal: 0.16rem;
}

/* ======================================
   2. 全局重置
   ====================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  outline: none !important;
}

/* 硬件加速通用类 */
.gpu {
  will-change: transform;
  transform: translateZ(0);
}

[v-cloak] {
  display: none;
}
#app[v-cloak] {
  display: none;
}

/* 选中文字样式 */
::selection {
  background: #1c509c;
  color: #fff;
}
::-moz-selection {
  background: #1c509c;
  color: #fff;
}

/* ======================================
   3. 字体定义
   ====================================== */
/* 英文可变字体 */
@font-face {
  font-family: 'Inter';
  src: url("../fonts/Inter-VariableFont_opsz,wght.ttf") format("truetype");
  font-weight: 100 900;
  font-display: swap;
  font-style: normal;
}

/* ======================================
   4. html / body 基础布局 & Lenis 适配
   ====================================== */
html {
  width: 100%;
  font-size: 5.20833vw;
  scroll-behavior: initial;
  overflow-x: hidden;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

html.act {
  overflow: hidden;
  width: 100%;
  height: 100vh;
}

/* Lenis 平滑滚动官方适配 */
html.lenis {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto;
}

/* 滚动容器阻止滚动穿透 */
[data-lenis-prevent],
[data-lenis-prevent-wheel] {
  overscroll-behavior: contain;
  will-change: transform;
  transform: translateZ(0);
}

body {
  position: relative;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  width: 100%;
  margin: 0 auto;
  padding: 0;
  color: var(--text-main);
  font-family: var(--font-en);
  font-weight: 400;
  font-size: 0.14rem;
  line-height: 1.5;
  background: #fff;
  word-break: normal;
  overflow-wrap: anywhere;
  white-space: normal;
}

/* ======================================
   5. 通用基础元素样式
   ====================================== */
/* 字重工具类 */
.fw900 { font-weight: 900; }
.fw700 { font-weight: 700; }
.fw600 { font-weight: 600; }
.fw500 { font-weight: 500; }
.fw400 { font-weight: 400; }
.fw300 { font-weight: 300; }
.fw200 { font-weight: 200; }

/* 列表清除默认样式 */
.ul,
.ul .li,
.ol .li,
tr td,
.dl,
.dd {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

/* 清除浮动 */
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}
.clearfix {
  overflow: hidden;
}

/* 链接样式 */
a {
  display: inline-block;
  text-decoration: none;
  color: var(--text-main);
  transition: color .4s var(--ease-standard);
}
a[href]{
  cursor: pointer;
}
a[href=""] {
  cursor: default;
  pointer-events: none;
}

/* 表单元素统一清除 */
input,
textarea,
select {
  border-radius: 0;
  -webkit-border-radius: 0;
  outline: none;
  font-family: var(--font-en);
}

textarea,
select {
  color: var(--text-secondary);
  font-size: 0.14rem;
  width: 100%;
}
textarea {
  resize: none;
  padding: 0;
  border: 0;
}

input {
  padding: 0;
  border: 0;
}
input[type="submit"] {
  background-color: transparent;
  cursor: pointer;
}
input[type="button"],
input[type="submit"],
input[type="reset"],
select {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}
select::-ms-expand {
  display: none;
}

input[type=text]:focus::placeholder {
  opacity: 0;
}

/* 按钮基础清除 */
button {
  background-color: transparent;
  cursor: pointer;
  border: none;
  outline: none;
  font-family: var(--font-en);
}

/* 图片、视频通用样式 */
video,
img {
  border: none;
  max-width: 100%;
  display: block;
}
.pic100 { width: 100%; }
.pic_cover { width: 100%; height: 100%; object-fit: cover; }
.pic_contain { width: 100%; height: 100%; object-fit: contain; }
.pic_fill { width: 100%; height: 100%; object-fit: fill; }
img[src=""] { opacity: 0; }

/* 斜体清除 */
i {
  font-style: normal;
}

/* 富文本编辑框重置，限制作用域，避免全局污染 */
.edit :where(*) {
  all: revert;
}
.edit p,
.edit h1, .edit h2, .edit h3, .edit h4, .edit h5, .edit h6,
.edit ul, .edit ol,
.edit blockquote,
.edit pre,
.edit figure,
.edit hr {
  margin-block: 0;
}
.edit img,
.edit video {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

/* 第三方分享组件样式清除 */
.social-share a {
  margin: 0;
}
.social-share .social-share-icon {
  width: 100%;
  height: 100%;
  border: none;
  background-color: transparent !important;
}
.social-share .social-share-icon::before {
  display: none;
}

/* ======================================
   6. 文本工具类、多行省略
   ====================================== */
/* 单行/多行文本省略 */
.t_line1 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  display: box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  box-orient: vertical;
}
.t_line2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  display: box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  box-orient: vertical;
}
.t_line3 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  display: box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  box-orient: vertical;
}
.t_line4 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  display: box;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  -webkit-box-orient: vertical;
  box-orient: vertical;
}
.t_line5 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  display: box;
  -webkit-line-clamp: 5;
  line-clamp: 5;
  -webkit-box-orient: vertical;
  box-orient: vertical;
}

/* 占位符颜色统一 */
.place::-webkit-input-placeholder { color: var(--text-placeholder); }
.place:-moz-placeholder { color: var(--text-placeholder); }
.place::-moz-placeholder { color: var(--text-placeholder); }
.place:-ms-input-placeholder { color: var(--text-placeholder); }

/* 文字对齐、排版工具类 */
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-justif { text-align: justify; }
.text-nowrap { white-space: nowrap; }
.text-lowercase { text-transform: lowercase; }
.text-uppercase { text-transform: uppercase; }
.text-capitalize { text-transform: capitalize; }
.text-bold { font-weight: bold; }

/* ======================================
   7. 图片hover切换
   ====================================== */
.imgTwo {
  position: relative;
}
.imgTwo img {
  transition: opacity .4s var(--ease-pic-hover);
}
.imgTwo img:nth-child(2) {
  position: absolute;
  inset: 0;
  margin: auto;
  opacity: 0;
}
.imghover:hover .imgTwo img:nth-child(1) {
  opacity: 0;
}
.imghover:hover .imgTwo img:nth-child(2) {
  opacity: 1;
}
.imgTwohover:hover img:nth-child(1) {
  opacity: 0;
}
.imgTwohover:hover img:nth-child(2) {
  opacity: 1;
}

/* ======================================
   8. 滚动条公共样式
   ====================================== */
.scroll1::-webkit-scrollbar,
.scroll2::-webkit-scrollbar {
  width: 4px;
  height: 1px;
}
.scroll1::-webkit-scrollbar-thumb,
.scroll2::-webkit-scrollbar-thumb {
  background: var(--linear-gradient);
  border-radius: 4px;
}
.scroll1::-webkit-scrollbar-track {
  background: transparent;
}
.scroll2::-webkit-scrollbar-track {
  background: #D9D9D9;
}

.scroll3::-webkit-scrollbar {
  width: 3px;
  height: 1px;
}
.scroll3::-webkit-scrollbar-thumb{
  background: #fff;
  border-radius: 3px;
}
.scroll3::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.2);
}

/* ======================================
   9. 全局过渡类
   ====================================== */
.alltime,
.alltime::before,
.alltime::after {
  transition: color .4s var(--ease-standard),
              opacity .4s var(--ease-standard),
              transform .4s var(--ease-standard);
}

/* ======================================
   10. 定位、背景简易工具类
   ====================================== */
.pr { position: relative; }
.pa { position: absolute; }
.back-cover { background-size: cover; }
.back-contain { background-size: contain; }

/* ======================================
   11. Swiper 轮播组件样式
   ====================================== */
.swiper-button-disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.swiper-button-lock {
  opacity: 0;
  pointer-events: none;
}

/* ======================================
   12. SweetAlert2 弹窗统一字号变量管理
   ====================================== */
div:where(.swal2-container) div:where(.swal2-popup) {
  font-size: var(--font-swal);
}

/* ======================================
   13. 全局禁用过渡动画工具类
   ====================================== */
.disable-transitions * {
  transition: none !important;
  animation: none !important;
}

/* ======================================
   14. 全局弹窗 zz_tanchuang 样式
   ====================================== */
.zz_tanchuang {
  display: table;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  transform: scale(0);
  -webkit-transform: scale(0);
  width: 100%;
  z-index: 999;
}
.zz_tanchuang.one {
  animation: unfoldIn 1s var(--ease-modal) forwards;
  -webkit-animation: unfoldIn 1s var(--ease-modal) forwards;
  transform: scaleY(.01) scaleX(0);
  -webkit-transform: scaleY(.01) scaleX(0);
}
.zz_tanchuang .tbox {
  background: #000c;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
.zz_tanchuang .tbox .modal {
  border-radius: 5px;
  box-sizing: border-box;
  display: block;
  margin: 0 auto;
  max-height: 90%;
  max-width: 1200px;
  padding: 0;
  position: relative;
  width: 80%;
}
.zz_tanchuang.one .tbox .modal {
  animation: zoomIn .5s var(--ease-modal) .8s forwards;
  -webkit-animation: zoomIn .5s var(--ease-modal) .8s forwards;
  transform: scale(0);
  -webkit-transform: scale(0);
}
.zz_tanchuang .tbox .modal .out {
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8.824' height='8.824' viewBox='0 0 8.824 8.824'%3E%3Cg data-name='组 21240'%3E%3Cg fill='none' stroke='%23fff' data-name='组 20569'%3E%3Cpath d='M.353.353 8.47 8.47' data-name='直线 13431'/%3E%3Cpath d='M8.47.353.355 8.47' data-name='直线 13432'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") 50% no-repeat;
  background-size: 20px;
  border-radius: 50%;
  color: #000;
  cursor: pointer;
  font-size: 30px;
  height: 40px;
  line-height: 40px;
  opacity: .75;
  position: absolute;
  right: -55px;
  text-align: center;
  top: -40px;
  transition: all .5s;
  width: 40px;
}
.zz_tanchuang .tbox .modal .out:hover {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
}
.zz_tanchuang .tbox .modal .img {
  margin: 0 auto;
  max-width: 1200px;
  width: 100%;
}
.zz_tanchuang .tbox .modal .img video {
  background-color: #000;
  display: block;
  max-height: 67vh;
  max-width: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
}

/* ======================================
   15. 弹窗关键帧动画
   ====================================== */
@keyframes unfoldIn {
  0% {
    transform: scaleY(.005) scaleX(0);
  }
  50% {
    transform: scaleY(.005) scaleX(1);
  }
  to {
    transform: scaleY(1) scaleX(1);
  }
}
@keyframes zoomIn {
  0% {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}
@keyframes zoomOut {
  0% {
    transform: scale(1);
  }
  to {
    transform: scale(0);
  }
}
@keyframes unfoldOut {
  0% {
    transform: scaleY(1) scaleX(1);
  }
  50% {
    transform: scaleY(.005) scaleX(1);
  }
  to {
    transform: scaleY(.005) scaleX(0);
  }
}

/* 字号类 f-数字 对应 0.01*数字 rem，完整补全 12 ~ 80 */
.f-80 { font-size: .80rem; }
.f-79 { font-size: .79rem; }
.f-78 { font-size: .78rem; }
.f-77 { font-size: .77rem; }
.f-76 { font-size: .76rem; }
.f-75 { font-size: .75rem; }
.f-74 { font-size: .74rem; }
.f-73 { font-size: .73rem; }
.f-72 { font-size: .72rem; }
.f-71 { font-size: .71rem; }
.f-70 { font-size: .70rem; }
.f-69 { font-size: .69rem; }
.f-68 { font-size: .68rem; }
.f-67 { font-size: .67rem; }
.f-66 { font-size: .66rem; }
.f-65 { font-size: .65rem; }
.f-64 { font-size: .64rem; }
.f-63 { font-size: .63rem; }
.f-62 { font-size: .62rem; }
.f-61 { font-size: .61rem; }
.f-60 { font-size: .60rem; }
.f-59 { font-size: .59rem; }
.f-58 { font-size: .58rem; }
.f-57 { font-size: .57rem; }
.f-56 { font-size: .56rem; }
.f-55 { font-size: .55rem; }
.f-54 { font-size: .54rem; }
.f-53 { font-size: .53rem; }
.f-52 { font-size: .52rem; }
.f-51 { font-size: .51rem; }
.f-50 { font-size: .50rem; }
.f-49 { font-size: .49rem; }
.f-48 { font-size: .48rem; }
.f-47 { font-size: .47rem; }
.f-46 { font-size: .46rem; }
.f-45 { font-size: .45rem; }
.f-44 { font-size: .44rem; }
.f-43 { font-size: .43rem; }
.f-42 { font-size: .42rem; }
.f-41 { font-size: .41rem; }
.f-40 { font-size: .40rem; }
.f-39 { font-size: .39rem; }
.f-38 { font-size: .38rem; }
.f-37 { font-size: .37rem; }
.f-36 { font-size: .36rem; }
.f-35 { font-size: .35rem; }
.f-34 { font-size: .34rem; }
.f-33 { font-size: .33rem; }
.f-32 { font-size: .32rem; }
.f-31 { font-size: .31rem; }
.f-30 { font-size: .30rem; }
.f-29 { font-size: .29rem; }
.f-28 { font-size: .28rem; }
.f-27 { font-size: .27rem; }
.f-26 { font-size: .26rem; }
.f-25 { font-size: .25rem; }
.f-24 { font-size: .24rem; }
.f-23 { font-size: .23rem; }
.f-22 { font-size: .22rem; }
.f-21 { font-size: .21rem; }
.f-20 { font-size: .20rem; }
.f-19 { font-size: .19rem; }
.f-18 { font-size: .18rem; }
.f-17 { font-size: .17rem; }
.f-16 { font-size: .16rem; }
.f-15 { font-size: .15rem; }
.f-14 { font-size: .14rem; }
.f-13 { font-size: .13rem; }
.f-12 { font-size: .12rem; }



/* ========== 通用颜色工具 ========== */
.c-lg{
  background: var(--linear-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.c-vi {
  color: var(--theme-color);
}

.c-tit{
  color: var(--title-color);
}

.c-t1 {
  color: var(--text-main);
}

.c-t2 {
  color: var(--text-secondary);
}

.c-000 {
  color: #000;
}

.c-111 {
  color: #111;
}

.c-333 {
  color: #333;
}

.c-666 {
  color: #666;
}

.c-888 {
  color: #888;
}

.c-999 {
  color: #999;
}

.c-fff {
  color: #fff;
}

.c-ff2 {
  color: rgba(255, 255, 255, 0.2);
}

.c-ff3 {
  color: rgba(255, 255, 255, 0.3);
}

.c-ff4 {
  color: rgba(255, 255, 255, 0.4);
}

.c-ff5 {
  color: rgba(255, 255, 255, 0.5);
}

.c-ff6 {
  color: rgba(255, 255, 255, 0.6);
}

.c-ff7 {
  color: rgba(255, 255, 255, 0.7);
}

.c-ff8 {
  color: rgba(255, 255, 255, 0.8);
}

.c-ff9 {
  color: rgba(255, 255, 255, 0.9);
}

/* ========== 通用行高 ========== */
.lh-1 {
  line-height: 1;
}

.lh-11 {
  line-height: 1.1;
}

.lh-12 {
  line-height: 1.2;
}

.lh-125 {
  line-height: 1.25;
}

.lh-13 {
  line-height: 1.3;
}

.lh-133 {
  line-height: 1.33;
}

.lh-14 {
  line-height: 1.4;
}

.lh-142 {
  line-height: 1.42;
}

.lh-15 {
  line-height: 1.5;
}

.lh-16 {
  line-height: 1.6;
}

.lh-166 {
  line-height: 1.66;
}

.lh-17 {
  line-height: 1.7;
}

.lh-175 {
  line-height: 1.75;
}

.lh-18 {
  line-height: 1.8;
}

.lh-187 {
  line-height: 1.87;
}

.lh-19 {
  line-height: 1.9;
}

.lh-2 {
  line-height: 2;
}