.grls-calc {
	--gr-navy: #0B2545;
	--gr-red: #C8102E;
	--gr-line: #d9e2ec;
	font-family: Roboto, system-ui, sans-serif;
	background: #fff;
	border: 1px solid var(--gr-line);
	border-radius: 14px;
	padding: 28px;
}

.grls-calc__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 20px;
}

.grls-calc__field { display: flex; flex-direction: column; gap: 8px; }
.grls-calc__field > span { font-size: 15px; font-weight: 600; color: var(--gr-navy); }
.grls-calc__field b { color: var(--gr-red); }

.grls-calc select,
.grls-calc input[type="number"] {
	font: inherit;
	font-size: 17px;
	padding: 11px 12px;
	border: 1px solid var(--gr-line);
	border-radius: 8px;
	background: #fff;
	color: var(--gr-navy);
	width: 100%;
}

.grls-calc input[type="range"] { width: 100%; accent-color: var(--gr-red); height: 28px; }

.grls-calc__result { margin-top: 24px; }

.grls-r { border-radius: 12px; padding: 22px; border-left: 6px solid; }
.grls-r--repair       { background: #eefaf1; border-color: #1a8f4c; }
.grls-r--lean-repair  { background: #f2faf4; border-color: #4aa96c; }
.grls-r--lean-replace { background: #fff8ec; border-color: #d98324; }
.grls-r--replace      { background: #fdf0f2; border-color: var(--gr-red); }

.grls-r__verdict { font-size: 22px; font-weight: 700; color: var(--gr-navy); margin-bottom: 6px; }
.grls-r__why { font-size: 17px; line-height: 1.6; color: #33475b; margin: 0 0 16px; }

.grls-r__nums {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 12px;
	border-top: 1px solid rgba(11, 37, 69, .12);
	padding-top: 14px;
}
.grls-r__nums span { display: block; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: #62778c; }
.grls-r__nums b { font-size: 19px; color: var(--gr-navy); }

.grls-r__worst,
.grls-r__energy { font-size: 15px; color: #52616b; margin: 14px 0 0; }
.grls-r__energy { font-weight: 600; color: var(--gr-navy); }

/* Click-to-call bar */
.grls-callbar {
	font-family: Roboto, system-ui, sans-serif;
	display: flex; align-items: center; justify-content: center;
	gap: 18px; flex-wrap: wrap;
	background: #0B2545; color: #fff;
	padding: 16px 22px; border-radius: 12px;
}
.grls-callbar__txt { font-size: 18px; font-weight: 500; }
.grls-callbar__btn {
	display: inline-flex; align-items: center; gap: 10px;
	background: #C8102E; color: #fff !important;
	font-size: 20px; font-weight: 700; text-decoration: none;
	padding: 14px 26px; border-radius: 999px;
	min-height: 56px; /* comfortable tap target */
	transition: transform .12s ease, background .12s ease;
}
.grls-callbar__btn:hover { background: #a50d26; transform: translateY(-1px); }

@media (max-width: 640px) {
	.grls-calc { padding: 20px; }
	.grls-callbar { flex-direction: column; gap: 12px; }
	.grls-callbar__btn { width: 100%; justify-content: center; }
}