/*
The Boss Love Theme — Style Quiz call-to-action.
Loaded only where the banner or sidebar card actually renders.
*/

/* ============ Wide banner (homepage / archive) ============ */
.bl-quiz-banner{ margin:34px 0 8px; }
.bl-quiz-banner-link{
	position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto;
	gap:26px; align-items:center; overflow:hidden;
	padding:26px 30px; border-radius:18px;
	background:linear-gradient(120deg,#1E1E1E 0%,#2A2130 55%,color-mix(in srgb, var(--bl-theme) 70%, #1E1E1E) 100%);
	border:1px solid color-mix(in srgb, var(--bl-theme) 35%, transparent);
	transition:transform .4s cubic-bezier(.22,.61,.36,1), box-shadow .4s ease-out;
}
.bl-quiz-banner-link:hover{
	transform:translateY(-4px);
	box-shadow:0 18px 44px color-mix(in srgb, var(--bl-theme) 34%, transparent);
}
.bl-quiz-banner-glow{
	position:absolute; width:320px; height:320px; right:-90px; top:-130px; border-radius:50%;
	background:radial-gradient(circle, color-mix(in srgb, var(--bl-theme) 55%, transparent) 0%, transparent 68%);
	opacity:.75; transition:transform .6s ease-out, opacity .4s;
}
.bl-quiz-banner-link:hover .bl-quiz-banner-glow{ transform:scale(1.18); opacity:1; }

.bl-quiz-banner-emojis{
	position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px;
	padding:12px; border-radius:14px; background:rgba(255,255,255,.07);
	border:1px solid rgba(255,255,255,.12); flex:none;
}
.bl-quiz-banner-emojis span{ display:flex; align-items:center; justify-content:center; transition:transform .45s cubic-bezier(.22,.61,.36,1); }
.bl-quiz-banner-link:hover .bl-quiz-banner-emojis span:nth-child(1){ transform:translateY(-3px) rotate(-8deg); }
.bl-quiz-banner-link:hover .bl-quiz-banner-emojis span:nth-child(2){ transform:translateY(-3px) rotate(8deg); }
.bl-quiz-banner-link:hover .bl-quiz-banner-emojis span:nth-child(3){ transform:translateY(3px) rotate(6deg); }
.bl-quiz-banner-link:hover .bl-quiz-banner-emojis span:nth-child(4){ transform:scale(1.2); }

.bl-quiz-banner-body{ position:relative; min-width:0; display:block; }
.bl-quiz-banner-eyebrow{
	display:block; font-size:var(--bl-fs-section-sub,11px); font-weight:800; letter-spacing:.2em;
	text-transform:uppercase; color:var(--bl-theme); margin-bottom:6px;
}
.bl-quiz-banner-title{
	display:block; font-family:var(--bl-font-display); font-weight:700; color:#fff;
	font-size:clamp(1.25rem,1.4vw + 1rem,1.68rem); line-height:1.3; margin-bottom:6px;
}
.bl-quiz-banner-text{
	display:block; font-size:0.88rem; line-height:1.6; color:rgba(255,255,255,.85); max-width:56ch;
}
.bl-quiz-banner-cta{ position:relative; display:flex; flex-direction:column; align-items:center; gap:8px; flex:none; }
.bl-quiz-banner-btn{
	display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
	background:var(--bl-theme); color:#fff !important; border-radius:26px;
	padding:14px 26px; font-size:0.8rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
	box-shadow:0 8px 22px color-mix(in srgb, var(--bl-theme) 45%, transparent);
	transition:transform .3s ease-out, background .25s;
}
.bl-quiz-banner-link:hover .bl-quiz-banner-btn{ transform:translateY(-2px) scale(1.03); background:#fff; color:var(--bl-theme) !important; }
.bl-quiz-banner-meta{ font-size:0.7rem; letter-spacing:.06em; color:rgba(255,255,255,.78); white-space:nowrap; }

/* ============ Sidebar card ============ */
.bl-quiz-card{
	position:relative; overflow:hidden; text-align:center;
	background:linear-gradient(150deg,#1E1E1E,#2A2130); border:0; color:#fff;
}
.bl-quiz-card-spark{
	position:absolute; right:-18px; top:-26px; font-size:6rem; line-height:1;
	color:color-mix(in srgb, var(--bl-theme) 40%, transparent); pointer-events:none;
}
.bl-quiz-card-eyebrow{
	position:relative; display:block; font-size:0.64rem; font-weight:800; letter-spacing:.2em;
	text-transform:uppercase; color:var(--bl-theme); margin-bottom:7px;
}
.bl-quiz-card-title{
	position:relative; font-family:var(--bl-font-display); font-weight:700; color:#fff;
	font-size:1.12rem; line-height:1.35; margin:0 0 8px;
}
.bl-quiz-card-text{ position:relative; font-size:0.8rem; line-height:1.6; color:rgba(255,255,255,.8); margin:0 0 15px; }
.bl-quiz-card-btn{
	position:relative; display:inline-flex; align-items:center; gap:7px;
	background:var(--bl-theme); color:#fff !important; border-radius:24px;
	padding:11px 20px; font-size:0.72rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
	transition:transform .3s ease-out, background .25s, box-shadow .3s;
}
.bl-quiz-card-btn:hover{
	transform:translateY(-2px); background:#fff; color:var(--bl-theme) !important;
	box-shadow:0 8px 20px color-mix(in srgb, var(--bl-theme) 40%, transparent);
}

@media (max-width:900px){
	.bl-quiz-banner-link{ grid-template-columns:1fr; gap:18px; text-align:center; padding:24px 22px; }
	.bl-quiz-banner-emojis{ justify-self:center; grid-template-columns:repeat(4,1fr); }
	.bl-quiz-banner-text{ max-width:none; }
	.bl-quiz-banner-cta{ align-items:center; }
}