/* Shared editorial foundation for the three brand / launch solution pages.
   Page-specific illustrations and compositions live in solution-{slug}.css. */
.solution-design {
  --solution-blue: #A5BAFF;
  --solution-rule: rgba(23, 19, 14, .18);
}
.solution-design main > section,
.solution-design #contact { scroll-margin-top: 96px; }
.solution-design .sol-hero {
  min-height: auto;
  padding-top: clamp(135px, 12vw, 180px);
  padding-bottom: clamp(64px, 7vw, 100px);
}
.solution-design .sol-hero > .container {
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(36px, 5vw, 72px);
}
.solution-design .sol-hero-copy { min-width: 0; }
.solution-design .sol-hero .sec-label {
  font-size: 10px;
  line-height: 1.8;
  gap: 10px;
}
.solution-design .sol-name,
html[lang="en"] .solution-design .sol-name {
  font-size: clamp(37px, 4vw, 58px);
  font-weight: 620;
  line-height: 1.14;
  letter-spacing: 0;
  margin-top: 25px;
  text-wrap: balance;
}
html[lang="zh"] .solution-design .sol-name {
  font-size: clamp(35px, 3.5vw, 50px);
  line-height: 1.35;
  font-weight: 630;
  word-break: normal;
  overflow-wrap: normal;
}
.solution-design .sol-name em { color: var(--solution-blue); font-style: normal; }
.solution-design .sol-one {
  font-size: 16px;
  line-height: 1.85;
  margin-top: 26px;
  max-width: 570px;
}
html[lang="zh"] .solution-design .sol-one { font-size: 16px; line-height: 1.9; }
.solution-design .sol-hero .hero-actions { margin-top: 29px; gap: 12px; }
.solution-design .sol-hero .btn { font-size: 13px; }
.solution-design .sol-chips { margin-top: 25px; gap: 8px; }
.solution-design .sol-chip { font-size: 10px; letter-spacing: .08em; padding: 6px 11px; }
.solution-design .sol-sec { padding-block: clamp(70px, 7.5vw, 108px); }
.solution-design .sol-ghostno { display: none; }
.solution-design .sol-h2 {
  font-size: clamp(29px, 3.35vw, 47px);
  font-weight: 620;
  line-height: 1.2;
  letter-spacing: 0;
  text-wrap: balance;
  max-width: 910px;
  margin-top: 22px;
}
html[lang="zh"] .solution-design .sol-h2 {
  font-size: clamp(27px, 3vw, 42px);
  line-height: 1.45;
}
.solution-design .sol-body { font-size: 16px; line-height: 1.9; }
.solution-design .sol-fn,
.solution-design .sol-path-note { font-size: 12px; line-height: 1.85; }
.solution-design .sol-src { letter-spacing: .025em; text-transform: none; line-height: 1.75; }
.solution-design .sol-src a { overflow-wrap: anywhere; }
.solution-design .sol-ico { width: 28px; height: 28px; }
.solution-design .cta .sec-title {
  font-size: clamp(31px, 4vw, 54px);
  line-height: 1.2;
  font-weight: 620;
  text-wrap: balance;
}
html[lang="zh"] .solution-design .cta .sec-title { line-height: 1.45; }
.solution-design .cta .sec-lead { font-size: 16px; line-height: 1.85; max-width: 800px; }
.solution-design .cta .sec-label { margin-bottom: 22px; }
.solution-design .cta .form-hint { max-width: 430px; }
.solution-design figure { min-width: 0; }
.solution-design figure svg { max-width: 100%; }
.solution-design .scene-dark summary:focus-visible,
.solution-design .scene-cobalt summary:focus-visible,
.solution-design .scene-black summary:focus-visible { outline-color: var(--paper-dark); }
@media (max-width: 1080px) {
  .solution-design .sol-hero > .container { gap: 32px; }
  html[lang="en"] .solution-design .sol-name { font-size: 43px; }
  html[lang="zh"] .solution-design .sol-name { font-size: 38px; }
}
@media (max-width: 900px) {
  .solution-design .sol-hero > .container { grid-template-columns: minmax(0, 1fr); gap: 42px; }
  .solution-design .sol-hero-copy { max-width: 680px; }
  .solution-design .sol-one { max-width: 640px; }
}
@media (max-width: 600px) {
  .solution-design .sol-hero { padding-top: 125px; padding-bottom: 54px; }
  .solution-design .sol-name,
  html[lang="en"] .solution-design .sol-name { font-size: clamp(33px, 8.3vw, 43px); }
  html[lang="zh"] .solution-design .sol-name { font-size: clamp(31px, 7.8vw, 39px); }
  .solution-design .sol-one,
  html[lang="zh"] .solution-design .sol-one { font-size: 14px; }
  .solution-design .sol-h2,
  html[lang="zh"] .solution-design .sol-h2 { font-size: 28px; }
  .solution-design .sol-body { font-size: 14px; }
  .solution-design .sol-sec { padding-block: 64px; }
  .solution-design .sol-hero .hero-actions { align-items: stretch; }
  .solution-design .sol-hero .btn { text-align: center; justify-content: center; }
  .solution-design .cta .sec-lead { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(.solution-design) { scroll-behavior: auto; }
  .solution-design .reveal { opacity: 1; transform: none; transition: none; }
}
