.case-page {
  --case-blue: #1769d2;
  --case-deep: #0c315b;
  --case-orange: #f1872d;
  --case-ink: #123252;
  --case-muted: #647b91;
  background: #f4f8fc;
}

.case-page .site-header { z-index: 90; }

.case-hero {
  position: relative;
  min-height: 700px;
  padding: 0 0 72px;
  overflow: hidden;
  background: #174b84;
  color: #fff;
}

.case-hero-bg,
.case-hero-shade,
.case-hero-grid { position: absolute; inset: 0; }
.case-hero-bg { width: 100%; height: 100%; object-fit: cover; object-position: center 48%; }
.case-hero-shade { background: linear-gradient(90deg, rgba(6, 43, 80, .9), rgba(15, 87, 155, .64) 54%, rgba(7, 46, 82, .76)); }
.case-hero-grid { opacity: .22; background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px); background-size: 72px 72px; }

.case-hero-heading { position: relative; z-index: 2; padding-top: 36px; text-align: center; }
.case-breadcrumb { display: flex; justify-content: flex-start; align-items: center; gap: 10px; margin-bottom: 72px; color: rgba(255,255,255,.72); font-size: 13px; }
.case-breadcrumb a { color: inherit; }
.case-breadcrumb b { color: #fff; }
.case-hero-heading h1 { margin: 0 auto; max-width: 1180px; color: #fff; font-size: clamp(36px, 4.2vw, 58px); line-height: 1.12; letter-spacing: -.04em; }
html[lang="zh-CN"] main.case-page[data-content-type="case"] .case-hero-heading > :is(h1, span) { transform: translateY(20px); }
html body main.case-page.case-page .case-hero-heading > span { display: block; max-width: 1200px; margin: 18px auto 0; color: #fff !important; font-size: 16px !important; line-height: 1.8 !important; }

.case-hero-card {
  position: relative;
  z-index: 10;
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 0;
  margin-top: -420px;
  margin-bottom: 64px;
  padding: 18px;
  border-radius: 18px;
  background: #fff;
  color: var(--case-ink);
  box-shadow: 0 28px 70px rgba(5, 31, 61, .24);
}

.case-media { min-width: 0; padding: 0 18px 0 0; }
.case-media-main { position: relative; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 12px; background: #e8f0f8; }
.case-media .media-panel { position: absolute; inset: 0; display: none; }
.case-media .media-panel.active { display: block; }
.case-media-main img { width: 100%; height: 100%; object-fit: cover; }
.case-media-thumbs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 10px; }
.case-media-thumbs .media-thumb { position: relative; display: block; min-width: 0; height: 74px; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: 8px; background: #dce8f3; cursor: pointer; }
.case-media-thumbs .media-thumb.active { border-color: var(--case-orange); box-shadow: 0 0 0 2px rgba(241,135,45,.14); }
.case-media-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.case-media-thumbs span { position: absolute; inset: auto 0 0; padding: 12px 8px 6px; background: linear-gradient(transparent, rgba(5,28,51,.82)); color: #fff; font-size: 11px; font-weight: 700; text-align: left; }

.case-summary { display: flex; flex-direction: column; min-width: 0; padding: 22px 20px 8px 28px; }
.case-badge { align-self: flex-start; padding: 7px 11px; border-radius: 5px; background: #fff1e5; color: #b95b16; font-size: 12px; font-weight: 800; }
.case-summary h2 { margin: 18px 0 10px; color: var(--case-ink); font-size: clamp(27px, 2.4vw, 39px); line-height: 1.28; letter-spacing: -.035em; }
.case-summary-lead { margin: 0; color: var(--case-muted); font-size: 15px; line-height: 1.85; }
.case-facts { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); margin-top: 20px; border: 1px solid #dbe6f0; border-radius: 9px; overflow: hidden; background: #f7fafd; }
.case-facts > div { min-height: 76px; padding: 12px 14px; border-right: 1px solid #dbe6f0; border-bottom: 1px solid #dbe6f0; }
.case-facts > div:nth-child(2n) { border-right: 0; }
.case-facts > div:nth-last-child(-n+2) { border-bottom: 0; }
.case-facts small { display: block; margin-bottom: 5px; color: #8194a6; font-size: 11px; }
.case-facts strong { display: block; color: #294764; font-size: 13px; line-height: 1.5; }
.case-highlight { display: grid; grid-template-columns: 76px 1fr; gap: 12px; align-items: start; margin-top: 12px; padding: 13px 15px; border-left: 3px solid var(--case-orange); background: #fff7ef; }
.case-highlight i { color: #c4641a; font-size: 12px; font-style: normal; font-weight: 800; }
.case-highlight p { margin: 0; color: #5d6e7d; font-size: 13px; line-height: 1.65; }
.case-summary .purchase-actions { margin-top: auto; padding-top: 17px; }

.case-attention { border-top: 4px solid var(--case-orange); background: linear-gradient(110deg, #124b84, #1d73cb 68%, #3e83c8); }
.case-page .attention-kicker,
.case-page .recommended-products-kicker,
.case-page .recommended-product-type { color: var(--case-orange); }
.case-page .attention-next b { border-color: rgba(241,135,45,.35); color: #d97120; }

.case-page .legacy-product-body { padding-top: 28px; }
.case-page .detail-tab.active { color: #d36b1d; }
.case-page .detail-tab.active::after { background: var(--case-orange); }
.case-page .detail-block { scroll-margin-top: 96px; }
.case-page .block-head .label { color: #d36b1d; }

.case-relation-flow { display: grid; grid-template-columns: 1fr 26px 1fr 26px 1fr 26px 1fr; align-items: stretch; margin-top: 24px; }
.case-relation-flow article { padding: 18px 16px; border: 1px solid #dbe6f0; border-radius: 8px; background: #f7fafd; }
.case-relation-flow article span { color: var(--case-orange); font-size: 11px; font-weight: 900; }
.case-relation-flow article strong { display: block; margin: 9px 0 5px; color: var(--case-ink); }
.case-relation-flow article p { margin: 0; color: var(--case-muted); font-size: 12px; line-height: 1.65; }
.case-relation-flow > i { align-self: center; color: #90a7bb; font-style: normal; text-align: center; }

.case-problem-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin: 24px 0; }
.case-problem-grid article { padding: 21px 19px; border: 1px solid #dde8f1; border-top: 3px solid var(--case-orange); border-radius: 8px; background: #fff; }
.case-problem-grid b { color: #d36b1d; font-size: 11px; letter-spacing: .08em; }
.case-problem-grid h3 { margin: 10px 0 8px; color: var(--case-ink); font-size: 17px; }
.case-problem-grid p { margin: 0; color: var(--case-muted); font-size: 13px; line-height: 1.75; }

.case-stages { grid-template-columns: repeat(5,1fr); }
.case-stages .service-stage { min-width: 0; }
.case-boundary { margin-top: 22px; padding: 20px 22px; border: 1px solid #f3d4ba; border-radius: 8px; background: #fff8f1; }
.case-boundary strong { color: #bc5c16; }
.case-boundary p { margin: 7px 0 0; color: #65798b; font-size: 14px; line-height: 1.75; }

.case-evidence-table .status { display: inline-block; padding: 5px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.case-evidence-table .published { background: #e7f6ef; color: #18835a; }
.case-evidence-table .verify { background: #eaf3ff; color: #2169b2; }
.case-evidence-table .private { background: #fff1e5; color: #b85e1c; }

.case-fit-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 22px; }
.case-fit-grid article { padding: 20px; border-radius: 8px; background: #f4f8fc; }
.case-fit-grid small { color: #d36b1d; font-weight: 800; }
.case-fit-grid strong { display: block; margin: 8px 0; color: var(--case-ink); line-height: 1.5; }
.case-fit-grid span { color: var(--case-muted); font-size: 13px; line-height: 1.7; }

.case-detail-end { background: linear-gradient(120deg, #114c87, #1c73cc 70%, #ef8b38); }
.case-final-cta { background: linear-gradient(100deg, #0e477e, #1d70c1 72%, #ef8a34); }
.case-page .pd-final-cta .section-shell > a { background: #fff; color: #b85b18; }

@media (max-width: 1180px) {
  .case-hero-card { margin-inline: 24px; }
  .case-summary { padding: 18px 14px 4px 22px; }
  .case-summary h2 { font-size: 29px; }
  .case-facts > div { min-height: 70px; padding: 10px 12px; }
  .case-stages { grid-template-columns: repeat(3,1fr); }
}

@media (max-width: 900px) {
  .case-hero { min-height: 410px; padding-bottom: 54px; }
  .case-hero-heading { padding: 26px 24px 0; }
  html body main.case-page.case-page .case-hero-heading > span { font-size: 14px !important; line-height: 1.7 !important; }
  .case-hero-card { grid-template-columns: 1fr; margin-top: -140px; margin-bottom: 48px; padding: 14px; }
  .case-media { padding: 0; }
  .case-media-main { aspect-ratio: 16 / 10; }
  .case-summary { padding: 25px 10px 8px; }
  .case-summary .purchase-actions { margin-top: 0; }
  .case-relation-flow { grid-template-columns: repeat(2,1fr); gap: 12px; }
  .case-relation-flow > i { display: none; }
  .case-problem-grid, .case-fit-grid { grid-template-columns: 1fr; }
  .case-stages { grid-template-columns: repeat(2,1fr); }
}

@media (min-width: 641px) and (max-width: 900px) {
  html[lang="zh-CN"] main.case-page[data-content-type="case"] .case-hero { min-height: 430px; }
}

@media (max-width: 640px) {
  .case-hero { min-height: 390px; }
  .case-hero-heading { padding: 18px 18px 0; }
  .case-breadcrumb { margin-bottom: 56px; overflow: hidden; white-space: nowrap; }
  .case-hero-heading h1 { font-size: 34px; }
  .case-hero-heading > span { margin-top: 14px; font-size: 13px; line-height: 1.7; }
  .case-hero-card { width: auto; max-width: none; margin: -64px 14px 42px; padding: 10px; border-radius: 12px; }
  .case-page .block-head { margin-right: -22px; margin-left: -22px; }
  .case-media-main { aspect-ratio: 1 / 1; }
  .case-media-thumbs .media-thumb { height: 58px; }
  .case-summary { padding: 22px 5px 5px; }
  .case-summary h2 { font-size: 27px; }
  .case-facts { grid-template-columns: 1fr; }
  .case-facts > div, .case-facts > div:nth-child(2n), .case-facts > div:nth-last-child(-n+2) { min-height: 0; border-right: 0; border-bottom: 1px solid #dbe6f0; }
  .case-facts > div:last-child { border-bottom: 0; }
  .case-highlight { grid-template-columns: 1fr; gap: 5px; }
  .case-relation-flow, .case-stages { grid-template-columns: 1fr; }
  .case-evidence-table { overflow-x: auto; }
  .case-evidence-table table { min-width: 680px; }
}

@media (max-width: 430px) {
  .case-hero-heading h1 { font-size: 30px; line-height: 1.18; letter-spacing: -.045em; }
}

/* Rugged-device case: align every content module with the approved product-detail system. */
main.case-page[data-content-type="case"] {
  --case-blue: #165dff;
  --case-orange: #165dff;
  --case-project-start: #165dff;
  --case-project-end: #52baf5;
  --case-project-gradient: linear-gradient(135deg, var(--case-project-start) 0%, var(--case-project-end) 100%);
  --case-project-gradient-hover: linear-gradient(135deg, var(--case-project-end) 0%, var(--case-project-start) 100%);
  --abke-primary-button-gradient-start: var(--case-project-start);
  --abke-primary-button-gradient-end: var(--case-project-end);
  --abke-primary-button-hover-start: var(--case-project-end);
  --abke-primary-button-hover-end: var(--case-project-start);
  --case-ink: #1d2129;
  --case-muted: #4e5969;
  background: #f5f6fa;
}

html body main.case-page.case-page[data-content-type="case"] .case-hero-card.case-hero-card {
  border: 1px solid rgba(224, 228, 232, .5);
  border-color: rgba(224, 228, 232, .5) !important;
  border-radius: 0;
  box-shadow: 0 12px 32px rgba(28, 54, 86, .08);
}

main.case-page[data-content-type="case"] :is(.case-media-main, .case-media-thumbs .media-thumb) {
  border-radius: 5px;
}

main.case-page[data-content-type="case"] .case-media-main {
  border: 1px solid #e0e4e8;
  background: #f3f6fa;
}

main.case-page[data-content-type="case"] .case-media-thumbs .media-thumb {
  background: #edf2f8;
}

main.case-page[data-content-type="case"] .case-media-thumbs {
  grid-template-columns: repeat(3, max-content);
  justify-content: start;
  gap: 12px;
  margin-top: 10px;
}

main.case-page[data-content-type="case"] .case-media-thumbs .media-thumb.active {
  border-color: var(--case-project-start);
  box-shadow: 0 0 0 2px rgba(82, 186, 245, .22);
}

main.case-page[data-content-type="case"] .case-summary {
  padding: 28px 32px;
  color: #4e5c6d;
  background: #fff;
  font-size: 15px;
  text-align: left;
}

main.case-page[data-content-type="case"] .case-badge {
  box-sizing: border-box;
  height: 30px;
  padding: 6px 9px;
  border-radius: 5px;
  color: transparent;
  background-image:
    var(--case-project-gradient),
    linear-gradient(#f5f8ff, #f5f8ff);
  background-clip: text, padding-box;
  -webkit-background-clip: text, padding-box;
  -webkit-text-fill-color: transparent;
  font-size: 12px;
  font-weight: 700;
}

main.case-page[data-content-type="case"] .case-summary h2 {
  width: 100%;
  max-width: 470px;
  margin: 16px 0 7px;
  color: #121933;
  font-size: 24px;
  font-weight: 800;
  line-height: 30px;
  letter-spacing: -.025em;
  overflow-wrap: break-word;
  text-align: left;
  text-wrap: wrap;
  white-space: normal;
}

main.case-page[data-content-type="case"] .case-summary-lead {
  margin-top: 8px;
  color: #4e5969;
  font-size: 13px;
  line-height: 1.7;
}

main.case-page[data-content-type="case"] .case-facts {
  grid-auto-rows: minmax(72px, auto);
  align-items: stretch;
  margin-top: 10px;
  border-color: transparent;
  border-radius: 5px;
  background: transparent;
}

main.case-page[data-content-type="case"] .case-facts > div {
  display: flex;
  box-sizing: border-box;
  height: auto;
  min-height: 72px;
  align-self: stretch;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  padding: 7px 12px;
  border-color: #e5e8ed;
  background: #f7f8fa;
}

main.case-page[data-content-type="case"] .case-facts small {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: #1d2129;
  font-size: 12px;
  font-weight: 400;
  overflow-wrap: anywhere;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

main.case-page[data-content-type="case"] .case-facts strong {
  display: -webkit-box;
  overflow: hidden;
  margin-top: 4px;
  color: #1d2129;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4;
}

main.case-page[data-content-type="case"] .case-highlight {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 11px;
  padding: 10px;
  border-left: 0;
  background: transparent;
}

main.case-page[data-content-type="case"] .case-highlight i {
  display: inline-flex;
  box-sizing: border-box;
  width: max-content;
  height: 22px;
  align-items: center;
  padding: 0 8px;
  border: 1px solid transparent;
  border-image: var(--case-project-gradient) 1;
  border-radius: 0;
  color: transparent;
  background-image:
    var(--case-project-gradient),
    linear-gradient(135deg, rgba(22, 93, 255, .1), rgba(82, 186, 245, .1));
  background-clip: text, padding-box;
  -webkit-background-clip: text, padding-box;
  -webkit-text-fill-color: transparent;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
}

main.case-page[data-content-type="case"] .case-highlight p {
  color: #1d2129;
  font-size: 14px;
  line-height: 1.75;
}

main.case-page[data-content-type="case"] .case-summary .purchase-actions {
  display: grid !important;
  width: 100%;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  justify-content: stretch;
  gap: 16px !important;
  margin-top: auto;
  padding-top: 17px;
}

html body main.case-page.case-page[data-content-type="case"] .case-summary .purchase-actions.purchase-actions.purchase-actions > .legacy-btn.legacy-btn[href][href] {
  box-sizing: border-box;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  flex: initial !important;
  border-radius: 4px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

html body main.case-page.case-page[data-content-type="case"] .case-summary .purchase-actions > .legacy-btn.primary[href] {
  color: #fff !important;
  border: 0 !important;
  background: var(--case-project-start) !important;
  background-image: var(--case-project-gradient) !important;
}

html body main.case-page.case-page[data-content-type="case"] .case-summary .purchase-actions > .legacy-btn.secondary[href] {
  color: transparent !important;
  border: 1px solid transparent !important;
  background-image:
    var(--case-project-gradient),
    linear-gradient(#fff, #fff),
    var(--case-project-gradient) !important;
  background-clip: text, padding-box, border-box !important;
  -webkit-background-clip: text, padding-box, border-box !important;
  -webkit-text-fill-color: transparent;
}

html body main.case-page.case-page[data-content-type="case"] .case-summary.case-summary .purchase-actions.purchase-actions.purchase-actions > .legacy-btn.legacy-btn[href][href]:is(:hover, :focus-visible) {
  color: #fff !important;
  border: 0 !important;
  background: var(--case-project-start) !important;
  background-image: var(--case-project-gradient-hover) !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: #fff !important;
  outline: none;
}

main.case-page[data-content-type="case"] .case-summary .purchase-note {
  margin-top: 10px;
  color: #4e5969;
  font-size: 12px;
  line-height: 1.6;
  text-align: left;
}

main.case-page[data-content-type="case"] .case-attention {
  margin-top: -20px;
  border: 0;
  background: transparent;
}

main.case-page[data-content-type="case"] .case-attention .attention-inner {
  display: grid;
  box-sizing: border-box;
  height: 142px;
  min-height: 142px;
  grid-template-columns: minmax(300px, 1.05fr) minmax(0, 1.65fr) auto;
  align-items: center;
  gap: 28px;
  padding: 30px 34px;
  border: 1px solid rgba(224, 228, 232, .5);
  border-radius: 0;
  background: #4f9df9 url("../images/case-detail-decision-guide-bg.png") center / 100% 100% no-repeat;
  box-shadow: none;
}

html body main.case-page.case-page[data-content-type="case"] .case-attention .attention-inner.attention-inner {
  border-color: rgba(224, 228, 232, .5) !important;
}

main.case-page[data-content-type="case"] .case-attention .attention-inner::after {
  display: none;
}

main.case-page[data-content-type="case"] .case-attention .attention-title {
  margin: 0;
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  text-align: left;
}

main.case-page[data-content-type="case"] .case-attention .attention-questions {
  grid-column: 2;
  grid-row: 1;
  gap: 0;
  margin: 0;
}

main.case-page[data-content-type="case"] .case-attention .attention-question,
main.case-page[data-content-type="case"] .case-attention .attention-question:first-child {
  min-height: 72px;
  padding: 0 20px;
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, .44);
  border-radius: 0;
  background: transparent;
}

main.case-page[data-content-type="case"] .case-attention .attention-question:first-child {
  padding-left: 0;
  border-left: 0;
}

main.case-page[data-content-type="case"] .case-attention .attention-question:last-child {
  padding-right: 0;
}

main.case-page[data-content-type="case"] .case-attention .attention-question > b {
  display: inline;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  color: #fff;
  background: transparent;
  font-family: "DIN Alternate", "DIN Condensed", "Arial Narrow", sans-serif;
  font-size: 18px;
  line-height: 1.3;
}

main.case-page[data-content-type="case"] .case-attention .attention-question > strong {
  display: inline;
  margin: 0 0 0 4px;
  color: #fff;
  font-size: 13px;
}

main.case-page[data-content-type="case"] .case-attention .attention-question > em {
  color: rgba(255, 255, 255, .86);
  font-size: 13px;
}

main.case-page[data-content-type="case"] .case-attention .attention-next {
  grid-column: 3;
  grid-row: 1;
  width: max-content;
  height: 34px;
  min-height: 34px;
  margin: 0;
  padding: 0 16px;
  border-radius: 999px;
  color: var(--case-project-start) !important;
  border: 0;
  background: #fff;
  background-image: none;
  box-shadow: none;
}

main.case-page[data-content-type="case"] .case-attention .attention-next:is(:hover, :focus-visible) {
  color: var(--case-project-start) !important;
  background: #fff;
  background-image: none;
  outline: none;
}

main.case-page[data-content-type="case"] .case-attention .attention-next small {
  display: none;
}

main.case-page[data-content-type="case"] .case-attention .attention-next strong,
main.case-page[data-content-type="case"] .case-attention .attention-next > b {
  color: var(--case-project-start);
  background: var(--case-project-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

main.case-page[data-content-type="case"] .case-attention .attention-next > b {
  width: auto;
  height: auto;
  border: 0;
  background: var(--case-project-gradient);
  background-clip: text;
  -webkit-background-clip: text;
}

main.case-page[data-content-type="case"] .legacy-product-body {
  padding-top: 4px;
}

main.case-page[data-content-type="case"] .detail-main {
  border-radius: 5px;
  box-shadow: 0 12px 32px rgba(28, 54, 86, .06);
}

main.case-page[data-content-type="case"] .detail-tab.active {
  color: var(--case-project-start);
}

main.case-page[data-content-type="case"] .detail-tab::before {
  display: none;
}

main.case-page[data-content-type="case"] .detail-tab.active::after {
  background: var(--case-project-gradient);
}

main.case-page[data-content-type="case"] .block-head {
  border-left-color: #3d74dc;
  background: linear-gradient(105deg, #f3f6f9 0%, #fbfcfd 100%);
}

main.case-page[data-content-type="case"] .block-head::after {
  color: rgba(45, 87, 176, .06);
}

main.case-page[data-content-type="case"] #project-overview .block-head::after { content: "01"; }
main.case-page[data-content-type="case"] #problem-goal .block-head::after { content: "02"; }
main.case-page[data-content-type="case"] #build-process .block-head::after { content: "03"; }
main.case-page[data-content-type="case"] #evidence-records .block-head::after { content: "04"; }
main.case-page[data-content-type="case"] #project-lessons .block-head::after { content: "05"; }

main.case-page[data-content-type="case"] :is(#problem-goal, #project-lessons) .block-head {
  border-left-color: #83b8ff;
  border-bottom-color: rgba(255, 255, 255, .16);
  background: linear-gradient(115deg, #173866 0%, #2857a3 62%, #6551df 100%);
}

main.case-page[data-content-type="case"] #project-lessons .block-head {
  border-left-color: #59d0dc;
  background: linear-gradient(115deg, #123955 0%, #17627b 62%, #347e9c 100%);
}

main.case-page[data-content-type="case"] :is(#problem-goal, #project-lessons) .block-head :is(h2, p) {
  color: #fff;
}

html body main.case-page[data-content-type="case"] section#problem-goal.detail-block:not(#service-assurance):not(#company) > .detail-block-inner > .block-head > p,
html body main.case-page[data-content-type="case"] section#project-lessons.detail-block:not(#service-assurance):not(#company) > .detail-block-inner > .block-head > p {
  color: #dce8f6 !important;
}

main.case-page[data-content-type="case"] :is(#problem-goal, #project-lessons) .block-head::after {
  color: rgba(255, 255, 255, .12);
}

main.case-page[data-content-type="case"] #evidence-records .block-head {
  border-left-color: #7960c9;
  background: linear-gradient(105deg, #f5f2fa 0%, #fcfbfd 100%);
}

main.case-page[data-content-type="case"] .lead-box {
  color: #385270;
  background: #f2f5f9;
}

main.case-page[data-content-type="case"] .lead-box strong::before {
  background: #d9d9d9;
}

main.case-page[data-content-type="case"] .case-relation-flow {
  gap: 0;
  padding: 24px;
  border: 1px solid #dfe4e9;
  border-radius: 5px;
  background: #f7f8fa;
}

main.case-page[data-content-type="case"] .case-relation-flow article {
  min-height: 108px;
  border-color: #dfe4e9;
  border-radius: 5px;
  background: #fff;
  text-align: center;
}

main.case-page[data-content-type="case"] .case-relation-flow article span,
main.case-page[data-content-type="case"] .case-problem-grid b {
  color: #4074df;
}

main.case-page[data-content-type="case"] .case-relation-flow > i {
  color: #7fa4ee;
}

main.case-page[data-content-type="case"] .capability,
main.case-page[data-content-type="case"] .case-problem-grid article,
main.case-page[data-content-type="case"] .case-fit-grid article,
main.case-page[data-content-type="case"] .service-stage {
  border: 1px solid #e0e5ea;
  border-radius: 5px;
  background: #f7f9fb;
}

main.case-page[data-content-type="case"] .case-problem-grid article {
  border-top: 1px solid #e0e5ea;
}

main.case-page[data-content-type="case"] .capability-icon {
  border-radius: 5px;
  color: #326ce4;
  background: #edf4ff;
}

main.case-page[data-content-type="case"] :is(.capability h3, .case-problem-grid h3, .service-stage h3, .case-fit-grid strong) {
  color: #294467;
}

main.case-page[data-content-type="case"] :is(.capability p, .case-problem-grid p, .service-stage p, .case-fit-grid span) {
  color: #627587;
}

main.case-page[data-content-type="case"] .case-fit-grid small {
  color: #4074df;
}

main.case-page[data-content-type="case"] .case-boundary {
  border-color: #dfe4e9;
  border-left: 3px solid #3d74dc;
  border-radius: 5px;
  background: #f2f5f9;
}

main.case-page[data-content-type="case"] .case-boundary strong {
  color: #1d2129;
}

main.case-page[data-content-type="case"] .case-boundary p {
  color: #4e5969;
}

main.case-page[data-content-type="case"] .delivery-table {
  border-color: #dfe4e9;
  border-radius: 5px;
}

main.case-page[data-content-type="case"] .case-evidence-table :is(.published, .verify, .private) {
  color: #165dff;
  background: #eef4ff;
}

main.case-page[data-content-type="case"] .case-detail-end {
  --abke-primary-button-font-size: 14px;
  --abke-primary-button-radius: 5px;
  border-top-color: #74c7ff;
  background: #5faff7 url("../images/case-detail-end-cta-bg.png") center / cover no-repeat;
}

main.case-page[data-content-type="case"] .case-detail-end::after {
  display: none;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-content {
  grid-template-columns: 1fr;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-copy > h2 {
  font-size: 34px;
  line-height: 1.35;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-copy > h2 > span {
  display: block;
}

html[lang="zh-CN"] main.case-page[data-content-type="case"] .case-detail-end .detail-end-copy > h2 > span:first-child {
  white-space: nowrap;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-benefits span::before {
  color: #ffc18e;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-actions {
  grid-template-columns: repeat(2, 182px);
}

html body main.case-page.case-page[data-content-type="case"] .case-detail-end .detail-end-actions > .detail-end-btn.detail-end-btn {
  box-sizing: border-box;
  display: flex !important;
  width: 182px !important;
  min-width: 182px !important;
  max-width: 182px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 10px !important;
  border-radius: 5px !important;
  font-size: 14px !important;
  line-height: 1.2;
  text-align: center;
}

html[lang="en"] body main.case-page.case-page[data-content-type="case"] .case-detail-end .detail-end-actions > .detail-end-btn.detail-end-btn {
  white-space: normal !important;
}

html body main.case-page.case-page[data-content-type="case"] .case-detail-end .detail-end-actions > .detail-end-btn.detail-end-btn > span {
  display: block;
  width: 100%;
  min-width: 0;
  color: transparent !important;
  background: var(--case-project-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  white-space: inherit;
}

html body main.case-page.case-page[data-content-type="case"] .case-detail-end .detail-end-actions > .detail-end-btn.secondary > span {
  color: #fff !important;
  background: none;
  -webkit-text-fill-color: #fff;
}

html body main.case-page.case-page[data-content-type="case"] .case-detail-end .detail-end-actions > .detail-end-btn.detail-end-btn:is(:hover, :focus-visible) > span {
  background-image: var(--case-project-gradient-hover);
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-btn:not(.secondary) {
  color: var(--case-project-start) !important;
  border: 0 !important;
  background: #fff !important;
  background-image: none !important;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-btn.secondary {
  color: #fff !important;
  border: 1px solid #fff;
  background: transparent;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-btn:not(.secondary):is(:hover, :focus-visible) {
  color: var(--case-project-end) !important;
  border: 0 !important;
  background: #fff !important;
  background-image: none !important;
  outline: none;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-btn.secondary:is(:hover, :focus-visible) {
  color: #fff !important;
  border-color: #fff !important;
  background: transparent !important;
  background-image: none !important;
  outline: none;
}

main.case-page[data-content-type="case"] .case-detail-end .detail-end-foot {
  color: #fff;
}

main.case-page[data-content-type="case"] .recommended-products h2 {
  color: #1d2129;
}

html body main.case-page.case-page[data-content-type="case"] .recommended-products {
  background: #f1f6fd;
}

html body main.case-page.case-page[data-content-type="case"] .recommended-products .recommended-product-card.recommended-product-card.recommended-product-card {
  border: 0 !important;
  border-radius: 5px !important;
  box-shadow: 0 8px 22px rgba(58, 82, 116, .1) !important;
}

html body main.case-page.case-page[data-content-type="case"] .recommended-products .recommended-product-card.recommended-product-card.recommended-product-card:is(:hover, :focus-visible) {
  border: 0 !important;
  box-shadow: 0 10px 26px rgba(58, 82, 116, .13) !important;
}

main.case-page[data-content-type="case"] .recommended-product-type {
  box-sizing: border-box;
  display: inline-flex;
  width: max-content;
  min-height: 24px;
  max-width: 100%;
  align-items: center;
  padding: 4px 12px;
  border: 0 !important;
  border-radius: 3px;
  color: #111 !important;
  background: #e2edfc !important;
  -webkit-text-fill-color: #111 !important;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}

main.case-page[data-content-type="case"] .decision-card,
main.case-page[data-content-type="case"] .decision-card:first-child {
  border-color: #ecf0f6;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}

main.case-page[data-content-type="case"] .decision-sidebar > .decision-card:not(:first-child) {
  background-image: none;
}

main.case-page[data-content-type="case"] .decision-sidebar > .decision-card > .decision-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 20px 20px 0;
  color: #121933;
  border: 0;
  background: transparent;
  font-size: 20px;
}

main.case-page[data-content-type="case"] .decision-sidebar > .decision-card:first-child > .decision-head {
  font-size: 16px;
}

main.case-page[data-content-type="case"] .decision-sidebar > .decision-card:not(:first-child) > .decision-head {
  font-size: 18px;
}

main.case-page[data-content-type="case"] .decision-sidebar > .decision-card > .decision-head::before {
  width: 4px;
  height: 20px;
  flex: 0 0 4px;
  background: linear-gradient(180deg, #165dff 0%, #52baf5 100%);
  content: "";
}

main.case-page[data-content-type="case"] .decision-sidebar > .decision-card > .decision-body {
  padding: 12px 20px 20px;
  background: transparent;
}

main.case-page[data-content-type="case"] .decision-sidebar :is(.price-label, .entity-type) {
  display: inline-flex;
  width: max-content;
  height: 22px;
  align-items: center;
  padding: 0 8px;
  border: .5px solid #c8d5f4;
  border-radius: 0;
  color: transparent;
  background: linear-gradient(180deg, #165dff 0%, #52baf5 100%);
  background-clip: text;
  -webkit-background-clip: text;
  font-size: 11px;
  font-weight: 400;
  -webkit-text-fill-color: transparent;
}

html body main.case-page.case-page[data-content-type="case"] .decision-sidebar .entity-link > .entity-type.entity-type {
  box-sizing: border-box;
  height: 22px;
  padding: 0 8px !important;
  border: .5px solid #c8d5f4 !important;
  border-radius: 0 !important;
  color: transparent !important;
  background: linear-gradient(180deg, #165dff 0%, #52baf5 100%);
  background-clip: text;
  -webkit-background-clip: text;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  -webkit-text-fill-color: transparent;
}

main.case-page[data-content-type="case"] .decision-card:first-child .guide-steps {
  gap: 8px;
  padding: 0;
  border-radius: 0;
  background: transparent;
}

main.case-page[data-content-type="case"] .decision-card:first-child .price-value {
  color: #121933;
  font-size: 20px;
}

main.case-page[data-content-type="case"] .decision-card:first-child .price-note {
  color: #4e5969;
}

main.case-page[data-content-type="case"] .decision-card:first-child .guide-step,
main.case-page[data-content-type="case"] .decision-sidebar .entity-link {
  border: 0;
  border-radius: 0;
  background: #f7f9fc;
}

main.case-page[data-content-type="case"] .decision-card:first-child .guide-step {
  padding: 10px 12px;
}

main.case-page[data-content-type="case"] .decision-card:first-child .guide-step b {
  border: .5px solid #c8d5f4;
  border-radius: 0;
  color: transparent;
  background: linear-gradient(180deg, #165dff 0%, #52baf5 100%);
  background-clip: text;
  -webkit-background-clip: text;
  font-weight: 500;
  -webkit-text-fill-color: transparent;
}

main.case-page[data-content-type="case"] .decision-sidebar .entity-list {
  gap: 8px;
}

main.case-page[data-content-type="case"] .decision-sidebar .entity-link,
main.case-page[data-content-type="case"] .decision-sidebar .entity-link:hover {
  padding: 14px;
}

main.case-page[data-content-type="case"] .decision-sidebar .entity-link:hover {
  background: #f2f6fc;
}

html body main.case-page.case-page[data-content-type="case"] .decision-sidebar > .decision-card:not(:first-child) .entity-link > strong {
  color: #1d2129 !important;
}

main.case-page[data-content-type="case"] .decision-card:first-child .consultant-line {
  padding: 12px;
  border-top: 0;
  color: #4e5969;
  background: #f7f9fc;
}

main.case-page[data-content-type="case"] .decision-card:first-child .consultant-line strong {
  color: #121933;
  font-weight: 500;
}

html body main.case-page.case-page[data-content-type="case"] .decision-card:first-child .decision-body > .side-btn {
  box-sizing: border-box;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}

html body main.case-page.case-page[data-content-type="case"] .decision-card:first-child .decision-body > .side-btn:not(.ghost) {
  color: #fff !important;
  border: 0 !important;
  background: var(--case-project-start) !important;
  background-image: var(--case-project-gradient) !important;
}

html body main.case-page.case-page[data-content-type="case"] .decision-sidebar :is(.side-btn, .entity-more) {
  min-height: 40px;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  color: var(--case-project-start) !important;
  background:
    linear-gradient(#fff, #fff) padding-box,
    var(--case-project-gradient) border-box !important;
  font-size: 13px;
  box-shadow: none !important;
  transition: color .2s ease, transform .2s ease;
}

html body main.case-page.case-page[data-content-type="case"] .decision-sidebar :is(.side-btn, .entity-more):is(:hover, :focus-visible) {
  color: #fff !important;
  background: var(--case-project-start) !important;
  background-image: var(--case-project-gradient-hover) !important;
  outline: none;
}

html body main.case-page.case-page[data-content-type="case"] .decision-sidebar :is(.side-btn, .entity-more):active {
  transform: translateY(1px);
}

main.case-page[data-content-type="case"] .case-final-cta {
  background:
    radial-gradient(circle at 84% 0%, rgba(232, 121, 46, .23), transparent 25%),
    linear-gradient(120deg, #123f74 0%, #1d5f9d 76%, #8c461c 140%);
}

html body main.case-page.case-page[data-content-type="case"] :is(#site-final-cta-rules, section.case-final-cta).site-final-cta.site-final-cta.site-final-cta .section-shell > a {
  color: transparent !important;
  background-image:
    var(--case-project-gradient),
    linear-gradient(#fff, #fff) !important;
  background-clip: text, border-box !important;
  -webkit-background-clip: text, border-box !important;
  -webkit-text-fill-color: transparent !important;
}

html body main.case-page.case-page[data-content-type="case"] :is(#site-final-cta-rules, section.case-final-cta).site-final-cta.site-final-cta.site-final-cta .section-shell > a:is(:hover, :focus-visible) {
  color: transparent !important;
  background-image:
    var(--case-project-gradient-hover),
    linear-gradient(#fff, #fff) !important;
  background-clip: text, border-box !important;
  -webkit-background-clip: text, border-box !important;
  -webkit-text-fill-color: transparent !important;
  outline: none;
}

html[lang="en"] main.case-page[data-content-type="case"] .case-hero {
  min-height: 740px;
}

@media (min-width: 901px) and (max-width: 1100px) {
  main.case-page[data-content-type="case"] .case-summary h2 {
    max-width: 380px;
  }
}

@media (max-width: 900px) {
  html[lang="en"] main.case-page[data-content-type="case"] .case-hero {
    min-height: 560px;
  }

  main.case-page[data-content-type="case"] .case-summary {
    padding: 20px 22px;
  }

  main.case-page[data-content-type="case"] .case-summary h2 {
    max-width: none;
  }

  main.case-page[data-content-type="case"] .case-attention .attention-inner {
    display: block;
    height: auto;
    min-height: 0;
    padding: 24px;
    background-size: cover;
  }

  main.case-page[data-content-type="case"] .case-attention .attention-questions {
    grid-template-columns: 1fr;
    margin-top: 24px;
  }

  main.case-page[data-content-type="case"] .case-attention .attention-question,
  main.case-page[data-content-type="case"] .case-attention .attention-question:first-child {
    min-height: 0;
    padding: 18px 0;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, .44);
  }

  main.case-page[data-content-type="case"] .case-attention .attention-question:first-child {
    padding-top: 0;
    border-top: 0;
  }

  main.case-page[data-content-type="case"] .case-attention .attention-next {
    margin-top: 20px;
  }

  main.case-page[data-content-type="case"] .case-relation-flow {
    gap: 12px;
  }
}

@media (max-width: 640px) {
  html[lang="en"] main.case-page[data-content-type="case"] .case-hero {
    min-height: 590px;
  }

  main.case-page[data-content-type="case"] .case-hero-card {
    border-radius: 0;
  }

  main.case-page[data-content-type="case"] .case-summary {
    padding: 18px;
  }

  main.case-page[data-content-type="case"] .case-summary h2 {
    font-size: 26px;
  }

  main.case-page[data-content-type="case"] .case-facts > div,
  main.case-page[data-content-type="case"] .case-facts > div:nth-child(2n),
  main.case-page[data-content-type="case"] .case-facts > div:nth-last-child(-n+2) {
    height: auto;
    min-height: 72px;
  }

  main.case-page[data-content-type="case"] .case-summary .purchase-actions {
    grid-template-columns: 1fr;
  }

  main.case-page[data-content-type="case"] .case-attention .attention-inner {
    width: calc(100% - 28px);
    padding: 25px 20px;
  }

  main.case-page[data-content-type="case"] .case-attention .attention-title {
    font-size: 20px;
  }

  main.case-page[data-content-type="case"] .detail-main {
    border-radius: 0;
  }

  main.case-page[data-content-type="case"] .case-relation-flow {
    padding: 20px;
  }

  main.case-page[data-content-type="case"] .case-detail-end .detail-end-copy > h2 {
    font-size: 24px;
  }

  html[lang="zh-CN"] main.case-page[data-content-type="case"] .case-detail-end .detail-end-copy > h2 {
    font-size: 20px;
  }

  main.case-page[data-content-type="case"] .case-detail-end .detail-end-actions {
    grid-template-columns: 182px;
  }
}
