/* Janus Diagnostic — form CSS.  Scoped under .janus-diag. */
.janus-diag {
	--jd-navy: #1F3864;
	--jd-navy-2: #2F4F8F;
	--jd-ink:  #1A1A1A;
	--jd-muted: #6b7280;
	--jd-line: #E5E7EB;
	--jd-bg-soft: #F7F9FC;
	--jd-accent: #C0392B;
	max-width: 860px;
	margin: 0 auto;
	padding: 32px 24px 80px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--jd-ink);
	line-height: 1.55;
}
.janus-diag * { box-sizing: border-box; }

.janus-diag .jd-hero { text-align: left; padding: 8px 0 24px; }
.janus-diag .jd-hero .jd-kicker { letter-spacing: .12em; text-transform: uppercase;
	color: var(--jd-muted); font-size: 13px; font-weight: 600; margin: 0 0 6px; }
.janus-diag .jd-hero h1 { color: var(--jd-navy); font-size: 36px; margin: 0 0 8px; font-weight: 700;}
.janus-diag .jd-hero .jd-lede { color: var(--jd-ink); max-width: 640px; font-size: 17px; }

.janus-diag .jd-progress { height: 6px; background: var(--jd-line); border-radius: 999px; overflow: hidden; margin: 16px 0 6px;}
.janus-diag .jd-progress-bar { height: 100%; background: var(--jd-navy); transition: width .3s ease; }
.janus-diag .jd-progress-label { color: var(--jd-muted); font-size: 13px; margin: 0 0 24px; }

.janus-diag .jd-step { background: #fff; border: 1px solid var(--jd-line); border-radius: 14px; padding: 28px 28px 24px; margin-bottom: 20px;}
.janus-diag .jd-step h2 { color: var(--jd-navy); font-size: 22px; margin: 0 0 8px; }
.janus-diag .jd-step h3.jd-pillar-heading { color: var(--jd-navy); font-size: 16px; letter-spacing:.06em; text-transform: uppercase; margin: 0 0 20px; }
.janus-diag .jd-sub { color: var(--jd-muted); margin: 0 0 18px; }

.janus-diag .jd-q { border-top: 1px solid var(--jd-line); padding: 18px 0; }
.janus-diag .jd-q:first-of-type { border-top: none; }
.janus-diag .jd-q-text { font-weight: 600; margin: 0 0 12px; font-size: 16px;}
.janus-diag .jd-opts { display: grid; gap: 8px; }
.janus-diag .jd-opt { display: flex; gap: 10px; padding: 12px 14px; border: 1px solid var(--jd-line);
	border-radius: 10px; cursor: pointer; transition: background .12s ease, border-color .12s ease; background: #fff;
	font-size: 15px;}
.janus-diag .jd-opt:hover { background: var(--jd-bg-soft); }
.janus-diag .jd-opt input { margin-top: 4px; }
.janus-diag .jd-opt.is-selected { background: #EEF3FA; border-color: var(--jd-navy-2); }

.janus-diag .jd-nav { display: flex; gap: 12px; margin-top: 22px; flex-wrap: wrap; }
.janus-diag .jd-btn { appearance: none; border: 0; padding: 12px 20px; border-radius: 10px; font-weight: 600;
	cursor: pointer; font-size: 15px; font-family: inherit;}
.janus-diag .jd-btn-primary { background: var(--jd-navy); color: #fff; }
.janus-diag .jd-btn-primary:hover { background: var(--jd-navy-2); }
.janus-diag .jd-btn-primary:disabled { opacity: .45; cursor: not-allowed; }
.janus-diag .jd-btn-ghost { background: transparent; color: var(--jd-navy); border: 1px solid var(--jd-line); }
.janus-diag .jd-btn-ghost:hover { background: var(--jd-bg-soft); }

.janus-diag .jd-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; margin-bottom: 14px;}
.janus-diag .jd-grid label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--jd-muted); font-weight: 600;}
.janus-diag .jd-grid input, .janus-diag .jd-grid select {
	padding: 10px 12px; border: 1px solid var(--jd-line); border-radius: 8px; font-size: 15px; color: var(--jd-ink); background: #fff;
	font-family: inherit;}
.janus-diag .jd-grid input:focus, .janus-diag .jd-grid select:focus { outline: 2px solid var(--jd-navy-2); outline-offset: 1px;}
.janus-diag .jd-span-2 { grid-column: 1 / -1; }
.janus-diag .req { color: var(--jd-accent); }
.janus-diag .jd-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; margin: 8px 0 4px; color: var(--jd-ink);}
.janus-diag .jd-err { background: #FDECEA; color: #8B1E13; padding: 10px 12px; border-radius: 8px; margin-top: 14px; font-size: 14px;}

.janus-diag .jd-spinner { width: 42px; height: 42px; border: 4px solid var(--jd-line); border-top-color: var(--jd-navy);
	border-radius: 50%; animation: jd-spin 0.9s linear infinite; margin: 18px auto; }
@keyframes jd-spin { to { transform: rotate(360deg); } }

.janus-diag-msg { max-width: 680px; margin: 80px auto; padding: 40px; background: #F7F9FC; color: #1A1A1A;
	border-radius: 14px; text-align: center; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;}

@media (max-width: 640px) {
	.janus-diag { padding: 20px 14px 60px; }
	.janus-diag .jd-hero h1 { font-size: 28px; }
	.janus-diag .jd-grid { grid-template-columns: 1fr; }
	.janus-diag .jd-step { padding: 22px 18px; }
}