/* ====================================================================
   V47 - 意识·算力·边界 - 未来科技的社会实验
   深蓝主题：星空深海 · 白色文本
   ==================================================================== */

/* ==================== 主题变量 ==================== */
:root {
    /* 字号 */
    --fs-hero: 24px;
    --fs-nav: 46px;
    --fs-s1p: 50px;
    --fs-s1m: 25px;
    --fs-s2p: 30px;
    --fs-lt: 33px;
    --fs-lp: 24px;
    --fs-dt: 50px;
    --fs-dp: 25px;

    /* 颜色 */
    --text: #FFFFFF;
    --c-text: #FFFFFF;
    --c-dark: #000000;
    --c-bd: #FFFFFF;
    --c-bg-btn: #eaff7a;
    --c-glow: 0 0 1vw rgba(255, 255, 255, 0.8);
    --c-accent: #4FC3F7;
    --bd-c: #4FC3F7;

    /* 背景色 */
    --bg-page-deep: #020b25;
    --w: 1670px;

    /* 边框宽度 */
    --w-bd: 8px;

    /* 圆角 */
    --r-sec: 30px;
    --r-card: 20px;
    --tr: 0.3s ease-in-out;
}

@media screen and (max-width: 1919px) {
    /*7185*/
    :root {
        --w: 1200px;
        --fs-hero: 17px;
        --fs-nav: 32px;
        --fs-s1p: 36px;
        --fs-s1m: 18px;
        --fs-s2p: 21px;
        --fs-lt: 23px;
        --fs-lp: 17px;
        --fs-dt: 36px;
        --fs-dp: 18px;

        --r-sec: 21px;
        --r-card: 14px;
        --w-bd: 6px;
    }
}

@media screen and (max-width: 1279px) {
    /*5868*/
    :root {
        --w: 980px;
        --fs-hero: 14px;
        --fs-nav: 26px;
        --fs-s1p: 29px;
        --fs-s1m: 15px;
        --fs-s2p: 16px;
        --fs-lt: 19px;
        --fs-lp: 14px;
        --fs-dt: 29px;
        --fs-dp: 15px;

        --r-sec: 16px;
        --r-card: 12px;
        --w-bd: 5px;
    }
}


@media screen and (max-width: 1024px) {
    /*4311*/
    :root {
        --w: 720px;
        --fs-hero: 10px;
        --fs-nav: 20px;
        --fs-s1p: 21px;
        --fs-s1m: 10px;
        --fs-s2p: 13px;
        --fs-lt: 14px;
        --fs-lp: 10px;
        --fs-dt: 21px;
        --fs-dp: 10px;

        --r-sec: 13px;
        --r-card: 9px;
        --w-bd: 3px;
    }
}

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

    :root {
        --w: 86.98%;
        --fs-hero: 1.25vw;
        --fs-nav: 4.48vw; /*86*/
        --fs-s1p: 3.43vw; /*66*/
        --fs-s1m: 3.9vw; /*75*/
        --fs-s2p: 3.43vw; /*66*/
        --fs-lt: 3.43vw; /*66*/
        --fs-lp: 1.875vw; /*36*/
        --fs-dt: 3.65vw; /*70*/
        --fs-dp: 2.81vw; /*54*/

        --r-sec: 1.56vw; /*30*/
        --r-card: 2.60vw; /*50/40*/

        --w-bd: 0.83vw; /*16*/
    }
}
/* ==================== 全局重置 ==================== */
* {
    box-sizing: border-box;
}

html,
body {
    font-family: -apple-system, BlinkMacSystemFont, "Microsoft YaHei", "PingFang SC", "Segoe UI", sans-serif;
    color: var(--text);
    line-height: 1.6;
    min-height: 100vh;
    font-size: 16px;
    background-color: var(--bg-page-deep);
}

body {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    padding: 0;
    margin: 0;
    background-color: #00299d;
}

a {
    text-decoration: none;
    color: inherit;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
}

::-webkit-scrollbar-thumb {
    background: var(--c-bd);
    border-radius: 4px;
}

img {
    display: block;
    max-width: 100%;
}

.container {
    position: relative;
    z-index: 1;
    width: 100%;
}

/* 页面背景图：独立为底层图层，并加滤镜仅保留蓝色调（不作用于内容元素） */
.container::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background-image: url(./topic-mind-compute-boundary-v1-bg-page.jpg);
    background-size: 100% auto;
    background-repeat: repeat-y;
    background-position: top center;
    filter: grayscale(1) sepia(1) hue-rotate(200deg) saturate(4) opacity(0.2);
}

/* ====================================================================
   顶部 HERO
   ==================================================================== */
.hero {
    position: relative;
    width: 100%;
    aspect-ratio: 1920 / 1080;
}

.hero__bg {
    position: absolute;
    z-index: -1;
    width: 100%;
    aspect-ratio: 1920 / 1080;
    top: 0;
    left: 0;
    background-image: url(./topic-mind-compute-boundary-v1-bg-hero.jpg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center top;
    mask-image: linear-gradient(to bottom, black, black 90%, transparent);
}

.hero__bg::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30%;
    background: linear-gradient(to bottom, transparent, var(--bg-page-deep));
}

.hero__inner {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.hero__org {
    width: var(--w);
    color: var(--c-text);
    font-size: var(--fs-hero);
    margin-bottom: 7%;
    display: flex;
    justify-content: center;
    gap: 1.8%;
}

.hero-item {
    flex: 1;
    aspect-ratio: 507 / 37;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.18);
    line-height: 1.2;
    border-radius: 2em;
    letter-spacing: 0.05em;
    backdrop-filter: blur(1px);
}

/* ====================================================================
   主导航（桌面端）
   ==================================================================== */
.nav-wrap {
    width: 100%;
    position: absolute;
    transform: translateY(-50%);
}

.nav {
    width: var(--w);
    max-width: var(--w);
    margin: 0 auto;
    aspect-ratio: 1670 / 132;
    font-size: var(--fs-nav);
    font-weight: 700;
    line-height: 1;
    color: var(--c-text);
}

.nav__inner {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1% 3.6%;
    box-sizing: border-box;
    gap: 3.6%;
    border-radius: var(--r-sec);
    border: 2px solid var(--c-bd);
    box-shadow: var(--c-glow);
    position: relative;
}
.nav__inner__bg {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}
.cube_b {
    display: block;
    background-color: rgb(58 141 255 / 60%);
    box-shadow: 0 0 0.5vw rgba(255, 255, 255, 0.8);
    border: 2px solid var(--c-bd);
    width: 3.23%;
    aspect-ratio: 1;
    border-radius: 20%;
    position: absolute;
}
.cube_b:nth-child(1) {
    top: 0;
    left: 0;
    transform: translateX(-20%) translateY(-120%);
}
.cube_b:nth-child(2) {
    top: 0;
    left: 0;
    transform: translateX(-120%) translateY(-20%) scale(0.80);
}
.cube_b:nth-child(3) {
    bottom: 0;
    right: 0;
    transform: translateX(20%) translateY(120%);
}
.cube_b:nth-child(4) {
    bottom: 0;
    right: 0;
    transform: translateX(120%) translateY(20%) scale(0.80);
}
.cube_y {
    display: block;
    background-color: #eaff7a;
    width: 2.15%;
    aspect-ratio: 1;
    border-radius: 20%;
    position: absolute;
}
.cube_y:nth-child(5) {
    top: 0;
    left: 0;
    transform: translateX(60%) translateY(-152%);
}
.cube_y:nth-child(6) {
    top: 0;
    left: 0;
    transform: translateX(-100%) translateY(-70%) scale(0.80);
}
.cube_y:nth-child(7) {
    bottom: 0;
    right: 0;
    transform: translateX(-60%) translateY(152%);
}
.cube_y:nth-child(8) {
    bottom: 0;
    right: 0;
    transform: translateX(100%) translateY(70%) scale(0.80);
}
.cube_y:nth-child(9) {
    bottom: 0;
    left: 9.0%;
    transform: translateY(52%) scale(0.80);
}
.cube_y:nth-child(10) {
    bottom: 0;
    left: 9.0%;
    transform: translateX(80%) translateY(160%) scale(0.60);
}

.cube_y:nth-child(11) {
    top: 0;
    right: 9.0%;
    transform: translateY(-52%) scale(0.60);
}
.cube_y:nth-child(12) {
    top: 0;
    right: 9.0%;
    transform: translateX(60%) translateY(-120%) scale(0.60);
}

.nav__item {
    flex: 2;
    height: 100%;
    transition: var(--tr);
    position: relative;
    color: var(--c-text);
    letter-spacing: 0.05em;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    cursor: pointer;
    text-shadow: 0 0 0.2em rgba(255, 255, 255, 0.8), 0 0 0.4em rgba(79, 195, 247, 0.6), 0 0 0.8em rgba(79, 195, 247, 0.3);
}
.nav__item:first-child{
    flex: 1;
}
.nav__item span {
    opacity: 0;
}

.nav__item:nth-child(1) { background-image: url(./topic-mind-compute-boundary-v1-bg-nav-0.png); }
.nav__item:nth-child(2) { background-image: url(./topic-mind-compute-boundary-v1-bg-nav-1.png); }
.nav__item:nth-child(3) { background-image: url(./topic-mind-compute-boundary-v1-bg-nav-2.png); }
.nav__item:nth-child(4) { background-image: url(./topic-mind-compute-boundary-v1-bg-nav-3.png); }
.nav__item:nth-child(5) { background-image: url(./topic-mind-compute-boundary-v1-bg-nav-4.png); }

.nav__item:hover {
    color: #fff;
    text-shadow: 0 0 0.5em var(--c-bd);
    transform: translateY(-2px);
}

.nav__item.is-active {
    color: #fff;
    text-shadow: 0 0 0.25em rgba(255, 255, 255, 0.9), 0 0 0.40em rgba(79, 195, 247, 0.7), 0 0 0.8em rgba(79, 195, 247, 0.4);
}

.nav__item.is-active::after {
    content: '';
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: -10px;
    height: 3px;
    border-radius: 2px;
    /*background: linear-gradient(90deg, transparent, var(--c-bd), transparent);*/
    box-shadow: 0 0 10px rgba(79, 195, 247, 0.1);
}

/* ====================================================================
   小屏导航 sticky 浮动按钮
   ==================================================================== */
.nav-m-wrap {
    display: none;
    position: sticky;
    top: 6.51vw;
    left: 0;
    width: 100%;
    z-index: 9999;
    pointer-events: none;
    padding: 0 6.51%;
}

.nav-m {
    position: absolute;
    pointer-events: auto;
    height: 0;
}

.nav-m__toggle {
    width: 9.64vw;
    aspect-ratio: 185 / 170;
    min-width: 46px;
    min-height: 42px;
    padding: 0;
    background-color: transparent;
    border: 0px solid var(--c-dark);
    border-radius: 12px;
    /*box-shadow: 0 0 12px rgba(255, 255, 255, 0.5), 0 0 24px rgba(203, 235, 250, 0.25);*/
    cursor: pointer;
    position: relative;
    transition: var(--tr);
    padding: 0;
    /*background-color: rgba(11, 30, 70, 0.7);*/
    background-image: url(./topic-mind-compute-boundary-v1-bg-nav-icon.png);
    background-size: 100% 100%;
}

.nav-m__toggle:hover {
    /*box-shadow: 0 0 20px rgba(79, 195, 247, 0.8);*/
    transform: translateY(-1px);
}

.nav-m__toggle::before,
.nav-m__toggle::after,
.nav-m__toggle span {
    content: '';
    position: absolute;
    display: block;
    opacity: 0;
    left: 50%;
    width: 60%;
    height: 2px;
    background: var(--c-text);
    border-radius: 2px;
    transform: translateX(-50%);
    transition: var(--tr);
}

.nav-m__toggle::before {
    top: 25%;
}

.nav-m__toggle::after {
    bottom: 25%;
}

.nav-m__toggle span {
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.nav-m__toggle.is-open::before {
    top: 50%;
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
}

.nav-m__toggle.is-open::after {
    bottom: 50%;
    transform: translateX(-50%) translateY(50%) rotate(-45deg);
}

.nav-m__toggle.is-open span {
    opacity: 0;
}

.nav-m__panel {
    position: absolute;
    top: 10vw;
    left: 0;
    width: 31.25vw;
    display: flex;
    flex-direction: column;
    gap: 0.5vw;
    transform: translateY(-12px);
    opacity: 0;
    pointer-events: none;
    transition: var(--tr);
    z-index: 199;
}

.nav-m__panel.is-open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

.nav-m__item {
    width: 100%;
    aspect-ratio: 600 / 175;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--c-dark);
    font-size: var(--fs-nav);
    transition: var(--tr);
    letter-spacing: 0.02em;
    border: 0px solid var(--c-text);
    /*background: rgba(16, 21, 69, 0.65);*/
    /*box-shadow: 0 0 10px rgba(129, 209, 247, 0.6);*/
    background-image: url(./topic-mind-compute-boundary-v1-bg-nav-item.png);
    background-size: 100% 100%;
}

.nav-m__item span {
    display: flex;
    align-items: center;
    justify-content: left;
    width: 92%;
    aspect-ratio: 552 / 163;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
    padding-bottom: 4.5%;
    padding-left: 6.34%;
    box-sizing: border-box;
}

.nav-m__item:hover,
.nav-m__item.is-active {
    border-color: var(--bd-c);
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
    /*background: rgba(79, 195, 247, 0.15);*/
}

/* ====================================================================
   主内容容器
   ==================================================================== */
main {
    width: 100%;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

/* ====================================================================
   主体卡片外壳（深蓝矩形容器）
   ==================================================================== */
.rect {
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    position: relative;
}

/* ====================================================================
   一级栏目标题区
   ==================================================================== */
.sec-title, .sec-title-list {
    width: 100%;
    aspect-ratio: 1670 / 140;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    container-type: size;
    z-index: 3;
}



.section:nth-child(2n) .sec-title {
    transform: rotateY(180deg);
}

.section:first-child .sec-title {
    margin-top: 14.37%;
    margin-bottom: 3.35%;
}
.section:last-child .sec-title {
    margin-top: 19.76%;
    margin-bottom: 4.79%;
}
.sec-title-list {
    margin-top: 16.16%;
    margin-bottom: 4.19%;
}
.section:nth-child(2n) .sec-title__text{
    transform: rotateY(180deg);
}
.section:nth-child(2) .sec-title::before, .section:nth-child(2) .sec-title::after {
    background-image: url(./topic-mind-compute-boundary-v1-bg-star-s2.png);
}
.section:nth-child(3) .sec-title::before, .section:nth-child(3) .sec-title::after {
    background-image: url(./topic-mind-compute-boundary-v1-bg-star-s3.png);
}
.section:nth-child(4) .sec-title::before, .section:nth-child(4) .sec-title::after {
    background-image: url(./topic-mind-compute-boundary-v1-bg-star-s4.png);
}

.sec-title__text {
    width: 31.55%;
    max-width: 530px;
    aspect-ratio: 527 / 140;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--tr);
}
.sec-title__text:hover {
    transform: translateY(-4px);
}
.sec-title__text img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* 装饰星点(标题左右两个发光点) */
.sec-title::before,
.sec-title::after,
.sec-title-list::before,
.sec-title-list::after {
    content: '';
    display: block;
    position: relative;
    width: 24.43%;
    aspect-ratio: 408 / 530;
    background-image: url(./topic-mind-compute-boundary-v1-bg-star-s1.png);
    background-size: 100% 100%;
    pointer-events: none;
}

.sec-title::before,
.sec-title-list::before {
    transform: translateX(34.0%) translateY(15%) scale(0.5);
}

.sec-title::after,
.sec-title-list::after {
    transform: translateX(-34.0%) translateY(-15%);
}

/* ====================================================================
   板块主容器（圆角矩形框 + 深蓝渐变）
   ==================================================================== */
.section {
    width: var(--w);
    max-width: var(--w);
    margin: 0 auto;
    box-sizing: border-box;
    position: relative;
}

.section__rect {
    width: 100%;
    aspect-ratio: 1670 / 973;
    z-index: 1;
}
.section__rect_2 {
    width: 100%;
    aspect-ratio: 1670 / 977;
    z-index: 1;
}

.section__rect_3 {
    width: 100%;
    aspect-ratio: 1670 / 712;
    z-index: 1;
}
.section__rect_4 {
    width: 100%;
    aspect-ratio: 1670 / 1086;
    z-index: 1;
    padding: 2px;
    box-sizing: border-box;
    position: relative;
    filter: drop-shadow(0 0 0.8vw rgba(255, 255, 255, 0.9));
    -webkit-filter: drop-shadow(0 0 0.8vw rgba(255, 255, 255, 0.9));
}
.section__rect_4::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom:0;
    background-color: rgba(255, 255, 255, 0.8);
    clip-path: url(#shapeClipS4);
    -webkit-clip-path: url(#shapeClipS4);
    /*background-image: url(./topic-mind-compute-boundary-v1-bg-s4-rect.png);*/
    background-size: 100% 100%;
}
.section:last-child::after {
    content: '';
    display: block;
    position: relative;
    width: 100%;
    aspect-ratio: 1670 / 600;
}
.carousel__card__inner {
    width: 100%;
    height: 100%;
    padding-top: 3.35%;
    padding-left: 4.67%;;
    padding-right: 4.67%;;
    box-sizing: border-box;
}
.section__rect_4 .carousel__stage {
    overflow: visible;
    clip-path: url(#shapeClipS4Inner);
    -webkit-clip-path: url(#shapeClipS4Inner);
    box-shadow: var(--c-glow);
    background-color: rgba(16, 13, 165, 0.918);
}

.section__rect_4 .carousel__card-overlay {
    aspect-ratio: 1670 / 60;
    overflow: hidden;
    pointer-events: none;
}
.section__rect_4 .carousel__card-media {
    width: 100%;
    position: relative;
    aspect-ratio: 1514 / 852;
    border-radius: var(--r-card);
    border: 2px solid #FFFFFF;
    filter: drop-shadow(0 0 0.2vw rgba(255, 255, 255, 0.9));
    -webkit-filter: drop-shadow(0 0 0.2vw rgba(255, 255, 255, 0.9));
}
.bg-line {
    width: 50%;
    border-radius: 60px;
    aspect-ratio: 835 / 27;
    background-color: var(--c-bg-btn);
}
.section__rect_4 .carousel__dots {
    width: 100%;
    left: 0;
    bottom: 9.2%;
}
/* 角落黄色装饰光点 */


/* ====================================================================
   列表/详情页：主体内容区域为固定比例(1670:2682)的容器
   - 右侧滚动条（页面级 + 容器内）：轨道为发光线条，滑块为发光圆点
   ==================================================================== */

   /* 页面级滚动条（Firefox） */
body.tpl-list,
body.tpl-detail {
    scrollbar-width: thin;
    scrollbar-color: var(--c-bd) transparent;
}

body.tpl-list .section__rect,
body.tpl-detail .section__rect {
    aspect-ratio: 1670 / 2682;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: start;
    scrollbar-width: thin;
    scrollbar-color: var(--c-bg-btn) transparent;
    background-image: url(./topic-mind-compute-boundary-v1-bg-list-rect-s.png);
    background-size: 100% 100%;
    padding-top: 5.98%;
    box-sizing: border-box;
    container-type: size;
    position: relative;
}

/* 详情页面板：叠加更深的蓝半透明底色，使文章在浅亮背景上更易读；
   border-radius 与面板底图圆角一致，避免透明四角露出方角色块 */
body.tpl-detail .section__rect {
    background-color: rgba(1, 8, 34, 0.02);
    background-image: url(./topic-mind-compute-boundary-v1-bg-list-rect-d.png);
    border-radius: 24px;
}

.section__rect__list_inner {
    width: 90.42%;
    aspect-ratio: 1510 / 2400;
    padding-right: 6.58%;
    overflow-y: auto;
}
.section__rect__list_inner::-webkit-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: var(--c-bg-btn) var(--c-bd);
    width: 8px;
    background-color: var(--c-bd);;
}

/* 发光线条轨道 */
body.tpl-list .section__rect__list_inner::-webkit-scrollbar,
body.tpl-detail .section__rect__list_inner::-webkit-scrollbar,
body.tpl-list::-webkit-scrollbar,
body.tpl-detail::-webkit-scrollbar {
    width: 8px;
}
body.tpl-list .section__rect__list_inner::-webkit-scrollbar-track,
body.tpl-detail .section__rect__list_inner::-webkit-scrollbar-track,
body.tpl-list::-webkit-scrollbar-track,
body.tpl-detail::-webkit-scrollbar-track {
    background-color: rgba(79, 195, 247, 0.05);
    background-image: linear-gradient(90deg,
        transparent calc(50% - 1px),
        rgba(79, 195, 247, 0.35) 50%,
        transparent calc(50% + 1px));
    border-radius: 8px;
}
/* 发光圆点滑块 */
body.tpl-list .section__rect::-webkit-scrollbar-thumb,
body.tpl-detail .section__rect::-webkit-scrollbar-thumb,
body.tpl-list::-webkit-scrollbar-thumb,
body.tpl-detail::-webkit-scrollbar-thumb {
    width: 16px;
    min-height: 20px;
    border-radius: 50%;
    border: 4px solid transparent;
    background-clip: padding-box;
    background-image: radial-gradient(circle at 50% 50%,
        #eaf8ff 0%,
        var(--c-bd) 45%,
        rgba(79, 195, 247, 0.12) 100%);
    box-shadow: 0 0 10px var(--c-bd), 0 0 20px rgba(79, 195, 247, 0.55);
}
body.tpl-list .section__rect::-webkit-scrollbar-thumb:hover,
body.tpl-detail .section__rect::-webkit-scrollbar-thumb:hover,
body.tpl-list::-webkit-scrollbar-thumb:hover,
body.tpl-detail::-webkit-scrollbar-thumb:hover {
    box-shadow: 0 0 14px var(--c-bd), 0 0 28px rgba(79, 195, 247, 0.8);
}



/* ====================================================================
   栏目1&4：轮播卡片组（单大卡片轮播）
   ==================================================================== */
   
.carousel {
    width: 100%;
    height: 100%;
    position: relative;
    /*opacity: 0;*/
}
.section__rect_1 .carousel__stage .carousel__card-media {
    overflow: visible;
    clip-path: url(#shapeClipInner);
    -webkit-clip-path: url(#shapeClipInner);
    box-shadow: var(--c-glow);
}
.carousel__stage {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.section__rect_1 {
    position: relative;
    width: 100%;
    aspect-ratio: 1670 / 973;
    z-index: 1;
    padding: 2px;
    box-sizing: border-box;
    /* clip-path 会裁掉同元素上的 filter 外发光，二者不能同层；
       故本层只做 drop-shadow 发光，白色异形面板改到 ::before 上裁剪 */
    filter: drop-shadow(0 0 0.8vw rgba(255, 255, 255, 0.9));
    -webkit-filter: drop-shadow(0 0 0.8vw rgba(255, 255, 255, 0.9));
}
/* 白色异形面板：clip-path 裁剪形状，垫在内容之下 */
.section__rect_1::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    background-color: rgba(255, 255, 255, 1.0);
    clip-path: url(#shapeClip);
    -webkit-clip-path: url(#shapeClip);
    pointer-events: none;
}

.carousel__stage img {
    opacity: 1;
}

/* Cold3D 式卡片：绝对铺满舞台，用 CSS 变量 --tx/--ty/--tz/--ry/--sc/--op/--zi 定位 */
.carousel__card {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: pointer;
    text-decoration: none;
    color: var(--c-text);
    /*background: linear-gradient(135deg, rgba(11, 28, 64, 0.8), rgba(20, 50, 110, 0.8));*/
    /*box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);*/
    transform: translate3d(var(--tx, 0), var(--ty, 0), var(--tz, 0)) rotateY(var(--ry, 0deg)) scale(var(--sc, 1));
    transition: transform 0.8s cubic-bezier(.4, 0, .2, 1), opacity 0.8s ease;
    opacity: var(--op, 0);
    z-index: var(--zi, 1);
    pointer-events: var(--pe, none);
}

.carousel__card.is-active {
    pointer-events: auto;
    opacity: 1;
    z-index: 3;
}

.carousel__card-media {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.carousel__card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.carousel__card:hover .carousel__card-media img {
    transform: scale(1.05);
}

.carousel__card-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    aspect-ratio: 1670 / 190;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    /*background: linear-gradient(0deg, rgba(0, 8, 30, 0.95) 0%, rgba(0, 8, 30, 0.6) 60%, transparent 100%);*/
    color: var(--c-text);
}

.carousel__card-title {
    width: 42.75%;
    aspect-ratio: 714 / 102;
    font-size: var(--fs-s1p);
    color: var(--c-dark);
    line-height: 1.0;
    border-radius: var(--fs-s1p);
    font-weight: 500;
    letter-spacing: 0.06em;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background-color: var(--c-bg-btn);
    padding: 0 0.5em;
    /*text-shadow: 0 0 12px rgba(79, 195, 247, 0.5);*/
}
.carousel__card-title>div {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.mobile-show {
    display: none;
}

/* 左右切换按钮 */
.carousel__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 5.2vw;
    aspect-ratio: 1/1;
    max-width: 100px;
    border-radius: 50%;
    border: none;
    outline: none;
    background-color: rgba(255, 255, 255, 0.15);
    border: var(--w-bd) solid var(--c-bg-btn);
    
    /*background-image: url(./topic-mind-compute-boundary-v1-bg-arrow-r.png);*/
    background-size: 100% 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--tr);
    color: transparent;
    font-size: 1.4em;
    padding: 0;
}
.carousel__arrow::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40%;
    height: 40%;
    transform: translateX(-50%) translateY(-50%) rotate(225deg);
    border: var(--w-bd) solid var(--c-bg-btn);
    border-top-width: 0;
    border-right-width: 0;
}
.carousel__arrow::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50%;
    height: var(--w-bd);
    transform: translateX(-50%) translateY(-50%);
    background-color: var(--c-bg-btn);
}

.carousel__arrow:hover {
    /*background-color: rgba(79, 195, 247, 0.4);*/
    box-shadow: var(--c-glow);
}

.carousel__arrow--prev {
    left: 1%;
    transform: translateY(-50%) rotateY(180deg) ;
}

.carousel__arrow--next {
    right: 1%;
}

/* 圆点指示器 */
.carousel__dots {
    position: absolute;
    bottom: 2%;
    left: 50%;
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8vw;
    z-index: 5;
    user-select: none;
}

.carousel__dot {
    height: 1.56vw;
    max-height: 30px;
    aspect-ratio: 1 / 1;
    border-radius: 1.56vw;
    background: transparent;
    border: 1px solid var(--c-bd);
    cursor: pointer;
    transition: var(--tr);
}

.carousel__dot:hover{
    background: var(--c-bd);
    box-shadow: var(--c-glow);
}
.carousel__dot.is-active {
    aspect-ratio: 4 / 1;
    background: var(--c-bd);
    box-shadow: var(--c-glow);
}

/* 底部 "查看更多" 按钮 */
.see-more {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2.39%;
    gap: 1vw;
}

.section:nth-child(3) .see-more {
    margin-top: 2.99%;
}

.see-more::before,
.see-more::after {
    content: '';
    display: block;
    width: 1.55%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background-color: var(--c-bd);
    box-shadow: var(--c-glow);
}

.see-more__line {
    flex: 1;
    height: 2px;
    background-color: var(--c-bd);
    box-shadow: var(--c-glow);
}

.see-more__btn {
    width: 15.09%;
    aspect-ratio: 252 / 70;
    border-radius: 999px;
    background-color: var(--c-bd);
    box-shadow: var(--c-glow);
    color: var(--c-dark);
    font-size: var(--fs-s1m);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    transition: var(--tr);
    cursor: pointer;
    letter-spacing: 0.3em;
    text-decoration: none;
}

.arrow-tr {
    --w: 2px;
    width: 20%;
    aspect-ratio: 1 / 1;
    border: var(--w) solid #000000;
    box-sizing: border-box;
    border-radius: 50%;
    position: relative;
    color: var(--c-bd);
    transform: rotate(-45deg);
}
.arrow-tr::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40%;
    height: 40%;
    transform: translateX(-50%) translateY(-50%) rotate(225deg);
    border: var(--w) solid #000000;
    border-top-width: 0;
    border-right-width: 0;
}
.arrow-tr::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 51%;
    height: var(--w);
    transform: translateX(-50%) translateY(-50%);
    background-color: #000000;
}

.see-more__btn:hover {
    background: rgba(79, 195, 247, 0.25);
    box-shadow: var(--c-glow);
    transform: translateY(-2px);
}

/* ====================================================================
   栏目2&3：网格卡片组
   ==================================================================== */
.grid-section {
    width: 100%;
    display: grid;
    gap: 2vw;
}

.section:nth-child(2) .sec-title {
    margin-top: 16.76%; /*280*/
    margin-bottom: 4.19%; /*70*/
}
.section:nth-child(3) .sec-title {
    margin-top: 14.97%; /*250*/
    margin-bottom: 4.19%; /*70*/
}


.grid-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* 栏目二：宽屏每行4列竖向卡片 */
.grid-qa {
    grid-template-columns: repeat(3, 1fr);
}

.grid-card {
    width: 100%;
    aspect-ratio: 387 / 712;
    position: relative;
    cursor: pointer;
    transition: var(--tr);
    text-decoration: none;
    color: var(--c-text);
    display: block;
    
}
.grid__card__inner {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    row-gap: 4.13%;;
}
.grid-card:nth-child(2n) .grid__card__inner {
    flex-direction: column-reverse;
}

.grid-card:hover {
    transform: translateY(-4px);
    /*box-shadow: 0 8px 24px rgba(79, 195, 247, 0.4);*/
}

.grid-card__media {
    width: 100%;
    aspect-ratio: 387 / 573;
    position: relative;
    padding: 1px;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: calc(var(--r-sec) * 1.2);
    filter: drop-shadow(0 0 0.8vw rgba(255, 255, 255, 0.9));
    -webkit-filter: drop-shadow(0 0 0.8vw rgba(255, 255, 255, 0.9));
    display: flex;
    align-items: center;
    justify-content: center;
    
}
.grid-card__media::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(./topic-mind-compute-boundary-v1-bg-s3-card.png);
    background-size: 100% 100%;
    z-index: 2;
    pointer-events: none;
}

.grid-card__media img {
    width: 84.23%;
    aspect-ratio: 326 / 510;
    object-fit: cover;
    transition: transform 0.6s ease;
    border-radius: var(--r-card);
}

.grid-card:hover .grid-card__media img {
    transform: scale(1.01);
}

.grid-card__body {
    position: relative;
    aspect-ratio: 387 / 120;
    inset: 0;
    background-color: var(--c-bg-btn);
    color: var(--c-dark);
    font-size: var(--fs-s2p);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 7%;
    box-sizing: border-box;
    z-index: 2;
    border-radius: 5.6vw;
}

.grid-card__title {
    margin: 0;
    line-height: 1.2;
    font-weight: 500;
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.5);
    letter-spacing: 0.05em;
}

/* ====================================================================
   栏目二：竖向卡片（图片/文本上下结构，按列交替）
   ==================================================================== */

.grid-section.grid-qa {
    column-gap: 2.43%;
}
.vc-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    aspect-ratio: 526 / 462;
    overflow: hidden;
}

.vc__card__inner {
    width: 100%;
    height: 100%;
    /*padding: 0 4.56%;*/
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    background-color: rgba(211, 233, 89, 0.0);
    position: relative;
    border-radius: var(--r-sec);
    filter: drop-shadow(0 0 1.2vw rgba(255, 255, 255, 0.9));
    -webkit-filter: drop-shadow(0 0 1.2vw rgba(255, 255, 255, 0.9));
}


.vc__card__inner::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: url(./topic-mind-compute-boundary-v1-s2-card-frame.png);
    background-size: 100% 100%;
    border-radius: var(--r-sec);
    /*
    background-color: rgba(255, 255, 255, 0.9);
    clip-path: url(#shapeClipS2);
    -webkit-clip-path: url(#shapeClipS2);
    */
    pointer-events: none;
    z-index: -1;
}

.grid-qa .vc-card__body {
    width: 75.47%;
    aspect-ratio: 397 / 107;
    border-radius: max(40px, 5.6vw);
    background-color: var(--c-bg-btn);
    margin: 4.56% auto 0 4.56%;
    display: flex;
    align-items: center;
    filter:none;
    -webkit-filter:none;
}

.vc-card__media {
    width: 90.87%;
    aspect-ratio: 478 / 297;
    overflow: hidden;
    margin: 0 auto;
    border-radius: var(--r-card);
    filter:none;
    -webkit-filter:none;
}


.vc-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.vc-card:hover .vc-card__media img {
    transform: scale(1.06);
}

.vc-card__title {
    margin: 0;
    font-size: var(--fs-s2p);
    line-height: 1.2;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: var(--c-dark);
    overflow: hidden;
    padding: 0 1.4em;
}
.vc-card__title>div {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.carousel__card_play {
    width: 11.0%;
    aspect-ratio: 185 / 185;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(0, 0, 0, 0.40);
    border-radius: 50%;
    cursor: pointer;
    container-type: size;
    display: flex;
    align-items: center;
    justify-content: center;
}
.carousel__card_play:hover{
    background-color: rgba(0, 0, 0, 0.60);
    box-shadow: var(--c-glow);
}
.carousel__card_play::before {
    content: '';
    position: relative;
    width:0;
    height: 0;
    aspect-ratio: 120 / 90;
    border-top: 30cqh solid transparent;
    border-right: 37cqw solid transparent;
    border-bottom: 30cqw solid transparent;
    border-left: 37cqw solid #eaff7a;
    transform: translateX(29%);
}

/* ====================================================================
   列表页：卡片网格 + 横向卡片
   ==================================================================== */


.list__bottom_line {
    position: absolute;
    bottom: 0;
    left: 0; 
    width: 50%;
    aspect-ratio: 1670 / 60;
    border-radius: 10vw;
    background-color: var(--c-bg-btn);
    transform: translateY(-50%);
}
.list-grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 5%;
    row-gap: 7.2cqw;
    padding: 0;
}

.list-card {
    width: 100%;
    aspect-ratio: 660 / 500;
    overflow: hidden;
    /*background: linear-gradient(135deg, rgba(11, 28, 64, 0.85), rgba(20, 50, 110, 0.85));*/
    /*border: 2px solid var(--c-bd);*/
    transition: var(--tr);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: var(--c-text);
    /*box-shadow: 0 0 16px rgba(79, 195, 247, 0.18);*/
    text-decoration: none;
}

.list-card:hover {
    transform: translateY(-4px);
    /*box-shadow: 0 0 32px rgba(79, 195, 247, 0.4), 0 6px 18px rgba(0, 0, 0, 0.4);*/
}

.list-card__media {
    width: 100%;
    aspect-ratio: 660 / 409;
    overflow: hidden;
    flex-shrink: 0;
    border-radius: var(--r-sec);
}

.list-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.list-card:hover .list-card__media img {
    transform: scale(1.06);
}

.list-card__body {
    width: 100%;
    aspect-ratio: 660 / 74;
    background-color: var(--c-bg-btn);
    border-radius: 5cqw;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    font-size: var(--fs-lp);
    padding: 0 1em;
}

.list-card__title {
    margin: 0;
    font-size: var(--fs-lt);
    line-height: 1.3;
    font-weight: 500;
    color: var(--c-dark);
    letter-spacing: 0.05em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.list-card__desc {
    margin: 0;
    font-size: var(--fs-lp);
    color: var(--c-dark);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: none;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* ====================================================================
   列表 - 翻页器
   ==================================================================== */
.list-pager {
    margin-top: 2.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5vw;
}

.list-pager__btn {
    width: 2.6vw;
    height: 2.6vw;
    min-width: 36px;
    min-height: 36px;
    border-radius: 50%;
    border: 2px solid var(--c-bd);
    background: rgba(8, 30, 80, 0.6);
    color: var(--c-bd);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--tr);
    padding: 0;
    font-size: 1.1em;
}

.list-pager__btn:hover {
    background: rgba(79, 195, 247, 0.25);
    box-shadow: var(--c-glow);
    color: #fff;
}

.list-pager__btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.list-pager__info {
    font-size: 1.05em;
    color: var(--c-text);
    letter-spacing: 0.1em;
    min-width: 5em;
    text-align: center;
    text-shadow: 0 0 8px rgba(79, 195, 247, 0.5);
}

.list-pager__info .current {
    color: var(--c-bd);
    font-size: 1.0em;
    font-weight: 700;
}

/* ====================================================================
   详情页（与 list 共用同一外壳：hero / nav / 1670:2682 圆角矩形 / footer）
   内层替换为图文文章信息：标题 → 正文 → 大图 → 正文 → 返回
   ==================================================================== */
.article {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 3vw 0;
    box-sizing: border-box;
    color: var(--c-text);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.article__title {
    width: 100%;
    text-align: center;
    font-size: var(--fs-dt);
    color: var(--c-text);
    margin: 0.2em 0 1em;
    letter-spacing: 0.08em;
    font-weight: 500;
    text-shadow: 0 0 12px rgba(79, 195, 247, 0.35);
}

.article__paragraph {
    width: 100%;
    max-width: 1140px;
    font-size: var(--fs-dp);
    line-height: 2;
    letter-spacing: 0.05em;
    text-align: justify;
    margin: 1.2em 0;
    color: var(--c-text);
}

.article__paragraph p {
    margin: 0 0 0.9em;
}

/* 主图：居中、1142:708 比例（约占整宽 68%）、大圆角、白边 + 发光，与列表卡片视觉一致 */
.article__figure {
    width: 82%;
    max-width: 1142px;
    aspect-ratio: 1142 / 708;
    margin: 2.4em auto;
    padding: 0;
    box-sizing: border-box;
    border: 2px solid var(--c-bd);
    border-radius: var(--r-sec);
    overflow: hidden;
    position: relative;
    filter: drop-shadow(0 0 0.6vw rgba(255, 255, 255, 0.6));
    -webkit-filter: drop-shadow(0 0 0.6vw rgba(255, 255, 255, 0.6));
}

.article__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.article__back {
    display: inline-flex;
    align-items: center;
    gap: 0.7em;
    align-self: center;
    margin: 2.5em 0 0;
    padding: 0.7em 1.8em;
    font-size: 1em;
    color: var(--c-text);
    letter-spacing: 0.18em;
    border: 1px solid rgba(79, 195, 247, 0.6);
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(79, 195, 247, 0.12), rgba(79, 195, 247, 0.04));
    transition: var(--tr);
    cursor: pointer;
    text-decoration: none;
}

.article__back-arrow {
    display: inline-block;
    width: 0.55em;
    height: 0.55em;
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(2px);
}

.article__back:hover {
    background: rgba(79, 195, 247, 0.25);
    box-shadow: var(--c-glow);
    transform: translateX(-2px);
}

/* ====================================================================
   页脚（桌面端）
   ==================================================================== */
.footer {
    width: 100%;
    aspect-ratio: 1920 / 175;
    min-height: 120px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.88), rgba(0, 0, 0, 0.99));
    color: var(--c-text);
    box-shadow: 0 -4px 24px rgba(79, 195, 247, 0.18);
    position: relative;
}

.footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--c-accent), transparent);
}

.footer__inner {
    width: 90%;
    height: 100%;
    max-width: var(--w);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 1.5vw;
}

.footer__left,
.footer__right {
    width: 14%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.6vw;
}

.footer__left img {
    max-width: 100%;
    max-height: 60px;
}

.footer__right img {
    width: auto;
    height: 3.33vw;
    max-height: 64px;
}

.footer__col {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 0.85em;
    line-height: 1.6;
    flex: 1;
    text-align: center;
}

.footer__col ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4vw;
}

.footer__col li {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}

.footer__col a {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    color: rgba(255, 255, 255, 0.85);
    transition: var(--tr);
}

.footer__col a:hover {
    color: #fff;
}

.footer__col li > span {
    color: rgba(255, 255, 255, 0.5);
}

.beian {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: middle;
    margin-right: 0.3em;
}

/* ====================================================================
   动画
   ==================================================================== */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

.grid-card {
    animation: float 6s ease-in-out infinite;
}

.grid-card:nth-child(2),
.list-card:nth-child(2) {
    animation-delay: -2s;
}

.grid-card:nth-child(3) {
    animation-delay: -4s;
}

.grid-card:nth-child(4) {
    animation-delay: -3s;
}

.grid-card:nth-child(5) {
    animation-delay: -5s;
}

.grid-card:nth-child(6) {
    animation-delay: -1s;
}

@media (prefers-reduced-motion: reduce) {
    .grid-card,
    .list-card {
        animation: none;
    }
    * {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

/* ====================================================================
   响应式
   ==================================================================== */


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

    body {
        font-size: 14px;
        background-color: #0c2ec6;
    }

    /* hero */
    .hero {
        aspect-ratio: 1920 / 1763;
    }

    .hero__bg {
        background-image: url(./topic-mind-compute-boundary-v1-bg-hero-m.jpg);
        aspect-ratio: 1 / 1;
        mask-image: linear-gradient(to bottom, black, black 88%, transparent 99% ,transparent);
    }

    .hero__org {
        width: 30%;
        margin-bottom: 7%;
        gap: 0.4vw;
        flex-direction: column;
    }

    .hero-item {
        height: 3em;
        border-radius: 20px;
    }

    /* 导航 */
    .nav-wrap {
        display: none;
    }
    .nav-m-wrap {
        display: block;
    }

    /* 标题 */
    .sec-title {
        padding: 6vw 0;
    }
    .section:first-child .sec-title {
        margin-top: 14.37%;
        margin-bottom: 3.35%;
    }
    .section:last-child .sec-title {
        margin-top: 21.37%;
        margin-bottom: 3.35%;
    }


    .sec-title__text {
        width: 60%;
        aspect-ratio: 527 / 140;
        max-width: 320px;
    }
    .sec-title::before{
        transform: translateX(45.0%) translateY(18%) scale(0.6);
    }
    .sec-title::after{
        transform: translateX(-34.0%) translateY(-18%);
    }
    .see-more {
        margin-top: 7.78%;
    }
    .section:nth-child(3) .see-more {
        margin-top: 9.58%;
    }
    .section:nth-child(3) .grid-4 {
        grid-template-columns: repeat(2, 1fr);
        
    }
    .section:nth-child(3) .grid-section {
        row-gap: 7.55vw;
        column-gap: 7.55vw;
    }

    .see-more__btn {
        width: 36.58%;
        aspect-ratio: 611 / 166;
    }

    /* 板块 */
    .section__rect_1 {
        aspect-ratio: 1670 / 2514;
    }
    .section__rect_1::before {
        clip-path: url(#shapeClipM);
        -webkit-clip-path: url(#shapeClipM);
    }
    .section__rect_1 .carousel__stage .carousel__card-media {
        overflow: visible;
        clip-path: url(#shapeClipInnerM);
        -webkit-clip-path: url(#shapeClipInnerM);
        box-shadow: var(--c-glow);
    }

    /* 栏目1&4 轮播 */
    .carousel__stage {
        width: 100%;
    }
    .carousel__arrow {
        width: 13.29%;
        aspect-ratio: 1 / 1;
        max-width: 200px;
        max-height: 200px;
    }
    .carousel__card-overlay {
        padding: 0;
        aspect-ratio: 1670 / 340;
    }
    .mobile-show {
        display: inline-block;
    }
    .carousel__card-title {
        width: 50.23%;
        aspect-ratio: 839 / 228;
        overflow: hidden;
        border-radius: 4em;
        padding: 0 1em;
        white-space:unset;
        line-height: 1.2;
    }

    /* 栏目2 3x2 grid → 2x3 也保留2列(2x3=6) */
    .section__rect_2 {
        aspect-ratio: 1670 / 2868;
    }
    .section__rect_3 {
        aspect-ratio: 1670 / 2940;
    }
    .section__rect_4 {
        aspect-ratio: 1670 / 2878;
    }
    .section:nth-child(2) .sec-title {
        margin-top: 22.21%; /*370*/
        margin-bottom: 4.79%; /*80*/
    }
    /* 栏目二竖向卡片：小屏每行2列 */
    .grid-qa {
        grid-template-columns: repeat(2, 1fr);
        gap: 4vw;
    }
    .grid-qa .vc-card:nth-child(n + 5) {
        display: none;
    }
    .vc-card {
        aspect-ratio: 798 / 1369;
    }
    .vc-card__media {
        width: 90.98%;
        aspect-ratio: 726 / 978;
    }
    .grid-qa .vc-card__body {
        width: 75.31%;
        aspect-ratio: 601 / 306;
        border-radius: max(40px, 16vw);
    }
    .vc__card__inner {
        filter: drop-shadow(0 0 2px rgba(255, 255, 255, 0.9));
        -webkit-filter: drop-shadow(0 0 2px rgba(255, 255, 255, 0.9));
    }
    .vc__card__inner::before {
        background-image: url(./topic-mind-compute-boundary-v1-bg-s2-card.png);
    }
    .vc-card__title>div {
        width: 100%;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        border-radius: 0;
    }
    .grid-card {
        aspect-ratio: 755 / 1383;
    }
    .grid-card__body {
        aspect-ratio: 755 / 232;
        border-radius: 12vw;
    }
    .grid-card__media {
        width: 100%;
        aspect-ratio: 755 / 1117;
    }
    .grid-card__media img {
        width: 84.50%;
        aspect-ratio: 638 / 993;
    }
    .section__rect_4 .carousel__card-media {
        aspect-ratio: 1514 / 2513;
    }
    .section__rect_4 .carousel__dots {
        bottom: 4.96%;
    }
    .section__rect_4::before {
        clip-path: url(#shapeClipS4M);
        -webkit-clip-path: url(#shapeClipS4M);
    }
    .section__rect_4 .carousel__stage {
        clip-path: url(#shapeClipS4InnerM);
        -webkit-clip-path: url(#shapeClipS4InnerM);
    }
    .carousel__card_play {
        width: 22.75%;
    }

    /* 列表 */
    .list-grid {
        grid-template-columns: 1fr;
        gap: 4vw;
    }
    .list-card {
        flex-direction: row;
        align-items: stretch;
        aspect-ratio: 1400 / 410;
        align-items: end;
        position: relative;
    }
    .list-card__media {
        width: 47.14%;
        aspect-ratio: 660 / 410;
        z-index: 2;
    }
    .list-card__body {
        width: 62.14%;
        aspect-ratio: 870 / 364;
        position: absolute;
        bottom: 0;
        right: 0;
        z-index: 1;
        align-items: center;
        gap: 1.5cqw;
        padding-left: 15.6%;
        box-sizing: border-box;
        flex-direction: column;
    }
    .list-card__title {
        width: 100%;
    }
    .list-card__title>div {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-align: left;
        gap: 0;
    }
    .list-card__desc {
        width: 100%;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-align: left;
    }

    /* 详情（移动端：与 list 同外壳，内容适配小屏） */
    .article {
        width: 90.42%;
        padding: 8vw 0;
    }
    .article__title {
        margin: 0.2em 0 0.8em;
        letter-spacing: 0.04em;
    }
    .article__paragraph {
        line-height: 1.4;
        margin: 0.8em 0;
        letter-spacing: 0.03em;
    }
    .article__figure {
        width: 100%;
        aspect-ratio: 1303 / 808;
        margin: 2em 0;
        border-radius: 4.5vw;
    }
    .article__back {
        font-size: 3.4vw;
        margin-top: 3em;
        padding: 0.9em 1.8em;
    }

    /* 页脚：移动端隐藏桌面页脚 */
    .footer {
        display: none;
    }

    /* 列表分页 */
    .list-pager__btn {
        width: 9vw;
        height: 9vw;
        min-width: 36px;
        min-height: 36px;
    }
    .list-pager__info {
        font-size: 3.6vw;
    }
}


[hidden]{display:none!important;}
.section__rect_4 .carousel__card_play{z-index:6;text-decoration:none;}
.section__rect_4 .carousel__card_play:focus-visible{outline:3px solid var(--c-bg-btn);outline-offset:4px;}
.list-card__media{position:relative;}
.list-card__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(32px,24%,64px);aspect-ratio:1;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(255,255,255,.8);background:rgba(0,0,0,.48);z-index:3;pointer-events:none;}
.list-card__play::before{content:"";display:block;width:36%;height:46%;background:var(--c-bg-btn);clip-path:polygon(0 0,100% 50%,0 100%);transform:translateX(12%);}

.nav-wrap{z-index:10;}
.trs-css-background-asset-preload{display:none!important;}
.topic-section-empty [class^="section__rect_"]{display:none!important;}
.topic-section-empty .see-more{display:none!important;}
.topic-section-empty:last-child::after{display:none!important;}
.topic-section-empty .sec-title{margin-top:8%!important;margin-bottom:1.5rem!important;}
body.tpl-list .topic-list-empty .section__rect{display:none!important;}
body.tpl-list .topic-list-empty:last-child::after{display:none!important;}
body.tpl-list .topic-list-empty .sec-title-list{margin-bottom:1.5rem!important;}
.topic-empty-state{width:100%;min-height:160px;margin:0 auto 3rem;display:flex;align-items:center;justify-content:center;border-top:1px solid rgba(255,255,255,.55);border-bottom:1px solid rgba(255,255,255,.55);color:rgba(255,255,255,.88);font-size:var(--fs-lp);letter-spacing:0;text-shadow:0 0 10px rgba(79,195,247,.6);}
.hero__inner{width:54%;min-width:450px;max-width:calc(100% - 2rem);align-items:flex-end;padding-bottom:7%;box-sizing:border-box;}
.hero__org{width:100%;margin-bottom:0;display:block;}
.hero-item{width:100%;flex:none;aspect-ratio:662 / 45;box-sizing:border-box;background-color:rgba(10,46,166,.8);border-radius:2.4vw;margin-top:1.2%;}
.hero-item--support{aspect-ratio:auto;min-height:1.5em;padding:.35em 1em;display:grid;grid-template-columns:max-content max-content;align-items:start;justify-content:center;line-height:1.35;text-align:left;white-space:normal;overflow-wrap:normal;}
.hero-item__label,.hero-item__line{white-space:nowrap;}
.hero-item__line{display:block;}
.list-card__meta{display:none;color:var(--c-dark);font-size:var(--fs-lp);line-height:1.25;}
.section__rect_1 .carousel__card-title>div{white-space:normal;}
.vc__card__inner::before{z-index:0;}
.vc__card__inner>*{position:relative;z-index:1;}
.lab-card__title{position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;align-items:center;min-height:15%;padding:.45em 1em;box-sizing:border-box;background:rgba(2,11,37,.82);color:var(--c-text);font-size:var(--fs-s2p);line-height:1.2;pointer-events:none;}
.lab-card__title>div{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* The frame notch rises ~2.2% from the bottom; keep the scroll area above it. */
body.tpl-detail .article{width:90.42%;height:calc(97.5% - clamp(12px,2vw,24px));max-width:none;margin:0;padding:0;display:grid;grid-template-rows:auto minmax(0,1fr);align-items:stretch;gap:clamp(12px,1.2vw,24px);box-sizing:border-box;color:var(--c-text);}
.article__header{width:100%;text-align:center;}
body.tpl-detail .article__title{margin:0;}
.article__meta{display:flex;align-items:center;justify-content:center;gap:2em;margin-top:.65em;color:rgba(255,255,255,.82);font-size:var(--fs-lp);line-height:1.5;letter-spacing:.05em;white-space:nowrap;}
body.tpl-detail .article__scroll{width:100%;height:100%;min-height:0;aspect-ratio:auto;padding-right:0;overflow-y:auto;box-sizing:border-box;}
body.tpl-detail .article__paragraph{width:100%;max-width:none;margin:0;color:var(--c-text);}
body.tpl-detail .article__actions{width:90.42%;margin:clamp(16px,2vw,32px) auto 0;display:flex;align-items:center;justify-content:center;gap:clamp(10px,1.4vw,24px);flex-wrap:wrap;}
body.tpl-detail .article__back{margin:0;}
body.tpl-detail .article__trs-body,body.tpl-detail .article__trs-body *{background-color:transparent!important;color:var(--c-text)!important;font-family:inherit!important;}
body.tpl-detail .article__trs-body{overflow-wrap:anywhere;}
body.tpl-detail .article__trs-body>.wang-editor-content{width:100%!important;max-width:none!important;box-sizing:border-box!important;}
body.tpl-detail .article__trs-body img{max-width:100%!important;height:auto!important;}
/* Only image-only rows are tagged; do not change inline illustrations or galleries. */
body.tpl-detail .article__trs-body .topic-single-image-row{float:none!important;text-align:center!important;text-indent:0!important;margin-left:auto!important;margin-right:auto!important;max-width:100%!important;box-sizing:border-box;}
body.tpl-detail .article__trs-body .topic-single-image-wrap{display:block!important;float:none!important;text-indent:0!important;margin-left:auto!important;margin-right:auto!important;max-width:100%!important;box-sizing:border-box;}
body.tpl-detail .article__trs-body img.topic-single-image{display:block!important;float:none!important;margin-left:auto!important;margin-right:auto!important;}
body.tpl-detail .article__trs-body .topic-single-image-row .imagenote,body.tpl-detail .article__trs-body .topic-single-image-row figcaption{max-width:100%!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box!important;}

body.tpl-detail .article__trs-body a{color:var(--c-bd)!important;text-decoration:underline;}
.footer__col li > .footer__text{display:flex;align-items:center;flex-wrap:wrap;color:rgba(255,255,255,.85);}
.footer__copyright-mark::before{content:"\00a9 ";}
.topic-channel-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
.article__trs-body img{max-width:100%;height:auto;}
/* Video panels follow their actual content, not the long-article aspect ratio. */
body.tpl-detail.topic-video-detail .section__rect{aspect-ratio:auto;height:auto;min-height:0;container-type:normal;padding:clamp(20px,3vw,48px) 0 clamp(32px,4vw,64px);}
body.tpl-detail.topic-video-detail .article{height:auto;grid-template-rows:auto auto;gap:clamp(12px,1.2vw,24px);}
body.tpl-detail.topic-video-detail .article__scroll{height:auto;overflow:visible;display:flex;flex-direction:column;gap:clamp(12px,1.2vw,24px);}
body.tpl-detail.topic-video-detail .article__trs-body:empty{display:none;}
body.tpl-detail.topic-video-detail .article__trs-body>:last-child{margin-bottom:0;}
.article__video{width:100%;height:auto;min-height:0;display:flex;align-items:flex-start;justify-content:center;}
.article__video video{display:block;width:auto;height:auto;max-width:100%;max-height:70vh;max-height:70svh;object-fit:contain;}
@media(min-width:769px){body.tpl-list.topic-list-empty-page main{min-height:calc(100vh - 56.25vw - max(120px,9.1145833333vw));}.section__rect_1 .carousel__card-title{font-size:calc(var(--fs-s1p) * .84);line-height:1.1;padding:.1em .75em;}.list-card__title>div{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.grid-card__title{overflow:hidden;}.grid-card__title>div{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;}}
@media(max-width:768px){.hero{aspect-ratio:1920 / 1763;}.hero__bg{background-image:url(./topic-mind-compute-boundary-v1-bg-hero-m.jpg);aspect-ratio:1 / 1;mask-image:linear-gradient(to bottom,black,black 88%,transparent 99%,transparent);}.hero__inner{width:70%;min-width:0;max-width:none;padding-bottom:22%;}.hero-item{aspect-ratio:925 / 63;}.hero-item.hero-item--support{aspect-ratio:auto;height:auto;}.list-card__desc{display:none!important;}.list-card__meta{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:.15em;text-align:left;overflow:hidden;}.list-card__meta>*{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.grid-card__title{overflow:hidden;}.grid-card__title>div{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;}body.tpl-detail .article{width:90.42%;height:calc(97.5% - clamp(12px,2vw,24px));padding:0;gap:2.5vw;}body.tpl-detail .article__title{font-size:var(--fs-dt);line-height:1.25;}.article__meta{flex-direction:row;flex-wrap:nowrap;gap:.7em;margin-top:.5em;white-space:nowrap;}.article__meta>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.article__meta>time{flex:0 0 auto;white-space:nowrap;}.article__actions{padding-bottom:1vw;}body.tpl-detail .article__actions{flex-wrap:nowrap;gap:2vw;}body.tpl-detail .article__actions .article__back{flex:1 1 0;min-width:0;justify-content:center;gap:.35em;font-size:clamp(12px,3vw,16px);letter-spacing:.05em;padding:.65em .4em;white-space:nowrap;}body.tpl-detail .article__scroll{padding-right:0;}.topic-empty-state{min-height:112px;margin-bottom:2rem;}}