/* ==========================================================================
   祥达尔 XDE · page-level components
   ========================================================================== */

/* ---------- 车队深色带 ---------- */
.fleet-band{position:relative;background:var(--ink);color:#fff;overflow:hidden}
.fleet-band .bgimg{position:absolute;inset:0;opacity:.22}
.fleet-band .bgimg img{width:100%;height:100%;object-fit:cover;object-position:50% 52%;filter:grayscale(.25)}
.fleet-band::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(14,16,19,.97) 0%,rgba(14,16,19,.86) 46%,rgba(14,16,19,.55) 100%);
}
.fleet-band>.wrap>.in{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(40px,6vw,90px);align-items:center}
.fleet-band h2{color:#fff}
/* 与 .sec 对齐：板块纵向留白收紧一半 */
.fleet-band{padding-top:clamp(34px,4vw,60px);padding-bottom:clamp(34px,4vw,60px)}
.fleet-lead{
  font-size:clamp(18px,1.55vw,22px);font-weight:700;letter-spacing:-.015em;
  line-height:1.55;color:#fff;max-width:20ch;margin-bottom:30px;
}
.big50{
  font-size:clamp(88px,12vw,170px);font-weight:900;line-height:.82;letter-spacing:-.055em;
  color:#fff;display:flex;align-items:flex-start;gap:14px;
}
.big50 u{text-decoration:none;font-size:.19em;font-weight:700;letter-spacing:.02em;color:rgba(255,255,255,.45);padding-top:.9em;line-height:1.4}
.fleet-band .cap{margin-top:26px;font-size:13.5px;color:rgba(255,255,255,.45);letter-spacing:.02em}
.fleet-band .rules{margin-top:34px;border-top:1px solid rgba(255,255,255,.14)}
.fleet-band .rules .r{
  display:grid;grid-template-columns:34px 1fr auto;gap:16px;align-items:center;
  padding:20px 0;border-bottom:1px solid rgba(255,255,255,.1);
}
.fleet-band .rules .r i{
  font-style:normal;font-family:var(--mono);font-size:10.5px;color:var(--orange);letter-spacing:.1em;
}
.fleet-band .rules .r b{color:#fff;font-size:15px;font-weight:700;display:block;margin-bottom:2px}
.fleet-band .rules .r p{font-size:12.5px;color:rgba(255,255,255,.45);line-height:1.6}
.fleet-band .rules .r em{font-style:normal;color:rgba(255,255,255,.6);font-family:var(--mono);font-size:11px;letter-spacing:.06em;white-space:nowrap}

/* ---------- 口岸 ---------- */
.port-grid .port .code{
  position:absolute;right:22px;top:20px;font-size:54px;font-weight:900;letter-spacing:-.05em;
  color:var(--bone-2);line-height:1;pointer-events:none;transition:color .4s var(--ease);
}
.port-grid .port:hover .code{color:#E4DFD6}
.port-grid .port h3{position:relative;z-index:1}

/* ---------- 数据条 ---------- */
.stats-band{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stats-band .s{padding:34px 26px;border-left:1px solid var(--line)}
.stats-band .s:first-child{border-left:none;padding-left:0}
.stats-band .s b{display:block;font-size:clamp(30px,3.4vw,46px);font-weight:800;letter-spacing:-.03em;color:var(--ink);line-height:1}
.stats-band .s b em{color:var(--orange);font-size:.5em;font-weight:700;margin-left:4px}
.stats-band .s span{display:block;margin-top:10px;font-size:12px;color:var(--gray);letter-spacing:.06em}

/* ---------- 双栏内容 ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:center}
.split.wide-left{grid-template-columns:1.25fr 1fr}
.split-img{overflow:hidden}
.split-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.split-copy .lead{margin-top:18px}
.checks{list-style:none;margin-top:28px;display:grid;gap:14px}
.checks li{display:grid;grid-template-columns:18px 1fr;gap:12px;font-size:14px;color:var(--gray);line-height:1.7}
.checks li::before{
  content:"";width:6px;height:6px;background:var(--orange);margin-top:9px;
}

/* ---------- 关于页时间轴 ---------- */
.tl{position:relative;border-top:1px solid var(--line-2);margin-top:10px}
.tl .row{
  display:grid;grid-template-columns:120px 1fr 1.2fr;gap:32px;
  padding:30px 0;border-bottom:1px solid var(--line);
}
.tl .yr{font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--ink);line-height:1}
.tl .yr.now{color:var(--orange)}
.tl b{font-size:15.5px;color:var(--ink);display:block;margin-bottom:4px}
.tl p{font-size:13.5px;color:var(--gray);line-height:1.7}

/* ---------- 资质卡 ---------- */
.cert{
  display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:center;
  border:1px solid var(--line);background:var(--paper);padding:20px;
}
.cert img{width:100%;border:1px solid var(--line)}
.cert h4{margin-bottom:8px}
.cert p{font-size:13px;color:var(--gray);line-height:1.7;margin-bottom:10px}
.cert .tagx{
  display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  color:var(--orange);border:1px solid #F3C7B7;background:var(--orange-l);padding:3px 8px;
}
.cert .tagx.pending{color:var(--gray);border-color:var(--line-2);background:var(--bone)}

/* ---------- 服务详情块 ---------- */
.svc-block{padding:clamp(28px,3.4vw,48px) 0;border-bottom:1px solid var(--line)}
.svc-block:last-child{border-bottom:none}
.svc-head{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,70px);align-items:end;margin-bottom:44px}
.svc-head .no{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--gray-2);margin-bottom:14px}
.svc-head h2{font-size:clamp(26px,3.2vw,42px)}
.svc-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,60px)}
.svc-fig{overflow:hidden;position:relative}
.svc-fig img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/10;transition:transform 1.2s var(--ease)}
.svc-fig:hover img{transform:scale(1.03)}
.svc-fig .lb{
  position:absolute;left:0;bottom:0;background:var(--ink);color:rgba(255,255,255,.7);
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;padding:10px 14px;
}

/* ---------- 品牌片页 ---------- */
.film-page{background:var(--ink);padding:0 0 clamp(56px,7vw,96px)}
.film-page .player{width:100%;aspect-ratio:2.22/1;background:#08090b;position:relative;overflow:hidden}
.film-page .player img{width:100%;height:100%;object-fit:cover;opacity:.85}
.film-page .player video{display:block;width:100%;height:100%;background:#08090b;outline:none;object-fit:contain}
.film-page .player .ph{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:16px;text-align:center;padding:24px;background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.7));
}
.film-page .player .ph b{color:#fff;font-size:clamp(18px,2.4vw,26px);font-weight:800}
.film-page .player .ph span{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:rgba(255,255,255,.5)}

/* ---------- 客户端 logo 墙 ---------- */
.client-wall{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.client-wall .c{
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  height:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  color:#A8ACB1;transition:color .3s,background .3s;
}
.client-wall .c:hover{color:var(--ink);background:var(--bone)}
.client-wall .c b{font-size:16px;font-weight:800;letter-spacing:.02em}
.client-wall .c span{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:#C3C6CA}

/* ---------- 表单页 ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(36px,5vw,80px);align-items:start}
.contact-info .blk{border-top:1px solid var(--line);padding:22px 0}
.contact-info .blk span{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;color:var(--gray-2);display:block;margin-bottom:8px}
.contact-info .blk b{font-size:18px;color:var(--ink);font-weight:700;letter-spacing:-.01em;display:block;line-height:1.5}
.contact-info .blk b.big{font-size:30px;color:var(--orange)}
.contact-info .blk p{font-size:13.5px;color:var(--gray);margin-top:4px}
form.light{background:var(--bone);border:1px solid var(--line);padding:clamp(26px,3.4vw,44px)}
form.light .field label{color:var(--gray)}
form.light .field input,form.light .field select,form.light .field textarea{
  border-bottom-color:var(--line-2);color:var(--ink);
}
form.light .field input::placeholder,form.light .field textarea::placeholder{color:#B4B8BD}
form.light .field select option{background:#fff;color:var(--ink)}
form.light .tip{color:var(--gray-2)}
form.light .ok b{color:var(--ink)}
form.light .ok p{color:var(--gray)}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .fleet-band>.wrap>.in{grid-template-columns:1fr;gap:36px}
  .split,.split.wide-left,.svc-body,.svc-head,.contact-grid{grid-template-columns:1fr}
  .stats-band{grid-template-columns:repeat(2,1fr)}
  .stats-band .s:nth-child(odd){border-left:none;padding-left:0}
  .stats-band .s{border-top:1px solid var(--line)}
  .tl .row{grid-template-columns:88px 1fr;gap:16px}
  .tl .row p{grid-column:1/-1}
  .cert{grid-template-columns:1fr}
  .client-wall{grid-template-columns:repeat(2,1fr)}
  .big50{font-size:clamp(72px,20vw,120px)}
}

/* 深色区块之间收紧留白 */
.film{padding-bottom:clamp(34px,4vw,60px)}

/* 内联栅格在窄屏回退 */
@media (max-width:900px){
  .grid.g2,.grid.g3,.grid-certs{grid-template-columns:1fr !important}
  .split-img img{aspect-ratio:16/10}
  .film-page .player{aspect-ratio:2.22/1}
}

/* 修正表格 min-content 撑破栅格 */
.svc-body>*,.split>*,.film-in>*,.cta-in>*,.contact-grid>*,.grid2>*{min-width:0}
.spec{table-layout:fixed}
.spec td,.spec th{word-break:break-word;overflow-wrap:anywhere}
.prose{min-width:0}


/* ---------- 03 自有车 & 综合运力：外调运力这一层用蓝色区分 ---------- */
.fleet-band .cap b{color:var(--blue-l);font-weight:600}
/* Slogan 长度超过 20ch 限制，去掉限宽避免末字落单 */
.fleet-band .fleet-lead{max-width:none}
.fleet-band .fleet-sub{
  margin:-14px 0 0;max-width:38ch;
  font-size:13px;line-height:1.75;letter-spacing:.02em;
  color:rgba(255,255,255,.55);
}
.fleet-band .rules-hd{
  margin-top:32px;display:flex;align-items:center;gap:9px;
  font-size:12.5px;font-weight:700;letter-spacing:.08em;color:var(--blue-l);
}
.fleet-band .rules-hd::before{content:"";display:block;width:5px;height:5px;border-radius:50%;background:var(--blue-l)}
.fleet-band .rules-hd + .rules{margin-top:14px}
@media (max-width:900px){
  .fleet-band .fleet-sub{margin-top:10px;max-width:none}
  .fleet-band .rules-hd{margin-top:28px}
}

/* 说明：.in 同时是「滚动入场」的状态类，布局选择器必须限定到直接子级，
   否则区块内的 .rv.in 会被当成栅格容器拆成两栏。 */
