/* ==========================================================================
   CMI Flight Risk Calculator v2
   All styles scoped to .cmifr-wrap. No external dependencies.

   Page-level styles (cmifr-page, cmifr-site-header, cmifr-site-footer,
   cmifr-page-main) are intentionally minimal — override in your theme.
   ========================================================================== */

/* ---------------------------------------------------------------------------
   Page layout (template: page-flight-risk.php)
   --------------------------------------------------------------------------- */

body.cmifr-page {
	margin: 0;
	padding: 0;
	background: #fff;
}

.cmifr-page-main {
	min-height: 60vh;
}

/* Site header */
.cmifr-site-header {
	border-bottom: 1px solid #E8E8E8;
	background: #fff;
}

.cmifr-site-header__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 1200px;
	margin: 0 auto;
	padding: 16px 24px;
	gap: 16px;
}

.cmifr-site-logo {
	display: flex;
	align-items: center;
	text-decoration: none;
	color: inherit;
	font-weight: 700;
	font-size: 1.1rem;
}

.cmifr-site-logo img {
	max-height: 48px;
	width: auto;
}

.cmifr-site-header__util {
	display: flex;
	align-items: center;
	gap: 20px;
	font-size: 0.875rem;
}

.cmifr-site-header__util a {
	color: #333;
	text-decoration: none;
}

.cmifr-site-header__util a:hover {
	text-decoration: underline;
}

/* Site footer */
.cmifr-site-footer {
	border-top: 1px solid #E8E8E8;
	background: #FAFAFA;
	margin-top: 48px;
}

.cmifr-site-footer__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 24px;
	font-size: 0.8125rem;
	color: #757575;
}

.cmifr-site-footer__copy {
	margin: 0;
}

.cmifr-site-footer__copy a {
	color: inherit;
	text-decoration: none;
}

.cmifr-site-footer__legal {
	display: flex;
	gap: 16px;
}

.cmifr-site-footer__legal a {
	color: #757575;
	text-decoration: none;
}

.cmifr-site-footer__legal a:hover {
	text-decoration: underline;
}

@media (max-width: 520px) {
	.cmifr-site-header__inner,
	.cmifr-site-footer__inner {
		flex-direction: column;
		align-items: center;
	}
}

@media print {
	.cmifr-site-header,
	.cmifr-site-footer {
		display: none;
	}
}

.cmifr-wrap {
	--cmifr-orange:      #F7931E;
	--cmifr-orange-dk:   #D4780A;
	--cmifr-gray-050:    #FAFAFA;
	--cmifr-gray-100:    #F5F5F5;
	--cmifr-gray-200:    #E8E8E8;
	--cmifr-gray-400:    #BDBDBD;
	--cmifr-gray-600:    #757575;
	--cmifr-gray-800:    #333333;
	--cmifr-white:       #FFFFFF;
	--cmifr-blue-lt:     #EFF6FF;
	--cmifr-radius:      6px;
	--cmifr-radius-lg:   12px;
	--cmifr-shadow:      0 2px 12px rgba(0,0,0,0.08);
	--cmifr-shadow-lg:   0 4px 24px rgba(0,0,0,0.12);

	max-width: 720px;
	margin: 0 auto;
	padding: 0 16px 48px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
	             "Helvetica Neue", Arial, sans-serif;
	color: var(--cmifr-gray-800);
	box-sizing: border-box;
}

.cmifr-wrap *,
.cmifr-wrap *::before,
.cmifr-wrap *::after {
	box-sizing: inherit;
}

.cmifr-noscript {
	padding: 16px;
	background: #FFF3CD;
	border: 1px solid #FFEAA7;
	border-radius: var(--cmifr-radius);
	font-size: 0.9rem;
}

/* ---------------------------------------------------------------------------
   Screen visibility
   --------------------------------------------------------------------------- */

.cmifr-screen {
	animation: cmifr-fadein 0.3s ease;
}

.cmifr-screen[hidden] {
	display: none !important;
}

@keyframes cmifr-fadein {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ---------------------------------------------------------------------------
   Header / Global
   --------------------------------------------------------------------------- */

.cmifr-header {
	margin-bottom: 32px;
}

.cmifr-title {
	font-size: clamp(1.4rem, 4vw, 1.9rem);
	font-weight: 800;
	margin: 0 0 10px;
	line-height: 1.2;
}

.cmifr-subtitle {
	font-size: 1rem;
	color: var(--cmifr-gray-600);
	line-height: 1.6;
	margin: 0 0 8px;
}

.cmifr-subtitle:last-child {
	margin-bottom: 0;
}

.cmifr-choose-label {
	font-size: 0.85rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--cmifr-gray-600);
	margin: 0 0 14px;
}

/* ---------------------------------------------------------------------------
   Landing: Instrument Cards
   --------------------------------------------------------------------------- */

.cmifr-instrument-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-bottom: 32px;
}

.cmifr-instrument-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
	padding: 24px;
	background: var(--cmifr-white);
	border: 2px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
	cursor: pointer;
	transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
	gap: 6px;
}

.cmifr-instrument-card:hover {
	border-color: var(--cmifr-gray-400);
	box-shadow: var(--cmifr-shadow);
}

.cmifr-instrument-card--selected {
	border-color: var(--cmifr-orange);
	background: #FFF8F0;
	box-shadow: var(--cmifr-shadow);
}

.cmifr-card-icon {
	font-size: 1.4rem;
	color: var(--cmifr-orange);
	margin-bottom: 4px;
}

.cmifr-instrument-card--selected .cmifr-card-icon {
	color: var(--cmifr-orange-dk);
}

.cmifr-card-label {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--cmifr-gray-800);
	line-height: 1.3;
}

.cmifr-card-for {
	font-size: 0.78rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--cmifr-orange);
}

.cmifr-card-desc {
	font-size: 0.88rem;
	color: var(--cmifr-gray-600);
	line-height: 1.5;
	margin-top: 4px;
}

/* ---------------------------------------------------------------------------
   Landing: How it works / notes sections
   --------------------------------------------------------------------------- */

.cmifr-landing-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-bottom: 24px;
}

.cmifr-landing-card {
	background: var(--cmifr-gray-50);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius);
	padding: 18px 20px;
}

.cmifr-landing-section-title {
	font-size: 0.95rem;
	font-weight: 700;
	margin: 0 0 10px;
	color: var(--cmifr-gray-900);
}

.cmifr-landing-list {
	margin: 0;
	padding-left: 18px;
	list-style: disc;
}

.cmifr-landing-list li {
	margin-bottom: 8px;
	font-size: 0.88rem;
	line-height: 1.6;
	color: var(--cmifr-gray-800);
}

.cmifr-landing-list li:last-child {
	margin-bottom: 0;
}

/* ---------------------------------------------------------------------------
   Landing: Email section
   --------------------------------------------------------------------------- */

.cmifr-email-section {
	margin-bottom: 28px;
}

.cmifr-email-label {
	display: block;
	font-size: 0.9rem;
	font-weight: 600;
	margin-bottom: 6px;
}

.cmifr-optional {
	font-weight: 400;
	color: var(--cmifr-gray-600);
}

.cmifr-email-input {
	width: 100%;
	max-width: 380px;
	display: block;
	padding: 11px 14px;
	font-size: 0.95rem;
	border: 1.5px solid var(--cmifr-gray-400);
	border-radius: var(--cmifr-radius);
	transition: border-color 0.15s;
	margin-bottom: 8px;
}

.cmifr-email-input:focus {
	outline: none;
	border-color: var(--cmifr-orange);
	box-shadow: 0 0 0 3px rgba(247,147,30,0.15);
}

.cmifr-email-help {
	font-size: 0.82rem;
	color: var(--cmifr-gray-600);
	margin: 0;
	line-height: 1.5;
}

.cmifr-landing-footer {
	display: flex;
	align-items: center;
	gap: 14px;
}

/* ---------------------------------------------------------------------------
   Instrument header (inside CHC / FR screens)
   --------------------------------------------------------------------------- */

.cmifr-instrument-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 24px;
	flex-wrap: wrap;
}

.cmifr-instrument-badge {
	display: inline-block;
	padding: 4px 14px;
	background: var(--cmifr-gray-100);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: 100px;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--cmifr-gray-800);
}

.cmifr-instrument-badge--fr {
	background: #FFF3E0;
	border-color: #FFB74D;
	color: #E65100;
}

/* ---------------------------------------------------------------------------
   Progress bar
   --------------------------------------------------------------------------- */

.cmifr-progress-wrap {
	margin-bottom: 28px;
}

.cmifr-progress-bar {
	height: 5px;
	background: var(--cmifr-gray-200);
	border-radius: 100px;
	overflow: hidden;
	margin-bottom: 6px;
}

.cmifr-progress-fill {
	height: 100%;
	background: var(--cmifr-orange);
	border-radius: 100px;
	transition: width 0.35s ease;
}

.cmifr-progress-label {
	font-size: 0.8rem;
	color: var(--cmifr-gray-600);
	margin: 0;
}

/* ---------------------------------------------------------------------------
   FR Employee context
   --------------------------------------------------------------------------- */

.cmifr-fr-eval-context {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	padding: 10px 14px;
	background: var(--cmifr-gray-100);
	border-radius: var(--cmifr-radius);
}

.cmifr-eval-for-label {
	font-size: 0.8rem;
	color: var(--cmifr-gray-600);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.cmifr-eval-for-name {
	font-size: 0.92rem;
	font-weight: 700;
	color: var(--cmifr-gray-800);
}

.cmifr-eval-for-name--lg {
	font-size: 1.1rem;
}

/* ---------------------------------------------------------------------------
   FR Name entry
   --------------------------------------------------------------------------- */

.cmifr-name-prompt {
	background: var(--cmifr-white);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
	padding: 28px;
	margin-bottom: 8px;
}

.cmifr-name-prompt-title {
	font-size: 1.15rem;
	font-weight: 700;
	margin: 0 0 8px;
}

.cmifr-name-prompt-desc {
	font-size: 0.9rem;
	color: var(--cmifr-gray-600);
	margin: 0 0 20px;
	line-height: 1.5;
}

.cmifr-name-input-wrap {
	margin-bottom: 20px;
}

.cmifr-label {
	display: block;
	font-size: 0.88rem;
	font-weight: 600;
	margin-bottom: 6px;
}

.cmifr-text-input {
	width: 100%;
	max-width: 360px;
	display: block;
	padding: 11px 14px;
	font-size: 0.95rem;
	border: 1.5px solid var(--cmifr-gray-400);
	border-radius: var(--cmifr-radius);
	transition: border-color 0.15s;
}

.cmifr-text-input:focus {
	outline: none;
	border-color: var(--cmifr-orange);
	box-shadow: 0 0 0 3px rgba(247,147,30,0.15);
}

/* ---------------------------------------------------------------------------
   Form questions
   --------------------------------------------------------------------------- */

.cmifr-form {
	margin: 0;
}

.cmifr-step {
	display: none;
	border: none;
	padding: 0;
	margin: 0;
}

.cmifr-step--active {
	display: block;
}

.cmifr-question {
	font-size: clamp(1rem, 3vw, 1.12rem);
	font-weight: 600;
	line-height: 1.45;
	margin-bottom: 8px;
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.cmifr-question-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	height: 28px;
	background: var(--cmifr-orange);
	color: var(--cmifr-white);
	font-size: 0.78rem;
	font-weight: 700;
	border-radius: 50%;
	flex-shrink: 0;
	margin-top: 1px;
}

.cmifr-step--context .cmifr-question-num {
	background: var(--cmifr-gray-400);
}

.cmifr-context-note {
	font-size: 0.82rem;
	color: var(--cmifr-gray-600);
	font-style: italic;
	margin: 0 0 16px 40px;
}

/* ---------------------------------------------------------------------------
   Radio options
   --------------------------------------------------------------------------- */

.cmifr-options {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 14px 0 24px;
}

.cmifr-option {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 13px 16px;
	background: var(--cmifr-gray-100);
	border: 2px solid transparent;
	border-radius: var(--cmifr-radius);
	cursor: pointer;
	transition: border-color 0.12s, background 0.12s, box-shadow 0.12s;
	line-height: 1.4;
}

.cmifr-option:hover {
	border-color: var(--cmifr-gray-400);
	background: var(--cmifr-white);
}

.cmifr-option input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}

.cmifr-option-label {
	position: relative;
	padding-left: 28px;
	font-size: 0.93rem;
	color: var(--cmifr-gray-800);
}

.cmifr-option-label::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 18px;
	height: 18px;
	border: 2px solid var(--cmifr-gray-400);
	border-radius: 50%;
	background: var(--cmifr-white);
	transition: border-color 0.12s;
}

.cmifr-option-label::after {
	content: '';
	position: absolute;
	left: 4px;
	top: 50%;
	transform: translateY(-50%) scale(0);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--cmifr-orange);
	transition: transform 0.12s ease;
}

.cmifr-option input[type="radio"]:checked + .cmifr-option-label::before {
	border-color: var(--cmifr-orange);
}

.cmifr-option input[type="radio"]:checked + .cmifr-option-label::after {
	transform: translateY(-50%) scale(1);
}

.cmifr-option:has(input[type="radio"]:checked) {
	border-color: var(--cmifr-orange);
	background: var(--cmifr-white);
	box-shadow: var(--cmifr-shadow);
}

/* ---------------------------------------------------------------------------
   Buttons
   --------------------------------------------------------------------------- */

.cmifr-step-nav {
	display: flex;
	gap: 10px;
	align-items: center;
}

.cmifr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 22px;
	font-size: 0.93rem;
	font-weight: 600;
	border-radius: var(--cmifr-radius);
	cursor: pointer;
	border: 2px solid transparent;
	transition: background 0.14s, color 0.14s, border-color 0.14s, opacity 0.14s;
	text-decoration: none;
	white-space: nowrap;
}

.cmifr-btn[hidden] {
	display: none !important;
}

.cmifr-btn--large {
	padding: 14px 28px;
	font-size: 1rem;
}

.cmifr-btn--primary {
	background: var(--cmifr-orange);
	color: var(--cmifr-white);
}

.cmifr-btn--primary:hover {
	background: var(--cmifr-orange-dk);
}

.cmifr-btn--primary:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

/* --next and --calculate styled as primary */
.cmifr-btn--next,
.cmifr-btn--calculate {
	background: var(--cmifr-orange);
	color: var(--cmifr-white);
}

.cmifr-btn--next:hover,
.cmifr-btn--calculate:hover {
	background: var(--cmifr-orange-dk);
}

.cmifr-btn--next:disabled,
.cmifr-btn--calculate:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

.cmifr-btn--secondary {
	background: var(--cmifr-gray-800);
	color: var(--cmifr-white);
}

.cmifr-btn--secondary:hover {
	background: #111;
}

.cmifr-btn--outline {
	background: transparent;
	border-color: var(--cmifr-gray-400);
	color: var(--cmifr-gray-800);
}

.cmifr-btn--outline:hover {
	border-color: var(--cmifr-gray-800);
}

.cmifr-btn--back,
.cmifr-btn--ghost {
	background: transparent;
	color: var(--cmifr-gray-600);
	border-color: var(--cmifr-gray-200);
}

.cmifr-btn--back:hover,
.cmifr-btn--ghost:hover {
	border-color: var(--cmifr-gray-400);
	color: var(--cmifr-gray-800);
}

.cmifr-link-btn {
	background: none;
	border: none;
	padding: 0;
	color: var(--cmifr-orange);
	font-size: inherit;
	cursor: pointer;
	text-decoration: underline;
	font-weight: 600;
}

.cmifr-link-btn:hover {
	color: var(--cmifr-orange-dk);
}

/* ---------------------------------------------------------------------------
   Results: Score panel
   --------------------------------------------------------------------------- */

.cmifr-results-panel {
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin-bottom: 28px;
}

.cmifr-score-panel {
	padding: 28px;
	background: var(--cmifr-gray-100);
	border-radius: var(--cmifr-radius-lg);
}

.cmifr-score-label-wrap {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 16px;
	flex-wrap: wrap;
}

.cmifr-score-display-inline {
	display: flex;
	align-items: baseline;
	gap: 2px;
}

.cmifr-score-number {
	font-size: clamp(2.4rem, 8vw, 3.2rem);
	font-weight: 800;
	color: var(--cmifr-gray-800);
	line-height: 1;
}

.cmifr-score-denom {
	font-size: 1rem;
	color: var(--cmifr-gray-600);
}

.cmifr-tier-badge {
	display: inline-block;
	padding: 5px 16px;
	border-radius: 100px;
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* Score bar */
.cmifr-score-bar-wrap {
	margin-bottom: 14px;
}

.cmifr-score-bar-track {
	height: 10px;
	background: var(--cmifr-gray-200);
	border-radius: 100px;
	overflow: hidden;
	margin-bottom: 6px;
}

.cmifr-score-bar-fill {
	height: 100%;
	border-radius: 100px;
	transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.cmifr-score-bar-labels {
	display: flex;
	justify-content: space-between;
	font-size: 0.72rem;
	color: var(--cmifr-gray-600);
}

.cmifr-result-summary {
	font-size: 0.95rem;
	line-height: 1.65;
	color: var(--cmifr-gray-800);
	margin: 0;
}

.cmifr-criticality-note {
	font-size: 0.82rem;
	color: var(--cmifr-gray-600);
	font-style: italic;
	margin: 10px 0 0;
}

/* ---------------------------------------------------------------------------
   Results: CHC Insights
   --------------------------------------------------------------------------- */

.cmifr-insights-panel {
	padding: 24px;
	background: var(--cmifr-white);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
}

.cmifr-insights-title {
	font-size: 0.95rem;
	font-weight: 700;
	margin: 0 0 14px;
}

.cmifr-insights-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.cmifr-insights-list li {
	position: relative;
	padding-left: 20px;
	font-size: 0.9rem;
	line-height: 1.6;
}

.cmifr-insights-list li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 8px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--cmifr-orange);
}

.cmifr-cta-panel {
	padding: 16px 20px;
	background: var(--cmifr-blue-lt);
	border-left: 4px solid #3B82F6;
	border-radius: 0 var(--cmifr-radius) var(--cmifr-radius) 0;
	font-size: 0.9rem;
	line-height: 1.65;
	color: var(--cmifr-gray-800);
}

/* ---------------------------------------------------------------------------
   Results: FR Profile bars
   --------------------------------------------------------------------------- */

.cmifr-profiles-panel {
	padding: 24px;
	background: var(--cmifr-white);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
}

.cmifr-profiles-title {
	font-size: 0.95rem;
	font-weight: 700;
	margin: 0 0 18px;
}

.cmifr-profile-bars {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.cmifr-profile-bar-row {
	display: grid;
	grid-template-columns: 1fr 1fr 100px;
	align-items: center;
	gap: 12px;
}

.cmifr-profile-bar-label {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.cmifr-profile-name {
	font-size: 0.88rem;
	font-weight: 600;
}

.cmifr-profile-score-text {
	font-size: 0.78rem;
	color: var(--cmifr-gray-600);
}

.cmifr-profile-bar-track {
	height: 8px;
	background: var(--cmifr-gray-200);
	border-radius: 100px;
	overflow: hidden;
}

.cmifr-profile-bar-fill {
	height: 100%;
	border-radius: 100px;
	transition: width 0.7s cubic-bezier(0.4, 0, 0.2, 1);
	background: var(--cmifr-gray-400);
}

.cmifr-profile-level-badge {
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 3px 10px;
	border-radius: 100px;
	color: var(--cmifr-white);
	background: var(--cmifr-gray-400);
	white-space: nowrap;
	width: 100px;
	text-align: center;
	box-sizing: border-box;
}

/* ---------------------------------------------------------------------------
   Results: Intervention matrix (3×3 grid)
   --------------------------------------------------------------------------- */

/* Action box ---------------------------------------------------------------- */

.cmifr-action-box {
	padding: 18px 20px;
	background: #FFF8E1;
	border: 1px solid #FFD54F;
	border-left: 4px solid #F9A825;
	border-radius: var(--cmifr-radius-md);
	font-size: 0.97rem;
	line-height: 1.6;
	color: var(--cmifr-gray-800);
}

.cmifr-results-box-title {
	font-size: 0.95rem;
	font-weight: 700;
	margin: 0 0 12px;
}

/* Matrix -------------------------------------------------------------------- */

.cmifr-matrix-panel {
	padding: 24px;
	background: var(--cmifr-white);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
}

.cmifr-matrix-title {
	font-size: 0.95rem;
	font-weight: 700;
	margin: 0 0 16px;
}

.cmifr-shared-answers-panel {
	padding: 24px;
	background: var(--cmifr-white);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
}

.cmifr-shared-answers-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.cmifr-shared-answer-item {
	padding: 14px 16px;
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius);
	background: var(--cmifr-gray-100);
}

.cmifr-shared-answer-question {
	font-size: 0.86rem;
	font-weight: 700;
	color: var(--cmifr-gray-900);
	margin-bottom: 6px;
}

.cmifr-shared-answer-value {
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--cmifr-gray-700);
}

/* The grid: 4 columns — row-header + 3 profile columns.
   gap + grid background-color creates the visual "borders". */
.cmifr-matrix-grid {
	display: grid;
	grid-template-columns: 90px repeat(3, 1fr);
	gap: 1px;
	background-color: var(--cmifr-gray-200);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius);
	overflow: hidden;
	font-size: 0.82rem;
}

/* All grid children get a solid background so the gap shows as lines */
.cmifr-matrix-corner,
.cmifr-matrix-col-header,
.cmifr-matrix-row-header,
.cmifr-matrix-cell {
	background-color: var(--cmifr-white);
}

/* Top-left blank corner */
.cmifr-matrix-corner {
	background-color: var(--cmifr-gray-100);
}

/* Column headers */
.cmifr-matrix-col-header {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px 12px;
	background-color: var(--cmifr-gray-100);
	text-align: center;
}

.cmifr-matrix-col-header--active--high {
	background-color: #FFEBEE;
	border-bottom: 3px solid #C62828;
}
.cmifr-matrix-col-header--active--moderate {
	background-color: #FFF3E0;
	border-bottom: 3px solid var(--cmifr-orange);
}
.cmifr-matrix-col-header--active--low {
	background-color: #E8F5E9;
	border-bottom: 3px solid #388E3C;
}

.cmifr-matrix-col-name {
	font-weight: 700;
	color: var(--cmifr-gray-800);
	font-size: 0.82rem;
}

/* Row headers */
.cmifr-matrix-row-header {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 12px 8px;
	background-color: var(--cmifr-gray-050);
	border-left: 3px solid transparent;
	font-weight: 700;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--cmifr-gray-600);
	text-align: center;
}
.cmifr-matrix-row-header--active--high     { border-left-color: #C62828; color: #B71C1C; }
.cmifr-matrix-row-header--active--moderate { border-left-color: var(--cmifr-orange); color: var(--cmifr-orange); }
.cmifr-matrix-row-header--active--low      { border-left-color: #388E3C; color: #2E7D32; }

/* Data cells */
.cmifr-matrix-cell {
	padding: 12px;
	background-color: var(--cmifr-white);
}
.cmifr-matrix-cell .cmifr-matrix-cell-text {
	color: var(--cmifr-gray-400);
}
.cmifr-matrix-grid--focus-highlight .cmifr-matrix-cell:not(.cmifr-matrix-cell--active) .cmifr-matrix-cell-text {
	filter: blur(2.4px);
	opacity: 0.72;
}
.cmifr-matrix-cell--active .cmifr-matrix-cell-text {
	color: var(--cmifr-gray-800);
}

/* Active / highlighted cell — base structural styles */
.cmifr-matrix-cell--active {
	outline-offset: -2px;
}

/* Level-specific colors */
.cmifr-matrix-cell--active--high {
	background-color: #FFEBEE;
	outline: 2px solid #C62828;
}
.cmifr-matrix-cell--active--moderate {
	background-color: #FFF8F0;
	outline: 2px solid var(--cmifr-orange);
}
.cmifr-matrix-cell--active--low {
	background-color: #E8F5E9;
	outline: 2px solid #388E3C;
}

.cmifr-matrix-cell-text {
	margin: 0;
	line-height: 1.55;
	color: var(--cmifr-gray-800);
}

.cmifr-matrix-active-badge {
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 6px;
}
.cmifr-matrix-active-badge--high     { color: #B71C1C; }
.cmifr-matrix-active-badge--moderate { color: var(--cmifr-orange); }
.cmifr-matrix-active-badge--low      { color: #2E7D32; }

/* Mobile: show only active cell + a stacked list */
@media (max-width: 640px) {
	.cmifr-matrix-grid {
		grid-template-columns: 1fr;
		gap: 8px;
		background-color: transparent;
		border: none;
	}

	.cmifr-matrix-corner,
	.cmifr-matrix-col-header,
	.cmifr-matrix-row-header {
		display: none;
	}

	.cmifr-matrix-cell {
		border: 1px solid var(--cmifr-gray-200);
		border-radius: var(--cmifr-radius);
	}

	.cmifr-matrix-cell--active {
		outline-offset: -2px;
		order: -1;
	}
	.cmifr-matrix-cell--active--high     { outline: 2px solid #C62828; }
	.cmifr-matrix-cell--active--moderate { outline: 2px solid var(--cmifr-orange); }
	.cmifr-matrix-cell--active--low      { outline: 2px solid #388E3C; }
	.cmifr-matrix-grid--focus-highlight .cmifr-matrix-cell:not(.cmifr-matrix-cell--active) .cmifr-matrix-cell-text {
		filter: none;
		opacity: 1;
	}
}

/* ---------------------------------------------------------------------------
   FR Results: eval header
   --------------------------------------------------------------------------- */

.cmifr-eval-results-header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--cmifr-gray-200);
}

/* ---------------------------------------------------------------------------
   FR Summary screen
   --------------------------------------------------------------------------- */

.cmifr-summary-header {
	margin-bottom: 24px;
}

.cmifr-summary-title {
	font-size: clamp(1.2rem, 4vw, 1.5rem);
	font-weight: 700;
	margin: 0 0 4px;
}

.cmifr-summary-subtitle {
	font-size: 0.9rem;
	color: var(--cmifr-gray-600);
	margin: 0;
}

.cmifr-eval-cards {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-bottom: 28px;
}

.cmifr-eval-card {
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
	overflow: hidden;
	background: var(--cmifr-white);
	box-shadow: var(--cmifr-shadow);
}

.cmifr-eval-card--interactive {
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.cmifr-eval-card--interactive:hover,
.cmifr-eval-card--interactive:focus {
	transform: translateY(-1px);
	border-color: var(--cmifr-orange);
	box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12);
	outline: none;
}

.cmifr-eval-card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 18px;
	background: var(--cmifr-gray-050);
	border-bottom: 1px solid var(--cmifr-gray-200);
	gap: 10px;
	flex-wrap: wrap;
}

.cmifr-eval-card-name {
	font-size: 0.95rem;
	font-weight: 700;
}

.cmifr-eval-card-badge {
	font-size: 0.75rem;
	font-weight: 700;
	padding: 3px 12px;
	border-radius: 100px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.cmifr-eval-card-body {
	padding: 16px 18px;
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 12px 20px;
	align-items: start;
}

.cmifr-eval-card-score {
	font-size: 1.5rem;
	font-weight: 800;
	line-height: 1;
	color: var(--cmifr-gray-800);
}

.cmifr-eval-card-denom {
	font-size: 0.85rem;
	color: var(--cmifr-gray-600);
	font-weight: 400;
}

.cmifr-eval-card-profiles {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.cmifr-eval-card-profile-item {
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--cmifr-gray-800);
}

.cmifr-eval-card-sep {
	font-size: 0.75rem;
	color: var(--cmifr-gray-600);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.cmifr-eval-card-intervention {
	grid-column: 1 / -1;
	font-size: 0.87rem;
	line-height: 1.6;
	color: var(--cmifr-gray-600);
	padding-top: 10px;
	border-top: 1px solid var(--cmifr-gray-200);
}

.cmifr-eval-card-intervention strong {
	color: var(--cmifr-gray-800);
}

/* ---------------------------------------------------------------------------
   Inline share / email-link section (revealed after DB save)
   --------------------------------------------------------------------------- */

.cmifr-share-section {
	margin: 20px 0 8px;
	padding: 18px 20px;
	background: var(--cmifr-gray-100);
	border-radius: var(--cmifr-radius);
	border: 1px solid var(--cmifr-gray-200);
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.cmifr-share-section[hidden] {
	display: none !important;
}

.cmifr-share-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	align-items: center;
}

.cmifr-email-link-row {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.cmifr-email-link-row[hidden] {
	display: none !important;
}

.cmifr-email-link-label {
	font-size: 0.85rem;
	color: var(--cmifr-gray-600);
	white-space: nowrap;
}

.cmifr-email-link-inputs {
	display: flex;
	gap: 8px;
	flex: 1 1 240px;
	flex-wrap: wrap;
}

.cmifr-email-input--sm {
	max-width: none;
	flex: 1 1 180px;
	padding: 9px 12px;
	font-size: 0.88rem;
}

.cmifr-btn--sm {
	padding: 9px 16px;
	font-size: 0.88rem;
	white-space: nowrap;
}

.cmifr-input-error {
	border-color: #B71C1C !important;
}

/* ---------------------------------------------------------------------------
   FR gate
   --------------------------------------------------------------------------- */

.cmifr-gate-section {
	margin: 24px 0 10px;
	padding: 24px;
	background: var(--cmifr-gray-100);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.cmifr-gate-section[hidden] {
	display: none !important;
}

.cmifr-gate-title {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--cmifr-gray-900);
}

.cmifr-gate-subtitle {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--cmifr-gray-600);
}

.cmifr-gate-form {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.cmifr-gate-row {
	display: block;
}

.cmifr-gate-row--2col {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.cmifr-gate-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.cmifr-gate-label {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--cmifr-gray-800);
}

.cmifr-gate-input {
	width: 100%;
	padding: 11px 14px;
	font-size: 0.95rem;
	border: 1.5px solid var(--cmifr-gray-400);
	border-radius: var(--cmifr-radius);
	background: var(--cmifr-white);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.cmifr-gate-input:focus {
	border-color: var(--cmifr-orange);
	box-shadow: 0 0 0 3px rgba(247, 147, 30, 0.14);
	outline: none;
}

.cmifr-gate-select {
	appearance: none;
	background-image:
		linear-gradient(45deg, transparent 50%, var(--cmifr-gray-600) 50%),
		linear-gradient(135deg, var(--cmifr-gray-600) 50%, transparent 50%);
	background-position:
		calc(100% - 18px) calc(50% - 2px),
		calc(100% - 12px) calc(50% - 2px);
	background-size: 6px 6px, 6px 6px;
	background-repeat: no-repeat;
	padding-right: 36px;
}

.cmifr-gate-cco-wrap {
	padding-top: 2px;
}

.cmifr-gate-compliance-wrap {
	width: 100%;
}

.cmifr-gate-checkbox-label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--cmifr-gray-700);
}

.cmifr-gate-checkbox {
	margin-top: 3px;
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.cmifr-gate-submit-btn {
	align-self: flex-start;
}

.cmifr-gate-notice {
	margin: 0;
	font-size: 0.88rem;
	color: #B71C1C;
}

.cmifr-gate-sent {
	padding: 16px 18px;
	background: #E8F5E9;
	border: 1px solid #A5D6A7;
	border-radius: var(--cmifr-radius);
	color: #1B5E20;
}

.cmifr-gate-sent p {
	margin: 0;
	font-size: 0.92rem;
	line-height: 1.6;
}

.cmifr-gate-sent-actions {
	margin-top: 12px !important;
}

.cmifr-required {
	color: #B71C1C;
}

.media-compliance {
	margin-top: 0;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	font-size: 0.9rem;
	color: var(--cmifr-gray-700);
}

.media-compliance__row {
	margin-top: 0.75rem;
}

.media-compliance__choice {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	line-height: 1.6;
}

.media-compliance__choice input {
	margin-top: 3px;
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.media-compliance__privacy {
	margin-top: 0.75rem;
	line-height: 1.6;
}

.media-compliance a {
	color: var(--cmifr-blue);
}

/* ---------------------------------------------------------------------------
   Summary / result action buttons
   --------------------------------------------------------------------------- */

.cmifr-result-actions,
.cmifr-summary-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 8px;
}

.cmifr-result-actions[hidden],
.cmifr-summary-actions [hidden] {
	display: none !important;
}

/* ---------------------------------------------------------------------------
   Email capture screen
   --------------------------------------------------------------------------- */

.cmifr-email-capture-panel {
	max-width: 480px;
	margin: 0 auto;
	text-align: center;
	padding: 40px 0 20px;
}

.cmifr-email-capture-icon {
	font-size: 2.5rem;
	margin-bottom: 16px;
}

.cmifr-email-capture-title {
	font-size: 1.35rem;
	font-weight: 700;
	margin: 0 0 10px;
}

.cmifr-email-capture-desc {
	font-size: 0.93rem;
	color: var(--cmifr-gray-600);
	line-height: 1.6;
	margin: 0 0 24px;
}

.cmifr-email-capture-form {
	text-align: left;
	margin-bottom: 16px;
}

.cmifr-email-input-row {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.cmifr-email-input-row .cmifr-email-input {
	flex: 1 1 220px;
	margin-bottom: 0;
}

.cmifr-field-error {
	font-size: 0.82rem;
	color: #B71C1C;
	margin: 6px 0 0;
}

.cmifr-saving-indicator {
	display: flex;
	align-items: center;
	gap: 10px;
	justify-content: center;
	font-size: 0.9rem;
	color: var(--cmifr-gray-600);
	margin-top: 12px;
}

.cmifr-email-skip-wrap {
	margin-top: 20px;
	font-size: 0.85rem;
	color: var(--cmifr-gray-600);
}

/* ---------------------------------------------------------------------------
   Spinner
   --------------------------------------------------------------------------- */

.cmifr-spinner {
	display: inline-block;
	width: 18px;
	height: 18px;
	border: 2px solid var(--cmifr-gray-200);
	border-top-color: var(--cmifr-orange);
	border-radius: 50%;
	animation: cmifr-spin 0.7s linear infinite;
	flex-shrink: 0;
}

@keyframes cmifr-spin {
	to { transform: rotate(360deg); }
}

/* ---------------------------------------------------------------------------
   Token results screen
   --------------------------------------------------------------------------- */

.cmifr-token-loading {
	text-align: center;
	padding: 48px 16px;
	color: var(--cmifr-gray-600);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	font-size: 0.95rem;
}

.cmifr-token-loading[hidden] {
	display: none !important;
}

.cmifr-token-instrument-badge {
	margin-bottom: 16px;
}

.cmifr-token-title {
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0 0 20px;
}

.cmifr-token-eval-card {
	background: var(--cmifr-white);
	border: 1px solid var(--cmifr-gray-200);
	border-radius: var(--cmifr-radius-lg);
	padding: 20px;
	margin-bottom: 14px;
	box-shadow: var(--cmifr-shadow);
}

.cmifr-token-eval-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
	gap: 10px;
	flex-wrap: wrap;
}

.cmifr-token-eval-name {
	font-weight: 700;
	font-size: 1rem;
}

.cmifr-token-score {
	font-size: 1.4rem;
	font-weight: 800;
	margin: 0 0 8px;
}

.cmifr-token-summary {
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--cmifr-gray-600);
	margin: 0 0 14px;
}

.cmifr-token-cta {
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--cmifr-gray-800);
	padding: 12px 16px;
	background: var(--cmifr-blue-lt);
	border-left: 4px solid #3B82F6;
	border-radius: 0 var(--cmifr-radius) var(--cmifr-radius) 0;
	margin: 0;
}

.cmifr-token-profile-scores {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.cmifr-token-profile-row {
	display: flex;
	justify-content: space-between;
	font-size: 0.85rem;
}

.cmifr-token-footer {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid var(--cmifr-gray-200);
}

.cmifr-token-footer[hidden] {
	display: none !important;
}

/* ---------------------------------------------------------------------------
   Social share
   --------------------------------------------------------------------------- */

.cmifr-social-share {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid var(--cmifr-gray-200);
	flex-wrap: wrap;
}

.cmifr-social-share-label {
	font-size: 0.82rem;
	color: var(--cmifr-gray-600);
	white-space: nowrap;
}

.cmifr-social-share-btns {
	display: flex;
	gap: 8px;
	align-items: center;
}

.cmifr-social-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	color: #fff;
	text-decoration: none;
	transition: opacity 0.15s ease, transform 0.15s ease;
	flex-shrink: 0;
}

.cmifr-social-btn:hover {
	opacity: 0.85;
	transform: translateY(-1px);
}

.cmifr-social-btn:active {
	transform: translateY(0);
}

.cmifr-social-btn svg {
	width: 18px;
	height: 18px;
	display: block;
}

.cmifr-social-btn--linkedin  { background: #0A66C2; }
.cmifr-social-btn--x         { background: #000000; }
.cmifr-social-btn--facebook  { background: #1877F2; }
.cmifr-social-btn--email     { background: var(--cmifr-gray-600); }

/* ---------------------------------------------------------------------------
   Notice / cross-promo
   --------------------------------------------------------------------------- */

.cmifr-notice {
	padding: 12px 16px;
	background: #E8F5E9;
	border: 1px solid #A5D6A7;
	border-radius: var(--cmifr-radius);
	font-size: 0.88rem;
	margin-bottom: 16px;
	animation: cmifr-fadein 0.3s ease;
}

.cmifr-error-msg {
	color: #B71C1C;
	font-size: 0.9rem;
}

.cmifr-cross-promo {
	margin-top: 28px;
	padding-top: 20px;
	border-top: 1px solid var(--cmifr-gray-200);
	text-align: center;
}

.cmifr-cross-promo-text {
	font-size: 0.88rem;
	color: var(--cmifr-gray-600);
	margin: 0;
}

/* ---------------------------------------------------------------------------
   Footer disclaimer
   --------------------------------------------------------------------------- */

.cmifr-disclaimer {
	font-size: 0.78rem;
	color: var(--cmifr-gray-600);
	margin-top: 40px;
	padding-top: 16px;
	border-top: 1px solid var(--cmifr-gray-200);
	line-height: 1.5;
}

/* ---------------------------------------------------------------------------
   Responsive
   --------------------------------------------------------------------------- */

@media (max-width: 520px) {

	.cmifr-instrument-cards,
	.cmifr-landing-cards {
		grid-template-columns: 1fr;
	}

	.cmifr-result-actions,
	.cmifr-summary-actions,
	.cmifr-step-nav {
		flex-direction: column;
	}

	.cmifr-btn {
		width: 100%;
		justify-content: center;
	}

	.cmifr-profile-bar-row {
		grid-template-columns: 1fr 1fr;
	}

	.cmifr-profile-bar-row .cmifr-profile-bar-track {
		grid-column: 1 / -1;
	}

	.cmifr-email-input-row {
		flex-direction: column;
	}

	.cmifr-eval-card-body {
		grid-template-columns: 1fr;
	}

	.cmifr-gate-row--2col {
		grid-template-columns: 1fr;
	}

	.cmifr-gate-section {
		padding: 20px;
	}
}

/* ---------------------------------------------------------------------------
   Print
   --------------------------------------------------------------------------- */

@media print {

	.cmifr-screen:not([hidden]) ~ .cmifr-screen,
	.cmifr-step:not(.cmifr-step--active),
	.cmifr-result-actions,
	.cmifr-summary-actions,
	.cmifr-step-nav,
	.cmifr-cross-promo,
	.cmifr-btn,
	.cmifr-token-footer,
	.cmifr-email-section,
	.cmifr-gate-section,
	.cmifr-landing-footer {
		display: none !important;
	}

	.cmifr-wrap {
		max-width: 100%;
		padding: 0;
	}

	.cmifr-score-panel,
	.cmifr-insights-panel,
	.cmifr-profiles-panel,
	.cmifr-matrix-panel,
	.cmifr-eval-card,
	.cmifr-token-eval-card {
		break-inside: avoid;
		box-shadow: none;
		border: 1px solid #ccc;
	}

	.cmifr-disclaimer::after {
		content: " | contentmarketinginstitute.com";
	}
}