/* ============================================
   SEE 2026 专属样式
   仅由 see2026.html 引用，不影响 see2025.html
   ============================================ */

/* 星空粒子画布 */
#foreword-stars-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 2;
}

/* section 层级修复（foreword 粒子效果需要） */
section {
    position: relative;
    z-index: 1;
}

/* Banner 区域：开启相对定位以支持绝对定位的背景图 */
.banner-box {
    position: relative;
}

/* Banner 大背景图（PC 端全宽展示） */
.banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 900px;
    object-fit: cover;
    z-index: 0;
}

/* Banner 内容层（需在背景图之上） */
.banner-box .banner {
    position: relative;
    z-index: 1;
}

/* 移动端专属 banner 图（PC 端默认隐藏） */
.banner-mobile-bg {
    display: none;
}

/* 2026 不使用 banner-right 图片 */
.banner-right {
    display: none;
}

/* foreword 介绍区域：层级 + 顶部间距 */
.foreword {
    position: relative;
    z-index: 1;
    margin-top: 160px;
}

/* ============================================
   大会关键词 - 2026 专属图片
   ============================================ */

.keyword-item:first-child {
    background-image:
        linear-gradient(123deg, #6A39FC -2%, rgba(0, 76, 255, 0) 34%),
        linear-gradient(to right, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.85) 50%, rgba(0,0,0,0) 80%),
        linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.1)),
        url('/asset/image/see/2026-SEE/2026keywords_bg1@2x.jpg');
    border-color: #6A39FC;
}

.keyword-item:nth-child(2) {
    background-image:
        linear-gradient(123deg, #006BFF -2%, rgba(0, 76, 255, 0) 34%),
        linear-gradient(to right, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.85) 50%, rgba(0,0,0,0) 80%),
        linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.1)),
        url('/asset/image/see/2026-SEE/2026keywords_bg2.jpg');
}

.keyword-item:nth-child(3) {
    background-image:
        linear-gradient(123deg, #009DD1 -2%, rgba(0, 76, 255, 0) 34%),
        linear-gradient(to right, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.85) 50%, rgba(0,0,0,0) 80%),
        linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.1)),
        url('/asset/image/see/2026-SEE/2026keywords_bg3.jpg');
    border-color: #009DD1;
}

.keyword-item:nth-child(4) {
    background-image:
        linear-gradient(123deg, #B28F65 -2%, rgba(178, 143, 101, 0) 34%),
        linear-gradient(to right, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.85) 50%, rgba(0,0,0,0) 80%),
        linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.1)),
        url('/asset/image/see/2026-SEE/2026keywords_bg4.jpg');
    border-color: #B28F65;
}

/* 四层背景尺寸/位置/重复方式：配色渐变 / 左侧阴影 / 图片整体叠层(10%) / 背景图 */
.keyword-item {
    background-size: cover, cover, cover, cover;
    background-position: center, center, center, right center;
    /* ✅ 第四层图：右对齐垂直居中 */
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
}

/* ============================================
   大会看点 - 2026 专属图片
   ============================================ */

/* 覆盖 2025 的 .hightlights-info>div:last-child { grid-column: 1/-1 } */
.hightlights-info > div:last-child {
    grid-column: auto;
}

.hightlights-item:first-child {
    background-image: url('/asset/image/see/2026-SEE/2026highlights_bg1.jpg');
}

.hightlights-item:nth-child(2) {
    background-image: url('/asset/image/see/2026-SEE/2026highlights_bg2.jpg');
}

.hightlights-item:nth-child(3) {
    background-image: url('/asset/image/see/2026-SEE/2026highlights_bg3.jpg');
}

.hightlights-item:nth-child(4) {
    background-image: url('/asset/image/see/2026-SEE/2026highlights_bg4.jpg');
}

/* ============================================
   移动端响应式 - 2026 专属（覆盖 see.css 的 600px 断点）
   ============================================ */

@media (max-width: 900px) {

    .see-main {
        padding-bottom: 32px;
        font-size: 14px;
        letter-spacing: 1px;
    }

    /* 隐藏 PC 端背景图 */
    .banner-bg {
        display: none;
    }

    /* 显示移动端专属 banner 图 */
    .banner-mobile-bg {
        display: block;
        width: calc(100% + 24px);
        margin: 16px -12px 0;
        height: 450px;
        object-fit: cover;
        position: static;
    }

    .banner-box {
        overflow: hidden;
        padding: 80px 12px 0;
        background: linear-gradient(176deg, #006BFF -50%, rgba(0, 76, 255, 0) 42%);
    }

    section {
        margin-top: 64px;
    }

    section .title:before {
        left: calc(50% - 12px);
        top: -23px;
        width: 24px;
        height: 24px;
    }

    section .big-desc {
        font-size: 24px;
        letter-spacing: 2px;
        line-height: 32px;
    }

    .agenda-item,
    section .content {
        margin: 16px auto 0;
    }

    .banner-left {
        gap: 24px;
    }

    .banner-title-box {}

    .banner-title {
        font-size: 39px;
        line-height: 1.2;
        white-space: nowrap;
    }

    .banner-desc {
        font-size: 16px;
        line-height: 16px;
        letter-spacing: 1.4px;
    }

    .banner-capsule-box {
        gap: 8px;
        flex-direction: row;
    }

    .banner-capsule-row {
        gap: 8px;
    }

    .banner-capsule-item {
        font-size: 10px;
        line-height: 24px;
        padding: 2px 8px;
        letter-spacing: 1px;
    }

    .banner-org-item-title,
    .banner-org-item-desc {
        font-size: 10px;
        line-height: 14px;
        white-space: pre-line;
    }

    .foreword {
        margin-top: -144px;
        font-size: 14px;
        line-height: 28px;
        letter-spacing: 1px;
    }

    .sub-keyword {
        font-size: 16px;
    }

    .hightlights-info {
        gap: 8px;
    }

    .keyword-item {
        padding: 24px;
    }

    .hightlights-item {
        padding: 16px 4px;
    }

    .keyword-item .keyword-title,
    .hightlights-item-title {
        font-size: 18px;
        letter-spacing: 1px;
        line-height: 24px;
    }

    .keyword-item .keyword-sub-title {
        font-size: 14px;
        letter-spacing: 1px;
        line-height: 16px;
    }

    .keyword-item .keyword-desc,
    .hightlights-item-desc {
        font-size: 11px;
        letter-spacing: 0.5px;
        line-height: 16px;
    }

    .guest-grid {
        grid-template-columns: repeat(3, 1fr);
        width: 98vw;
        row-gap: 24px;
    }

    .guest-grid .guest-item {
        min-width: 116px;
        width: auto;
        gap: 4px;
    }

    .guest-grid .guest-item .image-wrapper {
        width: 88px;
        height: 88px;
        padding: 3px;
    }

    .guest-grid .guest-item .guestName {
        font-size: 16px;
        letter-spacing: 1px;
        line-height: 24px;
        font-weight: 500;
    }

    .guest-grid .guest-item .guestPic {
        border: 4px solid #000000;
    }

    .guest-grid .guest-item .guestInfos p {
        font-size: 10px;
        line-height: 16px;
    }

    .agenda-item {}

    .agenda-item .agenda-content {
        padding: 16px 0;
    }

    .agenda-item .agenda-header {
        font-size: 14px;
        height: 32px;
    }

    .agenda-item .agenda-item-info .agenda-time {
        font-size: 12px;
        line-height: 20px;
    }

    .agenda-item .agenda-item-info .agenda-desc {
        font-size: 11px;
        line-height: 18px;
    }

    .agenda-item .agenda-item-info .agenda-title {
        font-size: 14px;
        line-height: 24px;
    }

    .forum-box {
        width: 96vw !important;
        margin: 0px auto 0;
        gap: 8px;
    }

    .forum-box.main {
        grid-template-columns: 1fr;
    }

    .forum-box .forum-title {
        font-size: 18px;
        letter-spacing: 1px;
        margin-top: 56px;
        margin-bottom: 0px;
        line-height: 0;
        padding-left: 16px;
    }

    .forum-box .forum-card .card-header {
        font-size: 14px;
        height: auto;
        padding-left: 12px;
    }

    .forum-box .forum-card .card-header-tab .tab-item {
        padding: 8px 4px;
        font-size: 14px;
        letter-spacing: 0;
        white-space: pre-line;
        line-height: 150%;
    }

    .forum-item {
        padding: 16px;
    }

    .forum-item .forum-item-title {
        font-size: 16px;
        letter-spacing: 1px;
        margin-bottom: 8px;
    }

    .forum-item .forum-item-desc .forum-date,
    .forum-item .forum-item-desc .forum-tips {
        font-size: 14px;
        line-height: 24px;
        padding-left: 6px;
    }

    .forum-item .forum-item-desc .forum-tips {
        margin-left: 0;
        font-size: 16px;
        letter-spacing: 1px;
    }

    .forum-item .forum-item-desc .forum-tips:before {
        left: -10px;
        top: 10px;
        width: 4px;
        height: 4px;
    }

    .time-list {
        grid-template-columns: 1fr;
        margin-top: 8px;
        grid-gap: 0;
    }

    .time-list .time-item {
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .time-list .time-item .num {
        font-size: 48px;
        line-height: 56px;
        letter-spacing: 2px;
    }

    .time-list .time-item .time {
        font-size: 14px;
        padding-left: 6px;
    }

    .time-list .time-item .time-item-title {
        font-size: 16px;
        padding-left: 6px;
        margin-top: 0;
        letter-spacing: 1px;
        line-height: normal;
    }

    .time-list .time-item .single-guest {
        padding-left: 6px;
        margin-top: 4px;
    }

    .time-list .time-item .single-guest .guest-item {
        align-items: flex-start;
    }

    .time-list .time-item .time-item-guests .guest-item .guest-name {
        font-size: 14px;
        line-height: 20px;
    }

    .time-list .time-item .single-guest .guest-item .guest-avatar {
        width: 32px;
        height: 32px;
    }

    .time-list .time-item .single-guest .guest-right {
        margin-left: 6px;
    }

    .time-list .time-item .single-guest .guest-name {
        font-size: 10px;
        letter-spacing: 0.5px;
    }

    .time-list .time-item .single-guest .guest-title {
        font-size: 8px;
        letter-spacing: 0.5px;
    }

    .qrcode {
        width: 200px;
        height: 200px;
    }

    .historyBox {
        width: 100%;
        height: auto;
    }

    #gallery-top {
        height: 100%
    }

    #gallery-thumbs {
        height: 0;
        padding: 0
    }

    #gallery-top img:hover {
        transform: scale(1)
    }

    #components-anchor-more {
        margin-bottom: 100px;
    }

    .brand-wall {
        gap: 16px;
    }

    .brand-item {
        width: 108px;
        height: 60px;
    }

    .swiper-button-next.swiper-button-white,
    .swiper-button-prev.swiper-button-white {}
}
