/* Project cards (Loop Item template 582): "View Project" becomes a white round arrow button that
   expands to "View Project" + arrow when the card is hovered or keyboard-focused.
   No template change: the original text "View Project →" stays in the DOM for screen readers and is
   hidden visually with font-size 0; the label and arrow are drawn with ::before / ::after. */
[data-id="4b481367"] [data-id="4bea86b8"] {
	display: inline-flex !important;
	align-self: flex-start;
	align-items: center;
	width: fit-content !important;
	height: 44px;
	padding: 0 13px;
	border-radius: 999px;
	background: #ffffff !important;
	color: #111111 !important;
	/* no ring, no shadow: a plain white button */
	box-shadow: none !important;
	/* pinned to the bottom of the card body, same spot on every card */
	margin-top: auto !important;
	font-size: 0 !important;
	line-height: 1;
	white-space: nowrap;
	transition: padding 300ms cubic-bezier(0.23, 1, 0.32, 1);
}
[data-id="4b481367"] [data-id="4bea86b8"]::before {
	content: "View Project";
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.01em;
	display: inline-block;
	max-width: 0;
	overflow: hidden;
	opacity: 0;
	margin-right: 0;
	transition: max-width 300ms cubic-bezier(0.23, 1, 0.32, 1), margin 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 180ms ease-out;
}
[data-id="4b481367"] [data-id="4bea86b8"]::after {
	content: "";
	flex: none;
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScyJyBzdHJva2UtbGluZWNhcD0ncm91bmQnIHN0cm9rZS1saW5lam9pbj0ncm91bmQnPjxwYXRoIGQ9J001IDEyaDE0TTEzIDZsNiA2LTYgNicvPjwvc3ZnPg==") center / contain no-repeat;
	mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScyJyBzdHJva2UtbGluZWNhcD0ncm91bmQnIHN0cm9rZS1saW5lam9pbj0ncm91bmQnPjxwYXRoIGQ9J001IDEyaDE0TTEzIDZsNiA2LTYgNicvPjwvc3ZnPg==") center / contain no-repeat;
	transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

@media (hover: hover) and (pointer: fine) {
	[data-id="4b481367"]:hover [data-id="4bea86b8"] {
		padding: 0 14px 0 20px;
	}
	[data-id="4b481367"]:hover [data-id="4bea86b8"]::before {
		max-width: 140px;
		margin-right: 8px;
		opacity: 1;
		transition-delay: 0ms, 0ms, 60ms;
	}
	[data-id="4b481367"]:hover [data-id="4bea86b8"]::after {
		transform: translateX(2px);
	}
}
[data-id="4b481367"]:focus-visible [data-id="4bea86b8"] {
	padding: 0 14px 0 20px;
}
[data-id="4b481367"]:focus-visible [data-id="4bea86b8"]::before {
	max-width: 140px;
	margin-right: 8px;
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	[data-id="4bea86b8"],
	[data-id="4bea86b8"]::before,
	[data-id="4bea86b8"]::after {
		transition: opacity 150ms ease-out;
	}
}

/* Card body fills the card so the button can sit at its bottom (cards are already equal height in the row). */
[data-id="4b481367"] [data-id="6b2b08f0"] {
	flex: 1 1 auto;
}

/* Card titles: about 25% smaller than the kit size (26px -> 20px, mobile 22px -> 17px). */
[data-id="4b481367"] [data-id="24f26a54"] {
	font-size: 20px !important;
	line-height: 1.25 !important;
}
@media (max-width: 767px) {
	[data-id="4b481367"] [data-id="24f26a54"] {
		font-size: 17px !important;
	}
}
