:root {
	--button-padding: 0.5em 1.5em 0.5em 1.5em;
	--button-outline--primary: #00812C;
	--button-outline--secondary: #4EBFEF;
}

[data-component="cid-9"] + [data-component="cid-9"] {
	margin-top: 1rem;
}

button,
.button,
[class^="button--"] {
	font: var(--m);
	transition: background-color 250ms, border-color 250ms, color 250ms;
}

button {
	-webkit-appearance: none;
	appearance: none;
	padding: var(--button-padding);
	color: var(--black);
	font: var(--l-bold);
	word-break: break-word;
	outline: 0;
	border: 0.0625em solid var(--black-10);
	cursor: pointer;
}

.button {
	-webkit-appearance: none;
	appearance: none;
	padding: var(--button-padding);
	display: inline-block;
	position: relative;
	color: var(--black);
	font: var(--l-bold);
	text-decoration: none;
	word-break: break-word;
	outline: 0;
	border: 0.0625em solid var(--black-10);
	cursor: pointer;
}

.button:hover,
.button:focus {
	color: var(--black);
	text-decoration: underline;
	text-underline-offset: 0.25em;
	background-color: transparent;
}

.button--primary {
	padding: var(--button-padding);
	padding-right: 3em;
	display: inline-block;
	position: relative;
	color: var(--black);
	font-weight: 600;
	line-height: 1.6;
	text-decoration: none;
	border: 2px solid var(--color-secondary);
	background-color: var(--color-secondary);
	background-size: 1.2em;
	background-position: right 1.5rem center;
	background-repeat: no-repeat;
	background-image: url(/assets/icons/caret-right.svg);
	cursor: pointer;
}

.button--primary:hover {
	border: 2px solid var(--color-secondary--light);
	background-color: var(--color-secondary--light);
}

.button--primary:focus,
.button--primary:focus-visible,
.button--primary:active {
	border: 2px solid var(--button-outline--primary);
	outline: 1px solid var(--white);
	outline-offset: -3px;
	background-color: var(--color-secondary--light);
}

.button--primary:active {
	background-color: var(--color-secondary);
}

.button--secondary {
	padding: var(--button-padding);
	padding-right: 3rem;
	display: inline-block;
	position: relative;
	color: var(--black);
	text-decoration: none;
	border: 2px solid var(--color-primary);
	background-color: var(--white);
	background-size: 1.2em;
	background-position: right 1.5rem center;
	background-repeat: no-repeat;
	background-image: url(/assets/icons/caret-right.svg);
	cursor: pointer;
}

.button--secondary:hover {
	text-decoration: underline;
	border: 2px solid var(--color-primary);
	background-color: var(--white);
}

.button--secondary:focus,
.button--secondary:focus-visible,
.button--secondary:active {
	border: 2px solid var(--button-outline--secondary);
	outline: 1px solid var(--color-primary);
	outline-offset: -4px;
	background-color: var(--white);
}

.button--secondary:active {
	outline: 2px solid var(--color-primary);
	outline-offset: -4px;
	background-color: var(--white);
}

.button:disabled,
.disabled {
	color: var(--black-30);
	background-color: var(--black-10);
	cursor: pointer;
	pointer-events: none;
}

.button--bare {
	border: 2px solid transparent;
	background-color: transparent;
}

.button-search {
	min-width: fit-content;
	background-image: url(/assets/icons/magnifying-glass.svg);
}