/* Buttons and links */
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 52px; padding: 0 28px; border-radius: 999px; font-family: var(--mono); font-size: 15px; font-weight: 700; text-decoration: none; cursor: pointer; border: 1px solid transparent; align-self: flex-start; }
.button--primary { background: var(--red); color: #fff; }
.button--primary:hover { background: var(--red-ink); color: #fff; }
.button--secondary { height: 48px; padding: 0 24px; background: transparent; color: var(--ink); border-color: var(--ink); font-size: 14px; font-weight: 500; flex: none; }
.button--small { height: 44px; padding: 0 20px; font-size: 14px; }
.button--large { height: 56px; padding: 0 32px; font-size: 14px; }
.button--block { width: 100%; height: 56px; align-self: stretch; }
.text-link { font-size: 14px; font-weight: 500; text-decoration: none; }
.link-button { padding: 0; background: none; border: 0; font: inherit; font-size: 14px; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.quiet-action { height: 44px; padding: 0; border: 0; background: none; font: inherit; font-size: 14px; color: var(--ink-soft); text-decoration: none; display: inline-flex; align-items: center; cursor: pointer; }
.quiet-action:hover { color: var(--ink); }