/**
 * Eklavvya Lead Qualifier
 *
 * The tool pages set bare `input, select { ... }` rules, so every field style
 * here is scoped to a class to win on specificity without !important.
 */

.eklq-split {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 4px 0 4px;
	font-family: 'Nunito Sans', Helvetica, Arial, sans-serif;
	text-align: left;
}

.eklq-split__legend {
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	color: #1c2b3a;
}

.eklq-choices {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

@media (max-width: 560px) {
	.eklq-choices {
		grid-template-columns: 1fr;
	}
}

/*
 * The tool pages float their field labels with a bare
 * `label { position:absolute; top:50%; left:10px; transform:translateY(-50%);
 * pointer-events:none }` rule. These choice cards are <label> elements too, so
 * without an explicit reset they escape the form and cannot be clicked. The
 * `label.eklq-choice` compound keeps this ahead of that bare selector.
 */
.eklq-split label.eklq-choice {
	position: static;
	top: auto;
	left: auto;
	right: auto;
	bottom: auto;
	transform: none;
	pointer-events: auto;
	width: auto;
	max-width: none;
	height: auto;
	color: inherit;
	font-size: 14px;
	line-height: 1.35;
}

.eklq-choice {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 0;
	padding: 11px 12px;
	border: 1px solid #c9d3de;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.eklq-choice:hover {
	border-color: #0c71c3;
}

.eklq-choice input[type='radio'] {
	width: 16px;
	min-width: 16px;
	height: 16px;
	margin: 2px 0 0;
	padding: 0;
	accent-color: #0c71c3;
	cursor: pointer;
}

.eklq-choice:has(input:checked) {
	border-color: #0c71c3;
	background: #f2f8fd;
}

.eklq-choice__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.eklq-choice__title {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.25;
	color: #1c2b3a;
}

.eklq-choice__note {
	font-size: 12.5px;
	line-height: 1.35;
	color: #5c6b7d;
}

.eklq-org {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.eklq-org[hidden] {
	display: none;
}

.eklq-field {
	position: static;
	width: 100%;
	height: auto;
	margin: 0;
}

.eklq-split .eklq-input {
	width: 100%;
	height: 45px;
	padding: 10px;
	border: 1px solid #bbb;
	border-radius: 6px;
	font-size: 15px;
	font-family: inherit;
	color: #1c2b3a;
	background: #fff;
	box-sizing: border-box;
}

.eklq-split .eklq-input:focus-visible {
	outline: 2px solid #0c71c3;
	outline-offset: 1px;
	border-color: #0c71c3;
}

.eklq-org__hint {
	margin: 0;
	font-size: 12.5px;
	line-height: 1.4;
	color: #5c6b7d;
}

/* ---- B2B bridge block ---- */

.eklq-bridge {
	box-sizing: border-box;
	max-width: 860px;
	margin: 44px auto;
	padding: 30px 32px;
	border: 1px solid #d3dde8;
	border-left: 4px solid #0c71c3;
	border-radius: 10px;
	background: #f7fafd;
	font-family: 'Nunito Sans', Helvetica, Arial, sans-serif;
	text-align: left;
}

.eklq-bridge--result {
	margin-top: 28px;
}

.eklq-bridge__kicker {
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #0c71c3;
}

.eklq-bridge__title {
	margin: 0 0 12px;
	font-size: 26px;
	font-weight: 800;
	line-height: 1.22;
	color: #16283b;
	text-wrap: balance;
}

.eklq-bridge__body {
	margin: 0 0 20px;
	max-width: 62ch;
	font-size: 16px;
	line-height: 1.62;
	color: #33465b;
}

.eklq-bridge__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0;
}

.eklq-btn {
	display: inline-block;
	padding: 12px 22px;
	border-radius: 7px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.eklq-btn--primary {
	background: #0c71c3;
	color: #fff;
	border: 1px solid #0c71c3;
}

.eklq-btn--primary:hover {
	background: #095691;
	color: #fff;
}

.eklq-btn--ghost {
	background: transparent;
	color: #0c71c3;
	border: 1px solid #a9c4dc;
}

.eklq-btn--ghost:hover {
	background: #e8f2fb;
	color: #095691;
}

.eklq-btn:focus-visible {
	outline: 2px solid #16283b;
	outline-offset: 2px;
}

@media (max-width: 560px) {
	.eklq-bridge {
		margin: 30px 16px;
		padding: 22px 20px;
	}

	.eklq-bridge__title {
		font-size: 22px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.eklq-choice,
	.eklq-btn {
		transition: none;
	}
}

/* Marker field: submitted but never seen. Not display:none — some browsers and
   capture scripts skip fully-hidden controls; this keeps it in the layout tree. */
.eklq-marker {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}