/* ============================================================
   responsive.css · v3.0
   ------------------------------------------------------------
   所有 @media 查询集中放这里，与 style.css 解耦。
   顺序：先桌面（桌面专属布局） → 平板 → 移动 → 极小屏 → 偏好
   ============================================================ */

/* ==================== 桌面端 · 专属布局（≥1025px） ==================== */

/* ——— L1004-1338 ——— */
@media (min-width: 1025px) {
    /* v3.1 · 首屏品牌字 + meta 共享对齐偏移
       · 4vw ≈ 在 1240px 视口 = 49.6px，在 1920px = 76.8px
       · clamp 加安全边界：最小 48px（窄桌面兜底），最大 88px（超宽屏不溢出） */
    :root {
        --hero-shift: clamp(48px, 4vw, 88px);
    }
    /* ====== Carousel 容器 ====== */
    .section-projects .project-carousel {
        position: relative;
        margin: 0 calc(var(--gutter) * -1);
        padding: 0 var(--gutter);
        user-select: none;
        touch-action: pan-y;
    }

    /* 拖拽时整组不要 transition（跟手），松手后再恢复 */
    .section-projects .project-carousel.is-dragging .project-row {
        transition: none;
    }
    .section-projects .project-carousel.is-dragging {
        cursor: grabbing;
    }
    .section-projects .project-carousel:not(.is-dragging) {
        cursor: grab;
    }

    /* ====== 左右渐隐遮罩 · 暗示「还有内容」 ====== */
    .section-projects .project-carousel::before,
    .section-projects .project-carousel::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        width: clamp(6rem, 11vw, 12rem);
        z-index: 4;
        pointer-events: none;
        background: linear-gradient(
            to right,
            var(--bg-0) 0%,
            var(--bg-0) 35%,
            rgba(0, 0, 0, 0) 100%
        );
    }
    .section-projects .project-carousel::before { left: 0; }
    .section-projects .project-carousel::after {
        right: 0;
        transform: scaleX(-1);     /* 镜像渐变方向 */
    }

    /* 舞台：用 padding-bottom 给下方信息块留出高度，避免被裁 */
    .section-projects .project-toc {
        --slot-gap: clamp(11rem, 22vw, 20rem);        /* current ↔ prev/next 中心点距离 */
        --slot-gap-outer: clamp(18rem, 38vw, 34rem);  /* current ↔ prev2/next2 中心点距离 */
        display: block;
        position: relative;
        height: clamp(560px, 78vh, 720px);
        margin: 0;
        padding: 0;
        overflow: hidden;            /* 隐藏 hidden 位的 row（同时避免占布局空间） */
    }

    /* ====== Row · 绝对定位 + 5 档 transform ====== */
    .section-projects .project-row {
        position: absolute;
        top: 50%;
        left: 50%;
        width: clamp(320px, 32vw, 460px);
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding: 0;
        border-bottom: none;
        background: transparent;
        cursor: pointer;
        /* 默认收住 · JS 写入 data-slot 后由下方规则接管 transform / opacity */
        transform: translate3d(-50%, -50%, 0) scale(0.42);   /* translate3d 触发 GPU 合成 */
        opacity: 0;
        pointer-events: none;
        /* 性能：砍掉 filter 过渡（brightness 重绘开销大）；时长收紧 700 → 500ms */
        transition:
            transform 500ms cubic-bezier(0.16, 1, 0.3, 1),
            opacity 400ms cubic-bezier(0.16, 1, 0.3, 1);
        will-change: transform, opacity;
        backface-visibility: hidden;     /* 强制独立合成层 */
        -webkit-backface-visibility: hidden;
        contain: layout style paint;     /* 性能：独立合成容器 */
        z-index: 1;
    }

    /* prev2: 最外侧（再外侧一张） */
    .section-projects .project-row[data-slot="prev2"] {
        left: calc(50% - var(--slot-gap-outer, 38vw));
        transform: translate3d(-50%, -50%, 0) scale(0.42);
        opacity: 0.18;
        pointer-events: auto;
        z-index: 1;
    }
    /* v3.1 · 只 current 显示标题 · 4 张侧边全部只露封面 */
    .section-projects .project-row[data-slot="prev2"] .row-info,
    .section-projects .project-row[data-slot="prev"]  .row-info,
    .section-projects .project-row[data-slot="next"]  .row-info,
    .section-projects .project-row[data-slot="next2"] .row-info {
        display: none;
    }

    /* prev: 内侧 */
    .section-projects .project-row[data-slot="prev"] {
        left: calc(50% - var(--slot-gap, 22vw));
        transform: translate3d(-50%, -50%, 0) scale(0.68);
        opacity: 0.36;
        pointer-events: auto;
        z-index: 2;
    }

    /* current: 居中 */
    .section-projects .project-row[data-slot="current"] {
        left: 50%;
        transform: translate3d(-50%, -50%, 0) scale(1);
        opacity: 1;
        pointer-events: auto;
        z-index: 3;
    }

    /* next: 内侧 */
    .section-projects .project-row[data-slot="next"] {
        left: calc(50% + var(--slot-gap, 22vw));
        transform: translate3d(-50%, -50%, 0) scale(0.68);
        opacity: 0.36;
        pointer-events: auto;
        z-index: 2;
    }

    /* next2: 最外侧 */
    .section-projects .project-row[data-slot="next2"] {
        left: calc(50% + var(--slot-gap-outer, 38vw));
        transform: translate3d(-50%, -50%, 0) scale(0.42);
        opacity: 0.18;
        pointer-events: auto;
        z-index: 1;
    }

    /* hidden: 完全收掉（display:none 由 JS 的 applyFilter 同时控制） */
    .section-projects .project-row[data-slot="hidden"] {
        display: none !important;
    }

    /* ====== Row hover: 缩略图微推 + 阴影 ====== */
    .section-projects .project-row[data-slot="prev"]:hover,
    .section-projects .project-row[data-slot="next"]:hover {
        opacity: 0.5;
    }
    .section-projects .project-row[data-slot="prev2"]:hover,
    .section-projects .project-row[data-slot="next2"]:hover {
        opacity: 0.32;
    }
    .section-projects .project-row[data-slot="current"]:hover .row-cover img {
        transform: scale(1.03);
    }

    /* 取消原 hover 背景填充 */
    .section-projects .project-row:hover {
        background-color: transparent;
    }

    /* ====== Row · 内部排版（3D 书架期的 row-cover 4:3、信息隐藏等规则全部释放） ====== */
    .section-projects .row-cover {
        aspect-ratio: 16 / 10;
        width: 100%;
        background: var(--bg-2);
    }
    .section-projects .row-cover img {
        transition: transform var(--dur-slow) var(--ease-out);
    }

    .section-projects .row-info {
        padding: 1rem 0.25rem 0;
        gap: 0;
    }
    .section-projects .row-title {
        font-size: clamp(1.05rem, 1.6vw, 1.4rem);  /* 主舞台标题稍微提一档 */
        line-height: 1.3;
    }
    .section-projects .row-title .title-en {
        display: inline;
        font-size: 0.78em;
    }
    .section-projects .row-title .title-sep {
        display: inline;
        margin: 0 0.5rem;
    }
    /* v3.1 · carousel 只展示标题 · 描述 / meta 收起 */
    .section-projects .row-desc,
    .section-projects .row-meta {
        display: none;
    }

    /* 编号在主舞台左侧外侧贴边 */
    .section-projects .row-num {
        position: absolute;
        top: 0;
        left: -3.5rem;
        padding-top: 0;
        font-size: 0.7rem;
        color: var(--fg-3);
        letter-spacing: 0.05em;
        z-index: 4;
    }
    /* prev/next 的编号贴封面左上角 */
    .section-projects .project-row[data-slot="prev"] .row-num,
    .section-projects .project-row[data-slot="next"] .row-num {
        left: 0.85rem;
        top: 0.85rem;
        color: rgba(255, 255, 255, 0.85);
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
    }

    /* 清理 3D 书架期的 ::after / ::before（书脊 / 底切面） */
    .section-projects .project-row::before,
    .section-projects .project-row::after {
        content: none;
    }

    /* ====== 导航箭头 ====== */
    .section-projects .carousel-arrow {
        position: absolute;
        top: 38%;
        transform: translateY(-50%);
        width: 2.75rem;
        height: 2.75rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: transparent;
        border: 1px solid var(--line);
        border-radius: 50%;
        color: var(--fg-1);
        cursor: pointer;
        transition:
            background var(--dur-fast) var(--ease-out),
            color var(--dur-fast) var(--ease-out),
            border-color var(--dur-fast) var(--ease-out),
            transform var(--dur-fast) var(--ease-out);
        z-index: 5;
    }
    .section-projects .carousel-arrow:hover {
        background: var(--fg-0);
        color: var(--bg-0);
        border-color: var(--fg-0);
    }
    .section-projects .carousel-arrow:active {
        transform: translateY(-50%) scale(0.96);
    }
    .section-projects .carousel-arrow:focus-visible {
        outline: 1px solid var(--fg-1);
        outline-offset: 3px;
    }
    .section-projects .carousel-prev {
        left: clamp(0.5rem, 2vw, 1.5rem);
    }
    .section-projects .carousel-next {
        right: clamp(0.5rem, 2vw, 1.5rem);
    }

    /* ====== Meta · counter + dots ====== */
    .section-projects .carousel-meta {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1.5rem;
        margin-top: 0.5rem;
    }
    .section-projects .carousel-counter {
        font-family: var(--font-mono);
        font-size: 0.72rem;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        color: var(--fg-3);
        min-width: 5rem;
        text-align: center;
    }
    .section-projects .carousel-dots {
        display: inline-flex;
        gap: 0.4rem;
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .section-projects .carousel-dots .dot {
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: var(--bg-3);
        cursor: pointer;
        transition:
            background var(--dur-fast) var(--ease-out),
            transform var(--dur-fast) var(--ease-out);
    }
    .section-projects .carousel-dots .dot:hover {
        background: var(--fg-2);
    }
    .section-projects .carousel-dots .dot.active {
        background: var(--fg-0);
        transform: scale(1.4);
    }

    /* ====== reveal 动效：carousel 模式下不要冲突 ====== */
    .section-projects .project-row.reveal {
        opacity: 1;                /* 自身透明度由 data-slot 控，reveal 只管入场缩放 */
        transform: translate3d(-50%, -50%, 0) scale(0.96);
    }
    .section-projects .project-row.reveal.revealed {
        opacity: 1;
        transform: translate3d(-50%, -50%, 0) scale(1);
    }
    /* 已分配 slot 的 row · reveal 完成后由 slot 决定最终 transform */
    .section-projects .project-row[data-slot="prev2"].revealed {
        left: calc(50% - var(--slot-gap-outer, 38vw));
        transform: translate3d(-50%, -50%, 0) scale(0.42);
    }
    .section-projects .project-row[data-slot="prev"].revealed {
        left: calc(50% - var(--slot-gap, 22vw));
        transform: translate3d(-50%, -50%, 0) scale(0.68);
    }
    .section-projects .project-row[data-slot="next"].revealed {
        left: calc(50% + var(--slot-gap, 22vw));
        transform: translate3d(-50%, -50%, 0) scale(0.68);
    }
    .section-projects .project-row[data-slot="next2"].revealed {
        left: calc(50% + var(--slot-gap-outer, 38vw));
        transform: translate3d(-50%, -50%, 0) scale(0.42);
    }
    .section-projects .project-row[data-slot="hidden"].revealed {
        opacity: 0;
    }

    /* filter-nav 紧凑 */
    .section-projects .filter-nav {
        margin-bottom: 2rem;
    }
}


/* ==================== 平板 · 768-1024px ==================== */

/* ——— L1677-1711 ——— */
@media (min-width: 768px) and (max-width: 1024px) {
    :root {
        --section-pad: clamp(4rem, 8vh, 7rem);
    }

    .side-nav {
        right: 1rem;
    }

    .side-nav .nav-label .zh {
        font-size: 0.7rem;
    }

    .hero-line.cn { font-size: clamp(2.4rem, 6.5vw, 4.5rem); }
    .hero-line.en { font-size: clamp(1.4rem, 3.6vw, 2.5rem); }

    .about-cols { gap: 2rem; }

    .founder-detail-inner { gap: 2rem; }

    .founder-detail-avatar {
        max-width: 10rem;
    }

    /* 项目行：稍紧凑 */
    .project-row {
        grid-template-columns: 2.5rem minmax(12rem, 16rem) 1fr;
        column-gap: 1.5rem;
        padding: 2rem 0;
    }

    .row-title { font-size: clamp(1.2rem, 2vw, 1.6rem); }   /* v3.0 · 对齐基准 */

    .contact-mail { font-size: clamp(1.2rem, 2vw, 1.6rem); }   /* v3.0 · 对齐基准 */
}


/* ==================== 移动端 · ≤900 / ≤768 / ≤600 ==================== */

/* ——— L1447-1548 ——— */
@media (max-width: 900px) {
    .side-nav {
        top: auto;
        bottom: max(0.75rem, env(safe-area-inset-bottom) + 0.5rem);
        left: 50%;
        transform: translateX(-50%);
        background: transparent;       /* v3.0.x 去掉外层药丸 · 只剩点 + 字漂浮 */
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: 0;
        border-radius: 0;
        padding: 0.45rem 0.7rem;
        mix-blend-mode: difference;    /* 恢复 difference · 透明背景下与 hero/footer 通用 */
        z-index: 100;
    }

    /* v3.0 · 移动端 nav 改为 glyph compact：点 + 单字中文（首/关/团/奖/项/联）
       · 4 字中文标签（关于我们/创始团队/参展奖项）在窄屏会被压成单字符竖排
       · 改用首字：同 compact 尺寸，但带语义
       · 解决 overflow 与换行问题 */
    /* 隐藏中文全标签，避免换行 */
    .side-nav .nav-label { display: none !important; }

    /* 状态点：默认空心小圆，active 变短横线 */
    .side-nav .nav-dot {
        display: block !important;
        width: 7px;
        height: 7px;
    }
    .side-nav li.active .nav-dot {
        width: 12px;
        height: 2px;
    }

    /* 每个 item：竖向「点 + 单字」紧凑布局 */
    .side-nav-list {
        flex-direction: row;
        gap: 0.4rem;
    }
    .side-nav li {
        min-width: 38px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .side-nav a {
        min-height: 44px;
        min-width: 38px;
        padding: 0.35rem 0.5rem;
        gap: 0.35rem;
        flex-direction: column;
        justify-content: center;
    }

    /* 单字中文标签 · 由 li[data-glyph] 提供 */
    .side-nav li::after {
        content: attr(data-glyph);
        font-family: var(--font-cn);   /* v3.0 · 修正：原 var(--font-zh) 悬空，回退到 sans 兜底链导致中文渲染不一致 */
        font-size: 0.7rem;
        color: var(--fg-2);
        line-height: 1;
    }
    .side-nav li.active::after {
        color: var(--fg-0);
    }
    /* v3.0 · force glyph mode @ ≤900px（强一致 · 防止缓存命中旧版 nav-label） */

    .about-cols {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .logo-wall {
        max-width: 100%;
    }

    .founders-cards {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .founder-detail-inner {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    .founder-detail-avatar {
        max-width: 12rem;
    }

    .contact-details {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .project-row {
        grid-template-columns: 2.5rem minmax(14rem, 18rem) 1fr;
        column-gap: 1.5rem;
        padding: 2rem 0;
    }

    .hero-subtitle { font-size: 1rem; }
}

/* ——— L1550-1674 ——— */
@media (max-width: 600px) {
    .section { padding: 4rem 1.25rem; }

    /* 手机端隐藏桌面 carousel 控件中确实无用的（JS 未初始化，点击无响应）
   —— 保留 .carousel-meta（容器），下方 snap-scroll 方案要复用它的 .carousel-dots */
    .section-projects .carousel-arrow,
    .section-projects .carousel-counter { display: none !important; }

    .section-header {
        grid-template-columns: auto 1fr;
        gap: 1rem;
    }

    .section-zh { display: none; }

    .hero-line.cn { font-size: 2.8rem; }
    .hero-line.en { font-size: 1.6rem; }

    .hero-meta {
        font-size: 0.65rem;
    }

    /* v3.0 · 移动端 brand：堆叠布局后 brand 在立方体下方，恢复合理尺寸（之前 5px 是因为重叠硬压） */
    .hero-brand-name {
        height: auto;
        width: clamp(160px, 55vw, 220px);
        margin-left: var(--hero-shift);        /* v3.1 · 跟随变量，移动端 --hero-shift: 0 */
    }

    /* v3.0.4 移动端：hero meta 全部竖排（3 列横排在小屏拥挤） */
    .hero-meta-top,
    .hero-meta-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.4rem;
    }

    .contact-mail { font-size: 1rem; }   /* v3.0 · 对齐基准 */

    /* v3.0.4 移动端：项目展示 Pinterest 风（2 列 · 封面统一 · 信息块紧凑） */
    .project-toc {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1.25rem 0.75rem;
        border-top: 1px solid var(--line);
        padding-top: 1.5rem;
    }

    .project-row {
        display: flex;
        flex-direction: column;
        height: 100%;          /* 拉满 grid 行高 → 同列 2 项等高 */
        gap: 0.6rem;
        padding: 0.75rem;
        border: none;
        border-radius: 2px;
        background: transparent;
    }

    .project-row:hover {
        background: var(--bg-1);
    }

    .row-cover {
        order: -1;            /* 封面置顶 */
        width: 100%;
        flex: 0 0 auto;        /* 高度交给 aspect-ratio，不被 info 撑大 */
        aspect-ratio: 4 / 3;  /* 统一封面高度，避免网格错位 */
        margin-bottom: 0.25rem;
    }

    /* info 块吃掉 row 剩余高度 → 不同标题/简介长度也对齐底部 */
    .row-info {
        flex: 1;
        gap: 0.5rem;
    }

    .row-num {
        padding-top: 0;
        font-size: 0.65rem;
        margin-bottom: -0.25rem;
    }

    .row-info {
        gap: 0.4rem;
        padding-top: 0;
    }

    .row-title {
        font-size: clamp(0.95rem, 3.5vw, 1.1rem);
        line-height: 1.3;
        letter-spacing: -0.005em;
    }

    /* v3.0.x 移动端卡片：只保留封面 + 中文标题 + 年份
       · 隐藏描述（zh+en）· 隐藏英文标题 · 隐藏分类
       · 卡片更小更一致 · 简介留给点进去看 */
    .row-desc,
    .title-en,
    .title-sep,
    .row-cat { display: none !important; }

    .row-title { font-weight: 500; }

    /* 只剩标题 + 年份时，info 块改紧凑竖排 */
    .row-info {
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
        padding-top: 0.1rem;
    }

    .row-meta {
        font-size: 0.6rem;
        gap: 0;
        letter-spacing: 0.08em;
    }

    .row-meta {
        gap: 0.75rem;
        flex-wrap: wrap;
        font-size: 0.6rem;
        margin-top: 0.25rem;
    }
}

/* ——— L1740-1744 ——— */
@media (max-width: 600px) {
    .section {
        padding-top: max(var(--section-pad), calc(env(safe-area-inset-top) + 2rem));
    }
}

/* ——— L1747-1803 ——— */
@media (max-width: 600px) {
    .filter-btn,
    .side-nav a,
    .award-list li,
    .project-row {
        min-height: 44px;
    }

    .filter-btn { padding: 0.6rem 0; }

    /* wrap 后竖线分隔错位，移动端去掉，改用换行间距作视觉分组 */
    .filter-btn:not(:last-child)::after { display: none; }
    .filter-nav {
        row-gap: 0;
        column-gap: 1.5rem;
        margin-bottom: 2.5rem;
        padding-bottom: 0;
        border-bottom: 1px solid var(--line);
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }
    .filter-nav::-webkit-scrollbar { display: none; }
    .filter-btn { white-space: nowrap; padding: 0.6rem 0; }

    .project-row {
        padding-top: 1.2rem;
        padding-bottom: 1.2rem;
    }

    .award-list li {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    /* 极窄屏 nav 再紧凑一档（继承 900px 的 glyph compact）
       · 单行 6 个 · min-width 28px 保证命中区 ≥44pt 高度
       · 真机 320px 也单行（实测约 200px 就够），不再 wrap */
    .side-nav {
        padding: 0.35rem 0.45rem;
        max-width: calc(100vw - 1.5rem);
    }
    .side-nav-list {
        gap: 0.15rem;
        flex-wrap: nowrap;
        justify-content: center;
    }
    .side-nav li { min-width: 28px; flex: 0 0 auto; }
    .side-nav a {
        min-width: 28px;
        padding: 0.25rem 0.3rem;
        flex: 0 0 auto;
    }
    .side-nav .nav-dot { width: 5px; height: 5px; }
    .side-nav li.active .nav-dot { width: 10px; height: 2px; }
    .side-nav li::after { font-size: 0.65rem; }
}

/* ——— L1929-1935 ——— */
@media (max-width: 600px) {
    ::-webkit-scrollbar { display: none; }
    html {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
}

/* ——— L2085-2203 ——— */
@media (max-width: 768px) {
    .section-hero {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        grid-template-rows: none;            /* 覆盖桌面 grid 布局 */
    }

    /* 元素堆叠顺序：top meta → 3D cube → brand → subtitle → bottom meta */
    .hero-meta-top { order: 1; }

    /* 立方体：脱离绝对定位，作为 flex 子项占 ~45vh 高度，独立可交互区 */
    .hero-cube {
        order: 2;
        position: relative !important;       /* 关键：不再 absolute 覆盖文字（!important 兜底特异性） */
        inset: auto !important;
        width: 100%;
        height: 45vh;
        min-height: 240px;
        max-height: 360px;
        flex: 0 0 auto;                      /* 防止 flex 把立方体压塌 */
        margin: 0.5rem 0;
    }

    /* 品牌字：覆盖桌面 align-self: end → stretch；justify-content: center 居中 */
    .hero-brand {
        order: 3;
        align-self: stretch;
        justify-content: center;
        padding: 0.75rem 4vw 0;
        margin: 0;
    }

    /* brand 图片：覆盖桌面 height clamp + margin-left: var(--hero-shift) → 自适应尺寸且居中 */
    .hero-brand-name {
        height: auto;
        width: clamp(160px, 35vw, 260px);     /* 768 上限 260px（手机 ≤600 仍被下方块限制为 220px） */
        max-width: 90%;                       /* 兜底不超过容器 */
        margin-left: var(--hero-shift);       /* v3.1 · 跟随变量 */
    }

    /* 副标题：居中（强制 text-align + 清桌面 max-width / padding-left 限制） */
    .hero-subtitle {
        order: 4;
        padding: 0 6vw !important;          /* 覆盖桌面 padding-left: 4vw */
        margin-top: 0.75rem;
        margin-bottom: 1.25rem;
        text-align: center !important;
        max-width: none !important;         /* 覆盖桌面 36rem / 38vw 上限 */
        width: 100%;
    }
    .has-cube-gl .hero-subtitle--dom {
        padding-left: 6vw !important;
        max-width: none !important;
        text-align: center !important;
    }

    /* 英文段落：禁用 justify（窄列里会拉大词间距很丑）→ 改左对齐 + 紧凑字距 */
    .about-lede-en {
        text-align: left !important;
        letter-spacing: -0.01em;
        word-spacing: -0.05em;
        hyphens: auto;
        -webkit-hyphens: auto;
    }

    /* 隐藏桌面 carousel 控件中确实无用的（JS 在 ≤1024px 不初始化，点击无响应）
   —— 注意：保留 .carousel-meta（容器），因为下面 snap-scroll 方案要复用它的 .carousel-dots */
    .section-projects .carousel-arrow,
    .section-projects .carousel-counter { display: none !important; }

    /* ===== v3.0 · ≤768px 项目展示 · 移动端 snap-scroll carousel =====
       桌面：3 卡横排 focus 模式；移动端：单卡全宽横滑（CSS scroll-snap）
       - 复用 .project-row DOM（不重排数据），只改布局
       - 复用 .carousel-dots（用 snap-scroll JS 维护 active 态）
       - 复用外层 .filter-nav（filter 改 row.display，JS 重新渲染 dots） */
    .section-projects .project-toc {
        display: flex !important;
        flex-direction: row;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        scroll-padding-inline-start: 0;
        gap: 0.75rem;
        padding: 0 0 0.5rem;
        border-top: 1px solid var(--line);
        padding-top: 1.5rem;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        grid-template-columns: none;          /* 覆盖桌面 grid */
    }
    .section-projects .project-toc::-webkit-scrollbar { display: none; }

    .section-projects .project-row {
        flex: 0 0 100%;
        scroll-snap-align: start;
        scroll-snap-stop: always;            /* 每次必停一卡，不跳跃 */
        width: 100%;
        height: auto;
        min-height: 18rem;                   /* 卡片最小高度，避免内容过短时塌陷 */
    }

    /* 显示 dots（指示当前在第几个）；counter 已被上面的规则隐藏 */
    .section-projects .carousel-meta { display: flex !important; justify-content: center; }
    .section-projects .carousel-dots { display: inline-flex !important; }

    /* 底部 meta：居中横排（push 到最底） */
    .hero-meta-bottom {
        order: 5;
        margin-top: auto;
        padding: 0.75rem 0 0;
        flex-direction: row;
        justify-content: center;            /* 居中（之前 space-between 在 1 项时跑左边） */
        flex-wrap: wrap;
        gap: 0.5rem 1.5rem;                 /* 项间距大一点，居中后更透气 */
        align-items: center;
    }
}

/* ——— L2208-2225 ——— */
@media (hover: none) and (pointer: coarse) {
    .project-row:active {
        transform: scale(0.97);
        transition: transform 100ms ease-out;
    }

    .filter-btn:active {
        opacity: 0.6;
    }

    .contact-mail:active {
        opacity: 0.6;
    }

    .side-nav a:active {
        opacity: 0.6;
    }
}


/* ==================== 极小屏 · ≤380 ==================== */

/* ——— L1806-1911 ——— */
@media (max-width: 380px) {
    .section { padding: 3rem 1rem; }

    .section-header {
        grid-template-columns: auto 1fr;
        gap: 0.5rem;
        margin-bottom: 3rem;
    }

    .section-num { font-size: 1rem; }   /* v3.0 · 对齐 founders-lede 移动端 1rem */
    .section-zh { display: none; }

    .hero-line.cn { font-size: 2.4rem; }
    .hero-line.en { font-size: 1.3rem; }

    /* 极小屏 hero meta 改为竖排 + 隐藏多余项 */
    .hero-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.4rem;
        font-size: 0.6rem;
    }

    .hero-meta-bottom span:nth-child(2),
    .hero-meta-bottom span:nth-child(3) { display: none; }

    .hero-subtitle { font-size: 0.95rem; margin-top: 1.5rem; }

    .about-lede {
        font-size: 1rem;   /* v3.0 · 对齐 founders-lede 移动端 1rem */
        margin-bottom: 3rem;
    }

    /* 手机端英文段落：禁用 justify（窄列里会拉大词间距显得很丑）→ 改左对齐 + 紧凑字距 */
    .about-lede-en {
        text-align: left !important;      /* !important 兜底（基线 justify 在窄列下太丑） */
        letter-spacing: -0.01em;          /* 略收字距，跟中文紧凑感对齐 */
        word-spacing: -0.05em;            /* 词距收紧，匹配中文"挤压"密度 */
        hyphens: auto;                    /* 长英文词自动断行，避免单行只放一两个词 */
        -webkit-hyphens: auto;
    }

    .about-cols {
        gap: 1.5rem;
        margin-bottom: 3rem;
    }

    .founders-lede {
        font-size: 1rem;
        margin-bottom: 3rem;
    }

    .founders-cards {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    .founder-card {
        padding: 0.75rem;
    }
    .founder-card-avatar {
        width: 40px;
        height: 40px;
    }
    .founder-detail-inner {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    .founder-detail-avatar {
        max-width: 8rem;
    }
    .feature-name { font-size: 1rem; }

    .part-marker { font-size: 0.7rem; }

    /* v3.1 · 拆分后：wrapper 与 link 各自管自己
       · wrap 持有视觉间距（gap / padding-bottom / margin-bottom）
       · link 只管字号 + 长邮箱断行 */
    .contact-mails {
        gap: 0.5rem;
        padding-bottom: 1.25rem;
        margin-bottom: 2.5rem;
    }
    .contact-mail {
        font-size: 1rem;   /* v3.0 · 对齐基准 */
        word-break: break-all;
    }

    .mail-prefix { font-size: 0.5em; }

    .contact-details { gap: 1.5rem; }

    /* 极小屏项目行：单列堆叠，全部信息保留 */
    .project-row {
        grid-template-columns: 1fr;
        row-gap: 1rem;
        padding: 1.25rem 0;
    }

    .row-cover { order: -1; }

    .row-num { font-size: 0.7rem; }
    .row-title { font-size: 1rem; }   /* v3.0 · 对齐基准 */
    .row-desc { font-size: 0.85rem; }
    .row-meta { font-size: 0.65rem; gap: 0.75rem; }

    .footer-line {
        flex-direction: column;
        gap: 0.4rem;
        align-items: flex-start;
    }
}

/* ——— L2046-2065 ——— */
@media (max-width: 380px) {
    .hero-cube--fallback .hero-cube-css-fallback {
        width: 65vmin;
        height: 65vmin;
    }
    .css-face-front,
    .css-face-back,
    .css-face-right,
    .css-face-left,
    .css-face-top,
    .css-face-bottom {
        /* 同步重写 translateZ 引用 65vmin 尺寸 —— 直接覆盖 */
    }
    .css-face-front  { transform: translateZ(32.5vmin); }
    .css-face-back   { transform: rotateY(180deg) translateZ(32.5vmin); }
    .css-face-right  { transform: rotateY(90deg)  translateZ(32.5vmin); }
    .css-face-left   { transform: rotateY(-90deg) translateZ(32.5vmin); }
    .css-face-top    { transform: rotateX(90deg)  translateZ(32.5vmin); }
    .css-face-bottom { transform: rotateX(-90deg) translateZ(32.5vmin); }
}


/* ==================== 用户偏好 · prefers-* ==================== */

/* ——— L1914-1926 ——— */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .reveal {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ——— L2068-2070 ——— */
@media (prefers-reduced-motion: reduce) {
    .hero-cube--fallback .hero-cube-css-fallback { animation: none; }
}

/* ——— L2073-2079 ——— */
@media (prefers-reduced-transparency: reduce) {
    .css-face {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: rgba(20, 20, 20, 0.92);
    }
}

/* ——— L2267-2269 ——— */
@media (prefers-color-scheme: light) {
    /* 当前保持暗色，仅占位预留扩展 */
}