.gv-donation {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(17rem, 0.8fr);
	gap: clamp(2rem, 6vw, 5rem);
	align-items: center;
	padding: clamp(2.5rem, 7vw, 5.5rem) max(1.25rem, calc((100vw - 72rem) / 2));
	color: var(--color-paper, #f4f0e6);
	background: var(--color-ink-deep, #0d0a1c);
	border-block: 1px solid rgb(201 164 84 / 28%);
}

.gv-donation__kicker {
	margin: 0 0 0.65rem;
	color: var(--color-gold-bright, #e4bf6b);
	font: 600 0.75rem/1.2 var(--font-body, sans-serif);
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.gv-donation__title {
	margin: 0;
	color: var(--color-paper, #f4f0e6);
	font: 500 clamp(2.2rem, 5vw, 4.5rem)/0.95 var(--font-display, serif);
}

.gv-donation__text {
	max-width: 34rem;
	margin: 1rem 0 0;
	color: var(--color-muted, #b7b1c5);
	font: 400 1rem/1.7 var(--font-body, sans-serif);
}

.gv-donation__form {
	display: grid;
	gap: 0.9rem;
	padding: clamp(1.25rem, 3vw, 2rem);
	background: rgb(255 255 255 / 4%);
	border: 1px solid rgb(201 164 84 / 35%);
}

.gv-donation__amount {
	display: grid;
	gap: 0.45rem;
	color: var(--color-paper-mute, #d6d0df);
	font: 600 0.78rem/1.2 var(--font-body, sans-serif);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.gv-donation__input {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	background: rgb(255 255 255 / 7%);
	border: 1px solid rgb(255 255 255 / 16%);
}

.gv-donation__input:focus-within {
	border-color: var(--color-gold, #c9a454);
	box-shadow: 0 0 0 2px rgb(201 164 84 / 18%);
}

.gv-donation__input input {
	width: 100%;
	min-width: 0;
	padding: 0.85rem 1rem;
	color: var(--color-paper, #f4f0e6);
	font: 600 1.05rem/1 var(--font-body, sans-serif);
	background: transparent;
	border: 0;
	outline: 0;
}

.gv-donation__input strong {
	padding: 0 1rem;
	color: var(--color-gold-bright, #e4bf6b);
	font: 600 0.8rem/1 var(--font-body, sans-serif);
}

.gv-donation__button {
	padding: 0.95rem 1.25rem;
	color: var(--color-ink-deep, #0d0a1c);
	font: 700 0.85rem/1 var(--font-body, sans-serif);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	background: var(--color-gold, #c9a454);
	border: 1px solid var(--color-gold, #c9a454);
	transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.gv-donation__button:hover,
.gv-donation__button:focus-visible {
	background: var(--color-gold-bright, #e4bf6b);
	border-color: var(--color-gold-bright, #e4bf6b);
	transform: translateY(-1px);
}

.gv-donation__note {
	margin: 0;
	color: var(--color-muted, #b7b1c5);
	font: 400 0.75rem/1.5 var(--font-body, sans-serif);
	text-align: center;
}

@media (max-width: 700px) {
	.gv-donation {
		grid-template-columns: 1fr;
		gap: 1.75rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.gv-donation__button {
		transition: none;
	}
}
