/* ============================================================
   轻搭云官网 · 移动端专属适配 (mobile.css)
   ------------------------------------------------------------
   规则边界：所有样式均包裹在 max-width 媒体查询内，
   PC 端（> 1024px）不匹配任何一条规则，视觉与交互完全不变。

   断点体系
     ≤ 1024px  平板 / 大屏手机横屏
     ≤ 760px   手机主断点
     ≤ 430px   小屏手机（iPhone 14 Pro / 375px 级）
     ≤ 360px   极窄屏（老款安卓 / 320px 级）
   ============================================================ */

/* ============================================================
   0. 移动端基础体验层
   ============================================================ */
@media (max-width: 1024px) {
    /* 消除移动端点击蓝色高亮块，保持品牌观感统一 */
    a, button, .case-card, .partner-tile, .capability-tab, .problem-card {
        -webkit-tap-highlight-color: rgba(122, 79, 242, .12);
    }

    /* 禁用触摸设备上的 hover 残留态，避免"点了就变"的粘滞感 */
    @media (hover: none) {
        .case-card:hover,
        .case-card:hover img,
        .problem-card:hover,
        .problem-card.reveal.is-visible:hover,
        .capability-tab:hover,
        .footer-contact:hover,
        .contact-option:hover,
        .hero-showcase__more:hover {
            transform: none;
        }
        .case-card:hover img { transform: none; }
        .problem-card:hover::after { transform: scaleY(.26); }
        .hero-showcase__more:hover { background: rgba(28, 20, 66, .74); }
        .capability-tab:hover:not(.is-active) { background: transparent; border-color: transparent; }
    }

    /* 输入类元素 ≥16px，防止 iOS Safari 聚焦时自动放大页面 */
    input, select, textarea { font-size: max(16px, 4.2vw); }

    /* 移动端滚动惯性 + 禁止整页橡皮筋导致的横向抖动 */
    html { -webkit-text-size-adjust: 100%; }
    body {
        overscroll-behavior-y: none;
        -webkit-font-smoothing: antialiased;
    }

    /* 底部安全区（全面屏手势条）*/
    .site-footer { padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)); }

    /* 触摸目标不小于 44×44（可访问性基线）*/
    .hero-showcase__dot { min-width: 22px; min-height: 22px; }
    .hero-showcase__dot.is-active { min-width: 34px; }
    .filter-chip { min-height: 40px; }
}

/* ============================================================
   1. 顶部导航 · 汉堡菜单（方案 A：轻量白卡）
   ------------------------------------------------------------
   设计要点（相比上一版明显减重）：
   - 白底 + 极细边框，去掉大面积深紫渐变
   - 去掉 01/02/03 序号，只保留文字 + 右侧轻箭头
   - 当前页用淡紫底 + 左侧紫色竖条表示，不做反色翻转
   - 底部 CTA 保留品牌紫作为唯一强调色
   ============================================================ */
@media (max-width: 760px) {
    .site-header { height: 62px; }
    .site-header__inner { gap: 12px; }

    .brand img { height: 30px; width: auto; }

    /* 汉堡按钮：方角描边，保持轻量 */
    .nav-toggle {
        width: 42px; height: 42px; margin-right: -8px;
        border-radius: 11px;
        border-color: rgba(122, 79, 242, .16);
        background: rgba(122, 79, 242, .05);
    }
    .nav-toggle span,
    .nav-toggle::before,
    .nav-toggle::after { width: 19px; margin: 4px auto; background: var(--violet); }
    .site-header.nav-open .nav-toggle { background: rgba(122, 79, 242, .12); border-color: rgba(122, 79, 242, .3); }

    /* 抽屉：白底细边框，仅用柔和阴影表达层级 */
    .site-nav {
        left: 10px; right: 10px; top: 68px;
        padding: 0 0 16px;
        gap: 0;
        border-radius: 18px;
        border: 1px solid rgba(19, 21, 26, .09);
        background: rgba(255, 255, 255, .99);
        box-shadow: 0 20px 50px -18px rgba(32, 29, 58, .28);
        color: var(--ink);
        overflow: hidden;
        animation: m-nav-in .26s cubic-bezier(.16, 1, .3, 1);
    }

    /* 顶部：品牌标识 */
    .site-nav::before {
        content: "轻搭云 QINGDAYUN";
        display: block;
        padding: 17px 18px 14px;
        border-bottom: 1px solid rgba(19, 21, 26, .07);
        color: #9a97a8;
        font-family: var(--font-en);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .14em;
        text-transform: uppercase;
    }

    /* 导航项：纯文字列表，无序号、无卡片底色 */
    .site-nav__links {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: 8px 8px 0;
        margin: 0;
    }
    .site-nav__links a {
        min-height: 50px;
        padding: 0 12px 0 14px;
        position: relative;
        display: flex;
        align-items: center;
        border: 0;
        border-radius: 11px;
        background: transparent;
        color: rgba(19, 21, 26, .82);
        font-size: 15.5px;
        font-weight: 700;
        letter-spacing: .01em;
        transition: background .22s ease, color .22s ease;
    }
    /* 序号已移除，伪元素显式置空
       注意：主样式有 `[aria-current="page"]::before { display:none }`，
       这里统一声明避免残留样式影响 */
    .site-nav__links a::before,
    .site-nav__links a[aria-current="page"]::before {
        content: none;
        display: none;
    }

    /* 右侧轻箭头：重置主样式下划线的定位与形态 */
    .site-nav__links a::after,
    .site-nav__links a[aria-current="page"]::after {
        content: "›";
        display: block;
        position: static;
        width: auto;
        height: auto;
        margin-left: auto;
        transform: none;
        border: 0;
        background: none;
        border-radius: 0;
        font-size: 17px;
        line-height: 1;
        color: rgba(19, 21, 26, .24);
        transition: color .22s ease;
    }

    /* 当前页：淡紫底 + 左侧紫条，不做反色翻转 */
    .site-nav__links a[aria-current="page"] {
        background: rgba(122, 79, 242, .09);
        color: #4f34d8;
    }
    /* 左侧紫色竖条 */
    .site-nav__links a[aria-current="page"] {
        box-shadow: inset 3px 0 0 -1px #7a4ff2;
    }
    .site-nav__links a[aria-current="page"]::after { color: rgba(122, 79, 242, .6); }

    /* 底部 CTA：品牌紫是全抽屉唯一强调色 */
    .site-nav .button {
        width: calc(100% - 16px);
        min-height: 50px;
        margin: 14px 8px 0;
        border-radius: 11px;
        font-size: 15px;
        font-weight: 800;
        background: #7a4ff2;
        color: #fff;
        box-shadow: 0 8px 20px rgba(122, 79, 242, .22);
    }
    .site-nav .button > span { display: none; }
    .site-nav .button::after {
        content: "→";
        font-size: 15px;
        opacity: .82;
    }
    .site-nav .button:hover { background: #4f34d8; }
}


@keyframes m-nav-in {
    from { opacity: 0; transform: translateY(-10px) scale(.985); }
    to   { opacity: 1; transform: none; }
}

/* ============================================================
   2. 通用排版节奏 · Section 头
   ============================================================ */
@media (max-width: 760px) {
    .shell { width: min(calc(100% - 32px), var(--max)); }

    .eyebrow { font-size: 10px; gap: 8px; }
    .eyebrow::before { width: 20px; }

    .section-head {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-bottom: 24px;
        align-items: start;
    }
    .section-head__title .eyebrow { margin-bottom: 14px; }
    .section-head h2 { font-size: 28px; line-height: 1.2; letter-spacing: -.035em; }
    .section-head p {
        justify-self: start;
        max-width: 100%;
        font-size: 14.5px;
        line-height: 1.78;
    }
    /* 说明文字里的案例库链接独占一行，避免与文字粘连 */
    .section-head p .text-link { margin-top: 10px; font-size: 13.5px; }

    /* 统一的区块垂直间距（补齐原样式中断的规则）*/
    .problem-section { padding: 48px 0 52px; }
    .service-section { padding: 48px 0 52px; }
    .case-section    { padding: 48px 0 52px; }
    .partner-section { padding: 46px 0 50px; }
}

/* ============================================================
   3. 首屏 Hero
   ============================================================ */
@media (max-width: 760px) {
    .hero-v3 {
        min-height: 0;
        padding: 84px 0 42px;
        /* 收紧装饰圆环，避免小屏上出现大块空白 */
        background: radial-gradient(circle at 92% 8%, rgba(0, 112, 242, .12), transparent 26%),
                    linear-gradient(160deg, #ffffff 0%, #f7f6fe 55%, #eeecfd 100%);
    }
    .hero-v3::before { width: 380px; height: 380px; right: -150px; top: -180px; }

    .hero-v3__grid { grid-template-columns: 1fr; gap: 30px; }

    .hero-v3 h1 {
        max-width: 100%;
        margin-top: 16px;
        font-size: 34px;
        line-height: 1.14;
        letter-spacing: -.04em;
        /* 标题整体居中，两行文字视觉重心对齐 */
        text-align: center;
    }

    .hero-v3__copy {
        max-width: 100%;
        margin-top: 16px;
        font-size: 15px;
        line-height: 1.8;
        /* 与居中标题保持一致，视觉重心统一 */
        text-align: center;
    }

    /* 主次按钮并排：短文案下横向更紧凑，减少首屏高度 */
    .hero-v3__actions {
        margin-top: 22px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }
    .hero-v3__actions .button {
        min-width: 0;
        min-height: 52px;
        padding-inline: 10px;
        font-size: 15px;
        border-radius: 10px;
        gap: 6px;
        white-space: nowrap;
    }
    .hero-v3__actions .button--ghost { background: rgba(255, 255, 255, .72); }

    /* 需求调整：移动端隐藏按钮内的箭头符号（PC 端保留） */
    .hero-v3__actions .button > span { display: none; }

    /* 三项数据：紧凑三等分，卡片化以增强质感 */
    .hero-v3__proof {
        margin-top: 24px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
        list-style: none;
    }
    .hero-v3__proof li {
        min-width: 0;
        padding: 14px 6px;
        text-align: center;
        border: 1px solid rgba(122, 79, 242, .12);
        border-radius: 12px;
        background: rgba(255, 255, 255, .66);
    }
    .hero-v3__proof strong { font-size: 23px; letter-spacing: -.045em; }
    .hero-v3__proof span { display: block; margin-top: 5px; font-size: 10.5px; line-height: 1.35; }

    /* 需求调整：移动端隐藏服务流程胶囊组（PRD/开发/测试/交付/运维），PC 端保持不变 */
    .hero-v3__trust { display: none; }
}

/* ============================================================
   4. 首屏案例轮播（Hero Showcase）
   ============================================================ */
@media (max-width: 760px) {
    .hero-showcase { gap: 0; }

    .hero-showcase__frame {
        border-radius: 16px 16px 0 0;
        box-shadow: 0 18px 44px -24px rgba(24, 16, 70, .34);
    }

    /* 图片比例略收紧，让封面 UI 细节在窄屏上更易辨识 */
    .hero-showcase__stage { aspect-ratio: 1.62 / 1; border-radius: 16px 16px 0 0; }
    .hero-showcase__slide img { object-fit: cover; }

    /* 信息卡：悬浮幅度减小，减少对封面内容的遮挡 */
    .hero-showcase__panel {
        margin: -24px 8px 8px;
        padding: 14px 15px 12px;
        border-radius: 14px;
        box-shadow: 0 16px 38px -16px rgba(24, 16, 70, .26);
    }
    .hero-showcase__badge { margin-bottom: 8px; padding: 3px 9px; font-size: 10.5px; }
    .hero-showcase__text strong { font-size: 16px; line-height: 1.32; }
    .hero-showcase__bg { margin-top: 6px; font-size: 12.5px; line-height: 1.68; -webkit-line-clamp: 3; }

    /* 进入案例按钮：移至面板内下方，避免压在图片上被裁切 */
    .hero-showcase__more {
        position: static;
        margin-top: 12px;
        align-self: flex-start;
        padding: 8px 14px;
        font-size: 12px;
        border-radius: 999px;
    }
    .hero-showcase__panel { display: flex; flex-wrap: wrap; }
    .hero-showcase__text { flex: 1 1 100%; }

    .hero-showcase__foot { gap: 10px; margin-top: 12px; padding-top: 11px; }
    .hero-showcase__count { font-size: 11px; }

    /* 分页点：5 个灰色小圆点，当前项高亮为紫色实心圆 */
    .hero-showcase__pages {
        gap: 7px;
        justify-content: flex-start;
        min-width: 0;
    }
    .hero-showcase__dot {
        width: 7px;
        height: 7px;
        min-width: 7px;
        min-height: 7px;
        flex: none;
        border-radius: 50%;
        background: rgba(122, 79, 242, .26);
        transition: background .25s, transform .25s;
    }
    /* 当前项：紫色实心圆，保持等宽不再拉长成胶囊 */
    .hero-showcase__dot.is-active {
        width: 7px;
        min-width: 7px;
        border-radius: 50%;
        background: #7a4ff2;
        transform: scale(1.18);
        box-shadow: 0 0 0 3px rgba(122, 79, 242, .14);
    }

    .hero-showcase__arrows { gap: 8px; margin-left: auto; }
    .hero-showcase__arrow { width: 34px; height: 34px; font-size: 14px; border-radius: 50%; }
}

/* ============================================================
   5. 行业实践滚动条
   ------------------------------------------------------------
   需求调整：移动端整块隐藏（PC 端不受影响）
   ============================================================ */
@media (max-width: 760px) {
    .industry-rail { display: none; }
}


/* ============================================================
   6. 痛点区（六项）
   ------------------------------------------------------------
   需求调整：改为单卡片横向滑动展示（一次一张）
   ============================================================ */
@media (max-width: 760px) {
    .problem-grid {
        display: flex;
        grid-template-columns: none;
        grid-auto-rows: auto;
        gap: 12px;
        /* 用 clip 包裹出血区，既能让卡片贴边/露边，
           又不会撑破文档宽度影响 fixed 定位的 header */
        width: 100%;
        padding: 2px 0 4px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    /* 让卡片视觉上贴住 shell 左边缘而不出现在布局流里 */
    .problem-grid::-webkit-scrollbar { display: none; }
    /* 原桌面端的横向连线在滑动布局下无意义 */
    .problem-grid::before { display: none; }

    .problem-card,
    .problem-card:nth-child(2),
    .problem-card:nth-child(5) {
        flex: 0 0 100%;
        min-height: 0;
        margin-top: 0;
        padding: 18px 18px 20px;
        border-radius: 14px;
        scroll-snap-align: start;
    }
    .problem-card::before {
        font-size: 22px;
        margin-bottom: 12px;
        color: rgba(122, 79, 242, .34);
    }
    .problem-card::after { top: 22px; bottom: 22px; }
    .problem-card span { gap: 7px; font-size: 11px; letter-spacing: .06em; }
    .problem-card span::before { width: 16px; }
    .problem-card h3 { margin-top: 13px; font-size: 18px; line-height: 1.42; }
    .problem-card p { margin-top: 10px; font-size: 13.5px; line-height: 1.8; }
}

/* 滑动进度提示条：位于区块底部，宽度跟随滚动位置 */
@media (max-width: 760px) {
    .problem-dots {
        margin-top: 13px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
    }
    .problem-dots i {
        width: 6px;
        height: 6px;
        display: block;
        border-radius: 99px;
        background: rgba(122, 79, 242, .22);
        transition: width .3s cubic-bezier(.16, 1, .3, 1), background .3s;
    }
    .problem-dots i.is-active {
        width: 20px;
        background: #7a4ff2;
    }
}


/* ============================================================
   7. 服务能力（五种解决方案）· 移动端全新设计
   ------------------------------------------------------------
   原横排 tab 在窄屏被挤压，导致标题逐字竖排。
   改为：顶部一行紧凑编号选择器（横向滑动）
        + 下方整块内容卡片（单列、通栏、层级清晰）
   ============================================================ */
@media (max-width: 760px) {
    .capability-explorer {
        min-height: 0;
        width: 100%;
        max-width: 100%;
        /* 使用 !important 覆盖主样式表中的 1024px 两列布局，
           该断点规则与本文件选择器同特异性，必须显式压制 */
        grid-template-columns: minmax(0, 1fr) !important;
        display: grid !important;
        border-radius: 18px;
        overflow: hidden;
        box-shadow: 0 22px 52px -28px rgba(32, 29, 58, .3);
    }
    /* 子项允许收缩，避免内容撑破单列 */
    .capability-explorer__nav,
    .capability-explorer__stage { min-width: 0 !important; width: 100%; }

    /* --- 顶部：编号选择器 --- */
    .capability-explorer__nav {
        padding: 12px 12px 13px;
        display: flex;
        flex-direction: row;
        gap: 8px;
        overflow-x: auto;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .capability-explorer__nav::-webkit-scrollbar { display: none; }

    /* 改为纯编号胶囊，横向排布不再挤压文字 */
    .capability-tab {
        min-width: 0;
        flex: 0 0 auto;
        padding: 0 15px;
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        grid-template-columns: none;
        border-radius: 999px;
        background: rgba(255, 255, 255, .1);
        border: 1px solid rgba(255, 255, 255, .16);
        scroll-snap-align: center;
    }
    /* 名称与英文副标题在移动端隐藏，当前项名称以下方大标题呈现 */
    .capability-tab strong,
    .capability-tab small { display: none; }
    .capability-tab span {
        grid-row: auto;
        align-self: auto;
        font-size: 12px;
        letter-spacing: .06em;
        color: rgba(255, 255, 255, .72);
    }
    .capability-tab.is-active {
        transform: none;
        background: #fff;
        box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
    }
    .capability-tab.is-active span { color: #17124f; }
    .capability-tab.is-active::after { display: none; }

    /* --- 下方：内容大卡片 --- */
    .capability-explorer__stage {
        background: linear-gradient(150deg, #ffffff 0%, #f4f8fd 100%);
    }
    .capability-explorer__stage::before { display: none; }

    .capability-panel {
        min-height: 0;
        padding: 20px 18px 22px;
        display: flex;
        flex-direction: column;
        gap: 0;
        align-items: stretch;
        background: transparent;
    }

    /* 顶部信息条：需求调整去掉英文，改为
       「小号编号 + 方案名」一行式标签，标题层级整体放大 */
    .capability-panel__meta {
        display: flex;
        align-items: center;
        gap: 9px;
        margin-bottom: 4px;
        flex-wrap: nowrap;
    }
    /* 编号：纯数字，作为视觉引导 */
    .capability-panel__meta span {
        padding: 0;
        border-radius: 0;
        background: none;
        color: #7a4ff2;
        font-family: var(--font-en);
        font-size: 13px;
        font-weight: 800;
        letter-spacing: .04em;
        line-height: 1;
        white-space: nowrap;
    }
    /* 编号与方案名之间的分隔竖线 */
    .capability-panel__meta span::after {
        content: "";
        width: 1px;
        height: 12px;
        margin-left: 9px;
        display: inline-block;
        vertical-align: -2px;
        background: rgba(122, 79, 242, .3);
    }
    /* 方案名作为主标签，完整显示不截断 */
    .capability-panel__name {
        flex: 1 1 auto;
        min-width: 0;
        font-size: 15px;
        font-weight: 700;
        color: var(--ink);
        line-height: 1.3;
    }

    /* 标题放大为视觉主层级，与上方标签形成明确对比 */
    .capability-panel h3 {
        margin-top: 10px;
        font-size: 24px;
        line-height: 1.3;
        letter-spacing: -.035em;
    }
    .capability-panel__copy > p {
        margin-top: 13px;
        font-size: 14px;
        line-height: 1.82;
    }

    /* 能力标签：左侧竖条色带，强化层级 */
    .capability-panel ul {
        margin-top: 16px;
        display: flex;
        flex-direction: column;
        gap: 0;
        border-radius: 12px;
        overflow: hidden;
    }
    .capability-panel li {
        padding: 10px 14px 10px 30px;
        position: relative;
        border: 0;
        border-radius: 0;
        background: rgba(122, 79, 242, .045);
        font-size: 13px;
        font-weight: 600;
        color: #37335e;
    }
    .capability-panel li + li { border-top: 1px solid rgba(122, 79, 242, .09); }
    .capability-panel li::before {
        content: "";
        width: 6px;
        height: 6px;
        position: absolute;
        left: 14px;
        top: 50%;
        margin-top: -3px;
        border-radius: 50%;
        background: linear-gradient(135deg, #7a4ff2, #12c2f4);
    }

    /* 装饰性圆形视觉在窄屏隐藏，信息密度优先 */
    .capability-visual { display: none; }
}


/* ============================================================
   8. 精选案例轮播
   ============================================================ */
@media (max-width: 760px) {
    /* 轮播卡片通栏 100%
       左右留白一致性说明：
       - 左侧留白由 shell 提供（视口 → 卡片左边 = 14px）
       - 若 track 设 padding-right，卡片右边会再内缩，导致右侧 > 左侧
       因此这里 padding 归零，让卡片左右都贴合 shell 边界，
       视觉上左右留白完全一致（各 14px）。
       滑动暗示改由卡片圆角 + 下方箭头承担。 */
    .case-carousel {
        width: 100%;
        overflow: clip;
    }
    .case-carousel__track {
        gap: 0;
        padding-right: 0;
    }
    .case-carousel__track .case-card { flex: 0 0 100%; }

    .case-card__media { aspect-ratio: 1.5 / 1; border-radius: 10px; }
    .case-card__meta { inset: auto 12px 12px; }
    .case-card__meta span { min-height: 30px; padding: 0 11px; font-size: 11px; }
    .case-card__link { padding-bottom: 16px; }
    .case-card h3 { margin-top: 13px; font-size: 18px; line-height: 1.35; }
    .case-card p { margin-top: 8px; font-size: 13px; line-height: 1.7; }
    .case-card__action { padding-top: 12px; font-size: 12.5px; }

    /* 轮播控件精简为状态 + 箭头 */
    .case-carousel__controls { margin-top: 16px; }
    .case-carousel__status { font-size: 11px; }
    .case-carousel__controls > div { gap: 10px; }
    .case-carousel__controls button { width: 44px; height: 44px; }
}

/* ============================================================
   9. 合作伙伴走马灯
   ============================================================ */
@media (max-width: 760px) {
    .partner-section .section-head { margin-bottom: 30px; }
    .partner-marquee {
        gap: 10px;
        /* 两端淡出，让"无限滚动"更可感知 */
        -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
        mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
    }
    .partner-marquee__row,
    .partner-marquee__group { gap: 10px; }
    .partner-tile { width: 132px; height: 60px; padding: 10px 12px; border-radius: 8px; }
}

/* ============================================================
   10. 页脚与咨询弹窗
   ============================================================ */
@media (max-width: 760px) {
    .site-footer__cta {
        min-height: 0;
        padding: 38px 0 30px;
        grid-template-columns: 1fr;
        gap: 26px;
        align-items: start;
    }
    .site-footer__cta h2 { margin-top: 16px; font-size: 27px; line-height: 1.16; letter-spacing: -.035em; }
    .site-footer__cta-button {
        justify-self: stretch;
        margin: 0;
        min-height: 52px;
        border-radius: 10px;
        font-size: 15px;
    }

    .site-footer__top { padding-top: 26px; grid-template-columns: 1fr; gap: 24px; }
    .site-footer__brand img { height: 34px; width: auto; }
    .site-footer__brand p { margin-top: 13px; font-size: 12.5px; line-height: 1.75; }

    /* 联系方式：手机号与微信并排，邮箱独占整行 */
    .site-footer__links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .footer-contact { min-height: 74px; padding: 13px 14px; border-radius: 10px; }
    .footer-contact:last-child { grid-column: 1 / -1; }
    .footer-contact span { font-size: 11px; }
    .footer-contact strong { margin-top: 7px; font-size: 14.5px; word-break: break-all; }

    .site-footer__bottom {
        margin-top: 22px;
        padding-top: 18px;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        font-size: 10.5px;
        line-height: 1.6;
    }

    /* 咨询弹窗：接近全屏、底部安全区留白 */
    .contact-dialog {
        width: calc(100% - 20px);
        max-width: 460px;
        max-height: calc(100dvh - 20px);
        border-radius: 18px;
    }
    .contact-dialog__inner { padding: 24px 20px calc(24px + env(safe-area-inset-bottom, 0px)); }
    .dialog-close { width: 34px; height: 34px; font-size: 19px; }
    .contact-dialog h2 { max-width: 100%; font-size: 26px; line-height: 1.16; }
    .contact-dialog > div > p { font-size: 14px; line-height: 1.7; }
    .contact-options { margin-top: 20px; grid-template-columns: 1fr; gap: 9px; }
    .contact-option { min-height: 74px; padding: 14px 16px; border-radius: 10px; }
    .contact-option strong { margin-top: 8px; font-size: 15px; }

    .contact-retain h2 { font-size: 21px; line-height: 1.24; }
    .contact-retain > p { font-size: 13.5px; line-height: 1.6; }
    .contact-retain__form { gap: 10px; margin-top: 14px; }
    .contact-retain__actions .button { min-height: 50px; font-size: 15px; }
}

/* ============================================================
   11. 案例库页
   ============================================================ */
@media (max-width: 760px) {
    .page-hero { min-height: 0; padding: 100px 0 52px; }
    .page-hero--compact { padding: 98px 0 46px; }
    .page-hero::after { right: -10px; bottom: -14px; font-size: 96px; }
    .page-hero h1,
    .page-hero--compact h1 { margin-top: 16px; font-size: 28px; line-height: 1.16; letter-spacing: -.035em; }
    .page-hero p,
    .page-hero--compact p { margin-top: 16px; font-size: 14.5px; line-height: 1.78; }

    .library-section { padding: 40px 0 54px; }
    .library-section--top { padding-top: 84px; }
    .library-toolbar { margin-bottom: 18px; }

    /* 筛选条：横向滑动 + 两端渐隐提示
       注意：不能用负 margin 制造出血，否则会撑破文档宽度，
       导致 position:fixed 的 header 按更宽的文档布局、
       右侧汉堡按钮被裁掉（曾出现「导航靠右收了」）。 */
    .filter-list {
        width: 100%;
        padding: 0 0 10px;
        margin: 0;
        gap: 8px;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        -webkit-mask-image: linear-gradient(90deg, #000 86%, transparent);
        mask-image: linear-gradient(90deg, #000 86%, transparent);
    }
    .filter-list::-webkit-scrollbar { display: none; }
    .filter-chip { min-height: 40px; padding: 0 15px; flex: 0 0 auto; font-size: 12.5px; }

    /* 案例列表：单列大卡，封面与文字都更易读 */
    .case-grid,
    .library-section .case-grid {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
        gap: 22px;
    }
    .library-section .case-card__link { padding-bottom: 16px; }
    .library-section .case-card__media { aspect-ratio: 1.5 / 1; border-radius: 10px; }
    .library-section .case-card__meta { inset: auto 12px 12px; }
    .library-section .case-card__meta span { min-height: 28px; padding: 0 10px; font-size: 10.5px; }
    .library-section .case-card h3 { margin-top: 12px; font-size: 17.5px; line-height: 1.38; }
    .library-section .case-card p {
        margin-top: 8px;
        font-size: 13px;
        line-height: 1.72;
        min-height: 0;
        -webkit-line-clamp: 3;
    }
    .library-section .case-card__action { padding-top: 14px; font-size: 12.5px; }
    .data-message { padding: 36px 16px; }
}

/* ============================================================
   12. 案例详情页
   ============================================================ */
@media (max-width: 760px) {
    .detail-hero { min-height: 0; padding: 88px 0 40px; }
    .detail-hero__grid { grid-template-columns: 1fr; gap: 22px; }
    .detail-hero__meta { margin-bottom: 20px; gap: 12px; }
    .back-link { font-size: 12.5px; }
    .detail-industry { min-height: 32px; padding-inline: 12px; font-size: 10.5px; }
    .detail-hero h1 { margin-top: 14px; font-size: 29px; line-height: 1.12; letter-spacing: -.035em; }
    .detail-summary { margin-top: 16px; font-size: 14.5px; line-height: 1.8; }
    .detail-hero__note { margin-top: 20px; font-size: 11.5px; }

    .detail-cover-wrap { min-height: 0; padding: 8px; border-radius: 14px; }
    .detail-cover { min-height: 0; height: auto; aspect-ratio: 1.42 / 1; border-radius: 10px; }
    .detail-cover__label { min-width: 140px; left: 16px; bottom: 16px; padding: 9px 11px; border-radius: 10px; }
    .detail-cover__label strong { font-size: 13px; }

    .detail-results { padding: 42px 0 44px; }
    .detail-results__head { grid-template-columns: 1fr; gap: 14px; }
    .detail-results__head h2 { margin-top: 11px; font-size: 25px; line-height: 1.2; letter-spacing: -.035em; }
    .detail-results__head > p { justify-self: start; font-size: 14px; line-height: 1.78; }

    /* 指标卡重新设计（移动端）：
       桌面端为「序号 / 大数字 / 描述 / 进度条」四层竖排，
       窄屏上纵向拉得过长（每张约 252px）。
       改为左右两栏，卡片高度压到约 100px：
         左栏（窄）：序号 + 大数值 + 进度条
         右栏（宽）：指标描述，垂直居中
       顶部色条改为左侧竖条，整列视觉连贯。 */
    .detail-metrics {
        margin-top: 20px;
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .detail-metric {
        min-height: 0;
        padding: 15px 16px;
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        align-items: center;
        gap: 16px;
        border-radius: 14px;
        border-left: 3px solid var(--metric-accent);
        border-top: 1px solid rgba(122, 79, 242, .13);
    }
    .detail-metric::before { display: none; }

    /* 左栏容器：JS 把序号/数值/进度条收进这里 */
    .detail-metric__main {
        display: flex;
        flex-direction: column;
        gap: 7px;
        min-width: 0;
    }

    /* 序号 span 与圆点在移动端被 JS 移除，此处兜底隐藏 */
    .detail-metric__top { display: none; }

    .detail-metric__result { align-self: auto; }
    .detail-metric__result strong {
        display: block;
        font-size: 31px;
        line-height: 1;
        letter-spacing: -.05em;
        color: #17124f;
    }
    /* 描述已由 JS 移到右栏，原位置隐藏 */
    .detail-metric__result p { display: none; }

    .detail-metric__track {
        height: 5px;
        margin-top: 0;
    }

    /* 右栏：指标描述，垂直居中对齐左栏数值 */
    .detail-metric__copy {
        min-width: 0;
        align-self: center;
    }
    .detail-metric__copy p {
        margin: 0;
        color: #332e58;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-wrap: balance;
    }

    .detail-content { padding: 42px 0 48px; }
    .detail-background__title h2 { margin-top: 11px; font-size: 25px; line-height: 1.2; letter-spacing: -.035em; }
    .detail-background__copy {
        min-height: 0;
        margin-top: 20px;
        padding: 20px 16px 22px 28px;
        border-left-width: 4px;
        border-radius: 0 12px 12px 0;
    }
    .detail-background__copy::before { left: 8px; top: 12px; font-size: 40px; }
    .detail-background__copy::after { right: 8px; font-size: 34px; }
    .detail-background__copy p { font-size: 14px; line-height: 1.85; }

    .detail-challenge-section,
    .detail-practice { margin-top: 40px; }

    /* 挑战-对照卡：完全重设计
       原布局：左右两个大卡 + 中间圆形箭头。
       窄屏堆叠后变成「挑战/响应/挑战/响应」四段，读起来割裂。
       新布局：每组合并为一张卡 —— 顶部「业务挑战」标签 + 挑战正文，
       中间一条带箭头的分隔行，下方淡紫底的「系统响应」+ 响应正文。
       标签去掉数字（由 mobile.js 处理）。 */
    .challenge-list {
        margin-top: 20px;
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .challenge-row {
        min-height: 0;
        display: block;
        padding: 0;
        border-radius: 14px;
        overflow: hidden;
        border: 1px solid rgba(122, 79, 242, .13);
    }
    /* 挑战区 */
    .challenge-row > div:first-child {
        min-height: 0;
        padding: 16px 16px 14px;
        display: block;
        background: #fff;
    }
    /* 标签：内联贴合文字，不被 flex 拉伸通栏
       注意：主样式 .challenge-row > div 是 display:flex，
       span 作为 flex 子项默认 stretch，需显式 align-self:flex-start */
    .challenge-row span {
        display: inline-block;
        align-self: flex-start;
        width: auto;
        max-width: 100%;
        padding: 3px 9px;
        border-radius: 999px;
        background: rgba(214, 74, 74, .09);
        color: #c9524f;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .02em;
    }
    .challenge-row p {
        margin-top: 10px;
        font-size: 14px;
        line-height: 1.72;
        color: var(--ink);
    }

    /* 中间分隔行：取代圆形箭头，改为「↓ 系统方案」文字条 */
    .challenge-row > i {
        width: auto;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        margin: 0;
        padding: 0 16px;
        border-radius: 0;
        background: linear-gradient(90deg,
            rgba(122, 79, 242, .04) 0%,
            rgba(122, 79, 242, .13) 50%,
            rgba(122, 79, 242, .04) 100%);
        color: #6b4bd8;
        font-size: 11.5px;
        font-weight: 700;
        letter-spacing: .06em;
        box-shadow: none;
        transform: none;
        font-style: normal;
    }
    /* 两侧装饰短线，中间是文字（由 JS 写入）*/
    .challenge-row > i::before,
    .challenge-row > i::after {
        content: "";
        width: 16px;
        height: 1px;
        background: rgba(122, 79, 242, .34);
    }

    /* 响应区：淡紫底，与挑战区形成层次 */
    .challenge-row > div:last-child,
    .challenge-row__answer {
        min-height: 0;
        padding: 16px;
        display: block;
        background: linear-gradient(150deg, #f4f1ff 0%, #fbfaff 100%);
    }
    .challenge-row__answer span {
        background: rgba(122, 79, 242, .12);
        color: #5c3fd6;
    }
    .challenge-row__answer p {
        margin-top: 10px;
        font-size: 14px;
        line-height: 1.75;
        color: #332e58;
    }
    .detail-section-head h2 { margin-top: 11px; font-size: 25px; line-height: 1.22; letter-spacing: -.035em; }
    /* challenge-row 系列规则已在上方「挑战-对照卡」段落统一定义，此处不再重复 */

    .detail-sections { margin-top: 20px; gap: 12px; }
    .detail-section { min-height: 0; padding: 8px; grid-template-columns: 1fr; gap: 0; border-radius: 14px; }
    .detail-section:nth-child(even) > div,
    .detail-section:nth-child(even) img { order: initial; }
    .detail-section > div { padding: 17px 15px 19px; }
    /* 序号 span 被 JS 移除，标题直接顶到卡片顶部，取消多余 margin */
    .detail-section h2 { margin-top: 0; font-size: 23px; line-height: 1.24; letter-spacing: -.035em; }
    .detail-section p { margin-top: 12px; font-size: 13.5px; line-height: 1.78; }
    .detail-section img { min-height: 0; height: auto; aspect-ratio: 1.42 / 1; border-radius: 10px; }
}

/* ============================================================
   13. 关于我们页
   ============================================================ */
@media (max-width: 760px) {
    /* 关于页区块间距（桌面端 118–130px 在窄屏过大，这里统一收紧） */
    .manifesto { padding: 48px 0 52px; }
    .values-section { padding: 48px 0 52px; }
    .timeline-section { padding: 48px 0 54px; }

    .manifesto__grid { grid-template-columns: 1fr; gap: 10px; }
    .manifesto__statement { min-height: 0; padding: 22px 20px 24px; border-radius: 14px; }
    .manifesto__lead { font-size: 24px; line-height: 1.18; letter-spacing: -.035em; }
    .manifesto__statement > p { margin-top: 14px; font-size: 13.5px; line-height: 1.72; }

    .manifesto__copy { gap: 8px; }
    .manifesto__copy article { padding: 16px 16px 18px; border-radius: 13px; }
    .manifesto__copy article::after { top: 16px; bottom: 16px; }
    .manifesto__copy p { margin-top: 8px; font-size: 13px; line-height: 1.75; }

    .about-numbers { margin-top: 10px; grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .about-number,
    .about-number:nth-child(2),
    .about-number:nth-child(4) {
        min-height: 96px;
        margin: 0;
        padding: 14px;
        transform: none;
        border-radius: 13px;
    }
    .about-number strong { font-size: 30px; letter-spacing: -.04em; }
    .about-number span { margin-top: 5px; font-size: 10.5px; }

    .values-layout { grid-template-columns: 1fr; gap: 22px; }
    .values-intro h2 { margin-top: 15px; font-size: 25px; line-height: 1.2; letter-spacing: -.035em; }
    .values-intro p { margin-top: 13px; font-size: 14px; line-height: 1.75; }
    .values-grid { grid-template-columns: 1fr; gap: 8px; }
    .value-card {
        min-height: 0;
        padding: 17px 16px;
        grid-template-columns: 36px 1fr;
        gap: 5px 13px;
        align-items: start;
        border-radius: 13px;
    }
    .value-card span { width: 36px; height: 36px; font-size: 11.5px; }
    .value-card h3 { font-size: 17.5px; }
    .value-card p { margin-top: 7px; font-size: 12.5px; line-height: 1.7; }

    .growth-layout { grid-template-columns: 1fr; gap: 26px; }
    .growth-rings { max-width: 280px; margin-inline: auto; }
    .growth-rings__core { width: 80px; height: 80px; }
    .growth-rings__core strong { font-size: 19px; }
    .growth-year { padding: 5px 8px; font-size: 10px; }
    .growth-story h2 { margin-top: 14px; font-size: 25px; line-height: 1.2; letter-spacing: -.035em; }
    .growth-story__intro { margin-top: 12px; font-size: 14px; line-height: 1.75; }

    .timeline { margin-top: 20px; grid-template-columns: 1fr; }
    .timeline::before { left: 26px; }
    .timeline article,
    .timeline article + article { padding: 0 0 12px; grid-template-columns: 52px 1fr; gap: 12px; border: 0; }
    .timeline time { width: 52px; font-size: 10.5px; }
    .timeline time::after { left: 21px; }
    .timeline article > div { padding-bottom: 12px; }
    .timeline h3 { font-size: 16px; }
    .timeline p { margin-top: 5px; font-size: 12.5px; line-height: 1.7; }
}

/* ============================================================
   14. 平板：≤1024px 的两栏收敛
   ============================================================ */
@media (max-width: 1024px) {
    .hero-v3__grid { grid-template-columns: 1fr; gap: 48px; }
    .hero-v3 h1 { font-size: clamp(40px, 6.4vw, 56px); }
    .hero-v3__copy { font-size: 16px; }
    .problem-grid { grid-template-columns: repeat(2, 1fr); }
    .problem-grid::before { display: none; }
    .capability-panel { padding: 40px 34px; grid-template-columns: 1fr; gap: 30px; }
    .capability-explorer { grid-template-columns: 288px minmax(0, 1fr); }
    .site-footer__top { grid-template-columns: 1fr; }
}

/* ============================================================
   15. 小屏手机 ≤430px 精修
   ============================================================ */
@media (max-width: 430px) {
    .shell { width: calc(100% - 28px); }

    .hero-v3 { padding: 84px 0 42px; }
    .hero-v3 h1 { font-size: 30px; line-height: 1.16; }
    .hero-v3__copy { font-size: 14.5px; line-height: 1.78; }
    .hero-v3__actions .button { min-height: 50px; font-size: 14.5px; }

    /* 仅 360px 以下并排会明显拥挤，回退为纵向堆叠 */
    @media (max-width: 359px) {
        .hero-v3__actions { grid-template-columns: 1fr; }
        .hero-v3__actions .button { padding-inline: 18px; font-size: 15px; }
    }

    .hero-v3__proof li { padding: 13px 4px; }
    .hero-v3__proof strong { font-size: 21px; }
    .hero-v3__proof span { font-size: 10px; }

    .hero-showcase__stage { aspect-ratio: 1.5 / 1; }
    .hero-showcase__text strong { font-size: 15px; }
    .hero-showcase__bg { font-size: 12px; -webkit-line-clamp: 3; }

    .section-head h2 { font-size: 26px; }
    .section-head p { font-size: 14px; }

    .problem-card,
    .problem-card:nth-child(2),
    .problem-card:nth-child(5) { padding: 18px 17px 20px; }
    .problem-card h3 { font-size: 17px; }
    .problem-card p { font-size: 13px; }

    .capability-panel h3 { font-size: 20px; }
    .capability-panel__copy > p { font-size: 13.5px; }

    .case-carousel__track .case-card { flex: 0 0 100%; }
    .case-card h3 { font-size: 18px; }
    .case-card p,
    .library-section .case-card p { font-size: 12.5px; }

    .page-hero h1,
    .page-hero--compact h1,
    .detail-hero h1 { font-size: 26px; }

    .site-footer__cta h2,
    .detail-results__head h2,
    .detail-background__title h2,
    .values-intro h2,
    .growth-story h2 { font-size: 25px; }

    .detail-section-head h2 { font-size: 24px; }
    .detail-section h2 { font-size: 22px; }
    /* 左栏固定 100px，字号需收窄以免「100%」等长值溢出 */
    .detail-metric { grid-template-columns: 92px minmax(0, 1fr); gap: 13px; }
    .detail-metric__result strong { font-size: 27px; }
    .detail-metric__copy p { font-size: 13px; }
}

/* ============================================================
   16. 极窄屏 ≤360px 兜底
   ============================================================ */
@media (max-width: 360px) {
    .shell { width: calc(100% - 24px); }

    .site-header { height: 58px; }
    .brand img { height: 27px; }
    .nav-toggle { width: 40px; height: 40px; }

    .hero-v3 { padding: 78px 0 40px; }
    .hero-v3 h1 { font-size: 27px; }
    .hero-v3__proof strong { font-size: 19px; }
    .hero-v3__proof span { font-size: 9.5px; }

    .hero-showcase__stage { aspect-ratio: 1.42 / 1; }
    .hero-showcase__arrow { width: 32px; height: 32px; font-size: 13px; }
    .hero-showcase__pages { display: none; }

    .section-head h2 { font-size: 24px; }
    .problem-card h3 { font-size: 16.5px; }
    .problem-card p { font-size: 12.5px; line-height: 1.78; }

    .capability-panel { padding: 22px 16px 24px; }
    .capability-panel h3 { font-size: 19px; }

    .case-carousel__track .case-card,
    .case-grid,
    .library-section .case-grid,
    .problem-grid,
    .values-grid,
    .about-numbers { grid-template-columns: 1fr; }

    .site-footer__links { grid-template-columns: 1fr; }
    .footer-contact:last-child { grid-column: auto; }

    .detail-metric { grid-template-columns: 88px minmax(0, 1fr); gap: 12px; padding: 14px; }
    .detail-metric__result strong { font-size: 25px; }
    .detail-metric__copy p { font-size: 12.5px; }
}

/* ============================================================
   17. 横屏矮屏（手机横放）
   ============================================================ */
@media (max-width: 940px) and (orientation: landscape) and (max-height: 500px) {
    .hero-v3 { padding: 78px 0 34px; }
    .hero-v3 h1 { font-size: 28px; }
    .hero-v3__actions { margin-top: 18px; }
    .hero-v3__proof { margin-top: 20px; }
    .site-header { height: 56px; }
}

/* ============================================================
   语言切换分段控件（移动端抽屉内全宽）—— max-width:1024px 内生效
   ============================================================ */
@media (max-width: 1024px) {
    .site-nav .lang-seg { display: flex; width: calc(100% - 16px); margin: 14px 8px 0; border: 1px solid rgba(19, 21, 26, .1); border-radius: 11px; overflow: hidden; background: #fff; }
    .site-nav .lang-seg a { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 0; font-size: 14.5px; font-weight: 700; color: rgba(19, 21, 26, .65); text-decoration: none; }
    .site-nav .lang-seg a + a { border-left: 1px solid rgba(19, 21, 26, .08); }
    .site-nav .lang-seg a.on { background: rgba(122, 79, 242, .1); color: #4f34d8; box-shadow: none; }
    .site-nav .lang-seg + .button { margin-top: 10px; }
}

/* ============================================================
   语言切换分段控件（移动端抽屉内全宽）—— max-width:1024px 内生效
   ============================================================ */
@media (max-width: 1024px) {
    .site-nav .lang-seg { display: flex; width: calc(100% - 16px); margin: 14px 8px 0; border: 1px solid rgba(19, 21, 26, .1); border-radius: 11px; overflow: hidden; background: #fff; }
    .site-nav .lang-seg a { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 0; font-size: 14.5px; font-weight: 700; color: rgba(19, 21, 26, .65); text-decoration: none; }
    .site-nav .lang-seg a + a { border-left: 1px solid rgba(19, 21, 26, .08); }
    .site-nav .lang-seg a.on { background: rgba(122, 79, 242, .1); color: #4f34d8; box-shadow: none; }
    .site-nav .lang-seg + .button { margin-top: 10px; }
}
