@import url('all.css');

/* ============================================================
   自定义字体：MiSans-Semibold
   ============================================================ */
@font-face {
    font-family: 'MiSans-Semibold';
    src: url('fonts/MiSans-Semibold.eot');
    src: url('fonts/MiSans-Semibold.eot?#iefix') format('embedded-opentype'),
         url('fonts/MiSans-Semibold.woff2') format('woff2'),
         url('fonts/MiSans-Semibold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MiSans-Medium';
    src: url('fonts/MiSans-Medium.eot');
    src: url('fonts/MiSans-Medium.eot?#iefix') format('embedded-opentype'),
         url('fonts/MiSans-Medium.woff2') format('woff2'),
         url('fonts/MiSans-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MiSans-Bold';
    src: url('fonts/MiSans-Bold.eot');
    src: url('fonts/MiSans-Bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/MiSans-Bold.woff2') format('woff2'),
         url('fonts/MiSans-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'BebasNeue-Regular';
    src: url('fonts/BebasNeue-Regular.eot');
    src: url('fonts/BebasNeue-Regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/BebasNeue-Regular.woff2') format('woff2'),
         url('fonts/BebasNeue-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", sans-serif;
  background: #fff;
  color: #1a1a2e;
  line-height: 1.6;
  overflow-x: hidden;
}
a { text-decoration: none; color: inherit; }
ul,li{ list-style: none; }
img { max-width: 100%; display: block; }

/* ============================================================
   页面等比自适应：按 1920px 设计稿，用 vw 缩放铺满窗口
   （不做断点响应式，只做整体等比缩放，不产生横向滚动条）
   换算：1920 设计稿下 1px = 100/1920 vw ≈ 0.052083vw
   ============================================================ */

/* ============================================================
   第一部分：顶部 Banner
   ============================================================ */
.top-banner {
    position: relative;
    z-index: 2;                   /* 盖住装饰图超出到 Banner 的上半部分 */
    width: 100%;
    height: 50vw;                 /* 960 / 1920 */
    background: url(../images/top-1.jpg) no-repeat center top;
    background-size: 100% 100%;
}
/* 居中大标题 */
.top-banner .banner-title {
    position: absolute;
    top: 7.2917vw;                /* 140 / 1920 */
    left: 50%;
    width: 44.7917vw;             /* 860 / 1920 */
    transform: translateX(-50%);
}
/* 右上角 SDGs 徽标 */
.top-banner .banner-sdgs {
    position: absolute;
    top: 1.5625vw;                /* 30 / 1920 */
    right: 2.6042vw;              /* 50 / 1920 */
    width: 4.9479vw;              /* 95 / 1920 */
}

/* ============================================================
   第7、8部分：内容区左右装饰背景图
   （高度为占位值，待第2~6部分内容补齐后再定）
   ============================================================ */
.top-intro {
    position: relative;
    width: 100%;
    height: auto;                 /* 高度由第2~6部分内容撑开 */
    padding-bottom: 1.5625vw;     /* 30 / 1920 底部留白 */
}
.top-intro .intro-deco {
    position: absolute;
    width: 17.625vw;              /* 360 * 0.94 / 1920 */
    z-index: 1;
}
.top-intro .intro-deco-left {
    left: 0;                      /* 紧贴浏览器窗口左边 */
    top: 3.4538vw;               /* -69 / 1920（顶部超出，被 Banner 遮住） */
}
.top-intro .intro-deco-right {
    right: 0;                     /* 紧贴浏览器窗口右边 */
    top: 3.5vw;                  /* -48 / 1920 */
}

/* 第2部分：居中标题「丰田环境挑战2050」 */
.top-intro .intro-title {
    position: relative;
    z-index: 3;
    margin: 0;
    font-family: 'MiSans-Semibold';
    font-size: 4.375vw;           /* 84 / 1920 */
    font-weight: normal;          /* 字体本身即 SemiBold，避免浏览器再合成加粗 */
    line-height: 1;
    color: #1a1a1a;
    text-align: center;
}

/* 第3部分：正文段落 */
.top-intro .intro-text {
    position: relative;
    z-index: 3;
    margin-top: 1.77vw;           /* 34 / 1920 与标题的间距 */
    font-size: 1.4583vw;          /* 28 / 1920 */
    line-height: 3.4375vw;        /* 66 / 1920 */
    color: #1a1a1a;
    text-align: center;
    font-family: inherit;
}

/* 「碳中和(CN)、循环经济(CE)、自然向好(NP)」底部波浪线（背景图） */
.top-intro .intro-text .wavy {
    position: relative;
    display: inline-block;
    line-height: 1;
    font-weight:600;
    font-family: inherit;
}
.top-intro .intro-text .wavy::after {
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    height: 1.25vw;               /* 24 / 1920，与 top-text.png 等比例 */
    background: url(../images/top-text.png) no-repeat left top;
    background-size: 100% 100%;
}

/* ============================================================
   第4、5部分：两个目标按钮（胶囊形双层描边）
   ============================================================ */
.top-intro .goal-btns {
    position: relative;
    z-index: 3;
    display: flex;
    justify-content: center;
    gap: 3.8021vw;                /* 73 / 1920 两按钮间距 */
    margin-top: 2.6042vw;         /* 50 / 1920 与正文的间距 */
}
/* 外层：外边框 + 背景 */
.top-intro .goal-btn {
    display: block;
    box-sizing: border-box;
    width: 35.2604vw;             /* 677 / 1920 */
    height: 8.8542vw;             /* 170 / 1920 */
    padding: 0.365vw;             /* 7 / 1920 内外边框间距 */
    border: 1px solid #35a56a;
    border-radius: 4.4271vw;      /* 胶囊 */
    background-color: transparent;
    color: #35a56a;
    transition: background-color .3s ease, border-color .3s ease;
}
/* 内层：内边框 */
.top-intro .goal-btn-inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border: 1px solid #35a56a;
    border-radius: 4.0104vw;
    transition: border-color .3s ease;
}
/* 文字 */
.top-intro .goal-btn-txt {
    display: block;
    text-align: center;
    font-size: 2.7083vw;          /* 52 / 1920 */
    line-height: 1.19;
    font-weight: bold;
    color: #35a56a;
    transition: color .3s ease;
    font-family: 'MiSans-Semibold';
}
.top-intro .goal-btn-t1,
.top-intro .goal-btn-t2 { display: block; font-family: inherit;}
/* 右上角圆圈 + 箭头 */
.top-intro .goal-btn-arrow {
    position: absolute;
    top: 1.3021vw;                /* 25 / 1920 */
    right: 4.8438vw;              /* 93 / 1920 */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.2917vw;              /* 44 / 1920 */
    height: 2.2917vw;
    border: 1px solid #35a56a;
    border-radius: 50%;
    font-size: 0.9vw;
    line-height: 1;
    color: #35a56a;
    transition: border-color .3s ease, color .3s ease;
}

/* 悬停：外边框+背景 → #35a56a；内边框+文字+箭头 → #fff */
.top-intro .goal-btn:hover {
    background-color: #35a56a;
    border-color: #35a56a;
}
.top-intro .goal-btn:hover .goal-btn-inner {
    border-color: #fff;
}
.top-intro .goal-btn:hover .goal-btn-txt {
    color: #fff;
}
.top-intro .goal-btn:hover .goal-btn-arrow {
    border-color: #fff;
    color: #fff;
}

/* ============================================================
   第6部分：官网链接条（纯 CSS 平行四边形描边，替代 top-4.png）
   几何尺寸按 top-4.png（630 x 80）实测：倾斜角约 27deg
   ============================================================ */
.top-intro .goal-link {
    position: relative;
    z-index: 3;
    display: block;
    box-sizing: border-box;
    width: 32.8125vw;                 /* 630 / 1920 */
    height: 4.1667vw;                 /* 80 / 1920 */
    margin: 2.3438vw 0 0 13.3854vw;   /* 上 45 / 左 257（位于左侧按钮下方） */
    color: #35a56a;
}
/* 左侧装饰斜杠 */
.top-intro .goal-link::after {
    content: "";
    position: absolute;
    top: 0;
    left: 1.0156vw;                   /* 19.5 / 1920 */
    width: 1.1458vw;                  /* 22 / 1920 */
    height: 100%;
    box-sizing: border-box;
    border: 1px solid #35a56a;
    transform: skewX(-27deg);
    z-index: 0;
}
/* 主框：平行四边形描边 */
.top-intro .goal-link::before {
    content: "";
    position: absolute;
    top: 0;
    left: 3.4583vw;                   /* 66.4 / 1920 */
    width: 28.2292vw;                 /* 542 / 1920 */
    height: 100%;
    box-sizing: border-box;
    border: 1px solid #35a56a;
    transform: skewX(-27deg);
    z-index: 0;
}
/* 文字：与主框对齐居中 */
.top-intro .goal-link-txt {
    position: absolute;
    top: 50%;
    left: 3.4583vw;                   /* 与主框同一水平范围 */
    width: 28.2292vw;
    transform: translateY(-50%);
    text-align: center;
    font-size: 1.3021vw;              /* 25 / 1920 */
    line-height: 1;
    color: #35a56a;
    font-family: 'MiSans-Semibold';
    z-index: 1;
}
/* 右侧细箭头（两条边旋转 45deg 拼出 ">"） */
.top-intro .goal-link-arrow {
    position: absolute;
    top: 1.9792vw;                    /* 38 / 1920，箭头中心 */
    left: 29.1146vw;                  /* 559 / 1920，箭头中心 */
    width: 0.7292vw;                  /* 14 / 1920 */
    height: 0.7292vw;
    box-sizing: border-box;
    border-top: 1px solid #35a56a;
    border-right: 1px solid #35a56a;
    transform: translate(-50%, -50%) rotate(45deg);
    z-index: 1;
}
/* 悬停过渡 */
.top-intro .goal-link::before,
.top-intro .goal-link::after,
.top-intro .goal-link-txt,
.top-intro .goal-link-arrow {
    transition: background-color .3s ease, border-color .3s ease, color .3s ease;
}
/* 悬停：两个斜框填充 #32AD6C，文字与箭头变白 */
.top-intro .goal-link:hover::before,
.top-intro .goal-link:hover::after {
    background-color: #32AD6C;
    border-color: #32AD6C;
}
.top-intro .goal-link:hover .goal-link-txt {
    color: #fff;
}
.top-intro .goal-link:hover .goal-link-arrow {
    border-color: #fff;
}

/* ============================================================
   第二个板块：碳中和
   （第2部分：板块背景 second-1.png，1920 x 1538）
   ============================================================ */
.second {
    position: relative;
    width: 100%;
    height: 80.1042vw;            /* 1538 / 1920 占位高度，与背景图等比例 */
    /* 首页 goal-btn 锚点定位到这里：让出固定头部 60px，板块顶部正好落在头部下沿；
       平滑过渡由第 54 行的 html{scroll-behavior:smooth} 负责 */
    scroll-margin-top: 3.125vw;   /* 60 / 1920 */
}
.second .second-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}
/* 悬停背景：叠在原背景之上，鼠标移入时淡入 */
.second .second-bg-hover {
    opacity: 0;
    transition: opacity .8s ease;
    pointer-events: none;
}
.second:hover .second-bg-hover {
    opacity: 1;
}
/* 第1部分：碳中和标题 */
.second .second-title {
    position: absolute;
    top: 5.4167vw;                /* 104 / 1920 */
    left: 50%;
    width: 18.9583vw;             /* 364 / 1920 */
    transform: translateX(-50%);
    z-index: 1;
}
/* 第3部分：理想形态（小标图 + 一行文字） */
.second .second-ideal {
    position: absolute;
    top: 17.5521vw;               /* 337 / 1920 */
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}
.second .second-ideal-badge {
    width: 6.6667vw;              /* 128 / 1920 */
}
.second .second-ideal-text {
    margin-left: 0.4688vw;        /* 9 / 1920 小标与文字间距 */
    font-size: 1.4583vw;          /* 28 / 1920 */
    line-height: 1;
    color: #333;
    font-family: 'MiSans-Medium';
}
/* 第4、5、6部分：三张卡片 */
.second .second-cards {
    position: absolute;
    top: 21.5104vw;               /* 413 / 1920 */
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 2.4479vw;                /* 47 / 1920 卡片间距 */
    z-index: 1;
}
/* 卡片：基础图 + 悬停图叠层淡入 */
.second .second-cards .card {
    position: relative;
    display: block;
    flex: none;
    width: 26.0417vw;             /* 500 / 1920 */
}
.second .second-cards .card-base {
    display: block;
    width: 100%;
}
.second .second-cards .card-hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: opacity .6s ease;
    pointer-events: none;
}
.second:hover .second-cards .card-hover {
    opacity: 1;
}
/* 第7部分：底部脚注（5 行，MiSans-Medium） */
.second .second-notes {
    position: absolute;
    top: 58.9792vw;               /* 1190 / 1920 */
    left: 8.375vw;                /* 180 / 1920，与卡片左边缘对齐 */
    width: 78.125vw;              /* 1500 / 1920，放宽避免文字换行 */
    z-index: 1;
    font-family: 'MiSans-Medium';
    font-size: 0.7292vw;          /* 14 / 1920 */
    line-height: 1.5;
    color: #666;
}
.second .second-notes p {
    margin: 0;
    white-space: nowrap;          /* 每条脚注保持单行，避免换行后变高溢出 */
    line-height: 2.1;             /* 脚注行间距 */
    font-family: inherit;
}

/* ============================================================
   第三个板块：循环经济
   （第1部分白色背景；第5、6部分为左右装饰背景图）
   ============================================================ */
.third {
    position: relative;
    width: 100%;
    height: 51.5104vw;            /* 989 / 1920：到卡片底部，避免与下一板块间距过大 */
    background-color: #fff;       /* 第1部分：白色背景 */
}
.third .third-deco {
    position: absolute;
    z-index: 0;
}
/* 第5部分：左侧装饰 */
.third .third-deco-left {
    left: 3.125vw;                /* 60 / 1920 */
    top: 8.75vw;                  /* 168 / 1920 */
    width: 38.0208vw;             /* 730 / 1920 */
}
/* 第6部分：右侧装饰 */
.third .third-deco-right {
    right: 3.125vw;               /* 60 / 1920 */
    top: 18.6458vw;               /* 358 / 1920 */
    width: 21.875vw;              /* 420 / 1920 */
}
/* 第2部分：循环经济标题 */
.third .third-title {
    position: absolute;
    top: 1.0417vw;                /* 20 / 1920，紧贴灰色背景弯道下方 */
    left: 50%;                    /* 左边缘压在页面中线（设计稿非居中） */
    width: 18.9583vw;             /* 364 / 1920 */
    z-index: 1;
}
/* 第3部分：理想形态（小标图 + 一行文字） */
.third .third-ideal {
    position: absolute;
    top: 11.0417vw;               /* 212 / 1920 */
    left: 32.7%;                  /* 003.png 实测，非居中 */
    display: flex;
    align-items: center;
    z-index: 1;
}
.third .third-ideal-badge {
    width: 6.6667vw;              /* 128 / 1920 */
}
.third .third-ideal-text {
    margin-left: 0.4688vw;        /* 9 / 1920 小标与文字间距 */
    font-family: 'MiSans-Medium';
    font-size: 1.4583vw;          /* 28 / 1920 */
    line-height: 1;
    color: #333;
}
/* 第4部分：挑战 循环经济 卡片（悬停切换） */
.third .third-card {
    position: absolute;
    top: 15.3646vw;               /* 295 / 1920 */
    left: 46.8%;                  /* 003.png 实测，与标题/说明同一列 */
    width: 26.0417vw;             /* 500 / 1920 */
    z-index: 1;
}
.third .third-card-base {
    display: block;
    width: 100%;
}
.third .third-card-hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: opacity .6s ease;
    pointer-events: none;
}
.third:hover .third-card-hover {
    opacity: 1;
}

/* ============================================================
   第四个板块：自然向好
   （第1部分：板块背景 four-bj.png，1920 x 1293）
   ============================================================ */
.four {
    position: relative;
    width: 100%;
    height: 67.3438vw;            /* 1293 / 1920 占位高度，与背景图等比例 */
}
.four .four-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}
/* 悬停背景：叠在原背景之上，鼠标移入时淡入 */
.four .four-bg-hover {
    opacity: 0;
    transition: opacity .8s ease;
    pointer-events: none;
}
.four:hover .four-bg-hover {
    opacity: 1;
}
/* 第2部分：自然向好标题 */
.four .four-title {
    position: absolute;
    top: 4.7583vw;               /* -20 / 1920：顶部从背景上沿冒出去一点 */
    left: 22.5%;                  /* 004.png 实测，靠左不居中 */
    width: 18.9583vw;             /* 364 / 1920 */
    z-index: 1;
}
/* 第3部分：理想形态（小标图 + 一行文字） */
.four .four-ideal {
    position: absolute;
    top: 15.3646vw;               /* 295 / 1920，与标题保持设计稿间距 */
    left: 21.4%;                  /* 004.png 实测，非居中 */
    display: flex;
    align-items: center;
    z-index: 1;
}
.four .four-ideal-badge {
    width: 6.6667vw;              /* 128 / 1920 */
}
.four .four-ideal-text {
    margin-left: 0.4688vw;        /* 9 / 1920 小标与文字间距 */
    font-family: 'MiSans-Medium';
    font-size: 1.4583vw;          /* 28 / 1920 */
    line-height: 1;
    color: #333;
}
/* 第4、5部分：两张卡片 */
.four .four-cards {
    position: absolute;
    top: 19.5833vw;               /* 376 / 1920 */
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 4.3229vw;                /* 83 / 1920 卡片间距 */
    z-index: 1;
}
/* 卡片：基础图 + 悬停图叠层淡入 */
.four .four-cards .card {
    position: relative;
    display: block;
    flex: none;
    width: 26.0417vw;             /* 500 / 1920 */
}
.four .four-cards .card-base {
    display: block;
    width: 100%;
}
.four .four-cards .card-hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: opacity .6s ease;
    pointer-events: none;
}
.four:hover .four-cards .card-hover {
    opacity: 1;
}

/* ============================================================
   第五个板块：环境管理
   （第1部分：板块背景 five-bj.png，1920 x 565）
   ============================================================ */
.five {
    position: relative;
    width: 100%;
    height: 29.4271vw;            /* 565 / 1920 占位高度，与背景图等比例 */
}
.five .five-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}
/* 第2部分：环境管理标题 */
.five .five-title {
    position: absolute;
    top: -0.5208vw;               /* -10 / 1920：顶部从背景上沿冒出去一点 */
    left: 22.3%;                  /* 005.png 实测，靠左不居中 */
    width: 18.9583vw;             /* 364 / 1920 */
    z-index: 1;
}
/* 第3部分：圆圈箭头（FontAwesome 图标 + 描边圆） */
.five .five-arrow {
    position: absolute;
    top: 0.7552vw;                /* 14.5 / 1920 */
    left: 48.8%;                  /* 005.png 实测，标题右侧靠中位置 */
    width: 1.7188vw;              /* 33 / 1920 */
    height: 1.7188vw;
    border: 1px solid #3d8b84;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3d8b84;
    font-size: 0.625vw;           /* 12 / 1920 */
    z-index: 1;
}
/* 第4部分：一行文字 */
.five .five-text {
    position: absolute;
    top: 10.5208vw;               /* 202 / 1920 */
    left: 22.9%;                  /* 005.png 实测，与标题左缘对齐 */
    font-family: 'MiSans-Medium';
    font-size: 1.4583vw;          /* 28 / 1920 */
    line-height: 1;
    color: #333;
    z-index: 1;
}

/* ============================================================
   page.html 第一个板块：中国丰田环境挑战目标及项目
   （第1部分：板块背景 page-bj.jpg，1920 x 1020）
   ============================================================ */
.page {
    position: relative;
    width: 100%;
    height: 53.125vw;             /* 1020 / 1920 占位高度，与背景图等比例 */
    overflow: hidden;
}
.page .page-bj {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}
/* 第2部分：标题（MiSans-Semibold） */
.page .page-title {
    position: absolute;
    top: 15.625vw;                /* 300 / 1920 */
    left: 50%;
    transform: translateX(-50%);
    font-family: 'MiSans-Semibold';
    font-size: 3.6458vw;          /* 70 / 1920 */
    line-height: 1;
    font-weight: normal;
    color: #333;
    white-space: nowrap;
    z-index: 1;
}
/* 第3、4、5部分：三张卡片（悬停切换） */
.page .page-cards {
    position: absolute;
    top: 27.7604vw;               /* 533 / 1920 */
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 4.3229vw;                /* 83 / 1920 卡片间距 */
    z-index: 1;
}
.page .page-card {
    position: relative;
    display: block;
    flex: none;
    width: 24.1146vw;             /* 463 / 1920 */
    text-decoration: none;        /* 三张卡片本身是 <a> 锚点 */
}
.page .page-card-base {
    display: block;
    width: 100%;
}
.page .page-card-hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: opacity .4s ease;
    pointer-events: none;
}
.page .page-card:hover .page-card-hover {
    opacity: 1;
}

/* 锚点落点补偿：page.html 的四个板块都是锚点目标
   （首页板块标题小图跳转过来、本页三张卡片点击滚动）。
   固定头部高 60px，让出这段高度后板块顶部正好落在头部下沿；
   平滑过渡由第 54 行的 html{scroll-behavior:smooth} 负责，无需 JS。 */
.page2,
.page3,
.page4,
.page5 {
    scroll-margin-top: 3.125vw;   /* 60 / 1920 */
}

/* ============================================================
   page.html 第二大板块：挑战 CO2零排放
   共 4 大部分：1/2/3 为三段内容（各有背景图），4 为左侧红色竖条
   （第1大部分：背景 page-bj-1.png，1920 x 2323）
   ============================================================ */
.page2 {
    position: relative;
    width: 100%;
    height: 322.1875vw;           /* 6186 / 1920，按 007 预览实测的板块高度 */
    margin-top: -7.2917vw;        /* -140 / 1920：继续上移，直到灰色面板完全盖住第一板块底部的白边 */
}
/* 第1大部分：挑战 生命周期CO2零排放（背景 + 内容） */
.page2 .page2-blk1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.page2 .page2-blk1-bj {
    display: block;
    width: 100%;
}
/* 1-1 上部分：左图标 + 橙色标题 */
.page2 .page2-h11 {
    position: absolute;
    top: 11.7188vw;               /* 225 / 1920 */
    left: 12.2917%;               /* 236 / 1920 */
    display: flex;
    align-items: center;
    z-index: 1;
}
.page2 .page2-h11-icon {
    width: 6.7708vw;              /* 130 / 1920 */
}
.page2 .page2-h11-title {
    margin-left: 0.9375vw;        /* 18 / 1920，图标与文字间距 */
    font-family: 'MiSans-Semibold';
    font-size: 3.6458vw;          /* 70 / 1920 */
    line-height: 1;
    color: #E59D42;
    margin-top:2vw;
    font-weight:520;
}
.page2 .page2-h11-title sub {
    font-size: 60%;
    /* baseline：和 O 落在同一条基线上，字底自然齐平。
       不用负值 —— 负值会把 2 往下压，正是之前"2 偏低"的原因。 */
    vertical-align: 0em;
    font-family: 'MiSans-Semibold';
}
/* 1-1 下部分：说明段落 */
.page2 .page2-h11-text {
    position: absolute;
    top: 19.5052vw;               /* 374.5 / 1920 */
    left: 12.4479%;               /* 239 / 1920 */
    width: 75.5208vw;             /* 1450 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;          /* 26 / 1920 */
    font-weight: 520;
    line-height: 1.7;
    color: #2F2725;
    z-index: 1;
}

/* 1-2：供应链供应商减排 */
.page2 .page2-h12-title {
    position: absolute;
    top: 27.2656vw;               /* 523.5 / 1920 */
    left: 12.3958%;               /* 238 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;           /* 36 / 1920 */
    line-height: 1;
    color: #E59D42;
    z-index: 1;
    font-weight:520;
}
.page2 .page2-h12-text {
    position: absolute;
    top: 29.8177vw;               /* 572.5 / 1920 */
    left: 12.3958%;
    width: 35.1208vw;             /* 730 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0542vw;          /* 26 / 1920 */
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
    font-weight:380;
}
.page2 .page2-h12-img {
    position: absolute;
    top: 23.75vw;                 /* 456 / 1920 */
    left: 52.35%;                 /* 984 / 1920 */
    width: 39.0625vw;             /* 750 / 1920 */
    z-index: 1;
}

/* 1-3：两栏文字 */
.page2 .page2-h13-title {
    position: absolute;
    top: 47.8385vw;               /* 918.5 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;           /* 36 / 1920 */
    line-height: 1;
    color: #E59D42;
    z-index: 1;
    font-weight:520;
}
.page2 .page2-h13-title-l { left: 12.3958%; }   /* 238 / 1920 */
.page2 .page2-h13-title-r { left: 53.5938%; }   /* 1029 / 1920 */
.page2 .page2-h13-text {
    position: absolute;
    top: 50.8594vw;               /* 976.5 / 1920 */
    width: 34.6875vw;             /* 666 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0542vw;          /* 26 / 1920 */
    line-height: 1.8923;
    /* 左右两端对齐：中文按字间弹性分配，除最后一行外每行都撑满 666px，
       避免默认左对齐时右边缘参差不齐 */
    text-align: justify;
    color: #2F2725;
    z-index: 1;
    font-weight:380;
}
.page2 .page2-h13-text-l { left: 12.3958%; }
.page2 .page2-h13-text-r { left: 53.5938%; }

/* 1-4：四张图片 2 x 2 */
.page2 .page2-h14 {
    position: absolute;
    top: 64.8229vw;               /* 1283 / 1920 */
    left: 12.3958%;               /* 238 / 1920 */
    width: 75.8854vw;             /* 2*666 + 125 = 1457 / 1920 */
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start;
    row-gap: 1.875vw;             /* 36 / 1920 */
    z-index: 1;
}
.page2 .page2-h14 figure {
    width: 34.6875vw;             /* 666 / 1920 */
}
.page2 .page2-h14 img {
    display: block;
    width: 100%;
}
.page2 .page2-h14 figcaption {
    margin-top: 1.1458vw;         /* 22 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0417vw;          /* 20 / 1920 */
    line-height: 1;
    color: #2F2725;
    font-weight:380;
}

/* ============================================================
   第2大部分：挑战 新车CO2零排放（白色背景，无背景图）
   ============================================================ */
.page2 .page2-blk2 {
    position: absolute;
    top: 121.1979vw;              /* 2327 / 1920，紧接第1大部分灰底面板之后 */
    left: 0;
    width: 100%;
}
/* 2-1 上部分：左图标 + 红色标题 */
.page2 .page2-h21 {
    position: absolute;
    top: 0;
    left: 12.2917%;               /* 236 / 1920 */
    display: flex;
    align-items: center;
    z-index: 1;
}
.page2 .page2-h21-icon {
    width: 6.7708vw;              /* 130 / 1920 */
}
.page2 .page2-h21-title {
    margin-left: 0.9375vw;        /* 18 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 3.6458vw;          /* 70 / 1920 */
    line-height: 1;
    color: #D12726;
    font-weight: 520;
    margin-top: 2vw;
}
.page2 .page2-h21-title sub {
    font-size: 60%;
    /* baseline：和 O 落在同一条基线上，字底自然齐平。
       不用负值 —— 负值会把 2 往下压，正是之前"2 偏低"的原因。 */
    vertical-align: 0em;
    font-family: 'MiSans-Semibold';
}
/* 2-1 下部分：说明段落 */
.page2 .page2-h21-text {
    position: absolute;
    top: 7.7865vw;                /* 149.5 / 1920 */
    left: 12.5%;                  /* 240 / 1920 */
    width: 75.1042vw;             /* 1442 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;          /* 与第1大部分正文一致 */
    font-weight: 520;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
}
/* 2-2：四组图文（2 x 2） */
.page2 .page2-h22 {
    position: absolute;
    top: 19.1146vw;               /* 367 / 1920 */
    left: 12.3958%;               /* 238 / 1920 */
    display: grid;
    grid-template-columns: 34.6875vw 34.6875vw;   /* 666 x 2 */
    column-gap: 6.5104vw;         /* 125 / 1920 */
    row-gap: 2.2135vw;            /* 42.5 / 1920 */
    z-index: 1;
}
.page2 .page2-h22-title {
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 28 / 1920 */
    line-height: 1;
    color: #D12726;
    font-weight: 520;
}
.page2 .page2-h22-img {
    display: block;
    width: 100%;
    margin-top: 0.625vw;          /* 12 / 1920 */
}
.page2 .page2-h22-text {
    margin-top: 0.9635vw;         /* 18.5 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0542vw;
    line-height: 1.8923;
    text-align: justify;          /* 左右两端对齐，同 1-3 */
    color: #2F2725;
    font-weight:380;
}

/* ============================================================
   第3大部分：挑战 工厂CO2零排放
   （背景 page-bj-3.png，1920 x 2326）
   ============================================================ */
.page2 .page2-blk3 {
    position: absolute;
    top: 205.7813vw;              /* 3951 / 1920，紧接第2大部分之后 */
    left: 0;
    width: 100%;
}
.page2 .page2-blk3-bj {
    display: block;
    width: 100%;
}
/* 3-1 上部分：左图标 + 绿色标题 */
.page2 .page2-h31 {
    position: absolute;
    top: 8.9063vw;                /* 171 / 1920 */
    left: 12.2917%;               /* 236 / 1920 */
    display: flex;
    align-items: center;
    z-index: 1;
}
.page2 .page2-h31-icon {
    width: 6.7708vw;              /* 130 / 1920 */
}
.page2 .page2-h31-title {
    margin-left: 0.9375vw;        /* 18 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 3.6458vw;          /* 70 / 1920 */
    line-height: 1;
    color: #82B041;
    font-weight: 520;
    margin-top: 2vw;
}
.page2 .page2-h31-title sub {
    font-size: 60%;
    /* baseline：和 O 落在同一条基线上，字底自然齐平。
       不用负值 —— 负值会把 2 往下压，正是之前"2 偏低"的原因。 */
    vertical-align: 0em;
    font-family: 'MiSans-Semibold';
}
/* 3-1 下部分：说明段落 */
.page2 .page2-h31-text {
    position: absolute;
    top: 17.4740vw;               /* 335.5 / 1920 */
    left: 12.5%;                  /* 240 / 1920 */
    width: 75.1042vw;             /* 1442 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;
    font-weight: 520;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
}
/* 3-2：通过自我改善削减生产中的碳排放 */
.page2 .page2-h32-title {
    position: absolute;
    top: 24.4271vw;               /* 469 / 1920 */
    left: 50%;
    transform: translateX(-50%);
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 32 / 1920 */
    line-height: 1;
    color: #82B041;
    white-space: nowrap;
    z-index: 1;
    font-weight: 520;
}
/* 3-3：两列标题 + 介绍 */
.page2 .page2-h33 {
    position: absolute;
    top: 28.6979vw;               /* 551 / 1920 */
    left: 12.3958%;               /* 238 / 1920 */
    display: grid;
    grid-template-columns: 34.6875vw 34.6875vw;   /* 666 x 2 */
    column-gap: 6.5104vw;         /* 125 / 1920 */
    z-index: 1;
}
.page2 .page2-h33-title {
    font-family: 'MiSans-Bold';
    font-size: 1.1542vw;          /* 26 / 1920 */
    line-height: 1;
    color: #2F2725;
    font-weight: 520;
}
.page2 .page2-h33-note {
    margin-top: 0.7813vw;         /* 15 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 0.7375vw;          /* 18 / 1920 */
    line-height: 1;
    color: #2F2725;
    margin-left:1vw;
}
.page2 .page2-h33-text {
    margin-top: 0.7813vw;         /* 15 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0542vw;
    line-height: 1.8923;
    text-align: justify;          /* 左右两端对齐，同 1-3 */
    color: #2F2725;
    margin-left:1vw;
    margin-right:2.4vw;
    font-weight:380;
}
/* 3-4：两张图片 */
.page2 .page2-h34-l {
    position: absolute;
    top: 44.9792vw;               /* 902 / 1920 */
    left: 13.3958%;               /* 238 / 1920 */
    width: 32.575vw;              /* 660 / 1920 */
    z-index: 1;
}
.page2 .page2-h34-r {
    position: absolute;
    top: 44.9792vw;
    left: 54.8938%;               /* 1029 / 1920 */
    width: 31.7708vw;             /* 610 / 1920 */
    z-index: 1;
}
/* 3-5：积极使用可再生能源 */
.page2 .page2-h35-title {
    position: absolute;
    top: 68.75vw;                 /* 1320 / 1920 */
    left: 12.3958%;               /* 238 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 32 / 1920 */
    line-height: 1;
    color: #82B041;
    z-index: 1;
    font-weight: 520;
}
.page2 .page2-h35-text {
    position: absolute;
    top: 71.1198vw;               /* 1365.5 / 1920 */
    left: 12.5%;                  /* 240 / 1920 */
    width: 34.6875vw;             /* 666 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    line-height: 1.8923;
    text-align: justify;          /* 左右两端对齐 */
    color: #2F2725;
    z-index: 1;
    font-weight:380;
}
/* 3-6 / 3-7：图片 + 标题 */
.page2 .page2-h36 {
    position: absolute;
    top: 69.6354vw;               /* 1337 / 1920 */
    left: 52.8646%;               /* 1015 / 1920 */
    width: 35.4167vw;             /* 680 / 1920 */
    z-index: 1;
}
.page2 .page2-h37 {
    position: absolute;
    top: 83.9583vw;               /* 1612 / 1920 */
    left: 12.3958%;               /* 238 / 1920 */
    width: 34.6875vw;             /* 666 / 1920 */
    z-index: 1;
}
.page2 .page2-h36 img,
.page2 .page2-h37 img {
    display: block;
    width: 100%;
}
.page2 .page2-h36 figcaption,
.page2 .page2-h37 figcaption {
    margin-top: 1.0417vw;         /* 20 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0417vw;          /* 20 / 1920 */
    line-height: 1;
    color: #2F2725;
    font-weight:380;
}

/* 第4大部分：左侧红色竖条（顶边为凹弧，与灰底山形轮廓线重合） */
.page2 .page2-bar {
    position: absolute;
    top: 4.856vw;                     /* 96 / 1920，右端最高点正好落在灰底山形轮廓上 */
    bottom: 0;
    left: 0;
    width: 4.3229vw;              /* 83 / 1920 */
    background-color: #D12726;
    /* 顶边向下凹，弧度贴着 page-bj-1.png 左侧那段山坡 */
    clip-path: polygon(0 0.7292vw, 25% 0.599vw, 50% 0.4427vw, 75% 0.2604vw, 100% 0, 100% 100%, 0 100%);
    z-index: 2;
}
/* 竖条上的「碳中和」标签（4-1 ~ 4-4，直接用切图） */
.page2 .page2-bar-item {
    position: absolute;
    left: 50%;
    width: 2.5vw;                 /* 48 / 1920 */
    transform: translate(-50%, -50%);   /* 以 top 值为垂直中心 */
}
.page2 .page2-bar-item:nth-child(1) { top: 28.5417vw; }    /* 548 / 1920 */
.page2 .page2-bar-item:nth-child(2) { top: 114.4271vw; }   /* 2197 / 1920 */
.page2 .page2-bar-item:nth-child(3) { top: 200.3646vw; }   /* 3847 / 1920 */
.page2 .page2-bar-item:nth-child(4) { top: 286.3021vw; }   /* 5497 / 1920 */

/* ============================================================
   第三板块：循环经济
   （第2大部分：左侧紫色竖条 + 「循环经济」标签）
   ============================================================ */
.page3 {
    position: relative;
    width: 100%;
    height: 118vw;                /* 2266 / 1920，随内容下移后留出的板块高度 */
}
.page3 .page3-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 4.3229vw;              /* 83 / 1920，与上方红色竖条同宽对齐 */
    height: 100%;
    background-color: #4F3D85;
    z-index: 2;
}
.page3 .page3-bar-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.5vw;                 /* 48 / 1920，高度按比例自动 */
    transform: translate(-50%, -50%);   /* 水平 + 垂直居中 */
}

/* 第1大部分：图文混合区域 */
.page3 .page3-blk1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
/* 1-1 上部分：左图标 + 紫色标题 */
.page3 .page3-h11 {
    position: absolute;
    top: 6.5104vw;                /* 125 / 1920 */
    left: 12.2917%;               /* 236 / 1920 */
    display: flex;
    align-items: center;
    z-index: 1;
}
.page3 .page3-h11-icon {
    width: 6.1979vw;              /* 119 / 1920 */
}
.page3 .page3-h11-title {
    margin-left: 1.1979vw;        /* 23 / 1920，图标与文字间距 */
    font-family: 'MiSans-Semibold';
    font-size: 3.6458vw;          /* 70 / 1920 */
    line-height: 1;
    color: #4F3D85;
    font-weight:520;
    margin-top:2vw;
}
/* 1-1 下部分：说明段落 */
.page3 .page3-h11-text {
    position: absolute;
    top: 14.6615vw;               /* 281.5 / 1920 */
    left: 12.5%;                  /* 240 / 1920 */
    width: 75.1042vw;             /* 1442 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
    font-weight:520;
}
/* 1-2：积极推动电池资源化循环 */
.page3 .page3-h12-title {
    position: absolute;
    top: 22.1354vw;               /* 425 / 1920 */
    left: 23.4896%;               /* 451 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 38 / 1920 */
    line-height: 1;
    color: #4F3D85;
    z-index: 1;
    font-weight:520;
}
.page3 .page3-h12-text {
    position: absolute;
    top: 24.7135vw;               /* 474.5 / 1920 */
    left: 23.4896%;               /* 451 / 1920 */
    width: 56.25vw;               /* 1080 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
    font-weight:380;
}
/* 1-3：图片 */
.page3 .page3-h13 {
    position: absolute;
    top: 35.5938vw;               /* 645 / 1920 */
    left: 23.5333%;               /* 304 / 1920 */
    width: 55.9583vw;             /* 1228 / 1920 */
    z-index: 1;
}
/* 1-4：左（标题 + 内容） / 右（小图标） */
.page3 .page3-h14-title {
    position: absolute;
    top: 67.8vw;                  /* 1513 / 1920，紧贴 1-3 图片下沿 */
    left: 23.4896%;               /* 451 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 38 / 1920 */
    line-height: 1;
    color: #4F3D85;
    z-index: 1;
    font-weight:520;
}
.page3 .page3-h14-text {
    position: absolute;
    top: 70.4823vw;               /* 1564.5 / 1920 */
    left: 23.4896%;               /* 451 / 1920 */
    width: 41.6667vw;             /* 800 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
    font-weight:380;
}
.page3 .page3-h14-icon {
    position: absolute;
    top: 66.8104vw;               /* 1493.5 / 1920 */
    left: 69.2708%;               /* 1330 / 1920 */
    width: 9.6354vw;              /* 185 / 1920 */
    z-index: 1;
}
/* 1-5：两张图片并列 + 底部标题 */
.page3 .page3-h15 {
    position: absolute;
    top: 77.6854vw;               /* 1722 / 1920 */
    left: 23.3333%;               /* 448 / 1920 */
    display: flex;
    gap: 1.4583vw;                /* 28 / 1920 */
    z-index: 1;
}
.page3 .page3-h15 figure {
    width: 27.5vw;                /* 528 / 1920 */
}
.page3 .page3-h15 img {
    display: block;
    width: 100%;
}
.page3 .page3-h15 figcaption {
    margin-top: 1.0417vw;         /* 20 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0417vw;          /* 20 / 1920 */
    line-height: 1;
    color: #2F2725;
    font-weight:380;
}

/* ============================================================
   第四板块：自然向好
   （第1部分：板块背景 zrxh-bj-1.png，1920 x 1400）
   ============================================================ */
.page4 {
    position: relative;
    width: 100%;
    height: 293.5vw;                /* 5856 / 1920，容纳到第 3 大部分结束 */
    margin-top: -13.0521vw;        /* -97 / 1920：上移与第三板块尾部衔接 */
}
.page4 .page4-bj {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}
/* 第2部分：左侧绿色竖条 */
.page4 .page4-bar {
    position: absolute;
    top: 5.0604vw;                /* 101 / 1920，与上方紫色竖条下沿对齐 */
    bottom: 0;
    left: 0;
    width: 4.3229vw;              /* 83 / 1920，与上方竖条同宽对齐 */
    background-color: #32AD6C;
    z-index: 2;
}
/* 竖条上的「自然向好」标签 ×4 */
.page4 .page4-bar-item {
    position: absolute;
    left: 50%;
    width: 2.5vw;                 /* 48 / 1920，高度按比例自动 */
    transform: translate(-50%, -50%);   /* 以 top 值为垂直中心 */
}
.page4 .page4-bar-item:nth-child(1) { top: 37.7083vw; }    /* 724 / 1920 */
.page4 .page4-bar-item:nth-child(2) { top: 89.9739vw; }    /* 1727.5 / 1920 */
.page4 .page4-bar-item:nth-child(3) { top: 141.5885vw; }   /* 2718.5 / 1920 */
.page4 .page4-bar-item:nth-child(4) { top: 216.4844vw; }   /* 4156.5 / 1920 */

/* 第1大部分：图文混合区域 */
.page4 .page4-blk1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
/* 1-1 上部分：左图标 + 绿色标题 */
.page4 .page4-h11 {
    position: absolute;
    top: 8.8542vw;                /* 170 / 1920 */
    left: 12.2917%;               /* 236 / 1920 */
    display: flex;
    align-items: center;
    z-index: 1;
}
.page4 .page4-h11-icon {
    width: 6.1458vw;              /* 118 / 1920 */
}
.page4 .page4-h11-title {
    margin-left: 1.3542vw;        /* 26 / 1920，图标与文字间距 */
    font-family: 'MiSans-Semibold';
    font-size: 3.6458vw;          /* 70 / 1920 */
    line-height: 1;
    color: #006E39;
    font-weight:520;
    margin-top:1.25vw;
}
/* 1-1 下部分：说明段落 */
.page4 .page4-h11-text {
    position: absolute;
    top: 16.4323vw;               /* 315.5 / 1920 */
    left: 12.3958%;               /* 238 / 1920 */
    width: 70.3125vw;             /* 1350 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
    font-weight:380;
}
/* 1-2：标题 */
.page4 .page4-h12-title {
    position: absolute;
    top: 31.9427vw;               /* 613.3 / 1920 */
    left: 44.6875%;               /* 858 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 44 / 1920 */
    line-height: 1.2;
    color: #006E39;
    z-index: 1;
    font-weight:520;
}
/* 1-3：项目标题 + 内容 */
.page4 .page4-h13-title {
    position: absolute;
    top: 40.0677vw;               /* 769.3 / 1920 */
    left: 44.6875%;               /* 858 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;          /* 44 / 1920 */
    line-height: 1.2;
    color: #3E3A39;
    z-index: 1;
    font-weight:520;
}
.page4 .page4-h13-text {
    position: absolute;
    top: 44.3906vw;               /* 871.5 / 1920 */
    left: 44.6875%;               /* 858 / 1920 */
    width: 25.5521vw;             /* 625 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    line-height: 1.8923;
    text-align: justify;          /* 左右两端对齐 */
    color: #2F2725;
    z-index: 1;
    font-weight:380;
}

/* ============================================================
   第3大部分：生态保护（背景 #f3f3f3）
   ============================================================ */
.page4 .page4-blk3 {
    position: absolute;
    top: 71.9999vw;               /* 1437 / 1920，接在第一大部分之后 */
    left: 0;
    width: 100%;
    height: 160.4167vw;           /* 3080 / 1920，一直铺到 3-8 结束（原来只到 120.3125vw） */
    background-color: #f3f3f3;
    z-index: 1;
}
/* 3-1：标题 + 内容 */
.page4 .page4-h31-title {
    position: absolute;
    top: 4.4375vw;                /* 66 / 1920 */
    left: 23.0729%;               /* 443 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;          /* 40 / 1920 */
    line-height: 1.2;
    color: #3E3A39;
    z-index: 1;
    font-weight:520;
}
.page4 .page4-h31-text {
    position: absolute;
    top: 8.8177vw;                /* 188.5 / 1920 */
    left: 23.0729%;               /* 443 / 1920 */
    width: 29.7917vw;             /* 572 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    line-height: 1.8923;
    text-align: justify;          /* 左右两端对齐 */
    color: #3E3A39;
    z-index: 1;
    font-weight:380;
}
/* 3-2：三个圆圈数据 */
.page4 .page4-h32 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.page4 .page4-h32-item {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid #006E39;
    border-radius: 50%;
    text-align: center;
    color: #006E39;
}
/* 数字 + 单位同一行，单位贴数字底部 */
.page4 .page4-h32-val {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.page4 .page4-h32-num {
    font-family: 'BebasNeue-Regular';
    font-size: 3.125vw;           /* 60 / 1920 */
    line-height: 1;
    font-weight:400;
}
.page4 .page4-h32-unit,
.page4 .page4-h32-cap {
    font-family: 'MiSans-Medium';
    font-size: 0.6771vw;          /* 13 / 1920 */
    line-height: 1.5;
    font-weight:400;
}
/* 台次：在数字右侧竖排；底边与 600 的底边对齐（实测 600 墨迹底 50、台次 58，
   需上移 8px，故 margin-bottom 由 4px 加到 12px） */
.page4 .page4-h32-unit-v {
    writing-mode: vertical-rl;
    margin-bottom: 0.625vw;       /* 12 / 1920 */
}
/* 三个圆圈统一大小（166px），位置按 009 预览实测 */
.page4 .page4-h32-a { top: 3.75vw; left: 63.9063%; width: 8.6458vw; height: 8.6458vw; }
.page4 .page4-h32-b { top: 13.125vw; left: 58.4375%; width: 8.6458vw; height: 8.6458vw; }
.page4 .page4-h32-c { top: 13.125vw; left: 70.3125%; width: 8.6458vw; height: 8.6458vw; }
/* 3-3：两张图片 + 底部居中标题 */
.page4 .page4-h33 {
    position: absolute;
    top: 25.3958vw;               /* 430 / 1920 */
    left: 22.6042%;               /* 434 / 1920 */
    display: flex;
    gap: 1.9792vw;                /* 38 / 1920 */
    z-index: 1;
}
.page4 .page4-h33 figure {
    width: 29.0625vw;             /* 558 / 1920 */
}
.page4 .page4-h33 img {
    display: block;
    width: 100%;
}
.page4 .page4-h33 figcaption {
    margin-top: 1.0417vw;         /* 20 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0417vw;          /* 20 / 1920 */
    line-height: 1;
    color: #2F2725;
    text-align: center;
    font-weight:380;
}
/* 3-4：标题 + 图标 + 内容 */
.page4 .page4-h34-title {
    position: absolute;
    top: 58.4479vw;               /* 1103 / 1920 */
    left: 23.0729%;               /* 443 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;          /* 40 / 1920 */
    line-height: 1.2;
    color: #3E3A39;
    z-index: 1;
    font-weight:520;
}
.page4 .page4-h34-icon {
    position: absolute;
    top: 54.3229vw;               /* 1043 / 1920 */
    right: 17.2917%;              /* 右边缘与 3-3「雪豹保护」图片右缘对齐 */
    width: 18.2292vw;             /* 350 / 1920 */
    z-index: 1;
}
.page4 .page4-h34-text {
    position: absolute;
    top: 62.6719vw;               /* 1318.5 / 1920 */
    left: 23.0729%;               /* 443 / 1920 */
    width: 64.9479vw;             /* 1247 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    line-height: 1.8923;
    text-align: justify;          /* 左右两端对齐 */
    color: #2F2725;
    z-index: 1;
    font-weight:380;
}
/* 3-5：四张图片 + 底部标题 */
.page4 .page4-h35 {
    position: absolute;
    top: 78.375vw;                /* 1620 / 1920 */
    left: 8.9583%;                /* 172 / 1920 */
    display: flex;
    gap: 1.7188vw;                /* 33 / 1920 */
    z-index: 1;
}
.page4 .page4-h35-group {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.5208vw;                /* 10 / 1920 */
}
.page4 .page4-h35-group figure {
    display: block;
}
.page4 .page4-h35-group img {
    display: block;
    width: 100%;
    height: 19.5313vw;            /* 375 / 1920，四张图统一高度 */
    /* object-fit: cover; */
}
/* 四张图统一高度、宽度按预览实测 */
.page4 .page4-h35-i1 { width: 18.9063vw; transform: rotate(-1.5deg); }   /* 363 */
.page4 .page4-h35-i2 { width: 18.75vw;   transform: rotate(4deg);  position: relative; left: 0.625vw; top: -0.625vw; }   /* 360，右移并上提一点 */
.page4 .page4-h35-i3 { width: 24.5833vw; transform: rotate(-4deg); position: relative; left: -0.625vw; }  /* 472，左移一点 */
.page4 .page4-h35-i4 { width: 19.2708vw; transform: rotate(-3deg); }     /* 370，向左倒 */
.page4 .page4-h35-cap {
    width: 100%;
    margin-top: 1.0417vw;         /* 20 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0417vw;          /* 20 / 1920 */
    line-height: 1;
    color: #2F2725;
    text-align: center;
    font-weight:380;
}
/* 「生态园」下方的两行说明 */
.page4 .page4-h35-note {
    position: absolute;
    top: 100.7708vw;              /* 2050 / 1920 */
    left: 8.5938%;                /* 165 / 1920 */
    width: 39.0625vw;             /* 750 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 0.625vw;           /* 12 / 1920 */
    line-height: 1.5;
    color: #959595;
    z-index: 1;
    font-weight:380;
}
/* 3-6：左右两列 标题 + 内容 */
.page4 .page4-h36 {
    position: absolute;
    top: 106.0208vw;              /* 2170 / 1920 */
    z-index: 1;
}
.page4 .page4-h36-l { left: 12.4479%; width: 33.3333vw; }   /* 239 / 640，与右列留出间距 */
.page4 .page4-h36-r { left: 50.1042%; width: 38.6458vw; }   /* 962 / 742 */
.page4 .page4-h36-title {
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 40 / 1920 */
    line-height: 1.2;
    color: #006E39;
    font-weight:520;
}
.page4 .page4-h36-text {
    margin-top: 0.7552vw;         /* 14.5 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    line-height: 1.8923;
    text-align: justify;          /* 左右两端对齐 */
    color: #2F2725;
    font-weight:380;
}
/* 3-7：图片 + 底部文字（靠左） */
.page4 .page4-h37 {
    position: absolute;
    top: 124.4583vw;              /* 2524 / 1920 */
    left: 12.2917%;               /* 236 / 1920 */
    width: 33.4896vw;             /* 643 / 1920 */
    z-index: 1;
}
.page4 .page4-h37 img {
    display: block;
    width: 100%;
}
.page4 .page4-h37 figcaption {
    margin-top: 1.0417vw;         /* 20 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: .9253vw;          /* 20 / 1920 */
    line-height: 1.2;
    color: #2F2725;
    text-align: left;
    font-weight:380;
}
/* 3-8：三张图片 + 底部文字（居中） */
.page4 .page4-h38 {
    position: absolute;
    top: 124.4583vw;              /* 2524 / 1920 */
    left: 50%;                    /* 960 / 1920 */
    display: flex;
    gap: 0.4167vw;                /* 8 / 1920 */
    z-index: 1;
}
.page4 .page4-h38 figure {
    width: 13.5417vw;             /* 260 / 1920 */
}
.page4 .page4-h38 img {
    display: block;
    width: 100%;
}
.page4 .page4-h38 figcaption {
    margin-top: 1.0417vw;         /* 20 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: .9253vw;          /* 20 / 1920 */
    line-height: 1.5;
    color: #2F2725;
    text-align: center;
    font-weight:380;
}

/* ============================================================
   第4大部分：挑战对水环境影响降到最低
   （背景 zrxh-4-bj.png，1920 x 1364）
   ============================================================ */
.page4 .page4-blk4 {
    position: absolute;
    top: 226.4792vw;              /* 3110 / 1920 */
    left: 0;
    width: 100%;
    height: 71.0417vw;            /* 1364 / 1920 */
    z-index: 1;
}
.page4 .page4-blk4-bj {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}
/* 4-1：图标 + 蓝色标题 + 说明 */
.page4 .page4-h41 {
    position: absolute;
    top: 6.2083vw;                /* 100 / 1920 */
    left: 12.1354%;               /* 233 / 1920 */
    display: flex;
    align-items: center;
    z-index: 1;
}
.page4 .page4-h41-icon {
    width: 6.1458vw;              /* 64 / 1920 */
    margin-top:-2vw;
}
.page4 .page4-h41-title {
    margin-left: 1.35vw;          /* 72 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 3.6458vw;          /* 70 / 1920 */
    line-height: 1;
    color: #4CB1DA;
    font-weight:520;
    /*margin-top:.25vw;*/
}
.page4 .page4-h41-text {
    position: absolute;
    top: 12.4219vw;               /* 238.5 / 1920 */
    left: 12.1354%;               /* 233 / 1920 */
    width: 75.1042vw;             /* 1442 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
}
/* 4-2：蓝色标题 + 说明 */
.page4 .page4-h42-title {
    position: absolute;
    top: 19.4479vw;               /* 335 / 1920 */
    left: 12.1354%;               /* 233 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 38 / 1920 */
    line-height: 1.2;
    color: #4CB1DA;
    z-index: 1;
    font-weight:520;
}
.page4 .page4-h42-text {
    position: absolute;
    top: 22.5990vw;               /* 395.5 / 1920 */
    left: 12.1354%;               /* 233 / 1920 */
    width: 75.1042vw;             /* 1442 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    font-weight: 500;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
    font-weight: 380;
}
/* 4-3：左标题 + 右图片（图片只控高度） */
.page4 .page4-h43 {
    position: absolute;
    top: 33.75vw;                 /* 648 / 1920 */
    left: 12.1354%;               /* 233 / 1920 */
    display: flex;
    align-items: flex-start;
    gap: 2.0833vw;                /* 40 / 1920 */
    z-index: 1;
}
.page4 .page4-h43-title {
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;           /* 36 / 1920 */
    line-height: 1.2;
    color: #2f2725;
    white-space: nowrap;
    font-weight: 400;
}
.page4 .page4-h43-fig img {
    display: block;
    height: 22vw;                 /* 422 / 1920，缩小后的高度，宽度按原比例 */
    width: auto;
}
.page4 .page4-h43-fig figcaption {
    margin-top: 1.0417vw;         /* 20 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 1.0417vw;          /* 20 / 1920 */
    line-height: 1.2;
    color: #2F2725;
    text-align: left;
}

/* ============================================================
   第五板块：环境管理
   （第1部分：内容区域，默认白底；第2部分：左侧青色竖条 #2A8F9A）
   ============================================================ */
.page5 {
    position: relative;
    width: 100%;
    height: 108vw;                /* 2073.6 / 1920，容纳到第 3 大部分（灰底）结束 */
    margin-top: -8.5208vw;        /* -10 / 1920：略微上移，避免与第四板块之间露出白缝 */
    background-color: #fff;
}
.page5 .page5-bar {
    position: absolute;
    top: 1.75vw;
    left: 0;
    width: 4.3229vw;              /* 83 / 1920，与上方竖条同宽 */
    height: 77.3313vw;            /* 1527 / 1920，竖条到灰底区域上沿结束 */
    background-color: #2A8F9A;
    /* 顶部弯型轮廓：与第四板块左侧交接处 */
    clip-path: polygon(0 0.0521vw, 12% 0, 24% 0.3125vw, 36% 0.5208vw, 48% 0.7292vw,
                       60% 0.9375vw, 72% 0.9375vw, 84% 0.8333vw, 96% 0.7292vw,
                       100% 0.7292vw, 100% 100%, 0 100%);
    z-index: 2;
}
.page5 .page5-bar-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.5vw;                 /* 48 / 1920，高度按比例自动 */
    transform: translate(-50%, -50%);   /* 上下 + 左右居中 */
}
/* 第1大部分：内容区域 */
.page5 .page5-blk1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
/* 1-1：左大标题（左上角方块）+ 右文字介绍 */
.page5 .page5-h11-title {
    position: absolute;
    top: 12.7083vw;               /* 244 / 1920 */
    left: 12.3958%;               /* 238 / 1920 */
    display: flex;
    align-items: flex-start;
    font-family: 'MiSans-Semibold';
    font-size: 3.6458vw;          /* 54 / 1920 */
    line-height: 1;
    color: #2A8F9A;
    white-space: nowrap;
    z-index: 1;
    font-weight: 520;
}
.page5 .page5-h11-sq {
    flex: none;
    width: 0.625vw;               /* 12 / 1920 */
    height: 0.625vw;
    margin-right: 0.7813vw;       /* 15 / 1920 */
    background-color: #2A8F9A;
    margin-top:5px;
}
.page5 .page5-h11-text {
    position: absolute;
    top: 12.5521vw;               /* 241 / 1920，与标题上部对齐 */
    left: 30.5729%;               /* 587 / 1920 */
    width: 58.9063vw;             /* 1131 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 1.2542vw;
    line-height: 1.8923;
    color: #2F2725;
    z-index: 1;
    font-weight: 520;
}
/* 1-2 ~ 1-5：四个灰底块 */
.page5 .page5-h1x {
    position: absolute;
    top: 21.4583vw;               /* 412 / 1920 */
    left: 12.2396%;               /* 235 / 1920 */
    display: grid;
    grid-template-columns: 37.2396vw 37.2396vw;   /* 715 x 2 */
    column-gap: 2.8646vw;         /* 55 / 1920 */
    row-gap: 2.6042vw;            /* 50 / 1920 */
    z-index: 1;
}
.page5 .page5-h1x-item {
    background-color: #f3f3f3;
    padding: 2.0833vw;            /* 40 / 1920 内边距 */
    min-height: 23.9583vw;        /* 460 / 1920 */
}
.page5 .page5-h1x-title {
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 38 / 1920 */
    line-height: 1.2;
    color: #2A8F9A;
    font-weight: 400;
}
.page5 .page5-h1x-img {
    display: block;
    width: 29.6875vw;             /* 570 / 1920 */
    margin-top: 1.5625vw;         /* 30 / 1920 */
}
.page5 .page5-h1x-text {
    margin-top: 0;                /* 段落之间不再额外撑开，与普通行距一致 */
    font-family: 'MiSans-Medium';
    font-size: 1.1542vw;
    line-height: 1.8923;
    text-align: justify;          /* 左右两端对齐 */
    color: #2F2725;
    font-weight: 380;
}
/* 只有紧跟标题的那一段才需要与标题的间距 */
.page5 .page5-h1x-title + .page5-h1x-text {
    margin-top: 0.8333vw;         /* 16 / 1920 */
}

/* ============================================================
   第3大部分：底部灰底区域（3-1 / 3-2）
   ============================================================ */
.page5 .page5-blk3 {
    position: absolute;
    top: 79.0208vw;               /* 1450 / 1920 */
    left: 0;
    width: 100%;
    height: 32.4792vw;            /* 623.6 / 1920，铺到板块底部 */
    background-color: #f3f3f3;
    z-index: 1;
}
.page5 .page5-h3x {
    position: absolute;
    top: 4.0104vw;                /* 77 / 1920 */
    left: 12.2396%;               /* 235 / 1920 */
    display: flex;
    gap: 3.125vw;                 /* 60 / 1920 */
}
.page5 .page5-h3x-item {
    position: relative;
    box-sizing: border-box;
    width: 37.1354vw;             /* 713 / 1920 */
    min-height: 24.4792vw;        /* 470 / 1920 */
    border: 1px solid #32AD6C;    /* 1px 透明背景框 */
    padding: 2.8646vw 0 2.0833vw; /* 上 55 / 下 40，左右 0（让绿条贴左边框） */
    text-align: center;
}
/* 悬停时底边加粗：用伪元素画一条底线盖在原来的 1px 底边框上，
   这样加粗不影响盒高（改 border-width 会顶动盒内布局）。 */
.page5 .page5-h3x-item::after {
    content: '';
    position: absolute;
    left: -1px;                   /* 盖满整宽，含左右边框的角 */
    right: -1px;
    bottom: -1px;
    height: 0px;
    background-color: #32AD6C;
    transition: height .3s ease;
    pointer-events: none;
}
.page5 .page5-h3x-item:hover::after {
    height: 8px;                  /* 悬停目标厚度（1.09px 会被浏览器取整成 1px，等于没变化） */
}
.page5 .page5-h3x-head {
    display: flex;
    align-items: flex-start;
}
.page5 .page5-h3x-bar {
    flex: none;
    width: 1.9792vw;              /* 38 / 1920，紧贴左边框的小长方形 */
    height: 1.0417vw;             /* 20 / 1920 */
    margin-top: 0.5208vw;         /* 10 / 1920 */
    background-color: #32AD6C;
}
.page5 .page5-h3x-txt {
    margin-left: 0.7813vw;        /* 15 / 1920 */
    text-align: left;
}
.page5 .page5-h3x-title {
    font-family: 'MiSans-Semibold';
    font-size: 1.875vw;          /* 38 / 1920 */
    line-height: 1.2;
    color: #070001;
}
.page5 .page5-h3x-sub {
    margin-top: 0.2083vw;         /* 4 / 1920 */
    font-family: 'MiSans-Medium';
    font-size: 0.9375vw;          /* 18 / 1920 */
    line-height: 1.2;
    color: #070001;
}
.page5 .page5-h3x-pdf {
    position: absolute;
    top: 2.0833vw;                /* 40 / 1920 */
    right: 3.6458vw;              /* 70 / 1920 */
    width: 3.125vw;               /* 60 / 1920 */
}
.page5 .page5-h3x-img {
    display: block;
    width: 17.8125vw;             /* 342 / 1920，3-1 示意图 */
    margin: 2.6042vw auto 0;      /* 上 50 / 水平居中 */
}
/* 3-2「以往年度报告」的图片：按设计稿放大（墨迹 449.4 x 208） */
.page5 .page5-h3x-img-lg {
    width: 23.875vw;              /* 458.4 / 1920 */
}
/* 3-2 的两个按钮：贴到框底部，使按钮底边与左侧 3-1 图片底边横向对齐。
   用绝对定位而不是 margin，这样无论 3-1 内容多高，两者始终同在
   「框底 − padding-bottom」这条线上。 */
.page5 .page5-h3x-btns {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2.0833vw;             /* 40 / 1920，同 item 的 padding-bottom */
    display: flex;
    justify-content: center;
    gap: 1.3021vw;                /* 25 / 1920 */
}
.page5 .page5-h3x-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 2.6042vw;             /* 50 / 1920 */
    padding: 0 2.0833vw;          /* 40 / 1920 */
    border-radius: 1.3021vw;      /* 圆角 */
    background-color: #32AD6C;
    color: #fff;
    font-family: 'MiSans-Medium';
    font-size: 1.0417vw;          /* 20 / 1920 */
    text-decoration: none;
}
.page5 .page5-h3x-btn img {
    width: 1.3542vw;              /* 26 / 1920 */
    margin-left: 0.5208vw;        /* 10 / 1920 */
}
.page5 .page5-h3x-btn .fa-chevron-right {
    margin-left: 0.5208vw;        /* 10 / 1920 */
    font-size: 0.8333vw;
}

/* ==================== 首页板块标题图标 → page.html 锚点链接 ====================
   首页四个板块标题小图（碳中和/循环经济/自然向好/环境管理）点击后跳转到
   page.html 对应板块，并做平滑滚动过渡。定位仍由上面的 .xxx-title 规则控制，
   这里只让内部 img 撑满外层 <a>。 */
.second .second-title,
.third .third-title,
.four .four-title,
.five .five-title {
    display: block;
    text-decoration: none;
    cursor: pointer;
}
.second .second-title img,
.third .third-title img,
.four .four-title img,
.five .five-title img {
    display: block;
    width: 100%;
    height: auto;
}

/* ============================================================
   history.html：以往数据
   ============================================================ */
.history {
    position: relative;
    width: 100%;
    height: 73.3333vw;            /* 1408 / 1920：标题区 + 三行卡片 */
    background-color: #fff;
}
/* 第1部分：大序号 + 标题 + 底部横线 */
.history .history-h1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.history .history-h1-num {
    position: absolute;
    top: 3.1844vw;                /* 61.1 / 1920 */
    left: 7.8161%;                /* 150.1 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 4.9342vw;          /* 94.7 / 1920 */
    line-height: 1;
    color: #000;
}
.history .history-h1-title {
    position: absolute;
    top: 5.3722vw;                /* 103.1 / 1920 */
    left: 12.1354%;               /* 233 / 1920 */
    font-family: 'MiSans-Semibold';
    font-size: 2.8271vw;          /* 54.3 / 1920 */
    line-height: 1;
    color: #32AD6C;
}
.history .history-h1-line {
    position: absolute;
    top: 9.7396vw;                /* 187 / 1920 */
    left: 12.1354%;               /* 233 / 1920 */
    width: 75.7292%;              /* 1454 / 1920 */
    height: 1px;
    background-color: #32AD6C;
}

/* ---------- 第2部分：DATA BOOK 卡片网格（一行四列 × 三行） ---------- */
.history .history-cards {
    position: absolute;
    top: 12.1927vw;               /* 234.1 / 1920 */
    left: 12.1354%;               /* 233 / 1920 */
    width: 75.7292%;              /* 1454 / 1920 */
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 4.4359vw;         /* 85.17 / 1920 */
}
/* 整块即一个链接 */
.history .history-card {
    position: relative;
    display: block;
    height: 20.3802vw;            /* 391.3 / 1920，含下方留白，保证三行间距一致 */
    color: #000;
    text-decoration: none;
}
/* 灰色底板 */
.history .history-card-cover {
    position: relative;
    display: block;
    width: 100%;
    height: 12.8177vw;            /* 246.1 / 1920 */
    border-radius: 0.3125vw;      /* 6 / 1920 */
    background-color: #F3F3F3;
}
/* 绿色书封：DATA BOOK（D / B 黑色，其余白色） */
.history .history-card-book {
    position: absolute;
    top: 1.1979vw;                /* 23 / 1920 */
    left: 1.3854vw;               /* 26.6 / 1920 */
    display: block;
    width: 8.6146vw;              /* 165.4 / 1920 */
    height: 10.4167vw;            /* 200 / 1920 */
    border-radius: 0.4167vw;      /* 8 / 1920 */
    background-color: #32AD6C;
    font-family: 'BebasNeue-Regular';
    font-size: 2.3646vw;          /* 45.4 / 1920，Bebas 大写高约 0.683em → cap 31，与设计稿一致 */
    line-height: 1.875vw;         /* 36 / 1920，两行基线间距 */
    color: #fff;
}
/* 文字块：整体靠右（右内距 7.3，同设计稿），块内左对齐。
   —— 左对齐：设计稿里 D 和 B 同起点（x=344）；如果右对齐，DATA 和 BOOK
      字宽不同会导致 D / B 左边缘错开。
   —— 靠右 + 宽度自适应：字号被调整时文字始终往左伸展，不会顶出绿块右边。 */
.history .history-card-book-txt {
    position: absolute;
    top: 1.9583vw;                /* 37.6 / 1920 */
    right: 0.3802vw;              /* 7.3 / 1920 */
    text-align: left;
    white-space: nowrap;
    font-family: inherit;         /* 同下：base_2025.css 会给 span 直接写死雅黑 */
    
}
/* 年份：前两位绿色，后两位黑色 */
.history .history-card-year {
    position: absolute;
    top: 2.6719vw;                /* 51.3 / 1920 */
    left: 10.5729vw;              /* 203 / 1920 */
    display: block;
    font-family: 'BebasNeue-Regular';
    font-size: 2.1406vw;          /* 50.7 / 1920 */
    line-height: 1;
    white-space: nowrap;
    color: #000;
}
/* 注意：base_2025.css 有一条 a,i,span,b,... 的全局重置，把 font-family 直接写在
   这些元素身上（"microsoft yahei"）。元素自身的声明优先于继承，所以 <i> 里的
   D / B / 20 会掉回雅黑，必须显式 inherit 回外层。 */
.history .history-card-book i,
.history .history-card-year i {
    font-style: normal;
    font-family: inherit;
}
.history .history-card-book i { color: #000; }
.history .history-card-year i { color: #32AD6C; }
/* 灰底下方文字 */
.history .history-card-caption {
    position: absolute;
    top: 13.5729vw;               /* 260.6 / 1920 */
    left: 0;
    display: block;
    font-family: 'MiSans-Semibold';
    font-size: 1.0401vw;          /* 27.65 / 1920 */
    line-height: 1.5625vw;        /* 30 / 1920 */
    color: #000;
}
.history .history-card-pdf {
    position: absolute;
    top: 13.8073vw;               /* 265.1 / 1920 */
    right: 0;
    width: 2.7448vw;              /* 52.7 / 1920 */
}