/**
 * Conversion Optimization 2.1 — presentation only.
 * Strengthens CTA hierarchy, trust, progress, and next-step cues.
 * Does not redesign layouts or move sections.
 */

/* —— Shared CRO markers —— */
[data-dxp-cro21] {
	--dxp-cro-primary-glow: rgba(255, 196, 72, 0.28);
	--dxp-cro-trust: rgba(255, 255, 255, 0.08);
	--dxp-cro-lift: 0 10px 28px rgba(0, 0, 0, 0.28);
}

/* Primary CTA emphasis (existing buttons) */
[data-dxp-cro21] .dxp-btn-primary,
[data-dxp-cro21] .dxp-btn.dxp-btn-primary {
	box-shadow: 0 0 0 1px rgba(255, 196, 72, 0.22), 0 8px 22px rgba(0, 0, 0, 0.28);
	transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

[data-dxp-cro21] .dxp-btn-primary:hover,
[data-dxp-cro21] .dxp-btn.dxp-btn-primary:hover {
	transform: translate3d(0, -1px, 0);
	box-shadow: 0 0 0 1px rgba(255, 196, 72, 0.35), 0 12px 28px rgba(0, 0, 0, 0.34), 0 0 24px var(--dxp-cro-primary-glow);
}

[data-dxp-cro21] .dxp-btn-primary:active,
[data-dxp-cro21] .dxp-btn.dxp-btn-primary:active {
	transform: translate3d(0, 0, 0);
	filter: brightness(0.96);
}

[data-dxp-cro21] .dxp-btn-primary:focus-visible,
[data-dxp-cro21] .dxp-btn.dxp-btn-primary:focus-visible,
[data-dxp-cro21] .dxp-btn:focus-visible {
	outline: 2px solid rgba(255, 196, 72, 0.85);
	outline-offset: 3px;
}

/* Soft demotion of competing ghosts near a primary stack */
[data-dxp-cro21] .dxp-hero-actions--secondary .dxp-btn-ghost,
[data-dxp-cro21] .dxp-bys21-top-actions .dxp-btn-ghost {
	opacity: 0.88;
}

/* Journey hint (inline, not a new section layout) */
.dxp-cro21-journey-hint {
	margin: 0.85rem 0 0;
	font-size: 0.92rem;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.72);
}

.dxp-cro21-next-cue {
	margin: 0.65rem 0 0;
	font-size: 0.9rem;
	color: rgba(255, 236, 190, 0.92);
}

.dxp-cro21-next-cue strong {
	font-weight: 650;
	color: #ffe7a8;
}

/* —— Home —— */
.dxp-home--cro21 .dxp-hero-cta-stack {
	gap: 0.75rem;
}

.dxp-home--cro21 .dxp-hero-proof {
	gap: 0.45rem 0.85rem;
}

.dxp-home--cro21 .dxp-hero-proof li {
	background: var(--dxp-cro-trust);
	border: 1px solid rgba(255, 255, 255, 0.1);
	padding: 0.28rem 0.65rem;
	border-radius: 999px;
}

.dxp-home--cro21 .dxp-trust-item,
.dxp-home--cro21 .dxp-why--he2 .dxp-pillar {
	transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.dxp-home--cro21 .dxp-trust-item:hover,
.dxp-home--cro21 .dxp-why--he2 .dxp-pillar:hover {
	transform: translate3d(0, -2px, 0);
	box-shadow: var(--dxp-cro-lift);
}

.dxp-home--cro21 .dxp-show-builder--he2 .dxp-btn-primary {
	min-width: min(100%, 14rem);
}

/* —— Product —— */
.dxp-product--cro21 .dxp-confidence-badges {
	gap: 0.4rem;
}

.dxp-product--cro21 .dxp-confidence-badge {
	border-color: rgba(255, 196, 72, 0.28);
	background: rgba(255, 196, 72, 0.08);
}

.dxp-product--cro21 .dxp-product-price--hero,
.dxp-product--cro21 .dxp-sticky-price {
	letter-spacing: 0.01em;
}

.dxp-product--cro21 .dxp-product-stock,
.dxp-product--cro21 .dxp-sticky-stock {
	font-weight: 600;
}

.dxp-product--cro21 .dxp-product-sticky-bar {
	backdrop-filter: blur(10px);
	box-shadow: 0 -8px 28px rgba(0, 0, 0, 0.35);
	border-top: 1px solid rgba(255, 196, 72, 0.18);
}

.dxp-product--cro21 .dxp-sticky-actions .dxp-btn-primary {
	flex: 1 1 auto;
}

.dxp-product--cro21 .dxp-product-reco-teaser {
	border-left: 3px solid rgba(255, 196, 72, 0.55);
	padding-left: 0.75rem;
}

.dxp-product--cro21 .dxp-cro21-sticky-cue {
	margin: 0.4rem 0 0;
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.7);
	text-align: right;
}

/* —— Build Your Show —— */
.dxp-show-builder--cro21 .dxp-bys21-steps li.is-active {
	box-shadow: 0 0 0 1px rgba(255, 196, 72, 0.45), 0 6px 18px rgba(0, 0, 0, 0.25);
}

.dxp-show-builder--cro21 .dxp-bys21-steps li.is-complete {
	opacity: 0.95;
}

.dxp-show-builder--cro21 .dxp-bys21-handoff[data-bys-handoff='list'],
.dxp-show-builder--cro21 .dxp-bys21-handoff[data-bys-handoff='reserve'] {
	border-color: rgba(255, 196, 72, 0.35);
}

.dxp-show-builder--cro21 .dxp-bys21-preview {
	outline: 1px solid rgba(255, 196, 72, 0.16);
}

.dxp-show-builder--cro21 .dxp-cro21-budget-nudge {
	margin-top: 0.55rem;
	font-size: 0.88rem;
	color: rgba(255, 236, 190, 0.9);
}

/* —— Checkout —— */
.dxp-checkout--cro21 .dxp-cro21-chx-progress {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0 0 1rem;
	padding: 0;
	list-style: none;
}

.dxp-checkout--cro21 .dxp-cro21-chx-progress li {
	font-size: 0.78rem;
	padding: 0.28rem 0.55rem;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	color: rgba(255, 255, 255, 0.65);
	background: rgba(255, 255, 255, 0.04);
}

.dxp-checkout--cro21 .dxp-cro21-chx-progress li.is-current {
	color: #fff8e6;
	border-color: rgba(255, 196, 72, 0.5);
	background: rgba(255, 196, 72, 0.12);
}

.dxp-checkout--cro21 .dxp-chx-stage-payment,
.dxp-checkout--cro21 #dxp-chx-reserve {
	scroll-margin-top: 5rem;
}

.dxp-checkout--cro21 .dxp-chx-payment .dxp-chx-actions .dxp-btn-primary {
	min-width: min(100%, 16rem);
}

.dxp-checkout--cro21 .dxp-chx-checks .is-ok {
	border-color: rgba(120, 220, 150, 0.35);
}

.dxp-checkout--cro21 .dxp-chx-checks .is-gap {
	border-color: rgba(255, 180, 90, 0.4);
}

/* —— Shopping list —— */
.dxp-shopping-list--cro21 .dxp-shx-timeline .is-complete {
	border-color: rgba(120, 220, 150, 0.4);
}

.dxp-shopping-list--cro21 .dxp-shx-timeline .is-missing {
	border-color: rgba(255, 180, 90, 0.35);
}

.dxp-shopping-list--cro21 .dxp-shx-checkout .dxp-cro21-shx-cta {
	margin-top: 0.85rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	align-items: center;
}

.dxp-shopping-list--cro21 .dxp-shx-checks .is-gap {
	box-shadow: inset 3px 0 0 rgba(255, 180, 90, 0.55);
}

/* —— Account —— */
.dxp-customer-account--cro21 .dxp-cap-actions .dxp-btn-primary {
	min-width: min(100%, 14rem);
}

.dxp-customer-account--cro21 .dxp-cro21-rewards-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	margin: 0.35rem 0 0.75rem;
	padding: 0.28rem 0.7rem;
	border-radius: 999px;
	font-size: 0.82rem;
	border: 1px solid rgba(255, 196, 72, 0.3);
	background: rgba(255, 196, 72, 0.08);
	color: rgba(255, 240, 200, 0.95);
}

.dxp-customer-account--cro21 .dxp-cap-card:focus-within,
.dxp-customer-account--cro21 .dxp-cap-card:hover {
	transform: translate3d(0, -1px, 0);
	transition: transform 0.2s ease;
}

/* —— Catalog / merch cards (when CRO assets load) —— */
[data-dxp-cro21] .dxp-product-card .dxp-pdm-action--primary,
[data-dxp-cro21] .dxp-product-card .dxp-btn-primary {
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
}

/* —— Mobile / a11y —— */
@media (max-width: 720px) {
	.dxp-product--cro21 .dxp-cro21-sticky-cue,
	.dxp-cro21-journey-hint {
		text-align: left;
		font-size: 0.84rem;
	}

	.dxp-checkout--cro21 .dxp-cro21-chx-progress {
		gap: 0.3rem;
	}

	[data-dxp-cro21] .dxp-btn-primary:hover {
		transform: none;
	}
}

@media (pointer: coarse) {
	[data-dxp-cro21] .dxp-btn-primary:hover,
	.dxp-home--cro21 .dxp-trust-item:hover,
	.dxp-customer-account--cro21 .dxp-cap-card:hover {
		transform: none;
		box-shadow: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	[data-dxp-cro21] .dxp-btn-primary,
	[data-dxp-cro21] .dxp-btn.dxp-btn-primary,
	.dxp-home--cro21 .dxp-trust-item,
	.dxp-home--cro21 .dxp-why--he2 .dxp-pillar,
	.dxp-customer-account--cro21 .dxp-cap-card {
		transition: none !important;
		transform: none !important;
	}
}
