:root {
    --header-h: 76px;
    --viewport-h: calc(100dvh - var(--header-h));
}

.slider-outer {
    position: relative;
    width: 100%;
    z-index: 2;
    background-color: #1a1a1a;
}

.slider-sticky-wrapper,
.panel {
    height: var(--viewport-h);
}

.slider-sticky-wrapper {
    width: 100%;
    margin-top: var(--header-h);
    position: relative;
    overflow: hidden;
}

.panel {
    position: absolute;
    inset: 0;
    overflow: hidden;
    will-change: transform;
}

.slider-header {
    position: absolute;
    top: 0;
    width: 100%;
    text-align: center;
    z-index: 20;
    pointer-events: none;
}

.core-tech-mobile-title {
    display: none;
}

.slider-outer .panel > div:not(.w-full) {
    z-index: 0;
}

.slider-outer .panel > .w-full {
    height: 100%;
    display: flex;
    flex-direction: column;
    z-index: 1;
}

.slider-outer .panel > .w-full > .text-center {
    padding-top: 1.2rem;
}

.slider-outer .panel > .w-full > div:last-child {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.slider-outer .panel > .w-full > div:last-child > div {
    height: auto;
    padding: 0;
}

@media (max-width: 767px) {
    :root {
        --header-h: 56px;
    }
}

/* sm 以下：切換為捲動式（舊版）面板 */
@media (max-width: 639px) {
    .core-tech-mobile-title {
        display: flex;
    }

    .panel {
        opacity: 0;
        visibility: hidden;
        will-change: opacity;
    }

    .panel:first-child {
        opacity: 1;
        visibility: visible;
    }

    /* 隱藏每片面板內的重複標題（改用外部標題） */
    .slider-outer .panel > .w-full > .text-center {
        display: none;
    }

    .slider-outer .panel > .w-full > div:last-child {
        justify-content: flex-start;
    }
}