/* ============================================================
   flair/product-spotlight: one product as a featured piece.

   Uses only this plugin's Brand Kit properties. Sizes are in rem, and the ones
   that should follow the screen use clamp().
   ============================================================ */
.flair-spotlight{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(0,1fr);
	align-items:center;
	gap:clamp(1.25rem,0.5rem + 3vw,3rem);
	padding:clamp(1rem,0.5rem + 1.5vw,1.5rem);
	border:var(--flair-companion-border-card,0.0625rem solid color-mix(in srgb,var(--flair-companion-color-border) 60%,transparent));
	border-radius:var(--flair-companion-radius-card,1rem);
	background:var(--flair-companion-color-background);
	box-shadow:var(--flair-companion-shadow-sm);
	color:var(--flair-companion-color-foreground);
	font-family:var(--flair-companion-font-body);
}
.flair-spotlight--side-reverse .flair-spotlight__image{order:2}
.flair-spotlight--stacked{grid-template-columns:minmax(0,1fr);text-align:center}
.flair-spotlight--stacked .flair-spotlight__rating{justify-content:center}
.flair-spotlight__image{
	display:block;
	overflow:hidden;
	border-radius:var(--flair-companion-radius-small,.75rem);
	background:var(--flair-companion-color-background);
}
.flair-spotlight__image img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;filter:var(--flair-companion-image-filter,none);transition:filter .45s ease}
.flair-spotlight__image:hover img{filter:var(--flair-companion-image-filter-hover,var(--flair-companion-image-filter,none))}
.flair-spotlight__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--flair-companion-space-xs)}
.flair-spotlight--stacked .flair-spotlight__body{align-items:center}
.flair-spotlight__body > *{margin:0}
.flair-spotlight__badge{
	font-family:var(--flair-companion-font-headings);font-weight:700;
	font-size:0.75rem;letter-spacing:0.12em;text-transform:uppercase;
	color:var(--flair-companion-color-secondary);
}
.flair-spotlight__title{
	font-family:var(--flair-companion-font-headings);font-weight:700;line-height:1.15;
	font-size:clamp(1.25rem,1.1rem + 0.7vw,1.75rem);
}
.flair-spotlight__title a{color:inherit;text-decoration:none}
.flair-spotlight__title a:hover,.flair-spotlight__title a:focus-visible{text-decoration:underline}
.flair-spotlight__rating{display:flex;align-items:center;gap:.5rem}
.flair-stars{
	--flair-star-on:var(--flair-companion-color-star,#f5a623);--flair-star-off:var(--flair-companion-color-border,#d9d9e0);
	display:inline-block;font-size:1rem;line-height:1;letter-spacing:.08em;
}
.flair-stars:before{
	content:"\2605\2605\2605\2605\2605";
	background:linear-gradient(90deg,var(--flair-star-on) calc(var(--flair-rating,0) / 5 * 100%),var(--flair-star-off) 0);
	-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
}
.flair-spotlight__rating-count{font-size:var(--flair-companion-font-size-small);font-weight:600}
.flair-spotlight__rating-reviews{font-weight:400;color:var(--flair-companion-color-muted)}
.flair-spotlight__price{
	font-size:clamp(1rem,0.95rem + 0.3vw,1.25rem);font-weight:600;
}
.flair-spotlight__price del{font-size:0.7em;font-weight:400;opacity:0.6;margin-right:0.4em}
.flair-spotlight__price ins{text-decoration:none}
.flair-spotlight__text{color:var(--flair-companion-color-foreground-alt);line-height:1.55;font-size:0.9375rem}
.flair-spotlight__text > *{margin:0 0 0.5em}
.flair-spotlight__text > :last-child{margin-bottom:0}
.flair-spotlight__cta{margin-top:var(--flair-companion-space-2xs) !important}
.flair-spotlight__button{
	display:inline-flex;align-items:center;justify-content:center;
	min-height:2.5rem;
	padding:0.5rem clamp(1.125rem,1rem + 0.5vw,1.5rem);
	border:0.125rem solid var(--flair-companion-color-primary);
	border-radius:var(--flair-companion-radius-button,62.4375rem);
	/* Font, size, weight, case and spacing come from Global Styles > Buttons (the wp-element-button class). */
	line-height:1.2;
	text-decoration:none;
	transition:var(--flair-companion-motion-fast) var(--flair-companion-motion-ease);
}
.flair-spotlight__button--solid{
	background:var(--flair-companion-color-primary);color:var(--flair-companion-color-background);
	box-shadow:var(--flair-companion-shadow-sm);
}
.flair-spotlight__button--solid:hover,.flair-spotlight__button--solid:focus-visible{box-shadow:var(--flair-companion-shadow-md);transform:translateY(-0.0625rem)}
.flair-spotlight__button--outline{background:transparent;color:var(--flair-companion-color-primary)}
.flair-spotlight__button--outline:hover,.flair-spotlight__button--outline:focus-visible{background:var(--flair-companion-color-primary-subtle)}
.flair-spotlight__button:focus-visible{outline:0.125rem solid var(--flair-companion-color-primary);outline-offset:0.1875rem}
@media (max-width:48em){
	.flair-spotlight{grid-template-columns:minmax(0,1fr)}
	.flair-spotlight--side-reverse .flair-spotlight__image{order:0}
}
