.home-service-card-component .text-center {
    padding: 3.333333vw 25.494792vw 1.770833vw 25.546875vw;
}
.home-service-card-component {
    padding-top: var(--padding-top, 0);
    padding-bottom: var(--padding-bottom, 0);
}
.home-service-card-component .text-center h2 {
    margin: auto;
    font-size: 3.333333vw;
    line-height: 4.6875vw;
    margin-bottom: .625vw;
    font-weight: 700;
    width: 40vw;
}

.home-service-card-component .tab-content h3 {
    letter-spacing: -0.05px;
    font-size: 2.083333vw;
    line-height: 2.916667vw;
    margin-bottom: 1.25vw;
    font-weight: 700;
}

.home-service-card-component .text-center p {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.25vw;
    line-height: 1;
    height: 3.125vw;
    width: 48.958333vw;
}

.home-service-card-component .tab-content {
    display: none;
    padding: 0 0 4.114583vw 2.916667vw;
}

.home-service-card-component .tab-content.active {
    display: block;
    overflow: hidden;
}

.home-service-card-component .tab {
    color: #707070;
    padding-bottom: .78125vw;
}

.home-service-card-component .tab svg {
    width: 1.5625vw;
    height: 1.5625vw;
    fill: #707070;
}

.home-service-card-component .tab.active {
    position: relative;
    color: #000000;
}
.home-service-card-component .tab .icon {
    display: block;
}
.home-service-card-component .tab .icon-active {
    display: none;
}
.home-service-card-component .tab.active .icon-active {
    display: block;
}
.home-service-card-component .tab.active .icon {
    display: none;
}  
.home-service-card-component .tab.active svg {
    fill: #000000;
}

.home-service-card-component .tab.active::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 101.5%;
    height: 2px;
    background-color: #000000;
}

.home-service-card-component .tab-content-container {
    margin-left: 12.5vw;
    margin-right: 12.5vw;
    padding: 2.8125vw 0 0 0;
}

.home-service-card-component .border-gray-200 {
    border-bottom: 1px solid #E9E9E9;
    margin-bottom: 3.59375vw;
}

.home-service-card-component .flex {
    display: flex;
    justify-content: center;
    
}
.home-service-card-component .tab.flex {
    align-items: center;
}
.home-service-card-component .bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.home-service-card-component .rounded-lg {
    border-radius: 0.5rem;
}

.home-service-card-component .shadow-sm {
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.home-service-card-component .tab .font-medium {
    margin-top: 1px;
    font-size: 1.25vw;
    line-height: 1.40625vw;
    font-weight: 500;
}

.home-service-card-component .tab .w-8 {
    width: 1.5625vw;
}

.home-service-card-component .tab .h-8 {
    height: 1.5625vw;
}

.home-service-card-component .space-x-8 > :not([hidden]) ~ :not([hidden]) {
    margin-left: 4.583333vw
}

.home-service-card-component .tab-content .gap-8 {
    gap: 2.604167vw;
}

.home-service-card-component .tab-content .flex {
    display: flex;
}

.home-service-card-component .tab-content .md\:w-1\/3 {
    width: 15.885417vw;
}

.home-service-card-component .tab-content .md\:w-2\/3 {
    width: 53.59375vw;
}

.home-service-card-component .case-link {
    position: relative;
    display: inline-block;
}

.home-service-card-component .video-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: rgba(0, 0, 0, 0.6);
    color: white;
    font-size: .625vw;
    padding: 2px 8px;
    border-radius: .520833vw;
}

.home-service-card-component .nav-arrow {
    display: flex;
    align-items: center;
    gap: .416667vw;
}

/* 轮播样式 */
.home-service-card-component .carousel-container {
    position: relative;
    overflow: hidden;
    width: 100%; /* 715px * 2 + 16px 间距 */
    height: 20.9375vw;
    padding-bottom: 2.604167vw;
}

/* 确保导航箭头不被遮挡 */
.home-service-card-component .carousel-navigation {
    position: absolute;
    bottom: 0;
    right: 2.5vw;
    display: flex;
    align-items: center;
    gap: .75vw;
    z-index: 10;
}

.home-service-card-component .carousel-nav-arrow {
    width: auto;
    height: auto;
    border: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: #000000;
    background-color: transparent;
    padding: 0;
}

.home-service-card-component .carousel-nav-arrow:hover:not(.disabled) {
    color: #000000;
    background-color: transparent;
}

.home-service-card-component .carousel-nav-arrow.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    color: #000000;
    background-color: transparent;
}

.home-service-card-component .carousel-wrapper {
    display: flex;
    transition: transform 0.3s ease;
    height: 100%;
}

.home-service-card-component .carousel-item {
    flex: 0 0 37.239583vw;
    /* padding: 0 .416667vw; */
    margin-right: .833333vw !important;
    height: 100%;
    position: relative;
}

.home-service-card-component .carousel-item:last-of-type {
    margin-right: 2.916667vw !important;
}

.home-service-card-component .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1.25vw;
}

.home-service-card-component .video-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.home-service-card-component .minisite-video-sp1 {
    border-radius: 1.25vw;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 2;
}

.home-service-card-component .carousel-arrow {
    cursor: pointer;
    transition: opacity 0.3s ease;
}

.home-service-card-component .carousel-arrow.disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.home-service-card-component .carousel-indicator {
    width: 20px;
    height: 1px;
    background-color: #E2E8F0;
    position: relative;
    cursor: pointer;
}

.home-service-card-component .carousel-indicator.active {
    background-color: #000000;
}

.home-service-card-component .carousel-indicator.active::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    background-color: #979797;
}

/* 进度条样式 */
.home-service-card-component .progress-container {
    width: 12.083333vw; /* 72px * 3 + 8px * 2 */
}

.home-service-card-component .progress-bars {
    display: flex;
    gap: .416667vw;
    height: .15625vw;
}

.home-service-card-component .progress-item {
    width: 3.75vw;
    background-color: rgba(0, 0, 0, 0.4);
    transition: background-color 0.3s ease;
    position: relative;
    overflow: hidden;
}

.home-service-card-component .progress-item.active {
    background-color: rgba(0, 0, 0, 0.4);
}

.home-service-card-component .progress-item.active::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: var(--progress, 0%);
    background-color: rgba(0, 0, 0, 1);
    transition: none;
}

.home-service-card-component .progress-item.active.progressing::before {
    width: 100%;
    transition: width var(--progress-duration, 10s) linear;
}

.home-service-card-component .progress-item.past {
    background-color: rgba(0, 0, 0, 1);
}

.home-service-card-component .tab-content .text-secondary {
    font-size: 1.041667vw;
    line-height: 1.5625vw;
    margin-bottom: 1.875vw;
    color: rgba(0, 0, 0, 0.6);
}

.home-service-card-component .tab-content .text-secondary b {
    color: rgba(0, 0, 0, 1);
}

.home-service-card-component #tab2 .text-secondary:nth-of-type(1):not(.main-content) {
    margin-bottom: 2.552083vw;
}

.home-service-card-component #tab2 .text-secondary:nth-of-type(2) {
    margin-bottom: 1.041667vw;
}

.home-service-card-component #tab2 .text-secondary:nth-of-type(4) {
    margin-bottom: 1.875vw;
}

.home-service-card-component #tab2 .main-div-content:nth-of-type(1) {
    margin-bottom: 4.53125vw;
}

.home-service-card-component #tab2 .main-div-content:nth-of-type(2) {
    margin-bottom: 0vw;
}

.home-service-card-component .tab-content .slide-content {
    margin-bottom: 1.171875vw;
}

.home-service-card-component .tab-content .text-secondary.main-content {
    letter-spacing: -0.5px;
    font-size: 1.25vw;
    line-height: 1.5625vw;
    margin-bottom: .520833vw;
    color: #000000;
    font-weight: 500;
    opacity: 1;
}

.home-service-card-component .tab-content .main-div-content {
    min-height: 7.447917vw;
    margin-bottom: 4.166667vw;
}

.home-service-card-component .tab-content a {
    display: flex;
    align-items: center;
}

.home-service-card-component .tab-content .popularize-txt {
    position: relative;
    top: .104167vw;
    font-size: 1.041667vw;
    line-height: 1.354167vw;
    height: 1.5625vw;
    color: #0A59F7;
    font-weight: 500;
}

.home-service-card-component .tab-content a img {
    width: 1.5625vw;
    height: 1.5625vw;
    margin-left: .104167vw;
    color: #0A59F7;
    transform: translateX(0);
    transition: .6s ease, border-color .3s ease;
}

.home-service-card-component .tab-content a:hover img {
    transform: translateX(4px);
}

.home-service-card-component .tab-content a img:nth-of-type(1) {
    margin-right: 1.875vw;
}

.home-service-card-component .tab-content a svg {
    margin-left: .416667vw;
    width: .78125vw;
    height: 1.5625vw;
}

.home-service-card-component .pcshow {
    display: block;
}

.home-service-card-component .mobile-bottom-content {
    display: none;
}
@media screen and (min-aspect-ratio: 11/10) {
.home-service-card-component .gap-2 {
    gap: 0.5rem;
}
}
@media screen and (max-aspect-ratio: 11/10) {
    .home-service-card-component {
    padding-top: var(--padding-top-xs, 0);
    padding-bottom: var(--padding-bottom-xs, 0);
}
    .home-service-card-component .gap-2 {
    gap: 0rem;
}
    .home-service-card-component .pcshow {
        display: none !important;
    }

    .home-service-card-component .content-mob {
        display: block;
    }

    .home-service-card-component .main-content {
        display: none !important;
    }

    .home-service-card-component {
        background-color: #fff;
    }

    .home-service-card-component .text-center {
        padding: 22.222222vw 23.333333vw 14.166667vw 23.333333vw;
    }

    .home-service-card-component .text-center h2 {
        margin: auto;
        font-size: 8.888889vw;
        line-height: 10.666667vw;
        margin-bottom: 2.777778vw;
        font-weight: 700;
        width: 53.333333vw;
    }

    .home-service-card-component .tab-content h3 {
        letter-spacing: -0.05px;
        font-size: 5.555556vw;
        line-height: 7.777778vw;
        margin-bottom: 2.777778vw;
    }

    .home-service-card-component .text-center p {
        letter-spacing: -1.04px;
        margin: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 3.333333vw;
        line-height: 1;
        height: 3.333333vw;
        width: 43.888889vw;
    }

    .home-service-card-component .tab-content {
        display: none;
        padding: 0 0 13.888889vw 0;
    }

    .home-service-card-component .tab-content.active {
        display: block;
        overflow: hidden;
    }

    .home-service-card-component .tab {
        display: block;
        color: #707070;
        padding-bottom: 2.222222vw;
    }

    .home-service-card-component .tab svg {
        fill: #707070;
        width: 4.166667vw;
        height: 4.166667vw;
    }

    .home-service-card-component .tab.active {
        position: relative;
        color: #000000;
    }

    .home-service-card-component .tab.active svg {
        fill: #000000;
    }

    .home-service-card-component .tab.active::after {
        content: '';
        position: absolute;
        bottom: -2px;
        left: 0;
        width: 99%;
        height: 2px;
        background-color: #000000;
    }

    .home-service-card-component .tab-content-container {
        margin-left: 0vw;
        margin-right: 0vw;
        padding: 0;
    }

    .home-service-card-component .border-gray-200 {
        border-bottom: 1px solid #E9E9E9;
        margin-bottom: 8.333333vw;
    }

    .home-service-card-component .tab .font-medium {
        font-size: 3.333333vw;
        line-height: 4.722222vw;
    }

    .home-service-card-component .tab .w-8 {
        width: 4.166667vw;
    }

    .home-service-card-component .tab .h-8 {
        margin-bottom: 1.111111vw !important;
        margin: 0 auto;
        height: 4.166667vw;
    }

    .home-service-card-component .space-x-8 > :not([hidden]) ~ :not([hidden]) {
        margin-left: 19.722222vw
    }

    .home-service-card-component .tab-content .gap-8 {
        gap: 0vw;
    }

    .home-service-card-component .tab-content .flex-col {
        flex-direction: column;
    }

    .home-service-card-component .tab-content .md\:w-1\/3 {
        width: 83.333333vw;
        padding: 0 8.333333vw 0 8.333333vw;
    }

    .home-service-card-component .tab-content .md\:w-2\/3 {
        width: 100vw;
    }

    .home-service-card-component .case-link {
        position: relative;
        display: inline-block;
    }

    .home-service-card-component .video-badge {
        position: absolute;
        top: 1.388889vw;
        right: 1.388889vw;
        background-color: rgba(0, 0, 0, 0.6);
        color: white;
        font-size: 1.666667vw;
        padding: 2px 8px;
        border-radius: 1.388889vw;
    }

    .home-service-card-component .nav-arrow {
        display: flex;
        align-items: center;
        gap: 1.111111vw;
    }

    /* 轮播样式 */
    .home-service-card-component .carousel-container {
        position: relative;
        overflow: hidden;
        width: 100%; /* 715px * 2 + 16px 间距 */
        height: 55.555556vw;
        padding-bottom: 5.555556vw;
    }

    /* 确保导航箭头不被遮挡 */
    .home-service-card-component .carousel-navigation {
        position: absolute;
        bottom: 0;
        right: 26.944444vw;
        display: flex;
        align-items: center;
        gap: 2.222222vw;
        z-index: 10;
    }

    .home-service-card-component .carousel-nav-arrow {
        width: auto;
        height: auto;
        border: none;
        border-radius: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.3s ease;
        color: #000000;
        background-color: transparent;
        padding: 0;
    }

    .home-service-card-component .carousel-nav-arrow:hover:not(.disabled) {
        color: #000000;
        background-color: transparent;
    }

    .home-service-card-component .carousel-nav-arrow.disabled {
        opacity: 0.4;
        cursor: not-allowed;
        color: #000000;
        background-color: transparent;
    }

    .home-service-card-component .carousel-wrapper {
        display: flex;
        transition: transform 0.3s ease;
        height: 100%;
    }

    .home-service-card-component .carousel-item {
        flex: 0 0 74.027778vw;
        /* padding: 0 .416667vw; */
        margin-right: 2.777778vw !important;
        height: 100%;
        position: relative;
    }

    .home-service-card-component .carousel-item:first-of-type {
        margin-left: 8.333333vw !important;
    }

    .home-service-card-component .carousel-item:last-of-type {
        margin-right: 8.333333vw !important;
    }

    .home-service-card-component .carousel-navigation button svg {
        display: none;
    }

    .home-service-card-component .carousel-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 2.222222vw;
    }

    .home-service-card-component .video-placeholder {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }

    .home-service-card-component .minisite-video-sp1 {
        border-radius: 2.222222vw;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 2;
    }

    .home-service-card-component .carousel-arrow {
        cursor: pointer;
        transition: opacity 0.3s ease;
    }

    .home-service-card-component .carousel-arrow.disabled {
        opacity: 0.3;
        cursor: not-allowed;
    }

    .home-service-card-component .carousel-indicator {
        width: 2.777778vw;
        height: 1px;
        background-color: #E2E8F0;
        position: relative;
        cursor: pointer;
    }

    .home-service-card-component .carousel-indicator.active {
        background-color: #000000;
    }

    .home-service-card-component .carousel-indicator.active::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 50%;
        height: 100%;
        background-color: #979797;
    }

    /* 进度条样�?*/
    .home-service-card-component .progress-container {
        width: auto; /* 72px * 3 + 8px * 2 */
    }

    .home-service-card-component .progress-bars {
        display: flex;
        gap: 2.222222vw;
        height: .416667vw;
    }

    .home-service-card-component .progress-item {
        width: 13.888889vw;
        background-color: rgba(0, 0, 0, 0.4);
        transition: background-color 0.3s ease;
        position: relative;
        overflow: hidden;
    }

    .home-service-card-component .progress-item.active {
        background-color: rgba(0, 0, 0, 0.4);
    }

    .home-service-card-component .progress-item.active::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: var(--progress, 0%);
        background-color: rgba(0, 0, 0, 1);
        transition: none;
    }

    .home-service-card-component .progress-item.active.progressing::before {
        width: 100%;
        transition: width var(--progress-duration, 10s) linear;
    }

    .home-service-card-component .progress-item.past {
        background-color: rgba(0, 0, 0, 1);
    }

    .home-service-card-component .tab-content .text-secondary {
        font-size: 3.333333vw;
        line-height: 5.333333vw;
        height: 10.833333vw;
        margin-bottom: 11.111111vw;
        color: rgba(0, 0, 0, 0.6);
    }

    .home-service-card-component .tab-content .text-secondary b {
        color: rgba(0, 0, 0, 1);
    }

    .home-service-card-component #tab2 .text-secondary:nth-of-type(1):not(.main-content) {
        margin-bottom: 5.555556vw;
    }

    .home-service-card-component #tab2 .text-secondary:nth-of-type(2) {
        margin-bottom: 5.555556vw;
    }

    .home-service-card-component #tab2 .text-secondary:nth-of-type(4) {
        margin-bottom: 5.555556vw;
    }

    .home-service-card-component #tab2 .main-div-content:nth-of-type(1) {
        margin-bottom: 5.555556vw;
    }

    .home-service-card-component #tab2 .main-div-content:nth-of-type(2) {
        margin-bottom: 5.555556vw;
    }

    .home-service-card-component .tab-content .slide-content {
        margin-bottom: 4.166667vw;
        width: 83.333333vw;
    }

    .home-service-card-component .tab-content .text-secondary.main-content {
        letter-spacing: -0.5px;
        font-size: 3.333333vw;
        line-height: 5.333333vw;
        margin-bottom: 5.555556vw;
        color: #000000;
        font-weight: 400;
        opacity: 0.6;
    }

    .home-service-card-component .tab-content .main-div-content {
        min-height: 10.833333vw;
        margin-bottom: 5.555556vw;
    }

    .home-service-card-component #tab2 .main-div-content {
        margin-bottom: 11.111111vw;
    }

    .home-service-card-component #tab2 .main-div-content.flex-mob {
        margin-bottom: 1.388889vw;
        display: inline-flex;
        gap: 15.694444vw;
    }

    .home-service-card-component #tab2 .text-secondary b {
        color: #000000;
        opacity: 1;
    }

    .home-service-card-component .tab-content a {
        display: flex;
        align-items: center;
    }

    .home-service-card-component .tab-content .popularize-txt {
        position: relative;
        top: .277778vw;
        font-size: 3.333333vw;
        line-height: 3.611111vw;
        height: 4.166667vw;
        color: #0A59F7;
        font-weight: 500;
    }

    .home-service-card-component .tab-content a img {
        width: 4.166667vw;
        height: 4.166667vw;
        margin-left: 1px;
        color: #0A59F7;
    }

    .home-service-card-component .tab-content a img:nth-of-type(1) {
        margin-right: 0vw;
    }

    .home-service-card-component .tab-content a svg {
        margin-left: 1px;
        width: 4.166667vw;
        height: 4.166667vw;
    }

    /* 移动端底部内容容器样�?*/
    .home-service-card-component .mobile-bottom-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4.166667vw;
    }

    .home-service-card-component .mobile-case-link {
        display: flex;
        align-items: center;
    }
}

