/* 英文站排版覆盖。
   只有 /en/ 下的页面会加载本文件，中文站不受任何影响。
   英文文本通常比同义中文长 30–50%，这里集中处理由此产生的溢出与折行问题。 */

/* 英文没有中文那样的等宽方块字，行高略收一点更紧凑 */
body {
    --en-tight: 1.25;
}

/* ---------- 导航 ---------- */
/* 中文导航项 2–4 字，英文普遍 8–14 字符，缩字号并收紧间距以避免换行 */
.nav-links {
    gap: 22px;
}
.nav-links a {
    font-size: 14px;
    letter-spacing: -0.01em;
    white-space: nowrap;
}

/* ---------- Hero ---------- */
/* 英文主标题字符数多，上限调低一档，避免在 1280 宽度下挤成三行 */
.hero h1 {
    font-size: clamp(36px, 5.2vw, 64px);
    line-height: 1.08;
    letter-spacing: -0.02em;
}
.hero .sub {
    max-width: 60ch;
    line-height: 1.6;
}

/* ---------- 通用区块标题 ---------- */
/* home.css 给 .section-head 设了 max-width:700px——中文标题短，收窄可避免过宽。
   英文同义标题实测要 764~1007px，在 700px 下会把末尾一两个词折到第二行（如
   "…for the AI Era" 的 Era）。容器内宽有 1202px，这里放开上限让标题单行排完；
   下面的 .section-sub 仍按 62ch 约束行长，正文可读性不受影响。 */
.section-head {
    max-width: none;
}
.section-title {
    letter-spacing: -0.015em;
}
.section-sub {
    max-width: 62ch;
    margin-left: auto;
    margin-right: auto;
}

/* ---------- 功能页 Hero ---------- */
/* 标题在中文源里用 <br> 刻意排成两行，第二行高亮。英文首行更长，
   52px 下会再折一次变成三行（"hand" 单独掉行），收一档字号排回两行。
   只覆盖 960px 以上的桌面档，移动端沿用中文的 34px 起始值。 */
@media (min-width: 960px) {
    .feat-hero__title {
        font-size: clamp(32px, 3.6vw, 46px);
    }
}

/* 960~1200px 这一档，媒体列的 540px 固定基准会把正文挤到 357px，
   中文标题在此已折成三行，英文更长会到四行。改成按比例分配，
   正文拿回排两行所需的宽度。1200px 以上空间充足，沿用中文的固定基准。 */
@media (min-width: 960px) and (max-width: 1200px) {
    .feat-hero__media {
        flex: 0 1 42%;
        max-width: 42%;
    }
}

/* ---------- Hero 截图卡 ---------- */
/* 卡内是定宽的标签/数值两栏，英文标签更长，给标签留更多空间并允许省略 */
.rec-f .rl,
.skpi .l {
    font-size: 12px;
    letter-spacing: -0.01em;
}
.cable-i .cn {
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cable-i .cm {
    font-size: 11px;
}
.shot-bar .t,
.demo-top .t {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------- 对比图表 ---------- */
/* 左侧图例是定宽栏，英文标签容易撑破，允许两行显示 */
.bench .bl {
    font-size: 13px;
    line-height: var(--en-tight);
    white-space: normal;
}
.metric-tabs .mtab {
    font-size: 14px;
    padding-left: 16px;
    padding-right: 16px;
}

/* ---------- 功能区 ---------- */
.frow-text h3 {
    letter-spacing: -0.015em;
}
.frow-list span {
    line-height: 1.5;
}
.trig-row .tl {
    font-size: 12px;
    white-space: nowrap;
}
.trig-row .tv {
    font-size: 12px;
    text-align: right;
}
.seq-step .u {
    font-size: 10px;
}

/* ---------- 关于页 Banner 字样 ---------- */
/* Aboreto 是纯拉丁字体，"TOPlayer" 作为不可断行的整词 min-content 就有 446px，
   85px 下在 390px 视口会横向溢出 44px。中文原文「高阶玩家」可以在任意两字之间
   折行，所以中文页在窄屏能自行收进去、不受影响。
   窄屏同比缩小标记与字号，保留标记在左、字样在右的原构图。 */
@media (max-width: 600px) {
    .AboutUs_logoImg__jVTeV {
        gap: 12px;
    }
    .AboutUs_logoImg__jVTeV .ab-mark {
        width: 84px;
        height: 84px;
        border-radius: 16px;
    }
    .AboutUs_logoImg__jVTeV .ab-word {
        font-size: min(11.5vw, 60px);
    }
}

/* ---------- 页脚 ---------- */
.footer-col h4 {
    white-space: nowrap;
}
.footer-col a {
    line-height: 1.7;
}

/* ---------- 窄屏 ---------- */
@media (max-width: 900px) {
    .hero h1 {
        font-size: clamp(30px, 8vw, 44px);
    }
    .bench .bl {
        font-size: 12px;
    }
}