/* ============================================
   Responsive
   ============================================ */

@media screen and (max-width: 1024px) {
    .container {
        padding: 0 16px;
    }

    .banner-container {
        height: min(48vw, 360px);
        border-radius: 0;
    }
}

@media screen and (max-width: 768px) {
    :root {
        --header-height: 44px;
    }

    .header-bar__logo,
    .logo {
        max-height: 28px;
        max-width: 60px;
    }

    .header-bar__title,
    .header .platform-name {
        font-size: 15px;
        padding: 0 120px;
    }

    .header-icon-btn {
        width: 36px;
        height: 36px;
    }

    .lang-picker__globe {
        font-size: 20px;
    }

    .banner-container {
        height: min(52vw, 300px);
        min-height: 200px;
        border-radius: 0;
    }

    .banner-prev,
    .banner-next {
        width: 38px;
        height: 38px;
    }

    .banner-controls {
        padding: 0 10px;
    }

    .banner-indicators {
        bottom: 16px;
    }

    .notice-content {
        padding: 10px 12px;
    }

    .notice-scroll-text {
        font-size: 13px;
    }

    .section-title {
        font-size: 1.2rem;
    }

    .section-subtitle {
        font-size: 0.8125rem;
    }

    .access-section,
    .links-section {
        padding: 1.25rem 0 1.5rem;
    }

    .platform-links-list {
        grid-template-columns: 1fr;
    }

    .intro-images-grid {
        grid-template-columns: 1fr;
    }

    .platform-link-card {
        padding: 12px 14px;
        gap: 12px;
    }

    .platform-link-image-wrapper {
        width: 42px;
        height: 42px;
    }

    .platform-link-name-cell {
        font-size: 0.9375rem;
    }

    .platform-link-btn {
        padding: 9px 16px;
        font-size: 0.8125rem;
    }

    .intro-images-grid {
        gap: 10px;
    }

    .footer {
        padding: 1.25rem 0 1.75rem;
    }

    .copyright {
        font-size: 12px;
    }

    .popup-body {
        padding: 1.5rem 1.25rem 1rem;
    }

    .popup-footer {
        flex-direction: column;
        align-items: stretch;
        padding: 1rem 1.25rem 1.5rem;
    }

    .popup-confirm {
        width: 100%;
    }

    .floating-service {
        width: 52px;
        height: 52px;
        bottom: 18px;
        right: 18px;
    }
}

@media screen and (max-width: 480px) {
    .container {
        padding: 0 14px;
    }

    .platform-name {
        font-size: 0.9375rem;
    }

    .banner-container {
        height: min(56vw, 260px);
    }

    .platform-link-card {
        flex-wrap: wrap;
        align-items: stretch;
    }

    .platform-link-card-main {
        width: 100%;
    }

    .platform-link-btn {
        width: 100%;
        text-align: center;
    }

    .section-head {
        margin-bottom: 1rem;
    }
}

@media screen and (min-width: 1440px) {
    .container {
        max-width: 1040px;
    }

    .banner-container {
        height: 440px;
    }

    .intro-images-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
}

@media screen and (min-width: 769px) {
    .intro-images-grid {
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 16px;
    }
}

@media screen and (orientation: landscape) and (max-height: 500px) {
    .banner-container {
        height: 200px;
        min-height: 160px;
    }
}

@media print {
    .header-actions,
    .banner-controls,
    .banner-indicators,
    .floating-service,
    .popup-modal {
        display: none !important;
    }

    body {
        background: white;
        color: black;
    }
}

    /* 移动端滚动性能：减弱固定背景动画与模糊，内容默认可见 */
@media (hover: none), (pointer: coarse), (max-width: 768px) {
    .reveal,
    .platform-link-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .ldy-bg__orb {
        filter: blur(48px);
        animation: none;
        opacity: 0.28;
    }

    .ldy-bg__grid {
        animation: none;
        opacity: 0.35;
    }

    .platform-link-card,
    .notice-content,
    .popup-overlay {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .floating-service__inner {
        animation: none;
    }

    html.is-scrolling .ldy-bg__orb,
    html.is-scrolling .ldy-bg__grid,
    html.is-scrolling .notice-scroll-text.scrolling,
    html.is-scrolling .floating-service__inner {
        animation-play-state: paused !important;
    }
}
