/* 成功案例 · 关于赢商 · 共享样式 */
.ca-sec { padding: 72px 32px; }
.ca-sec.alt { background: linear-gradient(180deg, #F5F8FF 0%, #fff 100%); }
.ca-sec-inner { max-width: 1280px; margin: 0 auto; }
.ca-sec-head { text-align: center; margin-bottom: 36px; }
.ca-sec-head .eyebrow {
  display: inline-flex; padding: 6px 14px; font: 600 13px/1 var(--font-mono);
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--brand-blue-deep);
  background: rgba(0,73,255,0.06); border: 1px solid rgba(0,73,255,0.18); border-radius: 999px; margin-bottom: 14px;
}
.ca-sec-head h2 { font: 700 30px/1.25 var(--font-display); color: var(--text-ink); margin: 0 0 12px; }
.ca-sec-head .sub { font: 400 15px/1.65 var(--font-display); color: var(--text-ink-soft); max-width: 760px; margin: 0 auto; }

.ca-photo { margin: 0; border-radius: 14px; overflow: hidden; border: 1px solid var(--line-blue); background: #fff; box-shadow: var(--shadow-md); }
.ca-photo img { display: block; width: 100%; height: auto; object-fit: cover; }
.ca-photo.contain img { object-fit: contain; padding: 8px; box-sizing: border-box; background: #F5F8FF; }

.ca-case-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.ca-case-card {
  display: grid; grid-template-columns: 1fr 1.05fr; gap: 18px; align-items: start;
  padding: 22px; background: #fff; border: 1px solid var(--line-blue); border-radius: 16px;
}
.ca-case-card.full { grid-template-columns: 1fr; }
.ca-case-card .copy .tag { font: 700 10px/1 var(--font-mono); color: #fff; background: var(--brand-blue-deep); padding: 4px 8px; border-radius: 4px; display: inline-block; margin-bottom: 10px; letter-spacing: 0.08em; }
.ca-case-card h3 { font: 700 20px/1.3 var(--font-display); margin: 0 0 8px; }
.ca-case-card .brief { font-size: 13.5px; line-height: 1.65; color: var(--text-ink-soft); margin: 0 0 12px; }
.ca-case-card ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.ca-case-card li { font-size: 12.5px; line-height: 1.55; padding: 7px 10px; background: rgba(0,73,255,0.04); border-radius: 8px; color: var(--text-ink); }
.ca-case-card .kpis { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.ca-case-card .kpi { padding: 8px 10px; background: rgba(0,73,255,0.06); border: 1px solid rgba(0,73,255,0.12); border-radius: 8px; }
.ca-case-card .kpi .v { font: 800 16px/1 var(--font-mono); color: var(--brand-blue-deep); }
.ca-case-card .kpi .k { font-size: 10px; color: var(--text-ink-mute); margin-top: 2px; }

.ca-pillar-nav { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; max-width: 900px; margin: 0 auto 24px; }
.ca-pillar-nav a {
  font: 600 12px/1 var(--font-mono); padding: 9px 14px; border-radius: 999px; text-decoration: none;
  color: var(--text-ink-soft); border: 1px solid var(--line-blue); background: #fff;
}
.ca-pillar-nav a.active { background: linear-gradient(135deg, var(--brand-blue-deep), var(--brand-blue-bright)); color: #fff; border-color: transparent; }

.ca-cap-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ca-cap-card { padding: 24px 22px; background: #fff; border: 1px solid var(--line-blue); border-radius: 16px; position: relative; overflow: hidden; }
.ca-cap-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--brand-blue-deep), var(--brand-blue-bright)); }
.ca-cap-card h3 { font: 700 20px/1.3 var(--font-display); margin: 0 0 10px; }
.ca-cap-card p { font-size: 13px; line-height: 1.65; color: var(--text-ink-soft); margin: 0 0 12px; }
.ca-cap-card ul { margin: 0; padding: 0; list-style: none; }
.ca-cap-card li { font-size: 12.5px; line-height: 1.55; padding: 6px 0; border-bottom: 1px dashed var(--line-soft); color: var(--text-ink); }
.ca-cap-card li:last-child { border-bottom: 0; }

.ca-tl-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.ca-tl-card { padding: 22px 18px; background: linear-gradient(160deg, #fff, #F5F8FF); border: 1px solid var(--line-blue); border-radius: 14px; }
.ca-tl-card .yr { font: 800 13px/1 var(--font-mono); color: var(--brand-blue-deep); letter-spacing: 0.1em; margin-bottom: 8px; }
.ca-tl-card h3 { font: 700 17px/1.3 var(--font-display); margin: 0 0 10px; }
.ca-tl-card p { font-size: 12.5px; line-height: 1.6; color: var(--text-ink-soft); margin: 0; }

.ca-scene-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.ca-scene-card { padding: 18px 14px; background: #fff; border: 1px solid var(--line-blue); border-radius: 12px; text-align: center; }
.ca-scene-card .no { font: 700 11px/1 var(--font-mono); color: var(--brand-blue-deep); margin-bottom: 8px; }
.ca-scene-card h4 { font: 700 14px/1.35 var(--font-display); margin: 0; color: var(--text-ink); }

.ca-partner-visual { max-width: 980px; margin: 0 auto; }

body.ws-fullscreen.ws-cases > section.uh,
body.ws-fullscreen.ws-cases > section.s6-section,
body.ws-fullscreen.ws-cases > section.ca-sec,
body.ws-fullscreen.ws-cases > section.s3-section,
body.ws-fullscreen.ws-about > section.uh,
body.ws-fullscreen.ws-about > section.s6-section,
body.ws-fullscreen.ws-about > section.ca-sec,
body.ws-fullscreen.ws-about > section.ws-sec {
  min-height: calc(100vh - var(--nav-h, 72px)); box-sizing: border-box;
}
body.ws-fullscreen.ws-cases > section.ws-bigcta,
body.ws-fullscreen.ws-about > section.ws-bigcta {
  min-height: auto; box-sizing: border-box;
}
body.ws-fullscreen.ws-cases > section.ca-sec,
body.ws-fullscreen.ws-about > section.ca-sec,
body.ws-fullscreen.ws-about > section.ws-sec { display: flex; flex-direction: column; justify-content: center; padding-top: 40px; padding-bottom: 40px; }
body.ws-fullscreen.ws-cases > section.s6-section,
body.ws-fullscreen.ws-about > section.s6-section { display: flex; align-items: center; min-height: auto; padding: 0 32px; }
body.ws-fullscreen.ws-cases .ca-case-card .ca-photo img,
body.ws-fullscreen.ws-about .ca-photo img { max-height: min(40vh, 360px); object-fit: cover; }

@media (max-width: 1080px) {
  .ca-case-grid, .ca-case-card { grid-template-columns: 1fr; }
  .ca-cap-grid, .ca-tl-grid { grid-template-columns: repeat(2, 1fr); }
  .ca-scene-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .ca-cap-grid, .ca-tl-grid, .ca-scene-grid { grid-template-columns: 1fr; }
}