html,
body {
	margin: 0;
	padding: 0;
}

body.customer-page-body {
	min-height: 100vh;
}

.customer-login-body {
	background:
		radial-gradient(circle at top left, rgba(240, 90, 26, 0.12), transparent 28%),
		linear-gradient(180deg, #f6f6fa 0%, #eef1f7 100%);
}

.customer-page-body svg {
	display: block;
	max-width: 100%;
}

.customer-login-panel::before {
	content: "";
	position: absolute;
	inset: auto -80px -120px auto;
	width: 280px;
	height: 280px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.08);
}

.customer-login-panel::after {
	content: "";
	position: absolute;
	inset: 30px auto auto -60px;
	width: 180px;
	height: 180px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.15);
}

.customer-login-input {
	box-shadow: inset 0 1px 2px rgba(23, 57, 85, 0.04);
}

.icon-xl svg {
	width: 52px;
	height: 52px;
}

.icon-lg svg {
	width: 38px;
	height: 38px;
}

.icon-lock svg {
	width: 38px;
	height: 38px;
}

.icon-shield svg {
	width: 26px;
	height: 26px;
}

.icon-eye svg {
	width: 26px;
	height: 26px;
}

.icon-sm svg {
	width: 18px;
	height: 18px;
}

.icon-xs svg {
	width: 17px;
	height: 17px;
}

.customer-scaled-page .icon-xl svg {
	width: 36.4px;
	height: 36.4px;
}

.customer-scaled-page .icon-lg svg,
.customer-scaled-page .icon-lock svg {
	width: 26.6px;
	height: 26.6px;
}

.customer-scaled-page .icon-shield svg,
.customer-scaled-page .icon-eye svg {
	width: 18.2px;
	height: 18.2px;
}

.customer-scaled-page .icon-sm svg {
	width: 12.6px;
	height: 12.6px;
}

.customer-scaled-page .icon-xs svg {
	width: 11.9px;
	height: 11.9px;
}

.blurred-value {
	display: inline-block;
	filter: blur(4px);
	user-select: none;
}

.statement-value {
	display: inline-flex;
	align-items: center;
	gap: 16px;
}

.statement-toggle {
	cursor: pointer;
	padding: 0;
	background: transparent;
	border: 0;
}

.statement-toggle:focus-visible {
	outline: 2px solid #f05a1a;
	outline-offset: 4px;
	border-radius: 999px;
}

.services-layout-grid {
	grid-template-columns: minmax(0, 1fr);
}

.services-card-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (min-width: 1280px) {
	.services-layout-grid {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.services-layout-grid > :first-child {
		grid-column: span 9;
	}

	.services-layout-grid > :last-child {
		grid-column: span 3;
	}

	.services-card-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (max-width: 992px) {
	.services-card-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 768px) {
	.services-card-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.customer-login-shell {
		padding-left: 0;
		padding-right: 0;
	}
}

@media (max-width: 1279px) {
	.statement-cell::before {
		content: attr(data-label);
		display: block;
		margin-bottom: 4px;
		font-size: 0.85rem;
		font-weight: 600;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: #696c72;
	}
}
