/* Care Agency Calculator — front-end styles.
   All colours and fonts come from CSS variables set inline on .cac-root,
   which are driven by the admin settings. Selectors are namespaced under
   .cac-root so the styles never leak into the host theme. */

.cac-root {
	box-sizing: border-box;
	color: var(--cac-ink);
	font-family: var(--cac-body);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}
.cac-root *,
.cac-root *::before,
.cac-root *::after { box-sizing: border-box; }

.cac-heading {
	font-family: var(--cac-display);
	font-weight: 600;
	letter-spacing: -0.01em;
	font-size: clamp(24px, 4vw, 33px);
	line-height: 1.15;
	margin: 0 0 14px;
	color: var(--cac-ink);
}
.cac-intro {
	font-size: 17px;
	color: var(--cac-slate);
	max-width: 680px;
	margin: 0 0 28px;
}

.cac-calc {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 28px;
	background: #fff;
	border: 0.5px solid var(--cac-stone);
	border-radius: 20px;
	padding: 34px;
}

.cac-field { margin-bottom: 18px; }
.cac-field:last-child { margin-bottom: 0; }
.cac-field label {
	font-family: var(--cac-display);
	font-weight: 600;
	font-size: 14px;
	display: block;
	margin-bottom: 6px;
	color: var(--cac-ink);
}
.cac-hint {
	font-size: 12px;
	color: var(--cac-slate);
	font-weight: 400;
}
.cac-field input[type="range"] {
	width: 100%;
	accent-color: var(--cac-gold);
	margin: 0;
}
.cac-num-in {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 6px;
}
.cac-num-in span {
	font-family: var(--cac-mono);
	font-size: 14px;
	color: var(--cac-ink);
	min-width: 74px;
}

.cac-out {
	background: var(--cac-ink);
	color: var(--cac-on-ink);
	border-radius: 16px;
	padding: 26px;
}
.cac-out .cac-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 13px 0;
	border-bottom: 0.5px solid rgba(255, 255, 255, 0.12);
}
.cac-out .cac-row:last-child { border-bottom: none; }
.cac-lbl {
	font-size: 14px;
	color: var(--cac-on-ink-muted);
	max-width: 62%;
}
.cac-val {
	font-family: var(--cac-display);
	font-weight: 600;
	font-size: 22px;
	color: var(--cac-on-ink);
}
.cac-val.cac-gold { color: var(--cac-gold); }

.cac-muted {
	color: var(--cac-slate);
	font-size: 13px;
	margin: 14px 0 0;
}

@media (max-width: 820px) {
	.cac-root { font-size: 15px; }

	.cac-calc {
		grid-template-columns: 1fr;
		gap: 18px;
		padding: 20px;
		border-radius: 16px;
	}

	.cac-field { margin-bottom: 14px; }
	.cac-field label { font-size: 13px; }
	.cac-hint { font-size: 11px; }
	.cac-num-in { margin-top: 4px; }
	.cac-num-in span { font-size: 13px; min-width: 62px; }

	.cac-out {
		padding: 18px;
		border-radius: 14px;
	}
	.cac-out .cac-row { padding: 10px 0; }
	.cac-lbl { font-size: 13px; }
	.cac-val { font-size: 18px; }
}

@media (max-width: 480px) {
	.cac-calc { padding: 16px; }
	.cac-out { padding: 16px; }
	.cac-lbl { font-size: 12.5px; max-width: 58%; }
	.cac-val { font-size: 17px; }
}