/**
 * 境外公司法律意见书专题（/legal-opinion/ 总页与香港、新加坡、美国、BVI、开曼详情页）。
 *
 * 建立在 topics.css、trademark.css、belt-road.css（.tp-br 变量与通用小组件）之上，只写本专题独有的区块。
 * 用色：标题与编号块藏青；正文深灰、说明中灰；品牌蓝只用于文字链接，亮蓝只用于悬停、选中与焦点；
 * 琥珀金只给首屏与咨询区主按钮（品牌层统一处理）。造型：按钮切角 10px、标签切角 7px、编号块 15° 平行四边形。
 */
.tp-lo {
  --lo-par: polygon(4px 0, 100% 0, calc(100% - 4px) 100%, 0 100%);
  --lo-card-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}
.tp-lo :is(.lo-uses, .lo-jurs, .lo-dirs, .lo-stages, .lo-arch-tiers, .lo-roles, .lo-work, .lo-steps, .lo-points, .lo-local, .lo-doc-list) { margin: 0; padding: 0; list-style: none; }
.tp-lo :is(.lo-jur-confirm ul, .lo-mat-local ul, .lo-secure ul, .lo-confirm ul) { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.tp-lo :is(.lo-jur-confirm ul, .lo-mat-local ul, .lo-secure ul, .lo-confirm ul) > li { position: relative; padding-left: 15px; color: var(--br-text); font-size: 14px; line-height: 1.65; }
.tp-lo :is(.lo-jur-confirm ul, .lo-mat-local ul, .lo-secure ul, .lo-confirm ul) > li::before { content: ""; position: absolute; left: 0; top: .62em; width: 7px; height: 5px; background: var(--br-ink); clip-path: var(--lo-par); }
.tp-lo .lo-no { display: inline-grid; place-items: center; min-width: 30px; height: 22px; padding: 0 6px; background: var(--br-ink); color: #FFFFFF; font: 700 12px/1 var(--numeric, sans-serif); letter-spacing: .02em; clip-path: var(--lo-par); }
.tp-lo .lo-k { margin: 22px 0 10px; color: var(--br-muted); font-size: 12.5px; font-weight: 600; letter-spacing: .08em; }
.tp-lo .lo-lead { margin: 0; color: var(--br-text); font-size: 15.5px; line-height: 1.8; }
.tp-lo .lo-muted { color: var(--br-muted); font-size: 13.5px; }
.tp-lo .lo-sub-lead { max-width: 52em; margin: -4px 0 18px; color: var(--br-text); font-size: 14.5px; line-height: 1.75; }
.tp-lo .br-note a { margin-left: 6px; color: var(--br-link); text-decoration: underline; text-underline-offset: 3px; }
.tp-lo .br-note a:hover { color: var(--br-live); }
.tp-lo .lo-caps li { background: #FFFFFF; }
/* ---------- 首屏 ---------- */
.lo-hero h1 { max-width: 14em; }
.lo-hero-jurs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 22px; }
.lo-hero-jurs > span { color: var(--br-muted); font-size: 13px; font-weight: 600; }
.lo-hero .tm-hero-note a { color: var(--br-link); text-decoration: underline; text-underline-offset: 3px; }
.lo-hero .tm-hero-note a:hover { color: var(--br-live); }
/* 意见书结构示意 */
.lo-doc { margin: 0; }
.lo-doc-sheet { position: relative; padding: 26px 26px 22px; border: 1px solid var(--br-line-strong); background: #FFFFFF; clip-path: var(--lo-card-path); }
.lo-doc-sheet::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--br-ink); }
.lo-doc-head { display: grid; gap: 4px; margin: 0 0 16px; padding-bottom: 14px; border-bottom: 1px solid var(--br-line); }
.lo-doc-head b { color: var(--br-ink); font: 800 15px/1.2 var(--numeric, sans-serif); letter-spacing: .22em; }
.lo-doc-head span { color: var(--br-muted); font-size: 12.5px; }
.lo-doc-list { display: grid; gap: 0; counter-reset: lo-doc; }
.lo-doc-list li { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: baseline; gap: 10px; padding: 9px 0; border-bottom: 1px dashed #DCE0EA; counter-increment: lo-doc; }
.lo-doc-list li::before { content: counter(lo-doc) "."; color: var(--br-muted); font: 600 12.5px/1 var(--numeric, sans-serif); }
.lo-doc-list b { color: var(--br-ink); font: 700 13.5px/1.3 var(--numeric, sans-serif); }
.lo-doc-list span { color: var(--br-text); font-size: 12.5px; text-align: right; }
.lo-doc-foot { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 0; }
.lo-doc-foot span { padding: 3px 9px 3px 8px; border: 1px solid #D5DAE6; background: var(--br-pale); color: var(--br-muted); font: 600 11.5px/1.4 var(--numeric, sans-serif); letter-spacing: .04em; clip-path: var(--br-tag-path); }
.lo-doc-sign { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin: 18px 0 0; color: var(--br-muted); font-size: 12.5px; }
.lo-doc-sign i { display: block; width: 92px; height: 1px; background: var(--br-ink); }
.lo-doc figcaption { margin-top: 10px; color: var(--br-muted); font-size: 12.5px; line-height: 1.6; }
/* 详情页首屏：启动前确认卡 */
.lo-hero-card { padding: 24px 24px 22px; border: 1px solid var(--br-line-strong); border-top: 3px solid var(--br-ink); background: #FFFFFF; }
.lo-hero-card-en { margin: 0 0 4px; color: var(--br-muted); font: 700 11.5px/1.3 var(--numeric, sans-serif); letter-spacing: .2em; }
.lo-hero-card h2 { margin: 0 0 14px; color: var(--br-ink); font-size: 19px; line-height: 1.35; }
.lo-hero-card ol { display: grid; gap: 0; margin: 0 0 14px; padding: 0; list-style: none; }
.lo-hero-card ol li { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: baseline; padding: 10px 0; border-top: 1px solid var(--br-line); color: var(--br-text); font-size: 14.5px; line-height: 1.6; }
.lo-hero-card ol li span { color: var(--br-ink); font: 700 13px/1 var(--numeric, sans-serif); }
.lo-hero-card-note { margin: 0 0 12px; color: var(--br-muted); font-size: 13px; line-height: 1.65; }
/* ---------- 按用途选择 ---------- */
.lo-uses { display: grid; gap: 12px; }
.lo-use { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 22px 22px 20px; border: 1px solid var(--br-line); background: #FFFFFF; }
.lo-use h3 { margin: 4px 0 0; color: var(--br-ink); font-size: 18px; line-height: 1.4; }
.lo-use-need { margin: 0; color: var(--br-text); font-size: 14.5px; line-height: 1.7; }
.lo-use dl { margin: 0; padding: 12px 0 0; border-top: 1px solid var(--br-line); }
.lo-use dt { color: var(--br-muted); font-size: 12.5px; font-weight: 600; letter-spacing: .06em; }
.lo-use dd { margin: 4px 0 0; color: var(--br-text); font-size: 14px; line-height: 1.65; }
.lo-use .br-ask { align-self: flex-start; margin-top: auto; }
/* ---------- 按注册地选择 ---------- */
.lo-jurs { display: grid; gap: 12px; }
.lo-jur { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 22px 22px 20px; border: 1px solid var(--br-line); background: #FFFFFF; clip-path: var(--lo-card-path); }
.lo-jur-en { margin: 0; color: var(--br-muted); font: 700 11.5px/1.3 var(--numeric, sans-serif); letter-spacing: .18em; }
.lo-jur h3 { margin: -4px 0 0; font-size: 19px; line-height: 1.35; }
.lo-jur h3 a { color: var(--br-ink); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; }
.lo-jur h3 a:hover { color: var(--br-live); text-decoration-color: currentColor; }
.lo-jur-focus { margin: 0; color: var(--br-text); font-size: 14.5px; line-height: 1.7; }
.lo-jur-focus b,
.lo-jur-confirm > b { display: block; margin-bottom: 4px; color: var(--br-muted); font-size: 12.5px; font-weight: 600; letter-spacing: .06em; }
.lo-jur-acts { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--br-line); }
.lo-states { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.lo-states > span { margin-right: 4px; color: var(--br-ink); font-size: 12.5px; font-weight: 700; }
.lo-states a { display: inline-flex; align-items: center; min-height: 30px; padding: 0 11px 0 10px; border: 1px solid rgba(9, 46, 184, .28); background: rgba(53, 88, 240, .05); color: var(--br-link); font-size: 13px; text-decoration: none; clip-path: var(--br-tag-path); }
.lo-states a:hover { border-color: var(--br-live); color: var(--br-live); }
/* ---------- 审查范围 ---------- */
.lo-dirs { display: grid; gap: 0; border-top: 1px solid var(--br-line); border-left: 1px solid var(--br-line); }
.lo-dir { display: grid; gap: 8px; align-content: start; min-width: 0; padding: 20px 20px 18px; border-right: 1px solid var(--br-line); border-bottom: 1px solid var(--br-line); background: #FFFFFF; }
.lo-dir h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 6px 0 0; color: var(--br-ink); font-size: 17px; line-height: 1.4; }
.lo-dir h3 small { color: var(--br-muted); font: 600 12px/1.3 var(--numeric, sans-serif); letter-spacing: .04em; }
.lo-dir p { margin: 0; color: var(--br-text); font-size: 14px; line-height: 1.7; }
.lo-hist { display: grid; gap: 12px; }
.lo-hist-item { min-width: 0; padding: 20px 22px; border: 1px solid var(--br-line); border-left: 3px solid var(--br-ink); background: #FFFFFF; }
.lo-hist-item h4,
.lo-hist-item summary { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; color: var(--br-ink); font-size: 16.5px; font-weight: 700; line-height: 1.4; }
.lo-hist-item p { margin: 0; color: var(--br-text); font-size: 14px; line-height: 1.75; }
.lo-hist-item p + p { margin-top: 10px; }
.lo-hist-item p b { display: block; margin-bottom: 2px; color: var(--br-muted); font-size: 12.5px; letter-spacing: .06em; }
.lo-hist-docs { padding-top: 10px; border-top: 1px dashed #DCE0EA; }
details.lo-hist-item { padding: 0; }
details.lo-hist-item summary { margin: 0; padding: 16px 44px 16px 20px; cursor: pointer; list-style: none; position: relative; }
details.lo-hist-item summary::-webkit-details-marker { display: none; }
details.lo-hist-item summary i { position: absolute; right: 18px; top: 50%; width: 10px; height: 10px; margin-top: -7px; border-right: 1.5px solid var(--br-ink); border-bottom: 1.5px solid var(--br-ink); transform: rotate(45deg); transition: transform .2s ease; }
details.lo-hist-item[open] summary i { margin-top: -2px; transform: rotate(-135deg); }
details.lo-hist-item summary:hover { color: var(--br-live); }
details.lo-hist-item > p { padding: 0 20px; }
details.lo-hist-item > p:last-child { margin-bottom: 18px; padding-top: 10px; }
/* ---------- 上市专项 ---------- */
.lo-listing { display: grid; gap: 24px; }
.lo-stages { display: grid; gap: 0; border-left: 2px solid var(--br-line-strong); }
.lo-stages li { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 2px 12px; padding: 12px 0 12px 18px; }
.lo-stages li::before { content: ""; position: absolute; left: -6px; top: 18px; width: 10px; height: 10px; border: 2px solid var(--br-ink); background: #FFFFFF; transform: skewX(-15deg); }
.lo-stage-no { color: var(--br-muted); font: 700 12.5px/1 var(--numeric, sans-serif); }
.lo-stages b { color: var(--br-ink); font-size: 15.5px; }
.lo-stages p { grid-column: 2; margin: 0; color: var(--br-text); font-size: 14px; line-height: 1.7; }
.lo-arch { display: grid; gap: 14px; align-content: start; margin: 0; padding: 24px; border: 1px solid var(--br-line-strong); background: #FFFFFF; clip-path: var(--lo-card-path); }
.lo-arch-tiers { display: grid; gap: 26px; }
.lo-arch-tiers li { position: relative; display: grid; gap: 2px; padding: 14px 16px; border: 1px solid rgba(33, 39, 115, .32); background: var(--br-pale); text-align: center; }
.lo-arch-tiers li:not(:last-child)::after { content: ""; position: absolute; left: 50%; bottom: -26px; width: 1px; height: 26px; background: var(--br-ink); }
.lo-arch-tiers li:not(:last-child)::before { content: ""; position: absolute; left: calc(50% - 4px); bottom: -27px; z-index: 1; width: 9px; height: 9px; border-right: 1px solid var(--br-ink); border-bottom: 1px solid var(--br-ink); transform: rotate(45deg); }
.lo-arch-tiers b { color: var(--br-ink); font-size: 15.5px; }
.lo-arch-tiers span { color: var(--br-text); font-size: 13.5px; }
.lo-arch figcaption { color: var(--br-muted); font-size: 13px; line-height: 1.65; }
.kqw-b26 .lo-arch .lo-arch-go { justify-content: center; width: 100%; }
/* ---------- 贷款及担保专项 ---------- */
.lo-finance { display: grid; gap: 24px; }
.lo-roles { display: grid; gap: 8px; }
.lo-roles a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 46px; padding: 0 16px; border: 1px solid var(--br-line-strong); background: #FFFFFF; color: var(--br-ink); font-size: 15px; font-weight: 600; text-decoration: none; clip-path: var(--br-btn-path); }
.lo-roles a i { color: var(--br-muted); font-style: normal; font-weight: 400; }
.lo-roles a:hover { border-color: var(--br-ink); background: rgba(33, 39, 115, .04); }
.lo-roles a:hover i { color: var(--br-live); }
.lo-work { display: grid; gap: 12px; }
.lo-work li { display: grid; gap: 8px; align-content: start; padding: 20px 20px 18px; border: 1px solid var(--br-line); background: var(--br-pale); }
.lo-work h3 { margin: 4px 0 0; color: var(--br-ink); font-size: 16.5px; }
.lo-work p { margin: 0; color: var(--br-text); font-size: 14px; line-height: 1.7; }
/* ---------- 资料清单 ---------- */
.lo-mat { display: grid; gap: 16px; }
.lo-mat-list { display: grid; gap: 0; margin: 0; border-top: 1px solid var(--br-line); }
.lo-mat-list > div { display: grid; gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--br-line); }
.lo-mat-list dt { color: var(--br-ink); font-size: 15px; font-weight: 700; }
.lo-mat-list dd { margin: 0; color: var(--br-text); font-size: 14px; line-height: 1.7; }
.lo-mat-local { align-self: start; padding: 22px; border: 1px solid var(--br-line-strong); border-top: 3px solid var(--br-ink); background: #FFFFFF; }
.p2-section.is-light .lo-mat-local { background: var(--br-pale); }
.lo-mat-local h3 { margin: 0 0 12px; color: var(--br-ink); font-size: 16.5px; }
.lo-mat-local > p { margin: 12px 0 0; color: var(--br-muted); font-size: 13px; }
/* ---------- 办理流程 ---------- */
.lo-process { display: grid; gap: 20px; }
.lo-steps { display: grid; gap: 0; border-top: 1px solid var(--br-line); }
.lo-step { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 4px 12px; padding: 16px 0; border-bottom: 1px solid var(--br-line); }
.lo-step-no { grid-row: span 2; color: var(--br-ink); font: 800 20px/1.2 var(--numeric, sans-serif); }
.lo-step h3 { margin: 0; color: var(--br-ink); font-size: 16px; line-height: 1.45; }
.lo-step p { margin: 0; color: var(--br-text); font-size: 14px; line-height: 1.7; }
.lo-secure { align-self: start; padding: 22px; border: 1px solid var(--br-line-strong); border-top: 3px solid var(--br-ink); background: #FFFFFF; }
.lo-secure h3 { margin: 0 0 12px; color: var(--br-ink); font-size: 16.5px; }
/* ---------- 周期与费用 ---------- */
.lo-fees { display: grid; gap: 16px; }
.lo-cycle { padding: 22px; border: 1px solid var(--br-line); background: #FFFFFF; }
.lo-cycle h3 { margin: 0 0 10px; color: var(--br-ink); font-size: 16.5px; }
.lo-cycle p:not(.lo-k) { margin: 0; color: var(--br-text); font-size: 14.5px; line-height: 1.8; }
.lo-cycle .lo-k { margin-top: 18px; }
/* ---------- 服务分工 ---------- */
.lo-duties .br-role:first-child { border-top-color: var(--br-ink); }
/* ---------- 详情页：审查重点、当地规则 ---------- */
.lo-focus { display: grid; gap: 20px; }
.lo-points { display: grid; gap: 12px; }
.lo-points li { display: grid; gap: 8px; align-content: start; padding: 20px 20px 18px; border: 1px solid var(--br-line); background: #FFFFFF; }
.lo-points h3 { margin: 4px 0 0; color: var(--br-ink); font-size: 16.5px; line-height: 1.4; }
.lo-points p { margin: 0; color: var(--br-text); font-size: 14px; line-height: 1.7; }
.lo-confirm { display: grid; gap: 14px; align-self: start; padding: 22px; background: var(--br-pale); border-top: 3px solid var(--br-ink); }
.lo-confirm h3 { margin: 0; color: var(--br-ink); font-size: 16.5px; }
.lo-confirm .br-ask { justify-self: start; }
.lo-local { display: grid; gap: 12px; }
.lo-fact { display: grid; gap: 8px; align-content: start; min-width: 0; padding: 20px 22px 18px; border: 1px solid var(--br-line); border-left: 3px solid var(--br-ink); background: #FFFFFF; }
.lo-fact h3 { margin: 0; color: var(--br-ink); font-size: 16.5px; line-height: 1.4; }
.lo-fact p { margin: 0; color: var(--br-text); font-size: 14px; line-height: 1.75; }
.lo-fact .tp-src { margin-top: 2px; font-size: 12.5px; overflow-wrap: anywhere; }
/* ---------- 断点 ---------- */
@media (max-width: 759px) {
  .lo-doc-sheet { padding: 20px 18px 18px; }
  .lo-doc-list li { grid-template-columns: 22px minmax(0, 1fr); }
  .lo-doc-list span { grid-column: 2; text-align: left; }
  .lo-hero-jurs { flex-direction: column; align-items: flex-start; }
  .lo-jur-acts { flex-direction: column; align-items: stretch; }
  .lo-jur-acts .br-ask { justify-content: center; }
  .lo-use .br-ask { align-self: stretch; justify-content: center; }
}
@media (min-width: 640px) {
  .lo-uses,
  .lo-jurs,
  .lo-dirs,
  .lo-work,
  .lo-points,
  .lo-local,
  .lo-hist { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lo-mat-list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; }
  .lo-roles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .lo-uses { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lo-jurs { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .lo-jur { grid-column: span 2; }
  .lo-jur:nth-child(n + 4) { grid-column: span 3; }
  .lo-dirs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lo-listing { grid-template-columns: minmax(0, 1.55fr) minmax(300px, 1fr); align-items: start; gap: 36px; }
  .lo-stages { grid-template-columns: repeat(5, minmax(0, 1fr)); border-left: 0; border-top: 2px solid var(--br-line-strong); }
  .lo-stages li { grid-template-columns: auto minmax(0, 1fr); align-content: start; padding: 20px 14px 0 0; }
  .lo-stages li::before { left: 0; top: -7px; }
  .lo-stages p { grid-column: 1 / -1; margin-top: 6px; font-size: 13.5px; }
  .lo-finance { grid-template-columns: minmax(300px, .9fr) minmax(0, 1.4fr); align-items: start; gap: 32px; }
  .lo-roles { grid-template-columns: 1fr; }
  .lo-mat.has-local { grid-template-columns: minmax(280px, .8fr) minmax(0, 1.7fr); align-items: start; gap: 28px; }
  .lo-mat:not(.has-local) .lo-mat-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lo-process { grid-template-columns: minmax(0, 1.7fr) minmax(300px, 1fr); align-items: start; gap: 32px; }
  .lo-step { grid-template-columns: 56px minmax(11em, .8fr) minmax(0, 1.6fr); align-items: baseline; gap: 16px; }
  .lo-step-no { grid-row: auto; }
  .lo-fees { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: start; gap: 24px; }
  .lo-focus { grid-template-columns: minmax(0, 1.7fr) minmax(300px, 1fr); align-items: start; gap: 24px; }
  .lo-local { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lo-local:has(> li:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .tp-lo details.lo-hist-item summary i { transition: none; }
}
