/* ============================================================
   联捷物流清关 · 官网基础样式
   令牌来源：brand/system.css（色彩、形状、字体栈与品牌规范一致，
   字号按屏幕阅读放大：规范里的 12/17/28/54 对应网页 16/20/36/64）
   ============================================================ */
:root{
  --red:#D40D18;
  --red-deep:#9E0A11;
  --ink:#1B1A1D;
  --white:#FFFFFF;
  --warm:#F4F2EF;
  --line:#DCD9D4;
  --gray:#8C8A86;       /* 仅用于大号或装饰性文字，对比度不足以做正文 */
  --gray-d:#57555A;     /* 次级正文、注释 */
  --ok:#1F7A4D;
  --wait:#B4761A;

  --han:"Source Han Sans SC","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --num:"Barlow","DIN Alternate","Helvetica Neue",Arial,sans-serif;

  --f-display:clamp(36px,4.4vw,56px);
  --f-h1:clamp(28px,3.4vw,36px);
  --f-h2:20px;
  --f-body:16px;
  --f-label:12px;
  --f-note:13px;

  --r-btn:8px;
  --r-card:12px;
  --cut:28px;           /* 30° 切角宽度；高度 = 宽度 × 0.577 */
  --wrap:1200px;
  --gutter:clamp(20px,4vw,48px);
}

*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{background:var(--white);color:var(--ink);font-family:var(--han);font-size:var(--f-body);line-height:1.75}
/* 英文/土耳其语页面：拉丁字体优先，保证粗体与 İ/ğ/ş 等字形正确 */
html:lang(en) body,html:lang(tr) body{font-family:"Helvetica Neue",Arial,var(--han)}
img,svg{display:block;max-width:100%;height:auto}   /* height:auto 防止 HTML 的 width/height 属性把图拉变形 */
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.num{font-family:var(--num);font-variant-numeric:tabular-nums;font-weight:600}
.red{color:var(--red)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;border-radius:var(--r-btn);z-index:99}
.skip:focus{left:8px}

/* ---------- 文字组件 ---------- */
.label{font-size:var(--f-label);letter-spacing:.18em;font-weight:700;color:var(--gray-d);text-transform:uppercase}
.label.red{color:var(--red)}
.dash{display:flex;align-items:center;gap:14px;font-size:var(--f-label);letter-spacing:.18em;color:var(--gray-d)}
.dash::before,.dash::after{content:"";height:1px;width:40px;background:currentColor;opacity:.5}
.h-display{font-size:var(--f-display);font-weight:900;line-height:1.12;letter-spacing:.02em;text-wrap:balance}
.h1{font-size:var(--f-h1);font-weight:900;line-height:1.25;letter-spacing:.02em;text-wrap:balance}
.nw{white-space:nowrap}   /* 标题里不允许拆开的短语 */
.h2{font-size:var(--f-h2);font-weight:700;line-height:1.45}
.h-display em,.h1 em{font-style:normal;color:var(--red)}
.lead{font-size:18px;line-height:1.85;color:var(--gray-d);max-width:34em}
.txt{color:var(--gray-d)}
.note{font-size:var(--f-note);line-height:1.7;color:var(--gray-d)}

/* ---------- 按钮 ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 24px;
  border:0;border-radius:var(--r-btn);background:var(--red);color:#fff;font-weight:700;letter-spacing:.06em;
  cursor:pointer;transition:background 200ms ease-out;white-space:nowrap}
.btn:hover{background:var(--red-deep)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn.ghost:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.btn.sm{height:40px;padding:0 18px;font-size:14px}

/* ---------- 形状母题 ---------- */
.cut{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)*.577),calc(100% - var(--cut)) 100%,0 100%)}
.card{background:var(--warm);border-radius:var(--r-card);padding:28px}
.card.top-red{border-top:2px solid var(--red);border-radius:0 0 var(--r-card) var(--r-card)}
.rule{height:1px;background:var(--line)}

/* ---------- 区块 ---------- */
.section{padding:clamp(64px,9vw,112px) 0}
.section.warm{background:var(--warm)}
.section-head{display:grid;gap:14px;margin-bottom:48px;max-width:720px}

/* ---------- 超窄屏（≤380px，如 iPhone SE）---------- */
@media (max-width:380px){
  :root{--gutter:16px;--f-display:clamp(30px,8.4vw,40px)}
  .btn{padding-left:18px;padding-right:18px}
}

/* 手机上小号标签字略微放大，12px 在手机屏上偏小 */
@media (max-width:600px){.label,.dash{font-size:13px}}