.content-surface{--primary:var(--color-brand-500);--fg:var(--content);--fg-muted:var(--content-secondary);--fg-dim:var(--content-muted);--bg:var(--surface);--bg-card:var(--surface-alt);--bg-inset:var(--surface-inset);--border-faint:var(--border);--r-md:var(--radius-md);--r-lg:var(--radius-lg);--r-xl:var(--radius-xl);--r-2xl:1.25rem;--ff-mono:var(--font-mono);color:var(--content);background:var(--surface)}.content-surface .shell{width:100%;max-width:80rem;margin-inline:auto;padding-inline:1.25rem}@media (min-width:640px){.content-surface .shell{padding-inline:1.5rem}}.content-surface .eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--color-brand-400);font-size:11px;font-weight:600;display:inline-block}.content-surface .h1{letter-spacing:-.02em;color:var(--content);font-weight:600}.content-surface .lede{color:var(--content-secondary)}.content-surface .btn{border-radius:var(--radius-md);align-items:center;gap:.5rem;min-height:44px;padding:0 1rem;font-size:14px;font-weight:500;display:inline-flex}.content-surface .btn--outline{border:1px solid var(--border);color:var(--content);background:0 0}.content-surface .btn--outline:hover{border-color:color-mix(in oklab, var(--color-brand-500) 40%, var(--border))}.content-surface .arrow{width:1rem;height:1rem}
