.bm-check { width: 100%; max-width: 620px; margin: 30px 0 0; }
.bm-check *, .bm-check *::before, .bm-check *::after { box-sizing: border-box; }
.bm-check__sr {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.bm-check__field {
	display: flex; align-items: center; gap: 10px;
	padding: 8px 8px 8px 20px;
	background-color: rgba(255,255,255,0.05);
	border: 1px solid rgba(255,255,255,0.10);
	border-radius: 999px;
	box-shadow: 0 8px 32px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.06);
	transition: border-color .3s ease, box-shadow .3s ease;
}
.bm-check__field:focus-within {
	border-color: rgba(255,255,255,0.30);
	box-shadow: 0 8px 32px rgba(0,0,0,0.50), inset 0 1px 0 rgba(255,255,255,0.08), 0 0 0 3px rgba(255,255,255,0.06);
}
.bm-check__field.is-invalid { border-color: rgba(224,122,122,0.55); }
.bm-check__prefix { flex: 0 0 auto; color: #6E727C; font-size: 15px; font-weight: 500; }

/* The theme styles bare inputs (1px #666 border, 3px radius, 8px/16px
   padding); these have to be overridden explicitly to sit in the pill. */
.bm-check .bm-check__input {
	flex: 1 1 auto; min-width: 0; width: 100%; height: auto;
	margin: 0;
	padding: 14px 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	outline: 0;
	background: none !important;
	background-color: transparent !important;
	box-shadow: none !important;
	color: #FFFFFF !important;
	font-family: inherit; font-size: 15px; font-weight: 500; line-height: 1.2;
	-webkit-appearance: none; appearance: none;
}
.bm-check .bm-check__input:focus {
	border: 0 !important;
	box-shadow: none !important;
	background-color: transparent !important;
	color: #FFFFFF !important;
}
.bm-check .bm-check__input::placeholder { color: #6E727C; opacity: 1; }

.bm-check__btn {
	flex: 0 0 auto;
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	height: 48px; padding: 0 26px;
	border: 0; border-radius: 999px;
	background-color: #FFFFFF; color: #09090B;
	font-family: inherit; font-size: 14px; font-weight: 700; line-height: 1;
	white-space: nowrap; cursor: pointer;
	transition: color .28s ease, transform .28s ease, box-shadow .28s ease, background-color .28s ease;
}
.bm-check__btn:hover, .bm-check__btn:focus-visible {
	background-color: #6E727C;
	color: #FFFFFF;
	transform: translateY(-2px);
	box-shadow: 0 0 5px rgba(255,255,255,.50), 0 0 18px rgba(255,255,255,.30), 0 0 42px rgba(255,255,255,.16);
}
.bm-check__btn:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 4px; }
/* The theme leaves bare buttons inheriting a pink (#CC3366) link colour, so
   every state is pinned explicitly rather than relying on the base rule. */
.bm-check__btn,
.bm-check__btn:link,
.bm-check__btn:visited,
.bm-check__btn:active,
.bm-check__btn[disabled] {
	background-color: #FFFFFF;
	color: #09090B;
}
.bm-check__btn:hover,
.bm-check__btn:focus,
.bm-check__btn:focus-visible,
.bm-check__btn:hover:active {
	background-color: #6E727C;
	color: #FFFFFF;
}
.bm-check__btn[disabled] { opacity: .6; cursor: default; transform: none; box-shadow: none; }
.bm-check__btn svg { display: block; width: 14px; height: 14px; transition: transform .28s ease; }
.bm-check__btn:hover svg, .bm-check__btn:focus-visible svg { transform: translateX(4px); }
.bm-check__note {
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px;
	margin: 14px 0 0; color: #6E727C; font-size: 13px; font-weight: 500; line-height: 1.4;
}
.bm-check__tick { color: #FFFFFF; margin-right: 5px; }
.bm-check__alt {
	color: #FFFFFF; text-decoration: none;
	border-bottom: 1px solid rgba(255,255,255,0.28); padding-bottom: 1px;
	transition: border-color .25s ease;
}
.bm-check__alt:hover, .bm-check__alt:focus-visible { border-bottom-color: #FFFFFF; }
.bm-check__err { display: none; margin: 10px 0 0; color: #E07A7A; font-size: 13px; font-weight: 500; }
.bm-check__err.is-shown { display: block; }

/* ---------- results modal ---------- */
.bm-modal { position: fixed; inset: 0; z-index: 99999; display: none; }
.bm-modal.is-open { display: block; }
.bm-modal__backdrop { position: absolute; inset: 0; background-color: rgba(0,0,0,.72); }
.bm-modal__dialog {
	position: relative; z-index: 1;
	width: calc(100% - 32px); max-width: 620px; max-height: calc(100vh - 170px);
	margin: 120px auto 32px; overflow-y: auto;
	padding: 32px 32px 28px;
	background-color: rgba(9,9,11,.98);
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 22px;
	box-shadow: 0 30px 70px rgba(0,0,0,.65);
	font-family: "Space Grotesk", sans-serif;
}
.bm-modal__close {
	position: absolute; top: 16px; right: 16px;
	width: 34px; height: 34px; padding: 0;
	background-color: rgba(255,255,255,.05); color: #FFFFFF;
	border: 1px solid rgba(255,255,255,.12); border-radius: 50%;
	font-size: 17px; line-height: 1; cursor: pointer;
	transition: background-color .25s ease;
}
.bm-modal__close,
.bm-modal__close:link,
.bm-modal__close:visited,
.bm-modal__close:active { background-color: rgba(255,255,255,.05); color: #FFFFFF; }
.bm-modal__close:hover,
.bm-modal__close:focus,
.bm-modal__close:focus-visible { background-color: #6E727C; color: #FFFFFF; border-color: #6E727C; }
.bm-modal__eyebrow {
	margin: 0 0 10px; color: #6E727C;
	font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
}
.bm-modal__title { margin: 0 0 6px; color: #FFFFFF; font-size: 23px; font-weight: 500; line-height: 1.25; }
.bm-modal__sub { margin: 0 0 22px; color: #6E727C; font-size: 13.5px; line-height: 1.6; word-break: break-word; }
.bm-modal__rows { margin: 0 0 22px; }
.bm-scores { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 0 0 22px; }
.bm-score {
	padding: 14px 10px; text-align: center;
	background-color: rgba(255,255,255,.04);
	border: 1px solid rgba(255,255,255,.10);
	border-radius: 14px;
}
.bm-score__num { display: block; font-size: 26px; font-weight: 600; line-height: 1.1; }
.bm-score__num--good { color: #6FD68C; }
.bm-score__num--ok   { color: #E6C173; }
.bm-score__num--poor { color: #E98B8B; }
.bm-score__label { display: block; margin-top: 5px; color: #6E727C; font-size: 11px; font-weight: 600; letter-spacing: .04em; }
.bm-modal__section {
	margin: 0 0 10px; color: #6E727C;
	font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
}
.bm-modal__stage { margin: 14px 0 0; color: #6E727C; font-size: 13px; text-align: center; }
@media (max-width: 600px) {
	.bm-scores { grid-template-columns: repeat(2, 1fr); }
	.bm-score__num { font-size: 23px; }
}
.bm-row {
	display: flex; align-items: flex-start; gap: 12px;
	padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.07);
}
.bm-row:last-child { border-bottom: 0; }
.bm-row__mark {
	flex: 0 0 auto; width: 20px; height: 20px; margin-top: 1px;
	display: grid; place-items: center;
	border-radius: 50%; font-size: 11px; font-weight: 700; line-height: 1;
}
.bm-row__mark--pass { background-color: rgba(90,200,120,.16); color: #6FD68C; }
.bm-row__mark--warn { background-color: rgba(224,186,106,.16); color: #E6C173; }
.bm-row__mark--fail { background-color: rgba(224,122,122,.16); color: #E98B8B; }
.bm-row__mark--info { background-color: rgba(255,255,255,.08); color: #9AA0AA; }
.bm-row__text { flex: 1 1 auto; min-width: 0; }
.bm-row__label { display: block; color: #FFFFFF; font-size: 14.5px; font-weight: 600; line-height: 1.3; }
.bm-row__detail { display: block; margin-top: 3px; color: #6E727C; font-size: 13px; line-height: 1.5; }
.bm-modal__cta {
	padding: 20px; border-radius: 16px;
	background-color: rgba(110,114,124,.09); border: 1px solid rgba(110,114,124,.24);
}
.bm-modal__cta p { margin: 0 0 14px; color: #FFFFFF; font-size: 14.5px; line-height: 1.65; }
.bm-modal__cta a {
	display: inline-flex; align-items: center; height: 44px; padding: 0 24px;
	background-color: #FFFFFF; color: #09090B; border-radius: 999px;
	font-size: 13.5px; font-weight: 700; text-decoration: none;
	transition: color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.bm-modal__cta a,
.bm-modal__cta a:link,
.bm-modal__cta a:visited { background-color: #FFFFFF; color: #09090B; }
.bm-modal__cta a:hover,
.bm-modal__cta a:focus,
.bm-modal__cta a:active { background-color: #6E727C; color: #FFFFFF; }
.".bm-modal__cta a:hover { transform: translateY(-2px); box-shadow: 0 0 18px rgba(255,255,255,.3); }
".bm-modal__foot { margin: 16px 0 0; color: #55585F; font-size: 12px; line-height: 1.55; }
.bm-modal__spinner {
	width: 26px; height: 26px; margin: 26px auto;
	border: 2px solid rgba(255,255,255,.16); border-top-color: #FFFFFF;
	border-radius: 50%; animation: bm-spin .8s linear infinite;
}
@keyframes bm-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .bm-modal__spinner { animation-duration: 2.4s; } }

@media (max-width: 767px) {
	.bm-check { max-width: 100%; margin-top: 26px; }
	.bm-check__field { flex-wrap: wrap; gap: 12px; padding: 16px; border-radius: 22px; }
	.bm-check__prefix { font-size: 14px; }
	.bm-check .bm-check__input { flex: 1 1 0; width: auto; padding: 0 !important; font-size: 16px; }
	.bm-check__btn { flex: 1 0 100%; height: 50px; }
	.bm-check__note { font-size: 12.5px; gap: 6px 12px; }
	.bm-modal__dialog { padding: 26px 20px 22px; margin: 92px auto 16px; max-height: calc(100vh - 118px); }
	.bm-modal__title { font-size: 20px; }
}
