.bg-page{padding:140px 0 80px}.bg-hero{padding-block:0 80px;border-bottom:1px solid var(--hairline);margin-bottom:80px}.bg-hero h1{font-family:var(--font-display);font-weight:500;font-size:clamp(56px,9vw,144px);letter-spacing:-.045em;line-height:.94;margin:0}.bg-hero h1 em{font-family:var(--font-serif);font-style:italic;font-weight:400}.bg-hero p{margin:32px 0 0;font-size:var(--t-lead);color:var(--fg-soft);max-width:56ch;line-height:1.4}.bg-meta{display:flex;gap:32px;margin-top:48px;font-size:12px;color:var(--fg-faint)}.bg-section{padding-block:80px;border-top:1px solid var(--hairline)}.bg-section-head{display:grid;grid-template-columns:1fr 2fr;gap:64px;margin-bottom:48px;align-items:end}.bg-section-head h2{font-family:var(--font-display);font-weight:500;font-size:clamp(28px,3.5vw,48px);letter-spacing:-.03em;line-height:1.02;margin:0}.bg-section-head h2 em{font-family:var(--font-serif);font-style:italic;font-weight:400}.bg-section-head .lede{font-size:16px;color:var(--fg-soft);line-height:1.5;margin:0}.bg-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.bg-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}.bg-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.bg-card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:28px}.bg-logo-stage{background:var(--bg-alt);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:64px;display:grid;place-items:center;min-height:280px;grid-column:span 2}.bg-logo-stage.is-dark{background:var(--inverse-bg)}.bg-logo-large{display:inline-flex;align-items:center;gap:14px;font-family:var(--font-display);font-weight:600;font-size:48px;letter-spacing:-.025em}.is-dark .bg-logo-large{color:var(--inverse-fg)}.bg-logo-mark{width:56px;height:56px;border-radius:14px;background:var(--fg);display:grid;place-items:center;color:var(--bg)}.is-dark .bg-logo-mark{background:var(--inverse-fg);color:var(--inverse-bg)}.bg-logo-mark svg{width:28px;height:28px}.bg-swatch{border-radius:var(--radius);overflow:hidden;border:1px solid var(--hairline);background:var(--surface);display:flex;flex-direction:column}.bg-swatch-color{height:120px}.bg-swatch-meta{padding:18px;display:flex;flex-direction:column;gap:4px;font-family:var(--font-mono);font-size:11px;color:var(--fg-soft)}.bg-swatch-meta .name{font-family:var(--font-sans);font-weight:500;font-size:14px;letter-spacing:-.005em;color:var(--fg)}.bg-type-row{display:grid;grid-template-columns:200px 1fr 200px;gap:32px;padding:28px 0;border-bottom:1px solid var(--hairline);align-items:baseline}.bg-type-row:last-child{border-bottom:0}.bg-type-name{font-size:11px;color:var(--fg-faint);letter-spacing:.1em;text-transform:uppercase}.bg-type-specimen{font-family:var(--font-display);color:var(--fg)}.bg-type-specimen.serif{font-family:var(--font-serif);font-style:italic}.bg-type-meta{font-family:var(--font-mono);font-size:11px;color:var(--fg-faint)}.bg-spacing-row{display:grid;grid-template-columns:80px 1fr auto;gap:24px;align-items:center;padding:12px 0;border-bottom:1px solid var(--hairline)}.bg-spacing-row:last-child{border-bottom:0}.bg-spacing-name{font-family:var(--font-mono);font-size:12px;color:var(--fg-soft)}.bg-spacing-bar{background:var(--accent);height:8px;border-radius:4px}.bg-spacing-px{font-family:var(--font-mono);font-size:11px;color:var(--fg-faint)}.bg-radius-card{padding:18px;border:1px solid var(--hairline);background:var(--surface);display:flex;flex-direction:column;gap:12px;text-align:center}.bg-radius-demo{height:80px;background:var(--accent-soft);border:1px solid var(--accent-ring)}.bg-radius-name{font-family:var(--font-mono);font-size:11px;color:var(--fg-faint)}.bg-cmp{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:32px}.bg-cmp-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-faint);margin-bottom:20px}.bg-cmp-stage{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.bg-voice{padding:32px;border:1px solid var(--hairline);border-radius:var(--radius-lg);background:var(--surface)}.bg-voice h4{font-family:var(--font-display);font-weight:500;font-size:22px;letter-spacing:-.02em;margin:0 0 12px}.bg-voice h4 em{font-family:var(--font-serif);font-style:italic;font-weight:400}.bg-voice .ex{font-family:var(--font-serif);font-style:italic;font-weight:400;font-size:18px;color:var(--fg);margin-top:20px;padding-top:20px;border-top:1px solid var(--hairline);line-height:1.4}.bg-voice .anti{font-family:var(--font-sans);font-style:normal;font-size:13px;color:var(--fg-faint);margin-top:12px}.bg-voice .anti:before{content:"Avoid: ";font-weight:500;color:#c0392b;letter-spacing:.04em}.bg-icon-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:0;border:1px solid var(--hairline);border-radius:var(--radius-lg);overflow:hidden}.bg-icon-cell{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border-right:1px solid var(--hairline);border-bottom:1px solid var(--hairline);background:var(--surface)}.bg-icon-cell:nth-child(6n){border-right:0}.bg-icon-cell:nth-last-child(-n+6){border-bottom:0}.bg-icon-cell svg{color:var(--fg)}.bg-icon-name{font-family:var(--font-mono);font-size:10px;color:var(--fg-faint)}@media(max-width:900px){.bg-section-head{grid-template-columns:1fr}.bg-grid-3,.bg-grid-2,.bg-grid-4{grid-template-columns:1fr 1fr}.bg-logo-stage{grid-column:auto;min-height:200px;padding:32px}.bg-type-row{grid-template-columns:1fr;gap:8px}.bg-icon-grid{grid-template-columns:repeat(3,1fr)}.bg-icon-cell:nth-child(6n){border-right:1px solid var(--hairline)}.bg-icon-cell:nth-child(3n){border-right:0}}
