/* Explore button widget */

.ebe-btn-wrap {
	display: inline-block;
	max-width: 100%;
}

.ebe-btn-wrap.ebe-align-left   { text-align: left; }
.ebe-btn-wrap.ebe-align-center { text-align: center; }
.ebe-btn-wrap.ebe-align-right  { text-align: right; }

.ebe-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	text-decoration: none !important;
	cursor: pointer;
	vertical-align: middle;
	-webkit-tap-highlight-color: transparent;
	/* Cut-corner notch */
	clip-path: polygon(0 0, 100% 0, 100% 71.15%, 92.92% 100%, 0 100%);

}

.ebe-btn,
.ebe-btn:visited,
.ebe-btn:active {
	text-decoration: none !important;
}

/* Sliding hover fill */
.ebe-btn-fill {

    border-radius: 4px 4px 4px 4px;
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	transform-origin: 50% 0%;
	transform: scaleY(0);
	transition: transform 0.5s cubic-bezier(.65,0,.35,1);
	will-change: transform;
}

.ebe-btn:hover .ebe-btn-fill,
.ebe-btn:focus-visible .ebe-btn-fill {
	 border-radius: 4px 4px 4px 4px;
	transform-origin: 50% 100%;
	transform: scaleY(1);
}

/* Outline stroke */
.ebe-btn-outline {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	pointer-events: none;
}

.ebe-btn-outline polygon {
	fill: none;
	stroke-linejoin: miter;
	vector-effect: non-scaling-stroke;
}

/* content sits above the fill */
.ebe-btn-content {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
}

.ebe-btn-text {
	display: inline-block;
	transition: color 0.3s ease;
}

/* icon wrappers */
.ebe-btn-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.ebe-btn-icon svg {
	width: 1em;
	height: 1em;
	fill: none;
	display: block;
}

.ebe-icon-slot {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}


.ebe-icon-normal-state {
	display: inline-flex;
	transition: transform 0.35s ease;
}

.ebe-btn:hover .ebe-icon-normal-state,
.ebe-btn:focus-visible .ebe-icon-normal-state {
	transform: translate(3px, -3px);
}

/* Cross-fade when a hover icon is set */
.ebe-icon-slot.has-hover-icon .ebe-icon-normal-state {
	position: absolute;
	opacity: 1;
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.ebe-icon-slot.has-hover-icon .ebe-icon-hover-state {
	position: relative;
	opacity: 0;
	transform: scale(0.6);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.ebe-btn:hover .ebe-icon-slot.has-hover-icon .ebe-icon-normal-state,
.ebe-btn:focus-visible .ebe-icon-slot.has-hover-icon .ebe-icon-normal-state {
	opacity: 0;
	transform: translate(3px, -3px) scale(0.6);
}

.ebe-btn:hover .ebe-icon-slot.has-hover-icon .ebe-icon-hover-state,
.ebe-btn:focus-visible .ebe-icon-slot.has-hover-icon .ebe-icon-hover-state {
	opacity: 1;
	transform: scale(1) translate(3px, -3px);
}