.quote-configurator { display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; gap: 40px; }
.quote-configurator__field { padding: 26px 0; border-bottom: 1px solid var(--color-line); }
.quote-configurator__field:first-child { padding-top: 0; }
.quote-configurator__field h2 { display: flex; align-items: baseline; gap: 12px; margin: 0 0 14px; font-size: 20px; font-weight: 600; }
.quote-configurator__field small { color: var(--color-muted); font-size: 12px; font-weight: 400; }
.quote-configurator__field .quote-configurator__required { color: #b43b3b; font-weight: 600; }
.quote-configurator__field p { margin: 0 0 14px; color: var(--color-muted); font-size: 14px; }
.quote-configurator__field select, .quote-configurator__field input[type="text"] { max-width: 100%; min-height: 44px; padding: 9px 12px; border-radius: 4px; font-size: 15px; }
.quote-configurator__summary { position: sticky; top: 100px; padding: 24px; border: 1px solid var(--color-line); border-radius: 4px; background: #fff; }
.quote-configurator__summary h2 { margin: 0 0 20px; font-size: 20px; font-weight: 600; }
.quote-configurator__summary dl { margin: 0 0 24px; }
.quote-configurator__summary dl > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--color-line); font-size: 14px; }
.quote-configurator__summary dt { color: var(--color-muted); overflow-wrap: anywhere; }
.quote-configurator__summary dd { margin: 0; text-align: right; overflow-wrap: anywhere; }
.quote-configurator__summary p { font-size: 13px; }
.quote-configurator__summary [data-option-status][data-state="error"] { color: #b43b3b; font-weight: 600; }
.quote-configurator__note, .quote-configurator__empty { color: var(--color-muted); }
.quote-configurator__errors { color: #a12e2e; font-size: 13px; }
.quote-configurator__field input[type="file"] { max-width: 100%; font: inherit; font-size: 14px; }
.quote-configurator__deadline { margin-top: 18px; }
.quote-configurator__deadline label { display: block; margin-bottom: 8px; font-size: 14px; }
.quote-configurator__deadline input { min-height: 44px; padding: 9px 12px; border-radius: 4px; }
.quote-configurator__files { margin: 0; padding: 0; list-style: none; overflow-wrap: anywhere; font-size: 14px; }
.quote-upload { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 18px; padding: 28px 24px; border: 1px dashed #b7c6d8; border-radius: 4px; background: #fff; }
.quote-upload__icon { display: grid; place-items: center; color: var(--color-primary); }
.quote-upload__copy { min-width: 0; }
.quote-upload__copy strong { display: block; color: var(--color-text); font-size: 15px; font-weight: 500; }
.quote-upload__copy > span { display: block; margin-top: 6px; color: var(--color-muted); font-size: 12px; }
.quote-upload__choose { display: none; padding: 10px 16px; border-radius: 4px; background: #353535; color: #fff; font-size: 13px; white-space: nowrap; }
.quote-upload__input { grid-column: 1 / -1; }
.quote-upload--enhanced .quote-upload__input { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; opacity: 0; cursor: pointer; }
.quote-upload--enhanced .quote-upload__choose { display: inline-flex; }
.quote-upload:focus-within { outline: 2px solid var(--color-primary); outline-offset: 0; }
.quote-upload[data-dragging="true"] { border-style: solid; border-color: var(--color-primary); background: var(--color-soft-blue); }
.quote-configurator__field .quote-upload__hint { margin: 12px 0 4px; font-size: 12px; line-height: 1.7; }
.quote-configurator__errors [data-quote-file-error] { margin: 8px 0; color: inherit; font-size: 13px; }
.quote-upload-file { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--color-line); }
.quote-upload-file__type { display: grid; place-items: center; min-height: 36px; border-radius: 3px; background: var(--color-soft-blue); color: var(--color-primary); font-size: 10px; font-weight: 600; }
.quote-upload-file__info { min-width: 0; }
.quote-upload-file__info strong { display: block; font-size: 14px; font-weight: 500; overflow-wrap: anywhere; }
.quote-upload-file__info > span { display: block; margin-top: 4px; color: var(--color-muted); font-size: 12px; }
.quote-upload-file__remove { min-height: 36px; padding: 6px 10px; border: 1px solid var(--color-line); border-radius: 4px; background: transparent; color: #5d6570; font: inherit; font-size: 12px; cursor: pointer; }
.quote-upload-file__remove:is(:hover, :focus-visible) { border-color: #b43b3b; color: #b43b3b; }
@media (max-width: 560px) { .quote-upload { grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding: 22px 16px; }.quote-upload__choose { grid-column: 2; justify-self: start; }.quote-upload-file { gap: 10px; } }
.quote-configurator__button { text-decoration: none; }
.quote-receipt { max-width: 850px; }
.quote-receipt h2 { margin-top: 32px; font-size: 20px; }
.quote-receipt dl > div { display: flex; flex-wrap: wrap; gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--color-line); }
.quote-receipt dd { margin: 0; }
.quote-receipt li { padding: 8px 0; overflow-wrap: anywhere; }
.quote-receipt li a { text-decoration: underline; text-underline-offset: 4px; }
.quote-receipt__message { overflow-wrap: anywhere; line-height: 1.9; }
.quote-attachments h2 small { margin-left: 8px; color: var(--color-muted); font-size: 13px; font-weight: 400; }
.quote-attachments__list { margin: 16px 0 0; padding: 0; list-style: none; }
.quote-receipt .quote-attachments__item { padding: 0; margin-bottom: 10px; }
.quote-receipt .quote-attachments__link { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 16px 18px; border: 1px solid var(--color-line); border-radius: 4px; background: #fff; text-decoration: none; }
.quote-attachments__icon { display: grid; place-items: center; width: 40px; height: 44px; border-radius: 3px; background: var(--color-soft-blue); color: var(--color-primary); }
.quote-attachments__info { min-width: 0; }
.quote-attachments__info strong { display: block; font-size: 14px; font-weight: 500; overflow-wrap: anywhere; }
.quote-attachments__info > span { display: block; margin-top: 4px; color: var(--color-muted); font-size: 12px; }
.quote-attachments__action { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 12px; border-radius: 4px; background: #353535; color: #fff; font-size: 12px; white-space: nowrap; }
.quote-attachments__link:is(:hover, :focus-visible) .quote-attachments__info strong { text-decoration: underline; text-underline-offset: 4px; }
.quote-attachments__link:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.quote-attachments__link:active .quote-attachments__action { transform: translateY(1px); }
.quote-attachments__empty { color: var(--color-muted); font-size: 14px; }
@media (max-width: 560px) { .quote-receipt .quote-attachments__link { grid-template-columns: 36px minmax(0, 1fr); gap: 10px; padding: 14px; }.quote-attachments__icon { width: 36px; }.quote-attachments__action { grid-column: 2; justify-self: start; } }
.quote-receipt .quote-configurator__button { width: auto; margin-top: 32px; }
.quote-configurator__button { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; padding: 10px 18px; border: 1px solid #353535; border-radius: 4px; background: #353535; color: #fff; font: inherit; font-size: 14px; cursor: pointer; transition: transform 100ms ease; }
.quote-configurator__button:active { transform: translateY(1px) scale(.97); }
.quote-configurator__button:focus-visible { outline: 2px solid #353535; outline-offset: 3px; }
@media (max-width: 850px) { .quote-configurator { grid-template-columns: minmax(0, 1fr); gap: 28px; }.quote-configurator__summary { position: static; } }

@layer reference {
.quote-layout {
	align-items: start;
}

.quote-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, 360px);
	gap: 24px;
	align-items: start;
}

.quote-board {
	display: grid;
	gap: 18px;
}

.quote-step {
	padding: 24px;
	border: 1px solid var(--color-line);
	border-radius: var(--radius-md);
	background: rgba(255, 255, 255, 0.78);
	box-shadow: var(--shadow-sm);
	opacity: 0.58;
	transition: opacity 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.quote-step.is-active,
.quote-step.is-complete {
	opacity: 1;
}

.quote-step.is-active {
	border-color: rgb(var(--color-primary-rgb, 36 84 255) / 0.28);
	box-shadow: var(--shadow-md);
}

.quote-step-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}

.quote-step-title span,
.quote-summary-header span {
	color: var(--color-primary);
	font-size: 12px;
	font-weight: 900;
	letter-spacing: 0;
}

.quote-step-title h2,
.quote-summary-header h2 {
	margin: 0;
	font-size: 24px;
	line-height: 1.2;
	letter-spacing: 0;
}

.quote-options {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}

.quote-options-main {
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.quote-options.compact {
	grid-template-columns: repeat(3, 1fr);
}

.quote-split .quote-options.compact {
	grid-template-columns: 1fr;
}

.quote-option {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	min-height: 76px;
	padding: 15px;
	border: 1px solid var(--color-line);
	border-radius: 16px;
	background: #fff;
	color: var(--color-text);
	font-weight: 900;
	text-align: left;
	cursor: pointer;
	transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.quote-option:hover {
	transform: translateY(-2px);
	border-color: rgb(var(--color-primary-rgb, 36 84 255) / 0.28);
	box-shadow: var(--shadow-sm);
}

.quote-option.is-selected {
	border-color: var(--color-primary);
	background: var(--color-soft-blue);
	color: var(--color-primary);
	box-shadow: 0 12px 28px rgb(var(--color-primary-rgb, 36 84 255) / 0.12);
}

.quote-option strong {
	font-size: 16px;
	font-weight: 900;
}

.quote-option span {
	margin-top: 4px;
	color: var(--color-muted);
	font-size: 13px;
}

.quote-option.is-selected span {
	color: var(--color-primary);
}

.quote-empty {
	grid-column: 1 / -1;
	margin: 0;
	padding: 20px;
	border: 1px dashed var(--color-line);
	border-radius: 16px;
	background: #fff;
	color: var(--color-muted);
	font-weight: 800;
	text-align: center;
}

.quote-split {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
}

.quote-split h3 {
	margin: 0 0 10px;
	font-size: 16px;
}

.quote-summary {
	position: sticky;
	top: 98px;
	padding: 26px;
	border: 1px solid rgba(228, 232, 240, 0.92);
	border-radius: var(--radius-md);
	background: #fff;
	box-shadow: var(--shadow-md);
}

.quote-summary-header {
	margin-bottom: 20px;
}

.quote-summary dl {
	display: grid;
	gap: 12px;
	margin: 0;
}

.quote-summary dl div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--color-line);
}

.quote-summary dt {
	color: var(--color-muted);
	font-size: 13px;
	font-weight: 800;
}

.quote-summary dd {
	margin: 0;
	color: var(--color-text);
	font-size: 14px;
	font-weight: 900;
	text-align: right;
}

.quote-summary p {
	margin: 18px 0;
	color: var(--color-muted);
	font-size: 14px;
}

.quote-detail-section {
	padding-top: 56px;
}

.quote-detail-layout {
	display: grid;
	grid-template-columns: minmax(0, 880px);
	justify-content: center;
}

.quote-detail-card {
	padding: 34px;
	border: 1px solid var(--color-line);
	border-radius: var(--radius-md);
	background: #fff;
	box-shadow: var(--shadow-sm);
}

.quote-detail-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--color-line);
}

.quote-detail-header h1 {
	margin: 14px 0 8px;
	font-size: clamp(28px, 4vw, 42px);
	line-height: 1.18;
	letter-spacing: 0;
}

.quote-detail-header p {
	margin: 0;
	color: var(--color-muted);
}

.quote-detail-header time {
	color: var(--color-muted);
	font-size: 14px;
	font-weight: 800;
	white-space: nowrap;
}

.quote-detail-section-block {
	padding: 28px 0;
	border-bottom: 1px solid var(--color-line);
}

.quote-detail-section-block h2 {
	margin: 0 0 16px;
	font-size: 22px;
	letter-spacing: 0;
}

.quote-detail-section-block p {
	margin: 0;
	color: var(--color-muted);
}

.quote-detail-specs {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
	margin: 0;
}

.quote-detail-specs div {
	padding: 16px;
	border: 1px solid var(--color-line);
	border-radius: 14px;
	background: var(--color-bg);
}

.quote-detail-specs dt {
	margin-bottom: 6px;
	color: var(--color-muted);
	font-size: 13px;
	font-weight: 800;
}

.quote-detail-specs dd {
	margin: 0;
	color: var(--color-text);
	font-weight: 900;
}

@media (max-width: 900px) {
.quote-form,
.quote-detail-layout {
		grid-template-columns: 1fr;
	}

.quote-summary {
		position: static;
	}

}

@media (max-width: 640px) {
.quote-detail-specs {
		grid-template-columns: 1fr;
	}

.quote-detail-header {
		flex-direction: column;
	}

.quote-step-title {
		flex-direction: column;
		grid-template-columns: 1fr;
	}

.quote-step {
		padding: 20px;
	}

.quote-options,
.quote-options.compact,
.quote-split {
		grid-template-columns: 1fr;
	}

.quote-summary dl div {
		align-items: flex-start;
		flex-direction: column;
		gap: 4px;
	}

.quote-summary dd {
		text-align: left;
	}

.quote-detail-card {
		padding: 24px;
	}

}

}