/* ==========================================================================
   Shanghai Setup / 沪上开办 — editorial bilingual site
   Light theme only. Warm paper, ink text, deep green accent, clay highlight.
   ========================================================================== */

:root{
  --bg:#FBFAF7;
  --paper:#FFFFFF;
  --sand:#F4F0E7;
  --ink:#12161A;
  --ink2:#3D444A;
  --muted:#6E7479;
  --faint:#9AA0A5;
  --line:#E6E1D6;
  --line2:#D5CFC1;
  --green:#0E5748;
  --green2:#146B59;
  --green-soft:#EDF3F0;
  --warm:#B4522C;
  --warm-soft:#FAF0EA;
  --r:4px;
  --wrap:1140px;
  --maxw:720px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:"Inter","Helvetica Neue",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;
  font-size:15.5px;line-height:1.7;-webkit-font-smoothing:antialiased;
  font-feature-settings:"tnum" 1,"cv11" 1;
  overflow-x:hidden;
}
html[lang="zh-CN"] body{font-size:15.5px;line-height:1.85}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
h1,h2,h3,h4,h5,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:#CFE3DB;color:#0B2E26}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}

/* ------------------------------------------------------------- typography */
h1{
  font-size:clamp(34px,4.6vw,58px);line-height:1.06;letter-spacing:-.028em;
  font-weight:600;margin:18px 0 0;
}
html[lang="zh-CN"] h1{letter-spacing:-.01em;line-height:1.2;font-size:clamp(30px,3.9vw,48px)}
h2{font-size:clamp(23px,2.5vw,32px);line-height:1.2;letter-spacing:-.022em;font-weight:600;margin:10px 0 0}
html[lang="zh-CN"] h2{letter-spacing:-.005em;line-height:1.35}
h3{font-size:18px;line-height:1.4;letter-spacing:-.012em;font-weight:600}
.lead{font-size:17.5px;line-height:1.68;color:var(--ink2);max-width:34em;margin-top:22px}
html[lang="zh-CN"] .lead{line-height:1.85}
.lead.sm{font-size:16px}
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--green);
}
html[lang="zh-CN"] .eyebrow{letter-spacing:.1em}
.eyebrow::before{content:"";width:5px;height:5px;background:var(--green);display:block;flex:none}
.hl{color:var(--green);position:relative;white-space:nowrap}
.hl::after{
  content:"";position:absolute;left:0;right:0;bottom:.06em;height:.38em;
  background:linear-gradient(180deg,rgba(180,82,44,.16),rgba(180,82,44,.16));
  z-index:-1;
}
.note{color:var(--muted);font-size:13.5px;margin-top:16px;max-width:64em}
.mt{margin-top:56px}
.mini{font-size:13px;color:var(--muted);margin-top:22px;max-width:32em}

/* ------------------------------------------------------------------ buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 24px;background:var(--ink);color:#fff;border-radius:var(--r);
  font-size:14px;font-weight:500;letter-spacing:.01em;border:1px solid var(--ink);
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}
.btn:hover{background:var(--green);border-color:var(--green);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line2)}
.btn.ghost:hover{background:transparent;border-color:var(--ink);color:var(--ink);transform:translateY(-1px)}
.btn-sm{padding:9px 16px;font-size:13px}
.btn-block{display:flex;width:100%}

/* ------------------------------------------------------------------ topbar */
.topbar{background:var(--ink);color:#D8D3C8;font-size:12px;letter-spacing:.02em}
.topbar .tb{display:flex;align-items:center;gap:10px;height:34px;flex-wrap:wrap;overflow:hidden}
.topbar a:hover{color:#fff}
.topbar i{color:#5B6166;font-style:normal}
.tb-wx{margin-left:auto;color:#8F969B}
.tb-wx b{color:#D8D3C8;font-weight:500}

/* ------------------------------------------------------------------ header */
.hd{position:sticky;top:0;z-index:60;background:rgba(251,250,247,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.hd-in{display:flex;align-items:center;gap:28px;height:72px}
.brand{display:flex;align-items:center;gap:11px;flex:none}
.bmark{
  width:34px;height:34px;border-radius:3px;background:var(--green);color:#fff;
  display:grid;place-items:center;font-size:15px;font-weight:600;letter-spacing:-.02em;
}
.btxt{display:flex;flex-direction:column;line-height:1.15}
.btxt b{font-size:15.5px;font-weight:600;letter-spacing:-.015em}
.btxt em{font-style:normal;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.nav{display:flex;align-items:center;gap:24px;margin-left:auto}
.nav a{font-size:13.5px;color:var(--ink2);position:relative;padding:4px 0;white-space:nowrap}
.nav a:hover{color:var(--green)}
.nav a.on{color:var(--ink);font-weight:600}
.nav a.on::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--green)}
.hd-act{display:flex;align-items:center;gap:12px;flex:none}
.langsw{
  font-size:12px;letter-spacing:.06em;color:var(--muted);border:1px solid var(--line2);
  padding:5px 10px;border-radius:100px;transition:.18s;
}
.langsw:hover{color:var(--green);border-color:var(--green)}
.burger{display:none;width:36px;height:36px;flex-direction:column;justify-content:center;gap:5px;align-items:center}
.burger span{display:block;width:17px;height:1.6px;background:var(--ink);transition:.2s}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3.3px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3.3px) rotate(-45deg)}

/* -------------------------------------------------------------------- hero */
.hero{padding:72px 0 64px;border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.hero::before{
  content:"";position:absolute;right:-160px;top:-120px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(14,87,72,.06),rgba(14,87,72,0) 68%);pointer-events:none;
}
.hero-in{display:block;position:relative}
.hero-in.two{display:grid;grid-template-columns:1.12fr .88fr;gap:64px;align-items:start}
.hero-txt{max-width:640px}
.acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
.facts{display:flex;gap:44px;margin-top:44px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:24px}
.facts li b{display:block;font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.facts li span{display:block;font-size:12px;color:var(--muted);margin-top:4px;max-width:15em}
.p-home .hero{padding:84px 0 76px}
.p-home h1{font-size:clamp(36px,5vw,62px)}

/* route card */
.route-card{
  background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:30px 28px 26px;
  box-shadow:0 1px 2px rgba(18,22,26,.04),0 18px 48px -28px rgba(18,22,26,.22);
}
.rc-hd{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--warm);font-weight:600}
.route-card h3{font-size:20px;margin-top:10px;letter-spacing:-.015em}
.route{margin-top:22px;display:flex;flex-direction:column;gap:0}
.route li{display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--line);align-items:flex-start}
.route li:first-child{border-top:0;padding-top:4px}
.route .rn{
  width:24px;height:24px;border-radius:50%;background:var(--green-soft);color:var(--green);
  display:grid;place-items:center;font-size:12px;font-weight:600;flex:none;margin-top:1px;
}
.route li b{font-size:14.5px;font-weight:600;display:block}
.route li p{font-size:12.5px;color:var(--muted);line-height:1.55;margin-top:3px}
.route li em{font-style:normal;font-size:11.5px;color:var(--ink2);white-space:nowrap;margin-left:auto;padding-left:10px;font-weight:500}
.rc-note{font-size:12.5px;color:var(--muted);line-height:1.6;margin:18px 0 20px;padding-top:16px;border-top:1px dashed var(--line2)}

/* ------------------------------------------------------------------- strip */
.strip{border-bottom:1px solid var(--line);background:var(--sand)}
.strip-in{display:flex;align-items:center;gap:18px;height:46px;flex-wrap:wrap;font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink2);overflow:hidden}
.strip-in i{width:3px;height:3px;background:var(--line2);border-radius:50%}
html[lang="zh-CN"] .strip-in{letter-spacing:.06em;text-transform:none;font-size:12px}

/* ------------------------------------------------------------------ section */
.sec{padding:78px 0}
.sec.alt{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:44px;flex-wrap:wrap}
.sec-hd>div{max-width:640px}
.sec-hd>p{max-width:30em;font-size:14.5px;color:var(--muted);line-height:1.7;padding-bottom:4px}

/* service cards */
.grid3{display:grid;gap:26px}
.svc-g{grid-template-columns:repeat(3,1fr)}
.svc{
  display:block;background:var(--paper);border:1px solid var(--line);border-radius:5px;
  padding:30px 26px 26px;transition:border-color .2s,transform .2s,box-shadow .2s;
}
.sec.alt .svc{background:var(--bg)}
.svc:hover{border-color:var(--green);transform:translateY(-3px);box-shadow:0 16px 40px -30px rgba(14,87,72,.5)}
.svc .n{font-size:11px;font-weight:600;letter-spacing:.16em;color:var(--warm)}
.svc h3{margin-top:14px;font-size:20px;letter-spacing:-.015em}
.svc p{font-size:14px;color:var(--ink2);line-height:1.7;margin-top:12px}
.svc-meta{font-size:12.5px;color:var(--green);font-weight:500;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.svc-lk{display:inline-block;font-size:12.5px;color:var(--ink2);margin-top:10px;transition:.18s}
.svc:hover .svc-lk{color:var(--green);transform:translateX(3px)}
.plain-g .blk{background:var(--paper);border:1px solid var(--line);border-radius:5px;padding:26px}
.sec.alt .plain-g .blk{background:var(--bg)}
.plain-g .blk p{font-size:14px;color:var(--ink2);margin-top:12px}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.step{border-top:2px solid var(--ink);padding-top:18px}
.step .snum{font-size:11px;font-weight:600;letter-spacing:.14em;color:var(--warm)}
.step h4{font-size:15.5px;font-weight:600;margin-top:10px;letter-spacing:-.01em}
.step p{font-size:13.5px;color:var(--muted);line-height:1.68;margin-top:9px}

/* why */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 56px}
.why{display:flex;gap:18px;padding:26px 0;border-top:1px solid var(--line)}
.why:nth-child(-n+2){border-top:0}
.why .wk{font-size:11px;font-weight:600;letter-spacing:.12em;color:var(--faint);padding-top:3px}
.why h3{font-size:16.5px}
.why p{font-size:14px;color:var(--ink2);margin-top:8px;line-height:1.72}

/* myth */
.myth-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.myth{background:var(--bg);border:1px solid var(--line);border-left:3px solid var(--warm);border-radius:4px;padding:24px 22px}
.sec.alt .myth{background:var(--paper)}
.m-q{font-size:14.5px;line-height:1.6;color:var(--ink2);font-style:italic}
.m-a{font-size:13.5px;line-height:1.75;color:var(--ink);margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.m-a span{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--warm);font-weight:600;margin-bottom:7px}

/* cta band */
.cta{background:var(--green);color:#EDF3F0;padding:74px 0}
.cta .eyebrow{color:#A9C9BE}
.cta .eyebrow::before{background:#A9C9BE}
.cta h2{color:#fff}
.cta p{color:#C7DAD2;margin-top:16px;font-size:15.5px;max-width:32em}
.cta-in{display:grid;grid-template-columns:1fr .82fr;gap:64px;align-items:start}
.cta-pts{margin-top:26px;display:flex;flex-direction:column;gap:10px}
.cta-pts li{font-size:13.5px;color:#BFD5CC;padding-left:18px;position:relative}
.cta-pts li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border:1px solid #7FA296;transform:rotate(45deg)}

/* -------------------------------------------------------------------- form */
.lf{background:var(--paper);color:var(--ink);border-radius:6px;padding:30px 28px;border:1px solid var(--line);box-shadow:0 24px 60px -40px rgba(0,0,0,.5)}
.cta .lf{border:0}
.lf-hd h3{font-size:19px;letter-spacing:-.015em}
.lf-hd p{font-size:13px;color:var(--muted);margin-top:7px;line-height:1.6}
.lf label{display:block;margin-top:16px}
.lf label>span{display:block;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-weight:500}
html[lang="zh-CN"] .lf label>span{text-transform:none;letter-spacing:.03em;font-size:12px}
.lf input,.lf select,.lf textarea{
  width:100%;padding:11px 13px;border:1px solid var(--line2);border-radius:3px;background:var(--bg);
  font:inherit;font-size:14px;color:var(--ink);transition:border-color .16s,background .16s;
}
.lf input:focus,.lf select:focus,.lf textarea:focus{outline:none;border-color:var(--green);background:#fff}
.lf textarea{resize:vertical;min-height:76px}
.lf select{appearance:none;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236E7479' fill='none' stroke-width='1.3'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:32px}
.lf-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.lf .btn{margin-top:22px}
.lf .btn:hover{background:var(--green)}
.lf-msg{font-size:12.5px;color:var(--warm);margin-top:10px;min-height:0}
.lf-priv{font-size:11.5px;color:var(--faint);margin-top:14px;line-height:1.6}
.lf.invalid input[name="name"],.lf.invalid input[type="email"]{border-color:var(--warm);background:var(--warm-soft)}
.lf-ok{text-align:center;padding:12px 0 4px}
.ok-mark{width:46px;height:46px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:22px;margin:0 auto 18px}
.lf-ok h3{font-size:20px}
.lf-ok p{font-size:14px;color:var(--ink2);margin-top:10px;line-height:1.7}
.lf-ok-act{display:flex;gap:10px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.lf.done .lf-hd,.lf.done>.lf-row,.lf.done>label,.lf.done>.btn,.lf.done .lf-msg,.lf.done .lf-priv{display:none}

/* ------------------------------------------------------------------- table */
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:4px;background:var(--paper);-webkit-overflow-scrolling:touch}
.tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px}
.tbl th{
  text-align:left;padding:13px 16px;background:var(--sand);font-weight:600;font-size:11.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);border-bottom:1px solid var(--line);white-space:nowrap;
}
html[lang="zh-CN"] .tbl th{letter-spacing:.02em;font-size:12px;text-transform:none}
.tbl td{padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.6;color:var(--ink2)}
.tbl tr:last-child td{border-bottom:0}
.tbl tr:hover td{background:#FCFBF8}
.tbl td:first-child{color:var(--ink);font-weight:500}
.tbl.num td:nth-child(2){font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--green);font-weight:600}
.tbl.num td:nth-child(3){white-space:nowrap}

/* ------------------------------------------------------------------ layout */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.two-col.wide-l{grid-template-columns:1.08fr .92fr}
.two-col h2{margin-bottom:6px}
.prose{margin-top:20px}
.prose p{font-size:14.5px;line-height:1.82;color:var(--ink2);margin-bottom:16px}
.prose p:last-child{margin-bottom:0}
.prose b{color:var(--ink);font-weight:600}
.two-prose{columns:2;column-gap:48px}
.prose.two-prose p{break-inside:avoid}
.sub-h{font-size:14px;margin:28px 0 12px;color:var(--warm)}

/* checklist */
.clist{display:grid;grid-template-columns:1fr 1fr;gap:0 44px;border-top:1px solid var(--line)}
.clist.tight{grid-template-columns:1fr}
.clist li{padding:16px 0 16px 26px;border-bottom:1px solid var(--line);position:relative;font-size:13.8px;line-height:1.7;color:var(--ink2)}
.clist li::before{
  content:"";position:absolute;left:2px;top:24px;width:9px;height:5px;
  border-left:1.8px solid var(--green);border-bottom:1.8px solid var(--green);transform:rotate(-45deg);
}
.clist li b{display:block;color:var(--ink);font-weight:600;font-size:14.2px;margin-bottom:3px}
.clist.neg li::before{border-color:var(--warm);transform:rotate(45deg);width:8px;height:8px;border-left:0;border-bottom:0;border-top:1.8px solid var(--warm);border-right:1.8px solid var(--warm);top:22px}

/* risk */
.risk-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:4px;overflow:hidden}
.risk{background:var(--paper);padding:26px}
.sec.alt .risk{background:var(--bg)}
.risk h3{font-size:15.5px;color:var(--ink)}
.risk h3::before{content:"";display:inline-block;width:6px;height:6px;background:var(--warm);margin-right:9px;vertical-align:2px}
.risk p{font-size:13.8px;color:var(--ink2);margin-top:9px;line-height:1.75}

/* conditions */
.cond-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.cond{border-top:2px solid var(--green);padding-top:18px}
.cond h3{font-size:15.5px}
.cond p{font-size:13.5px;color:var(--ink2);margin-top:9px;line-height:1.72}

/* faq */
.faq{border-top:1px solid var(--line);max-width:900px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  padding:19px 40px 19px 0;font-size:15.5px;font-weight:500;cursor:pointer;position:relative;list-style:none;
  letter-spacing:-.01em;transition:color .16s;
}
html[lang="zh-CN"] .faq summary{font-weight:600;font-size:15px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--green)}
.faq summary::after{
  content:"";position:absolute;right:8px;top:50%;width:9px;height:9px;
  border-right:1.4px solid var(--muted);border-bottom:1.4px solid var(--muted);
  transform:translateY(-70%) rotate(45deg);transition:transform .2s;
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.faq .ans{padding:0 60px 22px 0;font-size:14px;line-height:1.85;color:var(--ink2)}
.big-note{font-size:18px;color:var(--ink);max-width:34em}

/* pricing */
.pk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:start}
.pk{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:30px 26px;position:relative;display:flex;flex-direction:column}
.pk.hot{border-color:var(--green);box-shadow:0 24px 60px -46px rgba(14,87,72,.9)}
.pk-badge{
  position:absolute;top:-11px;right:22px;background:var(--green);color:#fff;font-size:10.5px;
  letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:100px;
}
html[lang="zh-CN"] .pk-badge{text-transform:none;letter-spacing:.04em}
.pk-hd h3{font-size:19px}
.pk-hd p{font-size:12.5px;color:var(--muted);margin-top:4px}
.pk-price{display:flex;align-items:baseline;gap:8px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.pk-price span{font-size:11px;letter-spacing:.12em;color:var(--muted)}
.pk-price b{font-size:32px;font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.pk-time{font-size:12px;color:var(--green);margin-top:4px}
.pk-list{margin-top:22px;display:flex;flex-direction:column;gap:9px;flex:1}
.pk-list li{font-size:13.2px;color:var(--ink2);line-height:1.6;padding-left:16px;position:relative}
.pk-list li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;background:var(--line2);border-radius:50%}
.pk .btn{margin-top:24px}

/* contact */
.cways{margin-top:38px;border-top:1px solid var(--line);max-width:420px}
.cways li{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line)}
.cways span{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
html[lang="zh-CN"] .cways span{text-transform:none;letter-spacing:.02em;font-size:12.5px}
.cways b{font-size:14.5px;font-weight:500}
.cways b a:hover{color:var(--green)}
.form-side .lf{padding:0;border:0;box-shadow:none;background:transparent}
.form-side{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:30px 28px;box-shadow:0 1px 2px rgba(18,22,26,.04)}
.howlist{counter-reset:h;display:grid;grid-template-columns:1fr 1fr;gap:26px 56px}
.howlist li{display:flex;gap:16px;border-top:1px solid var(--line);padding-top:18px}
.howlist .snum{font-size:11px;font-weight:600;letter-spacing:.12em;color:var(--warm);padding-top:4px}
.howlist b{font-size:15.5px;display:block}
.howlist p{font-size:13.8px;color:var(--muted);margin-top:7px;line-height:1.7}
.visit{max-width:640px}
.visit .lead{margin-bottom:26px}

/* ------------------------------------------------------------------ footer */
.ft{background:var(--ink);color:#B9B4A9;padding:64px 0 30px;font-size:13.5px}
.ft-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:48px}
.ft .brand .bmark{background:#1E4C41}
.ft .btxt b{color:#F2EFE8}
.ft .btxt em{color:#7E858A}
.ft p{margin-top:18px;line-height:1.75;color:#8F958F;max-width:26em;font-size:13px}
.ft h5{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#6F767B;font-weight:600;margin-bottom:16px}
html[lang="zh-CN"] .ft h5{text-transform:none;letter-spacing:.04em;font-size:12px}
.ft ul li{margin-bottom:10px;color:#A9AEA9}
.ft ul a:hover{color:#fff}
.ft-btm{display:flex;justify-content:space-between;gap:30px;margin-top:52px;padding-top:22px;border-top:1px solid #262B2F;font-size:11.5px;color:#6F767B;flex-wrap:wrap}
.ft-btm span{max-width:44em;line-height:1.6}

/* -------------------------------------------------------------- translate */
.tr{position:fixed;right:22px;bottom:22px;z-index:90;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.tr-fab{
  display:inline-flex;align-items:center;gap:9px;padding:12px 18px;border-radius:100px;
  background:var(--ink);color:#fff;font-size:13px;font-weight:500;
  box-shadow:0 8px 28px -12px rgba(18,22,26,.6);transition:.2s;
}
.tr-fab:hover{background:var(--green);transform:translateY(-1px)}
.tr-panel{
  width:340px;max-width:calc(100vw - 32px);background:var(--paper);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:20px;
  box-shadow:0 28px 70px -28px rgba(18,22,26,.4);
  animation:trIn .22s ease;
}
@keyframes trIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.tr-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.tr-hd b{font-size:14.5px;letter-spacing:-.01em;line-height:1.4}
.tr-x{font-size:22px;line-height:1;color:var(--muted);padding:0 2px}
.tr-x:hover{color:var(--ink)}
.tr-note{font-size:11.5px;color:var(--muted);line-height:1.6;margin-top:8px}
.tr-langs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:16px;max-height:230px;overflow:auto}
.tr-langs button{
  text-align:left;padding:8px 10px;border:1px solid var(--line);border-radius:3px;font-size:12.5px;
  color:var(--ink2);transition:.15s;background:var(--bg);
}
.tr-langs button:hover{border-color:var(--green);color:var(--green);background:var(--green-soft)}
.tr-langs button.on{border-color:var(--green);background:var(--green);color:#fff}
.tr-bar{height:2px;background:var(--line);border-radius:2px;margin-top:14px;overflow:hidden;display:none}
.tr-bar.on{display:block}
.tr-fill{height:100%;width:0;background:var(--green);transition:width .3s}
.tr-status{font-size:11.5px;color:var(--muted);margin-top:10px;min-height:0}
.tr-status.err{color:var(--warm)}
.tr-restore{width:100%;margin-top:10px;padding:8px;border:1px solid var(--line2);border-radius:3px;font-size:12px}
.tr-restore:hover{border-color:var(--ink)}
.tr-adv{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.tr-adv summary{font-size:11.5px;color:var(--muted);cursor:pointer}
.tr-adv p{font-size:11px;color:var(--faint);margin-top:8px;line-height:1.6}
.tr-adv input{width:100%;margin-top:8px;padding:8px 10px;border:1px solid var(--line2);border-radius:3px;font-size:12px;background:var(--bg)}
.tr-save{width:100%;margin-top:8px;padding:8px;background:var(--ink);color:#fff;border-radius:3px;font-size:12px}
.tr-save:hover{background:var(--green)}
body.tr-on .tr-fab{background:var(--green)}

/* --------------------------------------------------------------- responsive */
@media(max-width:1040px){
  .hero-in.two,.cta-in{grid-template-columns:1fr;gap:44px}
  .hero-side{max-width:520px}
  .svc-g,.myth-grid,.cond-grid,.pk-grid{grid-template-columns:1fr 1fr}
  .ft-grid{grid-template-columns:1fr 1fr;gap:36px}
  .nav{gap:18px}
  .nav a{font-size:13px}
}
@media(max-width:860px){
  .wrap{padding:0 20px}
  .nav{
    position:fixed;inset:106px 0 auto;background:var(--bg);border-bottom:1px solid var(--line);
    flex-direction:column;align-items:flex-start;gap:0;padding:8px 20px 18px;display:none;
    box-shadow:0 20px 30px -24px rgba(0,0,0,.3);max-height:calc(100vh - 106px);overflow:auto;
  }
  .nav.open{display:flex}
  .nav a{width:100%;padding:13px 0;border-bottom:1px solid var(--line);font-size:15px}
  .nav a.on::after{display:none}
  .burger{display:flex}
  .hd-act .btn-sm{display:none}
  .hero{padding:48px 0 44px}
  .p-home .hero{padding:52px 0}
  .facts{gap:26px;margin-top:32px}
  .facts li{min-width:calc(50% - 13px)}
  .sec{padding:54px 0}
  .sec-hd{gap:18px;margin-bottom:30px}
  .steps,.svc-g,.myth-grid,.cond-grid,.pk-grid,.why-grid,.two-col,.risk-grid,.howlist,.clist,.two-prose{grid-template-columns:1fr}
  .two-prose{columns:1}
  .why:nth-child(-n+2){border-top:1px solid var(--line)}
  .why:first-child{border-top:0}
  .ft-grid{grid-template-columns:1fr;gap:30px}
  .ft-btm{flex-direction:column;gap:10px}
  .lf-row{grid-template-columns:1fr}
  .strip-in{height:auto;padding:10px 0;gap:12px;font-size:10.5px}
  .facts li b{font-size:19px}
  .tr{right:14px;bottom:14px}
  .tr-fab span{display:none}
  .tr-fab{padding:13px;border-radius:50%}
  .topbar .tb{height:auto;padding:6px 0;font-size:11px;gap:7px}
  .tb-wx{margin-left:0}
  .hd-in{height:64px;gap:12px}
  .nav{inset:96px 0 auto;max-height:calc(100vh - 96px)}
  .big-note{font-size:16px}
  .faq .ans{padding-right:20px}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* ------------------------------------------------------------------- cities */
.citybox{background:var(--paper);border:1px solid var(--line);border-radius:5px;padding:26px}
.city-main{display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);padding-bottom:15px}
.city-main b{font-size:21px;letter-spacing:-.02em}
.city-main span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--green);border:1px solid var(--green);padding:3px 9px;border-radius:100px;white-space:nowrap}
html[lang="zh-CN"] .city-main span{text-transform:none;letter-spacing:.04em}
.city-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.city-chips span{font-size:12.5px;color:var(--ink2);border:1px solid var(--line);background:var(--bg);padding:5px 11px;border-radius:100px}
.city-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.citycard{background:var(--paper);border:1px solid var(--line);border-radius:5px;padding:22px 20px}
.sec.alt .citycard{background:var(--bg)}
.citycard.own{border-color:var(--green);background:var(--green-soft)}
.cc-hd{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cc-hd b{font-size:16.5px;letter-spacing:-.015em}
.cc-tag{font-size:10.5px;letter-spacing:.07em;color:var(--muted);white-space:nowrap}
html[lang="zh-CN"] .cc-tag{letter-spacing:.02em;font-size:11px}
.citycard.own .cc-tag{color:var(--green);font-weight:600}
.citycard p{font-size:13px;color:var(--ink2);line-height:1.7;margin-top:10px}
@media(max-width:1040px){.city-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.city-grid{grid-template-columns:1fr}.citybox{padding:20px}}
.pk-price .cur{font-size:22px;color:var(--ink2);font-weight:500}

/* highlight: reliable inline underline (avoids the z-index hack) */
.hl{
  color:var(--green);
  background-image:linear-gradient(180deg,transparent 68%,rgba(180,82,44,.17) 68%,rgba(180,82,44,.17) 94%,transparent 94%);
  padding:0 3px;margin:0 -3px;white-space:normal;
}
.hl::after{display:none}
.hl{
  background-image:linear-gradient(180deg,transparent 84%,rgba(180,82,44,.34) 84%,rgba(180,82,44,.34) 96%,transparent 96%);
  padding:0 1px;margin:0 -1px;
}
.hl{background-image:linear-gradient(180deg,transparent 84%,rgba(14,87,72,.38) 84%,rgba(14,87,72,.38) 96%,transparent 96%)}

/* type scale: keep the English h1 on two lines */
h1{font-size:clamp(32px,3.9vw,48px)}
html[lang="zh-CN"] h1{font-size:clamp(29px,3.5vw,45px)}
.p-home h1{font-size:clamp(33px,4vw,49px)}
html[lang="zh-CN"] .p-home h1{font-size:clamp(30px,3.6vw,46px)}
.hero-txt{max-width:660px}
.facts{gap:38px}

/* other cities: a note, not a page */
.citynote{max-width:760px}
.citynote h2{margin-bottom:16px}
.citynote .lead{margin-top:0}
.citynote .btn{margin-top:20px}

/* the "who we work with" grid needs its own columns */
.plain-g{grid-template-columns:repeat(3,1fr)}
@media(max-width:1040px){.plain-g{grid-template-columns:1fr 1fr}}
@media(max-width:860px){.plain-g{grid-template-columns:1fr}}

/* final: highlight underline as a thin rule hugging the baseline */
.hl{
  color:var(--green);
  background-image:linear-gradient(currentColor,currentColor);
  background-repeat:no-repeat;
  background-position:0 88%;
  background-size:100% .07em;
  padding:0 2px;margin:0 -2px;
}
.hl{background-position:0 94%;background-size:100% .06em;padding:0 2px;margin:0 -2px}
