/* Semantic classes for repeated page patterns, values from tokens/ custom properties.
   One-off layout styles remain inline (in CSSOM-serialized form; see CLAUDE.md).
   Interactive elements (a/button/inputs) intentionally keep inline styles. */
@import url("/tokens/colors.css");
@import url("/tokens/typography.css");
@import url("/tokens/effects.css");

.zs-chip { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--zs-border-chip); color: var(--zs-text-secondary); padding: 5px 10px; }
.zs-prose { max-width: 680px; font-size: 15.5px; line-height: 1.7; color: var(--zs-ink-2); }
.zs-m0 { margin: 0; }
.zs-label-num { font-family: var(--zs-font-mono); font-size: var(--zs-text-label); letter-spacing: 1.5px; color: var(--zs-blue); }
.zs-legal-row { display: grid; grid-template-columns: 250px 1fr; gap: 40px; padding: 40px 8px; border-top: 1px solid var(--zs-border-soft); }
.zs-mb14 { margin: 0 0 14px; }
.zs-em { font-style: italic; color: var(--zs-blue); }
.zs-tick-row { display: flex; gap: 9px; }
.zs-tick { color: var(--zs-green); font-weight: 700; }
.zs-code-kw { color: var(--zs-code-keyword); }
.zs-code-type { color: var(--zs-code-type); }
.zs-code-str { color: var(--zs-code-string); }
.zs-p { font-size: 16px; line-height: var(--zs-line-body); color: var(--zs-text-secondary); margin: 0 0 18px; max-width: 620px; }
.zs-eyebrow { font-family: var(--zs-font-mono); font-size: var(--zs-text-eyebrow); letter-spacing: var(--zs-track-eyebrow); color: var(--zs-blue); margin-bottom: 10px; }
.zs-h2 { font-family: var(--zs-font-display); font-weight: 500; font-size: 34px; letter-spacing: -0.5px; margin: 0 0 14px; }
.zs-split { display: flex; gap: 52px; align-items: center; padding: var(--zs-section-pad) 8px; border-bottom: 1px solid var(--zs-border-soft); }
.zs-chips { display: flex; gap: 10px; flex-wrap: wrap; font-family: var(--zs-font-mono); font-size: 9.5px; letter-spacing: 1.5px; }
.zs-section { padding: var(--zs-section-pad) 8px; border-bottom: 1px solid var(--zs-border-soft); }
.zs-cell-cap { padding: 12px 14px 12px 2px; border-bottom: 1px solid rgba(20, 20, 20, 0.1); font-size: var(--zs-text-card); color: var(--zs-ink-2); }
.zs-cell-zs { padding: 12px 14px; border-bottom: 1px solid rgba(20, 20, 20, 0.1); text-align: center; background: var(--zs-tint-blue); font-family: var(--zs-font-mono); font-weight: 700; color: var(--zs-green); }
.zs-cell-yes { padding: 12px 14px; border-bottom: 1px solid rgba(20, 20, 20, 0.1); text-align: center; font-family: var(--zs-font-mono); color: var(--zs-green); }
.zs-cell-no { padding: 12px 14px; border-bottom: 1px solid rgba(20, 20, 20, 0.1); text-align: center; font-family: var(--zs-font-mono); color: rgba(192, 61, 33, 0.55); }
.zs-h3 { font-family: var(--zs-font-display); font-weight: 500; font-size: var(--zs-text-h3); margin: 0 0 10px; }
.zs-faq-q { font-family: var(--zs-font-display); font-size: 20px; padding: 18px 0; cursor: pointer; }
.zs-faq-a { font-size: var(--zs-text-body); line-height: var(--zs-line-body); color: var(--zs-text-secondary); margin: 0; padding: 0 0 20px; max-width: 560px; }
.zs-stat { font-family: var(--zs-font-display); font-weight: 500; font-size: 96px; line-height: 1; letter-spacing: -3px; }
.zs-stat-caption { font-family: var(--zs-font-mono); font-size: var(--zs-text-micro); letter-spacing: var(--zs-track-micro); color: var(--zs-text-muted); margin-top: 10px; }