/* ============================================================
   page.css · test3 · 内页骨架（about / camera / robot / support 共用）
   页头 / 区块间距 / 小节标题 / 脚注 / 下载卡片
   ============================================================ */

/* 页头：现版用了蓝色径向光晕打底，这两家都不这么做——
   改为纯白加一条底线，留白拉大，靠字号层级而不是背景制造层次。 */
/* 内边距原为 104/80，是按「页面只有一两块内容」定的。关于页加到四块后
   开头占得过多，收到 88/64。支持中心同用此类，内容更少，收窄只有好处。 */
.page-hero{padding:88px 0 64px;text-align:center;background:#fff;border-bottom:1px solid var(--line)}
.page-hero .kicker{font-size:12px;letter-spacing:.18em;color:var(--ink-3);font-weight:500;
 margin-bottom:18px;text-transform:uppercase}
.page-hero h1{font-size:clamp(32px,4.2vw,56px);line-height:1.18;letter-spacing:-.03em;margin:0;
 font-weight:400;color:var(--ink)}
.page-hero p{color:var(--ink-2);margin:22px auto 0;max-width:720px;font-size:15.5px;line-height:1.85;
 letter-spacing:-.01em}
/* .lede：副标题当「定位句」用时的提权版本。支持中心那条是说明性文字，
   仍用上面的 15.5px 灰字，不加这个类。 */
.page-hero p.lede{font-size:clamp(17px,1.5vw,19px);line-height:1.7;color:var(--ink);max-width:760px}

.section{padding:104px 0}
.sec-head{margin-bottom:52px}
.sec-head h2{font-size:clamp(24px,2.8vw,36px);line-height:1.28;letter-spacing:-.02em;margin:0;
 font-weight:400;color:var(--ink)}
.note{font-size:12.5px;color:var(--ink-3);line-height:1.8;margin-top:16px}

/* ---------- 文档下载卡片（camera / support） ----------
   去掉大圆角、投影和位移。hover 只让边框变深、右侧的动作标记变实。 */
.dl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
/* 下载卡的交互原先是中性灰边框加近黑按钮，而首页卡片是蓝边框加渐变图标。
   同样是卡片，反馈一个蓝一个黑。这里统一到首页那套，连投影和位移一并对齐。 */
.dl{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;
 border:1px solid var(--line);border-radius:var(--r);padding:28px 30px;
 box-shadow:var(--sh-card);
 transition:border-color .26s var(--ease),box-shadow .26s var(--ease),transform .26s var(--ease)}
.dl:hover{border-color:#bfd1f8;box-shadow:var(--sh-card-h);transform:translateY(-3px)}
.dl .t{font-size:16px;font-weight:500;letter-spacing:-.02em;line-height:1.5;color:var(--ink)}
.dl .d{color:var(--ink-3);font-size:12.5px;margin-top:6px;line-height:1.75}
.dl .go{flex:0 0 auto;font-size:13px;color:var(--accent);background:transparent;
 border:1px solid #c4d4f8;padding:9px 18px;border-radius:var(--r);font-weight:500;
 transition:background .22s,color .22s,border-color .22s}
.dl:hover .go{background:var(--grad);border-color:transparent;color:#fff}
/* 下载清单里的文件状态：有文件时显示格式/大小/日期，没有文件时显示待上传 */
.dl-meta{display:block;margin-top:6px;font-size:11.5px;color:var(--ink-3);line-height:1.6}
.dl .go.is-pending{color:var(--ink-3);border-color:var(--line);background:var(--bg-soft)}
.dl:hover .go.is-pending{color:var(--ink-3);border-color:var(--line);background:var(--bg-soft)}
.dl.is-pending{cursor:default}
.dl.is-pending:hover{transform:none;box-shadow:var(--sh-card);border-color:var(--line)}

/* ---------- 实例点云数据集弹层 ----------
   下载卡里的数据是多物体清单，用弹层承载；列表高度自适应，超出后内部滚动。 */
.ds-modal{position:fixed;inset:0;z-index:110;display:flex;align-items:center;justify-content:center;
 padding:24px;background:rgba(23,26,32,.5);opacity:0;visibility:hidden;
 transition:opacity .24s,visibility 0s .24s}
.ds-modal.open{opacity:1;visibility:visible;transition:opacity .24s,visibility 0s}
.ds-card{position:relative;display:flex;flex-direction:column;width:min(760px,100%);
 max-height:min(82vh,760px);background:#fff;border-radius:var(--r);box-shadow:var(--sh-float);
 transform:translateY(10px) scale(.985);transition:transform .24s var(--ease);overflow:hidden}
.ds-modal.open .ds-card{transform:none}
.ds-close{position:absolute;top:12px;right:12px;width:32px;height:32px;border:none;background:none;
 color:var(--ink-3);cursor:pointer;border-radius:var(--r);display:flex;align-items:center;
 justify-content:center;transition:background .2s,color .2s}
.ds-close:hover{background:var(--bg-soft);color:var(--ink)}
.ds-close svg{width:16px;height:16px}
.ds-head{padding:28px 60px 20px 30px;border-bottom:1px solid var(--line-2)}
.ds-head h3{margin:0 0 8px;font-size:20px;font-weight:500;letter-spacing:-.02em;color:var(--ink)}
.ds-head p{margin:0;font-size:13.5px;line-height:1.7;color:var(--ink-2)}
.ds-list{padding:8px 14px;overflow-y:auto;flex:1}
.ds-item{display:flex;align-items:center;gap:16px;padding:13px 14px;border-radius:var(--r);
 transition:background .2s}
.ds-item + .ds-item{border-top:1px solid var(--line-2)}
.ds-item:hover{background:var(--bg-soft)}
.ds-thumb{width:72px;height:72px;flex:none;border-radius:var(--r);border:1px solid var(--line);
 background:var(--bg-soft);overflow:hidden;display:flex;align-items:center;justify-content:center;
 color:#a9b5ca}
.ds-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ds-thumb svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.2}
.ds-info{min-width:0;flex:1}
.ds-info strong{display:block;font-size:15px;font-weight:500;color:var(--ink);
 letter-spacing:-.01em;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ds-info span{display:block;margin-top:4px;font-size:12.5px;color:var(--ink-3);line-height:1.6}
.ds-dl{flex:none;font-size:13px;font-weight:500;padding:9px 18px;border-radius:var(--r);
 border:1px solid #c4d4f8;color:var(--accent);transition:background .2s,color .2s,border-color .2s}
.ds-dl:hover{background:var(--grad);border-color:transparent;color:#fff}
.ds-dl.is-pending{border-color:var(--line);background:var(--bg-soft);color:var(--ink-3);
 cursor:default;pointer-events:none}
.ds-state{padding:44px 20px;text-align:center;color:var(--ink-3);font-size:13.5px;line-height:1.8}
.ds-foot{margin:0;padding:16px 30px 22px;border-top:1px solid var(--line-2);
 font-size:12px;line-height:1.7;color:var(--ink-3)}
body.ds-open{overflow:hidden}
@media(max-width:768px){
  .ds-modal{padding:14px}
  .ds-card{max-height:88vh}
  .ds-head{padding:24px 54px 16px 20px}
  .ds-head h3{font-size:18px}
  .ds-list{padding:6px 8px}
  .ds-item{gap:12px;padding:12px 10px}
  .ds-thumb{width:56px;height:56px}
  .ds-info strong{font-size:14px;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.45}
  .ds-dl{padding:8px 13px;font-size:12.5px}
  .ds-foot{padding:14px 20px 18px}
}

/* ---------- 响应式 ---------- */
@media(max-width:1100px){
  .dl-grid{grid-template-columns:1fr}
  .page-hero{padding:80px 0 60px}
  .section{padding:80px 0}
}
@media(max-width:768px){
  .page-hero{padding:60px 0 48px}
  .section{padding:60px 0}
  .sec-head{margin-bottom:36px}
  .dl{padding:22px 20px;gap:14px}
}
