.preview-status { padding: 10px 16px; background: #FFF5DF; color: #6D4B12; text-align: center; font-size: .875rem; border-bottom: 1px solid #F1DDAF; }
.cn-hero { padding-bottom: 64px; }
.cn-hero .hero-grid { min-height: 610px; }
.cn-hero .hero h1 { font-size: clamp(3rem, 5vw, 4.5rem); }
.cn-hero .hero h1 .accent { white-space: normal; }
.cn-hero .hero-visual { padding: 48px 12px; }
.scope-card { margin-top: 22px; max-width: 650px; padding: 20px 22px; border: 1px solid #D4E2F2; border-left: 4px solid var(--yd-blue); border-radius: 14px; background: rgba(255,255,255,.88); color: #3C4E66; }
.scope-card strong { display: block; margin-bottom: 6px; color: var(--yd-text); font-size: .95rem; }
.scope-card p { font-size: .925rem; line-height: 1.75; }
.cn-visual-card { width: min(100%, 470px); padding: 28px; border: 1px solid #DFEAF7; border-radius: 28px; background: rgba(255,255,255,.94); box-shadow: 0 34px 70px -34px #0B2A5A55, 0 8px 24px -16px #0B2A5A33; }
.cn-visual-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 20px; border-bottom: 1px solid var(--yd-line); }
.cn-visual-top strong { font-size: 1.05rem; }
.cn-chip { padding: 6px 11px; border-radius: 999px; background: var(--sky); color: var(--yd-blue); font-size: .8rem; font-weight: 650; }
.flow-list { display: grid; gap: 13px; padding-top: 20px; }
.flow-item { display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 14px; padding: 14px; border-radius: 16px; background: #F7FAFE; }
.flow-no { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 13px; background: var(--sky); color: var(--yd-blue); font-weight: 700; }
.flow-item:nth-child(2) .flow-no { background: var(--cyan-soft); color: #0A7186; }
.flow-item:nth-child(3) .flow-no { background: var(--jade-soft); color: var(--yd-success); }
.flow-item strong { display: block; font-size: .95rem; }
.flow-item span { display: block; margin-top: 3px; color: var(--yd-muted); font-size: .825rem; line-height: 1.5; }
.integration-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.integration-pills span { padding: 7px 13px; border: 1px solid #DCE8F5; border-radius: 999px; background: #fff; color: #36516F; font-size: .825rem; font-weight: 650; }
.scope-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.scope-item { padding: 26px; border: 1px solid #E3ECF6; border-radius: 20px; background: #fff; }
.scope-item h3 { font-size: 1.05rem; }
.scope-item p { margin-top: 8px; color: var(--yd-muted); font-size: .9375rem; line-height: 1.75; }
.notice-box { margin-top: 24px; padding: 24px 28px; border-radius: 18px; background: var(--sky); color: #29415E; }
.notice-box p + p { margin-top: 8px; }
.integration-section { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr); align-items: center; gap: 56px; }
.integration-section .kicker { margin-bottom: 12px; }
.integration-section .sec-title { margin-bottom: 12px; }
.section-copy { max-width: 610px; color: var(--yd-muted); font-size: 1.05rem; line-height: 1.8; }
.integration-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.integration-card { display: grid; justify-items: start; gap: 9px; padding: 24px; border: 1px solid #E3ECF6; border-radius: 20px; background: #fff; box-shadow: 0 14px 30px -26px #0B2A5A66; }
.integration-card strong { color: var(--yd-text); font-size: 1.15rem; }
.integration-card > span:last-child { color: var(--yd-muted); font-size: .85rem; }
.integration-mark { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; color: white; font-size: 1.15rem; font-weight: 750; }
.integration-mark.feishu { background: linear-gradient(135deg, #367CF6, #54B8F8); }
.integration-mark.dingtalk { background: linear-gradient(135deg, #2E8CFF, #4CC8FF); }
.legal-page .preview-status { margin-top: 0; }
.legal .draft-note { padding: 16px 18px; border: 1px solid #F1DDAF; border-radius: 12px; background: #FFF8E9; color: #6D4B12; }
.legal .legal-facts li { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.legal .legal-facts span { min-width: 92px; color: var(--yd-muted); }
.legal section ul { margin: 10px 0 0; padding-left: 1.2em; list-style: disc; }
.legal section li { margin-block: 6px; }
.legal a { color: var(--yd-blue); text-decoration: underline; text-underline-offset: 3px; }
.footer-legal { white-space: normal; }
.footer-legal > * { white-space: normal; }
.footer-contact { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 24px; color: var(--yd-text); font-size: .925rem; }
.footer-contact a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 960px) {
  .cn-hero .hero-grid { min-height: 0; }
  .scope-grid { grid-template-columns: 1fr; }
  .integration-section { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 700px) {
  .preview-status { padding-inline: 20px; font-size: .8rem; }
  .cn-hero .hero h1 { font-size: 2.5rem; }
  .cn-hero .hero-visual { padding-inline: 0; }
  .cn-visual-card { padding: 20px; border-radius: 22px; }
  .scope-card { padding: 16px; }
  .scope-item { padding: 22px; }
  .legal { padding-top: 44px; }
}