/* [kswx_shop_button] — reusable shop CTA button band */
.kswx-shopbtn {
	width: 100%;
	padding: 1.4rem 1.25rem 0.6rem;
	background: var(--kswx-detail-bg, #fafafa);
}
.kswx-shopbtn__inner {
	max-width: 1180px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.kswx-shopbtn--center .kswx-shopbtn__inner { align-items: center; text-align: center; }
.kswx-shopbtn--left   .kswx-shopbtn__inner { align-items: flex-start; text-align: left; }
.kswx-shopbtn--right  .kswx-shopbtn__inner { align-items: flex-end; text-align: right; max-width: 1400px; }

.kswx-shopbtn__eyebrow {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--kswx-accent, hsl(42, 80%, 55%));
}

.kswx-shopbtn__btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 1.2rem;
	border-radius: 999px;
	font-size: 0.9rem;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
	border: 2px solid transparent;
}
.kswx-shopbtn__icon { display: inline-flex; }
.kswx-shopbtn__icon svg { width: 18px; height: 18px; }
.kswx-shopbtn__arrow { width: 16px; height: 16px; transition: transform .18s ease; }
.kswx-shopbtn__btn:hover .kswx-shopbtn__arrow { transform: translateX(4px); }

/* primary — gold filled on dark navy text */
.kswx-shopbtn__btn--primary {
	background: var(--kswx-accent, hsl(42, 80%, 55%));
	color: #131a2e;
	box-shadow: 0 8px 22px rgba(0, 0, 0, .14);
}
.kswx-shopbtn__btn--primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, .20);
	background: hsl(42, 85%, 60%);
	color: #131a2e;
}

/* outline — gold border, transparent fill */
.kswx-shopbtn__btn--outline {
	background: transparent;
	color: #131a2e;
	border-color: var(--kswx-accent, hsl(42, 80%, 55%));
}
.kswx-shopbtn__btn--outline:hover {
	transform: translateY(-2px);
	background: var(--kswx-accent, hsl(42, 80%, 55%));
	color: #131a2e;
}

.kswx-shopbtn__subtext {
	margin: 0;
	max-width: 360px;
	font-size: 0.82rem;
	line-height: 1.45;
	color: #777;
}

@media (max-width: 600px) {
	.kswx-shopbtn { padding: 2rem 1rem; }
	.kswx-shopbtn__btn { width: 100%; justify-content: center; font-size: 1rem; }
}
