/* ============================================================
   Technology 页「NATIONAL-LEVEL」能力网格 · 响应式修复
   ------------------------------------------------------------
   问题：该区块 .list 使用 grid-template-columns:repeat(6,1fr)，
        且原 CSS 未提供任何移动端降级规则。栅格子项默认 min-width:auto，
        标题里的长单词（Manufacturing / characterization）会以
        min-content 撑开轨道，6 列总宽超出容器 → 页面出现横向滚动
        （实测 490px 视口下 scrollWidth 894px，溢出约 400px）。

   修复：
     1) 主断点（≤1000px，主题统一移动端断点）降为 3 列并缩小标题字号；
     2) 窄屏（≤750px）再降为 2 列；
     3) 加 min-width:0 + overflow-wrap 作为安全网，
        确保任何视口下超长单词都不会撑破页面。
   ============================================================ */

/* ---------- 安全网：超长单词不再撑开栅格轨道 ---------- */
.ly_special_6[data-visual-id="7433"] .list .special_item {
    min-width: 0;
}

.ly_special_6[data-visual-id="7433"] .list .special_item .i_title,
.ly_special_6[data-visual-id="7433"] .list .special_item .i_title h3 {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* ---------- 平板 / 手机横屏：6 列 → 3 列 ---------- */
@media screen and (max-width: 1000px) {
    .ly_special_6[data-visual-id="7433"] .list {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px 20px;
    }

    .ly_special_6[data-visual-id="7433"] .list .special_item .i_title,
    .ly_special_6[data-visual-id="7433"] .list .special_item .i_title h3 {
        font-size: 18px;
        line-height: 26px;
    }
}

/* ---------- 手机竖屏：3 列 → 2 列 ---------- */
@media screen and (max-width: 750px) {
    .ly_special_6[data-visual-id="7433"] .list {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px 12px;
    }

    .ly_special_6[data-visual-id="7433"] .list .special_item .i_title,
    .ly_special_6[data-visual-id="7433"] .list .special_item .i_title h3 {
        font-size: 15px;
        line-height: 22px;
    }

    .ly_special_6[data-visual-id="7433"] .list .special_item .i_title {
        margin-top: 14px;
    }
}