
.w-btn .w-btn-icon[class*="arrow-right"], .w-btn i.fas.fa-arrow-right { transition: transform 250ms cubic-bezier(0.22, 0.61, 0.36, 1); }
.w-btn:hover i.fas.fa-arrow-right { transform: translateX(0.25em); }

/* ===================================================================
   Outline-knop ("Alle nieuwe kristallen") — design .btn-outline
   Transparante pil met paarse rand; vult bij hover paars met witte
   tekst en komt subtiel omhoog met een zachte paarse gloed.
   We gebruiken Impreza's eigen knop-variabelen (uit Theme Options),
   alleen de rand werd niet weergegeven — die zetten we hier aan.
   =================================================================== */
.w-btn.us-btn-style_outline {
	border-style: solid;
	border-width: var(--btn-border-width, 1px);
	border-color: var(--btn-border-color, #523F6D);
	transition:
		background .25s cubic-bezier(.4, .2, .2, 1),
		border-color .25s cubic-bezier(.4, .2, .2, 1),
		color .25s cubic-bezier(.4, .2, .2, 1),
		box-shadow .25s cubic-bezier(.4, .2, .2, 1),
		transform .25s cubic-bezier(.4, .2, .2, 1);
}

/* Hover: vult paars (via --btn-hover-background) + lift + gloed */
.w-btn.us-btn-style_outline:hover,
.w-btn.us-btn-style_outline:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 16px 32px -16px rgba(82, 63, 109, 0.55);
}
.w-btn.us-btn-style_outline:active {
	transform: translateY(0);
	box-shadow: 0 6px 16px -10px rgba(82, 63, 109, 0.5);
}

/* ===================================================================
   Ghost-knop ("Alle nieuwe kristallen") — tekstlink met gouden lijn
   rechts. Bij hover schuift de tekst iets naar links en wordt de
   gouden lijn iets langer.
   =================================================================== */
.w-btn.ghost_button {
	display: inline-flex;
	align-items: center;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	padding: 8px 4px !important;
}
.w-btn.ghost_button:before{
	border: 0!important;
}
.w-btn.ghost_button .w-btn-label {
	display: inline-block;
	transition: transform .35s cubic-bezier(.4, .2, .2, 1);
}
/* De gouden lijn rechts van de tekst */
.w-btn.ghost_button::after {
	content: "";
	display: block;
	flex: none;
	width: 44px;
	height: 1px;
	margin-left: 22px;
	background: #B89248;
	transition: width .35s cubic-bezier(.4, .2, .2, 1);
}
/* Hover: tekst naar links, lijn langer */
.w-btn.ghost_button:hover .w-btn-label,
.w-btn.ghost_button:focus-visible .w-btn-label {
	transform: translateX(-6px);
}
.w-btn.ghost_button:hover::after,
.w-btn.ghost_button:focus-visible::after {
	width: 72px;
}