.pf-band{background:#2450e8;color:#fff;padding-bottom:200px}
.pf-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px;align-items:end;padding-top:96px}
.pf-hero-r{padding-bottom:8px}
.pf-ctas{display:flex;gap:28px;align-items:center;margin-top:30px;flex-wrap:wrap}
/* Follow one change */
.pf-lift{margin-top:-150px;position:relative;scroll-margin-top:24px}
.pf-demo{box-shadow:0 30px 80px rgba(8,22,90,.22),0 2px 8px rgba(8,22,90,.12);overflow:hidden}
.pf-demo-head{display:flex;align-items:center;gap:16px;padding:18px 24px;border-bottom:1px solid #dfe3ec;flex-wrap:wrap}
.pf-demo-title{font-size:16px;line-height:1.3;letter-spacing:-0.015em}
.pf-demo-sub{font-size:13.5px;color:#6b717b}
.pf-cases{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.pf-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.pf-step{padding:22px 22px 26px;border-right:1px solid #eef0f4;min-height:300px;display:flex;flex-direction:column;gap:12px;transition:background-color 200ms ease}
.pf-step.bad{background:#fff7f6}
.pf-step.hold{background:#fffde6}
.pf-step-h{display:flex;align-items:center;gap:10px}
.pf-step-h h3{font-size:16px;line-height:1.3;letter-spacing:-0.015em}
.pf-n{width:26px;height:26px;border-radius:50%;background:#131417;color:#fff;font-size:12.5px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.pf-what{margin:0;font-size:13.5px;color:#4a4f58;line-height:1.45}
.pf-rows{margin:4px 0 0;background:#f7f8fb;border:1px solid #eef0f4;border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:7px}
.pf-rows div{display:grid;grid-template-columns:74px 1fr;gap:8px;font-size:12.5px;line-height:1.4}
.pf-rows dt{color:#6b717b}
.pf-rows dd{margin:0;color:#131417}
.pf-rows dd.bad{color:#b42318;font-weight:650}
.pf-rows dd.hold{font-weight:650}
.pf-st{margin-top:auto;color:#1e7a46}
.pf-step.bad .pf-st{color:#b42318}
.pf-step.hold .pf-st{color:#131417}
.pf-st .dot{width:9px;height:9px}
.pf-caption{margin:16px 4px 0;font-size:13.5px;color:#6b717b}
/* Each operator has one job */
.pf-job{padding-top:150px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.pf-mt22{margin-top:22px}.pf-mt28{margin-top:28px}
.pf-ops{margin-top:28px;display:flex;gap:10px;flex-wrap:wrap}
.pf-term{margin:0;background:#131417;color:#e7e9ee;border-radius:12px;padding:28px 30px;box-shadow:0 24px 60px rgba(19,20,23,.22);overflow-x:auto;min-width:0}
.pf-term-bar{display:flex;gap:8px;margin-bottom:18px;align-items:center}
.pf-term-bar>span:not(.code){width:10px;height:10px;border-radius:50%;background:#3a3f48}
/* lightened from the board's #737983/#6b717b for 4.5:1 on #131417 */
.pf-term-t{margin-left:10px;color:#8d939d;font-size:12.5px}
.pf-code div{white-space:pre;min-height:1.6em}
.pf-code .k{color:#8ea6ff}.pf-code .y{color:#fff252}.pf-code .m{color:#8d939d}
/* How it fits together */
.pf-fit{padding-top:150px}
.pf-fit-h{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:end;margin-bottom:48px}
.pf-stack{width:1248px;max-width:100%;margin:0 auto}
/* Principles */
.pf-principles{padding-top:140px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:40px 32px}
.pf-pr{border-top:2px solid #131417;padding-top:20px}
.pf-pr h3{font-size:28px}
.pf-pr .body{margin:12px 0 0}
.pf-pr .more{margin-top:16px}
@media (max-width:900px){
  .pf-hero{grid-template-columns:1fr;padding-top:64px;gap:20px}
  .pf-band{padding-bottom:180px}
  .pf-lift{margin-top:-130px}
  .pf-cases{margin-left:0;width:100%}
  .pf-demo-head{padding:16px 18px}
  .pf-step{border-right:0;border-bottom:1px solid #eef0f4;min-height:0}
  .pf-job{grid-template-columns:1fr;gap:40px;padding-top:96px}
  .pf-term{padding:22px 20px}
  .pf-fit,.pf-principles{padding-top:96px}
  .pf-fit-h{grid-template-columns:1fr;gap:20px;margin-bottom:32px}
}
