body.lfam-nameoverview-page {
	background: #f2f0eb !important;
	color: #4d5b63 !important;
}

body.lfam-nameoverview-page *,
body.lfam-nameoverview-page *::before,
body.lfam-nameoverview-page *::after {
	box-sizing: border-box;
}

.lfam-nameoverview-wrap {
	width: min(1080px, calc(100% - 42px));
	margin: 28px auto 60px;
}

.lfam-nameoverview-hero {
	margin-bottom: 18px;
	padding: 34px 32px;
	border: 1px solid #e7dfd6;
	border-radius: 24px;
	background:
		radial-gradient(circle at 10% 0%, rgba(205,163,79,.16), transparent 35%),
		radial-gradient(circle at 90% 100%, rgba(47,135,152,.10), transparent 40%),
		linear-gradient(180deg, #fffefa, #f8f4ed);
	box-shadow: 0 14px 34px rgba(36,55,70,.075);
	text-align: center;
}

.lfam-nameoverview-kicker {
	display: inline-flex;
	margin-bottom: 11px;
	padding: 6px 13px;
	border: 1px solid rgba(205,163,79,.28);
	border-radius: 999px;
	background: rgba(255,255,255,.72);
	color: #a37b2e;
	font-size: 7px;
	font-weight: 900;
	letter-spacing: .18em;
	text-transform: uppercase;
}

.lfam-nameoverview-hero h1 {
	margin: 0;
	color: #243746;
	font-family: Georgia, serif;
	font-size: clamp(31px, 4vw, 42px);
	letter-spacing: .04em;
}

.lfam-nameoverview-hero p {
	max-width: 660px;
	margin: 12px auto 0;
	color: #7d8b90;
	font-size: 10px;
	line-height: 1.7;
}

.lfam-nameoverview-panel {
	padding: 18px;
	border: 1px solid #e7dfd6;
	border-radius: 22px;
	background: #fffdfb;
	box-shadow: 0 14px 34px rgba(36,55,70,.07);
}

.name_desc {
	margin-bottom: 16px;
	padding: 13px 16px;
	border: 1px solid rgba(47,135,152,.13);
	border-radius: 15px;
	background: #f1f8f9;
	color: #65767b;
	font-size: 10px;
	line-height: 1.65;
	text-align: center;
}

.name_flexbox {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0,1fr)) !important;
	gap: 0 !important;
	overflow: hidden;
	border: 1px solid #e7dfd6;
	border-radius: 18px;
	background: #fffefa;
}

.name_flexbox:has(.name_top_divers) {
	grid-template-columns: repeat(4, minmax(0,1fr)) !important;
}

.name_top,
.name_top_divers {
	padding: 13px 10px !important;
	border-right: 1px solid rgba(47,135,152,.10) !important;
	border-bottom: 1px solid rgba(47,135,152,.14) !important;
	background: linear-gradient(180deg, #eef8f9, #e8f3f4) !important;
	color: #236b78 !important;
	font-size: 8px !important;
	font-weight: 900 !important;
	letter-spacing: .12em !important;
	text-align: center !important;
	text-transform: uppercase !important;
}

.name_alphabet {
	grid-column: 1 / -1;
	padding: 9px 12px !important;
	border-top: 1px solid #e7dfd6 !important;
	border-bottom: 1px solid #e7dfd6 !important;
	background: linear-gradient(90deg, #f8f3e8, #f1e5cb, #f8f3e8) !important;
	color: #967028 !important;
	font-size: 8px !important;
	font-weight: 900 !important;
	letter-spacing: .18em !important;
	text-align: center !important;
	text-transform: uppercase !important;
}

.name_list,
.name_list_divers {
	min-height: 92px;
	padding: 12px !important;
	border-right: 1px solid #eee7df !important;
	border-bottom: 1px solid #eee7df !important;
	background: #fffdfb !important;
	color: #4d5b63 !important;
}

.name {
	display: block;
	margin-bottom: 6px;
	padding: 7px 10px;
	border: 1px solid #eee7df;
	border-radius: 12px;
	background: #faf8f4;
	color: #243746;
	font-size: 9px;
	font-weight: 800;
	line-height: 1.35;
}

.name a {
	color: #236b78 !important;
	text-decoration: none !important;
}

.name a:hover {
	color: #2f8798 !important;
}

@media (max-width: 760px) {
	.lfam-nameoverview-wrap {
		width: calc(100% - 20px);
	}
	.name_flexbox,
	.name_flexbox:has(.name_top_divers) {
		display: block !important;
	}
	.name_top,
	.name_top_divers {
		display: none;
	}
	.name_alphabet,
	.name_list,
	.name_list_divers {
		display: block;
		width: 100%;
	}
}