/* ===== HUCA software sec2 — stack diagram (--scale-ratio) ===== */
.software-sec2 {
    position: relative;
    margin-top: calc(-153 * var(--rpx));
    padding: 0 0 calc(80 * var(--rpx));
    background: #FAFCFD;
    overflow: visible;
}

.software-sec2 .wrapper {
    position: relative;
    z-index: 1;
}

.software-sec2 .sec2-header {
    padding-top: calc(90 * var(--rpx));
}

.software-sec2 .sec2-title {
    margin: 0;
    font-size: calc(58 * var(--fpx-50));
    font-weight: 600;
    line-height: calc(68 / 58);
}

.software-sec2 .sec2-desc {
    margin: calc(16 * var(--rpx)) 0 0;
    max-width: calc(640 * var(--rpx));
    font-size: calc(24 * var(--fpx));
    font-weight: 600;
    line-height: calc(30 / 24);
}

/*
 * 图示整体：左侧底图(组合 1022) + 连线(组合 1024) + 右侧图表(组合 1023)
 * --design-w = wrapper-width @1920 = 1600px
 * 坐标原点 = 图表区左上 page(160,1292)
 * stack-base 组合 1022 · page(315,1352) → wrapper(155,60) · 414×612
 * curve     组合 1024 · page(659,1337) → wrapper(499,45) · 250×591
 * diagram   组合 1023 · page(905,1292) → wrapper(745,0) · 855×682（资源按 855×683）
 */
.software-stack--diagram {
    container-type: inline-size;
    box-sizing: border-box;
    width: 100%;
    margin-top: calc(40 * var(--rpx));
    --design-w: 1600;
    --design-h: 683;
}

.software-stack--diagram .software-stack__scale {
    --scale-ratio: calc(100cqw / (var(--design-w) * 1px));
    box-sizing: border-box;
    position: relative;
    width: 100%;
    height: calc(var(--design-h) * 1px * var(--scale-ratio));
    overflow: visible;
}

/* 组合 1022 — page(315,1352) → wrapper(155,60) · 414×612 */
.stack-base {
    position: absolute;
    left: calc(155px * var(--scale-ratio));
    top: calc(60px * var(--scale-ratio));
    z-index: 1;
    display: block;
    width: calc(414px * var(--scale-ratio));
    height: calc(612px * var(--scale-ratio));
    max-width: none;
    object-fit: contain;
    pointer-events: none;
}

/* 曲线 组合 1024 — page(659,1337) → wrapper(499,45) · 250×591（含左右端点）
 * 右侧 8px 端点中心落在组合 1023 左缘，需叠在右图之上，否则会被盖住一半 */
.stack-curve-layer {
    position: absolute;
    left: calc(499px * var(--scale-ratio));
    top: calc(45px * var(--scale-ratio));
    z-index: 4;
    width: calc(250px * var(--scale-ratio));
    height: calc(591px * var(--scale-ratio));
    pointer-events: none;
}

.stack-curve {
    display: block;
    width: 100%;
    height: 100%;
    /* 资源已裁切为 500×1182（= 设计 250×591 @2x），与容器同比例，避免 fill 拉伸偏移端点 */
    object-fit: contain;
}

/* 组合 1023 — page(905,1292) → wrapper(745,0) · 855×683（导出图） */
.stack-diagram {
    position: absolute;
    left: calc(745px * var(--scale-ratio));
    top: 0;
    z-index: 3;
    width: calc(855px * var(--scale-ratio));
    height: calc(683px * var(--scale-ratio));
}

.stack-diagram-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: fill;
    pointer-events: none;
}

@media (max-width: 767px) {
    .software-sec2 {
        margin-top: calc(-80 * var(--rpx));
        padding-bottom: calc(48 * var(--rpx));
    }

    .software-sec2 .sec2-header {
        padding-top: calc(48 * var(--rpx));
    }

    .software-sec2 .sec2-title {
        font-size: calc(32 * var(--fpx));
    }

    .software-sec2 .sec2-desc {
        max-width: none;
        font-size: calc(16 * var(--fpx));
        line-height: calc(24 / 16);
    }

    .software-stack--diagram {
        margin-top: calc(24 * var(--rpx));
        overflow: visible;
        --mobile-stack-scale: calc(100cqw / (860 * 1px));
    }

    .software-stack--diagram .stack-curve-layer {
        display: none;
    }

    .software-stack--diagram .software-stack__scale {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: calc(24 * var(--rpx));
        width: 100%;
        height: auto;
        min-height: 0;
        --scale-ratio: var(--mobile-stack-scale);
    }

    .software-stack--diagram .stack-base {
        position: static;
        display: block;
        order: 1;
        flex-shrink: 0;
        width: 72%;
        max-width: none;
        height: auto;
        margin: 0;
        aspect-ratio: 414 / 612;
        object-fit: contain;
    }

    .software-stack--diagram .stack-diagram {
        position: relative;
        order: 2;
        flex-shrink: 0;
        left: auto;
        top: auto;
        width: 100%;
        height: auto;
        aspect-ratio: 855 / 683;
        margin-top: 0;
    }
}