/* ==========================================================================
   Enhanced-section visual language (storefront)
   Opt-in polish/motion behind a namespaced token layer. Loaded last.
   See docs/ui-enhancement-visual-language.md and the enhancement ADR.
   ========================================================================== */
:root {
	--enh-accent:        #759062;
	--enh-accent-soft:   rgba(117, 144, 98, .14);
	--enh-onhold:        #8a6d00;
	--enh-onhold-soft:   rgba(214, 170, 0, .16);
	--enh-sold:          #9b2d2d;
	--enh-sold-soft:     rgba(155, 45, 45, .12);
	--enh-hairline:      rgba(0, 0, 0, .08);
	--enh-elev-1:        0 1px 2px rgba(0, 0, 0, .06), 0 2px 8px rgba(0, 0, 0, .05);
	--enh-elev-2:        0 2px 6px rgba(0, 0, 0, .10), 0 8px 24px rgba(0, 0, 0, .08);
	--enh-radius:        6px;
	--enh-dur-fast:      120ms;
	--enh-dur-base:      200ms;
	--enh-dur-slow:      320ms;
	--enh-ease-standard: cubic-bezier(.2, 0, .2, 1);
	--enh-ease-emphasis: cubic-bezier(.2, 0, 0, 1);
}

/* --- 6.1 Status badge pills (On Hold / Sold) ------------------------------ */
.enh-badge {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	padding: 3px 12px !important;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
}
.enh-badge::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
	opacity: .85;
}
.enh-badge.enh-onhold {
	color: var(--enh-onhold) !important;
	background: var(--enh-onhold-soft);
}
.enh-badge.enh-sold {
	color: var(--enh-sold) !important;
	background: var(--enh-sold-soft);
}

/* --- 6.1 One-time attention pulse on the On-Hold INQUIRE button ----------- */
@keyframes enhPulseOnce {
	0%   { box-shadow: 0 0 0 0 var(--enh-accent-soft); }
	70%  { box-shadow: 0 0 0 10px rgba(117, 144, 98, 0); }
	100% { box-shadow: 0 0 0 0 rgba(117, 144, 98, 0); }
}
.enh-inquire-pulse { animation: enhPulseOnce 1.2s var(--enh-ease-standard) 1; border-radius: 4px; }

/* --- 6.1 / 6.4 Card reveal & representative crossfade --------------------- */
.enh-reveal { opacity: 0; transform: translateY(10px); }
.enh-reveal.enh-in {
	opacity: 1;
	transform: none;
	transition: opacity var(--enh-dur-slow) var(--enh-ease-emphasis),
	            transform var(--enh-dur-slow) var(--enh-ease-emphasis);
}

/* --- Accessibility kill-switch -------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.enh-reveal { opacity: 1 !important; transform: none !important; }
	.enh-inquire-pulse { animation: none !important; }
	.enh-reveal.enh-in { transition: none !important; }
}
