/* Solutions overview: real DOM implementation (no screenshot stage). */
body.post-type-archive-solution, body.solutions-preview { background:#fff; }
body.post-type-archive-solution #main-content, body.solutions-preview #main-content { min-height:0; padding:0; background:#fff; }
body.post-type-archive-solution .site-header,
body.post-type-archive-solution .site-footer { display:block; }
body.post-type-archive-solution .solutions-mobile-live, body.solutions-preview .solutions-mobile-live { display:block; width:100%; }
body.post-type-archive-solution .solutions-reference-stage, body.solutions-preview .solutions-reference-stage { display:none; }
body.post-type-archive-solution .solutions-mobile-live .shell, body.solutions-preview .solutions-mobile-live .shell { width:100%; max-width:none; margin-inline:auto; padding-inline:24px; box-sizing:border-box; }

.solutions-live-hero { position:relative; overflow:hidden; min-height:520px; padding:48px 0 36px; background:#f5f8fb; }
.solutions-live-hero:after { content:""; position:absolute; z-index:0; right:-125px; top:-115px; width:470px; height:470px; border-radius:50%; background:#fbeaed; }
.solutions-live-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px; align-items:start; }
.solutions-live-hero-copy { min-width:0; }
.solutions-live-hero h1 { max-width:100%; margin:22px 0 13px; color:#101827; font-size: var(--font-size-h1); font-weight:var(--font-weight-heading); letter-spacing:0; line-height:var(--line-height-display); }
.solutions-live-hero p:not(.eyebrow) { max-width:690px; margin:0; color:#6d788b; font-size:var(--font-size-body); line-height:var(--line-height-copy); }
.solutions-live-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:54px; }
.solutions-live-actions .button { min-width:190px; min-height:52px; justify-content:center; }
.solutions-live-actions .button-outline { color:var(--c-brand); background:#fff; border:1px solid var(--c-brand); }
.solutions-live-hero-media { min-width:0; overflow:hidden; border-radius:8px; background:#e9eef3; box-shadow:0 12px 34px rgba(15,23,42,.05); }
.solutions-live-hero-media img { display:block; width:100%; aspect-ratio:1.62/1; object-fit:cover; }

.solutions-live-section { padding:68px 0; }
.solutions-live-hero + .solutions-live-section { position:relative; z-index:3; padding:0; margin-top:-50px; }
.solutions-live-hero + .solutions-live-section + .solutions-live-section { padding-top:76px; }
.solutions-live-section.is-soft { background:#fff; }
.solutions-live-stats { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); overflow:hidden; margin:0; background:#fff; border:1px solid #e4e9ef; border-radius:10px; box-shadow:0 7px 22px rgba(15,23,42,.035); }
.solutions-live-stat { min-height:98px; display:flex; flex-direction:column; justify-content:center; padding:18px 24px; background:#fff; border-right:1px solid #e8edf2; }
.solutions-live-stat:last-child { border-right:0; }
.solutions-live-stat strong { color:var(--c-brand); font-size:var(--font-size-h3); line-height:var(--line-height-display); }
.solutions-live-stat span { margin-top:9px; color:#778397; font-size:var(--font-size-micro); font-weight:var(--font-weight-bold); letter-spacing:.02em; text-transform:uppercase; }

.solutions-live-heading { margin-bottom:38px; }
.solutions-live-heading h2 { margin:14px 0 9px; color:#111827; font-size: var(--font-size-h1); font-weight:var(--font-weight-heading); letter-spacing:-.035em; line-height:var(--line-height-display); }
.solutions-live-heading p:not(.eyebrow) { max-width:900px; margin:0; color:#748094; font-size:var(--font-size-small); line-height:var(--line-height-copy); }
.solutions-live-heading .eyebrow,.solutions-live-hero .eyebrow,.solutions-live-case-copy .eyebrow { color:var(--c-brand); font-size:var(--font-size-caption); font-weight:var(--font-weight-heading); letter-spacing:.02em; text-transform:uppercase; }
.solutions-live-heading .eyebrow:before,.solutions-live-hero .eyebrow:before,.solutions-live-case-copy .eyebrow:before { content:""; display:inline-block; width:22px; height:3px; margin-right:12px; vertical-align:middle; background:var(--c-brand); }
/* Match the three overview section labels to the brand red used site-wide. */
html body.post-type-archive-solution main#main-content .solutions-brand-eyebrow:before { background: var(--c-brand); }

.solutions-live-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.solutions-live-card { min-height:216px; padding:0; color:inherit; background:#fff; border:1px solid #dfe5ec; border-radius:10px; box-shadow:3px 4px 0 #edf0f3; transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
.solutions-live-card > a { min-height:216px; display:flex; flex-direction:column; align-items:flex-start; padding:20px; color:inherit; }
.solutions-live-card:hover { transform:translateY(-3px); border-color:#f3a9b0; box-shadow:4px 7px 0 #edf0f3; }
.solutions-live-card b,.solutions-live-step b { width:42px; height:42px; display:grid; place-items:center; margin-bottom:17px; color:var(--c-brand); background:#fff0f2; border-radius:9px; font-size:var(--font-size-small); }
.solutions-live-card h3,.solutions-live-step h3 { margin:0 0 10px; color:#1b2432; font-size:var(--font-size-lead); line-height:var(--line-height-heading); }
.solutions-live-card p,.solutions-live-step p { margin:0 0 18px; color:#788397; font-size:var(--font-size-caption); line-height:var(--line-height-copy); }
.solutions-live-card span { display:inline-flex; align-items:center; gap:6px; margin-top:auto; color:var(--c-brand); font-size:var(--font-size-caption); font-weight:var(--font-weight-bold); }
.solutions-live-card svg { width:13px; height:13px; }

.solutions-live-proof { margin-block:10px; padding:34px 38px 26px; display:grid; gap:18px; color:#fff; background:#071522; border-radius:11px; }
.solutions-live-section:has(.solutions-live-cards) + .solutions-live-section:has(.solutions-live-proof) { padding-top:28px; }
.solutions-live-section:has(.solutions-live-cards) { padding-bottom:28px; }
.solutions-live-section:has(.solutions-live-proof) { padding-bottom:28px; }
.solutions-live-section:has(.solutions-live-proof) + .solutions-live-section:has(.solutions-live-steps) { padding-top:28px; }
.solutions-live-section:has(.solutions-live-steps) { padding-bottom:28px; }
.solutions-live-section:has(.solutions-live-steps) + .solutions-live-section:has(.solutions-live-case) { padding-top:28px; }
.solutions-live-proof__heading { display:flex; align-items:flex-end; min-height:28px; }
/* The proof panel is dark, so its heading must remain readable over the
 * global heading color rules loaded by the theme. */
html body.post-type-archive-solution main#main-content .solutions-live-proof__heading h2,
.solutions-live-proof__heading h2 { margin:0; color:#fff !important; font-size:var(--font-size-h3); line-height:var(--line-height-display); }
.solutions-live-proof__stats { margin:0; background:transparent; border:0; border-radius:0; box-shadow:none; }
.solutions-live-proof .solutions-live-stat { min-height:92px; padding:0 24px; display:grid; align-content:center; justify-content:start; justify-items:start; text-align:left; background:transparent; border-color:rgba(255,255,255,.13); }
.solutions-live-proof .solutions-live-stat:first-child { padding-left:0; }
.solutions-live-proof .solutions-live-stat strong { font-size:var(--font-size-h3); line-height:var(--line-height-display); }
.solutions-live-proof .solutions-live-stat span { display:block; margin-top:6px; max-width:110px; font-size:var(--font-size-micro); line-height:var(--line-height-tight); letter-spacing:.03em; color:#91a0b1; }

.solutions-live-steps { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }
.solutions-live-step { position:relative; min-height:155px; padding:20px; background:#fff; border:1px solid #dfe5ec; border-radius:10px; box-shadow:3px 4px 0 #edf0f3; }
.solutions-live-step-arrow { position:absolute; z-index:2; right:-15px; top:50%; width:14px; height:14px; transform:translateY(-50%); color:var(--c-brand); stroke-width:2.4; pointer-events:none; }
.solutions-live-step p { margin-bottom:0; }

.solutions-live-case { display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:18px; min-height:405px; overflow:visible; background:transparent; border:0; border-radius:0; }
.solutions-live-case > figure { margin:0; min-height:405px; overflow:hidden; border-radius:10px; background:#e9eef3; }
.solutions-live-case > figure > img { display:block; width:100%; height:100%; min-height:405px; object-fit:cover; }
.solutions-live-case-copy { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; min-height:405px; padding:42px 38px; background:#fff; border:1px solid #dfe5ec; border-radius:10px; }
html body.post-type-archive-solution main#main-content .solutions-live-case-copy h3 { margin:18px 0 24px; color:#1b2432; font-size:clamp(32px,2.7vw,44px) !important; line-height:1.1; letter-spacing:-.025em; }
.solutions-live-case-copy > p:not(.eyebrow) { max-width:570px; margin:0; color:#748094; font-size:var(--font-size-caption); line-height:var(--line-height-copy); }
.solutions-live-case-results { width:100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; margin:38px 0 28px; }
.solutions-live-case-results strong { display:block; color:var(--c-brand); font-size:var(--font-size-h2); line-height:var(--line-height-display); }
.solutions-live-case-results span { display:block; margin-top:5px; color:#7b8798; font-size:var(--font-size-caption); }

.solutions-live-section:last-child { padding-top:15px; padding-bottom:70px; }

@media (max-width:1050px) {
  .solutions-live-hero-grid { grid-template-columns:1fr 1fr; gap:30px; }
  .solutions-live-hero h1 { font-size:var(--font-size-h1); }
  .solutions-live-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .solutions-live-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .solutions-live-step-arrow { display:none; }
}
@media (max-width:760px) {
  body.post-type-archive-solution .solutions-mobile-live .shell, body.solutions-preview .solutions-mobile-live .shell { width:calc(100% - 32px); max-width:none; }
  .solutions-live-hero { padding:48px 0 56px; }
  .solutions-live-hero-grid,.solutions-live-case { grid-template-columns:1fr; }
  .solutions-live-hero h1 { font-size:var(--font-size-h2); }
  .solutions-live-actions { margin-top:30px; }
  .solutions-live-stats { grid-template-columns:repeat(2,1fr); }
  .solutions-live-stat { border-bottom:1px solid #e8edf2; }
  .solutions-live-cards,.solutions-live-steps { grid-template-columns:1fr; }
  .solutions-live-case > figure,.solutions-live-case > figure > img { min-height:260px; }
  .solutions-live-case-copy { padding:26px; }
  html body.post-type-archive-solution main#main-content .solutions-live-case-copy h3 { font-size:clamp(28px,7vw,36px) !important; }
  .solutions-live-case-results { gap:12px; margin:30px 0 24px; }
  .solutions-live-case-results strong { font-size:var(--font-size-h3); }
  .solutions-live-proof { margin-block:6px; padding:24px 20px 20px; gap:14px; }
  .solutions-live-proof__heading h2 { font-size:var(--font-size-h4); }
  .solutions-live-proof .solutions-live-stat { min-height:72px; padding:0 14px; }
  .solutions-live-proof .solutions-live-stat strong { font-size:var(--font-size-h4); }
  .solutions-live-proof .solutions-live-stat span { font-size:var(--font-size-micro); max-width:none; }
}
/* Archive navigation, filtering, pagination and FAQ. */
.solutions-filter{display:grid;grid-template-columns:minmax(220px,1.5fr) minmax(170px,.8fr) minmax(150px,.65fr) auto auto;gap:12px;align-items:end;margin:0 0 30px;padding:18px;background:#f7f9fb;border:1px solid #e2e7ed;border-radius:10px}.solutions-filter label{display:grid;gap:7px;color:#344054;font-size:var(--font-size-caption);font-weight:var(--font-weight-bold)}.solutions-filter input,.solutions-filter select{width:100%;min-height:44px;padding:9px 12px;background:#fff;border:1px solid #cfd7e2;border-radius:6px;color:#1b2432}.solutions-filter .button{min-height:44px;white-space:nowrap}.solutions-pagination{margin-top:38px}.solutions-pagination ul{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0;padding:0;list-style:none}.solutions-pagination a,.solutions-pagination span{min-width:42px;min-height:42px;display:grid;place-items:center;padding:8px 12px;border:1px solid #dbe2ea;border-radius:6px}.solutions-pagination .current{color:#fff;background:var(--c-brand);border-color:var(--c-brand)}.solutions-empty{padding:46px 24px;text-align:center;background:#f7f9fb;border:1px solid #e2e7ed;border-radius:10px}.solutions-empty h3{margin:0 0 8px}.solutions-faq{display:grid;gap:10px;max-width:980px}.solutions-faq details{background:#fff;border:1px solid #dfe5ec;border-radius:8px}.solutions-faq summary{cursor:pointer;padding:18px 22px;color:#172033;font-weight:var(--font-weight-bold)}.solutions-faq details>div{padding:0 22px 20px;color:#667085;line-height:var(--line-height-relaxed)}.solutions-live-card h3{overflow-wrap:anywhere}.solutions-live-card p{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:4}.solutions-live-card:focus-within{outline:2px solid var(--c-brand);outline-offset:3px}
@media(max-width:1050px){.solutions-filter{grid-template-columns:repeat(2,minmax(0,1fr))}.solutions-filter .button{width:100%}}
@media(max-width:760px){.solutions-filter{grid-template-columns:1fr}.solutions-faq summary{padding:16px}.solutions-faq details>div{padding:0 16px 16px}}

.solutions-mobile-live{display:flex;flex-direction:column}.solutions-mobile-live>.site-breadcrumbs{order:0}.solutions-mobile-live>.solutions-section{order:var(--section-order,50);width:100%}

html body[class] .solutions-mobile-live .shell,
body.solutions-preview .solutions-mobile-live .shell {
  width: min(100% - 144px, 1776px);
  max-width: 1776px;
  margin-inline: auto;
  padding-inline: 0;
  box-sizing: border-box;
}

html body[class] .solutions-mobile-live .shell.solutions-live-proof,
body.solutions-preview .solutions-mobile-live .shell.solutions-live-proof {
  padding: 34px 52px 28px;
}

@media (max-width: 760px) {
  html body[class] .solutions-mobile-live .shell,
  body.solutions-preview .solutions-mobile-live .shell {
    width: min(100% - 32px, 1776px);
  }

  html body[class] .solutions-mobile-live .shell.solutions-live-proof,
  body.solutions-preview .solutions-mobile-live .shell.solutions-live-proof {
    padding: 24px 20px 20px;
  }
}

html body[class] .solutions-live-hero-media {
  width: 100%;
  max-width: 100%;
  justify-self: end;
  align-self: start;
}

html body[class] .solutions-live-hero-media img {
  width: 100%;
  aspect-ratio: 2.05 / 1;
  object-fit: cover;
}

/* Keep the "Why Choose TONGYI Solutions?" proof panel free of white:
 * the unified statistics contract (component-size-system.css) paints every
 * `.solutions-live-stats` rail as a white card, which clashes inside the
 * dark proof panel. Restore the intended transparent, borderless rail on
 * desktop, where that contract is active. */
@media (min-width: 769px) {
  html body.post-type-archive-solution main#main-content .solutions-live-proof .solutions-live-proof__stats,
  body.solutions-preview main#main-content .solutions-live-proof .solutions-live-proof__stats {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  html body.post-type-archive-solution main#main-content .solutions-live-proof .solutions-live-stat,
  body.solutions-preview main#main-content .solutions-live-proof .solutions-live-stat {
    background: transparent !important;
    height: auto !important;
    min-height: 92px !important;
    padding: 0 24px !important;
    display: grid !important;
    align-content: center !important;
    justify-content: start !important;
    justify-items: start !important;
    border: 0 !important;
    border-left: 1px solid rgba(255, 255, 255, .13) !important;
  }

  html body.post-type-archive-solution main#main-content .solutions-live-proof .solutions-live-stat:first-child,
  body.solutions-preview main#main-content .solutions-live-proof .solutions-live-stat:first-child {
    border-left: 0 !important;
  }

  html body.post-type-archive-solution main#main-content .solutions-live-proof .solutions-live-stat span,
  body.solutions-preview main#main-content .solutions-live-proof .solutions-live-stat span {
    color: #91a0b1 !important;
  }
}

/* Solution portfolio cards: image-rich layout aligned with the Industries directory. */
body.post-type-archive-solution .solutions-live-cards {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}
body.post-type-archive-solution .solutions-live-card {
  min-width: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  color: inherit;
  background: #fff;
  border: 1px solid #dfe5ec;
  border-radius: 9px;
  box-shadow: 2px 3px 0 #edf1f4;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
body.post-type-archive-solution .solutions-live-card:hover {
  border-color: rgba(242,29,47,.5);
  box-shadow: 0 10px 28px rgba(22,33,49,.09);
  transform: translateY(-3px);
}
body.post-type-archive-solution .solutions-live-card > a,
body.post-type-archive-solution .solutions-live-card__link {
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 0;
  color: inherit;
  text-decoration: none;
}
body.post-type-archive-solution .solutions-live-card__media {
  margin: 0;
  overflow: hidden;
  background: #eef2f5;
}
body.post-type-archive-solution .solutions-live-card__image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center;
  transition: transform .22s ease;
}
body.post-type-archive-solution .solutions-live-card:hover .solutions-live-card__image {
  transform: scale(1.025);
}
body.post-type-archive-solution .solutions-live-card__body {
  min-height: 220px;
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: 22px 24px 21px;
}
body.post-type-archive-solution .solutions-live-card b.solutions-live-card__badge {
  width: auto;
  height: auto;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 16px;
  padding: 7px 12px;
  color: var(--c-brand);
  background: #fff0f2;
  border-radius: 999px;
  font-size: var(--font-size-micro);
  font-weight: var(--font-weight-heading);
}
body.post-type-archive-solution .solutions-live-card h3 {
  margin: 0;
  color: #1b2432;
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-heading);
  line-height: var(--line-height-heading);
  letter-spacing: -.025em;
}
body.post-type-archive-solution .solutions-live-card p {
  margin: 12px 0 20px;
  color: #667085;
  font-size: var(--font-size-caption);
  line-height: var(--line-height-copy);
  display: block;
  overflow: visible;
  -webkit-box-orient: initial;
  -webkit-line-clamp: unset;
}
body.post-type-archive-solution .solutions-live-card span.solutions-live-card__action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  color: var(--c-brand);
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-heading);
}
body.post-type-archive-solution .solutions-live-card__action i,
body.post-type-archive-solution .solutions-live-card__action svg {
  width: 13px;
  height: 13px;
  transition: transform .2s ease;
}
body.post-type-archive-solution .solutions-live-card:hover .solutions-live-card__action i,
body.post-type-archive-solution .solutions-live-card:hover .solutions-live-card__action svg {
  transform: translateX(3px);
}
@media (max-width: 1180px) {
  body.post-type-archive-solution .solutions-live-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  body.post-type-archive-solution .solutions-live-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  body.post-type-archive-solution .solutions-live-cards { grid-template-columns: 1fr; gap: 16px; }
  body.post-type-archive-solution .solutions-live-card__body { min-height: 205px; }
}