:root {
  /* 主题主色（Primary） */
  --primary-brown: #A26A53;
  --primary-black: #231815;
  --primary-light: #fff;

  /* 辅助色（Secondary） */
  --secondary-grey-dark: #5C5B5B;
  --secondary-grey-light: #BCBCBC;
  --secondary-yellow: #FFFCF6;
  --secondary-red: #AA3E3E;

   /* 间距（Secondary） */
  --primary-margin: 120px;
  --primary-gap: 40px;
  --secondary-margin: 20px;
  --secondary-gap: 10px;

  /* 文字大小和行高以及字重*/
  --font-h1: 72px;
  --font-h2: 32px;
  --font-h3: 24px;
  --font-heading: 16px;
  --font-btn: 16px;
  --font-text: 14px;

  --font-line-h1: 1.3;
  --font-line-h2: 1.4;
  --font-line-h3: 1.5;
  --font-line-heading: 1.5;
  --font-line-btn: 1.5;
  --font-line-text: 2;

  /* 文字颜色 */
  --text-primary: var(--primary-black);
  --text-secondary: var(--secondary-grey-dark);

  /* 背景颜色 */
  --bg-yellow: var(----secondary-yellow);
}



/* 标签样式重置，仅影响.css-module 内部，不影响其他部分 */
.css-module :where(h1, h2, h3, h4, h5, p, ul, ol, li, input, button) {
  clear: all;
  margin: 0;
  padding: 0;
  list-style: none;
}
.css-module :where(input:focus, button:focus) {
  outline: none;
}


/* css 主体部分*/
.css-module .font-title {
  font-family: 'FZZZHUNHJW'; 
}
.css-module .font-text {
  font-family: 'AlibabaPuHuiTi'; 
}

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

.css-module h1 {
  font-size: var(--font-h1);
  line-height: var(--font-line-h1);
}
.css-module h2 {
  font-size: var(--font-h2);
  line-height: var(--font-line-h2);
  font-weight: 400;
}

.css-module h3 {
  font-size: var(--font-h3);
  line-height: var(--font-line-h3);
  font-weight: 400;
}

.css-module .ll-heading {
  font-size: var(--font-heading);
  line-height: var(--font-line-heading);
  font-weight: 500;
}


.css-module .btn:hover,
.css-module .btn:active {
  font-weight: 500;
}

.css-module .ll-text {
  font-size: var(--font-text);
  line-height: var(--font-line-text);
}

/* 模块与模块*/
.primary-margin {
  margin: var(--primary-margin) 0;
}

/* 标题与内容*/
.primary-gap {
  margin: var(--primary-gap);
}

/* 模块内的间距*/
.secondary-margin {
  margin: var(--secondary-margin);
}

/* 文本间距*/
.secondary-gap {
  margin: var(--secondary-gap);
}

/* btn架构*/
/* 基础按钮样式 */
.btn {
  position: relative;
  text-align: center;
  flex-shrink: 0;
  transition: all .3s ease;
  display: inline-block;
  border: 1px solid transparent;
  border-radius: 100px;
  font-weight: 500;
  cursor: pointer;
  transition: all .3s ease;
  font-size: var(--font-btn);
  line-height: var(--font-line-btn);
  padding: 16px 40px;
  color: var(--primary-black);
}

.btn-medium-padding {
  padding: 16px 20px;
}
.mask {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .4);
}
/* 棕色背景无边框白字*/
.primary-btn {
  background-color: var(--primary-brown);
  color: var(--primary-light);
  border-color: var(--primary-brown);
}

/* 黄色背景红色边框红字 */
.yellow-btn {
  background-color: var(--secondary-yellow);
  color: var(--primary-brown);
  border-color: var(--primary-brown);
}

/* 黑色边框无背景黑色字*/
.dark-btn {
  color: var(--primary-black);
  border-color: var(--primary-black); 
}
/* 白色背景黑色字黑色边框*/
.light-btn {
  color: var(--primary-black);
  border-color: var(--primary-black); 
}

.white-btn {
  background-color: #fff;
}

.white-btn-border {
  color: #fff;
  border-color: #fff; 
}

.btn:hover {
  background-color: var(--primary-brown);
  border-color: var(--primary-brown);
  color: #fff;
}

/* 按钮阴影*/
.btn-shadow {
  box-shadow: 0px 2px 12px 0px #00000012;
}
/* btn带icon*/
.btn-with-icon {
  display: flex;
  gap: 10px;
  padding: 16px 20px;
  align-items: center;
}

.swiper-button-next::after,
.swiper-button-prev::after {
  content: unset;
}
.swiper-button-next,
.swiper-button-prev {
  position: relative;
  margin: unset;
  top: unset;
  transform: translateY(-50%);
  left: unset;
  right: unset;
  width: 38px;
  height: 50px;
  padding: 0 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  z-index: 1;
}
.swiper-button-next,
.swiper-button-prev svg {
  display: block;
}
.swiper-button-prev  {
  box-shadow: 0px 2px 12px 0px #00000012;
  border-radius: 0 4px 4px 0;
}
.swiper-button-next  {
  border-radius: 4px 0 0 4px;
  box-shadow: 0px 2px 1px 0px #0000001F;
}

.container {
  max-width: 1800px;
  padding-left: var(--container-gutter);
  padding-right: var(--container-gutter);
  margin: 0 auto;
}

.section-margin {
  margin: var(--primary-margin) 0;
}

.swiper-slide > a {
  display: block;
}

@media screen and (max-width: 999px) {
  :root {
    /* 间距（Secondary） */
    --primary-margin: 80px;
    --primary-gap: 30px;
    --secondary-margin: 20px;
    --secondary-gap: 10px;
  
    /* 文字大小和行高以及字重*/
    --font-h1: 36px;
    --font-h2: 24px;
    --font-h3: 18px;
    --font-heading: 16px;
    --font-btn: 16px;
    --font-text: 14px;
  
    --font-line-h1: 1.3;
    --font-line-h2: 1.4;
    --font-line-h3: 1.5;
    --font-line-heading: 1.5;
    --font-line-btn: 1.5;
    --font-line-text: 2;
  }
}