/* ============================================================
   Platform Harbor(v3.67.0)— 港口舱单式平台主题
   设计系统:冷调纸白 + 深板岩墨 + 信号橙(仅 LIVE/CTA 语义色);
   展示字体 Barlow Condensed,正文 Barlow(本地 woff2,中文回退系统字体)。
   视觉原则:租户截图是页面唯一彩色来源,平台 chrome 保持安静。
   兼容:保留 bento 系类名(sec/tile/cap-*/ftab/panel-form/fgrid…),
   继承的 products/detail/contact/knowledge/distributor/page 模板直接套用本皮肤。
   ============================================================ */

@font-face { font-family:'Barlow'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/barlow-400.woff2') format('woff2'); }
@font-face { font-family:'Barlow'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/barlow-500.woff2') format('woff2'); }
@font-face { font-family:'Barlow'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/barlow-600.woff2') format('woff2'); }
@font-face { font-family:'Barlow'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/barlow-700.woff2') format('woff2'); }
@font-face { font-family:'Barlow Condensed'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/barlowcond-500.woff2') format('woff2'); }
@font-face { font-family:'Barlow Condensed'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/barlowcond-600.woff2') format('woff2'); }
@font-face { font-family:'Barlow Condensed'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/barlowcond-700.woff2') format('woff2'); }

:root {
  --bg:#F2F4F1; --card:#FFFFFF; --ink:#1C2733; --muted:#5A6672;
  --line:#D7DCD5; --acc:#E85D04; --harbor:#10202E; --harbor-line:rgba(255,255,255,.13);
  --tile:#FFFFFF; --radius:4px;
  --sans:'Barlow',-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;
  --cond:'Barlow Condensed','Barlow','PingFang SC','Microsoft YaHei',sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--sans); background:var(--bg); color:var(--ink); line-height:1.55; font-size:16px; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
.container { max-width:1240px; margin:0 auto; padding:0 32px; }
.num { font-variant-numeric:tabular-nums; }

/* ---------- 出发动态条(departures ticker) ---------- */
.ticker { background:var(--harbor); color:#C6D2DC; overflow:hidden; display:flex; align-items:stretch; height:40px; font-size:12.5px; }
.ticker-label { flex:none; display:flex; align-items:center; gap:8px; padding:0 18px; background:rgba(255,255,255,.06); font-family:var(--cond); font-weight:600; letter-spacing:.14em; font-size:12px; border-right:1px solid var(--harbor-line); color:#E7EDF2; }
.ticker-label i { width:6px; height:6px; border-radius:50%; background:var(--acc); animation:pulse 2.4s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.35} }
.ticker-view { flex:1; overflow:hidden; }
.ticker-run { display:flex; height:40px; align-items:center; width:max-content; animation:run 46s linear infinite; }
.ticker-run span { padding:0 26px; border-left:1px solid var(--harbor-line); white-space:nowrap; }
.ticker-run b { color:#fff; font-weight:600; }
@keyframes run { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ---------- 导航 ---------- */
.nav { position:sticky; top:0; z-index:100; background:var(--bg); border-bottom:1px solid var(--line); }
.nav-in { display:flex; align-items:center; height:64px; gap:40px; }
.logo { font-family:var(--cond); font-weight:700; font-size:22px; letter-spacing:.045em; display:flex; align-items:center; gap:9px; }
.logo i.mk { width:10px; height:10px; background:var(--acc); border-radius:1px; flex:none; }
.nav-links { display:flex; gap:28px; margin-left:auto; align-items:center; }
.nav-links a { font-size:14.5px; color:var(--muted); font-weight:500; }
.nav-links a:hover, .nav-links a.active { color:var(--ink); }
.pill { background:var(--acc); color:#fff; padding:.5rem 1.15rem; border-radius:var(--radius); font-size:14.5px; font-weight:600; }
.pill:hover { background:#cf5003; }
.lang-sw { display:flex; gap:.5rem; font-size:.75rem; font-weight:700; }
.lang-sw a { color:var(--muted); }
.lang-sw a.on { color:var(--acc); }

/* ---------- 按钮 ---------- */
.btn { display:inline-flex; align-items:center; padding:.68rem 1.35rem; border-radius:var(--radius); font-size:14.5px; font-weight:600; cursor:pointer; border:1px solid transparent; font-family:inherit; transition:background .15s,color .15s,border-color .15s; }
.btn-p { background:var(--acc); color:#fff; }
.btn-p:hover { background:#cf5003; }
.btn-ghost { background:transparent; color:var(--ink); border-color:var(--ink); }
.btn-ghost:hover { background:var(--ink); color:#fff; }
.btn-sm { padding:.42rem 1rem; font-size:13px; }

/* ---------- 首屏 hero + 硬指标 ---------- */
.hero-h { padding:72px 0 56px; }
.h1 { font-family:var(--cond); font-weight:700; font-size:clamp(46px,6.4vw,84px); line-height:.98; max-width:13ch; }
.lede { margin-top:26px; max-width:62ch; font-size:17.5px; color:var(--muted); }
.lede b { color:var(--ink); font-weight:600; }
.hero-cta { margin-top:30px; display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.hero-cta .note { font-size:13px; color:var(--muted); }
.stats { margin-top:52px; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.stat { padding:20px 24px 18px; border-left:1px solid var(--line); }
.stat:first-child { border-left:none; padding-left:0; }
.stat .n { font-family:var(--cond); font-weight:700; font-size:42px; line-height:1; display:block; }
.stat .l { display:block; margin-top:6px; font-size:12.5px; color:var(--muted); }

/* ---------- 区块头 ---------- */
.sec { padding:72px 0; }
.sec-tight { padding-top:8px; }
.kick { color:var(--acc); font-weight:700; font-size:.78rem; text-transform:uppercase; letter-spacing:.18em; margin-bottom:.8rem; }
.h2 { font-family:var(--cond); font-weight:700; font-size:clamp(30px,3.4vw,44px); line-height:1.04; }
.lead { color:var(--muted); max-width:62ch; font-size:16.5px; }
.sec-head { display:flex; align-items:baseline; justify-content:space-between; gap:32px; margin-bottom:30px; flex-wrap:wrap; }
.sec-head .side { font-size:13.5px; color:var(--muted); max-width:44ch; }
.sec-head .side a { color:var(--ink); font-weight:600; border-bottom:1px solid var(--ink); }

/* ---------- 成果墙(会员站点) ---------- */
.wall { display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.site { grid-column:span 2; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; transition:border-color .15s; }
.site.wide { grid-column:span 3; }
.site:hover { border-color:var(--muted); }
.site .shot { width:100%; aspect-ratio:1200/760; object-fit:cover; background:#E7EAE6; }
/* v3.68.3:租户 logo 不再套用截图的 cover —— cover 会把 logo 放大铺满并裁边(观感"太大")。
   结构改为「标牌 + 受限标记」:标牌保持与截图一致的 1200:760 占位(卡片高度不塌),
   标记最多占标牌的 52%×52%、居中、不裁切 —— 它是"品牌标记",不是"门面截图"。
   注:百分比上限能生效,是因为标牌高度由 aspect-ratio 确定(不是 auto)。
   截图(运营配图)继续用上面的 .shot cover。 */
.site .plate { width:100%; aspect-ratio:1200/760; background:#E7EAE6; display:flex; align-items:center; justify-content:center; }
.site .logo-mark { max-width:52%; max-height:52%; width:auto; height:auto; }
.site .ph { width:100%; aspect-ratio:1200/760; background:#E7EAE6; display:flex; align-items:center; justify-content:center; color:#AEB8B0; font-size:2rem; }
.site .meta { padding:13px 16px 14px; display:flex; flex-direction:column; gap:6px; }
.code-row { display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:10px; letter-spacing:.08em; color:var(--muted); }
.code-row .cat { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.live { margin-left:auto; display:flex; align-items:center; gap:5px; flex:none; font-family:var(--cond); font-weight:600; letter-spacing:.1em; font-size:11px; color:var(--acc); }
.live i { width:6px; height:6px; border-radius:50%; background:var(--acc); }
.brand-row { display:flex; align-items:baseline; gap:10px; }
.brand-row h3 { font-size:16px; font-weight:600; }
.brand-row .ind { font-size:12.5px; color:var(--muted); }
.brand-row .tag { font-size:12.5px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.data-row { display:flex; gap:16px; font-size:12.5px; color:var(--muted); border-top:1px solid var(--line); padding-top:8px; margin-top:2px; }
.data-row b { color:var(--ink); font-weight:600; }
.site.ghost { border-style:dashed; background:transparent; justify-content:center; align-items:center; text-align:center; min-height:280px; gap:14px; padding:24px; }
.site.ghost .big { font-family:var(--cond); font-weight:700; font-size:26px; line-height:1.1; }
.site.ghost p { font-size:13.5px; color:var(--muted); max-width:26ch; }

/* ---------- 产品精选 ---------- */
.picks { display:grid; grid-auto-flow:column; grid-auto-columns:250px; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px; }
.pick { scroll-snap-align:start; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.pick .art { aspect-ratio:5/4; display:flex; align-items:center; justify-content:center; background:#EBEEEA; border-bottom:1px solid var(--line); overflow:hidden; }
.pick .art img { width:100%; height:100%; object-fit:cover; }
.pick .art .ph { color:#AEB8B0; font-size:2.2rem; }
.pick .meta { padding:12px 14px 14px; }
.pick h3 { font-size:14.5px; font-weight:600; }
.pick .from { font-size:12px; color:var(--muted); margin-top:2px; }
.pick .terms { display:flex; gap:12px; margin-top:9px; padding-top:8px; border-top:1px solid var(--line); font-size:11.5px; color:var(--muted); font-variant-numeric:tabular-nums; }
.pick .terms b { color:var(--ink); font-weight:600; }

/* ---------- 插件机架(一切皆插件) ---------- */
.rack { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.plug { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:0 0 16px; display:flex; flex-direction:column; min-height:190px; }
.plug .rail { height:7px; background:repeating-linear-gradient(90deg,var(--line) 0 2px,transparent 2px 10px); border-bottom:1px solid var(--line); border-radius:var(--radius) var(--radius) 0 0; }
.plug .in { padding:14px 16px 0; display:flex; flex-direction:column; flex:1; }
.bay { font-family:var(--mono); font-size:10px; letter-spacing:.1em; color:var(--muted); }
.plug h3 { font-family:var(--cond); font-weight:700; font-size:21px; line-height:1.05; margin-top:6px; }
.plug p { font-size:13.5px; color:var(--muted); margin-top:7px; flex:1; }
.chip-row { margin-top:12px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.chip-st { font-family:var(--cond); font-weight:600; font-size:11px; letter-spacing:.12em; padding:3px 8px 2px; border-radius:2px; border:1px solid var(--line); color:var(--muted); }
.chip-st.pro { background:var(--ink); color:#fff; border-color:var(--ink); }
.chip-st.metered { color:var(--ink); border-color:var(--ink); }
.chip-row .hint { font-size:11.5px; color:var(--muted); }

/* ---------- 步骤 ---------- */
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; }
.step { border-top:2px solid var(--ink); padding-top:16px; }
.step .n { font-family:var(--cond); font-weight:700; font-size:38px; line-height:1; }
.step h3 { font-size:16px; font-weight:600; margin-top:10px; }
.step p { font-size:13.5px; color:var(--muted); margin-top:5px; }

/* ---------- 公开规则表 ---------- */
.rank { display:grid; grid-template-columns:5fr 7fr; gap:56px; align-items:start; }
.rank .left p { color:var(--muted); font-size:16px; margin-top:18px; max-width:46ch; }
.rank .left p b { color:var(--ink); font-weight:600; }
table.rules-t { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
table.rules-t th { font-family:var(--cond); font-weight:600; font-size:13px; letter-spacing:.1em; text-align:left; color:var(--muted); padding:12px 18px; border-bottom:1px solid var(--line); }
table.rules-t td { padding:15px 18px; border-bottom:1px solid var(--line); font-size:14.5px; vertical-align:top; }
table.rules-t tr:last-child td { border-bottom:none; }
table.rules-t td:first-child { font-weight:600; width:32%; }
table.rules-t td:last-child { color:var(--muted); }
table.rules-t tr.g td { background:#FAFBF9; }

/* ---------- 定价带 ---------- */
.band { background:var(--harbor); color:#E7EDF2; border-radius:6px; padding:52px 56px; display:flex; align-items:center; gap:48px; flex-wrap:wrap; }
.band .h2 { color:#fff; max-width:22ch; }
.band p { flex:1; min-width:280px; color:#B9C6D2; font-size:15.5px; max-width:52ch; }
.band .btn { flex:none; }

/* ---------- 页脚 ---------- */
.footer { background:var(--harbor); color:#B9C6D2; margin-top:72px; }
.footer .container { padding-top:56px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; }
.footer-grid .logo { color:#fff; }
.footer-grid p { font-size:13.5px; max-width:34ch; margin-top:12px; }
.footer-grid h4 { font-family:var(--cond); font-weight:600; font-size:13px; letter-spacing:.14em; color:#8DA0B0; margin-bottom:14px; }
.footer-grid ul { list-style:none; }
.footer-grid li { margin-bottom:9px; font-size:14px; }
.footer-grid a:hover { color:#fff; }
.footer-bottom { margin-top:48px; border-top:1px solid var(--harbor-line); padding:18px 0 22px; display:flex; justify-content:space-between; gap:20px; font-size:12.5px; flex-wrap:wrap; }

/* ============================================================
   bento 系兼容类:继承模板(products/detail/contact/knowledge/
   distributor/page)沿用原类名,套港口皮肤。
   ============================================================ */
.tile { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; }
.tile.wide { grid-column:span 2; }
.tile.dark { background:var(--harbor); color:#E7EDF2; border-color:var(--harbor); }
.tile.blue { background:var(--acc); color:#fff; border-color:var(--acc); }
.tile .big { font-size:1.5rem; font-weight:700; letter-spacing:-.01em; }
.tile .num { font-family:var(--cond); font-size:2.6rem; font-weight:700; letter-spacing:0; }
.tile .lbl { font-size:.78rem; color:var(--muted); }
.tile.dark .lbl, .tile.blue .lbl { color:rgba(255,255,255,.7); }
.tile p.d { font-size:.87rem; color:var(--muted); margin-bottom:.8rem; }
.tile.dark p.d, .tile.blue p.d { color:rgba(255,255,255,.75); }
.bento { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:150px; gap:1rem; }
.mini { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem; }
.mini .tile { padding:1.4rem; }
.mini h3 { font-size:1.02rem; font-weight:700; margin-bottom:.35rem; }
.mini p { color:var(--muted); font-size:.86rem; margin-bottom:.7rem; }
.cap-list { display:flex; flex-direction:column; gap:.8rem; }
.cap-item { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.2rem 1.4rem; display:grid; grid-template-columns:48px 1fr auto; gap:1.1rem; align-items:center; }
.cap-item:hover { border-color:var(--muted); }
.cap-ico { width:46px; height:46px; border-radius:var(--radius); background:#EBEEEA; border:1px solid var(--line); color:var(--ink); display:flex; align-items:center; justify-content:center; font-size:1.2rem; overflow:hidden; }
.cap-ico img { width:100%; height:100%; object-fit:cover; }
.cap-item h3 { font-size:1rem; font-weight:700; }
.cap-item .sku { color:var(--acc); font-size:.72rem; font-weight:700; }
.cap-item .desc { color:var(--muted); font-size:.85rem; }
.chips { display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.5rem; }
.chip { background:var(--bg); border:1px solid var(--line); border-radius:2px; padding:.12rem .6rem; font-size:.72rem; color:var(--muted); }
.chip b { color:var(--ink); }
.filter-tabs { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.5rem; }
.ftab { background:var(--card); border:1px solid var(--line); padding:.42rem 1rem; border-radius:var(--radius); font-size:.82rem; font-weight:600; cursor:pointer; color:var(--muted); }
.ftab.active { border-color:var(--ink); color:var(--ink); }
.panel-form { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.8rem; max-width:720px; }
.fgrid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field { display:flex; flex-direction:column; gap:.3rem; }
.field.full { grid-column:1/-1; }
.field label { font-size:.8rem; font-weight:600; color:var(--muted); }
.field input, .field textarea { font-family:inherit; font-size:.95rem; padding:.6rem .8rem; border:1px solid var(--line); border-radius:var(--radius); background:var(--bg); color:var(--ink); }
.field input:focus, .field textarea:focus { outline:2px solid var(--acc); outline-offset:0; border-color:var(--acc); }
.form-msg { margin-top:.9rem; font-size:.88rem; color:var(--acc); min-height:1.2em; }
.badge { display:inline-block; font-family:var(--cond); font-weight:600; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; border:1px solid var(--line); border-radius:2px; padding:.1rem .5rem; color:var(--muted); }
.detail { display:grid; grid-template-columns:120px 1fr; gap:2rem; align-items:start; }
.detail-ico { width:120px; height:120px; border-radius:var(--radius); background:#EBEEEA; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:2.6rem; color:var(--ink); overflow:hidden; }
.detail-ico img { width:100%; height:100%; object-fit:cover; }
.doc-list { display:flex; flex-direction:column; }
.doc-row { display:grid; grid-template-columns:auto 1fr auto; gap:1.2rem; align-items:baseline; padding:1rem 0; border-bottom:1px solid var(--line); }
.spec-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:.6rem; margin-top:1rem; }
.spec-list .chip { background:var(--bg); }

/* ---------- 响应式 ---------- */
@media (max-width:1000px) {
  .wall { grid-template-columns:repeat(2,1fr); }
  .site, .site.wide { grid-column:span 1; }
  .rack { grid-template-columns:repeat(2,1fr); }
  .steps { grid-template-columns:repeat(2,1fr); }
  .rank { grid-template-columns:1fr; gap:32px; }
  .stats { grid-template-columns:repeat(2,1fr); }
  .stat:nth-child(3) { border-left:none; padding-left:0; }
  .stat { border-top:1px solid var(--line); }
  .stat:nth-child(-n+2) { border-top:none; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .detail { grid-template-columns:1fr; }
}
@media (max-width:680px) {
  .sponsor-card { grid-template-columns:1fr; }
  .nav-links { display:none; }
  .wall { grid-template-columns:1fr; }
  .rack { grid-template-columns:1fr; }
  .steps { grid-template-columns:1fr; }
  .stats { grid-template-columns:1fr 1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .band { padding:36px 28px; }
  .fgrid { grid-template-columns:1fr; }
  .cap-item { grid-template-columns:1fr; }
  .hero-h { padding:48px 0 40px; }
}
/* ── 赞助位(v3.70.0)────────────────────────────────────────────
   付费展示区块:与成果墙/精选物理分离的独立版位。标注(.badge)由模板强制,
   样式不做任何"淡化标注"的处理 —— 中立性约定要求广告必须可识别。 */
.sponsor-card { display:grid; grid-template-columns:220px 1fr; gap:22px; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:20px 22px; }
.sponsor-card.no-art { grid-template-columns:1fr; }
.sponsor-art { width:100%; height:auto; display:block; border-radius:calc(var(--radius) - 4px); }
.sponsor-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.sponsor-by { font-family:var(--cond); font-weight:600; font-size:13px; letter-spacing:.04em; color:var(--muted); }
.sponsor-note { margin:.9rem 0 0; font-size:12.5px; color:var(--muted); max-width:70ch; }
.sponsor-px { position:absolute; left:-9999px; }

/* ── 定价页(v3.71.0)────────────────────────────────────────────
   三档卡片用 .mini/.tile 的既有外壳(与首页同源),这里只补三件事:
   卡片内容自顶对齐(.tile 默认是底对齐,适合数字卡不适合套餐卡)、
   价格行的字级、以及卖点清单的勾标。 */
.tile.price-tile { justify-content: flex-start; }
.tile.price-tile.hot { border-color: var(--acc); }
.price-amount { font-family: var(--cond); font-weight: 700; font-size: 2.1rem; line-height: 1.1; margin: .5rem 0 .1rem; }
.price-amount small { font-family: inherit; font-size: .85rem; font-weight: 600; color: var(--muted); }
.price-yearly { font-size: 12.5px; color: var(--muted); }
.price-feats { margin: 14px 0 16px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 7px; }
.price-feats li { position: relative; padding-left: 19px; font-size: 13.5px; color: var(--muted); line-height: 1.45; }
.price-feats li::before { content: "✓"; position: absolute; left: 0; color: var(--acc); font-weight: 700; }
.price-tile .btn { margin-top: auto; align-self: flex-start; }

@media (prefers-reduced-motion:reduce) {
  .ticker-run { animation:none; }
  .ticker-label i { animation:none; }
  html { scroll-behavior:auto; }
}