/* =========================================================
 * Tech Resolve — Website Redesign Audit
 * Version: 4.0.0
 * Editorial Audit System
 * ======================================================= */
/* =========================================================
 * Section
 * ======================================================= */
.tr-redesign-audit {
	position: relative;
	overflow: hidden;
	padding: clamp(105px, 10vw, 175px) var(--tr-gutter);
	color: #0d1a13;
	background: #f3f5f1;
}
.tr-redesign-audit::before {
	content: "";
	position: absolute;
	top: -260px;
	right: -240px;
	width: 680px;
	height: 680px;
	background: radial-gradient(circle, rgba(25, 224, 120, 0.07), transparent 68%);
	pointer-events: none;
}
/* =========================================================
 * Shell
 * ======================================================= */
.tr-redesign-audit__shell {
	position: relative;
	z-index: 2;
	width: min(100%, var(--tr-container));
	margin: 0 auto;
}
/* =========================================================
 * Header
 * ======================================================= */
.tr-redesign-audit__header {
	display: grid;
	grid-template-columns: minmax(0, 1.12fr) minmax(330px, 0.88fr);
	align-items: end;
	gap: clamp(50px, 8vw, 120px);
	margin-bottom: clamp(65px, 8vw, 105px);
}
.tr-redesign-audit__eyebrow {
	display: block;
	margin-bottom: 17px;
	color: var(--tr-green-deep);
	font-size: var(--tr-text-ui);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
	letter-spacing: 0.15em;
}
.tr-redesign-audit__heading h2 {
	max-width: 900px;
	margin: 0;
	color: #0d1a13;
	font-size: clamp(43px, 5.2vw, 74px);
	font-weight: var(--tr-weight-bold);
	line-height: 0.99;
	letter-spacing: -0.053em;
}
.tr-redesign-audit__intro > p {
	max-width: 580px;
	margin: 0;
	color: #68746d;
	font-size: var(--tr-text-body);
	font-weight: var(--tr-weight-body);
	line-height: var(--tr-line-body);
}
.tr-redesign-audit__human-note {
	display: grid;
	grid-template-columns: 30px minmax(0, 1fr);
	align-items: center;
	gap: 12px;
	margin-top: 24px;
	padding-top: 16px;
	border-top: 1px solid #d9e0dc;
}
.tr-redesign-audit__human-note > span {
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	color: var(--tr-green-deep);
	border: 1px solid rgba(8, 185, 93, 0.22);
	border-radius: 50%;
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
}
.tr-redesign-audit__human-note p {
	margin: 0;
	color: #66736c;
	font-size: var(--tr-text-card);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-card);
}
/* =========================================================
 * Workspace
 * ======================================================= */
.tr-redesign-audit__workspace {
	display: grid;
	grid-template-columns: minmax(0, 1.02fr) minmax(390px, 0.98fr);
	align-items: stretch;
	gap: 18px;
}
/* =========================================================
 * Request
 * ======================================================= */
.tr-redesign-audit__request {
	overflow: hidden;
	background: #ffffff;
	border: 1px solid #dfe5e1;
	border-radius: 22px;
	box-shadow: 0 30px 80px rgba(13, 30, 21, 0.07);
}
.tr-redesign-audit__request-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 54px;
	padding: 0 22px;
	border-bottom: 1px solid #e4e9e6;
}
.tr-redesign-audit__request-head > div {
	display: flex;
	align-items: center;
	gap: 8px;
}
.tr-redesign-audit__request-head i {
	width: 6px;
	height: 6px;
	background: var(--tr-green);
	border-radius: 50%;
	box-shadow: 0 0 0 5px rgba(25, 224, 120, 0.08);
}
.tr-redesign-audit__request-head span,
.tr-redesign-audit__request-head strong {
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
	letter-spacing: 0.1em;
}
.tr-redesign-audit__request-head span {
	color: var(--tr-green-deep);
}
.tr-redesign-audit__request-head strong {
	color: #a0aaa4;
}
/* =========================================================
 * Notice
 * ======================================================= */
.tr-redesign-audit__notice {
	display: grid;
	grid-template-columns: 7px minmax(0, 1fr);
	align-items: start;
	gap: 11px;
	margin: 24px;
	padding: 15px;
	background: #f4f7f4;
	border: 1px solid #dce4df;
	border-radius: 10px;
}
.tr-redesign-audit__notice i {
	width: 7px;
	height: 7px;
	margin-top: 7px;
	background: var(--tr-green-deep);
	border-radius: 50%;
}
.tr-redesign-audit__notice--error i {
	background: #a13030;
}
.tr-redesign-audit__notice p {
	margin: 0;
	color: #55635c;
	font-size: var(--tr-text-card);
	font-weight: var(--tr-weight-body);
	line-height: var(--tr-line-card);
}
/* =========================================================
 * Form
 * ======================================================= */
.tr-redesign-audit__form {
	display: grid;
	gap: 20px;
	padding: clamp(24px, 3vw, 38px);
}
.tr-redesign-audit__honeypot {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect(1px, 1px, 1px, 1px) !important;
	white-space: nowrap !important;
}
/* =========================================================
 * Fields
 * ======================================================= */
.tr-redesign-audit__field {
	display: grid;
	gap: 8px;
}
.tr-redesign-audit__field > label,
.tr-redesign-audit__field-heading > label {
	color: #35423b;
	font-size: var(--tr-text-ui);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
}
.tr-redesign-audit__field-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
}
.tr-redesign-audit__field-heading > span {
	color: #98a29c;
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
	letter-spacing: 0.08em;
}
.tr-redesign-audit__field > input,
.tr-redesign-audit__field > textarea,
.tr-redesign-audit__website-control > input {
	width: 100%;
	margin: 0;
	color: #0d1a13;
	background: #f6f8f5;
	border: 1px solid #dce3df;
	border-radius: 9px;
	box-shadow: none;
	font-family: inherit;
	font-size: var(--tr-text-card);
	font-weight: var(--tr-weight-body);
	line-height: var(--tr-line-card);
	transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}
.tr-redesign-audit__field > input,
.tr-redesign-audit__website-control > input {
	min-height: 49px;
	padding: 0 14px;
}
.tr-redesign-audit__field > textarea {
	min-height: 122px;
	padding: 13px 14px;
	resize: vertical;
}
.tr-redesign-audit__field input::placeholder,
.tr-redesign-audit__field textarea::placeholder {
	color: #a3aca7;
}
.tr-redesign-audit__field input:focus,
.tr-redesign-audit__field textarea:focus {
	outline: none;
	background: #ffffff;
	border-color: rgba(8, 185, 93, 0.45);
	box-shadow: 0 0 0 3px rgba(25, 224, 120, 0.08);
}
/* =========================================================
 * Website + PageSpeed
 * ======================================================= */
.tr-redesign-audit__website-control {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px;
}
.tr-redesign-audit .tr-redesign-audit__pagespeed-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 49px;
	padding: 0 16px;
	color: #ffffff;
	background: #07120e;
	border: 1px solid #07120e;
	border-radius: 9px;
	box-shadow: none;
	font-size: var(--tr-text-ui);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
	white-space: nowrap;
	cursor: pointer;
	transition: transform 170ms var(--tr-ease), background 170ms ease;
}
.tr-redesign-audit .tr-redesign-audit__pagespeed-button:hover {
	color: #ffffff;
	background: #10261a;
	transform: translateY(-1px);
}
.tr-redesign-audit__pagespeed-button svg {
	width: 15px;
	height: 15px;
}
.tr-redesign-audit__pagespeed-meta {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 15px;
}
.tr-redesign-audit__pagespeed-meta > span,
.tr-redesign-audit__pagespeed-error {
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-body);
	line-height: var(--tr-line-ui);
}
.tr-redesign-audit__pagespeed-meta > span {
	color: #9ba59f;
}
.tr-redesign-audit__pagespeed-error {
	color: #922b2b;
	font-weight: var(--tr-weight-label);
}
/* =========================================================
 * Submit
 * ======================================================= */
.tr-redesign-audit__submit-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding-top: 5px;
}
.tr-redesign-audit .tr-redesign-audit__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 51px;
	padding: 0 20px;
	color: #06100d;
	background: var(--tr-green);
	border: 1px solid var(--tr-green);
	border-radius: 999px;
	box-shadow: none;
	font-size: var(--tr-text-card);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-card);
	cursor: pointer;
	transition: transform 170ms var(--tr-ease), background 170ms ease;
}
.tr-redesign-audit .tr-redesign-audit__submit:hover {
	color: #06100d;
	background: #35ef8d;
	transform: translateY(-2px);
}
.tr-redesign-audit__submit svg {
	width: 17px;
	height: 17px;
}
.tr-redesign-audit__submit-row p {
	max-width: 230px;
	margin: 0;
	color: #929d97;
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-body);
	line-height: var(--tr-line-ui);
}
/* =========================================================
 * Review
 * ======================================================= */
.tr-redesign-audit__review {
	overflow: hidden;
	color: #ffffff;
	background: #06100d;
	border: 1px solid rgba(255, 255, 255, 0.04);
	border-radius: 22px;
	box-shadow: 0 30px 80px rgba(6, 16, 13, 0.12);
}
.tr-redesign-audit__review-head {
	padding: clamp(30px, 4vw, 48px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.tr-redesign-audit__review-head > span {
	display: block;
	margin-bottom: 12px;
	color: var(--tr-green);
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
	letter-spacing: 0.11em;
}
.tr-redesign-audit__review-head h3 {
	max-width: 560px;
	margin: 0;
	color: #ffffff;
	font-size: clamp(28px, 3vw, 43px);
	font-weight: var(--tr-weight-bold);
	line-height: 1.02;
	letter-spacing: -0.043em;
}
/* =========================================================
 * Review List
 * ======================================================= */
.tr-redesign-audit__review-list {
	display: grid;
}
.tr-redesign-audit__review-item {
	display: grid;
	grid-template-columns: 54px minmax(0, 1fr) 30px;
	align-items: center;
	gap: 17px;
	min-height: 98px;
	padding: 18px clamp(22px, 3vw, 38px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.075);
	transition: background 180ms ease;
}
.tr-redesign-audit__review-item:last-child {
	border-bottom: 0;
}
.tr-redesign-audit__review-item:hover {
	background: linear-gradient(90deg, rgba(25, 224, 120, 0.045), transparent);
}
.tr-redesign-audit__review-id {
	display: grid;
	gap: 4px;
}
.tr-redesign-audit__review-id span,
.tr-redesign-audit__review-id strong {
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
}
.tr-redesign-audit__review-id span {
	color: rgba(255, 255, 255, 0.28);
}
.tr-redesign-audit__review-id strong {
	color: var(--tr-green);
	letter-spacing: 0.06em;
}
.tr-redesign-audit__review-copy h4 {
	margin: 0;
	color: #ffffff;
	font-size: clamp(18px, 1.6vw, 22px);
	font-weight: var(--tr-weight-bold);
	line-height: 1.14;
	letter-spacing: -0.02em;
}
.tr-redesign-audit__review-copy p {
	max-width: 590px;
	margin: 7px 0 0;
	color: rgba(255, 255, 255, 0.48);
	font-size: var(--tr-text-card);
	font-weight: var(--tr-weight-body);
	line-height: var(--tr-line-card);
}
.tr-redesign-audit__review-mark {
	position: relative;
	width: 25px;
	height: 1px;
	background: rgba(255, 255, 255, 0.13);
}
.tr-redesign-audit__review-mark::before {
	content: "";
	position: absolute;
	top: -3px;
	left: 0;
	width: 7px;
	height: 7px;
	background: var(--tr-green);
	border-radius: 50%;
}
/* =========================================================
 * Flow
 * ======================================================= */
.tr-redesign-audit__flow {
	margin-top: clamp(70px, 8vw, 110px);
	border-top: 1px solid #ced7d2;
	border-bottom: 1px solid #ced7d2;
}
.tr-redesign-audit__flow-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 18px 0;
	border-bottom: 1px solid #d8dfdb;
}
.tr-redesign-audit__flow-heading span,
.tr-redesign-audit__flow-heading strong {
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
	letter-spacing: 0.11em;
}
.tr-redesign-audit__flow-heading span {
	color: var(--tr-green-deep);
}
.tr-redesign-audit__flow-heading strong {
	color: #9aa49e;
}
.tr-redesign-audit__flow-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(320px, 1.1fr);
}
/* =========================================================
 * Step
 * ======================================================= */
.tr-redesign-audit__step {
	padding: clamp(28px, 3.5vw, 44px) clamp(20px, 2.8vw, 34px);
	border-right: 1px solid #d8dfdb;
}
.tr-redesign-audit__step-index {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 28px;
}
.tr-redesign-audit__step-index span {
	color: var(--tr-green-deep);
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
}
.tr-redesign-audit__step-index i {
	flex: 1;
	height: 1px;
	background: #d2dad5;
}
.tr-redesign-audit__step h3 {
	margin: 0;
	color: #0d1a13;
	font-size: clamp(20px, 1.8vw, 26px);
	font-weight: var(--tr-weight-bold);
	line-height: 1.1;
	letter-spacing: -0.025em;
}
.tr-redesign-audit__step p {
	margin: 12px 0 0;
	color: #707b75;
	font-size: var(--tr-text-card);
	font-weight: var(--tr-weight-body);
	line-height: var(--tr-line-card);
}
/* =========================================================
 * Outcome
 * ======================================================= */
.tr-redesign-audit__outcome {
	padding: clamp(28px, 3.5vw, 44px) clamp(24px, 3vw, 38px);
	color: #ffffff;
	background: #07120e;
}
.tr-redesign-audit__outcome > span {
	display: block;
	margin-bottom: 11px;
	color: var(--tr-green);
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
	letter-spacing: 0.1em;
}
.tr-redesign-audit__outcome h3 {
	margin: 0;
	color: #ffffff;
	font-size: clamp(24px, 2.5vw, 34px);
	font-weight: var(--tr-weight-bold);
	line-height: 1.05;
	letter-spacing: -0.034em;
}
.tr-redesign-audit__outcome > p {
	margin: 13px 0 0;
	color: rgba(255, 255, 255, 0.52);
	font-size: var(--tr-text-card);
	font-weight: var(--tr-weight-body);
	line-height: var(--tr-line-card);
}
.tr-redesign-audit__outcome-route {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 26px;
	color: rgba(255, 255, 255, 0.35);
	font-size: var(--tr-text-label);
	font-weight: var(--tr-weight-label);
	line-height: var(--tr-line-ui);
	letter-spacing: 0.06em;
}
.tr-redesign-audit__outcome-route i {
	flex: 1;
	height: 1px;
	background: rgba(255, 255, 255, 0.12);
}
.tr-redesign-audit__outcome-route strong {
	color: var(--tr-green);
	font-size: inherit;
	font-weight: inherit;
}
/* =========================================================
 * Medium Desktop
 * ======================================================= */
@media (max-width: 1180px) {
	.tr-redesign-audit__workspace {
		grid-template-columns: minmax(0, 1fr) minmax(360px, 0.9fr);
	}
	.tr-redesign-audit__flow-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.tr-redesign-audit__outcome {
		grid-column: 1 / -1;
	}
}
/* =========================================================
 * Tablet
 * ======================================================= */
@media (max-width: 960px) {
	.tr-redesign-audit__header,
	.tr-redesign-audit__workspace {
		grid-template-columns: 1fr;
	}
	.tr-redesign-audit__flow-grid {
		grid-template-columns: 1fr;
	}
	.tr-redesign-audit__step {
		border-right: 0;
		border-bottom: 1px solid #d8dfdb;
	}
	.tr-redesign-audit__outcome {
		grid-column: auto;
	}
}
/* =========================================================
 * Mobile
 * ======================================================= */
@media (max-width: 700px) {
	.tr-redesign-audit {
		padding: 90px var(--tr-gutter);
	}
	.tr-redesign-audit__header {
		margin-bottom: 58px;
	}
	.tr-redesign-audit__request,
	.tr-redesign-audit__review {
		border-radius: 17px;
	}
	.tr-redesign-audit__request-head {
		align-items: flex-start;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		padding: 13px 18px;
	}
	.tr-redesign-audit__form {
		padding: 24px 20px;
	}
	.tr-redesign-audit__website-control {
		grid-template-columns: 1fr;
	}
	.tr-redesign-audit .tr-redesign-audit__pagespeed-button {
		width: 100%;
	}
	.tr-redesign-audit__field-heading {
		align-items: flex-start;
		flex-direction: column;
		gap: 4px;
	}
	.tr-redesign-audit__pagespeed-meta {
		flex-direction: column;
		gap: 5px;
	}
	.tr-redesign-audit__submit-row {
		align-items: stretch;
		flex-direction: column;
	}
	.tr-redesign-audit .tr-redesign-audit__submit {
		width: 100%;
	}
	.tr-redesign-audit__submit-row p {
		max-width: none;
	}
	.tr-redesign-audit__review-head {
		padding: 28px 21px;
	}
	.tr-redesign-audit__review-item {
		grid-template-columns: 42px minmax(0, 1fr);
		gap: 13px;
		padding: 18px 20px;
	}
	.tr-redesign-audit__review-mark {
		display: none;
	}
	.tr-redesign-audit__flow {
		margin-top: 65px;
	}
	.tr-redesign-audit__flow-heading {
		align-items: flex-start;
		flex-direction: column;
		gap: 7px;
	}
	.tr-redesign-audit__step,
	.tr-redesign-audit__outcome {
		padding: 28px 20px;
	}
	.tr-redesign-audit__outcome-route {
		flex-wrap: wrap;
	}
}
/* =========================================================
 * Reduced Motion
 * ======================================================= */
@media (prefers-reduced-motion: reduce) {
	.tr-redesign-audit .tr-redesign-audit__pagespeed-button,
	.tr-redesign-audit .tr-redesign-audit__submit {
		transition: none;
	}
}/* =========================================================
 * Control Center States
 * ======================================================= */
.tr-redesign-audit--no-glow::before {display: none;}
.tr-redesign-audit__human-note--no-code {grid-template-columns: minmax(0, 1fr);}
.tr-redesign-audit__website-control--single {grid-template-columns: minmax(0, 1fr);}
.tr-redesign-audit__review-item--no-id {grid-template-columns: minmax(0, 1fr) 30px;}
.tr-redesign-audit__review-item--no-mark {grid-template-columns: 54px minmax(0, 1fr);}
.tr-redesign-audit__review-item--no-id.tr-redesign-audit__review-item--no-mark {grid-template-columns: minmax(0, 1fr);}
@media (max-width: 700px) {
	.tr-redesign-audit__review-item--no-id {grid-template-columns: minmax(0, 1fr);}
	.tr-redesign-audit__review-item--no-mark {grid-template-columns: 42px minmax(0, 1fr);}
	.tr-redesign-audit__review-item--no-id.tr-redesign-audit__review-item--no-mark {grid-template-columns: minmax(0, 1fr);}
}