/* The active description tracks its selected title inside the same clipped viewport. */
.section-enterwapp[data-node].service-detail-apart .service-apart-content {
    --service-apart-content-y: 0px;
    top: 0;
}
@media (min-width:768px) {
    .section-enterwapp[data-node].service-detail-apart .service-apart-content.is-scroll-synced {
        min-height: 0;
        overflow: visible;
        /* Match the title list's upper clipping edge, but allow complete
           multi-line descriptions to extend below the final tab. */
        clip-path: inset(0 -100% -1000px -100%);
    }
    /* Never cross-fade old and new descriptions: the previous panel must
       vanish immediately when a different title is selected. */
    .section-enterwapp[data-node].service-detail-apart .service-apart-content .service-apart-panel:not(.is-active) {
        display: none;
        opacity: 0;
        visibility: hidden;
        transition: none;
    }
    .section-enterwapp[data-node].service-detail-apart .service-apart-content .service-apart-panel.is-active {
        display: block;
        opacity: 1;
        visibility: visible;
        transform: translate3d(0, var(--service-apart-content-y), 0);
        transition: transform .38s cubic-bezier(.16,1,.3,1);
    }
    .section-enterwapp[data-node].service-detail-apart .service-apart-content.is-scroll-syncing .service-apart-panel.is-active {
        transition: none;
    }
    .section-enterwapp[data-node].service-detail-apart .service-apart-content.is-tab-outside .service-apart-panel.is-active {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: none;
    }

}

/* Laptop: compact tab spacing only, keep existing font sizes */
@media (min-width:1025px) and (max-width:1600px){
.section-enterwapp[data-node].service-detail-apart .service-apart-tabs{margin-top:10px;margin-bottom:10px}
.section-enterwapp[data-node].service-detail-apart .service-apart-tab{min-height:46px;padding:5px 18px}
.section-enterwapp[data-node].service-detail-apart .service-apart-tab:hover{padding-left:22px}
}

@media (max-width:767px){
.section-enterwapp[data-node].service-detail-apart .service-apart-content{--service-apart-content-y:0px!important;top:0!important;transition:none!important}
.section-enterwapp[data-node].service-detail-apart .service-apart-panel.is-active{transform:translateY(0)!important}
}

@media (prefers-reduced-motion:reduce){
.section-enterwapp[data-node].service-detail-apart .service-apart-content{transition:none!important}
}


/* Stronger scroll feather and compact inactive tabs */
@media (min-width: 1025px) {
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tab:not(.is-active) {
        font-size: 19px;
        font-weight: 400;
        min-height: 43px;
        padding-top: 4px;
        padding-bottom: 4px;
        line-height: 1.25;
    }

    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tab.is-active {
        font-size: 23px;
        font-weight: 600;
        min-height: 48px;
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 1.3;
    }

    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::before,
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::after {
        height: 92px;
        transition: opacity .22s ease;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::before {
        background: linear-gradient(to bottom,
            #fff 0%, rgba(255,255,255,.98) 20%,
            rgba(255,255,255,.88) 43%, rgba(255,255,255,.42) 76%,
            rgba(255,255,255,0) 100%);
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::after {
        background: linear-gradient(to top,
            #fff 0%, rgba(255,255,255,.98) 20%,
            rgba(255,255,255,.88) 43%, rgba(255,255,255,.42) 76%,
            rgba(255,255,255,0) 100%);
    }
}
@media (min-width: 1025px) and (max-width: 1600px) {
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tab:not(.is-active) {
        font-size: 18px;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tab.is-active {
        font-size: 22px;
    }
}

/* Clear scroll affordance: active title breathing room, deeper feather, subtle cue. */
@media (min-width: 1025px) {
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tab.is-active {
        min-height: 66px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::before,
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::after {
        height: 118px;
    }

    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::before {
        background: linear-gradient(to bottom,
            #fff 0%, rgba(255,255,255,.99) 15%,
            rgba(255,255,255,.91) 35%, rgba(255,255,255,.63) 60%,
            rgba(255,255,255,.18) 86%, transparent 100%);
    }

    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::after {
        background: linear-gradient(to top,
            #fff 0%, rgba(255,255,255,.99) 15%,
            rgba(255,255,255,.91) 35%, rgba(255,255,255,.63) 60%,
            rgba(255,255,255,.18) 86%, transparent 100%);
    }


}


/* Partial-next-title cue with text-edge fade rather than a white overlay. */
@media (min-width: 1025px) {
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tab:not(.is-active) {
        padding-top: 5px;
        padding-bottom: 5px;
        min-height: 43px;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tab.is-active {
        padding-top: 16px;
        padding-bottom: 16px;
        min-height: 70px;
    }

    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::before,
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport::after {
        display: none;
    }

    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tabs {
        -webkit-mask-image: none;
        mask-image: none;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport.has-feather-bottom .service-apart-tabs {
        -webkit-mask-image: linear-gradient(to bottom, black 0%, black calc(100% - 78px), rgba(0,0,0,.28) 100%);
        mask-image: linear-gradient(to bottom, black 0%, black calc(100% - 78px), rgba(0,0,0,.28) 100%);
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport.has-feather-top .service-apart-tabs {
        -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.28) 0%, black 78px, black 100%);
        mask-image: linear-gradient(to bottom, rgba(0,0,0,.28) 0%, black 78px, black 100%);
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport.has-feather-top.has-feather-bottom .service-apart-tabs {
        -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.28) 0%, black 78px, black calc(100% - 78px), rgba(0,0,0,.28) 100%);
        mask-image: linear-gradient(to bottom, rgba(0,0,0,.28) 0%, black 78px, black calc(100% - 78px), rgba(0,0,0,.28) 100%);
    }
}

/* Option C: clean text + arrow scroll hint (desktop overflow only). */
@media (min-width:1025px) {
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport {
        overflow: visible;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-tabs {
        position: relative;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-arrow {
        position: absolute;
        z-index: 8;
        right: 4px;
        width: auto;
        min-width: 88px;
        height: 30px;
        padding: 0 4px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        color: #159AD1;
        font-family: var(--font-body, Arial, sans-serif);
        font-size: 13px;
        font-weight: 500;
        line-height: 1.2;
        letter-spacing: 0;
        white-space: nowrap;
        text-transform: none;
        cursor: pointer;
        opacity: 1;
        visibility: visible;
        transition: opacity .22s ease, visibility .22s ease, color .22s ease;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-down { bottom: 0; }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-up { top: 0; }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-arrow .service-apart-scroll-label {
        display: inline-block;
        width: auto;
        height: auto;
        flex: 0 0 auto;
        padding: 0;
        border: 0;
        background: transparent;
        color: inherit;
        font: inherit;
        line-height: inherit;
        transform: none;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-arrow .service-apart-scroll-chevron {
        display: block;
        width: 8px;
        height: 8px;
        flex: 0 0 8px;
        padding: 0;
        border: 0;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        background: transparent;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-down .service-apart-scroll-chevron {
        transform: translateY(-2px) rotate(45deg);
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-up .service-apart-scroll-chevron {
        transform: translateY(2px) rotate(225deg);
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-arrow:disabled {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-arrow:not(:disabled):hover {
        color: #114C92;
        background: transparent;
        box-shadow: none;
    }
    section[data-module="service-detail-apart"] .service-apart-tabs-viewport .service-apart-scroll-arrow:focus-visible {
        outline: 2px solid #114C92;
        outline-offset: 2px;
    }
}