.china-setup {
  min-height: 100vh;
  background: linear-gradient(180deg, #f7faff 0, #fff 620px);
}

.cs-container { max-width: 1060px; }
.cs-hero { padding: 58px 0 40px; }
.cs-back { display: inline-block; margin-bottom: 30px; color: #536b88; font-size: 14px; font-weight: 650; text-decoration: none; }
.cs-back:hover { color: var(--blue); }
.cs-kicker, .cs-section-label { margin: 0 0 12px; color: var(--blue); font-size: 12px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.cs-hero h1 { max-width: 800px; margin: 0; font-size: clamp(38px, 5vw, 62px); line-height: 1.06; letter-spacing: -.045em; }
.cs-lead { max-width: 790px; margin: 20px 0 0; color: #526680; font-size: clamp(17px, 2vw, 20px); line-height: 1.65; }
.cs-device-nav { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 32px; }
.cs-device-nav a { padding: 10px 16px; border: 1px solid #d9e6f6; border-radius: 12px; background: #fff; color: #315a8b; font-size: 14px; font-weight: 700; text-decoration: none; }
.cs-device-nav a:hover { border-color: #95bff4; background: #eff6ff; }

.cs-flow-section { padding: 12px 0 43px; }
.cs-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.cs-flow > div { position: relative; min-height: 116px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 12px 32px rgba(43, 91, 154, .06); }
.cs-flow > div:not(:last-child)::after { position: absolute; z-index: 1; top: 43px; right: -12px; width: 12px; height: 2px; background: #9cc3f4; content: ""; }
.cs-flow span { display: block; margin-bottom: 18px; color: var(--blue); font-size: 13px; font-weight: 850; letter-spacing: .06em; }
.cs-flow strong { font-size: 15px; line-height: 1.3; }

.cs-content { max-width: 950px; margin: 0 auto; padding-bottom: 90px; }
.cs-panel { margin-bottom: 16px; padding: 30px 34px; border: 1px solid #e1eaf5; border-radius: 22px; background: #fff; box-shadow: 0 12px 35px rgba(43, 91, 154, .045); scroll-margin-top: 95px; }
.cs-panel h2, .cs-sharing h2 { margin: 0 0 20px; font-size: clamp(25px, 3vw, 32px); letter-spacing: -.035em; line-height: 1.2; }
.cs-panel p:last-child { margin: 18px 0 0; color: #526680; line-height: 1.7; }
.cs-content a:not(.button) { color: var(--blue-dark); text-underline-offset: 3px; }
.cs-steps { display: grid; gap: 13px; margin: 0; padding-left: 27px; color: #354a65; line-height: 1.65; }
.cs-steps li { padding-left: 7px; }
.cs-steps li::marker { color: var(--blue); font-weight: 800; }
.cs-network-note { margin: 28px 0 62px; padding: 20px 24px; border-left: 4px solid var(--blue); border-radius: 0 14px 14px 0; background: var(--blue-soft); color: #345475; line-height: 1.65; }

.cs-sharing { scroll-margin-top: 95px; }
.cs-sharing > p:not(.cs-section-label) { max-width: 770px; color: #526680; line-height: 1.7; }
.cs-sharing-steps { display: grid; gap: 16px; margin-top: 29px; }
.cs-sharing-step, .cs-final-step { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 28px; align-items: center; padding: 25px; border: 1px solid #dfe9f5; border-radius: 22px; background: #fff; box-shadow: 0 13px 36px rgba(44, 87, 146, .05); }
.cs-sharing-step:nth-child(even) { background: #f9fbff; }
.cs-number { display: inline-grid; width: 38px; height: 38px; place-items: center; border-radius: 12px; background: var(--blue-soft); color: var(--blue); font-size: 13px; font-weight: 800; }
.cs-sharing h3 { margin: 17px 0 9px; font-size: 21px; letter-spacing: -.025em; line-height: 1.3; }
.cs-sharing-copy p, .cs-final-step p { margin: 0; color: #526680; line-height: 1.7; }
.cs-sharing figure { overflow: hidden; margin: 0; border: 1px solid #e1e9f3; border-radius: 15px; background: #f2f6fc; }
.cs-sharing img { display: block; width: 100%; height: auto; }
.cs-sharing figcaption { padding: 10px 14px; color: #6b7d94; font-size: 12px; }
.cs-final-step { margin-top: 16px; }
.cs-final-step h3 { margin-top: 0; }
.cs-sharing-note { margin: 20px 0 0; padding: 20px 23px; border-radius: 16px; background: #f2f7fd; }
.cs-terms { margin-top: 58px; padding: 20px 24px; border: 1px solid #efddb5; border-radius: 17px; background: #fff8e9; color: #594526; }
.cs-terms strong { display: block; margin-bottom: 6px; font-size: 16px; }
.cs-terms p { margin: 0; line-height: 1.6; }
.cs-return { margin-top: 25px; }

@media (max-width: 760px) {
  .cs-hero { padding: 38px 0 29px; }
  .cs-back { margin-bottom: 23px; }
  .cs-device-nav { gap: 8px; }
  .cs-device-nav a { padding: 9px 12px; font-size: 13px; }
  .cs-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-flow > div:nth-child(2)::after { display: none; }
  .cs-flow-section { padding-bottom: 31px; }
  .cs-panel { padding: 23px 21px; }
  .cs-sharing-step, .cs-final-step { grid-template-columns: 1fr; gap: 20px; padding: 20px; }
  .cs-network-note { margin-bottom: 49px; }
  .cs-return .button { width: 100%; }
}

@media (max-width: 410px) {
  .cs-flow > div { min-height: 105px; padding: 14px; }
  .cs-flow strong { font-size: 13px; }
  .cs-device-nav a:last-child { width: 100%; text-align: center; }
}
