/* ================================================
   about.html 移动端响应式样式（企业介绍页）
   仅 @media only screen and (max-width: 767px) 生效
   顶部导航/页脚公共部分见 css/responsive/common-responsive.css
   ================================================ */
@media only screen and (max-width: 767px) {

    /* ---------- 顶部导航汉堡按钮对齐修复 ----------
       公共 header.html 的 DOM 顺序为 logo → nav → 汉堡 → 搜索表单，
       flex space-between 下汉堡不会自动靠右，而是悬在中间偏左；
       首页（index.css）给汉堡设置了 margin-left:auto 使其靠右。
       此处复刻首页写法：margin-left:auto 把汉堡推到最右，
       右侧间距与首页完全一致。 */
    header .nav-toggle,
    .header .nav-toggle {
        margin-left: auto !important;
    }

    /* 强制导航容器 flex 两端对齐（覆盖各内页自身 header 布局差异） */
    header,
    .header {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 0 16px !important;
        box-sizing: border-box;
    }

    /* 清除 Logo 区多余左内边距，保证左右视觉对齐 */
    header .logo-area,
    .header .logo-area {
        padding-left: 0 !important;
    }


    /* ---------- Banner ---------- */
    .banner {
        height: 180px;
        background-size: cover;
    }
    .banner-text {
        left: 20px;
        top: 42%;
        height: auto;
        font-size: 16px;
        line-height: 1.5;
    }
    .banner h1 {
        font-size: 24px;
        border-left: 3px solid #fff;
        padding-left: 12px;
        line-height: 1.3;
    }

    /* ---------- 通用标题 ---------- */
    .section-title {
        width: auto;
        height: auto;
        font-size: 28px;
        line-height: 1.3;
        margin-top: 30px;
        margin-bottom: 20px;
    }

    /* ---------- 集团概述 ---------- */
    .group-overview-card {
        border-radius: 16px;
    }
    .group-overview-layout {
        padding-bottom: calc(140 / 767 * 100vw);
    }
    .overview-left,
    .overview-right {
        padding: 24px 18px 16px;
    }
    .group-title-cn {
        font-size: 28px;
    }
    .group-title-en {
        font-size: 14px;
        margin-bottom: 24px;
    }
    .philosophy-list {
        gap: 16px;
    }
    .philosophy-item {
        padding-left: 12px;
    }
    .philosophy-title {
        font-size: 16px;
        margin-bottom: 4px;
    }
    .philosophy-desc {
        font-size: 13px;
    }
    .company-desc {
        font-size: 14px;
        line-height: 1.7;
        padding: 10px 12px;
    }
    .company-desc p {
        margin-bottom: 12px;
    }

    /* ---------- 企业简介 ---------- */
    .intro-section {
        width: 100%;
        margin: 16px auto 24px;
    }
    .intro-section > div:first-child {
        flex-direction: column !important;
        gap: 20px !important;
    }
    .intro-text-box {
        width: 100%;
        height: auto;
        font-size: 15px;
        line-height: 1.8;
        letter-spacing: 0;
        padding: 0 16px;
    }
    .intro-img-box {
        width: 100%;
    }
    .intro-img-box img {
        width: 100%;
        height: auto;
    }
    .intro-section-botton {
        position: static;
        width: 100%;
        height: auto;
        margin-top: 20px;
        padding: 18px 16px;
    }
    .intro-section-text {
        height: auto;
        font-size: 15px;
        line-height: 1.8;
        letter-spacing: 0;
        padding: 0;
        gap: 8px;
    }

    /* ---------- 创始人 ---------- */
    .founder-section-box {
        flex-direction: column;
        width: 100%;
        height: auto;
        padding: 16px;
        gap: 20px;
        align-items: stretch;
    }
    .founder-section {
        width: 100%;
        height: auto;
        transform: none;
    }
    .founder-container {
        width: 100%;
        flex-direction: column;
        height: auto;
        align-items: center;
        padding: 20px 16px;
        gap: 16px;
    }
    .founder-container-img {
        width: 72%;
        height: auto;
        transform: none;
    }
    .founder-container > div {
        transform: none !important;
        height: auto !important;
        padding: 0 !important;
        align-items: center !important;
        justify-content: flex-start !important;
        text-align: center;
        gap: 10px;
    }
    .title-box {
        font-size: 24px;
        line-height: 1.4;
    }
    .title-box span {
        font-size: 15px;
        margin-left: 8px;
        line-height: 1.4;
    }
    .founder-section-right {
        flex-direction: row;
        width: 100%;
        gap: 12px;
    }
    .founder-section-right img {
        width: 48% !important;
        height: auto !important;
    }

    /* ---------- 科技创新 ---------- */
    .tech-section {
        height: auto;
        margin-bottom: 30px;
    }
    .tech-section > img {
        width: 100% !important;
        height: auto !important;
        display: block;
    }
    .tech-overlay {
        position: static;
        width: 100%;
        height: auto;
        padding: 22px 16px;
        font-size: 18px;
        line-height: 1.6;
    }
    .font-style {
        font-size: 18px;
        line-height: 1.5;
    }
    .font-style-1 {
        font-size: 14px;
        line-height: 1.7;
        margin-bottom: 14px;
    }

    /* ---------- 专利展示 ---------- */
    .cert-section {
        width: 100%;
        padding-bottom: 40px;
    }
    .cert-section .flex-center {
        gap: 4px !important;
    }
    .cert-prev,
    .cert-next {
        width: 26px !important;
        height: 48px !important;
        margin-right: 0 !important;
    }
    .cert-gallery-wrapper {
        width: 78%;
        margin-right: 0;
    }
    .cert-gallery {
        gap: 20px;
        padding: 12px 0;
    }
    .cert-item {
        width: 200px;
        height: auto;
    }
    .cert-grid-imag {
        width: 100%;
        height: auto;
    }
    .cert-item.active {
        transform: scale(1.08);
    }
    .cert-items-text {
        font-size: 13px;
        line-height: 1.5;
        padding: 6px;
    }
    .cert-text {
        width: 88%;
        height: auto;
        font-size: 14px;
        line-height: 1.7;
        text-align: center;
        transform: none;
        margin: 20px auto 0;
    }

    /* ---------- 荣誉资质 ---------- */
    .honor-section {
        height: auto;
        padding: 36px 0;
    }
    .honor-container {
        gap: 4px !important;
        padding: 0 8px !important;
    }
    .honor-prev img,
    .honor-next img {
        width: 24px !important;
        height: 44px !important;
    }
    .honor-gallery-wrapper {
        width: 76%;
        padding-top: 0;
        padding-bottom: 0;
        margin-top: 0;
        margin-bottom: 0;
    }
    .honor-gallery {
        gap: 14px;
    }
    .img-box {
        width: 160px;
        height: auto;
        padding: 10px 8px;
    }
    .img-box img,
    .img-box .cert-img {
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 170px !important;
        object-fit: contain;
    }
    .honor-txt {
        font-size: 13px;
        line-height: 1.5;
        min-height: auto;
        width: 100%;
        margin-bottom: 8px;
    }

    /* ---------- 未来愿景 ---------- */
    .vision-section {
        flex-direction: column;
        padding: 20px 0 24px;
        gap: 20px;
    }
    .vision-text-box {
        width: 90%;
        height: auto;
        font-size: 16px;
        line-height: 2;
        padding: 24px 18px;
        margin-right: 0;
        align-items: center;
        text-align: center;
    }
    .vision-section > img {
        width: 100% !important;
        height: auto !important;
    }
}

/* ================================================
   about.html 移动端深度适配优化（追加于文件末尾）
   仅 @media only screen and (max-width: 767px) 生效，PC 端完全不受影响
   模块划分：Banner / 集团概述 / 企业简介 / 创始人 / 科技创新
            / 专利展示 / 荣誉资质 / 未来愿景 / 细节体验
   ================================================ */
@media only screen and (max-width: 767px) {

    /* ---------- 1. 顶部 Banner：固定高度 → 自适应高度，图片完整显示不裁切 ---------- */
    .banner {
        height: auto;
        min-height: 120px;
        aspect-ratio: 2880 / 1049;              /* 与 Banner 原图尺寸一致，保证不裁切不变形 */
        background-size: 100% auto !important;  /* 覆盖行内 background-size:100%，宽满、高按比例 */
    }
    .banner-text {
        left: 16px;
        top: 50%;
        transform: translateY(-50%);
        height: auto;
        line-height: 1.4;
    }
    .banner h1 {
        font-size: 18px;
        border-left: 3px solid #fff;
        padding-left: 10px;
        line-height: 1.35;
        letter-spacing: 1px;
    }

    /* ---------- 2. 集团概述：竖向单列、背景留白压缩、文字可读性提升 ---------- */
    .group-intro-section {
        padding: 0;   /* 左右 16px 由 .styled-section 统一提供，避免叠加成 32px */
    }
    .group-overview-layout {
        flex-direction: column;
        padding-bottom: 24px;                   /* 压缩底部留白，页面更紧凑 */
    }
    .overview-left,
    .overview-right {
        width: 100%;
        box-sizing: border-box;
        background: rgba(255, 252, 245, 0.72);  /* 半透明白底，保证深色文字在背景图上清晰可读 */
        border-radius: 12px;
    }
    .overview-left {
        border-right: none;
        border-bottom: 1px solid rgba(224, 201, 156, 0.45);
        margin-bottom: 12px;
    }
    .philosophy-item {
        background: rgba(255, 250, 240, 0.5);
    }

    /* ---------- 3. 企业简介：图文上下堆叠、正文 14px/1.7、段间距加大 ---------- */
    .intro-section {
        width: 100%;
        box-sizing: border-box;
        padding: 0;   /* 左右 16px 由 .styled-section 统一提供，避免叠加成 32px */
    }
    .intro-text-box {
        font-size: 14px;
        line-height: 1.7;
        text-align: justify;
    }
    .intro-text-box > div {
        margin-top: 12px;
    }
    .intro-img-box {
        margin-top: 4px;
    }
    .intro-section-botton {
        border-radius: 8px;
    }

    /* ---------- 4. 创始人：左右分栏 → 上下堆叠，列表字号适配触屏阅读 ---------- */
    .founder-section-box {
        width: 100%;
        box-sizing: border-box;
        border-radius: 12px;
    }
    .founder-section {
        border-radius: 12px;
    }
    .founder-container-img {
        width: 80%;
    }
    .founder-container > div {
        font-size: 14px;
        line-height: 1.7;
    }
    .founder-section-right {
        flex-direction: column;                 /* 两张横图改为上下排布 */
    }
    .founder-section-right img {
        width: 100% !important;                 /* 覆盖行内 vw 宽度，撑满内容区 */
        height: auto !important;
        border-radius: 8px;
    }

    /* ---------- 5. 科技创新：图片自适应、文字块收紧 ---------- */
    .tech-section {
        border-radius: 12px;
    }
    .tech-overlay {
        border-radius: 0 0 12px 12px;
        padding: 18px 16px;
    }
    .font-style {
        font-size: 16px;
        line-height: 1.5;
    }
    .font-style-1 {
        font-size: 13px;
        line-height: 1.7;
    }

    /* ---------- 6. 专利展示：保留 JS 横向轮播，仅缩小卡片与箭头触控适配 ---------- */
    .cert-section {
        width: 100%;
        box-sizing: border-box;
        padding-bottom: 40px;   /* 左右 16px 由 .styled-section 统一提供，避免叠加成 32px */
    }
    .cert-prev,
    .cert-next {
        width: 44px !important;                 /* 触控区域 ≥44px */
        height: 48px !important;
        flex-shrink: 0;
        object-fit: contain;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .cert-next img {
        width: 28px !important;
        height: auto !important;
        max-width: 100%;
    }
    .cert-gallery-wrapper {
        flex: 1;
        min-width: 0;
        width: auto;
        margin-right: 0;
    }
    .cert-gallery {
        gap: 12px;
    }
    .cert-item {
        width: 150px;
    }
    .cert-grid-imag {
        border-width: 3px;
    }
    .cert-item.active {
        transform: scale(1.05);                 /* 缩小放大幅度，避免溢出屏幕 */
    }

    /* ---------- 7. 荣誉资质：保留 JS 横向轮播，卡片缩小、箭头触控适配 ---------- */
    .honor-container {
        padding: 0 12px !important;
        gap: 6px !important;
    }
    .honor-prev,
    .honor-next {
        width: 44px !important;
        height: 48px !important;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .honor-prev img,
    .honor-next img {
        width: 30px !important;
        height: auto !important;
        max-width: 100%;
    }
    .honor-gallery-wrapper {
        flex: 1;
        min-width: 0;
        width: auto;
    }
    .honor-gallery {
        gap: 10px;
    }
    .img-box {
        width: 130px;
        padding: 8px;
        border-radius: 8px;
    }
    .img-box img,
    .img-box .cert-img {
        max-height: 130px !important;
    }
    .honor-txt {
        font-size: 12px;
        line-height: 1.4;
    }

    /* ---------- 8. 未来愿景：单列、间距与图片圆角 ---------- */
    .vision-section {
        box-sizing: border-box;
    }
    .vision-text-box {
        width: 100%;
        font-size: 15px;
        line-height: 1.9;
        padding: 20px 16px;
        border-radius: 12px;
    }
    .vision-section > img {
        border-radius: 12px;
    }

    /* ---------- 9. 细节体验：去 hover 残留、触控、防横向溢出 ---------- */
    .philosophy-item:hover {
        transform: none !important;             /* 去除 PC hover 位移，避免移动端点击残留 */
        border-left-color: #1bbab8;
    }
    .img-box:hover {
        transform: none !important;
    }
    .intro-section,
    .founder-section-box,
    .cert-section,
    .vision-section,
    .group-overview-layout {
        max-width: 100%;
        overflow-x: hidden;
    }
    .company-desc,
    .cert-text,
    .intro-text-box {
        overflow-wrap: break-word;
        word-break: break-word;                 /* 长文本自动断行，避免撑破屏幕 */
    }
    .cert-prev,
    .cert-next,
    .honor-prev,
    .honor-next,
    .cert-item,
    .img-box {
        -webkit-tap-highlight-color: transparent;
    }
}

/* ================================================
   about.html 移动端优化（追加覆盖层，二次适配）
   仅 @media only screen and (max-width: 767px) 生效
   只追加覆盖，不删除任何原样式，PC 端完全不受影响
   ================================================ */
@media only screen and (max-width: 767px) {

    /* ---------- 整体布局：内容区左右内边距统一 16px ---------- */
    .styled-section {
        padding-left: 16px;
        padding-right: 16px;
    }

    /* ---------- 顶部 Banner：自适应高度，图片完整显示不裁切 ---------- */
    .banner {
        height: auto;
        min-height: 120px;
        padding-top: 36.4%;               /* 2880×1049 原图比例，保证不裁切 */
        background-size: 100% 100% !important;
        overflow: hidden;
    }
    .banner-text {
        left: 16px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 15px;
        line-height: 1.4;
    }
    .banner h1 {
        font-size: 19px;
        line-height: 1.3;
        border-left: 3px solid #fff;
        padding-left: 10px;
    }

    /* ---------- 集团概述：卡片撑满内容区，去除 hover 位移残留 ---------- */
    .group-overview-card {
        max-width: none;
        width: 100%;
    }
    .overview-left,
    .overview-right {
        padding: 20px 14px 14px;
    }
    .philosophy-item:hover {
        transform: none !important;
    }

    /* ---------- 企业简介：去掉双重内边距，段落间距加大 ---------- */
    .intro-text-box {
        padding: 0;
    }
    .intro-text-box > div {
        margin-top: 12px;
    }

    /* ---------- 创始人：右侧双图改上下堆叠、全宽显示 ---------- */
    .founder-section-box {
        padding: 0;
    }
    .founder-section-right {
        flex-direction: column;
        gap: 12px;
    }
    .founder-section-right img {
        width: 100% !important;
        height: auto !important;
    }

    /* ---------- 科技创新：压缩模块下间距 ---------- */
    .tech-section {
        margin-bottom: 20px;
    }

    /* ---------- 专利展示：横向轮播保留（JS 驱动，不改单列），仅缩小卡片/扩大触控 ---------- */
    .cert-prev,
    .cert-next {
        min-width: 44px;
        min-height: 48px;
    }
}
/* 注：以上补齐为历史遗留截断（“二次适配”层写入中断），仅闭合规则与 @media，未删除任何原有代码 */

/* ================================================
   about.html 移动端专项优化（展开收起 + 轮播改横向滑动）
   仅 @media only screen and (max-width: 767px) 生效，PC 端完全不受影响
   对应 JS：js/responsive/about.js（about.html 底部引入）
   ================================================ */
@media only screen and (max-width: 767px) {

    /* ---------- 一、集团概述长文本：展开收起 ----------
       默认收起：max-height 360px + 底部渐变遮罩提示更多内容
       .expanded 由 JS 切换：解除高度限制、遮罩淡出，按钮文字随之切换 */
    .group-overview-card .company-desc {
        max-height: 360px;
        overflow: hidden;
        position: relative;
        transition: max-height 0.3s ease;
    }
    .group-overview-card .company-desc::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 80px;
        pointer-events: none;
        background: linear-gradient(to bottom, rgba(255, 252, 245, 0), rgba(255, 252, 245, 0.95));
        transition: opacity 0.3s ease;
    }
    .group-overview-card .company-desc.expanded {
        max-height: none;
        overflow: visible;
    }
    .group-overview-card .company-desc.expanded::after {
        opacity: 0;
    }
    .group-overview-card .overview-toggle {
        display: block;
        margin: 12px auto 0;
        min-height: 44px;                       /* 触控标准 ≥44px */
        padding: 0 28px;
        border: none;
        border-radius: 22px;
        background: #1bbab8;                    /* 品牌青绿填充 + 白字 */
        color: #fff;
        font-family: inherit;
        font-size: 15px;
        font-weight: 600;
        letter-spacing: 1px;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    /* ---------- 二、专利展示：横向滑动 + scroll-snap ---------- */
    .cert-prev,
    .cert-next {
        pointer-events: none;                   /* 停用 about.js 点击轮播，箭头仅作弱化视觉辅助 */
        opacity: 0.3;
    }
    .cert-gallery {
        width: 100%;
        flex-wrap: nowrap;
        gap: 0;
        transition: none;
        transform: none !important;             /* 中和 about.js 可能残留的位移动画 */
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;                  /* Firefox 隐藏滚动条 */
        scroll-snap-type: x mandatory;          /* 滑动吸附对齐 */
    }
    .cert-gallery::-webkit-scrollbar {
        display: none;                          /* Chrome/Safari 隐藏滚动条 */
    }
    .cert-gallery .cert-item {
        flex: 0 0 100%;                         /* 一屏一张，撑满内容区 */
        width: 100%;
        max-width: 100%;
        height: auto;
        box-sizing: border-box;
        padding: 0 8px;                         /* 卡片左右留少量呼吸空间 */
        scroll-snap-align: center;
    }
    .cert-item.active {
        transform: none !important;             /* 关闭 about.js 中间卡放大，避免滑动时错位 */
        box-shadow: none;
    }
    .cert-grid-imag {
        width: auto !important;                 /* 覆盖行内 vw 尺寸，放大显示保证文字清晰 */
        max-width: 100%;
        height: auto !important;
        max-height: 240px;
        object-fit: contain;
    }
    .cert-items-text {
        font-size: 16px;
        line-height: 1.7;
        padding: 10px 6px;
    }
    .cert-dots {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 8px;
        margin: 16px auto 0;
    }
    .cert-dots span {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: rgba(27, 186, 184, 0.3);
        transition: background 0.3s ease, transform 0.3s ease;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }
    .cert-dots span.active {
        background: #1bbab8;                    /* 当前页品牌色高亮 */
        transform: scale(1.35);
    }

    /* ---------- 三、荣誉资质：横向滑动 + scroll-snap（与专利展示保持统一） ---------- */
    .honor-prev,
    .honor-next {
        pointer-events: none;
        opacity: 0.3;
    }
    .honor-gallery {
        width: 100%;
        gap: 0;
        transition: none;
        transform: none !important;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        scroll-snap-type: x mandatory;
    }
    .honor-gallery::-webkit-scrollbar {
        display: none;
    }
    .honor-gallery .img-box {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding: 12px 10px;
        scroll-snap-align: center;
    }
    .honor-gallery .img-box img,
    .honor-gallery .img-box .cert-img {
        width: auto !important;
        max-width: 100%;
        height: auto !important;
        max-height: 260px;
        object-fit: contain;
    }
    .honor-txt {
        font-size: 15px;
        line-height: 1.6;
        width: 100%;
        margin: 10px 0 6px;
    }
    .honor-dots {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 8px;
        margin: 16px auto 0;
    }
    .honor-dots span {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.35);  /* 深色背景下未激活点用白色半透明 */
        transition: background 0.3s ease, transform 0.3s ease;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }
    .honor-dots span.active {
        background: #1bbab8;
        transform: scale(1.35);
    }
}

/* ================================================
   about.html 集团概述：移动端背景/文字显示修复（追加）
   仅 @media only screen and (max-width: 767px) 生效，PC 端完全不受影响
   解决：展开/收起时背景图干扰文字、图片切割割裂、渐变与背景图叠出脏色
   说明：背景图伪元素 .group-overview-card::before 定义在 about.html 内联
   <style> 中，且其加载顺序晚于本样式表，故背景适配必须加 !important 覆盖；
   白色蒙层未被占用，使用 .group-overview-card::after。
   ================================================ */
@media only screen and (max-width: 767px) {

    /* ---------- 1. 白色半透蒙层（0.9）：背景图与正文之间，覆盖整个内容容器 ----------
       蒙层挂在卡片上（inset:0），展开/收起时随容器高度同步变化，无死角；
       所有正文（左右两栏 + 展开按钮）经 .group-overview-layout 提升层级显示在蒙层之上 */
    .group-overview-card::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.9);   /* 纯白 0.9 半透，保证文字干净阅读底色 */
        pointer-events: none;                   /* 不干扰点击与滚动 */
        z-index: 1;                             /* 高于背景图 ::before(z-index:0)，低于内容 */
    }

    /* 内容层保持在蒙层之上 */
    .group-overview-layout {
        position: relative;
        z-index: 2;
    }

    /* 清除左右两栏既有的 0.72 米白底，让白色蒙层成为唯一均匀的阅读底色，
       避免两栏与间距区域出现色差 */
    .overview-left,
    .overview-right {
        background: transparent;
    }

    /* ---------- 2. 背景图适配：cover + center top，降透明退化为氛围底纹 ----------
       覆盖 about.html 内联样式（background-size:100% auto / bottom center）：
       容器高度变化时背景图以顶部为锚自然向下延伸覆盖，无半截截断；
       opacity 0.35 弱化画面干扰 */
    .group-overview-card::before {
        background-size: cover !important;
        background-position: center top !important;
        background-repeat: no-repeat;
        opacity: 0.35;
    }

    /* ---------- 3. 底部渐隐遮罩：蒙层白 透明 → 蒙层白 实色（80px） ----------
       不再透到底层背景图，避免渐变与背景图叠加出现脏色、杂边；
       与蒙层白色底色无缝衔接，过渡自然柔和 */
    .group-overview-card .company-desc::after {
        height: 80px;                           /* 渐变范围控制在底部 80px 内 */
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.95));
    }

    /* ---------- 4. 展开/收起按钮：贴底显示，与蒙层底色衔接自然 ---------- */
    .group-overview-card .overview-toggle {
        margin: 16px auto 10px;                 /* 与正文间距合理，底部留呼吸空间 */
        box-shadow: 0 2px 8px rgba(27, 186, 184, 0.28);   /* 轻微投影，与白底区分 */
    }

    /* ---------- 5. 展开状态 ----------
       蒙层挂在卡片上自动延展包裹全部正文，背景图 cover 同步向下延伸；
       底部边界 = 卡片 overflow:hidden 圆角边缘，与下方模块清晰分隔，
       文字不会半截露在背景外（无需额外规则，此处仅作说明） */
}