/* Buttons. Mono uppercase, squared. Black text on the accent orange passes
   contrast (about 8:1); white text on orange does not, never use it. */

@layer components {
	.sw-btn {
		display: inline-block;
		font-family: var(--font-mono);
		font-size: 0.875rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		text-decoration: none;
		padding: 14px 26px;
		border: 2px solid var(--ink);
		transition: background 130ms ease, color 130ms ease, border-color 130ms ease;
		cursor: pointer;
	}

	.sw-btn--primary {
		background: var(--ink);
		color: #fff;
	}
	.sw-btn--primary:hover {
		background: var(--accent);
		border-color: var(--accent);
		color: var(--ink);
	}

	.sw-btn--ghost {
		background: transparent;
		color: var(--ink);
	}
	.sw-btn--ghost:hover {
		background: var(--ink);
		color: #fff;
	}

	/* for dark bands */
	.sw-btn--accent {
		background: var(--accent);
		border-color: var(--accent);
		color: var(--ink);
	}
	.sw-btn--accent:hover {
		background: #fff;
		border-color: #fff;
		color: var(--ink);
	}
}