/* Калькулятор стоимости (SPEC § 6). Цвета — переменные темы с фолбэками. */

.sc-calc {
	max-width: 560px;
	border: 1px solid var(--c-border, #d9d9de);
	border-radius: var(--radius, 10px);
	padding: 24px;
	margin: 0 auto;
}
.sc-calc__title { margin: 0 0 4px; }
.sc-calc__sub { color: var(--c-muted, #6e6e73); margin: 0 0 20px; font-size: 15px; }

.sc-calc__field { margin-bottom: 18px; border: 0; padding: 0; }
.sc-calc__label { display: block; font-weight: 600; margin-bottom: 6px; }

.sc-calc__area-wrap { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.sc-calc__area {
	font-size: 18px; padding: 10px 12px; width: 140px;
	border: 1px solid var(--c-border, #d9d9de);
	border-radius: var(--radius, 10px);
}
.sc-calc__unit { color: var(--c-muted, #6e6e73); }

.sc-calc__urgency { display: flex; gap: 8px; flex-wrap: wrap; }
.sc-calc__urgency legend { padding: 0; margin-bottom: 6px; }
.sc-calc__urgency label {
	flex: 1 1 140px; border: 1px solid var(--c-border, #d9d9de);
	border-radius: var(--radius, 10px); padding: 10px 12px;
	cursor: pointer; text-align: center; font-size: 14px; user-select: none;
}
.sc-calc__urgency input { position: absolute; opacity: 0; }
.sc-calc__urgency label:has(input:checked) {
	border-color: var(--c-accent, #e3a65c);
	box-shadow: 0 0 0 1px var(--c-accent, #e3a65c);
	font-weight: 600;
}
.sc-calc__urgency small { display: block; color: var(--c-muted, #6e6e73); font-weight: 400; }
/* Видимый фокус для навигации с клавиатуры (радио скрыты) */
.sc-calc__urgency label:has(input:focus-visible) {
	outline: 3px solid var(--c-accent, #e3a65c); outline-offset: 2px;
}

.sc-calc__result { min-height: 64px; margin: 20px 0 6px; }
.sc-calc__price { font-size: 28px; font-weight: 700; }
.sc-calc__hint { color: var(--c-muted, #6e6e73); font-size: 15px; }

.sc-calc__warn {
	background: var(--c-warn-bg, #fff6e5);
	border: 1px solid var(--c-warn-border, #f0c36d);
	border-radius: var(--radius, 10px);
	padding: 10px 14px; font-size: 14px; margin: 10px 0;
}

.sc-calc__cta {
	display: block; width: 100%; margin-top: 14px;
	font-size: 17px; font-weight: 600; padding: 14px;
	border: 0; border-radius: 999px; cursor: pointer;
	background: var(--btn-bg, #171512);
	color: var(--btn-text, #faf7f2);
	transition: transform .2s ease;
}
.sc-calc__cta:hover { transform: translateY(-2px); }

.sc-calc__notes {
	color: var(--c-muted, #6e6e73); font-size: 13px; line-height: 1.5;
	border-top: 1px solid var(--c-border, #d9d9de);
	margin: 16px 0 0; padding: 12px 0 0 18px;
}
.sc-calc__notes li { margin-bottom: 4px; }