/* 通用产品/解决方案 banner：左侧文字 + 背景图撑满 */
.product-hero,
.solution-hero {
    position          : relative;
    height            : 440px;
    background-color  : #fff;
    background-position: center;
    background-size   : cover;
    background-repeat : no-repeat;
    overflow          : hidden
}

.product-hero .hero-bg,
.solution-hero .hero-bg {
    position: absolute;
    inset   : 0;
    width   : 100%;
    height  : 100%;
    z-index : 0;
    background-color : #fff;
    background-position: 64% center;
    background-size  : cover;
    background-repeat: no-repeat
}

.product-hero .hero-text,
.solution-hero .hero-text {
    position        : relative;
    z-index         : 1;
    display         : flex;
    flex-direction  : column;
    justify-content : center;
    width           : 50%;
    font-weight     : 500;
    max-width       : 50%;
    height          : 100%;
    box-sizing      : border-box;
    padding         : 0 40px 0 max(24px, calc((100% - var(--wj-container, 1200px)) / 2));
    color           : var(--wj-text)
}

.product-hero .hero-title,
.solution-hero .hero-title {
    font-size    : 40px;
    font-weight  : 500;
    line-height  : 1.2;
    margin       : 0 0 30px;
    color        : var(--wj-text)
}

.product-hero .hero-sub,
.solution-hero .hero-sub {
    font-size    : 15px;
    line-height  : 2.0;
    color        : var(--wj-text);
    margin       : 0
}

@media(max-width:900px) {

    .product-hero,
    .solution-hero {
        height: 330px
    }

    .product-hero .hero-text,
    .solution-hero .hero-text {
        width    : 72%;
        max-width: 72%;
        padding  : 0 24px 0 max(24px, calc((100% - var(--wj-container, 1200px)) / 2))
    }

    .product-hero .hero-title,
    .solution-hero .hero-title {
        font-size: 24px;
        margin   : 0 0 12px
    }

    .product-hero .hero-sub,
    .solution-hero .hero-sub {
        font-size  : 13px;
        line-height: 1.6
    }
}

@media(max-width:600px) {

    .product-hero,
    .solution-hero {
        height: 230px
    }

    .product-hero .hero-text,
    .solution-hero .hero-text {
        width     : 72%;
        max-width : 72%;
        padding   : 0 16px 0 16px
    }

    .product-hero .hero-title,
    .solution-hero .hero-title {
        font-size  : 19px;
        line-height: 1.25;
        margin     : 0 0 8px
    }

    .product-hero .hero-sub,
    .solution-hero .hero-sub {
        font-size  : 12px;
        line-height: 1.55
    }
}

/* 超小屏手机：进一步放宽左侧文字区域并缩小字号 */
@media(max-width:400px) {

    .product-hero .hero-text,
    .solution-hero .hero-text {
        width    : 82%;
        max-width: 82%;
        padding  : 0 12px
    }

    .product-hero .hero-title,
    .solution-hero .hero-title {
        font-size: 17px
    }

    .product-hero .hero-sub,
    .solution-hero .hero-sub {
        font-size  : 11px;
        line-height: 1.5
    }
}