@import url("https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Caveat:wght@500;600&display=swap");


:root {
	/* Gentrix IT Brand Colors */
	--color-primary: #64D0E9;
	--color-secondary: #6EC1E4;
	--color-highlight: #CC3366;

	--color-background: #000000;
	--color-surface: #FFFFFF;
	--color-text: #333333;

	/* Dark interface support */
	--color-dark-surface: #101820;
	--color-dark-elevated: #18232C;
	--color-dark-border: #293741;
	--color-text-light: #FFFFFF;
	--color-text-muted: #B7C4CE;
	--color-border: #a8a9aa;

	/* Typography */
	--font-family: "Instrument Sans", sans-serif;
	--font-size-base: 16px;
	--font-size-small: 15px;
	--font-size-xs: 11px;
	--font-size-large: 18px;
	--font-size-heading: 25px;
	--font-size-display: 40px;
	--font-weight-base: 500;

	/* Spacing */
	--space-1: 4px;
	--space-2: 5px;
	--space-3: 6px;
	--space-4: 9px;
	--space-5: 11px;
	--space-6: 13px;
	--space-7: 14.4px;
	--space-8: 15px;

	/* Radius */
	--radius-xs: 4px;
	--radius-sm: 5px;
	--radius-md: 33px;
	--radius-lg: 50px;
	--radius-pill: 555px;
}


.gentrix-it-health-check,
.gentrix-it-health-check * {
	box-sizing: border-box;
}

.gentrix-it-health-check {
	margin: 0;
	padding: 25px 16px;
	font-family: var(--font);
	background: var(--color-bg);
	color: var(--color-text-inverse);
}

.gentrix-it-health-check button, .gentrix-it-health-check input, .gentrix-it-health-check select {
	font: inherit;
}

.gentrix-it-health-check button:focus-visible,
.gentrix-it-health-check input:focus-visible,
.gentrix-it-health-check .answer:focus-visible {
	outline: 3px solid var(--color-cyan);
	outline-offset: 3px;
}

.wrapper {
	max-width: 800px;
	margin: 30px auto;
}

.card {
	background: var(--color-surface-dark);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 35px;
}

.hidden {
	display: none !important;
}

.eyebrow {
	color: var(--color-cyan);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 1.5px;
	text-transform: uppercase;
}

h1 {
	font-size: 34px;
	line-height: 1.2;
	margin: 15px 0;
}

h2 {
	font-size: 24px;
	line-height: 1.4;
}

h3 {
	font-size: 17px;
}

.description {
	color: var(--color-text-muted);
	font-size: 15px;
	line-height: 1.7;
}

.meta {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin: 25px 0;
	color: var(--color-text-muted);
	font-size: 13px;
}

.btn {
	padding: 14px 23px;
	border: 0;
	border-radius: var(--radius-sm);
	background: var(--color-cyan);
	color: #10232a;
	font-weight: 700;
	cursor: pointer;
	transition: .2s;
}

.btn:hover {
	background: var(--color-blue);
}

.btn:active {
	transform: scale(.98);
}

.btn:disabled {
	opacity: .45;
	cursor: not-allowed;
}

.btn-secondary {
	background: #263541;
	color: white;
}

.btn-secondary:hover {
	background: #354b5a;
}

/* QUIZ */

.progress-header {
	display: flex;
	justify-content: space-between;
	color: var(--color-text-muted);
	font-size: 13px;
	margin-bottom: 12px;
}

.progress-track {
	height: 7px;
	background: #273540;
	border-radius: 20px;
	overflow: hidden;
}

.progress-fill {
	height: 100%;
	background: var(--color-cyan);
	transition: width .3s;
}

.categories {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 25px 0;
}

.category {
	background: #202e39;
	color: var(--color-text-muted);
	padding: 8px 11px;
	border-radius: 30px;
	font-size: 11px;
}

.category.active {
	background: var(--color-cyan);
	color: #10232a;
	font-weight: 700;
}

.question-label {
	color: var(--color-cyan);
	font-size: 13px;
	font-weight: 700;
}

#questionTitle {
	color: white;
}

.answers {
	display: grid;
	gap: 12px;
	margin: 25px 0;
}

.answer {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border: 1px solid var(--color-border) !important;
	border-radius: 9px;
	cursor: pointer;
	color: white;
	transition: .2s;
	justify-content: flex-start;

}

.answer:hover {
	border-color: var(--color-cyan);
}

.answer.selected {
	border: 2px solid var(--color-cyan);
	background: #142b33;
}

.answer-letter {
	width: 32px;
	height: 32px;
	display: grid;
	place-items: center;
	border: 1px solid #536573;
	border-radius: 6px;
	flex-shrink: 0;
}

.answer.selected .answer-letter {
	background: var(--color-cyan);
	color: #10232a;
	border-color: var(--color-cyan);
}
.gentrix-it-health-check button.answer {
	height: 42px !important;
	min-height: 42px !important;
	padding: 6px 12px !important;
	gap: 10px;
}
.navigation {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	margin-top: 30px;
}

/* RESULTS */

.result-hero {
	text-align: center;
	margin-bottom: 28px;
}

.result-score {
	font-size: 65px;
	font-weight: 800;
	line-height: 1.1;
	margin: 12px 0;
}

.result-score span {
	font-size: 17px;
	color: var(--color-text-muted);
	font-weight: 500;
}

.risk-label {
	font-weight: 700;
	margin: 16px 0;
}

.result-title {
	margin: 12px 0 0;
	font-weight: 800;
	color: var(--color-text);
}

.biggest-area {
	margin-top: 24px;
}

.biggest-area h3 {
	margin: 0 0 8px;
	font-size: 17px;
}

.biggest-area p {
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	color: var(--color-highlight);
}

.report-includes {
	margin: 20px 0 0;
	list-style: none !important;
}

.report-includes h3 {
	margin: 0 0 12px;
	font-size: 17px;
}

.report-includes ul {
	list-style: none !important;
	margin: 0;
	padding: 0;
	counter-reset: report-item;
}

.report-includes li {
	counter-increment: report-item;
	position: relative;
	padding-left: 34px;
	margin-bottom: 10px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-text-muted);
}

.report-includes li::before {
	content: counter(report-item);
	position: absolute;
	left: 0;
	top: 0;
	width: 22px;
	height: 22px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--color-primary);
	color: #17333D;
	font-size: 12px;
	font-weight: 800;
}

.field-error {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	font-weight: 600;
	color: var(--color-highlight);
}

.field input[aria-invalid="true"] {
	border-color: var(--color-highlight) !important;
}

.domain {
	margin-bottom: 19px;
}

.domain-header {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	font-size: 13px;
	font-weight: 700;
	margin-bottom: 8px;
}

.domain-value {
	color: var(--color-blue);
}

.domain-bar {
	height: 9px;
	background: #253440;
	border-radius: 20px;
	overflow: hidden;
}

.domain-fill {
	height: 100%;
	border-radius: 20px;
	background: var(--color-cyan);
	transition: width .6s ease;
}

.domain-description {
	font-size: 11px;
	color: var(--color-text-muted);
	margin-top: 6px;
	line-height: 1.5;
}

.recommendation {
	padding: 16px;
	border: 1px solid var(--color-border);
	background: #080f14;
	border-radius: 11px;
	margin-bottom: 11px;
}

.priority {
	font-size: 11px;
	font-weight: 700;
	margin-bottom: 7px;
	color: var(--color-pink);
}

.recommendation p {
	font-size: 13px;
	line-height: 1.6;
	color: var(--color-text-muted);
	margin: 0;
}

.recommendation strong {
	color: white;
}

.more-recommendations {
	text-align: center;
	color: var(--color-text-muted);
	font-size: 12px;
	margin-top: 18px;
}

/* LEAD FORM */

.lead-panel {
	border: 1px solid #28758a;
	margin-top: 28px;
}

.lead-title {
	margin: 0 0 10px;
	font-size: 17px;
}

.lock {
	color: var(--color-cyan);
}

.form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 17px 14px;
	margin-top: 22px;
}

.field label {
	display: block;
	font-size: 13px;
	font-weight: 700;
	margin-bottom: 8px;
}

.required {
	color: var(--color-cyan);
}

.field input {
	width: 100%;
	height: 42px;
	padding: 0 12px;
	border: 1px solid #344451;
	border-radius: 9px;
	background: #080f14;
	color: white;
	outline: none;
}

.field input:focus {
	border-color: var(--color-cyan);
}

.field input::placeholder {
	color: #91a5bd;
}

.consent-box {
	border: 1px solid #293741;
	background: #101820;
	border-radius: 10px;
	padding: 14px;
	margin-top: 16px;
}

.consent-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 13px;
}

.consent-item input {
	accent-color: var(--color-cyan);
	margin-top: 4px;
	flex-shrink: 0;
}

.consent-item label {
	font-size: 11px;
	line-height: 1.6;
	color: var(--color-text-muted);
}

.terms {
	font-size: 11px;
	color: var(--color-text-muted);
}

.terms a {
	color: var(--color-cyan);
}

.submit-btn {
	width: 100%;
	margin-top: 15px;
	padding: 16px;
	border: none;
	border-radius: 10px;
	background: var(--color-cyan);
	color: #10232a;
	font-weight: 800;
	font-size: 15px;
	cursor: pointer;
}

.submit-btn:hover {
	background: var(--color-blue);
}

.privacy-note {
	text-align: center;
	font-size: 11px;
	color: var(--color-text-muted);
	margin-top: 14px;
}

@media(max-width:600px) {
	.gentrix-it-health-check {
		padding: 10px;
	}

	.wrapper {
		margin: 10px auto;
	}

	.card {
		padding: 22px 17px;
		margin-top: 28px !important;
	}

	h1 {
		font-size: 27px;
	}

	h2 {
		font-size: 21px;
	}

	.form-grid {
		grid-template-columns: 1fr;
	}

	.navigation .btn {
		padding: 12px;
	}

	.result-score {
		font-size: 55px;
	}
}

@media print {
	.gentrix-it-health-check {
		background: white;
		color: #222;
	}

	.card {
		break-inside: avoid;
	}

	.lead-panel {
		display: none;
	}
}

/* Gentrix IT website-inspired light theme */
:root {
	--color-primary: #64D0E9;
	--color-secondary: #6EC1E4;
	--color-highlight: #CC3366;

	--color-background: #F4F8FA;
	--color-surface: #FFFFFF;
	--color-text: #333333;

	--color-dark-surface: #FFFFFF;
	--color-dark-elevated: #F5FAFC;
	--color-dark-border: #DCE7EC;
	--color-text-light: #333333;
	--color-text-muted: #667783;

	--font-family: "Instrument Sans", sans-serif;
	--font-size-base: 16px;
	--font-weight-base: 500;
}

.gentrix-it-health-check {
	background: transparent ;
	color: var(--color-text);
	font-family: var(--font-family);
}

.card {
	background: var(--color-surface);
	border: 1px solid var(--color-dark-border);
	box-shadow: 0 8px 28px rgba(35, 69, 84, .06);
}

h1, h2, h3,
#questionTitle,
.recommendation strong {
	color: var(--color-text);
}

.description,
.progress-header,
.domain-description,
.recommendation p,
.more-recommendations,
.privacy-note,
.consent-item label,
.terms {
	color: var(--color-text-muted);
}

.eyebrow,
.question-label,
.lock {
	color: #1686A0;
}

.btn,
.submit-btn {
	background: var(--color-primary);
	color: #17333D;
}

.btn:hover,
.submit-btn:hover {
	background: var(--color-secondary);
}

.btn-secondary {
	background: #EAF3F7;
	color: #334B57;
	border: 1px solid #D6E5EB;
}

.btn-secondary:hover {
	background: #DCEEF4;
}

.progress-track,
.domain-bar {
	background: #E7EFF3;
}

.progress-fill,
.domain-fill {
	background: var(--color-secondary);
}

.category {
	background: #EFF5F8;
	color: #526875;
}

.category.active {
	background: #DDF4FA;
	color: #176C83;
}

.answer {
	background: #FFFFFF;
	border-color: #DCE7EC;
	color: var(--color-text) ;
	padding: 10px;
	height: 49px;
}

.answer:hover,
.answer:focus,
.answer.selected {
	background: #F0FAFC !important;
	border-color: var(--color-primary);
	color: #333333 ;
}

.answer-letter {
	border-color: #C8D9E1;
	color: #425A66;
}

.answer.selected .answer-letter {
	background: var(--color-primary);
	color: #17333D;
	border-color: var(--color-primary);
}
.answer span{
	font-size: 14px;
}
.domain-value {
	color: #377F9A;
}

.recommendation {
	background: #F7FAFB;
	border-color: #E0E9ED;
}

.priority,
.risk-label {
	color: var(--color-highlight);
}

.lead-panel {
	border-color: var(--color-secondary);
}

.field input {
	background: #FFFFFF;
	color: var(--color-text);
	border-color: #CFDDE4;
}

.field input::placeholder {
	color: #82939D;
}

.consent-box {
	background: #F7FAFB;
	border-color: #DCE7EC;
}

.consent-item input {
	accent-color: #1686A0;
}

.terms a {
	color: #167D9A;
}

@media print {
	.gentrix-it-health-check {
		background: #FFFFFF;
		color: #333333;
	}

	.card {
		box-shadow: none;
	}
}

/* REPORT READY CARD */
.report-ready {
	border: 1px solid #8FD8E8;
	border-radius: 16px;
	padding: 30px 24px;
	text-align: center;
	background: #F7FCFD;
}

.report-ready-title {
	margin: 0;
	font-size: 20px;
	line-height: 1.3;
	color: var(--color-text);
}

.report-ready-text {
	max-width: 440px;
	margin: 8px auto 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-text-muted);
}

.report-ready-actions {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 22px;
}

.report-ready-download,
.report-ready-secondary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 14px 22px;
	border-radius: 9px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background .2s, border-color .2s;
}

.report-ready-download {
	border: 0;
	background: var(--color-primary);
	color: #17333D;
}

.report-ready-download:hover {
	background: var(--color-secondary);
}

.report-ready-secondary {
	border: 1px solid #CFDDE4;
	background: #FFFFFF;
	color: var(--color-text);
}

.report-ready-secondary:hover {
	border-color: var(--color-primary);
}

.report-ready-secondary svg {
	color: #1686A0;
}

.report-ready-phone {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 16px;
	font-size: 13px;
	font-weight: 600;
	color: #1686A0;
	text-decoration: none;
}

.report-ready-phone:hover {
	text-decoration: underline;
}

@media (min-width: 601px) {
	.report-ready-actions {
		flex-direction: row;
	}

	.report-ready-download,
	.report-ready-secondary {
		width: auto;
	}
}

@media (max-width: 600px) {
	.report-ready {
		padding: 24px 16px;
	}

	.report-ready-title {
		font-size: 18px;
	}
}

/* ---------- RESPONSIVE / FLUID LAYOUT ---------- */
:root {
	--color-cyan: var(--color-primary);
	--color-blue: var(--color-secondary);
	--color-pink: var(--color-highlight);
	--color-bg: var(--color-background);
	--color-surface-dark: var(--color-surface);
	--color-text-inverse: var(--color-text);
	--font: var(--font-family);
}

.gentrix-it-health-check {
	width: 100%;
	max-width: 100%;
	padding: clamp(12px, 2.5vw, 28px) clamp(10px, 3vw, 32px);
	overflow-x: hidden;
}

.gentrix-it-health-check img,
.gentrix-it-health-check svg {
	max-width: 100%;
	height: auto;
}

.wrapper {
	width: 100%;
	max-width: 100%;
	margin: clamp(10px, 2vw, 30px) auto;
}

.card {
	width: 100%;
	max-width: 100%;
	padding: clamp(20px, 4vw, 40px);
	border-radius: clamp(14px, 3vw, 24px);
	overflow-wrap: break-word;
}

h1 {
	font-size: clamp(26px, 5vw, 40px);
}

h2 {
	font-size: clamp(20px, 3.5vw, 26px);
}

h3 {
	font-size: clamp(16px, 2.4vw, 19px);
}

.description {
	font-size: clamp(14px, 1.6vw, 16px);
}

.meta {
	gap: clamp(10px, 2vw, 24px);
	font-size: clamp(12px, 1.4vw, 14px);
}

.btn,
.submit-btn,
.report-ready-download,
.report-ready-secondary {
	max-width: 100%;
	white-space: normal;
}

.form-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.field,
.field input,
.field select {
	min-width: 0;
	max-width: 100%;
}

.field input,
.field select {
	width: 100%;
	height: auto;
	min-height: 44px;
}

.field select {
	padding: 0 12px;
	border: 1px solid #CFDDE4;
	border-radius: 9px;
	background: #FFFFFF;
	color: var(--color-text);
}

.answers,
.recommendation,
.domain,
.consent-item {
	min-width: 0;
}

.consent-item label,
.answer span,
.recommendation p {
	overflow-wrap: anywhere;
}

.answer {
	height: auto;
	min-height: 49px;
	padding: clamp(10px, 2vw, 16px);
}

.navigation {
	flex-wrap: wrap;
}

.navigation .btn {
	max-width: 100%;
}

.report-ready {
	width: 100%;
	padding: clamp(20px, 4vw, 30px) clamp(14px, 3vw, 24px);
}

.report-ready-title {
	font-size: clamp(17px, 2.4vw, 20px);
}

.report-ready-text {
	font-size: clamp(13px, 1.5vw, 14px);
}

.report-ready-actions {
	flex-wrap: wrap;
}

.report-ready-download,
.report-ready-secondary {
	flex: 1 1 auto;
	min-width: 0;
}

.report-ready-phone {
	flex-wrap: wrap;
	justify-content: center;
}

@media (max-width: 834px) {
	.wrapper {
		max-width: 100%;
	}
}

@media (max-width: 600px) {
	.gentrix-it-health-check {
		padding: 10px;
	}

	.wrapper {
		margin: 10px auto;
	}

	.card {
		padding: 22px 16px;
		border-radius: 16px;
	}

	h1 {
		font-size: 27px;
	}

	h2 {
		font-size: 21px;
	}

	.form-grid {
		grid-template-columns: 1fr;
	}

	.meta {
		gap: 10px 16px;
	}

	.result-score {
		font-size: clamp(48px, 15vw, 60px);
	}

	.report-ready-actions {
		flex-direction: column;
	}

	.report-ready-download,
	.report-ready-secondary {
		width: 100%;
	}
}

@media (max-width: 400px) {
	.gentrix-it-health-check {
		padding: 6px;
	}

	.card {
		padding: 18px 13px;
	}

	h1 {
		font-size: 23px;
	}

	h2 {
		font-size: 19px;
	}

	.answer {
		gap: 10px;
	}

	.answer-letter {
		width: 28px;
		height: 28px;
		font-size: 13px;
	}

	.report-ready {
		padding: 18px 12px;
	}

	.report-ready-phone {
		font-size: 12px;
	}
}

/* =========================================================
   FINAL RESPONSIVE FIXES — GENTRIX IT HEALTH CHECK
   Scoped to the questionnaire component to avoid affecting
   the surrounding website/header.
   ========================================================= */

   .gentrix-it-health-check,
   .gentrix-it-health-check *,
   .gentrix-it-health-check *::before,
   .gentrix-it-health-check *::after {
   	box-sizing: border-box;
   }

   .gentrix-it-health-check {
   	display: block;
   	width: 100%;
   	max-width: 100%;
   	min-width: 0;
   	margin: 0;
   	padding: clamp(12px, 2.5vw, 28px) clamp(12px, 3vw, 32px);
   	font-family: var(--font-family, "Instrument Sans", sans-serif);
   	color: var(--color-text, #333333);
   	overflow-x: clip;
   }

   .gentrix-it-health-check .wrapper {
   	width: 100%;
   	max-width: 1100px;
   	min-width: 0;
   	margin: clamp(12px, 2vw, 30px) auto;
   }

   .gentrix-it-health-check .card {
   	width: 100%;
   	max-width: 100%;
   	min-width: 0;
   	padding: clamp(18px, 3.2vw, 36px);
   	border-radius: clamp(12px, 2vw, 20px);
   	overflow: hidden;
   }

   .gentrix-it-health-check h1,
   .gentrix-it-health-check h2,
   .gentrix-it-health-check h3,
   .gentrix-it-health-check p,
   .gentrix-it-health-check label,
   .gentrix-it-health-check span {
   	max-width: 100%;
   	overflow-wrap: anywhere;
   }

   .gentrix-it-health-check h1 {
   	font-size: clamp(24px, 3.2vw, 36px);
   	line-height: 1.2;
   }

   .gentrix-it-health-check h2 {
   	font-size: clamp(19px, 2.4vw, 25px);
   	line-height: 1.35;
   }

   .gentrix-it-health-check .progress-header {
   	display: flex;
   	align-items: center;
   	justify-content: space-between;
   	flex-wrap: wrap;
   	gap: 6px 12px;
   	width: 100%;
   	min-width: 0;
   }

   .gentrix-it-health-check .progress-track {
   	width: 100%;
   	max-width: 100%;
   }

   .gentrix-it-health-check .categories {
   	display: flex;
   	flex-wrap: wrap;
   	align-items: center;
   	gap: 8px;
   	width: 100%;
   	min-width: 0;
   }

   .gentrix-it-health-check .category {
   	max-width: 100%;
   	white-space: normal;
   	overflow-wrap: anywhere;
   }

   .gentrix-it-health-check .answers {
   	display: grid;
   	grid-template-columns: minmax(0, 1fr);
   	gap: 10px;
   	width: 100%;
   	min-width: 0;
   }

   .gentrix-it-health-check .answer {
   	display: flex;
   	align-items: center;
   	justify-content: flex-start;
   	gap: 12px;
   	width: 100%;
   	min-width: 0;
   	min-height: 56px;
   	height: auto;
   	padding: 12px 14px;
   	text-align: left;
   	white-space: normal;
   }

   .gentrix-it-health-check .answer span {
   	min-width: 0;
   	line-height: 1.45;
   }

   .gentrix-it-health-check .answer-letter {
   	flex: 0 0 32px;
   	width: 32px;
   	height: 32px;
   }

   .gentrix-it-health-check .navigation {
   	display: flex;
   	align-items: center;
   	justify-content: space-between;
   	flex-wrap: wrap;
   	gap: 12px;
   	width: 100%;
   }

   .gentrix-it-health-check .navigation .btn {
   	max-width: 100%;
   	white-space: normal;
   }

   .gentrix-it-health-check .form-grid {
   	display: grid;
   	grid-template-columns: repeat(2, minmax(0, 1fr));
   	gap: 16px;
   	width: 100%;
   }

   .gentrix-it-health-check .field,
   .gentrix-it-health-check .field input,
   .gentrix-it-health-check .field select {
   	width: 100%;
   	min-width: 0;
   	max-width: 100%;
   }

   .gentrix-it-health-check .field input,
   .gentrix-it-health-check .field select {
   	min-height: 44px;
   }

   .gentrix-it-health-check .consent-item {
   	display: flex;
   	align-items: flex-start;
   	gap: 10px;
   	min-width: 0;
   }

   .gentrix-it-health-check .consent-item input {
   	flex: 0 0 auto;
   }

   .gentrix-it-health-check .consent-item label {
   	min-width: 0;
   }

   .gentrix-it-health-check .report-ready {
   	width: 100%;
   	max-width: 100%;
   	min-width: 0;
   }

   .gentrix-it-health-check .report-ready-actions {
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	flex-wrap: wrap;
   	gap: 12px;
   	width: 100%;
   }

   .gentrix-it-health-check .report-ready-download,
   .gentrix-it-health-check .report-ready-secondary {
   	min-width: 0;
   	max-width: 100%;
   	white-space: normal;
   }

   @media (max-width: 768px) {
   	.gentrix-it-health-check {
   		padding: 14px;
   	}

   	.gentrix-it-health-check .wrapper {
   		margin: 12px auto;
   	}

   	.gentrix-it-health-check .card {
   		padding: 22px 18px;
   	}

   	.gentrix-it-health-check .categories {
   		flex-wrap: nowrap;
   		overflow-x: auto;
   		overflow-y: hidden;
   		padding: 2px 0 8px;
   		scrollbar-width: thin;
   		-webkit-overflow-scrolling: touch;
   	}

   	.gentrix-it-health-check .category {
   		flex: 0 0 auto;
   		white-space: nowrap;
   	}

   	.gentrix-it-health-check .form-grid {
   		grid-template-columns: minmax(0, 1fr);
   	}
   }

   @media (max-width: 480px) {
   	.gentrix-it-health-check {
   		padding: 10px;
   	}

   	.gentrix-it-health-check .wrapper {
   		margin: 8px auto;
   	}

   	.gentrix-it-health-check .card {
   		padding: 18px 14px;
   		border-radius: 14px;
   	}

   	.gentrix-it-health-check h1 {
   		font-size: clamp(23px, 7vw, 28px);
   	}

   	.gentrix-it-health-check h2 {
   		font-size: 20px;
   	}

   	.gentrix-it-health-check .progress-header {
   		font-size: 12px;
   	}

   	.gentrix-it-health-check .answer {
   		gap: 10px;
   		padding: 11px;
   	}

   	.gentrix-it-health-check .answer-letter {
   		flex-basis: 30px;
   		width: 30px;
   		height: 30px;
   	}

   	.gentrix-it-health-check .navigation {
   		gap: 8px;
   	}

   	.gentrix-it-health-check .navigation .btn {
   		flex: 1 1 120px;
   		padding: 12px 10px;
   	}

   	.gentrix-it-health-check .result-score {
   		font-size: clamp(44px, 14vw, 56px);
   	}

   	.gentrix-it-health-check .report-ready {
   		padding: 20px 14px;
   	}

   	.gentrix-it-health-check .report-ready-actions {
   		flex-direction: column;
   		align-items: stretch;
   	}

   	.gentrix-it-health-check .report-ready-download,
   	.gentrix-it-health-check .report-ready-secondary {
   		width: 100%;
   	}
   }

   @media (max-width: 360px) {
   	.gentrix-it-health-check {
   		padding: 8px;
   	}

   	.gentrix-it-health-check .card {
   		padding: 16px 11px;
   	}

   	.gentrix-it-health-check .answer {
   		padding: 10px;
   	}

   	.gentrix-it-health-check .navigation .btn {
   		flex-basis: 100%;
   		width: 100%;
   	}
   }

   @media (prefers-reduced-motion: reduce) {
   	.gentrix-it-health-check *,
   	.gentrix-it-health-check *::before,
   	.gentrix-it-health-check *::after {
   		scroll-behavior: auto !important;
   		transition-duration: 0.01ms !important;
   		animation-duration: 0.01ms !important;
   		animation-iteration-count: 1 !important;
   	}
   }

/* =====================================================
   INTRO HERO (.gx-hero) — scoped
   ===================================================== */
   /* root must not clip the full-bleed hero; the contained .wrapper keeps its own width */
   .gentrix-it-health-check{overflow-x:visible}
   .gentrix-it-health-check .wrapper{overflow-x:clip}
   .gentrix-it-health-check .gx-hero{
   	--gx-navy:#0f2341; --gx-text:#2a3a52; --gx-cyan:#16a9dc; --gx-cyan-2:#21c0ea;
   	--gx-green:#2fb457; --gx-amber:#f2a516; --gx-orange:#f07a1a;
   	position:relative;overflow:hidden;box-sizing:border-box;
   	/* full-bleed: break out of theme + plugin containers to the full viewport width */
   	width:calc(100vw - var(--gx-sbw,0px));max-width:none;
   	margin-left:calc(50% - (100vw - var(--gx-sbw,0px)) / 2);
   	margin-right:calc(50% - (100vw - var(--gx-sbw,0px)) / 2);
   	background:#fff;border-radius:0;
   	font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
   	color:var(--gx-text);-webkit-font-smoothing:antialiased;line-height:normal;
   	padding:clamp(40px,5vw,72px) 0 clamp(40px,5vw,64px);
   }
   .gx-hero *,.gx-hero *::before,.gx-hero *::after{box-sizing:border-box;margin:0;padding:0}
   .gentrix-it-health-check .gx-hero h1,.gentrix-it-health-check .gx-hero h2,.gentrix-it-health-check .gx-hero p,.gentrix-it-health-check .gx-hero span{font-family:inherit;text-transform:none;letter-spacing:normal;font-style:normal;overflow-wrap:normal}
   .gx-hero .gx-hero__blob{position:absolute;right:-4%;top:6%;width:56%;height:92%;border-radius:48% 52% 46% 54%/55% 50% 50% 45%;background:linear-gradient(160deg,#e9f4fb 0%,#f2f8fd 70%);z-index:0}
   .gx-hero .gx-hero__wash{position:absolute;left:-10%;bottom:-30%;width:60%;height:70%;border-radius:50%;background:radial-gradient(circle,rgba(236,246,252,.9),rgba(255,255,255,0) 70%);z-index:0}
   .gx-hero .gx-hero__wrap{position:relative;z-index:1;max-width:1240px;margin:0 auto;padding:0 clamp(20px,4vw,56px);display:grid;grid-template-columns:1.18fr 1fr;gap:clamp(24px,3.4vw,56px);align-items:center}

   .gentrix-it-health-check .gx-hero .gx-hero__eyebrow{font-size:clamp(14px,1.25vw,17px);font-weight:700;letter-spacing:.02em;color:var(--gx-cyan);text-transform:uppercase}
   .gentrix-it-health-check .gx-hero .gx-hero__title{font-size:clamp(34px,4.1vw,54px);font-weight:800;line-height:1.08;letter-spacing:-.025em;color:var(--gx-navy);margin-top:14px}
   .gx-hero .gx-hero__mark{position:relative;white-space:nowrap}
   .gentrix-it-health-check .gx-hero .gx-hero__mark svg{position:absolute;left:-2%;bottom:-.28em;width:104%;max-width:none;height:.38em;color:var(--gx-cyan-2);overflow:visible}
   .gx-hero .gx-hero__lead{font-size:clamp(16px,1.45vw,19px);line-height:1.55;color:var(--gx-text);margin-top:clamp(28px,3vw,40px);max-width:560px}
   .gx-hero .gx-hero__lead strong{color:var(--gx-navy);font-weight:600}
   .gx-hero .gx-hero__sub{font-size:clamp(15px,1.3vw,17px);line-height:1.6;color:#4a5872;margin-top:14px;max-width:560px}
   .gentrix-it-health-check .gx-hero .gx-hero__cta{
   	display:inline-flex;align-items:center;gap:10px;margin-top:clamp(24px,2.6vw,34px);border:0;cursor:pointer;
   	background:linear-gradient(180deg,#22bdea 0%,#12a6da 100%);color:#fff;
   	font:700 clamp(16px,1.4vw,19px) "Plus Jakarta Sans",sans-serif;border-radius:10px;
   	padding:clamp(15px,1.4vw,19px) clamp(22px,2.2vw,30px);
   	box-shadow:0 10px 24px rgba(18,166,218,.28);transition:transform .15s,box-shadow .15s;white-space:nowrap;
   }
   .gentrix-it-health-check .gx-hero .gx-hero__cta:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(18,166,218,.36);color:#fff}
   .gentrix-it-health-check .gx-hero .gx-hero__cta svg{width:20px;height:20px;transition:transform .15s}
   .gentrix-it-health-check .gx-hero .gx-hero__cta:hover svg{transform:translateX(3px)}
   .gx-hero .gx-hero__trust{display:flex;flex-wrap:wrap;gap:12px clamp(12px,1.5vw,26px);margin-top:clamp(26px,2.8vw,36px);list-style:none}
   .gx-hero .gx-hero__trust li{display:flex;align-items:center;gap:7px;font-size:clamp(12px,.92vw,14.5px);white-space:nowrap;font-weight:500;color:var(--gx-navy);list-style:none;  text-transform: capitalize;}
   .gentrix-it-health-check .gx-hero .gx-hero__trust svg{color:var(--gx-navy);flex-shrink:0;width:1.45em;height:1.45em}

   .gx-hero .gx-hero__visual{position:relative;padding:4% 0 12%}
   .gentrix-it-health-check .gx-hero .gx-hero__sparks{position:absolute;right:2%;top:-2%;width:clamp(48px,5vw,72px);color:var(--gx-cyan-2)}
   .gx-hero .gx-laptop{position:relative;width:100%;max-width:640px;margin:0 auto;container-type:inline-size}
   .gx-hero .gx-laptop__lid{background:#1d2027;border-radius:3.2cqw 3.2cqw 0 0;padding:2.6cqw 2.6cqw 3cqw;box-shadow:0 2cqw 5cqw rgba(15,35,65,.18)}
   .gx-hero .gx-laptop__screen{background:linear-gradient(180deg,#f7fbff 0%,#eef6fc 100%);border-radius:.8cqw;aspect-ratio:16/10;padding:4.2cqw 4.6cqw;display:flex;flex-direction:column;overflow:hidden}
   .gx-hero .gx-laptop__base{position:relative;height:3.2cqw;margin:0 -6%;background:linear-gradient(180deg,#e9ecf0 0%,#c9ced6 55%,#9ea5af 100%);border-radius:0 0 4cqw 4cqw/0 0 2.6cqw 2.6cqw;box-shadow:0 2.4cqw 3cqw -1cqw rgba(15,35,65,.35)}
   .gx-hero .gx-laptop__base::before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:17%;height:1.1cqw;background:#b4bac3;border-radius:0 0 1.2cqw 1.2cqw}

   .gx-hero .gx-rep__head{display:flex;justify-content:space-between;align-items:center}
   .gx-hero .gx-rep__logo{display:flex;align-items:center;gap:1.2cqw}
   .gentrix-it-health-check .gx-hero .gx-rep__logo svg{width:5.6cqw;height:5.6cqw;color:var(--gx-cyan)}
   .gx-hero .gx-rep__brand{font-weight:800;font-size:3.1cqw;letter-spacing:.06em;color:var(--gx-navy);line-height:1}
   .gx-hero .gx-rep__brand small{display:block;font-size:1.45cqw;font-weight:700;letter-spacing:.18em;color:var(--gx-cyan);margin-top:.4cqw;text-align:center}
   .gx-hero .gx-rep__label{font-size:2.5cqw;font-weight:700;color:var(--gx-navy)}
   .gx-hero .gx-rep__rule{height:1px;background:#dde7f0;margin:2.4cqw -4.6cqw 0}
   .gx-hero .gx-rep__body{flex:1;display:grid;grid-template-columns:38% 1fr;gap:4cqw;align-items:center;padding-top:1cqw}
   .gx-hero .gx-ring{position:relative;width:100%;aspect-ratio:1}
   .gentrix-it-health-check .gx-hero .gx-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
   .gx-hero .gx-ring__track{fill:none;stroke:#e6edf3;stroke-width:9}
   .gx-hero .gx-ring__val{fill:none;stroke:url(#gx-ring-grad);stroke-width:9;stroke-linecap:round;stroke-dasharray:0 302;animation:gx-ring 1.4s .3s cubic-bezier(.2,.8,.2,1) forwards}
   @keyframes gx-ring{to{stroke-dasharray:var(--gx-dash) 302}}
   .gx-hero .gx-ring__txt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
   .gentrix-it-health-check .gx-hero .gx-ring__num{font-size:6cqw;font-weight:800;color:var(--gx-navy);line-height:1}
   .gentrix-it-health-check .gx-hero .gx-ring__cap{font-size:1.6cqw;font-weight:500;color:#45556e;margin-top:1cqw}
   .gx-hero .gx-res__title{font-size:3.4cqw;font-weight:800;color:var(--gx-navy)}
   .gentrix-it-health-check .gx-hero .gx-res__note{font-size:1.75cqw;line-height:1.45;color:#3a4a62;margin-top:1cqw;max-width:34cqw}
   .gx-hero .gx-res__list{list-style:none;margin-top:2.2cqw;display:flex;flex-direction:column;gap:1.9cqw}
   .gx-hero .gx-res__row{display:grid;grid-template-columns:2.6cqw 18cqw 1fr;align-items:center;gap:1.4cqw;font-size:1.65cqw;font-weight:600;color:var(--gx-navy);list-style:none}
   .gentrix-it-health-check .gx-hero .gx-res__row svg{width:2.6cqw;height:2.6cqw}
   .gx-hero .gx-res__bar{height:.9cqw;border-radius:1cqw;background:#e1e8ef;overflow:hidden}
   .gentrix-it-health-check .gx-hero .gx-res__bar span{display:block;height:100%;width:0;border-radius:inherit;animation:gx-bar 1.1s .5s cubic-bezier(.2,.8,.2,1) forwards}
   .gx-hero .gx-res__bar--ok span{background:var(--gx-green)}
   .gx-hero .gx-res__bar--warn span{background:var(--gx-amber)}
   @keyframes gx-bar{to{width:var(--gx-w)}}

   .gx-hero .gx-hero__note{position:absolute;right:4%;bottom:-2%;display:flex;align-items:flex-end;gap:6px;font-family:"Caveat",cursive;font-size:clamp(18px,1.9vw,25px);font-weight:600;line-height:1.1;color:var(--gx-navy);transform:rotate(-4deg)}
   .gentrix-it-health-check .gx-hero .gx-hero__note span{font-family:"Caveat",cursive}
   .gentrix-it-health-check .gx-hero .gx-hero__note svg{width:clamp(40px,4.4vw,58px);flex-shrink:0;margin-bottom:.9em;color:var(--gx-navy)}

   @media (prefers-reduced-motion:reduce){
   	.gx-hero .gx-ring__val{animation:none;stroke-dasharray:var(--gx-dash) 302}
   	.gentrix-it-health-check .gx-hero .gx-res__bar span{animation:none;width:var(--gx-w)}
   }
   @media (max-width:900px){
   	.gx-hero .gx-hero__wrap{grid-template-columns:1fr}
   	.gx-hero .gx-hero__blob{right:-20%;top:auto;bottom:-6%;width:120%;height:55%}
   	.gx-hero .gx-hero__visual{padding:6% 0 16%}
   	.gx-hero .gx-laptop__base{margin:0 -3%}
   }
   @media (max-width:480px){
   	.gx-hero .gx-hero__mark{white-space:normal}
   	.gentrix-it-health-check .gx-hero .gx-hero__cta{width:100%;justify-content:center;white-space:normal}
   	.gx-hero .gx-hero__trust{flex-direction:column;gap:12px}
   }
