:root {
	--kgv-abo-primary: #5F8D4E;
	--kgv-abo-primary-dark: #234236;
	--kgv-abo-primary-light: #7AA96B;
	--kgv-abo-background: #F7F3EA;
	--kgv-abo-surface: #FFFFFF;
	--kgv-abo-accent-soft: #E8DCC6;
	--kgv-abo-border: #E8E0D4;
	--kgv-abo-success-bg: #E8F5EA;
	--kgv-abo-text: #3E3E3E;
	--kgv-abo-text-light: #777777;
}

.kgv-page-subscribe {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
	width: 100%;
	max-width: 1200px;
}

.kgv-page-subscribe-form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.kgv-page-subscribe-button,
.kgv-page-subscribe-remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 40px;
	padding: 10px 18px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.kgv-page-subscribe-button {
	border: 1px solid var(--kgv-abo-primary);
	background: var(--kgv-abo-primary);
	color: #fff;
	box-shadow: 0 10px 22px rgba(35, 66, 54, 0.12);
}

.kgv-page-subscribe-button:hover,
.kgv-page-subscribe-button:focus {
	border-color: var(--kgv-abo-primary-dark);
	background: var(--kgv-abo-primary-dark);
	color: #fff;
	transform: translateY(-1px);
}

.kgv-page-subscribe-button.is-subscribed {
	border-color: var(--kgv-abo-primary);
	background: var(--kgv-abo-success-bg);
	color: var(--kgv-abo-primary-dark);
	box-shadow: none;
}

.kgv-page-subscribe-button.is-subscribed:hover,
.kgv-page-subscribe-button.is-subscribed:focus {
	border-color: var(--kgv-abo-primary-dark);
	background: var(--kgv-abo-primary-dark);
	color: #fff;
	transform: translateY(-1px);
}

.kgv-page-subscribe-remove {
	border: 1px solid var(--kgv-abo-border);
	background: var(--kgv-abo-surface);
	color: var(--kgv-abo-primary-dark);
	box-shadow: none;
}

.kgv-page-subscribe-remove:hover,
.kgv-page-subscribe-remove:focus {
	border-color: var(--kgv-abo-primary-dark);
	background: var(--kgv-abo-accent-soft);
	color: var(--kgv-abo-primary-dark);
}

.kgv-page-subscribe-feedback,
.kgv-page-subscribe-message {
	text-align: right;
	color: var(--kgv-abo-text-light);
	font-size: 14px;
	line-height: 1.45;
}

.kgv-page-subscribe-feedback.is-error {
	color: #8a2424;
}

.kgv-page-subscribe-message {
	display: inline-block;
	padding: 12px 16px;
	border: 1px solid var(--kgv-abo-border);
	border-radius: 12px;
	background: var(--kgv-abo-background);
	color: var(--kgv-abo-primary-dark);
}

@media (max-width: 520px) {
	.kgv-page-subscribe,
	.kgv-page-subscribe-form,
	.kgv-page-subscribe-button {
		width: 100%;
	}
}