/* SaaS Pricing Index (v1.28.0) — nur auf Seiten mit [toolsplorer_pricing_index] geladen */
.tsp-pi { max-width: 1080px; margin: 0 auto; }
.tsp-pi__intro { font-size: 1.08rem; line-height: 1.55; color: var(--tsp-text-secondary, #5c5c70); max-width: 68ch; }
.tsp-pi__kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1.5rem 0 0.75rem; }
.tsp-pi__kpi { background: var(--tsp-surface, #fff); border: 1px solid var(--tsp-border, #e3e3ef); border-radius: var(--tsp-radius-md, 14px); padding: 1.1rem 1.2rem; box-shadow: var(--tsp-shadow-sm, 0 1px 2px rgba(0,0,0,.05)); }
.tsp-pi__kpi-value { font-family: var(--tsp-font-mono, ui-monospace, monospace); font-size: 2.1rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; color: var(--tsp-text, #17171f); font-variant-numeric: tabular-nums; }
.tsp-pi__kpi-value--up { color: var(--tsp-up, #b45309); }
.tsp-pi__kpi-value--down { color: var(--tsp-success, #0e7c5b); }
.tsp-pi__kpi-label { font-size: 0.88rem; color: var(--tsp-text-secondary, #5c5c70); margin-top: 0.35rem; line-height: 1.35; }
.tsp-pi__kpi-label small { color: var(--tsp-text-muted, #8a8a9e); font-size: 0.78rem; }
.tsp-pi__section { margin-top: 2.5rem; }
.tsp-pi__section h2 { font-size: 1.45rem; margin: 0 0 0.6rem; letter-spacing: -0.02em; }
.tsp-pi__section h3 { font-size: 1.1rem; margin: 1.4rem 0 0.4rem; }
.tsp-pi__note { font-size: 0.86rem; color: var(--tsp-text-secondary, #5c5c70); line-height: 1.5; }
.tsp-pi__table-wrap { overflow-x: auto; border: 1px solid var(--tsp-border, #e3e3ef); border-radius: var(--tsp-radius-md, 14px); background: var(--tsp-surface, #fff); }
.tsp-pi__table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.tsp-pi__table th, .tsp-pi__table td { padding: 0.6rem 0.7rem; text-align: left; border-bottom: 1px solid var(--tsp-border-light, #ececf5); vertical-align: top; }
.tsp-pi__table tbody tr:last-child td { border-bottom: 0; }
.tsp-pi__table th { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--tsp-text-muted, #8a8a9e); background: var(--tsp-bg, #f7f7fb); white-space: normal; }
.tsp-pi__num { font-family: var(--tsp-font-mono, ui-monospace, monospace); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tsp-pi__delta--up { color: var(--tsp-up, #b45309); font-weight: 600; }
.tsp-pi__delta--down { color: var(--tsp-success, #0e7c5b); font-weight: 600; }
.tsp-pi__badge { display: inline-block; padding: 0.15rem 0.55rem; border-radius: 999px; font-size: 0.72rem; font-weight: 600; white-space: nowrap; vertical-align: middle; }
.tsp-pi__badge--high { background: var(--tsp-success-light, #e4f5ee); color: var(--tsp-success, #0e7c5b); }
.tsp-pi__badge--medium { background: var(--tsp-accent-light, #fef3c7); color: #92400e; }
.tsp-pi__badge--sale { background: var(--tsp-tint, #eeedfa); color: var(--tsp-primary, #4338ca); }
.tsp-pi__evidence a { white-space: nowrap; font-size: 0.82rem; }
.tsp-pi__packaging { list-style: none; padding: 0; margin: 0.75rem 0 0; display: grid; gap: 0.6rem; }
.tsp-pi__packaging li { background: var(--tsp-surface, #fff); border: 1px solid var(--tsp-border, #e3e3ef); border-radius: var(--tsp-radius-sm, 8px); padding: 0.8rem 1rem; line-height: 1.5; }
.tsp-pi__downloads { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0.75rem 0; }
@media (max-width: 900px) { .tsp-pi__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .tsp-pi__kpis { grid-template-columns: 1fr; } .tsp-pi__kpi-value { font-size: 1.8rem; } }
