/* ----- theme-advice-showcase-slider ----- */
theme-advice-showcase-slider {
    --acs-radius: 24px;
    --acs-arrow-size: 50px;
    --acs-max: 1400px;
    /* Matches .acs__shell horizontal padding (narrow breakpoints) */
    --acs-shell-inline: 10px;
    /*
       * Distance from viewport left edge to shell *content* (same as .acs__title).
       * Wide: center the 1400 column. Narrow: max(shell padding, 0) when (100vw - 1400)/2 would be negative.
       */
    --acs-gutter: max(var(--acs-shell-inline), calc((100vw - var(--acs-max)) / 2));
    --acs-font: var(--font-body-family, system-ui, -apple-system, 'Segoe UI', sans-serif);
    display: block;
    width: 100%;
    /* .acs__slider-bleed uses 100vw; vw ignores classic scrollbar gutter, so it can exceed 100% and widen the page. */
    overflow-x: hidden;
    overflow-x: clip;
    font-family: var(--acs-font);
    color: #353535;
}

@media screen and (max-width: 767.98px) {
    theme-advice-showcase-slider {
        --acs-shell-inline: 20px;
        --acs-radius: 12px;
    }
}

.advice-showcase-slider .acs__viewport {
    width: 100%;
}

.advice-showcase-slider .acs__shell {
    box-sizing: border-box;
    width: 100%;
    max-width: 1400px;
    margin-inline: auto;
}

@media screen and (min-width: 768px) and (max-width: 1439.98px) {
    .advice-showcase-slider .acs__shell {
        padding-inline: 20px;
    }

    theme-advice-showcase-slider {
        --acs-shell-inline: 10px;
    }
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs__shell {
        width: calc(100% - 40px);
    }
}

/*
     * Full-bleed inside .acs__shell: use margin calc(50% - 50vw) so the row lines up with the viewport
     * (left: 50%; margin-left: -50vw breaks when the parent is not full width).
     */
.advice-showcase-slider .acs__slider-bleed {
    width: 100vw;
    max-width: 100vw;
    position: relative;
    left: auto;
    right: auto;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.advice-showcase-slider .acs__slider-bleed .acs__carousel-inner {
    width: 100%;
}

/* Gutters: use slide padding so theme-carousel goTo() offsetLeft matches scroll position (padding on track can desync JS). */
.advice-showcase-slider .acs__track.carousel__track>.acs__slide:first-child {
    padding-inline-start: var(--acs-gutter);
}

.advice-showcase-slider .acs__track.carousel__track>.acs__slide:last-child {
    padding-inline-end: var(--acs-gutter);
}

@media screen and (max-width: 767.98px) {

    /* Every slide needs a leading gutter so cards stay inset after arrow/swipe navigation, not only the first. */
    .advice-showcase-slider .acs__track.carousel__track>.acs__slide {
        padding-inline-start: var(--acs-gutter);
        box-sizing: border-box;
    }

    .advice-showcase-slider theme-carousel.acs__carousel .carousel__track.acs__track {
        scroll-padding-inline: var(--acs-gutter);
    }
}

.advice-showcase-slider[data-title-align='center'] .acs__title {
    text-align: center;
}

.advice-showcase-slider .acs__title {
    font-size: 28px;
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 20px;
    margin-top: 0;
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs__title {
        margin-bottom: 10px;
        font-size: 20px;
    }

    .advice-showcase-slider[data-display-mode='mode3'] .acs__title {
        font-size: 24px;
    }
}

/* —— Mode 3: tab row (item labels) —— */
.advice-showcase-slider .acs__pills-wrap {
    margin-bottom: 24px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.advice-showcase-slider .acs__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs__pills {
        gap: 10px;
    }
}

.advice-showcase-slider .acs__pill {
    padding: 8px 16px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-radius: 50px;
    border: 1px solid #000;
    cursor: pointer;
    background: transparent;
}

@media screen and (min-width: 768px) and (max-width: 1439.98px) {
    .advice-showcase-slider .acs__pill {
        font-size: 12px;
    }
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs__pill {
        font-size: 12px;
        padding: 6px 16px;
        white-space: nowrap;
    }
}

.advice-showcase-slider .acs__pill.is-active {
    border-color: var(--acs-accent, #1455ff);
    background: #1455ff;
    color: #fff !important;
}

/* Hide carousel track when a visible panel has no slides */
.advice-showcase-slider .acs__panel-root:not([hidden]) .acs__carousel-stage:not(:has(.acs__slide)) {
    display: none;
}

/* —— Carousel frame —— */
.advice-showcase-slider .acs__carousel-stage {
    position: relative;
    width: 100%;
}

.advice-showcase-slider .acs__carousel {
    display: block;
    width: 100%;
}

.advice-showcase-slider .acs__carousel-inner {
    position: relative;
    width: 100%;
}

.advice-showcase-slider .acs__track {
    display: flex;
    gap: 20px;
    align-items: stretch;
    padding: 6px 0;
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs__track {
        gap: 0;
    }
}

.advice-showcase-slider .acs__track>.acs__slide {
    min-width: 0;
}

/* Free scroll in half-slide steps; theme-carousel defaults to scroll-snap mandatory. */
.advice-showcase-slider theme-carousel.acs__carousel .carousel__track.acs__track {
    scroll-snap-type: none;
}

.advice-showcase-slider theme-carousel.acs__carousel .carousel__track.acs__track>* {
    scroll-snap-align: none;
}

/* —— Nav arrows (visual aligned with reference carousel) —— */
.advice-showcase-slider .acs__arrow {
    position: absolute;
    z-index: 6;
    top: calc(50% - var(--acs-arrow-size) / 2);
    width: var(--acs-arrow-size);
    height: var(--acs-arrow-size);
    padding: 10px;
    margin: 0;
    cursor: pointer;
    border: none;
    background-color: rgba(0, 0, 0, .5);
    border-radius: 50px;
    box-shadow: 0px 0px 5px 1px rgba(255, 255, 255, .3);
}

.advice-showcase-slider .acs__arrow:focus-visible {
    outline: 2px solid #000;
    outline-offset: 2px;
}

.advice-showcase-slider .acs__arrow svg {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transform-origin: center;
}

.advice-showcase-slider .acs__arrow:disabled {
    display: none;
}

.advice-showcase-slider .acs__arrow--prev {
    left: 4px;
    right: auto;
    transform: scaleX(-1);
}

.advice-showcase-slider .acs__arrow--next {
    right: 4px;
    left: auto;
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs__arrow {
        width: 40px;
        height: 40px;
        padding: 8px;
    }
}

/* Arrows sit over the inner edge of the first/last *fully* visible card (reference layout), not the screen rim */
.advice-showcase-slider .acs__slider-bleed .acs__carousel-inner .acs__arrow--prev {
    left: calc(var(--acs-gutter) + 12px);
}

.advice-showcase-slider .acs__slider-bleed .acs__carousel-inner .acs__arrow--next {
    right: calc(var(--acs-gutter) + 12px);
}

theme-advice-showcase-slider .acs__carousel[data-single-slide='true'] .acs__arrow[data-role='acs-arrow'] {
    display: none !important;
}

@media screen and (max-width: 959.98px) {
    .advice-showcase-slider {
        --acs-arrow-size: 36px;
    }
}

/* —— Card shells —— */
.advice-showcase-slider .acs__slide {
    height: auto;
}

.advice-showcase-slider .acs-card {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    padding: 0;
    text-align: left;
    text-decoration: none;
    color: inherit;
    background: transparent;
    cursor: pointer;
    border-radius: var(--acs-radius);
    overflow: hidden;
}

.advice-showcase-slider a.acs-card:hover {
    text-decoration: none;
}

.advice-showcase-slider .acs-card:focus-visible {
    outline: 2px solid #000;
    outline-offset: 3px;
}

.advice-showcase-slider .acs-card__media {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
}

.advice-showcase-slider .acs-card__media-inner,
.advice-showcase-slider .acs-card__media-inner :is(picture, .image, img) {
    display: block;
    width: 100%;
    height: 100%;
}

.advice-showcase-slider .acs-card__media-inner :is(img) {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/* Mode 1 & 3 full-bleed frame */
.advice-showcase-slider .acs-card--overlay-full,
.advice-showcase-slider .acs-card--bottom-overlay {
    position: relative;
    display: block;
    width: 360px;
    height: 100%;
    aspect-ratio: 30 / 43;
    cursor: default;
    border-radius: var(--acs-radius);
}

.advice-showcase-slider .acs-card--overlay-full {
    aspect-ratio: 360 / 457;
    cursor: pointer;
}

@media screen and (min-width: 768px) and (max-width: 1439px) {
    .advice-showcase-slider .acs-card--bottom-overlay {
        width: 300px;
    }
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs-card--bottom-overlay {
        width: calc((100vw - 40px) * 0.88);
        border-radius: var(--acs-radius);
    }

    .advice-showcase-slider .acs-card--overlay-full {
        width: 260px;
        border-radius: var(--acs-radius);
        aspect-ratio: 26 / 33;
    }
}

.advice-showcase-slider .acs-card--overlay-full .acs-card__media-inner {
    transform: scale(1.001);
}

/* Mode 1 top overlay */
.advice-showcase-slider .acs-card__scrim--full {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom,
            rgba(255, 255, 255, 0.72) 0%,
            rgba(255, 255, 255, 0.32) 38%,
            rgba(0, 0, 0, 0.12) 100%);
    pointer-events: none;
}

.advice-showcase-slider .acs-card__overlay-top {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 20px 20px 0;
    max-width: 100%;
}

.advice-showcase-slider .acs-card__title-row {
    display: inline-flex;
    align-items: flex-end;
    gap: 6px;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.3;
    background-image: -webkit-linear-gradient(top, #1f7fff, #2683ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.advice-showcase-slider .acs-card__title-row:hover {
    text-decoration: none !important;
}

.advice-showcase-slider .acs-card__ext {
    font-size: 60%;
    padding-bottom: 4px;
}

.advice-showcase-slider .acs-card__desc-overlay {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    color: #000;
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs-card__title-row {
        font-size: 20px;
    }
}

/* Mode 1 — centered title & description (honor.com style) */
.advice-showcase-slider[data-mode1-centered-text='true'] .acs-card__overlay-centered {
    position: absolute;
    z-index: 2;
    width: 80%;
    left: 50%;
    top: 7%;
    transform: translateX(-50%);
    text-align: center;
}

.advice-showcase-slider[data-mode1-centered-text='true'] .acs-card__overlay-centered h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    color: #333333;
}

.advice-showcase-slider[data-mode1-centered-text='true'] .acs-card__overlay-centered h3 + p {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 5px;
    color: #333333;
}

/* Mode 3 bottom stack + zoom */
.advice-showcase-slider .acs-card__scrim--bottom {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.2) 46%, rgba(0, 0, 0, 0) 72%);
    pointer-events: none;
}

.advice-showcase-slider .acs-card__bottom-stack {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0 20px 20px;
    pointer-events: none;
}

/* Bottom stack uses none so carousel drag isn’t blocked; re-enable clicks on the link/button. */
.advice-showcase-slider .acs-card__bottom-stack .acs-card__bottom-action {
    pointer-events: auto;
    cursor: pointer;
}

.advice-showcase-slider .acs-card--bottom-overlay .acs-card__heading-lg {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--acs-mode3-card-title-color, #fff);
    margin: 0;
}

@media screen and (min-width: 768px) and (max-width: 1439px) {
    .advice-showcase-slider .acs-card--bottom-overlay .acs-card__heading-lg {
        font-size: 14px;
    }
}

.advice-showcase-slider .acs-card--bottom-overlay .acs-card__sub-bottom {
    font-size: 0.88rem;
    line-height: 1.4;
    color: var(--acs-mode3-card-description-color, rgba(255, 255, 255, .85));
    max-width: 36ch;
}

.advice-showcase-slider .acs-card--bottom-overlay .acs-card__inline-link.acs-card__bottom-action {
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    position: relative;
    display: inline-block;
    margin-top: 20px;
    color: var(--acs-mode3-card-link-color, #fff);
}

.advice-showcase-slider .acs-card--bottom-overlay .acs-card__inline-link.acs-card__bottom-action .acs-card__inline-link-icon {
    color: inherit;
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs-card--bottom-overlay .acs-card__inline-link.acs-card__bottom-action {
        margin-top: 10px;
    }
}

.advice-showcase-slider .acs-card__bottom-action:focus-visible {
    outline: 2px solid var(--acs-accent, #1a5aff);
    outline-offset: 2px;
    border-radius: 4px;
}

.advice-showcase-slider a.acs-card__bottom-action:hover {
    text-decoration: none !important;
}

.advice-showcase-slider .acs-card__media--zoomable .acs-card__media-inner {
    display: block;
    width: 100%;
    height: 100%;
    transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
}

@media (hover: hover) and (pointer: fine) {

    .advice-showcase-slider .acs-card--bottom-overlay:hover .acs-card__media--zoomable .acs-card__media-inner,
    .advice-showcase-slider .acs-card--bottom-overlay:focus-visible .acs-card__media--zoomable .acs-card__media-inner {
        transform: scale(1.08);
    }
}

/* Mode 2 split */
.advice-showcase-slider .acs-card--split {
    display: flex !important;
    flex-direction: column;
    width: 360px;
    height: 457px;
    background: #f9f9f9;
    border-radius: var(--acs-radius);
    overflow: hidden;
    cursor: default;
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs-card--split {
        width: calc(100vw - 40px);
        height: 425px;
    }
}

.advice-showcase-slider .acs-card--split .acs-card__figure {
    position: relative;
    min-height: 200px;
}

.advice-showcase-slider .acs-card--split .acs-card__figure-inner {
    position: absolute;
    inset: 0;
}

.advice-showcase-slider .acs-card--split .acs-card__figure-inner :is(picture, img, .image) {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.advice-showcase-slider .acs-card--split .acs-card__body {
    padding: 30px;
    background-color: #f9f9f9;
    flex: 1;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.advice-showcase-slider .acs-card--split .acs-card__title {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
    margin: 0;
}

.advice-showcase-slider .acs-card--split .acs-card__desc {
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    opacity: 0.6;
    margin-top: 10px;
    overflow: hidden;
    margin-bottom: 0;
}

.advice-showcase-slider .acs-card__cta {
    position: relative;
    align-self: flex-start;
    padding: 0;
    border: 0;
    background: none;
    text-decoration: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.3;
    margin-top: 20px;
}

.advice-showcase-slider .acs-card__cta svg {
    width: 16px;
    height: 16px;
    display: inline-block;
    color: var(--acs-accent, #256fff);
}

@media screen and (max-width: 767.98px) {
    .advice-showcase-slider .acs-card--split .acs-card__figure {
        min-height: 195px;
    }

    .advice-showcase-slider .acs-card--split .acs-card__body {
        padding: 20px 30px;
    }

    .advice-showcase-slider .acs-card--split .acs-card__title {
        font-size: 14px;
    }

    .advice-showcase-slider .acs-card__cta {
        font-size: 12px;
    }
}

/* ----- theme-promo-carousel-banner ----- */
theme-promo-carousel-banner {
    --promo-carousel-arrow-dark-bg: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1NSIgaGVpZ2h0PSI1NSIgdmlld0JveD0iMCAwIDU1IDU1Ij48ZGVmcz48bGluZWFyR3JhZGllbnQgeDE9IjAiIHkxPSIwLjUiIHgyPSIxIiB5Mj0iMC41IiBpZD0ibWFzdGVyX3N2ZzBfMTFfMzE5OCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI0I4QjhCOCIgc3RvcC1vcGFjaXR5PSIwLjQzOTk5OTk5NzYxNTgxNDIiLz48c3RvcCBvZmZzZXQ9Ijk5Ljk5OTk4MjExODYwNjU3JSIgc3RvcC1jb2xvcj0iI0JBQkFCQSIgc3RvcC1vcGFjaXR5PSIwIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PGc+PGc+PGVsbGlwc2UgY3g9IjI3LjUiIGN5PSIyNy41IiByeD0iMjcuNSIgcnk9IjI3LjUiIGZpbGw9InVybCgjbWFzdGVyX3N2ZzBfMTFfMzE5OCkiIGZpbGwtb3BhY2l0eT0iMSIvPjwvZz48Zz48ZyB0cmFuc2Zvcm09Im1hdHJpeCgtMSwwLDAsMSw4NCwwKSIgc3R5bGU9Im9wYWNpdHk6MDsiPjxyZWN0IHg9IjQyIiB5PSIxMyIgd2lkdGg9IjMwIiBoZWlnaHQ9IjMwIiByeD0iMCIgZmlsbD0iI0Q4RDhEOCIgZmlsbC1vcGFjaXR5PSIxIi8+PC9nPjxnIHRyYW5zZm9ybT0ibWF0cml4KC0xLDAsMCwxLDY0Ljc4OTA2MjUsMCkiPjxnPjxwYXRoIGQ9Ik0zMi41ODEwMTQyNSwxNy4yMjc3NTI4MDI3MzQzNzZRMzIuNzc2Mjc2MjUsMTcuNDIzMDEyODAyNzM0Mzc3LDQyLjk1MzgzMTI1LDI3LjYwMDcyMjgwMjczNDM3NEM0My4wNzQ3MzEyNSwyNy43MjE1MjI4MDI3MzQzNzcsNDMuMDg1ODMxMjUsMjcuOTA4MDIyODAyNzM0Mzc2LDQyLjk4MjIzMTI1LDI4LjAzODkyMjgwMjczNDM3Nkw0Mi41ODg3MzEyNSwyOC40MzI0MjI4MDI3MzQzNzZMNDIuNTg4NzMxMjUsMjguNDMyNDIyODAyNzM0Mzc2TDMyLjU4MTYyNDI1LDM4LjQzOTUyMjgwMjczNDM3QzMyLjM4NjM2MjM5LDM4LjYzNDgyMjgwMjczNDM4LDMyLjM4NjMwNTQ3LDM4Ljk1MTUyMjgwMjczNDM3NCwzMi41ODE1NjcyNSwzOS4xNDY4MjI4MDI3MzQzOEwzMi45MzU1NDQyNSwzOS41MDA2MjI4MDI3MzQzOEMzMy4xMzA4MDYyNSwzOS42OTU4MjI4MDI3MzQzOCwzMy40NDczOTEyNSwzOS42OTU4MjI4MDI3MzQzOCwzMy42NDI2NTEyNSwzOS41MDA2MjI4MDI3MzQzOEw0NC4wMTQ5MzEyNTAwMDAwMDQsMjkuMTI4MjIyODAyNzM0Mzc0QzQ0Ljc5NDQzMTI1LDI4LjM0ODcyMjgwMjczNDM3NSw0NC44NzAxMzEyNSwyNy4zOTU2MjI4MDI3MzQzNzMsNDQuMDcxMDMxMjUwMDAwMDA0LDI2LjU5NjUyMjgwMjczNDM3N0w0My42NTcwMzEyNSwyNi4xODA0MjI4MDI3MzQzNzdMNDMuNjU3MDMxMjUsMjYuMTgwNDIyODAyNzM0Mzc3TDMzLjY0MjY1MTI1LDE2LjE2NjA2OTgwMjczNDM3M0MzMy40NDczOTEyNSwxNS45NzA4MDczMDI3MzQzNzUsMzMuMTMwODA2MjUsMTUuOTcwODA3MzAyNzM0Mzc1LDMyLjkzNTU0NDI1LDE2LjE2NjA2OTgwMjczNDM3M0wzMi41MTAzMzUyNSwxNi41OTEzOTk4MDI3MzQzNzZDMzIuMzE1MDczMzUsMTYuNzg2NjYxODAyNzM0Mzc1LDMyLjM4NTc1MjA0LDE3LjAzMjQ5MjgwMjczNDM3NCwzMi41ODEwMTQyNSwxNy4yMjc3NTI4MDI3MzQzNzZaIiBmaWxsPSIjMDAwMDAwIiBmaWxsLW9wYWNpdHk9IjAuODk5OTk5OTc2MTU4MTQyMSIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4=');
    --promo-carousel-arrow-dark-hover: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1NSIgaGVpZ2h0PSI1NSIgdmlld0JveD0iMCAwIDU1IDU1Ij48Zz48Zz48ZWxsaXBzZSBjeD0iMjcuNSIgY3k9IjI3LjUiIHJ4PSIyNy41IiByeT0iMjcuNSIgZmlsbD0iI0I4QjhCOCIgZmlsbC1vcGFjaXR5PSIwLjQzOTk5OTk5NzYxNTgxNDIiLz48L2c+PGc+PGcgdHJhbnNmb3JtPSJtYXRyaXgoLTEsMCwwLDEsODQsMCkiIHN0eWxlPSJvcGFjaXR5OjA7Ij48cmVjdCB4PSI0MiIgeT0iMTMiIHdpZHRoPSIzMCIgaGVpZ2h0PSIzMCIgcng9IjAiIGZpbGw9IiNEOEQ4RDgiIGZpbGwtb3BhY2l0eT0iMSIvPjwvZz48ZyB0cmFuc2Zvcm09Im1hdHJpeCgtMSwwLDAsMSw2NC43ODkwNjI1LDApIj48Zz48cGF0aCBkPSJNMzIuNTgxMDE0MjUsMTcuMjI3NzUyODAyNzM0Mzc2UTMyLjc3NjI3NjI1LDE3LjQyMzAxMjgwMjczNDM3Nyw0Mi45NTM4MzEyNSwyNy42MDA3MjI4MDI3MzQzNzRDNDMuMDc0NzMxMjUsMjcuNzIxNTIyODAyNzM0Mzc3LDQzLjA4NTgzMTI1LDI3LjkwODAyMjgwMjczNDM3Niw0Mi45ODIyMzEyNSwyOC4wMzg5MjI4MDI3MzQzNzZMNDIuNTg4NzMxMjUsMjguNDMyNDIyODAyNzM0Mzc2TDQyLjU4ODczMTI1LDI4LjQzMjQyMjgwMjczNDM3NkwzMi41ODE2MjQyNSwzOC40Mzk1MjI4MDI3MzQzN0MzMi4zODYzNjIzOSwzOC42MzQ4MjI4MDI3MzQzOCwzMi4zODYzMDU0NywzOC45NTE1MjI4MDI3MzQzNzQsMzIuNTgxNTY3MjUsMzkuMTQ2ODIyODAyNzM0MzhMMzIuOTM1NTQ0MjUsMzkuNTAwNjIyODAyNzM0MzhDMzMuMTMwODA2MjUsMzkuNjk1ODIyODAyNzM0MzgsMzMuNDQ3MzkxMjUsMzkuNjk1ODIyODAyNzM0MzgsMzMuNjQyNjUxMjUsMzkuNTAwNjIyODAyNzM0MzhMNDQuMDE0OTMxMjUwMDAwMDA0LDI5LjEyODIyMjgwMjczNDM3NEM0NC43OTQ0MzEyNSwyOC4zNDg3MjI4MDI3MzQzNzUsNDQuODcwMTMxMjUsMjcuMzk1NjIyODAyNzM0MzczLDQ0LjA3MTAzMTI1MDAwMDAwNCwyNi41OTY1MjI4MDI3MzQzNzdMNDMuNjU3MDMxMjUsMjYuMTgwNDIyODAyNzM0Mzc3TDQzLjY1NzAzMTI1LDI2LjE4MDQyMjgwMjczNDM3N0wzMy42NDI2NTEyNSwxNi4xNjYwNjk4MDI3MzQzNzNDMzMuNDQ3MzkxMjUsMTUuOTcwODA3MzAyNzM0Mzc1LDMzLjEzMDgwNjI1LDE1Ljk3MDgwNzMwMjczNDM3NSwzMi45MzU1NDQyNSwxNi4xNjYwNjk4MDI3MzQzNzNMMzIuNTEwMzM1MjUsMTYuNTkxMzk5ODAyNzM0Mzc2QzMyLjMxNTA3MzM1LDE2Ljc4NjY2MTgwMjczNDM3NSwzMi4zODU3NTIwNCwxNy4wMzI0OTI4MDI3MzQzNzQsMzIuNTgxMDE0MjUsMTcuMjI3NzUyODAyNzM0Mzc2WiIgZmlsbD0iIzAwMDAwMCIgZmlsbC1vcGFjaXR5PSIwLjg5OTk5OTk3NjE1ODE0MjEiLz48L2c+PC9nPjwvZz48L2c+PC9zdmc+');
    --promo-carousel-arrow-light-bg: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1NSIgaGVpZ2h0PSI1NSIgdmlld0JveD0iMCAwIDU1IDU1Ij48ZGVmcz48ZmlsdGVyIGlkPSJtYXN0ZXJfc3ZnMF8xMV8zMTg3IiBmaWx0ZXJVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiIgeD0iMCIgeT0iMCIgd2lkdGg9IjU1IiBoZWlnaHQ9IjU1Ij48ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPjxmZUJsZW5kIG1vZGU9Im5vcm1hbCIgaW49IlNvdXJjZUdyYXBoaWMiIGluMj0iQmFja2dyb3VuZEltYWdlRml4IiByZXN1bHQ9InNoYXBlIi8+PGZlR2F1c3NpYW5CbHVyIGluPSJCYWNrZ3JvdW5kSW1hZ2UiIHN0ZERldmlhdGlvbj0iMTAiLz48ZmVDb21wb3NpdGUgaW4yPSJTb3VyY2VBbHBoYSIgb3BlcmF0b3I9ImluIiByZXN1bHQ9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXIiLz48ZmVCbGVuZCBtb2RlPSJub3JtYWwiIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXIiIHJlc3VsdD0ic2hhcGUiLz48L2ZpbHRlcj48L2RlZnM+PGc+PGcgZmlsdGVyPSJ1cmwoI21hc3Rlcl9zdmcwXzExXzMxODcpIj48ZWxsaXBzZSBjeD0iMjcuNSIgY3k9IjI3LjUiIHJ4PSIyNy41IiByeT0iMjcuNSIgZmlsbD0iI0I4QjhCOCIgZmlsbC1vcGFjaXR5PSIwLjQzOTk5OTk5NzYxNTgxNDIiLz48L2c+PGc+PGc+PGc+PHBhdGggZD0iTTMzLjMzMzkyNzM4MzQyMjg1LDE3LjY4Njg2NzM1MTY4NDU3TDIzLjMxNjU1NzM4MzQyMjg1LDI3LjcwNDIwNzM1MTY4NDU3QzIzLjE5NTY3NzM4MzQyMjg1LDI3LjgyNTEwNzM1MTY4NDU3MiwyMy4xODcwNDczODM0MjI4NSwyOC4wMTU3MDczNTE2ODQ1NywyMy4yOTA2NTczODM0MjI4NSwyOC4xNDY1MDczNTE2ODQ1N0wyMy4zMjY3NDczODM0MjI4NTIsMjguMTg1ODA3MzUxNjg0NTdMMjMuMzI2NzQ3MzgzNDIyODUyLDI4LjE4NTgwNzM1MTY4NDU3TDMzLjMzMzkyNzM4MzQyMjg1LDM4LjE5MzAwNzM1MTY4NDU3QzMzLjUyOTEyNzM4MzQyMjg1LDM4LjM4ODIwNzM1MTY4NDU3LDMzLjUyOTEyNzM4MzQyMjg1LDM4LjcwNDgwNzM1MTY4NDU3LDMzLjMzMzkyNzM4MzQyMjg1LDM4LjkwMDEwNzM1MTY4NDU3TDMyLjYyNjgyNzM4MzQyMjg1LDM5LjYwNzIwNzM1MTY4NDU3QzMyLjQzMTUyNzM4MzQyMjg1LDM5LjgwMjQwNzM1MTY4NDU3LDMyLjExNDkyNzM4MzQyMjg1LDM5LjgwMjQwNzM1MTY4NDU3LDMxLjkxOTcyNzM4MzQyMjg1MywzOS42MDcyMDczNTE2ODQ1N0wyMS45MDIzNDQzODM0MjI4NSwyOS41ODk4MDczNTE2ODQ1N0MyMS4wMTAxMDUzODM0MjI4NSwyOC42OTc2MDczNTE2ODQ1NywyMC45OTE1MTczODM0MjI4NTMsMjcuMjYyNTA3MzUxNjg0NTcsMjEuODQ2NTgwMzgzNDIyODUsMjYuMzQ3NzA3MzUxNjg0NTdMMjEuOTA1MzI2MzgzNDIyODUzLDI2LjI4NzAwNzM1MTY4NDU3MkwyMS45MDUzMjYzODM0MjI4NTMsMjYuMjg3MDA3MzUxNjg0NTcyTDMxLjkxOTcyNzM4MzQyMjg1MywxNi4yNzI2NTQzNTE2ODQ1N0MzMi4xMTQ5MjczODM0MjI4NSwxNi4wNzczOTE4NTE2ODQ1NywzMi40MzE1MjczODM0MjI4NSwxNi4wNzczOTE4NTE2ODQ1NywzMi42MjY4MjczODM0MjI4NSwxNi4yNzI2NTQzNTE2ODQ1N0wzMy4zMzM5MjczODM0MjI4NSwxNi45Nzk3NjAzNTE2ODQ1NzJDMzMuNTI5MTI3MzgzNDIyODUsMTcuMTc1MDI3MzUxNjg0NTcsMzMuNTI5MTI3MzgzNDIyODUsMTcuNDkxNjA3MzUxNjg0NTcsMzMuMzMzOTI3MzgzNDIyODUsMTcuNjg2ODY3MzUxNjg0NTdaIiBmaWxsPSIjRkZGRkZGIiBmaWxsLW9wYWNpdHk9IjAuODk5OTk5OTc2MTU4MTQyMSIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4');
    --promo-carousel-arrow-light-hover: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1NSIgaGVpZ2h0PSI1NSIgdmlld0JveD0iMCAwIDU1IDU1Ij48ZGVmcz48ZmlsdGVyIGlkPSJtYXN0ZXJfc3ZnMF8xMV8zMTg3IiBmaWx0ZXJVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiIgeD0iMCIgeT0iMCIgd2lkdGg9IjU1IiBoZWlnaHQ9IjU1Ij48ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPjxmZUJsZW5kIG1vZGU9Im5vcm1hbCIgaW49IlNvdXJjZUdyYXBoaWMiIGluMj0iQmFja2dyb3VuZEltYWdlRml4IiByZXN1bHQ9InNoYXBlIi8+PGZlR2F1c3NpYW5CbHVyIGluPSJCYWNrZ3JvdW5kSW1hZ2UiIHN0ZERldmlhdGlvbj0iMTAiLz48ZmVDb21wb3NpdGUgaW4yPSJTb3VyY2VBbHBoYSIgb3BlcmF0b3I9ImluIiByZXN1bHQ9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXIiLz48ZmVCbGVuZCBtb2RlPSJub3JtYWwiIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXIiIHJlc3VsdD0ic2hhcGUiLz48L2ZpbHRlcj48L2RlZnM+PGc+PGcgZmlsdGVyPSJ1cmwoI21hc3Rlcl9zdmcwXzExXzMxODcpIj48ZWxsaXBzZSBjeD0iMjcuNSIgY3k9IjI3LjUiIHJ4PSIyNy41IiByeT0iMjcuNSIgZmlsbD0iI0I4QjhCOCIgZmlsbC1vcGFjaXR5PSIwLjQzOTk5OTk5NzYxNTgxNDIiLz48L2c+PGc+PGc+PGc+PHBhdGggZD0iTTMzLjMzMzkyNzM4MzQyMjg1LDE3LjY4Njg2NzM1MTY4NDU3TDIzLjMxNjU1NzM4MzQyMjg1LDI3LjcwNDIwNzM1MTY4NDU3QzIzLjE5NTY3NzM4MzQyMjg1LDI3LjgyNTEwNzM1MTY4NDU3MiwyMy4xODcwNDczODM0MjI4NSwyOC4wMTU3MDczNTE2ODQ1NywyMy4yOTA2NTczODM0MjI4NSwyOC4xNDY1MDczNTE2ODQ1N0wyMy4zMjY3NDczODM0MjI4NTIsMjguMTg1ODA3MzUxNjg0NTdMMjMuMzI2NzQ3MzgzNDIyODUyLDI4LjE4NTgwNzM1MTY4NDU3TDMzLjMzMzkyNzM4MzQyMjg1LDM4LjE5MzAwNzM1MTY4NDU3QzMzLjUyOTEyNzM4MzQyMjg1LDM4LjM4ODIwNzM1MTY4NDU3LDMzLjUyOTEyNzM4MzQyMjg1LDM4LjcwNDgwNzM1MTY4NDU3LDMzLjMzMzkyNzM4MzQyMjg1LDM4LjkwMDEwNzM1MTY4NDU3TDMyLjYyNjgyNzM4MzQyMjg1LDM5LjYwNzIwNzM1MTY4NDU3QzMyLjQzMTUyNzM4MzQyMjg1LDM5LjgwMjQwNzM1MTY4NDU3LDMyLjExNDkyNzM4MzQyMjg1LDM5LjgwMjQwNzM1MTY4NDU3LDMxLjkxOTcyNzM4MzQyMjg1MywzOS42MDcyMDczNTE2ODQ1N0wyMS45MDIzNDQzODM0MjI4NSwyOS41ODk4MDczNTE2ODQ1N0MyMS4wMTAxMDUzODM0MjI4NSwyOC42OTc2MDczNTE2ODQ1NywyMC45OTE1MTczODM0MjI4NTMsMjcuMjYyNTA3MzUxNjg0NTcsMjEuODQ2NTgwMzgzNDIyODUsMjYuMzQ3NzA3MzUxNjg0NTdMMjEuOTA1MzI2MzgzNDIyODUzLDI2LjI4NzAwNzM1MTY4NDU3MkwyMS45MDUzMjYzODM0MjI4NTMsMjYuMjg3MDA3MzUxNjg0NTcyTDMxLjkxOTcyNzM4MzQyMjg1MywxNi4yNzI2NTQzNTE2ODQ1N0MzMi4xMTQ5MjczODM0MjI4NSwxNi4wNzczOTE4NTE2ODQ1NywzMi40MzE1MjczODM0MjI4NSwxNi4wNzczOTE4NTE2ODQ1NywzMi42MjY4MjczODM0MjI4NSwxNi4yNzI2NTQzNTE2ODQ1N0wzMy4zMzM5MjczODM0MjI4NSwxNi45Nzk3NjAzNTE2ODQ1NzJDMzMuNTI5MTI3MzgzNDIyODUsMTcuMTc1MDI3MzUxNjg0NTcsMzMuNTI5MTI3MzgzNDIyODUsMTcuNDkxNjA3MzUxNjg0NTcsMzMuMzMzOTI3MzgzNDIyODUsMTcuNjg2ODY3MzUxNjg0NTdaIiBmaWxsPSIjRkZGRkZGIiBmaWxsLW9wYWNpdHk9IjAuODk5OTk5OTc2MTU4MTQyMSIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4');
    --promo-carousel-arrow-bg: var(--promo-carousel-arrow-dark-bg);
    --promo-carousel-arrow-bg-hover: var(--promo-carousel-arrow-dark-hover);
    /* Resume = triangle; pause = bars. Default chrome: dark glyphs on light circle. */
    --promo-play-toggle-icon-resume: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI4IiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgOCAxMCI+PGcgc3R5bGU9Im1peC1ibGVuZC1tb2RlOnBhc3N0aHJvdWdoIj48cGF0aCBkPSJNMCwxLjA4MjU1TDAsOC45MTc0NUMwLDkuMzg4NzEsMC41MTgzNzEsOS42NzYwMiwwLjkxNzk5OSw5LjQyNjI1TDcuMTg1OTIsNS41MDg4QzcuNTYxOTIsNS4yNzM4LDcuNTYxOTIsNC43MjYyLDcuMTg1OTIsNC40OTEyTDAuOTE3OTk5LDAuNTczNzVDMC41MTgzNzEsMC4zMjM5ODIsMCwwLjYxMTI4NywwLDEuMDgyNTVaIiBmaWxsPSIjMDAwMDAwIiBmaWxsLW9wYWNpdHk9IjEiLz48L2c+PC9zdmc+');
    --promo-play-toggle-icon-pause: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI4IiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgOCAxMCI+PGcgc3R5bGU9Im1peC1ibGVuZC1tb2RlOnBhc3N0aHJvdWdoIj48ZyBzdHlsZT0ibWl4LWJsZW5kLW1vZGU6cGFzc3Rocm91Z2giPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIzIiBoZWlnaHQ9IjEwIiByeD0iMS41IiBmaWxsPSIjMDAwMDAwIiBmaWxsLW9wYWNpdHk9IjEiLz48L2c+PGcgc3R5bGU9Im1peC1ibGVuZC1tb2RlOnBhc3N0aHJvdWdoIj48cmVjdCB4PSI1IiB5PSIwIiB3aWR0aD0iMyIgaGVpZ2h0PSIxMCIgcng9IjEuNSIgZmlsbD0iIzAwMDAwMCIgZmlsbC1vcGFjaXR5PSIxIi8+PC9nPjwvZz48L3N2Zz4=');
    position: relative;
    display: block;
    width: 100%;
    max-width: 2560px;
    margin-inline: auto;
    overflow: hidden;
}

theme-promo-carousel-banner:has(.promo-carousel-banner__slide-link) {
    cursor: pointer;
}

theme-promo-carousel-banner[data-arrow-style="light"] {
    --promo-carousel-arrow-bg: var(--promo-carousel-arrow-light-bg);
    --promo-carousel-arrow-bg-hover: var(--promo-carousel-arrow-light-hover);
    --promo-play-toggle-icon-resume: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI4IiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgOCAxMCI+PGcgc3R5bGU9Im1peC1ibGVuZC1tb2RlOnBhc3N0aHJvdWdoIj48cGF0aCBkPSJNMCwxLjA4MjU1TDAsOC45MTc0NUMwLDkuMzg4NzEsMC41MTgzNzEsOS42NzYwMiwwLjkxNzk5OSw5LjQyNjI1TDcuMTg1OTIsNS41MDg4QzcuNTYxOTIsNS4yNzM4LDcuNTYxOTIsNC43MjYyLDcuMTg1OTIsNC40OTEyTDAuOTE3OTk5LDAuNTczNzVDMC41MTgzNzEsMC4zMjM5ODIsMCwwLjYxMTI4NywwLDEuMDgyNTVaIiBmaWxsPSIjRkZGRkZGIiBmaWxsLW9wYWNpdHk9IjEiLz48L2c+PC9zdmc+');
    --promo-play-toggle-icon-pause: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI4IiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgOCAxMCI+PGcgc3R5bGU9Im1peC1ibGVuZC1tb2RlOnBhc3N0aHJvdWdoIj48ZyBzdHlsZT0ibWl4LWJsZW5kLW1vZGU6cGFzc3Rocm91Z2giPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIzIiBoZWlnaHQ9IjEwIiByeD0iMS41IiBmaWxsPSIjRkZGRkZGIiBmaWxsLW9wYWNpdHk9IjEiLz48L2c+PGcgc3R5bGU9Im1peC1ibGVuZC1tb2RlOnBhc3N0aHJvdWdoIj48cmVjdCB4PSI1IiB5PSIwIiB3aWR0aD0iMyIgaGVpZ2h0PSIxMCIgcng9IjEuNSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1vcGFjaXR5PSIxIi8+PC9nPjwvZz48L3N2Zz4=');
}



theme-promo-carousel-banner .promo-carousel-banner__carousel {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.promo-carousel-banner__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 750px;
    min-height: 0;
    overflow: hidden;
}

@media screen and (min-width: 751px) and (max-width: 1440px) {
    .promo-carousel-banner__inner {
        height: 52.083vw;
    }
}

@media screen and (max-width: 750px) {
    .promo-carousel-banner__inner {
        height: 138.8888vw;
    }
}

theme-promo-carousel-banner .promo-carousel-banner__track {
    display: flex;
    flex: 1 1 auto;
    align-items: stretch;
    align-self: stretch;
    width: 100%;
    min-height: 0;
}

theme-promo-carousel-banner .promo-carousel-banner__slide {
    position: relative;
    flex: 0 0 100%;
    align-self: stretch;
    width: 100%;
    min-height: 100%;
}

.promo-carousel-banner__slide-link {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    text-decoration: none;
    color: inherit;
}

.promo-carousel-banner__slide-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.promo-carousel-banner__slide-bg-inner {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2560px;
    height: 100%;
}


.promo-carousel-banner__slide-bg-inner :is(.image, picture, img) {
    display: block;
    width: 100%;
    height: 100%;
}

.promo-carousel-banner__slide-bg-inner :is(img, picture img) {
    object-fit: contain;
}

.promo-carousel-banner__arrow {
    position: absolute;
    z-index: 10;
    top: calc(50% - 55px / 2);
    width: 55px;
    height: 55px;
    padding: 0;
    margin: 0;
    cursor: pointer;
    background-color: transparent;
    border: none;
    border-radius: 0;
    background-image: var(--promo-carousel-arrow-bg);
    background-size: auto;
    background-repeat: round;
    background-position: unset;
    -webkit-appearance: none;
    appearance: none;
}

.promo-carousel-banner__arrow:focus-visible {
    outline: revert;
}

.promo-carousel-banner__arrow:hover {
    background-image: var(--promo-carousel-arrow-bg-hover);
}

.promo-carousel-banner__arrow--prev {
    left: 60px;
    right: auto;
}

.promo-carousel-banner__arrow--next {
    right: 60px;
    left: auto;
    transform: scaleX(-1);
}

@media screen and (min-width: 751px) and (max-width: 1440px) {
    .promo-carousel-banner__arrow--prev {
        left: 5px;
    }

    .promo-carousel-banner__arrow--next {
        right: 5px;
    }
}

@media screen and (max-width: 839.98px) {
    .promo-carousel-banner__arrow {
        top: calc(50% - 32px / 2);
        width: 32px;
        height: 32px;
    }

    .promo-carousel-banner__arrow--prev {
        left: 20px;
    }

    .promo-carousel-banner__arrow--next {
        right: 20px;
    }
}


.promo-carousel-banner__controls {
    position: absolute;
    z-index: 10;
    bottom: 28px;
    left: 50%;
    display: flex;
    align-items: center;
    width: auto;
    max-width: min(560px, calc(100% - 80px));
    transform: translateX(-50%);
}

@media screen and (max-width: 839.98px) {
    .promo-carousel-banner__controls {
        bottom: 8px;
        max-width: min(100% - 48px, 420px);
    }
}

.promo-carousel-banner__play-toggle {
    position: relative;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    cursor: pointer;
    border: none;
    background-color: transparent;
}

.promo-carousel-banner__play-toggle::before {
    position: absolute;
    content: "";
    width: 24px;
    height: 24px;
    margin: auto;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center;
    pointer-events: none;
}

.promo-carousel-banner__play-toggle[data-playing="true"]::before {
    background-image: var(--promo-play-toggle-icon-pause);
    background-size: 8px 10px;
}

.promo-carousel-banner__play-toggle[data-playing="false"]::before {
    background-image: var(--promo-play-toggle-icon-resume);
    background-size: 8px 10px;
}

theme-promo-carousel-banner[data-arrow-style="light"] .promo-carousel-banner__play-toggle {
    box-shadow: none;
}

.promo-carousel-banner__progress-wrap {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.promo-carousel-banner__pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    align-items: center;
    justify-content: center;
    width: auto;
}

.promo-carousel-banner__pagination-item {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    height: 24px;
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: none;
}

.promo-carousel-banner__pagination-track {
    position: relative;
    display: inline-block;
    width: 80px;
    height: 2px;
    margin: 0 8px;
    background-color: rgba(0, 0, 0, 0.2);
}

.promo-carousel-banner__pagination-fill {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    width: 0;
    height: 2px;
    background-color: rgba(0, 0, 0, 1);
    transform-origin: left center;
    transition: none;
}

/**
 * Promo carousel banner: segment progress matches autoplay interval.
 * Duration is mirrored via --promo-carousel-autoplay-duration on theme-promo-carousel-banner.
 */
@keyframes promo-carousel-pager-progress {
    from {
        width: 0;
    }

    to {
        width: 100%;
    }
}

theme-promo-carousel-banner .promo-carousel-banner__pagination-item.is-active .promo-carousel-banner__pagination-fill {
    animation: promo-carousel-pager-progress linear var(--promo-carousel-autoplay-duration, 6s) forwards;
}

theme-promo-carousel-banner .promo-carousel-banner__pagination-item:not(.is-active) .promo-carousel-banner__pagination-fill {
    animation: none;
    width: 0;
}

theme-promo-carousel-banner[data-progress-paused="true"] .promo-carousel-banner__pagination-item.is-active .promo-carousel-banner__pagination-fill {
    animation-play-state: paused;
}

theme-promo-carousel-banner[data-arrow-style="light"] .promo-carousel-banner__pagination-track {
    background-color: rgba(255, 255, 255, 0.2);
}

theme-promo-carousel-banner[data-arrow-style="light"] .promo-carousel-banner__pagination-fill {
    background-color: rgba(255, 255, 255, 1);
}

@media screen and (max-width: 839.98px) {
    .promo-carousel-banner__pagination-track {
        width: 18px;
        margin: 0 3px;
    }

    theme-promo-carousel-banner .promo-carousel-banner__pagination-item.is-active .promo-carousel-banner__pagination-fill {
        inset-inline-start: 0;
    }
}

/* ----- theme-store-service-banner ----- */
theme-store-service-banner {
    display: block;
    width: 100%;
    max-width: 2560px;
    margin-inline: auto;
    --ssb-panel-bg: #f7f7f7;
    --ssb-hover-bg: #2b70f4;
    --ssb-accent: #2b70f4;
    --ssb-heading-color: #111111;
}

.store-service-banner__stage {
    width: 100%;
    padding-inline: var(--page-margin, 16px);
    padding-block: clamp(24px, 3vw, 48px);
    box-sizing: border-box;
}

.store-service-banner__panel {
    box-sizing: border-box;
    width: 100%;
    max-width: 1320px;
    margin-inline: auto;
    padding: clamp(20px, 3vw, 28px) clamp(18px, 3vw, 36px);
    border-radius: 18px;
    background: var(--ssb-panel-bg);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: clamp(20px, 3vw, 28px);
}

@media screen and (min-width: 751px) {
    .store-service-banner__panel {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: clamp(24px, 3vw, 48px);
    }
}

.store-service-banner__heading {
    margin: 0;
    flex: 0 1 auto;
    max-width: 22em;
    font-size: clamp(1.05rem, 0.35vw + 0.95rem, 1.35rem);
    font-weight: 700;
    line-height: 1.35;
    color: var(--ssb-heading-color);
    text-align: center;
}

@media screen and (min-width: 751px) {
    .store-service-banner__heading {
        text-align: left;
    }
}

.store-service-banner__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1 1 auto;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(10px, 2vw, 14px);
}

@media screen and (min-width: 751px) {
    .store-service-banner__grid {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: clamp(8px, 1.2vw, 12px);
    }
}

.store-service-banner__item {
    -webkit-tap-highlight-color: transparent;
    appearance: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    gap: 10px;
    margin: 0;
    padding: clamp(14px, 2vw, 18px) clamp(10px, 1.5vw, 14px);
    border: none;
    border-radius: 12px;
    background: transparent;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    font: inherit;
    box-sizing: border-box;
    min-height: 100%;
    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

@media screen and (min-width: 751px) {
    .store-service-banner__item {
        flex: 1 1 0;
        min-width: 0;
    }
}

.store-service-banner__item:focus-visible {
    outline: 2px solid var(--ssb-accent);
    outline-offset: 2px;
}

@media (hover: hover) and (pointer: fine) {
    .store-service-banner__item:hover {
        background-color: var(--ssb-hover-bg);
        color: #fff;
    }

    .store-service-banner__item:hover .store-service-banner__subtitle {
        color: rgba(255, 255, 255, 0.88);
    }

    .store-service-banner__item:hover .store-service-banner__arrow {
        color: #fff;
    }

    .store-service-banner__item:hover .store-service-banner__icon :is(img, picture img) {
        filter: brightness(0) invert(1);
    }
}

.store-service-banner__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
}

.store-service-banner__icon :is(.image, picture, img) {
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.store-service-banner__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    width: 100%;
    min-width: 0;
}

.store-service-banner__title-line {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: center;
    gap: 0.2em;
    max-width: 100%;
}

.store-service-banner__title {
    font-size: clamp(0.8rem, 0.25vw + 0.72rem, 0.95rem);
    font-weight: 600;
    line-height: 1.35;
    color: #222;
    transition: color 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
    .store-service-banner__item:hover .store-service-banner__title {
        color: #fff;
    }
}

.store-service-banner__arrow {
    flex-shrink: 0;
    font-size: 0.95em;
    font-weight: 600;
    line-height: 1;
    color: var(--ssb-accent);
    transition: color 0.2s ease;
}

.store-service-banner__subtitle {
    font-size: clamp(0.68rem, 0.2vw + 0.62rem, 0.8rem);
    line-height: 1.4;
    color: #777;
    transition: color 0.2s ease;
}


/* ----- theme-text-with-image ----- */
theme-text-with-image {
    display: block;
    width: 100%;
    max-width: 2560px;
    margin-inline: auto;
}

.text-with-image__stage {
    width: 100%;
    padding-inline: var(--page-margin, 16px);
    padding-block: clamp(24px, 4vw, 48px);
}

.text-with-image__card {
    margin-inline: auto;
    width: 100%;
    max-width: 1320px;
    border-radius: 24px;
    overflow: hidden;
    background: linear-gradient(to right top,
            var(--twi-bg-1, #f1ebe2) 50%,
            var(--twi-bg-2, #fdfaf1) 100%);
    transform-origin: 50% 0%;
    box-sizing: border-box;
}

.text-with-image__inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: clamp(24px, 4vw, 56px);
    padding: clamp(28px, 4.5vw, 56px) clamp(24px, 4vw, 64px);
    min-height: min(420px, 52vw);
}

.text-with-image__inner[data-layout="left_image_right_text"] {
    flex-direction: row-reverse;
}

.text-with-image__copy {
    flex: 1 1 42%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}

.text-with-image__title {
    margin: 0;
}

.text-with-image__title--image {
    line-height: 0;
    max-width: 100%;
}

.text-with-image__title-img {
    display: block;
    max-width: min(560px, 100%);
}

.text-with-image__title-img :is(picture, .image, img) {
    display: block;
    width: 100%;
    height: auto;
}

.text-with-image__subtitle {
    margin: 0;
    font-size: clamp(1rem, 0.6vw + 0.85rem, 1.25rem);
    line-height: 1.45;
    color: #111;
    font-weight: 400;
}

.text-with-image__info {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    font-size: 0.875rem;
    color: #444;
    text-decoration: none;
}

.text-with-image__info:hover {
    text-decoration: underline;
}

.text-with-image__info-icon {
    display: inline-flex;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

.text-with-image__info-icon :is(.image, picture, img) {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.text-with-image__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 24px;
    margin-top: 8px;
}

.text-with-image__btn-primary.button {
    border-radius: 999px;
    padding-inline: 28px;
}

.text-with-image__link-secondary {
    font-size: 0.9375rem;
    font-weight: 500;
    color: #111;
    text-decoration: none;
}

.text-with-image__link-secondary:hover {
    text-decoration: underline;
}

.text-with-image__media {
    flex: 1 1 50%;
    min-width: 0;
    align-self: stretch;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.text-with-image__img-box {
    position: relative;
    display: block;
    width: 100%;
    max-width: 560px;
    margin-inline: auto;
    text-decoration: none;
    color: inherit;
}

.text-with-image__pic {
    display: block;
    transform-origin: 50% 80%;
    will-change: transform;
}

.text-with-image__pic :is(img, picture img) {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: middle;
}

.text-with-image__pic--primary {
    position: relative;
    z-index: 2;
    width: 74%;
    margin-left: auto;
    margin-right: 0;
}

.text-with-image__inner[data-layout="left_image_right_text"] .text-with-image__pic--primary {
    margin-left: 0;
    margin-right: auto;
}

.text-with-image__pic--secondary {
    position: absolute;
    z-index: 1;
    width: 68%;
    left: 0;
    bottom: 0;
    transform-origin: 50% 90%;
    will-change: transform;
}

.text-with-image__inner[data-layout="left_image_right_text"] .text-with-image__pic--secondary {
    left: auto;
    right: 0;
}

.text-with-image__img-box[data-single-image="true"] .text-with-image__pic--primary {
    width: 100%;
    margin-inline: 0;
}

@media screen and (max-width: 750px) {
    .text-with-image__card {
        transform: none !important;
    }

    .text-with-image__pic {
        will-change: auto;
    }

    .text-with-image__inner {
        flex-direction: column;
        align-items: stretch;
        min-height: 0;
    }

    .text-with-image__inner[data-layout="left_text_right_image"] .text-with-image__copy {
        order: 0;
    }

    .text-with-image__inner[data-layout="left_text_right_image"] .text-with-image__media {
        order: 1;
    }

    .text-with-image__inner[data-layout="left_image_right_text"] .text-with-image__media {
        order: 0;
    }

    .text-with-image__inner[data-layout="left_image_right_text"] .text-with-image__copy {
        order: 1;
    }

    .text-with-image__pic--primary {
        width: 100%;
        margin-inline: 0;
    }

    .text-with-image__pic--secondary {
        width: 78%;
    }
}

/* ----- promo-showcase-hub ----- */
theme-promo-showcase-hub {
    --psk-radius-lg: 24px;
    --psk-radius-pill: 999px;
    --psk-gutter: 20px;
    --psk-font: var(--font-body-family, system-ui, -apple-system, 'Segoe UI', sans-serif);
    --promo-carousel-arrow-dark-bg: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1NSIgaGVpZ2h0PSI1NSIgdmlld0JveD0iMCAwIDU1IDU1Ij48ZGVmcz48bGluZWFyR3JhZGllbnQgeDE9IjAiIHkxPSIwLjUiIHgyPSIxIiB5Mj0iMC41IiBpZD0ibWFzdGVyX3N2ZzBfMTFfMzE5OCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI0I4QjhCOCIgc3RvcC1vcGFjaXR5PSIwLjQzOTk5OTk5NzYxNTgxNDIiLz48c3RvcCBvZmZzZXQ9Ijk5Ljk5OTk4MjExODYwNjU3JSIgc3RvcC1jb2xvcj0iI0JBQkFCQSIgc3RvcC1vcGFjaXR5PSIwIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PGc+PGc+PGVsbGlwc2UgY3g9IjI3LjUiIGN5PSIyNy41IiByeD0iMjcuNSIgcnk9IjI3LjUiIGZpbGw9InVybCgjbWFzdGVyX3N2ZzBfMTFfMzE5OCkiIGZpbGwtb3BhY2l0eT0iMSIvPjwvZz48Zz48ZyB0cmFuc2Zvcm09Im1hdHJpeCgtMSwwLDAsMSw4NCwwKSIgc3R5bGU9Im9wYWNpdHk6MDsiPjxyZWN0IHg9IjQyIiB5PSIxMyIgd2lkdGg9IjMwIiBoZWlnaHQ9IjMwIiByeD0iMCIgZmlsbD0iI0Q4RDhEOCIgZmlsbC1vcGFjaXR5PSIxIi8+PC9nPjxnIHRyYW5zZm9ybT0ibWF0cml4KC0xLDAsMCwxLDY0Ljc4OTA2MjUsMCkiPjxnPjxwYXRoIGQ9Ik0zMi41ODEwMTQyNSwxNy4yMjc3NTI4MDI3MzQzNzZRMzIuNzc2Mjc2MjUsMTcuNDIzMDEyODAyNzM0Mzc3LDQyLjk1MzgzMTI1LDI3LjYwMDcyMjgwMjczNDM3NEM0My4wNzQ3MzEyNSwyNy43MjE1MjI4MDI3MzQzNzcsNDMuMDg1ODMxMjUsMjcuOTA4MDIyODAyNzM0Mzc2LDQyLjk4MjIzMTI1LDI4LjAzODkyMjgwMjczNDM3Nkw0Mi41ODg3MzEyNSwyOC40MzI0MjI4MDI3MzQzNzZMNDIuNTg4NzMxMjUsMjguNDMyNDIyODAyNzM0Mzc2TDMyLjU4MTYyNDI1LDM4LjQzOTUyMjgwMjczNDM3QzMyLjM4NjM2MjM5LDM4LjYzNDgyMjgwMjczNDM4LDMyLjM4NjMwNTQ3LDM4Ljk1MTUyMjgwMjczNDM3NCwzMi41ODE1NjcyNSwzOS4xNDY4MjI4MDI3MzQzOEwzMi45MzU1NDQyNSwzOS41MDA2MjI4MDI3MzQzOEMzMy4xMzA4MDYyNSwzOS42OTU4MjI4MDI3MzQzOCwzMy40NDczOTEyNSwzOS42OTU4MjI4MDI3MzQzOCwzMy42NDI2NTEyNSwzOS41MDA2MjI4MDI3MzQzOEw0NC4wMTQ5MzEyNTAwMDAwMDQsMjkuMTI4MjIyODAyNzM0Mzc0QzQ0Ljc5NDQzMTI1LDI4LjM0ODcyMjgwMjczNDM3NSw0NC44NzAxMzEyNSwyNy4zOTU2MjI4MDI3MzQzNzMsNDQuMDcxMDMxMjUwMDAwMDA0LDI2LjU5NjUyMjgwMjczNDM3N0w0My42NTcwMzEyNSwyNi4xODA0MjI4MDI3MzQzNzdMNDMuNjU3MDMxMjUsMjYuMTgwNDIyODAyNzM0Mzc3TDMzLjY0MjY1MTI1LDE2LjE2NjA2OTgwMjczNDM3M0MzMy40NDczOTEyNSwxNS45NzA4MDczMDI3MzQzNzUsMzMuMTMwODA2MjUsMTUuOTcwODA3MzAyNzM0Mzc1LDMyLjkzNTU0NDI1LDE2LjE2NjA2OTgwMjczNDM3M0wzMi41MTAzMzUyNSwxNi41OTEzOTk4MDI3MzQzNzZDMzIuMzE1MDczMzUsMTYuNzg2NjYxODAyNzM0Mzc1LDMyLjM4NTc1MjA0LDE3LjAzMjQ5MjgwMjczNDM3NCwzMi41ODEwMTQyNSwxNy4yMjc3NTI4MDI3MzQzNzZaIiBmaWxsPSIjMDAwMDAwIiBmaWxsLW9wYWNpdHk9IjAuODk5OTk5OTc2MTU4MTQyMSIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4=');
    --promo-carousel-arrow-dark-hover: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1NSIgaGVpZ2h0PSI1NSIgdmlld0JveD0iMCAwIDU1IDU1Ij48Zz48Zz48ZWxsaXBzZSBjeD0iMjcuNSIgY3k9IjI3LjUiIHJ4PSIyNy41IiByeT0iMjcuNSIgZmlsbD0iI0I4QjhCOCIgZmlsbC1vcGFjaXR5PSIwLjQzOTk5OTk5NzYxNTgxNDIiLz48L2c+PGc+PGcgdHJhbnNmb3JtPSJtYXRyaXgoLTEsMCwwLDEsODQsMCkiIHN0eWxlPSJvcGFjaXR5OjA7Ij48cmVjdCB4PSI0MiIgeT0iMTMiIHdpZHRoPSIzMCIgaGVpZ2h0PSIzMCIgcng9IjAiIGZpbGw9IiNEOEQ4RDgiIGZpbGwtb3BhY2l0eT0iMSIvPjwvZz48ZyB0cmFuc2Zvcm09Im1hdHJpeCgtMSwwLDAsMSw2NC43ODkwNjI1LDApIj48Zz48cGF0aCBkPSJNMzIuNTgxMDE0MjUsMTcuMjI3NzUyODAyNzM0Mzc2UTMyLjc3NjI3NjI1LDE3LjQyMzAxMjgwMjczNDM3Nyw0Mi45NTM4MzEyNSwyNy42MDA3MjI4MDI3MzQzNzRDNDMuMDc0NzMxMjUsMjcuNzIxNTIyODAyNzM0Mzc3LDQzLjA4NTgzMTI1LDI3LjkwODAyMjgwMjczNDM3Niw0Mi45ODIyMzEyNSwyOC4wMzg5MjI4MDI3MzQzNzZMNDIuNTg4NzMxMjUsMjguNDMyNDIyODAyNzM0Mzc2TDQyLjU4ODczMTI1LDI4LjQzMjQyMjgwMjczNDM3NkwzMi41ODE2MjQyNSwzOC40Mzk1MjI4MDI3MzQzN0MzMi4zODYzNjIzOSwzOC42MzQ4MjI4MDI3MzQzOCwzMi4zODYzMDU0NywzOC45NTE1MjI4MDI3MzQzNzQsMzIuNTgxNTY3MjUsMzkuMTQ2ODIyODAyNzM0MzhMMzIuOTM1NTQ0MjUsMzkuNTAwNjIyODAyNzM0MzhDMzMuMTMwODA2MjUsMzkuNjk1ODIyODAyNzM0MzgsMzMuNDQ3MzkxMjUsMzkuNjk1ODIyODAyNzM0MzgsMzMuNjQyNjUxMjUsMzkuNTAwNjIyODAyNzM0MzhMNDQuMDE0OTMxMjUwMDAwMDA0LDI5LjEyODIyMjgwMjczNDM3NEM0NC43OTQ0MzEyNSwyOC4zNDg3MjI4MDI3MzQzNzUsNDQuODcwMTMxMjUsMjcuMzk1NjIyODAyNzM0MzczLDQ0LjA3MTAzMTI1MDAwMDAwNCwyNi41OTY1MjI4MDI3MzQzNzdMNDMuNjU3MDMxMjUsMjYuMTgwNDIyODAyNzM0Mzc3TDQzLjY1NzAzMTI1LDI2LjE4MDQyMjgwMjczNDM3N0wzMy42NDI2NTEyNSwxNi4xNjYwNjk4MDI3MzQzNzNDMzMuNDQ3MzkxMjUsMTUuOTcwODA3MzAyNzM0Mzc1LDMzLjEzMDgwNjI1LDE1Ljk3MDgwNzMwMjczNDM3NSwzMi45MzU1NDQyNSwxNi4xNjYwNjk4MDI3MzQzNzNMMzIuNTEwMzM1MjUsMTYuNTkxMzk5ODAyNzM0Mzc2QzMyLjMxNTA3MzM1LDE2Ljc4NjY2MTgwMjczNDM3NSwzMi4zODU3NTIwNCwxNy4wMzI0OTI4MDI3MzQzNzQsMzIuNTgxMDE0MjUsMTcuMjI3NzUyODAyNzM0Mzc2WiIgZmlsbD0iIzAwMDAwMCIgZmlsbC1vcGFjaXR5PSIwLjg5OTk5OTk3NjE1ODE0MjEiLz48L2c+PC9nPjwvZz48L2c+PC9zdmc+');
    --promo-carousel-arrow-light-bg: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1NSIgaGVpZ2h0PSI1NSIgdmlld0JveD0iMCAwIDU1IDU1Ij48ZGVmcz48ZmlsdGVyIGlkPSJtYXN0ZXJfc3ZnMF8xMV8zMTg3IiBmaWx0ZXJVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiIgeD0iMCIgeT0iMCIgd2lkdGg9IjU1IiBoZWlnaHQ9IjU1Ij48ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPjxmZUJsZW5kIG1vZGU9Im5vcm1hbCIgaW49IlNvdXJjZUdyYXBoaWMiIGluMj0iQmFja2dyb3VuZEltYWdlRml4IiByZXN1bHQ9InNoYXBlIi8+PGZlR2F1c3NpYW5CbHVyIGluPSJCYWNrZ3JvdW5kSW1hZ2UiIHN0ZERldmlhdGlvbj0iMTAiLz48ZmVDb21wb3NpdGUgaW4yPSJTb3VyY2VBbHBoYSIgb3BlcmF0b3I9ImluIiByZXN1bHQ9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXIiLz48ZmVCbGVuZCBtb2RlPSJub3JtYWwiIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXIiIHJlc3VsdD0ic2hhcGUiLz48L2ZpbHRlcj48L2RlZnM+PGc+PGcgZmlsdGVyPSJ1cmwoI21hc3Rlcl9zdmcwXzExXzMxODcpIj48ZWxsaXBzZSBjeD0iMjcuNSIgY3k9IjI3LjUiIHJ4PSIyNy41IiByeT0iMjcuNSIgZmlsbD0iI0I4QjhCOCIgZmlsbC1vcGFjaXR5PSIwLjQzOTk5OTk5NzYxNTgxNDIiLz48L2c+PGc+PGc+PGc+PHBhdGggZD0iTTMzLjMzMzkyNzM4MzQyMjg1LDE3LjY4Njg2NzM1MTY4NDU3TDIzLjMxNjU1NzM4MzQyMjg1LDI3LjcwNDIwNzM1MTY4NDU3QzIzLjE5NTY3NzM4MzQyMjg1LDI3LjgyNTEwNzM1MTY4NDU3MiwyMy4xODcwNDczODM0MjI4NSwyOC4wMTU3MDczNTE2ODQ1NywyMy4yOTA2NTczODM0MjI4NSwyOC4xNDY1MDczNTE2ODQ1N0wyMy4zMjY3NDczODM0MjI4NTIsMjguMTg1ODA3MzUxNjg0NTdMMjMuMzI2NzQ3MzgzNDIyODUyLDI4LjE4NTgwNzM1MTY4NDU3TDMzLjMzMzkyNzM4MzQyMjg1LDM4LjE5MzAwNzM1MTY4NDU3QzMzLjUyOTEyNzM4MzQyMjg1LDM4LjM4ODIwNzM1MTY4NDU3LDMzLjUyOTEyNzM4MzQyMjg1LDM4LjcwNDgwNzM1MTY4NDU3LDMzLjMzMzkyNzM4MzQyMjg1LDM4LjkwMDEwNzM1MTY4NDU3TDMyLjYyNjgyNzM4MzQyMjg1LDM5LjYwNzIwNzM1MTY4NDU3QzMyLjQzMTUyNzM4MzQyMjg1LDM5LjgwMjQwNzM1MTY4NDU3LDMyLjExNDkyNzM4MzQyMjg1LDM5LjgwMjQwNzM1MTY4NDU3LDMxLjkxOTcyNzM4MzQyMjg1MywzOS42MDcyMDczNTE2ODQ1N0wyMS45MDIzNDQzODM0MjI4NSwyOS41ODk4MDczNTE2ODQ1N0MyMS4wMTAxMDUzODM0MjI4NSwyOC42OTc2MDczNTE2ODQ1NywyMC45OTE1MTczODM0MjI4NTMsMjcuMjYyNTA3MzUxNjg0NTcsMjEuODQ2NTgwMzgzNDIyODUsMjYuMzQ3NzA3MzUxNjg0NTdMMjEuOTA1MzI2MzgzNDIyODUzLDI2LjI4NzAwNzM1MTY4NDU3MkwyMS45MDUzMjYzODM0MjI4NTMsMjYuMjg3MDA3MzUxNjg0NTcyTDMxLjkxOTcyNzM4MzQyMjg1MywxNi4yNzI2NTQzNTE2ODQ1N0MzMi4xMTQ5MjczODM0MjI4NSwxNi4wNzczOTE4NTE2ODQ1NywzMi40MzE1MjczODM0MjI4NSwxNi4wNzczOTE4NTE2ODQ1NywzMi42MjY4MjczODM0MjI4NSwxNi4yNzI2NTQzNTE2ODQ1N0wzMy4zMzM5MjczODM0MjI4NSwxNi45Nzk3NjAzNTE2ODQ1NzJDMzMuNTI5MTI3MzgzNDIyODUsMTcuMTc1MDI3MzUxNjg0NTcsMzMuNTI5MTI3MzgzNDIyODUsMTcuNDkxNjA3MzUxNjg0NTcsMzMuMzMzOTI3MzgzNDIyODUsMTcuNjg2ODY3MzUxNjg0NTdaIiBmaWxsPSIjRkZGRkZGIiBmaWxsLW9wYWNpdHk9IjAuODk5OTk5OTc2MTU4MTQyMSIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4');
    --promo-carousel-arrow-light-hover: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1NSIgaGVpZ2h0PSI1NSIgdmlld0JveD0iMCAwIDU1IDU1Ij48ZGVmcz48ZmlsdGVyIGlkPSJtYXN0ZXJfc3ZnMF8xMV8zMTg3IiBmaWx0ZXJVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiIgeD0iMCIgeT0iMCIgd2lkdGg9IjU1IiBoZWlnaHQ9IjU1Ij48ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPjxmZUJsZW5kIG1vZGU9Im5vcm1hbCIgaW49IlNvdXJjZUdyYXBoaWMiIGluMj0iQmFja2dyb3VuZEltYWdlRml4IiByZXN1bHQ9InNoYXBlIi8+PGZlR2F1c3NpYW5CbHVyIGluPSJCYWNrZ3JvdW5kSW1hZ2UiIHN0ZERldmlhdGlvbj0iMTAiLz48ZmVDb21wb3NpdGUgaW4yPSJTb3VyY2VBbHBoYSIgb3BlcmF0b3I9ImluIiByZXN1bHQ9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXIiLz48ZmVCbGVuZCBtb2RlPSJub3JtYWwiIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXIiIHJlc3VsdD0ic2hhcGUiLz48L2ZpbHRlcj48L2RlZnM+PGc+PGcgZmlsdGVyPSJ1cmwoI21hc3Rlcl9zdmcwXzExXzMxODcpIj48ZWxsaXBzZSBjeD0iMjcuNSIgY3k9IjI3LjUiIHJ4PSIyNy41IiByeT0iMjcuNSIgZmlsbD0iI0I4QjhCOCIgZmlsbC1vcGFjaXR5PSIwLjQzOTk5OTk5NzYxNTgxNDIiLz48L2c+PGc+PGc+PGc+PHBhdGggZD0iTTMzLjMzMzkyNzM4MzQyMjg1LDE3LjY4Njg2NzM1MTY4NDU3TDIzLjMxNjU1NzM4MzQyMjg1LDI3LjcwNDIwNzM1MTY4NDU3QzIzLjE5NTY3NzM4MzQyMjg1LDI3LjgyNTEwNzM1MTY4NDU3MiwyMy4xODcwNDczODM0MjI4NSwyOC4wMTU3MDczNTE2ODQ1NywyMy4yOTA2NTczODM0MjI4NSwyOC4xNDY1MDczNTE2ODQ1N0wyMy4zMjY3NDczODM0MjI4NTIsMjguMTg1ODA3MzUxNjg0NTdMMjMuMzI2NzQ3MzgzNDIyODUyLDI4LjE4NTgwNzM1MTY4NDU3TDMzLjMzMzkyNzM4MzQyMjg1LDM4LjE5MzAwNzM1MTY4NDU3QzMzLjUyOTEyNzM4MzQyMjg1LDM4LjM4ODIwNzM1MTY4NDU3LDMzLjUyOTEyNzM4MzQyMjg1LDM4LjcwNDgwNzM1MTY4NDU3LDMzLjMzMzkyNzM4MzQyMjg1LDM4LjkwMDEwNzM1MTY4NDU3TDMyLjYyNjgyNzM4MzQyMjg1LDM5LjYwNzIwNzM1MTY4NDU3QzMyLjQzMTUyNzM4MzQyMjg1LDM5LjgwMjQwNzM1MTY4NDU3LDMyLjExNDkyNzM4MzQyMjg1LDM5LjgwMjQwNzM1MTY4NDU3LDMxLjkxOTcyNzM4MzQyMjg1MywzOS42MDcyMDczNTE2ODQ1N0wyMS45MDIzNDQzODM0MjI4NSwyOS41ODk4MDczNTE2ODQ1N0MyMS4wMTAxMDUzODM0MjI4NSwyOC42OTc2MDczNTE2ODQ1NywyMC45OTE1MTczODM0MjI4NTMsMjcuMjYyNTA3MzUxNjg0NTcsMjEuODQ2NTgwMzgzNDIyODUsMjYuMzQ3NzA3MzUxNjg0NTdMMjEuOTA1MzI2MzgzNDIyODUzLDI2LjI4NzAwNzM1MTY4NDU3MkwyMS45MDUzMjYzODM0MjI4NTMsMjYuMjg3MDA3MzUxNjg0NTcyTDMxLjkxOTcyNzM4MzQyMjg1MywxNi4yNzI2NTQzNTE2ODQ1N0MzMi4xMTQ5MjczODM0MjI4NSwxNi4wNzczOTE4NTE2ODQ1NywzMi40MzE1MjczODM0MjI4NSwxNi4wNzczOTE4NTE2ODQ1NywzMi42MjY4MjczODM0MjI4NSwxNi4yNzI2NTQzNTE2ODQ1N0wzMy4zMzM5MjczODM0MjI4NSwxNi45Nzk3NjAzNTE2ODQ1NzJDMzMuNTI5MTI3MzgzNDIyODUsMTcuMTc1MDI3MzUxNjg0NTcsMzMuNTI5MTI3MzgzNDIyODUsMTcuNDkxNjA3MzUxNjg0NTcsMzMuMzMzOTI3MzgzNDIyODUsMTcuNjg2ODY3MzUxNjg0NTdaIiBmaWxsPSIjRkZGRkZGIiBmaWxsLW9wYWNpdHk9IjAuODk5OTk5OTc2MTU4MTQyMSIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4');
    --promo-carousel-arrow-bg: var(--promo-carousel-arrow-dark-bg);
    --promo-carousel-arrow-bg-hover: var(--promo-carousel-arrow-dark-hover);
    display: block;
    width: 100%;
    color: #353535;
}

theme-promo-showcase-hub[data-arrow-style="light"] {
    --promo-carousel-arrow-bg: var(--promo-carousel-arrow-light-bg);
    --promo-carousel-arrow-bg-hover: var(--promo-carousel-arrow-light-hover);
}

theme-promo-showcase-hub[data-arrow-style="light"] .promo-carousel-banner__pagination-track {
    background-color: rgba(255, 255, 255, 0.2);
}

theme-promo-showcase-hub[data-arrow-style="light"] .promo-carousel-banner__pagination-fill {
    background-color: rgba(255, 255, 255, 1);
}

.promo-showcase-hub .psk__viewport {
    width: 100%;
}

.promo-showcase-hub .psk__shell {
    box-sizing: border-box;
    width: 100%;
    max-width: 1400px;
    margin-inline: auto;
}

@media screen and (min-width: 768px) and (max-width: 1439.98px) {
    .promo-showcase-hub .psk__shell {
        padding-inline: 20px;
    }
}

.promo-showcase-hub .psk__title {
    margin: 0 0 20px;
    font-size: 30px;
    font-weight: 500;
    line-height: 1.25;
    text-align: center;
}

.promo-showcase-hub .psk__tabs-scroll {
    margin-bottom: 20px;
}

.promo-showcase-hub .psk__item-panels {
    width: 100%;
}

.promo-showcase-hub .psk__tabs {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    min-width: min(100%, 720px);
    margin-inline: auto;
}

.promo-showcase-hub .psk__tab {
    flex: 0 0 auto;
    appearance: none;
    background: transparent;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.25;
    padding: 10px 10px;
    border-radius: 50px;
    color: #000;
    margin: 0 8px;
    cursor: pointer;
    text-align: center;
    border: 0;
    white-space: nowrap;
}

.promo-showcase-hub .psk__tab--active {
    background-color: #f5f5f5;
    box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.15);
}

.promo-showcase-hub .psk__split {
    display: flex;
    flex-direction: column;
    gap: var(--psk-gutter);
    width: 100%;
}

.promo-showcase-hub .psk__split--product-hub .psk__col--left .psk__hub-gallery {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    align-self: stretch;
}

.promo-showcase-hub .psk__split--product-hub:not(:first-child) {
    margin-top: var(--psk-gutter);
}

.promo-showcase-hub .psk__product-hub-price {
    margin: 10px 0 0;
}

.promo-showcase-hub .psk__product-hub-price .product-price__sale {
    display: block;
    line-height: 1.3;
    font-size: 14px;
    font-weight: 600;
}

.promo-showcase-hub .psk__product-hub-price .product-price__origin {
    display: inline-block;
    line-height: 1.3;
    font-size: 10px;
    font-weight: 400;
    opacity: 0.6;
    margin-left: 5px;
}

.promo-showcase-hub .psk__product-hub-price.hideprice {
    opacity: 0;
    user-select: none;
    pointer-events: none;
}

.promo-showcase-hub .psk__product-hub-price.hide-origin-price .product-price__origin {
    display: none !important;
}

.promo-showcase-hub .psk__product-hub-placeholder {
    box-sizing: border-box;
    width: 100%;
    padding: 24px 20px;
    margin: 0 auto;
    max-width: 480px;
    text-align: center;
    border: 1px dashed rgba(0, 0, 0, 0.2);
    border-radius: var(--psk-radius-lg, 12px);
    color: #555;
}

@media screen and (max-width: 767.98px) {
    .promo-showcase-hub .psk__tabs-scroll {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        padding: 5px 0px;
    }

    .promo-showcase-hub .psk__tabs {
        justify-content: flex-start;
    }

    .promo-showcase-hub .psk__tab {
        font-size: 14px;
    }
}

@media screen and (min-width: 768px) {
    .promo-showcase-hub .psk__split {
        flex-direction: row;
        align-items: stretch;
    }

    .promo-showcase-hub .psk__split--product-hub {
        width: 100%;
    }

    .promo-showcase-hub .psk__col {
        flex: 1 1 0;
        min-width: 0;
    }

    .promo-showcase-hub .psk__col--left {
        display: flex;
        flex-direction: column;
        align-self: stretch;
        min-height: 0;
    }
}

/* ---- Left: carousel ---- */
.promo-showcase-hub .psk__left-panel--carousel {
    display: flex;
    flex-direction: column;
    border-radius: var(--psk-radius-lg);
    background: linear-gradient(180deg, #fffdf8 0%, #f6f0e6 100%);
    overflow: hidden;
    flex: 1 1 auto;
    align-self: stretch;
    min-height: 690px;
}

@media screen and (min-width: 768px) and (max-width: 1439px) {
    .promo-showcase-hub .psk__left-panel--carousel {
        min-height: 47.9166vw;
    }
}

@media screen and (max-width: 888.98px) {
    .promo-showcase-hub .psk__left-panel--carousel {
        width: 100%;
        min-height: min(92vw, 560px);
        flex: 0 0 auto;
    }
}

.promo-showcase-hub .psk__carousel.promo-carousel-banner__carousel {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
}

.promo-showcase-hub .psk__hub-carousel-inner {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
}

@media screen and (max-width: 888.98px) {
    .promo-showcase-hub .psk__hub-carousel-inner {
        width: 100%;
        flex: 1 1 auto;
        min-height: min(88vw, 520px);
    }
}

.promo-showcase-hub .promo-carousel-banner__track {
    display: flex;
    flex: 1 1 auto;
    align-items: stretch;
    align-self: stretch;
    width: 100%;
    min-height: 0;
    height: 100%;
}

/* Match promo-carousel-banner arrows; inset for card layout */
.promo-showcase-hub .promo-carousel-banner__arrow--prev {
    left: 8px;
}

.promo-showcase-hub .promo-carousel-banner__arrow--next {
    right: 8px;
}

@media screen and (min-width: 900px) {
    .promo-showcase-hub .promo-carousel-banner__arrow--prev {
        left: 12px;
    }

    .promo-showcase-hub .promo-carousel-banner__arrow--next {
        right: 12px;
    }
}

.promo-showcase-hub .psk__hub-carousel-controls.promo-carousel-banner__controls {
    bottom: 20px;
    max-width: min(560px, calc(100% - 48px));
}

@media screen and (max-width: 839.98px) {
    .promo-showcase-hub .psk__hub-carousel-controls.promo-carousel-banner__controls {
        bottom: 12px;
        max-width: min(100% - 32px, 420px);
    }
}

/**
   * Hub carousel: segment progress matches autoplay (theme-carousel data-autoplay-speed in seconds).
   * Duration is mirrored via --psk-hub-autoplay-duration on .psk__hub-carousel-inner.
   */
@keyframes psk-hub-carousel-pager-progress {
    from {
        width: 0;
    }

    to {
        width: 100%;
    }
}

.promo-showcase-hub .psk__hub-carousel-inner .promo-carousel-banner__pagination-track {
    width: 80px;
    height: 2px;
    margin: 0 6px;
    border-radius: 1px;
    background-color: rgba(0, 0, 0, 0.18);
}

.promo-showcase-hub .psk__hub-carousel-inner .promo-carousel-banner__pagination-fill {
    width: 0;
    height: 2px;
    border-radius: 1px;
    transition: none;
    background-color: rgba(0, 0, 0, 1);
}

.promo-showcase-hub .psk__hub-carousel-inner .promo-carousel-banner__pagination-item.is-active .promo-carousel-banner__pagination-fill {
    animation: psk-hub-carousel-pager-progress linear var(--psk-hub-autoplay-duration, 6s) forwards;
}

.promo-showcase-hub .psk__hub-carousel-inner .promo-carousel-banner__pagination-item:not(.is-active) .promo-carousel-banner__pagination-fill {
    animation: none;
    width: 0;
}

@media screen and (max-width: 839.98px) {
    .promo-showcase-hub .psk__hub-carousel-inner .promo-carousel-banner__pagination-track {
        width: min(52px, 11vw);
        margin: 0 4px;
    }

    .promo-showcase-hub .psk__hub-carousel-inner .promo-carousel-banner__pagination-item.is-active .promo-carousel-banner__pagination-fill {
        inset-inline-start: 0;
    }
}

theme-carousel.psk__carousel[data-single-slide='true'] .promo-carousel-banner__arrow,
theme-carousel.psk__carousel[data-single-slide='true'] .psk__hub-carousel-controls {
    display: none;
}

.promo-showcase-hub .psk__left-slide {
    box-sizing: border-box;
    flex: 0 0 100%;
    align-self: stretch;
    width: 100%;
    min-height: 100%;
    height: 100%;
    padding: 0;
    display: flex;
    align-items: stretch;
}

.promo-showcase-hub .psk__left-slide-inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    flex: 1 1 auto;
    min-height: 0;
}

.promo-showcase-hub .psk__left-slide-visual {
    width: 100%;
    height: 100%;
    flex: 1 1 auto;
    display: flex;
    align-items: stretch;
    min-height: 0;
}

.promo-showcase-hub .psk__left-slide-img {
    flex: 1 1 auto;
    width: 100%;
    min-height: 100%;
    overflow: hidden;
    display: flex;
    align-items: stretch;
}

.promo-showcase-hub .psk__left-slide-img :is(img, picture),
.promo-showcase-hub .psk__left-slide-img img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    object-position: center;
}

.promo-showcase-hub .psk__left-slide-img picture {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
}

.promo-showcase-hub .psk__btn-primary {
    font-size: 12px;
    line-height: 1.3;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 50px;
    background-color: #000;
    color: #fff;
    margin-right: 20px;
}

.promo-showcase-hub .psk__btn-primary:focus-visible {
    outline: revert;
    outline-offset: 2px;
}

.promo-showcase-hub .psk__card.psk__card--gallery {
    width: 100%;
    min-height: 690px;
    height: 100%;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__card-media {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 75%;
    position: relative;
    z-index: 1;
    margin: 10px auto;
    height: 440px;
    max-width: unset;
    max-height: unset;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__card-media img {
    max-width: 373px;
    max-height: 440px;
    width: auto;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__card-title {
    font-size: 32px;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__product-hub-price {
    margin-top: 24px;
}

.promo-showcase-hub .psk__card.psk__card--gallery .product-price__sale {
    font-size: 18px;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__card-buy-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 30px;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__card-buy {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 1.3;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 50px;
    background-color: #000;
    color: #fff;
    margin: 0 20px 0 0;
    width: max-content;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__card-buy:focus-visible {
    outline: revert;
    outline-offset: 2px;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__card-buy::after {
    display: none;
}

.promo-showcase-hub .psk__text-link {
    color: #111;
    text-decoration: underline;
    font-size: 0.9rem;
}

/* ---- Left: backdrop ---- */
.promo-showcase-hub .psk__left-panel--backdrop {
    position: relative;
    border-radius: var(--psk-radius-lg);
    overflow: hidden;
    min-height: 690px;
    background: #f3efe7;
    height: 100%;
}

.promo-showcase-hub .psk__backdrop-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.promo-showcase-hub .psk__backdrop-bg :is(img, picture) {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.promo-showcase-hub .psk__backdrop-overlay {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    min-height: 690px;
    height: 100%;
}

.promo-showcase-hub .psk__backdrop-overlay::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, var(--psk-back-overlay, 0.35));
    z-index: -1;
}

.promo-showcase-hub .psk__backdrop-badge :is(img, picture) {
    max-width: 120px;
    height: auto;
}

.promo-showcase-hub .psk__backdrop-title {
    margin: 0;
    font-size: clamp(1.25rem, 2.2vw, 1.6rem);
    font-weight: 700;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.promo-showcase-hub .psk__backdrop-subtitle,
.promo-showcase-hub .psk__backdrop-price,
.promo-showcase-hub .psk__backdrop-strip,
.promo-showcase-hub .psk__backdrop-bundle,
.promo-showcase-hub .psk__backdrop-energy-cap {
    margin: 0;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.promo-showcase-hub .psk__backdrop-energy :is(img, picture) {
    height: 100%;
    width: 100%;
    display: block;
    margin-inline: auto;
}

.promo-showcase-hub .psk__backdrop-energy-row {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: absolute;
    right: 30px;
    bottom: 260px;
    text-align: center;
}

.promo-showcase-hub .psk__backdrop-energy-icon-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    text-decoration: none;
}

.promo-showcase-hub .psk__backdrop-energy-icon-link:focus-visible {
    outline: 2px solid #000;
    outline-offset: unset;
}

.promo-showcase-hub .psk__backdrop-energy--within-link {
    height: 30px;
}

.promo-showcase-hub .psk__backdrop-energy--within-link :is(img, picture) {
    height: 100%;
    width: auto;
    max-width: none;
}

.promo-showcase-hub .psk__backdrop-energy {
    height: 30px;
}

.promo-showcase-hub .psk__backdrop-product-info {
    color: #707070;
    font-size: 12px;
    text-decoration: none;
}

.promo-showcase-hub .psk__backdrop-product-info:focus-visible {
    outline: 2px solid #000;
    outline-offset: unset;
}

.promo-showcase-hub .psk__backdrop-product-info:hover {
    cursor: pointer;
}

.promo-showcase-hub .psk__backdrop-product-info-wrapper {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.promo-showcase-hub .psk__backdrop-product-price {
    font-size: 18px;
    font-weight: 600;
    display: inline-block;
    line-height: 1.3;
}

.promo-showcase-hub .psk__backdrop-overlay .psk__backdrop-product-price .product-price__origin {
    display: none;
}

.promo-showcase-hub .psk__backdrop-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-top: 6.5px;
}

.promo-showcase-hub .psk__btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 22px;
    border-radius: var(--psk-radius-pill);
    border: 1px solid #fff;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
}

/* ---- Right grid ---- */
.promo-showcase-hub .psk__col--right {
    min-height: 690px;
    display: flex;
    justify-content: space-between;
    align-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
}

.promo-showcase-hub .psk__col--right-srcoll {
    display: flex;
    gap: var(--psk-gutter);
    justify-content: space-between;
    align-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
}

@media screen and (min-width: 480px) {
    .promo-showcase-hub .psk__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.promo-showcase-hub .psk__card {
    position: relative;
    border-radius: var(--psk-radius-lg);
    width: calc(50% - var(--psk-gutter) / 2);
    overflow: hidden;
}

.promo-showcase-hub .psk__card[data-psk-card-bg="solid"] {
    background: var(--psk-card-bg-solid, #fff8ed);
}

.promo-showcase-hub .psk__card:not([data-psk-card-bg="solid"]) {
    background: linear-gradient(var(--psk-card-gradient-angle, 180deg),
            var(--psk-card-g1, #fff8ed) 0%,
            var(--psk-card-g2, #f4e8d4) 100%);
}

.promo-showcase-hub .psk__card-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.promo-showcase-hub .psk__card-corner-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    padding: 7px 16px;
    border-radius: 50px;
    background-color: #1455ff;
    color: #fff;
    z-index: 10;
}

.promo-showcase-hub .psk__card-tag {
    align-self: flex-start;
    padding: 4px 12px;
    border-radius: var(--psk-radius-pill);
    background: var(--psk-tag-bg, #0057ff);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
}

.promo-showcase-hub .psk__card-media {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    margin: 16px auto 13px;
    max-width: 169px;
    max-height: 169px;
}

.promo-showcase-hub .psk__card-media :is(img, picture) {
    max-width: 100%;
    height: 100%;
    object-fit: cover;
}

.promo-showcase-hub .psk__card-swatches {
    position: absolute;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0%;
    top: 0px;
    z-index: 5;
}

.promo-showcase-hub .psk__card-swatches:empty {
    display: none;
}

.promo-showcase-hub .psk__swatch {
    width: 26px;
    height: 26px;
    border-radius: 50px;
    padding: 2px;
    border: 1.5px solid transparent;
    margin: 0 3px;
    cursor: pointer;
}

.promo-showcase-hub .psk__swatch.is-selected {
    border-color: grey;
}

.promo-showcase-hub .psk__swatch-inner :is(img, picture) {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.promo-showcase-hub .psk__swatch.psk__swatch--color .psk__swatch-inner {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: var(--swatch-background-color, #ccc);
    border: 1px solid grey;
}

.promo-showcase-hub .psk__swatch.psk__swatch--media .psk__swatch-inner {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid grey;
}

.promo-showcase-hub .psk__card-body {
    text-align: center;
    position: relative;
    padding: 30px 20px 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
}

.promo-showcase-hub .psk__card.psk__card--gallery .psk__card-body {
    justify-content: flex-start;
}

.promo-showcase-hub .psk__card-title,
.promo-showcase-hub .psk__card-title-code {
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.promo-showcase-hub .psk__card-title-code {
    margin-top: 10px;
}

.promo-showcase-hub .psk__card-title-code-text {
    margin-right: 8px;
}

.promo-showcase-hub .psk__card-title-code-value {
    color: red;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font: inherit;
    line-height: inherit;
    text-align: inherit;
}

.promo-showcase-hub .psk__card-title-code-value:hover {
    opacity: 0.85;
}

.promo-showcase-hub .psk__card-title-code-value:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.psk__copy-toast {
    position: fixed;
    top: max(24px, env(safe-area-inset-top, 0px));
    left: 50%;
    z-index: 99999;
    max-width: calc(100vw - 32px);
    padding: 10px 20px;
    border-radius: 9999px;
    background: rgba(100, 100, 100, 0.92);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    pointer-events: none;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateX(-50%) translateY(-6px);
    transition:
        opacity 0.25s ease,
        transform 0.25s ease,
        visibility 0.25s;
}

.psk__copy-toast.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

.promo-showcase-hub .psk__card-desc,
.promo-showcase-hub .psk__card-code-row,
.promo-showcase-hub .psk__card-price,
.promo-showcase-hub .psk__card-price-note {
    display: inline-block;
    line-height: 1.3;
    font-size: 14px;
    font-weight: 600;
}

.promo-showcase-hub .psk__code {
    color: #e02020;
    font-weight: 700;
}

.promo-showcase-hub .psk__card-energy {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
    height: 30px;
}

.promo-showcase-hub .psk__energy-icon :is(img, picture) {
    width: 35px;
    height: auto;
}

.promo-showcase-hub .psk__energy-icon-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.promo-showcase-hub .psk__energy-icon-link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.promo-showcase-hub .psk__energy-icon--within-link :is(img, picture) {
    width: 35px;
    height: auto;
    display: block;
}

.promo-showcase-hub .psk__energy-link {
    color: #707070;
    font-size: 12px;
}

.promo-showcase-hub .psk__card-buy {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
    background: none;
    border-radius: 0px;
    color: #000;
    display: flex;
    align-items: center;
    font-size: 12px;
    line-height: 1.3;
    font-weight: 500;
}

.promo-showcase-hub .psk__card-buy:hover::after {
    transform: translateX(3px);
}

.promo-showcase-hub .psk__card-buy::after {
    content: "";
    width: 20px;
    height: 20px;
    content: "";
    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiPiA8cGF0aCBkPSJNMzg1LjE3NDMxMiA3ODguNDE0OTYxYy02LjUwMzg4MSAwLTEzLjAwNzc2My0yLjE2Nzk2LTE4LjA2NjMzNy03LjIyNjUzNS0xMC4xMTcxNDktMTAuMTE3MTQ5LTEwLjExNzE0OS0yNi4wMTU1MjYgMC0zNS40MTAwMjFsMjMxLjI0OTExNy0yMzEuMjQ5MTE4YzEuNDQ1MzA3LTEuNDQ1MzA3IDEuNDQ1MzA3LTQuMzM1OTIxIDAtNS43ODEyMjhsLTIzMS4yNDkxMTctMjMyLjY5NDQyNWMtMTAuMTE3MTQ5LTEwLjExNzE0OS0xMC4xMTcxNDktMjYuMDE1NTI2IDAtMzYuMTMyNjc0czI2LjAxNTUyNi0xMC4xMTcxNDkgMzYuMTMyNjc0IDBsMjMxLjk3MTc3MiAyMzEuOTcxNzcxYzIxLjY3OTYwNSAyMS42Nzk2MDUgMjEuNjc5NjA1IDU2LjM2Njk3MiAwIDc3LjMyMzkyNGwtMjMxLjI0OTExOCAyMzEuMjQ5MTE4Yy01Ljc4MTIyOCA1Ljc4MTIyOC0xMi4yODUxMDkgNy45NDkxODgtMTguNzg4OTkxIDcuOTQ5MTg4eiIgZmlsbD0iIzAwMDAwMCIvPiA8L3N2Zz4=') no-repeat;
    position: relative;
    display: inline-block;
    transition: 0.6s ease;
}

.promo-showcase-hub .psk__card-footer-link {
    margin-top: auto;
    text-align: center;
    font-size: 0.85rem;
    color: #111;
    text-decoration: none;
    font-weight: 600;
}

@media screen and (max-width: 767.98px) {
    theme-promo-showcase-hub {
        --psk-gutter: 10px;
    }

    .promo-showcase-hub .psk__shell {
        width: calc(100vw - 40px);
        margin: 0 auto;
    }

    .promo-showcase-hub .psk__split {
        flex-wrap: wrap;
    }

    .promo-showcase-hub .psk__col--left {
        width: 100%;
    }

    .promo-showcase-hub .psk__card.psk__card--gallery .psk__card-media {
        height: 215px;
    }

    .promo-showcase-hub .psk__card.psk__card--gallery .psk__card-media img {
        max-width: 182px;
        max-height: 216px;
    }

    .promo-showcase-hub .psk__card.psk__card--gallery {
        min-height: 0;
    }

    .promo-showcase-hub .psk__card.psk__card--gallery .psk__product-hub-price {
        margin-top: 20px;
    }

    .promo-showcase-hub .psk__card.psk__card--gallery .product-price__sale {
        font-size: 14px;
    }

    .promo-showcase-hub .psk__card-swatches {
        top: -7px;
    }

    .promo-showcase-hub .psk__card-body {
        padding-bottom: 20px;
        padding-top: 20px;
    }

    .promo-showcase-hub .psk__col--right {
        overflow-x: scroll;
        padding-bottom: 15px;
        min-height: 0;
    }

    .promo-showcase-hub .psk__col--right-srcoll {
        flex-wrap: nowrap;
        width: auto;
    }

    .promo-showcase-hub .psk__card {
        width: 250px;
    }

    .promo-showcase-hub .psk__card-media {
        max-width: 120px;
        max-height: 120px;
    }

    .promo-showcase-hub .psk__card-body {
        padding-bottom: 20px;
        padding-top: 20px;
    }

    .promo-showcase-hub .psk__card-title,
    .promo-showcase-hub .psk__card-title-code {
        font-size: 14px;
    }

    .promo-showcase-hub .psk__backdrop-product-price {
        font-size: 14px;
    }

    .promo-showcase-hub .psk__backdrop-actions {
        margin-top: 20px;
    }

    .promo-showcase-hub .psk__left-panel--backdrop {
        min-height: 47.9166vw;
    }

    .promo-showcase-hub .psk__backdrop-overlay {
        min-height: 47.9166vw;
    }

    .promo-showcase-hub .psk__backdrop-energy-row {
        bottom: 28%;
    }
}

/* ====== Subscribe Form ====== */
.subscribe-form-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    height: 510px;
    background: #F9F9F9;
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    position: relative;
    border-radius: 24px;
}

.subscribe-content-left {
    position: absolute;
    width: 70%;
    height: 100%;
    left: 0%;
    top: 0%;
    padding: 20px 20px 20px 40px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.subscribe-form .title {
    max-width: 786px;
    font-size: 22px;
    margin-top: 0px;
    padding-top: 0px;
    font-weight: 600;
    line-height: 1.3;
}

.subscribe-form .desc {
    font-size: 12px;
    margin-bottom: 10px;
    margin-top: 0px;
    color: #000000;
    line-height: 26px;
    font-weight: 500;
}

.subscribe-form label {
    max-width: 90%;
    font-weight: 500;
    width: 100%;
}


.subscribe-form .term label {
    display: flex;
    align-items: flex-start;
}

.subscribe-form .term-code {
    display: none;
    width: 15px;
    height: 15px;
    opacity: 0.4;
    border: 1px solid #000000;
    border-radius: 2px;
    margin-top: 2px;
}

.subscribe-form .term-desc {
    position: relative;
}

.subscribe-form .term-desc::before {
    content: '';
    width: 15px;
    height: 15px;
    margin-top: 2px;
    float: left;
    display: block;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTVweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTUgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8dGl0bGU+55+p5b2i5aSH5Lu9IDEwPC90aXRsZT4KICAgIDxnIGlkPSLkuLvku7YiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIG9wYWNpdHk9IjAuNCI+CiAgICAgICAgPGcgaWQ9IuS4u+S7tuinhOiMg++8iDE0NDAvODQwLzM2MO+8iSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEyOS4wMDAwMDAsIC0xMjQwLjAwMDAwMCkiIHN0cm9rZT0iIzAwMDAwMCI+CiAgICAgICAgICAgIDxnIGlkPSLnn6nlvaLlpIfku70tMTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyOS4wMDAwMDAsIDEyNDAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8cmVjdCBpZD0i55+p5b2i5aSH5Lu9LTEwIiB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0IiByeD0iMiI+PC9yZWN0PgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
}

.subscribe-form .term-desc p {
    font-size: 12px;
    margin: 0 0 0 25px;
    line-height: 20px;
    font-weight: 500;
}

.subscribe-form .term-desc a {
    color: #1455ff;
    font-weight: 700;
}

.subscribe-form .term-desc a:focus-visible {
    outline: revert;
    outline-offset: 2px;
}

.subscribe-terms .term {
    margin-bottom: 10px;
}

.subscribe-form__form {
    margin-top: 20px;
    border-radius: 16px;
    max-width: 800px;
}

.subscribe-tabTitle {
    padding: 15px 20px;
    border-radius: 10px;
    background: #fff;
}

.subscribe-tabContent {
    display: flex;
    width: 100%;
    background-color: #FFFFFF;
    padding: 20px;
    border-bottom-right-radius: 16px;
    border-bottom-left-radius: 16px;
}

.subscribe-form .email {
    flex: auto;
}

.subscribe-form .email input {
    font-size: 14px;
    width: -webkit-fill-available;
    color: #000000;
    line-height: 20px;
    font-weight: 500;
    background-color: #F9F9F9;
    border-radius: 20px;
    border: 1px solid #7f7f7f;
    padding: 9px 20px;
    margin-right: 10px;
    box-sizing: border-box;
}

.subscribe-form .submit {
    max-width: 195px;
}

.subscribe-form .submit-btn {
    width: auto;
    max-width: 195px;
    height: 40px;
    border-radius: 20px;
    background-color: #000;
    border: none;
    font-size: 14px;
    line-height: 20px;
    color: rgba(255, 255, 255, 1);
    font-weight: 500;
    cursor: pointer;
    padding: 0 32px;
}

.subscribe-form .submit-btn:focus-visible {
    outline: revert;
    outline-offset: 2px;
}

.subscribe-form .email-icon {
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    background-size: cover;
}

.subscribe-form .error-email {
    font-size: 11px;
    color: #EB1406;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    margin: 0 0 -20px;
}

.subscribe-form .error-email::before {
    content: '';
    width: 11px;
    height: 11px;
    margin-right: 5px;
    background: url(/etc.clientlibs/honor-site-activity/clientlibs/clientlib-resources/resources/subscribe/exclamation.webp) no-repeat;
    background-size: cover;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: 4px;
}

.subscribe-tabTitle span {
    margin-left: 6px;
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.6);
}

@media screen and (max-width: 1439px) {
    .subscribe-form .title {
        max-width: 500px;
    }
}

@media screen and (min-width: 768px) and (max-width: 1439px) {
    .subscribe-form-wrapper {
        width: calc(100% - 40px);
    }
}

@media only screen and (max-width: 839.98px) {
    .subscribe-tabContent {
        display: block;
    }

    .subscribe-form .submit {
        width: 100%;
        margin-top: 12px;
        max-width: unset;
    }

    .subscribe-form .submit-btn {
        max-width: unset;
        width: 100%;
        padding: 0px 20px;
    }

    .subscribe-tabTitle span {
        font-size: 14px;
    }

    .subscribe-form .email input {
        width: 100%;
        margin-right: 0;
        padding: 10px 20px;
        height: 40px;
    }
}

@media screen and (max-width: 767.98px) {
    .subscribe-form-wrapper {
        width: calc(100% - 20px);
        margin: 0 auto;
        box-sizing: border-box;
        border-radius: 12px;
        background: url(/content/dam/honor/uk/shop/offers/2026/0430/sub-wap.png);
        background-repeat: repeat;
        background-size: 100%;
        background-position: top;
        height: auto;
        padding-top: 13vw;
    }

    .subscribe-content-left {
        width: 100%;
        bottom: 0;
        height: auto;
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
        position: relative;
        margin-top: 0px;
        padding: 10px;
    }

    .subscribe-form .title {
        padding-top: 0px;
        width: 60%;
        margin: 0px;
        text-align: left;
        margin-bottom: 5vw;
        font-size: 6vw;
    }

    .subscribe-form__form {
        border-radius: 12px;
        margin-top: 10px;
    }

    .subscribe-tabContent {
        padding: 10px;
    }
}

/* ====== Subscribe Form End ====== */

/* ====== Contact Icons  ====== */
.contact-icons-wrap {
    margin: 0 auto;
    max-width: 1400px;
    margin-bottom: 60px;
    color: #353535;
}

.contact-icons-wrap .contact-icons-tnc {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    opacity: 0.8;
    margin-bottom: 12px;
}

.contact-icons-wrap .contact-icons-tnc a {
    color: #256fff;
}

.contact-icons-cont {
    display: flex;
    padding: 20px 30px;
    border-radius: 24px;
    background: #f9f9f9;
    justify-content: space-between;
}

.contact-icons-wrap .item {
    width: 49%;
}

.contact-icons-wrap .list-title {
    font-size: 22px;
    font-weight: 500;
    line-height: 1.5;
    margin: 0 0 10px;
}

.contact-icons-wrap .list-ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    padding: 0;
}

.contact-icons-wrap li {
    width: 50%;
    padding: 10px;
    height: 80px;
}

.contact-icons-wrap li a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

.contact-icons-wrap .icon {
    width: 60px;
    height: 60px;
    margin-right: 10px;
}

.contact-icons-wrap .icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contact-icons-wrap .title {
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #353535;
    word-break: break-all;
}

.contact-icons-wrap .desc {
    font-size: 14px;
    font-weight: 300;
    line-height: 1.3;
    color: #353535;
    word-break: break-word;
    margin: 4px 0 0;
}

.contact-icons-wrap .text {
    flex: 1;
}

.contact-icons-wrap li a:hover .desc {
    color: #256fff;
}

@media screen and (min-width: 840px) and (max-width: 1439.99px) {
    .contact-icons-wrap .list-title {
        font-size: 18px;
    }

    .contact-icons-wrap li {
        padding: 5px;
    }

    .contact-icons-wrap .title {
        font-size: 14px;
    }

    .contact-icons-wrap .desc {
        font-size: 12px;
    }
}

@media screen and (max-width: 839.99px) {
    .contact-icons-wrap .list-title {
        font-size: 16px;
        padding-left: 10px;
        margin-bottom: 5px;
    }

    .contact-icons-wrap .icon {
        width: 40px;
        height: 40px;
        margin-right: 10px;
    }

    .contact-icons-cont {
        flex-wrap: wrap;
        padding: 10px;
        border-radius: 12px;
    }

    .contact-icons-wrap .title {
        font-size: 12px;
    }

    .contact-icons-wrap .desc {
        font-size: 10px;
    }

    .contact-icons-wrap .item {
        width: 100%;
        margin-top: 10px;
    }

    .contact-icons-wrap li {
        padding: 5px;
        height: auto;
    }
}

@media screen and (max-width: 767.99px) {
    .contact-icons-wrap {
        padding: 0 10px;
        margin-bottom: 30px;
        max-width: 100%;
    }

    .contact-icons-cont {
        flex-wrap: wrap;
        padding: 10px;
        border-radius: 12px;
    }
}

/* ====== Product Gift Coupon ====== */
.procut-gift-coupon {
    max-width: 1400px;
    margin: 0 auto;
}

.new-title-box {
    margin-bottom: 20px;
}

.new-title-box h2 {
    font-size: 28px;
    color: #000;
    font-weight: 500;
    line-height: 1.3;
    margin: 0;
}

.new-title-box h2+p {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    color: #000;
    margin: 5px 0 0;
}

.diy-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.diy-main-product {
    width: 488px;
    position: relative;
    border-radius: 16px;
    background: #f9f9f9;
}

.diy-main-product .img {
    aspect-ratio: 1 / 1;
}

.diy-main-product img {
    width: 100%;
}

.diy-main-product .logo {
    position: absolute;
    top: 7%;
    left: 50%;
    transform: translateX(-50%);
    width: 65%;
    z-index: 1;
}

.diy-add-icon {
    width: 50px;
    height: 50px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #b30202;
    position: relative;
    margin: 0 20px;
}

.diy-add-icon::before {
    content: "";
    width: 60%;
    height: 4px;
    background: #fff;
    border-radius: 2px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.diy-content .diy-add-icon::after {
    content: "";
    width: 4px;
    height: 60%;
    background: #fff;
    border-radius: 2px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.diy-content.type-blue .diy-add-icon {
    background-color: #1455ff;
}

.diy-content.type-black .diy-add-icon {
    background-color: #000;
}

.diy-content .diy-bundle-products-box {
    height: 499px;
    width: calc((100% - 488px - 90px - 220px));
}

.diy-main-product .main-color-change {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    left: 0%;
    top: 18%;
    z-index: 2;
}

.main-color-change .color-change {
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    border-radius: 50%;
    background: #fff;
    border: 1px solid rgb(0, 0, 0);
    background: var(--swatch-background-color);
    margin: 0 5px;
    cursor: pointer;
    position: relative;
}

.main-color-change .psk__swatch-inner {
    display: block;
    width: 18px;
    height: 18px;
    font-size: 0;
}

.main-color-change .psk__swatch-inner img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.main-color-change .color-change.active::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 150%;
    height: 150%;
    border-radius: 50%;
    border: 1px solid #000;
}

.diy-content .diy-bundle-products {
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    height: 100%;
    align-content: space-between;
}

.diy-content .diy-bundle-products li {
    width: calc((100% / 2) - (10px / 2));
    border-radius: 16px;
    overflow: hidden;
    background: #f9f9f9;
    margin-bottom: 10px;
    height: calc((100% / 2) - (10px / 2));
    position: relative;
    padding: 10px;
    display: flex;
    align-items: center;
    margin-bottom: 0px;
}

.diy-content .diy-bundle-products .li3 {
    width: calc((100% / 3) - (9px / 3));
}

.diy-content .diy-bundle-products .special {
    width: 100%;
    padding: 10px 50px;
}

.diy-content .diy-bundle-products li:nth-child(n + 3) {
    margin-bottom: 0px;
}

.diy-content .diy-bundle-products li:first-child .diy-price-content {
    display: none;
}

.diy-content .diy-id-image {
    width: 45%;
    position: relative;
}

.diy-content .special .diy-id-image {
    width: 50%;
}

.diy-content .diy-id-image img {
    position: absolute;
    width: 90%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.diy-content .diy-message {
    width: 55%;
    margin-left: 10px;
}

.diy-content .diy-message .diy-name {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
    color: #000;
    word-break: break-word;
}

.diy-content .diy-price-content {
    margin-top: 10px;
}

.diy-content .bundle-price {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5;
}

.diy-content .diy-real-price {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    opacity: 0.8;
    position: relative;
    display: inline-block;
}

.diy-content .diy-real-price::before {
    content: "";
    position: absolute;
    width: 100%;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    height: 1.5px;
    background: #7c7c7c;

    display: none;
}

.diy-content .diy-total {
    background: #f9f9f9;
    border-radius: 16px;
    width: 200px;
    margin-left: 20px;
    height: 499px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.diy-total .total-txt {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
    margin: 0 0 5px;
}

.diy-total .cs-add-item {
    margin-bottom: 5px;
}

.diy-total .total-price {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 0px;
}

.diy-total .total-tip {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    color: grey;
    display: inline-block;
}

.diy-total .total-btn a {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    padding: 6px 16px;
    background: #000;
    color: #fff;
    border-radius: 50px;
    cursor: pointer;
    display: inline-block;
    margin-bottom: 5px;
}

.diy-total .total-btn a:focus-visible {
    outline: revert;
    outline-offset: 3px;
}

.diy-total .total-btn a:last-of-type {
    margin-bottom: 0px;
}

.diy-total .total-btn a:hover {
    background: #1455ff;
}

.diy-total .message-title {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
}

.diy-total .addtobuy-message {
    height: 62%;
}

.diy-total .addtobuy-message ul {
    margin: 10px 0 0;
    padding: 0;
    height: 90%;
    overflow-y: scroll;
}

.diy-total .addtobuy-message ul::-webkit-scrollbar {
    width: 5px;
}

.diy-total .addtobuy-message ul::-webkit-scrollbar-thumb {
    background: #bcbcbc;
}

.diy-total .addtobuy-message li {
    list-style: none;
    padding: 8px 0;
    border-bottom: 1px solid grey;
}

.diy-total .addtobuy-message .total-message-name {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
}

.diy-total .addtobuy-message .total-message-price {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    opacity: 0.8;
}

.diy-tag {
    position: absolute;
    top: 20px;
    left: 20px;
    padding: 4px 12px;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    color: #fff;
    background: #b30202;
    text-align: center;

    border-radius: 16px;
    top: 0;
    left: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 16px;
}

.type-blue .diy-tag {
    background-color: #1455ff;
}

.type-black .diy-tag {
    background-color: #000;
}

@media (min-width: 768px) and (max-width: 1198.98px) {
    .diy-content .diy-bundle-products-box {
        width: calc((100% - 488px));
        width: 100%;
        height: auto;
    }
}

@media screen and (max-width: 767.98px) {
    .diy-content {
        flex-direction: column;
    }

    .procut-gift-coupon {
        padding: 0 10px;
        max-width: 100%;
    }

    .diy-content .diy-main-product {
        width: 100%;
        border-radius: 12px;
    }

    .diy-content .diy-add-icon {
        width: 40px;
        height: 40px;
        margin: 10px 0;
    }

    .diy-content .diy-bundle-products-box {
        width: 100%;
        height: auto;
    }

    .diy-content .diy-bundle-products {
        height: auto;
    }

    .diy-content .diy-main-product .logo {
        top: 7%;
    }

    .diy-content .diy-main-product .main-color-change {
        top: 17%;
    }

    .diy-content .diy-bundle-products li {
        width: calc((100% / 2) - (10px / 2));
        margin-top: 10px;
        border-radius: 12px;
        height: auto;
        padding: 20px 10px;
    }

    .diy-content .diy-bundle-products .li3 {
        width: calc((100% / 2) - (10px / 2));
    }

    .diy-content .diy-bundle-products .special {
        height: 160px;
        padding: 10px;
    }

    .diy-content .diy-bundle-products li:nth-child(-n + 2) {
        margin-top: 0px;
    }

    .diy-content .diy-message .diy-name {
        font-size: 12px;
    }

    .diy-content .diy-message .diy-name .small {
        font-size: 8px;
    }

    .diy-content .diy-message .color-select {
        width: 16px;
        height: 16px;
    }

    .diy-content .diy-select-option {
        right: 5px;
        top: 5px;
    }

    .diy-content .diy-real-price {
        zoom: 0.8;
    }

    .diy-content .diy-total {
        margin-left: 0px;
        width: 100%;
        height: auto;
        margin-top: 10px;
        border-radius: 12px;
    }

    .diy-total .total-txt {
        font-size: 16px;
    }

    .diy-total .cs-add-item {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

    .diy-total .total-price {
        font-size: 24px;
    }

    .diy-total .total-tip {
        margin-left: 10px;
    }

    .diy-total .total-btn {
        display: flex;
        align-items: center;
    }

    .diy-total .total-btn a {
        margin-bottom: 0px;
        margin-right: 10px;
    }

    .diy-total .total-btn a:last-of-type {
        margin-right: 0px;
    }

    .diy-total .addtobuy-message {
        margin-bottom: 20px;
    }

    .diy-total .addtobuy-message li {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .diy-tag {
        position: absolute;
        top: 20px;
        left: 20px;
        padding: 4px 12px;
        border-radius: 50px;
        font-size: 12px;
        font-weight: 500;
        line-height: 1.5;
        color: #fff;
        background: #b30202;
        text-align: center;

        border-radius: 16px;
        top: 0;
        left: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 16px;
    }

    .type-blue .diy-tag {
        background-color: #1455ff;
    }

    .type-black .diy-tag {
        background-color: #000;
    }
}

@media screen and (max-width: 767.98px) {
    .diy-tag {
        top: 10px;
        left: 10px;
        font-size: 10px;
        padding: 4px 10px;
        top: 0;
        left: 0;
    }
}

.carousel-containers {
    position: absolute;
    top: 51%;
    overflow: hidden;
}

.carousel-containers .carousel-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.carousel-containers .carousel-slide {
    flex: 0 0 25%;
    /* 默认桌面端显示4张图片 */
    padding: 10px 20px;
}

.carousel-containers .carousel-image {
    cursor: pointer;
    width: 95%;
    margin-left: 2.5%;
}

.carousel-containers .carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.7);
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    z-index: 10;
    transition: background-color 0.3s;
}

.carousel-containers .carousel-btn:hover {
    background-color: rgba(255, 255, 255, 0.9);
}

.carousel-containers .carousel-btn.prev {
    left: 0%;
}

.carousel-containers .carousel-btn.next {
    right: 0%;
}

@media screen and (max-width: 1023.98px) {
    .carousel-containers {
        top: 51.5%;
    }

    .carousel-containers .carousel-slide {
        flex: 0 0 50%;
        /* 手机端显示2张图片 */
        padding: 0;
    }

    .carousel-containers .carousel-image {
        cursor: pointer;
        width: 80%;
        margin-left: 10%;
    }
}

.pcp-overview * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.pcp-overview .pcp-section {
    max-width: 1184px;
    margin: 0 auto;
    position: relative;
}

.pcp-overview .pcp-title {
    text-align: center;
    font-size: 38px;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 20px;
}

.pcp-overview .radius {
    border-radius: 24px;
}

.pcp-overview img,
.pcp-overview video {
    width: 100%;
    height: auto;
}

/* PCP only image */
.pcp-overview.pcp-only-image .pcp-section>a {
    display: block;
    line-height: 0;
}

.pcp-overview .pcp-only-image-fallback {
    min-height: 200px;
    background-color: #f5f5f5;
}

.pcp-overview .mob-show {
    display: none;
}

.image-wrap {
    position: relative;
}

#myVideo {
    border-radius: 24px;
}

@media screen and (max-width: 767.98px) {
    #myVideo {
        border-radius: 12px;
    }

    .pcp-overview .pcp-section {
        width: calc(100% - 20px);
        margin: 0 auto;
    }

    .pcp-overview .pcp-title {
        font-size: 5vw;
        margin-bottom: 10px;
    }

    .pcp-overview .radius {
        border-radius: 12px;
    }

    .pcp-overview .mob-show {
        display: block;
    }

    .pcp-overview .mob-hide {
        display: none;
    }
}

.learn-row {
    text-align: center;
    margin-top: 20px;
}

.learn-row a {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 50px;
    background-color: #000;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
}

@media screen and (max-width: 767.98px) {
    .learn-row {
        margin-top: 10px;
    }

    .learn-row a {
        font-size: 14px;
    }
}

.pcp-detail-section {
    --font-size-head-subhead: calc(30 / 19.2 * 1vw);
    --font-line-height-head-subhead: calc(36 / 19.2 * 1vw);
    --font-size-head-head---lg: calc(60 / 19.2 * 1vw);
    --font-line-height-head-head---lg: calc(70 / 19.2 * 1vw);
    --font-size-body-body---lg: calc(20 / 19.2 * 1vw);
    --font-line-height-body-body---lg: calc(30 / 19.2 * 1vw);
    --font-size-highlight-highlight---lg: calc(36 / 19.2 * 1vw);
    --font-line-height-highlight-highlight---lg: calc(43 / 19.2 * 1vw);
    --font-size-body-body---md: calc(18 / 19.2 * 1vw);
    --font-line-height-body-body---md: calc(27 / 19.2 * 1vw);
    --font-size-head-head---xs: calc(26 / 19.2 * 1vw);
    --font-line-height-head-head---xs: calc(32 / 19.2 * 1vw);
    --font-size-body-body---sm: calc(16 / 19.2 * 1vw);
    --font-line-height-body-body---sm: calc(24 / 19.2 * 1vw);
    --font-size-head-head---md: calc(48 / 19.2 * 1vw);
    --font-line-height-head-head---md: calc(56 / 19.2 * 1vw);
    --font-size-foot-note: calc(14 / 19.2 * 1vw);
    --font-line-height-foot-note: calc(21 / 19.2 * 1vw);
    --font-size-highlight-highlight---sm: calc(24 / 19.2 * 1vw);
    --font-line-height-highlight-highlight---sm: calc(28 / 19.2 * 1vw);
    --font-size-head-head---sm: calc(40 / 19.2 * 1vw);
    --font-line-height-head-head---sm: calc(48 / 19.2 * 1vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
    .pcp-detail-section {
        --font-size-head-subhead: calc(18 / 3.75 * 1vw);
        --font-line-height-head-subhead: calc(21 / 3.75 * 1vw);
        --font-size-head-head---lg: calc(28 / 3.75 * 1vw);
        --font-line-height-head-head---lg: calc(34 / 3.75 * 1vw);
        --font-size-body-body---lg: calc(15 / 3.75 * 1vw);
        --font-line-height-body-body---lg: calc(22 / 3.75 * 1vw);
        --font-size-highlight-highlight---lg: calc(22 / 3.75 * 1vw);
        --font-line-height-highlight-highlight---lg: calc(26 / 3.75 * 1vw);
        --font-size-body-body---md: calc(14 / 3.75 * 1vw);
        --font-line-height-body-body---md: calc(21 / 3.75 * 1vw);
        --font-size-body-body---sm: calc(13 / 3.75 * 1vw);
        --font-line-height-body-body---sm: calc(19 / 3.75 * 1vw);
        --font-size-head-head---xs: calc(17 / 3.75 * 1vw);
        --font-line-height-head-head---xs: calc(20 / 3.75 * 1vw);
        --font-size-head-head---md: calc(30 / 3.75 * 1vw);
        --font-line-height-head-head---md: calc(36 / 3.75 * 1vw);
        --font-size-foot-note: calc(10 / 3.75 * 1vw);
        --font-line-height-foot-note: calc(16 / 3.75 * 1vw);
        --font-size-highlight-highlight---sm: calc(14 / 3.75 * 1vw);
        --font-line-height-highlight-highlight---sm: calc(21 / 3.75 * 1vw);
        --font-size-head-head---sm: calc(21 / 3.75 * 1vw);
        --font-line-height-head-head---sm: calc(25 / 3.75 * 1vw);
    }
}

.pcp-detail-section .subTitle {
    /* 标题/副标题 */
    font-size: var(--font-size-head-subhead, 1.5625vw);
    line-height: var(--font-line-height-head-subhead, 1.875vw);
    font-weight: 500;
    /* 120% */
}

.pcp-detail-section .firstTitle {
    /* 标题/一级标题 */
    font-size: var(--font-size-head-head---lg, 3.125vw);
    line-height: var(--font-line-height-head-head---lg, 3.6458333333vw);
    font-weight: 600;
    /* 116.667% */
}

.pcp-detail-section .secondTitle {
    /* 标题/二级标题 */
    font-size: var(--font-size-head-head---lg, 2.5vw);
    line-height: var(--font-line-height-head-head---lg, 2.9166666667vw);
    font-weight: 500;
    /* 116.667% */
}

.pcp-detail-section .thirdTitle {
    /* 标题/三级标题 */
    font-size: var(--font-size-head-head---sm, 2.0833333333vw);
    line-height: var(--font-line-height-head-head---sm, 2.5vw);
    font-weight: 500;
    /* 120% */
}

.pcp-detail-section .forthTitle {
    /* 标题/四级标题 */
    font-size: var(--font-size-head-head---xs, 1.3541666667vw);
    line-height: var(--font-line-height-head-head---xs, 1.6666666667vw);
    /* 123.077% */
}

.pcp-detail-section .firstCopy {
    /* 正文/一级正文 */
    font-size: var(--font-size-body-body---lg, 1.0416666667vw);
    line-height: var(--font-line-height-body-body---lg, 1.5625vw);
    /* 150% */
}

.pcp-detail-section .secondCopy {
    /* 正文/二级正文 */
    font-size: var(--font-size-body-body---md, 0.9375vw);
    line-height: var(--font-line-height-body-body---md, 1.40625vw);
    /* 150% */
}

.pcp-detail-section .thirdCopy {
    /* 正文/三级正文 */
    font-size: var(--font-size-body-body---sm, 0.8333333333vw);
    line-height: var(--font-line-height-body-body---sm, 1.25vw);
    /* 150% */
}

.pcp-detail-section .firstHl {
    /* 高亮/一级高亮 */
    font-size: var(--font-size-head-head---md, 2.5vw);
    line-height: var(--font-line-height-head-head---md, 2.9166666667vw);
    /* 116.667% */
}

.pcp-detail-section .secondHl {
    /* 高亮/二级高亮 */
    font-size: var(--font-size-highlight-highlight---lg, 1.875vw);
    line-height: var(--font-line-height-highlight-highlight---lg, 2.2395833333vw);
    /* 116.667% */
}

.pcp-detail-section .forthHl {
    /* 高亮/四级高亮 */
    font-size: var(--font-size-highlight-highlight---sm, 1.25vw);
    line-height: var(--font-line-height-highlight-highlight---sm, 1.4583333333vw);
}

.pcp-detail-section .footNote {
    /* 注释/注释 */
    font-size: var(--font-size-foot-note, 0.7291666667vw);
    line-height: var(--font-line-height-foot-note, 1.09375vw);
    /* 154.545% */
}

.pcp-detail-section .border-round {
    border-radius: 52.03125vw;
}

.pcp-detail-section {
    position: relative;
    background: #fff;
    color: #000;
    z-index: 2;
}

.pcp-detail-section.is-transition * {
    transition: none !important;
}

.pcp-detail-section section {
    position: relative;
    z-index: 2;
}

.pcp-detail-section div,
.pcp-detail-section h2,
.pcp-detail-section h3,
.pcp-detail-section h4,
.pcp-detail-section ul,
.pcp-detail-section ol,
.pcp-detail-section li,
.pcp-detail-section p,
.pcp-detail-section form,
.pcp-detail-section table,
.pcp-detail-section th,
.pcp-detail-section td,
.pcp-detail-section figure,
.pcp-detail-section button {
    border: none;
    margin: 0px;
    padding: 0px;
    color: inherit;
    font-weight: normal;
}

.pcp-detail-section h2,
.pcp-detail-section h3,
.pcp-detail-section h4 {
    line-height: 1.25;
}

.pcp-detail-section p,
.pcp-detail-section span {
    line-height: 1.25;
}

.pcp-detail-section button {
    background-color: transparent;
    cursor: pointer;
    font-family: inherit;
    line-height: 1;
}

.pcp-detail-section button img,
.pcp-detail-section button svg {
    overflow: initial;
}

.pcp-detail-section sup {
    position: relative !important;
    font-size: 60% !important;
    line-height: 0 !important;
    vertical-align: super !important;
    top: 0 !important;
}

.pcp-detail-section sup.smaller {
    font-size: 40% !important;
    top: -0.5208333333vw !important;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
    .pcp-detail-section sup.smaller {
        top: -1.3333333333vw !important;
    }
}

.pcp-detail-section sup.placeholder {
    display: none;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
    .pcp-detail-section sup.placeholder {
        display: inline-block;
        opacity: 0.001;
    }
}

.pcp-detail-section sup.static {
    position: static !important;
}

.pcp-detail-section picture,
.pcp-detail-section img,
.pcp-detail-section video,
.pcp-detail-section canvas {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
}

.pcp-detail-section a {
    color: inherit;
    text-decoration: none;
}

.pcp-detail-section *,
.pcp-detail-section *::before,
.pcp-detail-section *::after {
    -webkit-font-smoothing: antialiased;
    box-sizing: border-box;
    text-rendering: optimizeLegibility;
}

.pcp-detail-section *:focus,
.pcp-detail-section *:active {
    outline: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.pcp-detail-section a:focus-visible,
.pcp-detail-section button:focus-visible {
    outline: 2px solid #0066cc;
    outline-offset: 2px;
}

.pcp-detail-section .nowrap {
    white-space: nowrap;
}

.pcp-detail-section .object-fit {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.pcp-detail-section .object-contain {
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}

.pcp-detail-section .sticky-container {
    position: sticky;
    top: 52px;
    height: calc(100vh - 52px);
    overflow: hidden;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
    .pcp-detail-section .sticky-container {
        top: 52px;
        height: calc(100vh - 52px);
    }
}

/* Honor Points */
.honor-points {
    /* background: #fff; */
}

.honor-points * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.honor-points p {
    margin: 0;
}

.honor-points .main {
    width: 100%;
}

.honor-points .main img {
    user-select: none;
}

.honor-points .main .section-items {
    max-width: 1400px;
    margin: 80px auto;
    position: relative;
}

.honor-points .main .section-items .section-header {
    /* text-align: center; */
    padding: 20px 0;
}

.honor-points .main .section-items .section-header .section-title {
    font-size: 38px;
    font-weight: 600;
    line-height: 1.5;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .section-items {
        padding: 0 10px;
        margin: 20px auto;
    }

    .honor-points .main .section-items .section-header .section-title {
        font-size: 24px;
    }
}

.honor-points .main .section-items.kv-item {
    max-width: 100%;
}

.honor-points .main .section-items .kv-img {
    width: 100%;
}

.honor-points .main .section-items .kv-content {
    position: absolute;
    top: 0%;
    left: 10%;
    height: 100%;
    width: 34%;
    text-align: left;
    display: flex;
    align-items: center;
}

.honor-points .main .section-items .kv-content .title {
    font-size: 2.4vw;
    font-weight: 600;
    line-height: 1.5;
}

.honor-points .main .section-items .kv-content .desc {
    font-size: 1vw;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 1vw;
}

.honor-points .main .section-items .kv-content .btn-rows {
    margin-top: 2vw;
}

.honor-points .main .section-items .kv-content .btn-rows a {
    margin-right: 1vw;
    font-size: 0.8vw;
    padding: 0.6vw 0.9vw;
    border: 0.1vw solid #353535;
    border-radius: 5vw;
    text-decoration: none;
    color: #353535;
    display: inline-block;
    font-weight: 600;
}

.honor-points .main .section-items .kv-content .btn-rows a:last-child {
    margin-right: 0px;
}

.honor-points .main .section-items .kv-content .btn-rows a:hover {
    background: #353535;
    color: #fff;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .section-items.kv-item {
        padding: 0px;
    }

    .honor-points .main .section-items .kv-content {
        width: 100%;
        left: 0%;
        height: 35%;
        top: 0%;
        justify-content: center;
        text-align: center;
    }

    .honor-points .main .section-items .kv-content .title {
        padding: 0 10px;
        font-size: 20px;
    }

    .honor-points .main .section-items .kv-content .desc {
        font-size: 12px;
        margin-top: 5px;
        padding: 0 10px;
    }

    .honor-points .main .section-items .kv-content .btn-rows {
        margin-top: 10px;
    }

    .honor-points .main .section-items .kv-content .btn-rows a {
        margin-right: 10px;
        font-size: 12px;
        padding: 6px 18px;
        border-radius: 30px;
    }
}

.honor-points .main .delivery-item {
    /* padding: 40px 0; */
}

.honor-points .main .delivery-item .delivery {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.honor-points .main .delivery-item .delivery .de-mi {
    display: flex;
    width: 25%;
}

.honor-points .main .delivery-item .delivery .de-mi .de-icon {
    height: 50px;
}

.honor-points .main .delivery-item .delivery .de-mi .de-text {
    padding-left: 10px;
    padding-right: 20px;
}

.honor-points .main .delivery-item .delivery .de-mi .de-text p {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 10px;
}

.honor-points .main .delivery-item .delivery .de-mi .de-text p:first-child {
    font-weight: 600;
    font-size: 20px;
    margin-top: 0px;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .delivery-item {
        padding: 20px 0;
    }

    .honor-points .main .delivery-item .delivery {
        flex-wrap: wrap;
    }

    .honor-points .main .delivery-item .delivery .de-mi {
        width: 50%;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding-bottom: 10px;
    }

    .honor-points .main .delivery-item .delivery .de-mi .de-icon {
        height: 40px;
        width: fit-content;
    }

    .honor-points .main .delivery-item .delivery .de-mi .de-text {
        padding: 10px 10px 0px;
    }

    .honor-points .main .delivery-item .delivery .de-mi .de-text p {
        font-size: 12px;
    }

    .honor-points .main .delivery-item .delivery .de-mi .de-text p:first-child {
        font-size: 16px;
    }
}

.honor-points .main .express-item {
    /* padding: 80px 0px; */
}

.honor-points .express-header {
    margin-bottom: 30px;
    text-align: center;
}

.honor-points .express-header .title {
    font-size: 38px;
    font-weight: 600;
    line-height: 1.5;
}

.honor-points .express-header .desc {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 10px;
}

.honor-points .main .express-item .express-content {
    display: flex;
    /* align-items: center; */
    justify-content: center;
    flex-wrap: wrap;
}

.honor-points .main .express-item .express-content .express-si {
    width: calc(100% / 2);
    padding: 0 20px 20px;
    text-align: center;
}

.honor-points .main .express-item .express-content .express-si:nth-child(n+5) {
    padding-bottom: 0px;
}

.honor-points .main .express-item .express-content .express-si img {
    display: inline-block;
    height: 250px;
    width: auto;
}

.honor-points .main .express-item .express-content .express-si p {
    margin-top: 16px;
}

.honor-points .main .express-item .express-content .express-si .stitle {
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
}

.honor-points .main .express-item .express-content .express-si .desc {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .express-item {
        padding: 0px 0 20px;
    }

    .honor-points .express-header {
        padding: 0 10px;
        margin-bottom: 0px;
    }

    .honor-points .express-header .title {
        font-size: 24px;
    }

    .honor-points .express-header .desc {
        font-size: 12px;
    }

    .honor-points .main .express-item .express-content {
        flex-wrap: wrap;
        padding-top: 20px;
    }

    .honor-points .main .express-item .express-content .express-si {
        width: 100%;
        padding: 0px 10px 30px;
    }

    .honor-points .main .express-item .express-content .express-si img {
        height: auto;
        width: 100%;
    }

    .honor-points .main .express-item .express-content .express-si .stitle {
        font-size: 20px;
    }

    .honor-points .main .express-item .express-content .express-si .desc {
        font-size: 14px;
        margin-top: 8px;
    }
}

.honor-points .main .links-item {}

.honor-points .main .links-item .links-main {}

.honor-points .main .links-item .links-main .link {
    display: flex;
    width: 100%;
    height: 500px;
    margin: 20px auto;
    align-items: flex-start;
    background: #f9f9f9;
    border-radius: 24px;
    overflow: hidden;
}

.honor-points .main .links-item .links-main .link:nth-child(2n) {
    flex-direction: row-reverse;
}

.honor-points .main .links-item .links-main .link .screen-image {
    width: 50%;
}

.honor-points .main .links-item .links-main .link .content {
    display: flex;
    align-items: center;
    padding-left: 100px;
    padding-right: 30px;
    height: 100%;
}

.honor-points .main .links-item .links-main .link .content .l-title {
    font-size: 28px;
    font-weight: 600;
    line-height: 1.5;
}

.honor-points .main .links-item .links-main .link .content .l-desc {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 14px;
}

.honor-points .main .links-item .links-main .link .content .link-btn {
    display: inline-block;
    margin-top: 30px;
    padding: 10px 20px;
    border-radius: 30px;
    background: #353535;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
}

.honor-points .main .links-item .links-main .link:nth-child(2n) .content {
    padding-left: 30px;
    padding-right: 100px;
    text-align: right;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .links-item .links-main .link {
        flex-direction: column;
        height: auto;
        border-radius: 12px;
    }

    .honor-points .main .links-item .links-main .link:nth-child(2n) {
        flex-direction: column;
        height: auto;
        border-radius: 12px;
    }

    .honor-points .main .links-item .links-main .link .screen-image {
        width: 100%;
    }

    .honor-points .main .links-item .links-main .link .content {
        width: 100%;
        height: auto;
        padding: 10px 20px 20px;
    }

    .honor-points .main .links-item .links-main .link:nth-child(2n) .content {
        text-align: left;
        height: auto;
        padding: 10px 20px 10px;
    }

    .honor-points .main .links-item .links-main .link .content .l-title {
        font-size: 20px;
    }

    .honor-points .main .links-item .links-main .link .content .l-desc {
        font-size: 16px;
        margin-top: 10px;
    }

    .honor-points .main .links-item .links-main .link .content .link-btn {
        font-size: 12px;
        padding: 8px 18px;
    }
}

.honor-points .main .laptop-offer-item {
    margin-top: 80px;
}

.honor-points .main .laptop-offer-item .section-header {
    text-align: center;
    padding: 20px 0;
}

.honor-points .main .laptop-offer-item .section-header .section-title {
    font-size: 38px;
    font-weight: 600;
    line-height: 1.5;
}

.honor-points .main .laptop-offer-item .section-header .section-desc {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5;
}

.honor-points .main .laptop-offer-item .offer-content {
    width: 100%;
    display: flex;
    justify-content: space-between;
    /* border: 1px solid red; */
}

.honor-points .main .laptop-offer-item .offer-content .publish {
    width: 100%;
    padding: 10px;
}

.honor-points .main .laptop-offer-item .offer-content .publish .product-list {
    width: 25%;
    height: 50%;
    border-radius: 24px;
    /* border: 1px solid red; */
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    float: left;
    text-decoration: none;
}

.honor-points .main .laptop-offer-item .offer-content .publish .product-list:nth-child(1) {
    width: 50%;
    height: 100%;
    margin-left: 0px;
    margin-bottom: 0px;
}

.honor-points .main .laptop-offer-item .offer-content .publish .product-list div {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 24px;
    /* border: 1px solid green; */
    padding: 23.5px 10px;
    background: #f4f4f4;
    overflow: hidden;
    position: relative;
}

.honor-points .main .laptop-offer-item .offer-content .publish .product-list div img {
    width: 80%;
    transition: 0.5s;
}

.honor-points .main .laptop-offer-item .offer-content .publish .product-list div p {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 5px;
    text-align: center;
    color: #353535;
}

.honor-points .main .laptop-offer-item .offer-content .publish .product-list div p.name {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
}

.honor-points .main .laptop-offer-item .offer-content .publish .product-list:hover div img {
    transform: scale(1.05);
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .laptop-offer-item {
        margin-top: 20px;
    }

    .honor-points .main .laptop-offer-item .section-header .section-title {
        font-size: 24px;
    }

    .honor-points .main .laptop-offer-item .section-header .section-desc {
        font-size: 16px;
    }

    .honor-points .main .laptop-offer-item .offer-content .publish {
        padding: 10px 0;
    }

    .honor-points .main .laptop-offer-item .offer-content .publish .product-list {
        width: 50%;
        height: 255px;
        padding: 5px;
    }

    .honor-points .main .laptop-offer-item .offer-content .publish .product-list:nth-child(1) {
        width: 100%;
        height: auto;
    }

    .honor-points .main .laptop-offer-item .offer-content .publish .product-list div {
        border-radius: 12px;
    }

    .honor-points .main .laptop-offer-item .offer-content .publish .product-list div img {
        width: 70%;
    }

    .honor-points .main .laptop-offer-item .offer-content .publish .product-list div p {
        font-size: 10px;
    }
}

.honor-points .main .student-pick-item {
    margin-top: 80px;
    margin-bottom: 80px;
}

.honor-points .main .student-pick-item .section-header {
    text-align: center;
    padding: 20px 0;
}

.honor-points .main .student-pick-item .section-header .section-title {
    font-size: 38px;
    font-weight: 600;
    line-height: 1.5;
}

.honor-points .main .student-pick-item .section-header .section-desc {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5;
}

.honor-points .main .student-pick-item .pick-content {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.honor-points .main .student-pick-item .pick-content {
    user-select: none;
}

.honor-points .main .student-pick-item .pick-content .product-list {
    padding: 10px 7px;
    width: 33%;
    text-align: center;
    display: inline-block;
    user-select: all;
}

.honor-points .main .student-pick-item .pick-content .product-list div {
    padding: 20px 10px;
    background: #f4f4f4;
    border-radius: 24px;
    position: relative;
}

.honor-points .main .student-pick-item .pick-content .product-list .list-tag {
    position: absolute;
    right: 10px;
    top: 10px;
    height: 60px;
}

.honor-points .main .student-pick-item .pick-content .product-list .id-image {
    display: inline-block;
    width: 60%;
}

.honor-points .main .student-pick-item .pick-content .product-list .id-image img {
    width: 100%;
    display: inline-block;
}

.honor-points .main .student-pick-item .pick-content .product-list p {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
}

.honor-points .main .student-pick-item .pick-content .product-list p.product-name {
    font-size: 20px;
    font-weight: 600;
    margin: 10px 0;
}

.honor-points .main .student-pick-item .pick-content .product-list a.product-button {
    display: inline-block;
    padding: 6px 20px;
    background: #353535;
    color: #fff;
    border-radius: 30px;
    margin: 20px auto 0;
    font-size: 16px;
    cursor: pointer;
    text-decoration: none;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .student-pick-item {
        margin: 20px auto;
    }

    .honor-points .main .student-pick-item .section-header .section-title {
        font-size: 24px;
    }

    .honor-points .main .student-pick-item .section-header .section-desc {
        font-size: 16px;
    }

    .honor-points .main .student-pick-item .pick-content .publish {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }

    .honor-points .main .student-pick-item .pick-content .product-list {
        width: 50%;
        padding: 5px;
    }

    .honor-points .main .student-pick-item .pick-content .product-list div {
        border-radius: 12px;
        padding: 10px;
    }

    .honor-points .main .student-pick-item .pick-content .product-list .list-tag {
        height: 30px;
    }

    .honor-points .main .student-pick-item .pick-content .product-list .id-image {
        width: 80%;
    }

    .honor-points .main .student-pick-item .pick-content .product-list p.product-name {
        font-size: 16px;
        margin: 5px 0;
        height: 50px;
    }

    .honor-points .main .student-pick-item .pick-content .product-list p {
        font-size: 12px;
        height: 36px;
    }

    .honor-points .main .student-pick-item .pick-content .product-list a.product-button {
        padding: 4px 16px;
        font-size: 12px;
        margin-top: 10px;
    }
}

.honor-points .main .button-item {
    padding: 0px 0 80px;
}

.honor-points .main .button-item .buttonTown {
    text-align: center;
}

.honor-points .main .button-item .buttonTown a {
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    padding: 10px 24px;
    background: #353535;
    color: #fff;
    border-radius: 30px;
    text-decoration: none;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .button-item {
        padding-bottom: 40px;
    }

    .honor-points .main .button-item .buttonTown a {
        font-size: 12px;
        padding: 8px 20px;
    }
}

.honor-points .main .discount-item {
    padding-bottom: 80px;
}

.honor-points .main .discount-item .desc {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 10px;
}

.honor-points .main .discount-item .subContent {
    margin-top: 20px;
}

.honor-points .main .discount-item .subContent p {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 5px;
}

.honor-points .main .discount-item .subContent .m-l {
    padding-left: 2em;
}

.honor-points .main .discount-item .btn-row {
    margin-top: 30px;
}

.honor-points .main .discount-item .btn-row a {
    display: inline-block;
    color: #fff;
    background: #353535;
    border-radius: 30px;
    padding: 10px 22px;
    margin-right: 10px;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
}

.honor-points .main .discount-item .btn-row a:last-child {
    margin-top: 0px;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .discount-item {
        padding-bottom: 40px;
    }

    .honor-points .main .discount-item .desc {
        font-size: 14px;
    }

    .honor-points .main .discount-item .subContent p {
        font-size: 14px;
    }

    .honor-points .main .discount-item .btn-row {
        text-align: center;
    }

    .honor-points .main .discount-item .btn-row a {
        font-size: 14px;
        padding: 8px 18px;
    }
}

.honor-points .main .faq-item {
    padding-bottom: 80px;
}

.honor-points .main .faq-item .faq-content p {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
}

.honor-points .main .faq-item .faq-content p.qa {
    font-weight: 600;
    font-size: 18px;
    margin-top: 10px;
}

.honor-points .main .faq-item .faq-content p.aq {
    margin-top: 5px;
}

@media screen and (max-width: 839.99px) {
    .honor-points .main .faq-item .faq-content p {
        font-size: 14px;
    }

    .honor-points .main .faq-item .faq-content p.qa {
        font-size: 16px;
    }
}

.honor-points img.addTag {
    position: absolute;
    top: 0%;
    left: 20px;
    width: 60px !important;
}

@media screen and (max-width: 839.99px) {
    .honor-points img.addTag {
        left: 10px;
        width: 40px !important;
    }
}

.honor-points .step-text {
    padding: 0 10px;
}

.honor-points .step-text p {
    font-size: 20px;
    line-height: 1.5;
    font-weight: 500;
    margin-bottom: 10px;
}

@media screen and (max-width: 839.99px) {
    .honor-points .step-text p {
        font-size: 16px;
        margin-bottom: 5px;
    }
}

/* Installment */
.instalment * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.instalment p {
    margin: 0;
    padding: 0;
}

.instalment .ins-guide {
    width: 100%;
}

.instalment .sec-title {
    margin: 4vw 0 1vw;
}

.instalment .sec-title h2 {
    font-size: 38px;
    color: #333;
    text-align: center;
    font-weight: 600;
    line-height: 1.5;
}

.instalment .sec-desc {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 10px;
    text-align: center;
}

.instalment .ins-guide .guide-content {
    width: 59.1895%;
    margin: 0 auto;
}

.instalment .ins-guide .guide-content .guide-setp {
    margin-bottom: 0.8854vw;
    display: flex;
    align-items: center;
}

.instalment .ins-guide .guide-content .guide-setp p:nth-child(1) {
    font-size: 1.25vw;
    color: #000000;
    font-weight: 600;
    padding: 0.5vw 1.1vw;
    background: #ffc500;
    border-radius: 3vw;
    display: inline-block;
    margin-right: 1.823vw;
    white-space: nowrap;
}

.instalment .ins-guide .guide-content .guide-setp p:nth-child(2) {
    font-size: 1.042vw;
    color: #000000;
    font-weight: 500;
}

.instalment .ins-guide .guide-content .guide-image {
    width: 100%;
    padding: 1.5vw;
    padding: 1.5vw;
    padding: 1vw;
    border-radius: 1.25vw;
    border-radius: 1vw;
    background: rgba(250, 245, 235, 0.3);
    display: flex;
    justify-content: center;
    align-items: center;
}

.instalment .ins-guide .guide-content .guide-image picture {
    width: 100%;
}

.instalment .ins-guide .guide-content .guide-image img {
    height: auto;
    width: 100%;
    user-select: none;
}

.instalment .ins-guide .next {
    width: 2.917vw;
    height: 2.917vw;
    margin: 2.70834vw auto 1.875vw;
}

.instalment .ins-guide .next img {
    width: 100%;
    user-select: none;
}

.instalment .mb-show {
    display: none;
}

.instalment .wrap-list {
    justify-content: flex-start;
}

.instalment .wrap-list .ins-guide {
    width: calc((100% / 3) - 20px);
    flex: inherit;
}

.instalment .wrap-list .ins-guide .guide-content {
    margin-bottom: 20px;
}

.instalment .wrap-list .ins-guide:nth-child(n+4) .guide-content {
    margin-bottom: 0px;
}

@media screen and (max-width: 839.99px) {
    .instalment .mb-show {
        display: block;
    }

    .instalment .ins-guide .title {
        margin: 30px auto 20px;
    }

    .instalment .sec-title {
        margin: 30px 10px 10px;
    }

    .instalment .sec-title h2 {
        padding: 0 30px;
        font-size: 24px;
    }

    .instalment .sec-desc {
        font-size: 16px;
    }

    .instalment .ins-guide .guide-content {
        width: 96%;
        border-radius: 12px;
    }

    .instalment .ins-guide .guide-content .guide-setp {
        margin-bottom: 10px;
    }

    .instalment .ins-guide .guide-content .guide-setp p:nth-child(1) {
        font-size: 14px;
        padding: 4px 12px;
        white-space: nowrap;
        border-radius: 6px;
    }

    .instalment .ins-guide .guide-content .guide-setp p:nth-child(2) {
        font-size: 12px;
    }

    .instalment .ins-guide .next {
        width: 32px;
        height: 32px;
        margin: 24px auto 20px;
    }

    .instalment .ins-guide .guide-content .guide-image {
        padding: 10px;
        border-radius: 12px;
    }

    .instalment .wrap-list .ins-guide .guide-content {
        margin-bottom: 0px;
    }
}

.ins-guide-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 1400px;
    margin: 0 auto;
}

.instalment .ins-guide {
    width: auto;
    flex: 1;
    margin: 0 10px;
}

.instalment .ins-guide .guide-content {
    width: auto;
}

.instalment .ins-guide .guide-content .guide-setp {
    min-height: 100px;
}

.instalment .ins-guide .guide-content .guide-setp p:nth-child(1) {
    font-size: 14px;
    margin-right: 10px;
}

.instalment .ins-guide .guide-content .guide-setp p:nth-child(2) {
    font-size: 12px;
}

@media screen and (max-width: 839.99px) {
    .ins-guide-list {
        flex-wrap: nowrap;
    }

    .ins-guide-list.list-3 {
        width: 240%;
    }

    .ins-guide-list.list-5 {
        width: 500%;
    }

    .section-scroll {
        overflow: scroll;
        width: calc(100% - 20px);
        margin: 0 auto;
        padding-bottom: 10px;
    }

    .section-scroll::-webkit-scrollbar-track-piece {
        background-color: rgba(0, 0, 0, 0);
        border-left: 1px solid rgba(0, 0, 0, 0);
    }

    .section-scroll::-webkit-scrollbar {
        width: 5px;
        height: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    .section-scroll::-webkit-scrollbar-thumb {
        background-color: rgba(191, 191, 191, 191);
        background-clip: padding-box;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        min-height: 28px;
    }

    .section-scroll::-webkit-scrollbar-thumb:hover {
        background-color: rgba(0, 0, 0, 0.5);
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    .instalment .ins-guide {
        flex-basis: 100%;
        margin: 0px 10px 0px 0px;
    }

    .instalment .ins-guide:last-child {
        margin-right: 0px;
    }

    .instalment .ins-guide .guide-content .guide-setp {
        min-height: 80px;
    }

    .instalment .ins-guide .guide-content .guide-setp p:nth-child(2) {
        font-size: 10px;
    }
}

.mytable tr td {
    border: 1px solid #000 !important;
    padding: 5px;
    font-size: 14px;
    text-align: center;
    font-weight: bold;
}