/* A second editorial example, using the shared typography and deck controls. */
.example-switcher{padding-top:48px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.example-switcher>span{font-size:var(--type-kicker);letter-spacing:.12em;font-weight:600;text-transform:uppercase}
.example-switcher>div{display:flex;gap:8px;flex-wrap:wrap}
.example-switcher button{border:1px solid var(--line);border-radius:6px;padding:13px 20px;background:transparent;font-size:var(--type-ui);cursor:pointer}
.example-switcher button[aria-pressed=true]{background:var(--blue);color:white;border-color:var(--blue)}
.example-switcher button:focus-visible{outline:3px solid #e65f28;outline-offset:3px}
.example-switcher~.evidence{padding-top:50px}
.insight-deck[hidden]{display:none!important}
/* One shared scale and baseline makes comparisons legible at a glance. */
.comparison-chart{--label-width:220px;--value-space:72px;margin-top:28px;padding-right:var(--value-space)}
.comparison-axis{margin-left:calc(var(--label-width) + 24px);position:relative;height:28px;border-bottom:1px solid var(--line);font-size:var(--type-small);color:#657073}
.comparison-axis span{position:absolute;top:0;transform:translateX(-50%)}
.comparison-axis span:first-child{left:0}.comparison-axis span:nth-child(2){left:50%}.comparison-axis span:last-child{left:100%}
.comparison-row{display:grid;grid-template-columns:var(--label-width) minmax(0,1fr);column-gap:24px;padding:24px 0;border-bottom:1px solid var(--line);align-items:center}
.comparison-label h5{font-size:var(--type-label);font-weight:500;line-height:1.22;letter-spacing:-.025em;margin:0}
.comparison-bars{display:grid;gap:12px;border-left:1px solid #cdd3c7;background:linear-gradient(to right,transparent calc(50% - .5px),#e4e7df calc(50% - .5px),#e4e7df calc(50% + .5px),transparent calc(50% + .5px));border-right:1px solid #e4e7df;padding:4px 0}
.comparison-lane{height:24px;position:relative}
.comparison-bar{height:100%;background:var(--blue);border-radius:0 3px 3px 0;position:relative}
.secondary .comparison-bar{background:#dfe7cd;border:2px solid #728b45;border-left:0}
.comparison-bar span{position:absolute;left:100%;padding-left:10px;top:50%;transform:translateY(-50%);font-size:28px;font-weight:500;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--blue);white-space:nowrap;line-height:1}
.secondary .comparison-bar span{color:#536b2d}
.ai-base{font-size:var(--type-small);line-height:1.45;color:#657073;margin:8px 0 0}
.ai-receipts{grid-template-columns:repeat(2,minmax(0,1fr))}
#insight-ai-priorities .comparison-chart{--label-width:280px}
@media(max-width:900px){.comparison-chart{--label-width:170px}#insight-ai-priorities .comparison-chart{--label-width:220px}.comparison-label h5{font-size:var(--type-body)}}
@media(max-width:620px){
.example-switcher{padding-top:32px;gap:12px}.example-switcher button{padding:12px 15px}.example-switcher~.evidence{padding-top:32px}
.comparison-chart{--value-space:52px;margin-top:24px}.comparison-axis{margin-left:0}.comparison-row{grid-template-columns:1fr;gap:12px;padding:20px 0}.comparison-label h5{font-size:var(--type-body)}.comparison-bar span{font-size:22px;padding-left:7px}.comparison-lane{height:20px}.comparison-bars{gap:10px}.ai-base{margin:5px 0 0}.ai-receipts{grid-template-columns:1fr}
}
/* Keep card transitions from creating a sideways page scroll on phones. */
.insight-deck{overflow-x:clip}
