/**
 * BBK AI Business Builder - MemberPress Companion
 * Front-end styles for course / companion shortcodes.
 *
 * Scoped under .bbkai-root and MP body classes where possible.
 * Compatible with WP 6.9.7–7.1 and MemberPress 1.14.x themes.
 */

:root {
	--bbkai-text: #1c2452;
	--bbkai-text2: #3c4780;
	--bbkai-muted: #68739f;
	--bbkai-surface: #ffffff;
	--bbkai-surface2: #f7f6ff;
	--bbkai-line: #e6e3f5;
	--bbkai-accent: #5b3df5;
	--bbkai-accent2: #8b5cf6;
	--bbkai-hot: #ff8a2a;
	--bbkai-hot-deep: #ef6c00;
	--bbkai-good: #00b9a0;
	--bbkai-sky: #2f8bff;
	--bbkai-gold: #ffc63d;
	--bbkai-pop: #ff5c7a;
	--bbkai-grad-brand: linear-gradient(135deg, #4322d6, #7b3ff2 55%, #b04cf0);
	--bbkai-grad-cta: linear-gradient(180deg, #ffbe3d, #ff8a2a);
	--bbkai-grad-week: linear-gradient(120deg, #ff8a2a, #ff5c7a 60%, #c44df0);
	--bbkai-shadow: 0 12px 34px rgba(28, 36, 82, 0.13);
	--bbkai-lift: 0 22px 54px rgba(28, 36, 82, 0.22);
	--bbkai-radius: 26px;
	--bbkai-bz-shell: #f4f6ff;
	--bbkai-bz-shell2: #ccd6f6;
	--bbkai-bz-visor: #1c2452;
	--bbkai-bz-eye: #3fd6ff;
	--bbkai-bz-trim: #8a94c8;
	--bbkai-bz-glow: rgba(63, 214, 255, 0.55);
	--bbkai-bz-cheek: 1;
}

html.bbkai-mode-founder {
	--bbkai-text: #eef1ff;
	--bbkai-text2: #c6cdf5;
	--bbkai-muted: #8d97c9;
	--bbkai-surface: #151a33;
	--bbkai-surface2: #1c2342;
	--bbkai-line: #2a3158;
	--bbkai-accent: #7c5cff;
	--bbkai-accent2: #00e0ff;
	--bbkai-grad-brand: linear-gradient(135deg, #241a63, #5b3df5 60%, #00c2ff);
	--bbkai-grad-week: linear-gradient(120deg, #3a22b8, #7c3aed 55%, #00a3d9);
	--bbkai-shadow: 0 14px 36px rgba(0, 0, 0, 0.45);
	--bbkai-bz-shell: #232a4d;
	--bbkai-bz-shell2: #101530;
	--bbkai-bz-visor: #05070f;
	--bbkai-bz-eye: #00e0ff;
	--bbkai-bz-trim: #5563a8;
	--bbkai-bz-glow: rgba(0, 224, 255, 0.6);
	--bbkai-bz-cheek: 0;
}

.bbkai-root {
	font-family: "Nunito", system-ui, sans-serif;
	color: var(--bbkai-text);
	line-height: 1.5;
	box-sizing: border-box;
	max-width: 1140px;
	width: 100%;
	margin: 0 auto 2rem;
}

.bbkai-root *,
.bbkai-root *::before,
.bbkai-root *::after {
	box-sizing: border-box;
}

.bbkai-root img,
.bbkai-root svg,
.bbkai-root video,
.bbkai-root iframe {
	max-width: 100%;
	height: auto;
}

/* Soften giant MP / theme media near our lesson content */
.mpcs-lesson img,
.mpcs-course img,
.mpcs-classroom img,
body[class*="mpcs-"] .entry-content img,
body[class*="mepr-"] .entry-content img {
	max-width: 100%;
	height: auto;
}

.bbkai-root h2,
.bbkai-root h3,
.bbkai-root h4,
.bbkai-kicker {
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-weight: 800;
	margin: 0 0 0.5rem;
}

.bbkai-kicker {
	font-size: 0.75rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--bbkai-accent);
}

.bbkai-kicker--on-banner {
	color: #fff6d8;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.25);
	opacity: 0.95;
}

.bbkai-msg,
.bbkai-note,
.bbkai-shell-note {
	color: var(--bbkai-muted);
	font-weight: 700;
	font-size: 0.95rem;
}

.bbkai-week-banner {
	position: relative;
	overflow: hidden;
	display: flex;
	gap: 1rem;
	align-items: center;
	flex-wrap: wrap;
	padding: 1.5rem 1.85rem;
	border-radius: var(--bbkai-radius);
	background: var(--bbkai-grad-week);
	color: #fff;
	box-shadow: var(--bbkai-lift);
	margin-bottom: 1.25rem;
}

.bbkai-week-banner__dots {
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, 0.16) 2.5px, transparent 2.5px);
	background-size: 26px 26px;
	pointer-events: none;
}

.bbkai-week-banner__text {
	flex: 1 1 220px;
	position: relative;
	z-index: 1;
}

.bbkai-week-banner__cta {
	margin-left: auto;
	align-self: center;
	position: relative;
	z-index: 1;
}

.bbkai-week-banner__icon {
	position: relative;
	z-index: 1;
	width: 70px;
	height: 70px;
	border-radius: 22px;
	background: rgba(255, 255, 255, 0.18);
	border: 2px solid rgba(255, 255, 255, 0.45);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	line-height: 1;
	backdrop-filter: blur(4px);
	flex-shrink: 0;
}

.bbkai-week-banner__title {
	color: #fff;
	font-size: clamp(1.35rem, 2.5vw, 1.85rem);
	text-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);
}

.bbkai-week-banner__sub {
	margin: 0.35rem 0 0;
	opacity: 0.95;
	font-weight: 700;
	max-width: 36rem;
}

.bbkai-btn {
	appearance: none;
	border: none;
	cursor: pointer;
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-weight: 700;
	font-size: 1.05rem;
	color: #fff;
	background: var(--bbkai-grad-cta);
	box-shadow: 0 5px 0 #cf6a00, 0 12px 22px rgba(0, 0, 0, 0.16);
	padding: 0.85rem 1.35rem;
	border-radius: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	transition: transform 0.12s ease;
	position: relative;
	overflow: hidden;
}

.bbkai-btn:hover {
	transform: translateY(-2px);
}

.bbkai-btn:active {
	transform: translateY(2px);
	box-shadow: 0 1px 0 #cf6a00;
}

.bbkai-btn:disabled {
	opacity: 0.65;
	cursor: wait;
	transform: none;
}

.bbkai-btn--sm {
	font-size: 0.92rem;
	padding: 0.65rem 1rem;
	border-radius: 12px;
}

.bbkai-btn--brand {
	background: var(--bbkai-grad-brand);
	box-shadow: 0 5px 0 #22135f, 0 12px 22px rgba(67, 34, 214, 0.35);
}

.bbkai-btn--go {
	background: linear-gradient(180deg, #19d3bb, #00a191);
	box-shadow: 0 5px 0 #00786b, 0 12px 22px rgba(0, 180, 150, 0.28);
}

.bbkai-btn--blue {
	background: linear-gradient(180deg, #54a4ff, #1f6ee8);
	box-shadow: 0 5px 0 #14498f, 0 12px 22px rgba(47, 139, 255, 0.28);
}

.bbkai-two-col {
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: 1.1rem;
	margin-bottom: 1.25rem;
}

@media (max-width: 800px) {
	.bbkai-two-col {
		grid-template-columns: 1fr;
	}
}

.bbkai-panel {
	background: var(--bbkai-surface);
	border: 1px solid var(--bbkai-line);
	border-radius: var(--bbkai-radius);
	box-shadow: var(--bbkai-shadow);
	padding: 1.35rem 1.5rem;
	margin-bottom: 1.1rem;
}

.bbkai-panel h3 {
	font-size: 1.15rem;
	color: var(--bbkai-text);
}

.bbkai-mini-progress {
	height: 10px;
	border-radius: 999px;
	background: var(--bbkai-surface2);
	border: 1px solid var(--bbkai-line);
	overflow: hidden;
	margin: 0.65rem 0 0.85rem;
}

.bbkai-mini-progress i {
	display: block;
	height: 100%;
	width: 0;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--bbkai-good), var(--bbkai-sky), var(--bbkai-accent));
	transition: width 0.6s cubic-bezier(0.34, 1.5, 0.64, 1);
}

.bbkai-mission-intro {
	margin: 0.35rem 0 0.65rem;
	font-size: 0.92rem;
	font-weight: 700;
	color: var(--bbkai-text2);
}

.bbkai-mission-list {
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
	margin: 0 0 1rem;
	padding: 0;
}

.bbkai-mission {
	appearance: none;
	width: 100%;
	text-align: left;
	display: flex;
	align-items: center;
	gap: 0.8rem;
	padding: 0.8rem 1rem;
	border-radius: 16px;
	border: 2.5px solid var(--bbkai-line);
	background: var(--bbkai-surface2);
	color: var(--bbkai-text2);
	font: inherit;
	font-weight: 800;
	font-size: 0.92rem;
	cursor: pointer;
	user-select: none;
	transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.bbkai-mission:hover {
	border-color: var(--bbkai-accent2);
	transform: translateX(4px);
}

.bbkai-mission:focus-visible {
	outline: 3px solid var(--bbkai-gold);
	outline-offset: 2px;
}

.bbkai-mission__box {
	width: 27px;
	height: 27px;
	border-radius: 9px;
	border: 3px solid var(--bbkai-line);
	background: var(--bbkai-surface);
	flex-shrink: 0;
	position: relative;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.bbkai-mission__mic {
	margin-left: auto;
	color: var(--bbkai-muted);
	font-size: 0.85rem;
}

.bbkai-mission.is-done {
	border-color: var(--bbkai-good);
	background: color-mix(in srgb, var(--bbkai-good) 12%, var(--bbkai-surface));
	color: var(--bbkai-text);
}

.bbkai-mission.is-done .bbkai-mission__box {
	border-color: var(--bbkai-good);
	background: var(--bbkai-good);
	animation: bbkaiPop 0.4s ease;
}

.bbkai-mission.is-done .bbkai-mission__box::after {
	content: "";
	position: absolute;
	left: 7px;
	top: 3px;
	width: 6px;
	height: 11px;
	border: solid #fff;
	border-width: 0 2.5px 2.5px 0;
	transform: rotate(45deg);
}

.bbkai-mission.is-done .bbkai-mission__mic {
	color: var(--bbkai-good);
}

@keyframes bbkaiPop {
	0% {
		transform: scale(0.7);
	}
	70% {
		transform: scale(1.14);
	}
	100% {
		transform: scale(1);
	}
}

.bbkai-why,
.bbkai-together {
	background: var(--bbkai-surface2);
	border-radius: 16px;
	padding: 0.9rem 1rem;
	border: 2px solid var(--bbkai-line);
	margin-top: 0.75rem;
}

.bbkai-parents-box {
	background: color-mix(in srgb, var(--bbkai-hot) 9%, var(--bbkai-surface));
	border: 2px dashed color-mix(in srgb, var(--bbkai-hot) 45%, transparent);
	border-radius: 16px;
	padding: 0.9rem 1rem;
	margin-top: 0.75rem;
}

.bbkai-together {
	margin-bottom: 1.1rem;
}

.bbkai-why h4,
.bbkai-together h3 {
	font-size: 0.95rem;
	margin-bottom: 0.35rem;
	color: var(--bbkai-accent);
}

.bbkai-parents-box h4 {
	font-size: 0.95rem;
	margin-bottom: 0.35rem;
	color: var(--bbkai-hot-deep);
}

.bbkai-why p,
.bbkai-parents-box p,
.bbkai-together p {
	margin: 0;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--bbkai-text2);
}

.bbkai-video-wrap {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	background: #0d1030;
	margin: 0.75rem 0;
	box-shadow: var(--bbkai-shadow);
	line-height: 0;
}

.bbkai-video-wrap.is-watched {
	outline: 3px solid var(--bbkai-gold);
	outline-offset: 2px;
}

/* Swap model: poster OR video — never stacked */
.bbkai-video-wrap.is-playing .bbkai-video-poster {
	display: none !important;
}

.bbkai-video-wrap:not(.is-playing) .bbkai-video {
	display: none !important;
}

.bbkai-video-wrap.is-playing .bbkai-video {
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	position: static !important;
	width: 100% !important;
	height: auto !important;
	max-width: 100% !important;
}

.bbkai-video {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	background: #0d1030;
	vertical-align: top;
}

.bbkai-video-poster {
	appearance: none;
	border: none;
	position: relative;
	z-index: 2;
	width: 100%;
	aspect-ratio: 16 / 9;
	min-height: 200px;
	margin: 0;
	padding: 1.25rem 1.35rem;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	text-align: center;
	color: #fff;
	font-family: inherit;
	background: linear-gradient(135deg, #ff8a2a 0%, #ff5c7a 38%, #c44df0 72%, #5b3df5 100%);
	overflow: hidden;
	line-height: 1.3;
}

.bbkai-video-poster__glow {
	position: absolute;
	width: 55%;
	height: 55%;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 255, 255, 0.35) 0%, transparent 70%);
	top: 18%;
	left: 50%;
	transform: translateX(-50%);
	pointer-events: none;
	animation: bbkaiPosterGlow 3.2s ease-in-out infinite;
}

.bbkai-video-poster__dots {
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, 0.18) 2px, transparent 2px);
	background-size: 22px 22px;
	pointer-events: none;
	opacity: 0.85;
}

.bbkai-video-poster__title {
	position: relative;
	z-index: 1;
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-weight: 800;
	font-size: clamp(1.15rem, 3.6vw, 2rem);
	line-height: 1.15;
	max-width: 16ch;
	text-wrap: balance;
	text-shadow: 0 3px 16px rgba(0, 0, 0, 0.35);
	padding: 0 0.25rem;
}

.bbkai-video-poster__play {
	position: relative;
	z-index: 1;
	width: 88px;
	height: 88px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s ease;
}

.bbkai-video-poster__play-ring {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 3px solid rgba(255, 255, 255, 0.55);
	box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.12);
	animation: bbkaiPlayPulse 1.8s ease-in-out infinite;
}

.bbkai-video-poster__play-core {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: var(--bbkai-grad-cta);
	box-shadow: 0 10px 28px rgba(255, 138, 42, 0.55), 0 6px 0 #cf6a00;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.55rem;
	padding-left: 4px;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.bbkai-video-poster:hover .bbkai-video-poster__play {
	transform: scale(1.08);
}

.bbkai-video-poster:hover .bbkai-video-poster__play-core {
	transform: scale(1.06) rotate(-4deg);
	box-shadow: 0 14px 34px rgba(255, 138, 42, 0.65), 0 7px 0 #cf6a00;
}

.bbkai-video-poster:hover .bbkai-video-poster__play-ring {
	animation-duration: 1s;
	border-color: rgba(255, 255, 255, 0.9);
}

.bbkai-video-poster:active .bbkai-video-poster__play-core {
	transform: translateY(3px) scale(1.02);
	box-shadow: 0 4px 14px rgba(255, 138, 42, 0.45), 0 2px 0 #cf6a00;
}

.bbkai-video-poster__hint {
	position: relative;
	z-index: 1;
	font-weight: 900;
	font-size: 0.78rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	opacity: 0.92;
	background: rgba(0, 0, 0, 0.22);
	padding: 0.35rem 0.75rem;
	border-radius: 999px;
}

@keyframes bbkaiPosterGlow {
	0%,
	100% {
		opacity: 0.55;
		transform: translateX(-50%) scale(1);
	}
	50% {
		opacity: 0.9;
		transform: translateX(-50%) scale(1.12);
	}
}

@keyframes bbkaiPlayPulse {
	0%,
	100% {
		transform: scale(1);
		opacity: 0.9;
	}
	50% {
		transform: scale(1.12);
		opacity: 0.45;
	}
}

@media (max-width: 520px) {
	.bbkai-video-poster__play {
		width: 74px;
		height: 74px;
	}

	.bbkai-video-poster__play-core {
		width: 60px;
		height: 60px;
		font-size: 1.3rem;
	}
}

.bbkai-bizzy-say {
	display: flex;
	gap: 0.85rem;
	align-items: flex-start;
	margin-bottom: 1rem;
}

.bbkai-bizzy-avatar {
	width: 64px;
	height: 70px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	animation: bbkaiFloaty 3.4s ease-in-out infinite;
}

.bbkai-bizzy-svg {
	display: block;
	width: 64px;
	height: auto;
	filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.18));
}

.bbkai-bizzy-svg svg {
	display: block;
	width: 100%;
	height: auto;
}

.bbkai-bizzy-glow {
	transform-origin: 60px 118px;
	animation: bbkaiHoverGlow 2.4s ease-in-out infinite;
}

.bbkai-bizzy-antenna {
	animation: bbkaiAntenna 1.6s ease-in-out infinite;
}

.bbkai-bizzy-eye {
	animation: bbkaiBlink 3.8s ease-in-out infinite;
	transform-box: fill-box;
	transform-origin: center;
}

.bbkai-bizzy-beam {
	animation: bbkaiAntenna 2.4s ease-in-out infinite;
}

@keyframes bbkaiFloaty {
	50% {
		transform: translateY(-6px);
	}
}

@keyframes bbkaiHoverGlow {
	0%,
	100% {
		opacity: 0.55;
		transform: scaleX(1);
	}
	50% {
		opacity: 0.9;
		transform: scaleX(1.25);
	}
}

@keyframes bbkaiAntenna {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: 0.3;
	}
}

@keyframes bbkaiBlink {
	0%,
	44%,
	56%,
	100% {
		transform: scaleY(1);
	}
	50% {
		transform: scaleY(0.18);
	}
}

.bbkai-speech {
	background: var(--bbkai-surface2);
	border: 2px solid var(--bbkai-line);
	border-radius: 5px 20px 20px 20px;
	padding: 0.85rem 1rem;
	flex: 1;
}

.bbkai-speech p {
	margin: 0.25rem 0 0;
	font-weight: 700;
	color: var(--bbkai-text2);
	font-size: 0.95rem;
}

.bbkai-idea-finder {
	padding: 0;
	overflow: visible;
}

.bbkai-idea-finder > .bbkai-step,
.bbkai-idea-finder > .bbkai-celebrate {
	padding: 1.35rem 1.5rem 1.5rem;
}

.bbkai-wiz-top {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	margin: 0 0 0;
	padding: 1rem 1.35rem;
	background: var(--bbkai-grad-brand);
	color: #fff;
	position: relative;
	overflow: hidden;
	border-radius: var(--bbkai-radius) var(--bbkai-radius) 0 0;
}

.bbkai-wiz-top::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, 0.13) 2px, transparent 2px);
	background-size: 22px 22px;
	pointer-events: none;
}

.bbkai-wiz-top__title {
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-weight: 800;
	color: #fff;
	position: relative;
	z-index: 1;
}

.bbkai-wiz-bar {
	flex: 1;
	min-width: 120px;
	height: 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.2);
	overflow: hidden;
	position: relative;
	z-index: 1;
}

.bbkai-wiz-bar i {
	display: block;
	height: 100%;
	width: 8%;
	background: linear-gradient(90deg, var(--bbkai-gold), var(--bbkai-hot));
	transition: width 0.7s cubic-bezier(0.34, 1.5, 0.64, 1);
}

.bbkai-wiz-count {
	font-size: 0.8rem;
	font-weight: 900;
	color: #fff;
	letter-spacing: 0.04em;
	position: relative;
	z-index: 1;
	background: rgba(255, 255, 255, 0.16);
	padding: 0.3rem 0.7rem;
	border-radius: 11px;
}

.bbkai-step {
	display: none;
}

.bbkai-step.is-active {
	display: block;
	animation: bbkaiFadeUp 0.35s ease;
}

@keyframes bbkaiFadeUp {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.bbkai-q {
	font-size: 1.25rem;
	margin: 0.5rem 0 0.35rem;
}

.bbkai-lead,
.bbkai-hint {
	color: var(--bbkai-muted);
	font-weight: 700;
	margin: 0 0 1rem;
}

.bbkai-hello-name {
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-size: 1.6rem;
	font-weight: 800;
	background: linear-gradient(90deg, var(--bbkai-accent), #ff5c7a);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	margin: 0.25rem 0 1rem;
}

.bbkai-field {
	display: block;
	margin: 0.75rem 0 1rem;
}

.bbkai-field span {
	display: block;
	font-size: 0.72rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--bbkai-text2);
	margin-bottom: 0.4rem;
}

.bbkai-field input,
.bbkai-field textarea {
	width: 100%;
	padding: 0.85rem 1rem;
	border: 2.5px solid var(--bbkai-line);
	border-radius: 14px;
	font: inherit;
	font-weight: 700;
	background: var(--bbkai-surface2);
	color: var(--bbkai-text);
}

.bbkai-field input:focus,
.bbkai-field textarea:focus {
	outline: none;
	border-color: var(--bbkai-accent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--bbkai-accent) 18%, transparent);
}

.bbkai-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	margin-top: 1rem;
	margin-bottom: 1.5rem;
}

.bbkai-vocab {
	display: inline-flex;
	flex-direction: column;
	gap: 0.15rem;
	padding: 0.85rem 1.1rem;
	border-radius: 16px;
	background: color-mix(in srgb, var(--bbkai-gold) 22%, var(--bbkai-surface));
	border: 2px solid color-mix(in srgb, var(--bbkai-gold) 55%, var(--bbkai-line));
	margin: 0.5rem 0 0.25rem;
}

.bbkai-vocab span {
	font-size: 0.7rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--bbkai-muted);
}

.bbkai-vocab strong {
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-size: 1.35rem;
	color: var(--bbkai-text);
}

.bbkai-big-choice {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.9rem;
	margin-top: 0.75rem;
}

@media (max-width: 700px) {
	.bbkai-big-choice {
		grid-template-columns: 1fr;
	}
}

.bbkai-choice {
	appearance: none;
	text-align: center;
	border: none;
	border-radius: 24px;
	padding: 1.35rem 1.15rem;
	cursor: pointer;
	font: inherit;
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
	position: relative;
	overflow: hidden;
	box-shadow: var(--bbkai-shadow);
}

.bbkai-choice::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, 0.15) 2px, transparent 2px);
	background-size: 24px 24px;
	pointer-events: none;
}

.bbkai-choice:hover {
	transform: translateY(-7px);
	box-shadow: var(--bbkai-lift);
}

.bbkai-choice__icon {
	position: relative;
	z-index: 1;
	width: 64px;
	height: 64px;
	border-radius: 20px;
	background: rgba(255, 255, 255, 0.18);
	border: 2px solid rgba(255, 255, 255, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.6rem;
}

.bbkai-choice strong {
	position: relative;
	z-index: 1;
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-size: 1.15rem;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}

.bbkai-choice span:last-child {
	position: relative;
	z-index: 1;
	font-size: 0.88rem;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.95);
}

.bbkai-choice--1 {
	background: linear-gradient(150deg, #2f8bff, #5b3df5);
}

.bbkai-choice--2 {
	background: linear-gradient(150deg, #ff8a2a, #f43f5e);
}

.bbkai-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	margin: 0.35rem 0 0.75rem;
}

.bbkai-chip {
	appearance: none;
	border: 2.5px solid var(--bbkai-line);
	background: var(--bbkai-surface);
	border-radius: 999px;
	padding: 0.65rem 1rem;
	font: inherit;
	font-weight: 800;
	font-size: 0.92rem;
	color: var(--bbkai-text2);
	cursor: pointer;
	transition: transform 0.12s ease, background 0.12s ease, color 0.12s ease;
}

.bbkai-chip:hover {
	transform: translateY(-2px);
	border-color: var(--bbkai-accent);
}

.bbkai-chip.is-sel {
	background: var(--bbkai-grad-brand);
	color: #fff;
	border-color: transparent;
	box-shadow: 0 6px 14px rgba(67, 34, 214, 0.28);
}

.bbkai-journey {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	margin: 0.75rem 0 0.25rem;
}

.bbkai-journey span {
	background: var(--bbkai-surface2);
	border: 1px solid var(--bbkai-line);
	border-radius: 999px;
	padding: 0.4rem 0.75rem;
	font-size: 0.8rem;
	font-weight: 800;
	color: var(--bbkai-text2);
}

.bbkai-idea-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.85rem;
}

@media (max-width: 800px) {
	.bbkai-idea-grid {
		grid-template-columns: 1fr;
	}
}

.bbkai-idea-card {
	appearance: none;
	border: 3px solid var(--bbkai-line);
	border-radius: 20px;
	padding: 1rem;
	background: var(--bbkai-surface2);
	cursor: pointer;
	text-align: left;
	font: inherit;
	color: var(--bbkai-text);
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	transition: transform 0.12s ease, border-color 0.12s ease;
}

.bbkai-idea-card:hover {
	transform: translateY(-3px);
	border-color: var(--bbkai-accent);
}

.bbkai-idea-card__line {
	margin: 0;
	font-size: 0.88rem;
	font-weight: 700;
	color: var(--bbkai-muted);
}

.bbkai-idea-card__idea {
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-size: 1.25rem;
}

.bbkai-idea-card__cta {
	margin-top: auto;
	font-weight: 900;
	font-size: 0.85rem;
	color: var(--bbkai-accent);
}

.bbkai-idea-display {
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-size: 1.35rem;
	font-weight: 800;
	color: var(--bbkai-accent);
	margin: 0.35rem 0 0.75rem;
}

.bbkai-celebrate {
	text-align: center;
}

.bbkai-cert {
	margin: 1rem auto;
	max-width: 420px;
	padding: 1.25rem;
	border-radius: 22px;
	border: 3px dashed color-mix(in srgb, var(--bbkai-gold) 70%, var(--bbkai-line));
	background: color-mix(in srgb, var(--bbkai-gold) 12%, var(--bbkai-surface));
}

.bbkai-cert__label {
	font-family: "Baloo 2", "Nunito", sans-serif;
	font-weight: 800;
	letter-spacing: 0.06em;
	margin: 0;
}

.bbkai-cert__name {
	font-weight: 800;
	color: var(--bbkai-text2);
	margin: 0;
}

.bbkai-form-error {
	color: #c62828;
	font-weight: 800;
	margin-top: 0.75rem;
}

.bbkai-complete-card {
	background: color-mix(in srgb, var(--bbkai-good) 12%, var(--bbkai-surface));
	border: 2px solid color-mix(in srgb, var(--bbkai-good) 45%, var(--bbkai-line));
	border-radius: 18px;
	padding: 1rem 1.15rem;
}

.bbkai-pz-band {
	padding: 1.25rem 1.5rem;
	border-radius: var(--bbkai-radius);
	background: var(--bbkai-surface2);
	border: 1px solid var(--bbkai-line);
	margin-bottom: 1rem;
}

.bbkai-pz-band h2 {
	margin-bottom: 0.25rem;
}

.bbkai-pz-band p {
	margin: 0;
	font-weight: 700;
	color: var(--bbkai-text2);
}

.bbkai-review-hero {
	padding: 1rem;
	border-radius: 18px;
	background: color-mix(in srgb, var(--bbkai-accent) 10%, var(--bbkai-surface));
	border: 1px solid var(--bbkai-line);
	margin-bottom: 0.85rem;
}

.bbkai-rc-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.65rem;
	margin-bottom: 0.85rem;
}

@media (max-width: 600px) {
	.bbkai-rc-grid {
		grid-template-columns: 1fr;
	}
}

.bbkai-review-card {
	padding: 0.85rem;
	border-radius: 14px;
	background: var(--bbkai-surface2);
	border: 1px solid var(--bbkai-line);
	font-weight: 700;
	color: var(--bbkai-text2);
}

.bbkai-bizzy-slot {
	margin-top: 1rem;
	padding: 1rem;
	border: 2px dashed var(--bbkai-line);
	border-radius: 18px;
	text-align: center;
}

/* Soften MemberPress course chrome when companion is present */
body.mpcs-lesson .bbkai-root,
body.mepr-guest .bbkai-root {
	margin-top: 0.5rem;
}

/* ReadyLaunch classroom: hide sidebar, full-width main */
body.mpcs-classroom #mpcs-sidebar,
body.mpcs-classroom-page #mpcs-sidebar,
.mpcs-classroom #mpcs-sidebar,
#mpcs-sidebar {
	display: none !important;
}

body.mpcs-classroom #mpcs-main,
body.mpcs-classroom-page #mpcs-main,
.mpcs-classroom #mpcs-main,
main#mpcs-main.column,
#mpcs-main {
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
	flex-basis: 100% !important;
	max-width: 100% !important;
}

/* Spectre/ReadyLaunch column utilities */
#mpcs-main.col-9,
#mpcs-main.col-md-8,
#mpcs-main.column.col-9 {
	width: 100% !important;
	max-width: 100% !important;
	flex: none !important;
}

.mpcs-classroom .columns,
.mpcs-classroom-page .columns,
body.mpcs-classroom .columns {
	display: block !important;
}

/* =========================================================
   ReadyLaunch navbar → demo-like header (Explorer vibe)
   ========================================================= */
#mpcs-navbar,
header#mpcs-navbar,
.mpcs-classroom #mpcs-navbar,
header.navbar#mpcs-navbar {
	position: sticky !important;
	top: 0 !important;
	z-index: 100 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	flex-wrap: wrap !important;
	gap: 10px !important;
	padding: 10px 22px !important;
	min-height: 64px !important;
	background: color-mix(in srgb, #ffffff 88%, transparent) !important;
	backdrop-filter: blur(12px) !important;
	-webkit-backdrop-filter: blur(12px) !important;
	border-bottom: 1px solid #e6e3f5 !important;
	box-shadow: 0 8px 24px rgba(28, 36, 82, 0.06) !important;
	color: #1c2452 !important;
	font-family: "Nunito", system-ui, sans-serif !important;
}

#mpcs-navbar .navbar-section {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	flex-wrap: wrap !important;
	margin: 0 !important;
}

#mpcs-navbar .navbar-brand,
#mpcs-navbar .site-branding,
#mpcs-navbar a.navbar-brand {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	color: #1c2452 !important;
	font-family: "Baloo 2", "Nunito", sans-serif !important;
	font-weight: 800 !important;
	font-size: 1.05rem !important;
	text-decoration: none !important;
	line-height: 1.2 !important;
}

#mpcs-navbar .navbar-brand img,
#mpcs-navbar .site-branding img,
#mpcs-navbar .img-responsive {
	height: 36px !important;
	width: auto !important;
	max-height: 36px !important;
	display: block !important;
}

#mpcs-navbar .navbar-brand span,
#mpcs-navbar .site-branding span {
	font-family: "Baloo 2", "Nunito", sans-serif !important;
	font-weight: 700 !important;
	font-size: 0.95rem !important;
	color: #68739f !important;
}

/* Back button */
#mpcs-navbar .nav-back,
#mpcs-navbar a.btn.nav-back,
#mpcs-navbar .btn.nav-back {
	width: 38px !important;
	height: 38px !important;
	min-width: 38px !important;
	padding: 0 !important;
	border-radius: 12px !important;
	border: 2px solid #e6e3f5 !important;
	background: #ffffff !important;
	color: #68739f !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: none !important;
	text-decoration: none !important;
	transition: transform 0.15s ease, border-color 0.15s ease, color 0.15s ease !important;
}

#mpcs-navbar .nav-back:hover,
#mpcs-navbar a.btn.nav-back:hover {
	border-color: #5b3df5 !important;
	color: #5b3df5 !important;
	transform: translateY(-2px) !important;
	background: #f7f6ff !important;
}

/* Prev / next + other navbar buttons */
#mpcs-navbar .btn,
#mpcs-navbar a.btn {
	font-family: "Nunito", system-ui, sans-serif !important;
	font-weight: 900 !important;
	font-size: 13px !important;
	border-radius: 12px !important;
	border: 2px solid #e6e3f5 !important;
	background: #f7f6ff !important;
	color: #3c4780 !important;
	padding: 8px 14px !important;
	box-shadow: none !important;
	text-decoration: none !important;
	transition: transform 0.15s ease, border-color 0.15s ease, color 0.15s ease, background 0.15s ease !important;
}

#mpcs-navbar .btn:hover,
#mpcs-navbar a.btn:hover {
	border-color: #5b3df5 !important;
	color: #5b3df5 !important;
	background: #ffffff !important;
	transform: translateY(-2px) !important;
}

/* Make the “next” control feel like a demo CTA */
#mpcs-navbar .btn.btn-primary,
#mpcs-navbar a.btn.btn-primary,
#mpcs-navbar .previous-next .btn:last-child,
#mpcs-navbar .mpcs-lesson-buttons .btn:last-child {
	background: linear-gradient(180deg, #ffbe3d, #ff8a2a) !important;
	border-color: transparent !important;
	color: #fff !important;
	box-shadow: 0 4px 0 #cf6a00 !important;
}

#mpcs-navbar .btn.btn-primary:hover,
#mpcs-navbar a.btn.btn-primary:hover,
#mpcs-navbar .previous-next .btn:last-child:hover,
#mpcs-navbar .mpcs-lesson-buttons .btn:last-child:hover {
	color: #fff !important;
	transform: translateY(-2px) !important;
}

/* Classroom menu links */
#mpcs-navbar .mpcs-nav-menu,
#mpcs-navbar ul.mpcs-nav-menu {
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

#mpcs-navbar .mpcs-nav-menu li {
	margin: 0 !important;
}

#mpcs-navbar .mpcs-nav-menu a {
	display: inline-flex !important;
	align-items: center !important;
	padding: 8px 12px !important;
	border-radius: 12px !important;
	font-weight: 900 !important;
	font-size: 13px !important;
	color: #68739f !important;
	text-decoration: none !important;
	transition: background 0.15s ease, color 0.15s ease !important;
}

#mpcs-navbar .mpcs-nav-menu a:hover,
#mpcs-navbar .mpcs-nav-menu .current-menu-item > a {
	background: #f7f6ff !important;
	color: #5b3df5 !important;
}

/* Soft page backdrop behind ReadyLaunch content */
body.mpcs-classroom,
body.mpcs-classroom-page,
.mpcs-classroom {
	background:
		radial-gradient(1100px 480px at 88% -80px, #efe7ff 0%, transparent 58%),
		radial-gradient(900px 420px at -8% 34%, #e0f6ff 0%, transparent 55%),
		radial-gradient(820px 500px at 62% 112%, #fff0dc 0%, transparent 55%),
		#fff9ef !important;
	font-family: "Nunito", system-ui, sans-serif !important;
	color: #1c2452 !important;
}

.bbkai-actions--center {
	justify-content: center;
	margin-top: 1.15rem;
	margin-bottom: 1.75rem;
}

.bbkai-btn--parent {
	background: linear-gradient(120deg, #ff8a2a, #ff5c7a 55%, #c44df0);
	box-shadow: 0 6px 0 #b23c0f, 0 14px 26px rgba(255, 92, 122, 0.35);
	font-size: 1.15rem;
	padding: 0.95rem 1.6rem;
	border-radius: 18px;
	text-decoration: none !important;
	color: #fff !important;
}

.bbkai-btn--parent:hover {
	transform: translateY(-3px);
	color: #fff !important;
}

.bbkai-btn--parent:active {
	transform: translateY(3px);
	box-shadow: 0 1px 0 #b23c0f;
}