/* Page-local styling: preserve the shared header, rail and container geometry. */
#desktop-download {
    background: linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5)), #13100b url('/assets/img/ubo/landing/landing-background.png') center -32vw / 100% auto no-repeat;
    color: #fff;
    padding: 0 clamp(16px, 1.25vw, 24px) 80px;
}
#desktop-download .desktop-download__inner {
    max-width: min(1600px, calc((100vw - var(--rail-w)) * .869));
    margin: 0 auto;
}
#desktop-download .desktop-download__hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 60px;
    min-height: 850px;
    padding: 50px clamp(24px, 4.167vw, 80px) 70px;
}
#desktop-download h1 { font-size: 30px; line-height: 1.45; font-weight: 700; margin: 0 0 20px; }
#desktop-download h1 span { color: #f3d198; }
#desktop-download .desktop-download__intro > p { font-size: 16px; line-height: 1.5; margin: 0; max-width: 610px; }
#desktop-download .desktop-download__art { display: block; width: 100%; height: auto; max-height: 760px; object-fit: contain; }
#desktop-download .desktop-download__art-source { display: contents; }
#desktop-download picture > source { display: none; }
#desktop-download .desktop-download__platforms { display: flex; gap: clamp(32px, 4.167vw, 80px); margin-top: 72px; }
#desktop-download .desktop-download__platform { width: 160px; flex: 0 0 160px; text-align: center; }
#desktop-download .desktop-download__qr { background: transparent; border: 0; border-radius: 0; padding: 0; box-shadow: none; overflow: visible; width: 160px; height: 160px; }
#desktop-download .desktop-download__qr img { display: block; width: 100%; height: 100%; object-fit: contain; }
#desktop-download .desktop-download__button { display: flex; align-items: center; justify-content: center; min-height: 44px; margin-top: 28px; border-radius: 24px; background: var(--background-theme-color, linear-gradient(135deg, #bd935a, #ffe1a6)); color: #111; text-decoration: none; font-size: 18px; font-weight: 700; }
#desktop-download .desktop-download__instruction { display: inline-block; color: #ebd4aa; text-decoration: underline; margin-top: 18px; font-size: 18px; }
#desktop-download .desktop-download__guide { scroll-margin-top: calc(var(--header-h, 100px) + 24px); padding-top: 30px; margin-bottom: 60px; }
#desktop-download h2 { color: #ebd4aa; text-align: center; font-size: 20px; font-weight: 600; line-height: 1.4; margin: 0 0 44px; }
#desktop-download .desktop-download__carousel { position: relative; padding: 0 70px; }
#desktop-download .desktop-download__swiper { min-width: 0; overflow: hidden; }
#desktop-download .swiper-wrapper { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 60px; }
#desktop-download .is-enhanced .swiper-wrapper { display: flex; gap: 0; }
#desktop-download .desktop-download__step { margin: 0; min-width: 0; height: auto; }
#desktop-download .desktop-download__step > img, #desktop-download .desktop-download__step > picture > img { display: block; width: 100%; height: auto; }
#desktop-download figcaption { margin: 24px 0 0; color: #fff; font-size: 16px; line-height: 1.4; }
#desktop-download .desktop-download__prev, #desktop-download .desktop-download__next { display: none; position: absolute; top: 43%; transform: translateY(-50%); border: 0; background: transparent; padding: 0; width: 40px; height: 40px; border-radius: 50%; z-index: 2; }
#desktop-download .desktop-download__prev { left: 0; }
#desktop-download .desktop-download__next { right: 0; }
#desktop-download .is-enhanced .desktop-download__prev, #desktop-download .is-enhanced .desktop-download__next { display: block; }
#desktop-download .swiper-button-disabled { opacity: .35; cursor: default; }
#desktop-download .desktop-download__pagination { text-align: center; margin-top: 48px; }
#desktop-download .swiper-pagination-bullet { background: #8c7c61; opacity: 1; width: 12px; height: 12px; margin: 0 5px; }
#desktop-download .swiper-pagination-bullet-active { background: #f3d198; }
#desktop-download a:focus-visible, #desktop-download button:focus-visible, #desktop-download .swiper-pagination-bullet:focus-visible { outline: 2px solid #f3d198; outline-offset: 5px; }
@media (max-width: 1400px) {
    #desktop-download .desktop-download__hero { min-height: 680px; gap: 32px; padding-inline: 24px; }
    #desktop-download h1 { font-size: 26px; }
    #desktop-download .desktop-download__platforms { margin-top: 42px; }
    #desktop-download .desktop-download__carousel { padding-inline: 54px; }
}
@media (max-width: 1023px) {
    #desktop-download .desktop-download__hero { gap: 24px; padding-inline: 0; }
    #desktop-download .desktop-download__platforms { gap: 20px; }
    #desktop-download .desktop-download__platform { width: 130px; flex-basis: 130px; }
    #desktop-download .desktop-download__qr { width: 130px; height: 130px; }
    #desktop-download .swiper-wrapper { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
}
@media (max-width: 767px) {
    #desktop-download .desktop-download__hero { grid-template-columns: 1fr; min-height: 0; padding-block: 40px; }
    #desktop-download .desktop-download__art { max-height: 480px; }
    #desktop-download h1 { font-size: 24px; }
    #desktop-download .desktop-download__platforms { justify-content: center; }
    #desktop-download .swiper-wrapper { grid-template-columns: 1fr; }
    #desktop-download .desktop-download__carousel { padding-inline: 44px; }
}

/* D01: XD preview typography and NAS desktop originals, without changing the page container. */
@media (min-width: 992px) {
    #desktop-download {
        background: #13100b url('/assets/img/desktop/download/background.png') center top / 100% auto no-repeat;
        background-image: image-set(url('/assets/img/desktop/download/background.png') 1x, url('/assets/img/desktop/download/background@2x.png') 2x);
    }
    #desktop-download .desktop-download__hero {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-height: clamp(660px, 46.875vw, 900px);
        padding-right: 0;
    }
    #desktop-download .desktop-download__intro { min-width: 0; }
    #desktop-download h1 { font-size: 32px; }
    #desktop-download .desktop-download__intro > p { font-size: 18px; }
    #desktop-download .desktop-download__art {
        min-width: 0;
        max-height: clamp(440px, 39.8958vw, 766px);
    }
    #desktop-download .desktop-download__platforms { gap: clamp(32px, 4.6875vw, 90px); }
    #desktop-download .desktop-download__button {
        background: linear-gradient(30deg, #b38a5a 0%, #ffdb9d 45%, #ffdb9d 55%, #b38a5a 100%);
        box-shadow: inset 0 0 0 1px #eccf97;
    }
}
@media (min-width: 992px) and (max-width: 1400px) {
    #desktop-download h1 { font-size: 28px; }
}