/* Basisstil für .px-dial-label ist eigentlich in home.css definiert; diese Seite lädt
   home.css nicht, verwendet die Klasse aber mehrfach (Hero-Eyebrow, "Nutzen", "Mehr dazu
   in Insights") – deshalb hier dupliziert statt eine fachfremde Abhängigkeit einzuführen. */
.px-dial-label { font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; opacity: .45; margin-bottom: 10px; }

.px-solution-cta h2 {
  font-size: clamp(28px, 4vw, 46px); line-height: 1.08; letter-spacing: -.03em; font-weight: 700;
}

.px-solution-hero-inner { max-width: 1120px; }
.px-solution-hero h1 {
  max-width: 13em; margin: 18px 0 0;
  font-size: clamp(42px, 6.6vw, 88px); line-height: .98;
  letter-spacing: -.045em; font-weight: 700;
}
.px-solution-hero p {
  max-width: 720px; margin: 28px 0 30px;
  color: rgba(16,17,18,.66); font-size: clamp(17px, 1.7vw, 21px); line-height: 1.55;
}
.px-solution-comparison {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px;
}
.px-solution-comparison .px-card { min-width: 0; padding: clamp(28px, 4vw, 44px); }
.px-solution-comparison .px-card:nth-child(2) { background: var(--color-ink); color: #fff; }
.px-solution-comparison h2,
.px-solution-benefit h2 {
  margin: 0 0 18px; font-size: clamp(25px, 3vw, 40px); line-height: 1.08; letter-spacing: -.035em;
}
.px-solution-comparison p,
.px-solution-benefit p,
.px-solution-faq p,
.px-solution-related p { margin: 0; color: inherit; opacity: .68; font-size: 16px; line-height: 1.65; }
.px-solution-benefits {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px;
}
.px-solution-benefits > .px-dial-label { grid-column: 1 / -1; margin-bottom: 2px; }
.px-solution-benefit { min-width: 0; padding: clamp(26px, 3.5vw, 38px); }
.px-solution-scope {
  padding-top: clamp(32px, 5vw, 58px); padding-bottom: clamp(32px, 5vw, 58px);
  border-radius: 30px; background: var(--color-ink); color: #fff;
}
.px-solution-scope h2 { margin: 0 0 28px; font-size: clamp(30px, 4vw, 50px); letter-spacing: -.04em; }
.px-solution-scope ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.px-solution-scope li { position: relative; padding: 17px 18px 17px 43px; border-radius: 15px; background: rgba(255,255,255,.07); line-height: 1.45; }
.px-solution-scope li::before { content: "+"; position: absolute; left: 18px; color: var(--color-accent); font-family: var(--font-mono); }
.px-workflow-pattern { margin-top: 24px; padding: clamp(28px, 4vw, 40px); border-radius: 30px; background: var(--color-ink); color: #fff; }
.px-workflow-pattern ol { counter-reset: workflow-step; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.px-workflow-pattern li { counter-increment: workflow-step; display: flex; align-items: center; gap: 16px; min-height: 58px; padding: 12px 16px; border: 1px solid rgba(255,255,255,.14); border-radius: 15px; background: transparent; line-height: 1.45; }
.px-workflow-pattern li::before { content: counter(workflow-step, decimal-leading-zero); flex: 0 0 auto; color: var(--color-accent); font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; }
.px-solution-faqs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.px-solution-faqs > h2 { grid-column: 1 / -1; margin: 0 0 14px; font-size: clamp(31px, 4vw, 54px); letter-spacing: -.04em; }
.px-solution-faq { min-width: 0; padding: 28px; }
.px-solution-faq h3 { margin: 0 0 14px; font-size: 19px; line-height: 1.3; }
.px-solution-related { max-width: 1184px; padding: clamp(28px, 4vw, 42px); }
.px-solution-related h2 { max-width: 22em; margin: 14px 0; font-size: clamp(26px, 3.5vw, 44px); line-height: 1.08; letter-spacing: -.035em; }
.px-solution-related p { max-width: 720px; margin-bottom: 24px; }
@media (max-width: 760px) {
  .px-solution-comparison,
  .px-solution-benefits,
  .px-solution-faqs,
  .px-solution-scope ul,
  .px-workflow-pattern ol { grid-template-columns: 1fr; }
  .px-solution-scope { margin-left: 16px; margin-right: 16px; width: auto; }
}