/* ============================================
   Banner 首屏轮播模块
   ============================================ */

.banner {
    position: relative;
    width: 100%;
    /* PC：保持 1920:940 比例（随宽度自适应高度），不写死 940px */
    aspect-ratio: 1920 / 940;
    height: auto;
    overflow: hidden;
}

/* 旧浏览器兜底：不支持 aspect-ratio 时用 padding-top 保持比例 (940/1920=48.9583%) */
@supports not (aspect-ratio: 1 / 1) {
    .banner::before {
        content: "";
        display: block;
        padding-top: 48.9583%;
    }
    .indexbanner,
    .indexbanner__slider,
    .banner__overlay {
        position: absolute;
        inset: 0;
        height: 100%;
        width: 100%;
    }
}

/* H5: Banner 高度调整为 8rem */
@media screen and (max-width: 768px) {
    .banner {
        aspect-ratio: auto;
        height: 8rem;
    }
}

.indexbanner {
    position: relative;
    width: 100%;
    height: 100%;
}

.indexbanner__slider {
    position: relative;
    width: 100%;
    height: 100%;
}

.indexbanner__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.9s ease-in-out;
}

.indexbanner__slide.is-active {
    opacity: 1;
    z-index: 1;
}

.indexbanner__image {
    width: 100%;
    object-fit: cover;
    display: block;
}

.banner__overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
}

.banner__overlay-inner {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner__text-block {
    display: flex;
    align-items: center;
    gap: 80px;
    color: #ffffff;
}

@media screen and (max-width: 768px) {
    .banner__overlay-inner {
        padding-right: 0.5rem;
        align-items: unset;
        padding-top: 1.4rem;
    }

    .banner__text-block {
        flex-direction: column;
        gap: 0.2rem;
    }

    h1.banner__title {
        width: 2.8rem;
        font-size: 0.7rem;
        font-weight: bold;
    }

    .banner__subtitle {
        width: 2.8rem;
        font-size: 0.16rem;
    }

    .banner__subtitle--pc {
        display: none;
    }

    .banner__subtitle--h5 {
        display: block;
    }

    /* H5：右侧侧边文案固定在右边，避免遮挡正文 */
    div.banner__side {
        right: 0.16rem;
        top: auto;
    }

    div.banner__side--right {
        justify-content: space-between;
        right: 0.16rem;
        width: 18px;
        white-space: nowrap;
        height: 3.15rem;
        transform: rotate(180deg);
        transform-origin: center;
    }

    span.banner__scroll-text {
        font-size: 0.14rem;
        letter-spacing: 0.05em;
        color: #ffffff;
        display: inline-block;
        transform: rotate(180deg);
    }

    div.banner__scroll::after {
        top: unset;
        bottom: -0.12rem;
    }

    html[lang="en"] h1.banner__title {
        font-size: 0.55rem;
        width: 3rem;
    }

    html[lang="ja"] h1.banner__title {
        font-size: 0.6rem;
        width: 3rem;
    }

    /* h5 banner结束 */
}

.banner__title {
    font-size: 120px;
    line-height: 1.2;
    font-weight: 700;
    font-family: 'Noto Sans SC', 'Noto Sans CJK SC', 'Noto Sans Simplified Chinese', system-ui, -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    white-space: pre-line;
}

/* 英文时：首页 Banner 标题字号与宽度调整 */
html[lang="en"] .banner__title {
    font-size: 120px;
    width: 500px;
}

/* 日文时：首页 Banner 标题字号调整 */
html[lang="ja"] .banner__title {
    font-size: 100px;
}

.banner__subtitle {
    font-family: 'Noto Sans SC', 'Noto Sans CJK SC', 'Noto Sans Simplified Chinese', system-ui, -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    width: 480px;
    font-size: 16px;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.86);
}



/* 兜底：在 H5 强制显示，避免被其它规则覆盖导致看不到 */
@media screen and (max-width: 768px) {
    p.banner__subtitle {
            width: 2.8rem;
    }
   
}

.banner__side {
    position: absolute;
    top: 50%;
    right: -45px;
    transform: translateY(-50%) rotate(180deg);
    transform-origin: center;
}

.banner__side--right {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    height: 481px;
}


/* 默认：用旋转做一个兼容的竖排，保证老内核浏览器也正常 */
.banner__side-text {
    font-size: 16px;
    color: #D9D9D9;
    display: inline-block;
    transform: rotate(90deg);
    transform-origin: center;
    opacity: 0.7;
}



/* 兼容部分安卓老浏览器（如 OPPO 自带浏览器）的小屏布局：
   不依赖 writing-mode，仅用绝对定位和旋转控制位置与方向 */
@media screen and (max-device-width: 768px) {
    .banner__side {
        bottom: 1.3rem;
    }

    .banner__side--right {
        justify-content: space-between;
        right: 0.16rem;
    }

    .banner__side-text {
        display: inline-block;
        transform: rotate(90deg);
        transform-origin: center;
    }
}

.banner__scroll {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.banner__scroll-text {
    font-size: 16px;
    letter-spacing: 0.05em;
    color: #ffffff;
    display: inline-block;
    /* 退化方案：仅靠旋转实现竖排，避免依赖 writing-mode */
    transform: rotate(180deg);
}

/* 现代浏览器（含新 Safari）支持 writing-mode 时，可以增强为真正竖排 */
@supports (writing-mode: vertical-rl) {
    .banner__scroll-text {
        writing-mode: vertical-rl;
        text-orientation: mixed;
    }
}

.banner__scroll::after {
    content: "";
    margin-top: 8px;
    width: 1px;
    height: 30px;
    background-color: #333333;
}


/* ============================================
   About 关于我们模块
   ============================================ */

.about {
    position: relative;
    background: #D9D9D9;
    color: #14151a;
    padding: 160px 0;
}

@media screen and (max-width: 768px) {
    #about {
        height: auto;
        padding: 0;
    }

    figure.about__image-card {
        width: 100%;
        bottom: 0;
        left: 0;
    }

    p.about__eyebrow-floating {
        font-size: 1rem;
        font-weight: 900;
        right: -0.08rem;
        top: -0.16rem;
    }

    div.about__layout {
        margin-top: 0.2rem;
        width: 3.3rem;
    }

    a.about__more-btn {
        display: block;
        line-height: 0.5rem;
        width: fit-content;
        height: 0.5rem;
    }
}

.about__inner {
    position: relative;
    display: flex;
    flex-direction: column;
    z-index: 2;
}

.about__header .section__eyebrow {
    color: #8b8f9b;
}

.about__layout {
    width: 484px;
    margin-top: 40px;
}

.about__content-block {
    margin-bottom: 20px;
}

.about__text {
    color: #444655;
    font-family: 'PingFang SC';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 180%;
}

.about__more-btn,
.services__more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    padding: 0 36px;
    border-radius: 0;
    border: none;
    font-family: 'PingFang SC';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    background: transparent;
}

/* About / 成为一员：左侧灰色小方块 -> 橙色长条 */
.about__more-btn {
    color: #222222;
}

.about__more-btn::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 50px;
    height: 100%;
    background-color: #C4C4C4;
    z-index: -1;
    transition: width 0.5s cubic-bezier(0.19, 1, 0.22, 1),
        background-color 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.about__more-btn:hover::before {
    width: 100%;
    /* 拉伸为整条 */
    background-color: #FF7B00;
    /* 变为橙色长方形 */
}

.about__more-btn {
    position: relative;
    z-index: 0;
    /* 创建独立 stacking context，文字会画在 ::before 之上 */
    transition: color 0.3s ease;
}

.about__more-btn:hover {
    color: #FFFFFF;
}

/* Services：左侧深灰小方块 -> 白色长条，文字从浅灰 -> 深色 */
.services__more {
    color: #D9D9D9;
}

.services__more::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 50px;
    /* 初始深灰小方块 */
    height: 100%;
    background-color: #313131;
    z-index: -1;
    transition: width 0.5s cubic-bezier(0.19, 1, 0.22, 1),
        background-color 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.services__more {
    position: relative;
    z-index: 0;
    transition: color 0.3s ease;
}

.services__more:hover::before {
    width: 100%;
    background-color: #FFFFFF;
}

.services__more:hover {
    color: #161616;
}

.about__image-card {
    position: absolute;
    z-index: 5;
    width: 620px;
    bottom: -38px;
    left: 50%;
    pointer-events: none;
}

.about__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about__eyebrow-floating {
    position: absolute;
    top: -35px;
    right: -40px;
    z-index: 1;
    font-family: 'system-ui';
    font-style: normal;
    font-weight: 900;
    font-size: 260px;
    background: linear-gradient(0, #8B8B8B 0%, rgba(139, 139, 139, 0.5) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    opacity: .1;
}

.stats {
    background: transparent;
    color: var(--color-text-main);
}

@media (max-width: 768px) {
    section.stats {
        padding: 0.6rem 0;
        height: 3.4rem;
    }

    dl.about__metrics {
        width: 3.34rem;
        height: 2.34rem;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }

    div.about__metric {
        flex: 0 0 50%;
        padding: 0;
        margin-bottom: 0.1rem;
    }

    .stats__inner div.about__metric::after {
        height: 0.28rem;
    }

    dt.about__metric-value {
        display: flex;
        justify-content: center;
        font-size: 0.58rem;
        margin-bottom: .1rem;
    }


    dt.about__metric-value::after {
        font-size: 0.28rem;
    }

    /* H5 统计：偶数项（第 2、4 项）去掉右侧分隔线 */
    div.about__metric:nth-child(2n)::after {
        content: none;
    }

    dd.about__metric-label {
        font-size: 0.16rem;
        letter-spacing: 0;
        font-family: 'PingFang SC';
        font-style: normal;
        font-weight: 600;
        line-height: 180%;
        color: #D9D9D9;
    }
}

.stats__inner {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.about__metrics {
    width: 960px;
    margin: 0 auto;
    height: 270px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.about__metric {
    position: relative;
    flex: 1 1 0;
    text-align: center;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.about__metric-value {
    font-size: 72px;
    height: 72px;
    font-weight: 700;
    color: var(--color-orange);
    position: relative;
    display: inline-flex;
    align-items: center;
    font-family: 'system-ui';
}

.about__metric-label {
    font-family: 'PingFang SC';
    color: #D9D9D9;
    font-size: 16px;
    height: 60px;
    display: flex;
    white-space: pre-line;
    /* text-transform: uppercase; */
    align-items: center;
}

/* PC 英文时：指标标签字号调小为 13px */
@media (min-width: 769px) {
    html[lang="en"] .about__metric-label {
        font-size: 14px;
    }
}

/* 数值右侧/左侧符号（+、%、≤）使用伪元素，符号不加粗 */
.about__metric-value::after {
    content: attr(data-symbol);
    font-weight: 400;
    font-size: 34px;
    margin-left: 8px;
    line-height: 1;
    display: inline-block;
}

.about__metric-value::before {
    content: attr(data-prefix);
    font-weight: 400;
    font-size: 34px;
    margin-right: 10px;
    line-height: 1;
    display: inline-block;
}

/* Stats 中间分隔竖线（伪元素），不单独加 DOM */
.about__metric:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) skewX(-20deg);
    transform-origin: center;
    height: 40px;
    opacity: 0.2;
    border: 1px solid #D8D3CD;
    background: transparent;
}

/* ============================================
   Services 业务内容模块（1:1 视觉布局）
   ============================================ */
.services {
    position: relative;
    color: #ffffff;
    margin-bottom: 120px;
}

.services::before {
    content: "Services";
    position: absolute;
    top: -110px;
    left: -70px;
    font-family: 'system-ui';
    font-weight: 900;
    font-size: 260px;
    color: rgba(255, 255, 255, 0.03);
    pointer-events: none;
    white-space: nowrap;
    background: linear-gradient(90deg, #8B8B8B 0%, rgba(139, 139, 139, 0.5) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    opacity: 0.05;
}

.services__inner {
    position: relative;
    z-index: 1;
}

.services__top {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    margin-bottom: 140px;
}

.services__eyebrow {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 52px;
    font-weight: 600;
    font-family: 'PingFang SC';
    background: linear-gradient(90deg, #D9D9D9 0%, rgba(217, 217, 217, 0.1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}

.services__copy-block {
    max-width: 484px;
    text-align: left;
}

.services__copy {
    font-size: 16px;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.8);
}

.services__more {
    margin-top: 22px;
}

.services__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

.service-visual-card {
    position: relative;
    width: 380px;
    height: 480px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.service-visual-card__overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    font-weight: 600;
    font-size: 36px;
    /* line-height: 100%; */
}

.service-visual-card__title {
    font-size: 22px;
    color: #ffffff;
    text-align: center;
    text-shadow: 0 8px 24px rgba(0, 0, 0, 0.8);
    white-space: nowrap;
}

/* 服务卡片背景图片 */
.service-visual-card--architecture {
    background-image: url("../images/index/services-architecture.png");
}

.service-visual-card--app {
    margin-top: 40px;
    background-image: url("../images/index/services-app-dev.png");
}

.service-visual-card--planning {
    margin-top: 80px;
    background-image: url("../images/index/services-product-planning.png");
}

/* ============================================
   首页跑马灯文字模块
   ============================================ */

.index-marquee {
    padding: 20px 0;
    overflow: hidden;
}

.index-marquee__inner {
    position: relative;
    margin: 0 auto;
}

/* 跑马灯上方蒙层：左右渐变遮罩，中间透出文字 */
.index-marquee__inner::before {
    content: "";
    position: absolute;
    inset: 0;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg,
            rgba(24, 24, 24, 0.9) 5%,
            rgba(24, 24, 24, 0) 50%,
            rgba(24, 24, 24, 0.9) 95%);
}

.index-marquee__row {
    overflow: hidden;
    white-space: nowrap;
    font-family: 'Noto Sans SC', 'Noto Sans CJK SC', 'Noto Sans Simplified Chinese', system-ui, -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    font-weight: bold;
}

.index-marquee__row--top .index-marquee__item {
    /* 顶部跑马灯：用 up.svg 替代文字 */
    color: transparent;
    font-size: 0;
    line-height: 0;
}

.index-marquee__row--top .index-marquee__img {
    height: 118px;
    width: auto;
    vertical-align: middle;
}

.index-marquee__row--bottom {
    /* 底部跑马灯 */
    margin-top: 40px;
    opacity: 1;
}

.index-marquee__row--bottom .index-marquee__item {
    /* 底部跑马灯：用 down.svg 替代文字 */
    color: transparent;
    font-size: 0;
    line-height: 0;
    -webkit-text-stroke: none;
    text-stroke: none;
}

.index-marquee__row--bottom .index-marquee__img {
    width: auto;
    vertical-align: middle;
}

.index-marquee__track {
    display: inline-flex;
    gap: 80px;
}

.index-marquee__item {
    font-size: 118px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
    font-weight: bold;
}

.index-marquee__img--pc {
    display: block;
}

.index-marquee__img--h5 {
    display: none;
}

@media (max-width: 768px) {

    /* H5：跑马灯字号缩小 / SVG 高度 */
    .index-marquee__item {
        font-size: 66px;
    }

    .index-marquee__row--top .index-marquee__img,
    .index-marquee__row--bottom .index-marquee__img {
        height: 66px;
    }

    /* H5：只显示 *_h5 图 */
    .index-marquee__img--pc {
        display: none;
    }

    .index-marquee__img--h5 {
        display: block;
    }

    /* H5：父容器去掉上下 padding，使高度更贴近文字本身 */
    .index-marquee {
        padding-bottom: 0;
    }

    /* H5：行高设为 1，避免额外的行间距撑高 */
    .index-marquee__row {
        line-height: 0; /* 去掉行盒额外高度（66px 以图片高度为准） */
        margin-top: 0;
    }

    /* H5：上下两条跑马灯间距固定 22px */
    .index-marquee__row--bottom {
        margin-top: 22px;
    }

    /* H5：按钮常驻 hover 视觉（手机无 hover） */
    .about__more-btn {
        color: #FFFFFF;
    }
    .about__more-btn::before {
        width: 100%;
        background-color: #FF7B00;
    }

    .services__more {
        color: #161616;
    }
    .services__more::before {
        width: 100%;
        background-color: #FFFFFF;
    }

    .contact__circle {
        transform: scale(0.77);
        background: var(--color-orange);
    }
}

.index-marquee__track--left {
    animation: marquee-left 70s linear infinite;
}

.index-marquee__track--right {
    transform: translateX(-50%);
    animation: marquee-right 70s linear infinite;
}

@media (max-width: 768px) {

    .index-marquee__track--right {
        transform: translateX(-50%);
        animation: marquee-right-mobile 70s linear infinite;
    }

    @keyframes marquee-right-mobile {
        0% {
            transform: translateX(-50%);
        }

        100% {
            transform: translateX(0);
        }
    }
}

@keyframes marquee-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

@keyframes marquee-right {
    0% {
        transform: translateX(-5800px);
    }

    100% {
        transform: translateX(calc(-5800px + 50%));
    }
}

/* ============================================
   Workflow 构建方式模块（1:1 视觉布局）
   ============================================ */

.workflow {
    position: relative;
    color: #ffffff;
    overflow: hidden;
    padding: 160px 0 200px;
}

.workflow::before {
    content: "Workflow";
    position: absolute;
    top: 80px;
    right: -60px;
    font-family: 'system-ui';
    font-weight: 900;
    font-size: 260px;
    line-height: 1;
    pointer-events: none;
    white-space: nowrap;
    background: linear-gradient(90deg, rgba(139, 139, 139, 0.5) 0%, #8B8B8B 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    opacity: 0.1;
}

.workflow__inner {
    position: relative;
    z-index: 1;
}

.workflow__header {
    margin-bottom: 80px;
}

.workflow__title-block {
    display: inline-flex;
    flex-direction: column;
    gap: 4px;
}

.workflow__title {
    font-family: 'PingFang SC';
    font-size: 52px;
    font-weight: 600;
    background: linear-gradient(90deg, #FFFFFF 0%, #707070 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.workflow__steps {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    padding-bottom: 26px;
    position: relative;
}

/* 底部分隔横线，使用外层盒子伪元素实现 */
.workflow__steps::after {
    content: "";
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    /* 横线拉满整个视口宽度 */
    height: 1px;
    background: rgba(255, 255, 255, 0.18);
    pointer-events: none;
}

.workflow-step {
    flex: 1 1 0;
    padding-right: 16px;
    background: transparent;
    border: none;
}

.workflow-step__title {
    font-size: 22px;
    color: var(--color-orange);
    margin-bottom: 60px;
}

.workflow-step__text {
    font-size: 16px;
    line-height: 1.8;
    color: #D9D9D9;
}

/* ============================================
   Partnership 合作模块
   ============================================ */

.partnership {
    position: relative;
    background: #D9D9D9;
    color: #14151a;
    padding: 180px 0 0;
    z-index: 10;
}

.partnership__inner {
    display: flex;
    flex-direction: column;
    height: 748px;
    gap: 40px;
}

.partnership__layout {
    position: relative;
}

.partnership__list {
    display: flex;
    flex-direction: column;
    gap: 50px;
    position: relative;
    z-index: 1;
}

.partnership-item {
    position: relative;
    display: flex;
    gap: 98px;
    width: 100%;
    border: none;
    background: transparent;
    text-align: left;
}


.partnership-item__number-image {
    display: block;
    width: 178px;
    height: 117px;
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.partnership-item__content {
    display: flex;
    align-items: center;
    gap: 4px;
}

.partnership-item__label {
    font-family: 'PingFang SC';
    display: block;
    font-size: 36px;
    line-height: 50px;
    font-weight: 600;
    color: #181818;
    white-space: nowrap;
}

/* 仅 PC + 英文：第 4 条 label 右半变白 */
html[lang="en"] .partnership-item[data-partnership="4"].is-active .partnership-item__label,
html[lang="en"] .partnership-item[data-partnership="4"]:hover .partnership-item__label {
    background: linear-gradient(90deg, #181818 0 86.5%, #FFFFFF 50% 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
/* 仅 PC + 英文：第 4 条 label 右半变白 */
html[lang="ja"] .partnership-item[data-partnership="4"].is-active .partnership-item__label,
html[lang="ja"] .partnership-item[data-partnership="4"]:hover .partnership-item__label {
    background: linear-gradient(90deg, #181818 0 77.2%, #FFFFFF 50% 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* PC：当第 3 条 hover 时，第 4 条 label 右上角局部变白（用于避开图片遮挡） */
/* @media (min-width: 769px) {
    .partnership-item[data-partnership="3"]:hover
        ~ .partnership-item[data-partnership="4"]
        .partnership-item__label {
        background-image:
            linear-gradient(#181818, #181818),
            linear-gradient(#FFFFFF, #FFFFFF);
        background-size: 100% 100%, 22% 50%;
        background-position: 0 0, 100% 0;
        background-repeat: no-repeat;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
    }
} */

.partnership-item__text {
    position: relative;
    font-size: 36px;
    padding-left: 70px;
    font-weight: 600;
    line-height: 50px;
    color: #181818;
    opacity: 0;
    transition: opacity 0.25s ease;
}

.partnership-item__text::before {
    content: "";
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 3px;
    background-color: currentColor;
}
.partnership-item__body{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.partnership-item__text::after {
    /* 复制一份与正文一致的文字，放在更高层级，仅显示图片覆盖范围内的部分 */
    content: attr(data-text);
    position: absolute;
    inset: 0;
    padding-left: 70px;
    font: inherit;
    color: #D9D9D9;
    /* 在覆盖文字自身外侧加一层浅色描边，完全盖住底层的深色轮廓 */
    -webkit-text-stroke-width: .4px;
    -webkit-text-stroke-color: #D9D9D9;
    z-index: 2;
    opacity: 0;
    clip-path: inset(0 0 0 154px);
    pointer-events: none;
}

/* PC：第 4 条覆盖文字裁剪范围单独调整 */
.partnership-item[data-partnership="4"] .partnership-item__text::after {
    clip-path: inset(0 0 0 190px);
}


.partnership-item.is-active .partnership-item__number-image,
.partnership-item:hover .partnership-item__number-image {
    opacity: 1;
}

.partnership-item__subtitle {
    font-family: 'Noto Sans SC', 'Noto Sans CJK SC', 'Noto Sans Simplified Chinese', system-ui, -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    display: flex;
    align-items: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #666666;
    margin-bottom: 10px;
}

.partnership__header {
    position: relative;
    z-index: 1;
}

.partnership__header::before {
    content: "Partnership";
    position: absolute;
    top: -120px;
    left: -430px;
    font-family: 'system-ui';
    font-style: normal;
    font-weight: 900;
    font-size: 260px;
    line-height: 100%;
    display: flex;
    align-items: center;
    text-align: center;
    background: linear-gradient(90deg, #8B8B8B 0%, rgba(139, 139, 139, 0.5) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    opacity: 0.1;
    pointer-events: none;
    white-space: nowrap;
}

.partnership-item.is-active .partnership-item__text,
.partnership-item:hover .partnership-item__text {
    opacity: 1;
    /* 高亮态：让底层深色文字透明，避免与覆盖文字交界处出现黑线 */
    /* color: transparent; */
}

.partnership-item.is-active .partnership-item__text::after,
.partnership-item:hover .partnership-item__text::after {
    opacity: 1;
}

/* 英文时：合作模式覆盖文字的裁剪范围微调 */
html[lang="en"] .partnership-item__text::after {
    clip-path: inset(0 0 0 123px);
}

/* 英文时：第二、第三条合作模式单独微调裁剪范围 */
html[lang="en"] .partnership-item[data-partnership="2"] .partnership-item__text::after {
    clip-path: inset(0 0 0 60px);
}

html[lang="en"] .partnership-item[data-partnership="3"] .partnership-item__text::after {
    clip-path: inset(0 0 0 0);
}

html[lang="en"] .partnership-item[data-partnership="3"] .partnership-item__text::before {
    background-color: #D9D9D9;
}
html[lang="en"] .partnership-item[data-partnership="4"] .partnership-item__text::before {
    background-color: #D9D9D9;
}
html[lang="en"] .partnership-item[data-partnership="4"] .partnership-item__text::after {
    clip-path: inset(0 0 0 0);
}

/* 日文时：第一、第二条合作模式裁剪范围调整 */
html[lang="ja"] .partnership-item[data-partnership="1"] .partnership-item__text::after,
html[lang="ja"] .partnership-item[data-partnership="2"] .partnership-item__text::after {
    clip-path: inset(0 0 0 82px);
}
html[lang="ja"] .partnership-item[data-partnership="4"] .partnership-item__text::before {
    background-color: #D9D9D9;
}
html[lang="ja"] .partnership-item[data-partnership="4"] .partnership-item__text::after {
    clip-path: inset(0 0 0 0);
}
.partnership__visual {
    position: absolute;
    right: -74px;
    top: 0;
    width: 700px;
    height: 440px;
    pointer-events: none;
    transform: translateY(var(--partnership-visual-offset, 0px));
    transition: transform 0.45s;
    will-change: transform;
}

.partnership__image-stack {
    position: relative;
    width: 700px;
    height: 440px;
}

.partnership__image {
    position: absolute;
    top: 0;
    right: 0;
    width: 700px;
    height: 440px;
    object-fit: cover;
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 0.45s ease, transform 0.45s cubic-bezier(0.19, 1, 0.22, 1);
}

.partnership__image.is-active {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 768px) {

    /* H5：隐藏右侧合作视觉图 */
    .partnership__visual {
        display: none;
    }

    .section.contact {
        height: auto;
        padding: 8rem 0 0;
    }

    .partnership {
        padding-top: 1.2rem;
    }

    .partnership__header::before {
        content: "Partner";
        font-size: 1rem;
        top: -0.8rem;
        left: -0.4rem;
    }

    .partnership__inner {
        height: auto;
    }

    .partnership__list {
        gap: 0.6rem;
    }

    /* H5：partnership-item 无 PC 交互，全部内容直接展示 */
    .partnership-item {
        cursor: default;
        pointer-events: none;
        gap: 0.23rem;
        margin-bottom: 0;
    }

    .partnership-item__body {
        display: block;
    }

    .partnership-item__content {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.14rem;
    }

    .partnership-item__number {
        opacity: 1;
    }

    .partnership-item__number-image {
        width: 0.62rem;
        height: .4rem;
    }

    .partnership-item__subtitle {
        margin-bottom: 0.07rem;
    }

    .partnership-item__label {
        font-size: 0.22rem;
        line-height: 1;
    }

    .partnership-item__text {
        font-size: 0.18rem;
        padding-left: 0;
        opacity: 1;
        line-height: 1.4;
    }

    .partnership-item__text::before,
    .partnership-item__text::after {
        content: none;
    }

    section.career {
        height: auto;
    }

    header.career__header {
        padding: 1.4rem 0 1.2rem;
    }

    div.career__nav {
        display: none;
    }

    #career div.career__flex {
        flex-direction: column;
        right: auto;
        bottom: -8.34rem;
        width: calc(100% - 60px);
        gap: 0.3rem;
        left: 50%;
        transform: translateX(-50%);
    }

    header.career__header::before {
        font-size: 1rem
    }
}



/* ============================================
   Career & Works 模块
   ============================================ */
.career {
    position: relative;
    background: #D9D9D9;
    margin-top: -1px;
    height: 672px;
    width: 100%;
}

.career__header {
    padding-top: 256px;
}

.career__nav {
    position: absolute;
    top: 160px;
    right: 266px;
    display: flex;
    gap: 16px;
    z-index: 2;
}

.career__nav-btn {
    width: 60px;
    height: 60px;
    border: none;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    cursor: pointer;
    border: 1px solid #181818;
    /* 使用自定义箭头，不再依赖文本字符 */
    font-size: 0;
    line-height: 0;
    position: relative;
    transition: background-color 0.25s ease, color 0.25s ease;
}

/* PC：左右切换箭头，宽 8px，高 14px */
.career__nav-btn::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 10px;
    border-style: solid;
    border-width: 0 0 0 0;
    /* 具体边在子类里设置 */
    transform-origin: center;
}

.career__nav-btn--prev::before {
    border-left-width: 1px;
    border-top-width: 1px;
    border-color: #181818;
    transform: translate(-25%, -50%) rotate(-45deg);
}

.career__nav-btn--next::before {
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-color: #181818;
    transform: translate(-75%, -50%) rotate(-45deg);
}

.career__nav-btn:hover {
    background-color: #181818;
}

.career__nav-btn--prev:hover::before,
.career__nav-btn--next:hover::before {
    border-color: #FFFFFF;
}

.career__header::before {
    content: "Career";
    position: absolute;
    top: 50px;
    right: 0;
    font-family: 'system-ui';
    font-style: normal;
    font-weight: 900;
    font-size: 260px;
    line-height: 100%;
    display: flex;
    align-items: center;
    text-align: center;
    background: linear-gradient(90deg, #8B8B8B 0%, rgba(139, 139, 139, 0.5) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    opacity: 0.1;
    pointer-events: none;
    white-space: nowrap;
}

.career__copy {
    width: 400px;
    margin-top: 40px;
}

.career__copy .about__more-btn {
    /* 与 about 模块完全一致：样式已由 .about__more-btn 提供，此处仅保证间距 */
    margin-top: 0;
}

/* 首页 Career 卡片区域：外层负责定位，内层负责横向滑动 */
#career .career__flex {
    position: absolute;
    right: -164px;
    bottom: -100px;
    overflow: hidden;
    /* 轮播内容在内部滑动，不超出边界 */
}

#career .career__flex-inner {
    display: flex;
    gap: 50px;
    transition: transform 0.35s ease-out;
}

.career .section__subtitle {
    width: 400px;
    margin-top: 40px;
    margin-bottom: 30px;
    color: #181818;
}

.career__copy .section__subtitle {
    /* width: 100%; */
    width: 400px;
    margin-top: 0;
}

@media (max-width: 768px) {
    .career__copy .section__subtitle {
        width: 100%;
    }
}

@media (max-width: 1720px) and (min-width: 1388px) {
    #career div.career__nav {
        right: 200px;
    }

    #career div.career__flex {
        bottom: -80px;
    }

    .career-main__jobs div.career__nav {
        position: absolute;
        top: 0;
        right: -34px;
        z-index: 2;
    }

    .career__flex img {
        width: 315px;
        height: auto;
    }

    article.career-card {
        width: 315px;
    }

    .career-main__jobs div.career__flex {
        right: -400px;
    }
}

@media (max-width: 1387px) and (min-width: 1161px) {
    #career div.career__nav {
        right: 166px;
    }

    #career div.career__flex {
        bottom: -80px;
    }

    .career-main__jobs div.career__nav {
        position: absolute;
        top: 0;
        right: 4px;
        z-index: 2;
    }

    .career-main__jobs div.career__flex {
        right: -134px;
        gap: 28px;
    }

    article.career-card {
        width: 280px;
    }

    .career__flex img {
        width: 280px;
        height: auto;
    }
}

@media (max-width: 1160px) and (min-width: 769px) {
    #career div.career__nav {
        right: 126px;
    }

    #career div.career__flex {
        bottom: -76px;
    }

    .career-main__jobs div.career__flex {
        right: -80px;
        bottom: -140px;
        gap: 35px;
    }

    article.career-card {
        width: 240px;
    }

    .career__flex img {
        width: 240px;
        height: auto;
    }
}

/* 超宽屏（>=2400px）：首页 Career 卡片与导航按钮位置微调 */
@media (min-width: 2400px) {
    #career .career__flex img {
        width: 440px;
        height: 530px;
        object-fit: cover;
    }

    #career .career__flex {
        bottom: -120px;
    }

    #career .career__nav {
        top: 60px;
        right: 326px;
    }
}

.career__copy {
    width: fit-content;
}

.career-card__title {
    font-family: 'PingFang SC';
    font-style: normal;
    font-weight: 600;
    font-size: 22px;
    line-height: 100%;
    display: flex;
    align-items: center;
    color: #D9D9D9;
}

.career-card__text {
    font-size: 13px;
}

.career-card__meta {
    margin-top: 16px;
}

.career-card__eyebrow {
    font-family: 'Noto Sans SC', 'Noto Sans CJK SC', 'Noto Sans Simplified Chinese', system-ui, -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    display: flex;
    align-items: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #666666;
    margin-bottom: 11px;
}


/* ============================================
   Contact CTA 模块
   ============================================ */

.contact {
    position: relative;
    overflow: hidden;
    height: 800px;
    padding: 284px 0 0;
}

.contact__inner {
    position: relative;
    z-index: 1;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.contact__text {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 232px;
}

/* PC + 日语：标题图片更高，容器高度自适应 */
@media (min-width: 769px) {
    html[lang="ja"] .contact__text {
        height: auto;
    }
}

.contact__text .section__eyebrow {
    font-family: 'system-ui';
    font-style: normal;
    font-weight: 900;
    font-size: 260px;
    background: linear-gradient(90deg, #8B8B8B 0%, rgba(139, 139, 139, 0.5) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    position: absolute;
    top: -25px;
    left: -170px;
    opacity: .05;
}

/* Contact 标题：整块标题用 SVG（按语言切换） */
.contact__title-img {
    display: inline-flex;
    align-items: flex-end;
}

.contact__title-img-item {
    display: none;
    height: auto;
    width: auto;
    vertical-align: baseline;
}

/* 默认：PC 显示（同语言只显示一张） */
html[lang="zh-CN"] .contact__title-img-item--zh-CN.contact__title-img-item--pc,
html[lang="zh-TW"] .contact__title-img-item--zh-TW.contact__title-img-item--pc,
html[lang="en"] .contact__title-img-item--en.contact__title-img-item--pc,
html[lang="ja"] .contact__title-img-item--ja.contact__title-img-item--pc {
    display: block;
}

/* H5：同语言显示 *_h5 版本 */
@media (max-width: 768px) {
    .contact__title-img-item {
        height: 1.3rem;
    }

    html[lang="zh-CN"] .contact__title-img-item--zh-CN.contact__title-img-item--pc,
    html[lang="zh-TW"] .contact__title-img-item--zh-TW.contact__title-img-item--pc,
    html[lang="en"] .contact__title-img-item--en.contact__title-img-item--pc,
    html[lang="ja"] .contact__title-img-item--ja.contact__title-img-item--pc {
        display: none;
    }

    html[lang="zh-CN"] .contact__title-img-item--zh-CN.contact__title-img-item--h5,
    html[lang="zh-TW"] .contact__title-img-item--zh-TW.contact__title-img-item--h5,
    html[lang="en"] .contact__title-img-item--en.contact__title-img-item--h5,
    html[lang="ja"] .contact__title-img-item--ja.contact__title-img-item--h5 {
        display: block;
    }
}

/* PC + 日语：标题内描边文字与前缀拉开间距 */
@media (min-width: 769px) {
    /* 无需额外处理：PC 下就是一张图 */
}

.contact__circle-wrapper {
    display: flex;
    justify-content: center;
}

.contact__circle {
    position: relative;
    width: 232px;
    height: 232px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f5f5f5;
    background: #2f2f2f;
    text-decoration: none;
    overflow: hidden;
    transform-origin: center;
    transition: transform 0.8s ease, background 0.8s ease;
}


.contact__circle-label {
    position: relative;
    z-index: 1;
    font-size: 22px;
}

.contact__circle:hover {
    transform: scale(0.77);
    background: var(--color-orange);
}

/* ============================================
   响应式调整（基本）
   ============================================ */
@media (max-width: 768px) {
    .container.about__inner {
        padding: 1.2rem 0.3rem 2.94rem;
    }

    .section {
        padding: 1.2rem 0;
    }

    .services {
        padding-top: 1rem;
        margin-bottom: 0;
    }

    .services::before {
        font-size: 1rem;
        font-weight: 900;
        top: 0;
        left: -0.2rem;
    }

    .services__copy-block {
        padding-top: 0.9rem;
    }

    .services__more {
        margin-top: 0.2rem;
        display: block;
        line-height: 0.5rem;
        height: .5rem;
        width: fit-content;
    }

    .services__eyebrow {
        left: 0.3rem;
    }

    .services__cards {
        grid-template-columns: minmax(0, 1fr);
    }

    div.services__inner {
        padding: 0;
    }

    .service-visual-card {
        margin-bottom: 0.2rem;
        margin-top: 0;
    }

    /* H5：服务卡片单列、宽 100%、高 2.4rem，并使用 *_h5 图片 */
    .service-visual-card {
        width: 100%;
        height: 2.4rem;
    }

    .services__cards {
        gap: 0;
    }

    .service-visual-card__title {
        font-size: 0.36rem;
        font-weight: 600;
        white-space: unset;
    }

    .service-visual-card--architecture {
        background-image: url("../images/index/services-architecture_h5.png");
    }

    .service-visual-card--app {
        background-image: url("../images/index/services-app-dev_h5.png");
    }

    .service-visual-card--planning {
        background-image: url("../images/index/services-product-planning_h5.png");
    }

    .services__top {
        margin-bottom: 0.72rem;
        padding: 0 0.3rem;
        position: relative;
        justify-content: flex-start;
    }



    .contact__inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .workflow__title-block {
        margin-top: 0.46rem;
    }

    .workflow__header {
        margin-bottom: 0.4rem;
    }

    .workflow::before {
        font-size: 1rem;
        right: auto;
        left: 0;
        top: 0.75rem;
    }

    .workflow__steps {
        flex-direction: column;
        gap: 0.36rem;
        padding-left: 0.26rem;
    }

    /* H5：Workflow 步骤左侧竖线，高度 100% */
    .workflow__steps::after {
        left: 0;
        right: auto;
        top: 0;
        bottom: 0;
        width: 0.01rem;
        height: 100%;
    }

    .workflow-step__title {
        margin-bottom: 0.18rem;
    }

    .workflow-step__text {
        width: 2.2rem;
    }

    html[lang="en"] .workflow-step__text,
    html[lang="ja"] .workflow-step__text {
        width: 2.5rem;
    }

    .workflow {
        padding-bottom: 0.6rem;
    }

    /* H5 + 英文：Workflow 标题字号 0.48rem */
    html[lang="en"] .workflow__title {
        font-size: 0.48rem;
    }

    .contact .contact__inner {
        padding-top: 1.8rem;
        display: flex;
        flex-direction: unset;
    }

    .contact__inner p.section__eyebrow {
        font-size: 1rem;
        top: -1.5rem;
        left: -0.3rem;
    }

    .contact__text {
        width: unset;
    }

    .contact__text h2.section__title {
        font-size: 0.52rem;
        width: 2.22rem;
        white-space: normal;
    }

    /* H5 下同样是一张图，无换行符逻辑 */

    /* 首页 H5：career 卡片改为纵向排列 */
    #career .career__flex-inner {
        flex-direction: column;
        gap: 0.3rem;
    }

    .contact__circle {
        width: 1.14rem;
        height: 1.14rem;
    }

    span.contact__circle-label {
        font-size: 0.18rem;
        letter-spacing: 0;
    }

    html[lang="ja"] span.contact__circle-label {
        font-size: 0.15rem;
    }
}