.ns-state-ranking-page {
	--rank-ink: #112f2b;
	--rank-green: #0b6b57;
	--rank-green-dark: #075345;
	--rank-mint: #a6decf;
	--rank-blue: #3d70b7;
	--rank-cream: #f6f1e7;
	--rank-paper: #fff;
	--rank-wash: #f3f7f5;
	--rank-line: #d9e3df;
	--rank-muted: #60736e;
	background: var(--rank-wash);
	color: var(--rank-ink);
}

.ns-state-ranking-page .site-content {
	background:
		linear-gradient(90deg, rgba(17, 47, 43, .032) 1px, transparent 1px) 0 0 / 44px 44px,
		var(--rank-wash);
}

.ns-state-ranking-page .content-wrapper { display: block; max-width: none; }

.ns-state-ranking-page .ns-rank {
	width: 100%;
	min-width: 0;
	padding: 0;
	background: transparent;
	font-family: var(--wikipress-font-ui);
}

.ns-rank__shell {
	width: min(1180px, calc(100% - 48px));
	margin: 0 auto;
	padding: 22px 0 88px;
}

.ns-rank-breadcrumbs {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 22px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	color: #73837f;
}

.ns-rank-breadcrumbs a { color: #536b65; }

.ns-rank-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(310px, .75fr);
	align-items: center;
	min-height: 410px;
	overflow: hidden;
	padding: 58px 68px 72px;
	border-top: 5px solid #d29b43;
	border-radius: 4px;
	background: var(--rank-cream);
	box-shadow: 0 18px 42px rgba(26, 50, 45, .11);
}

.ns-rank-hero::before {
	position: absolute;
	width: 430px;
	height: 430px;
	right: -175px;
	top: -205px;
	border: 1px solid rgba(17, 47, 43, .09);
	border-radius: 50%;
	content: '';
}

.ns-rank-hero__copy { position: relative; z-index: 1; max-width: 700px; }

.ns-rank-eyebrow,
.ns-rank-label {
	margin: 0 0 14px;
	font-size: 11px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--rank-green);
}

.ns-rank-eyebrow { display: flex; align-items: center; gap: 10px; }
.ns-rank-eyebrow span { width: 28px; height: 1px; background: currentColor; }

.ns-rank-hero h1 {
	margin: 0;
	padding: 0;
	border: 0;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: clamp(48px, 6vw, 76px);
	font-weight: 400;
	line-height: .98;
	letter-spacing: -.048em;
	color: var(--rank-ink);
}

.ns-rank-hero h1 em { color: var(--rank-green); font-weight: 400; }

.ns-rank-hero__copy > p:last-child {
	max-width: 650px;
	margin: 25px 0 0;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 16px;
	line-height: 1.7;
	color: #4f6660;
}

.ns-podium {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	min-height: 235px;
	padding-top: 45px;
}

.ns-podium::before {
	position: absolute;
	width: 260px;
	height: 260px;
	top: -8px;
	left: 50%;
	border: 1px dashed rgba(11, 107, 87, .22);
	border-radius: 50%;
	content: '';
	transform: translateX(-50%);
}

.ns-podium__item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	width: 104px;
	padding: 14px 7px;
	background: #dceae5;
	color: var(--rank-ink);
}

.ns-podium__item span {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	margin-top: -31px;
	border-radius: 50%;
	background: var(--rank-green);
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 16px;
	color: #fff;
}

.ns-podium__item strong {
	max-width: 92px;
	margin-top: 14px;
	font-size: 11px;
	line-height: 1.25;
	text-align: center;
}

.ns-podium__item--one { height: 164px; background: var(--rank-green); color: #fff; }
.ns-podium__item--one span { background: #d29b43; }
.ns-podium__item--two { height: 125px; }
.ns-podium__item--three { height: 96px; background: #e5dfd1; }

.ns-rank-controls {
	position: relative;
	z-index: 3;
	margin: -18px 24px 0;
	padding: 28px 34px 32px;
	border: 1px solid var(--rank-line);
	border-radius: 4px;
	background: var(--rank-paper);
	box-shadow: 0 16px 36px rgba(18, 49, 43, .09);
}

.ns-rank-controls__top,
.ns-rank-section-heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
}

.ns-rank-controls h2,
.ns-rank-section-heading h2,
.ns-rank-snapshot h2,
.ns-rank-methodology h2,
.ns-rank-next-tool h2 {
	margin: 0;
	font-family: Georgia, 'Times New Roman', serif;
	font-weight: 400;
	letter-spacing: -.025em;
	color: var(--rank-ink);
}

.ns-rank-controls h2 { font-size: 28px; }
.ns-rank-controls__top > p,
.ns-rank-section-heading > p { margin: 0 0 3px; font-size: 12px; color: var(--rank-muted); }

.ns-rank-controls__grid {
	display: grid;
	grid-template-columns: 1.5fr .65fr 1fr 1fr;
	gap: 15px;
	margin-top: 23px;
}

.ns-rank-field { display: grid; gap: 8px; }

.ns-rank-field > span {
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .05em;
	color: #425c56;
}

.ns-rank-field select,
.ns-rank-year {
	width: 100%;
	height: 54px;
	padding: 0 43px 0 15px;
	border: 1px solid #b8cac5;
	border-radius: 3px;
	background-color: #fff;
	font: 750 14px/1 var(--wikipress-font-ui);
	color: var(--rank-ink);
}

.ns-rank-field select { cursor: pointer; }
.ns-rank-field select:hover { border-color: var(--rank-green); }
.ns-rank-year { display: flex; align-items: center; padding-right: 15px; background: #eef4f1; color: #4d625d; }

.ns-rank-field select:focus,
.ns-rank-search input:focus,
.ns-rank-button:focus {
	outline: 3px solid rgba(11, 107, 87, .2);
	outline-offset: 2px;
}

.ns-rank-notice { margin: 28px 0; padding: 14px; border-left: 3px solid #b55345; background: #fff4f1; }

.ns-rank-snapshot {
	display: grid;
	grid-template-columns: 1.55fr .75fr .85fr;
	margin-top: 62px;
	border: 1px solid var(--rank-line);
	background: #fff;
}

.ns-rank-snapshot > div { min-height: 156px; padding: 28px 30px; }
.ns-rank-snapshot > div + div { border-left: 1px solid var(--rank-line); }
.ns-rank-snapshot__lead { background: var(--rank-ink); }
.ns-rank-snapshot__lead .ns-rank-label { color: var(--rank-mint); }

.ns-rank-leader { display: flex; align-items: center; gap: 18px; }

.ns-rank-leader > span {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	flex: 0 0 54px;
	border-radius: 50%;
	background: var(--rank-green);
	font-size: 14px;
	font-weight: 900;
	color: #fff;
}

.ns-rank-snapshot h2 { font-size: 25px; color: #fff; }
.ns-rank-leader strong { display: block; margin-top: 4px; font-family: Georgia, 'Times New Roman', serif; font-size: 19px; font-weight: 400; color: var(--rank-mint); }
.ns-rank-stat { display: flex; flex-direction: column; justify-content: center; }
.ns-rank-stat > span { font-size: 10px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; color: var(--rank-muted); }
.ns-rank-stat strong { margin-top: 7px; font-family: Georgia, 'Times New Roman', serif; font-size: 29px; font-weight: 400; line-height: 1.1; color: var(--rank-ink); }
.ns-rank-stat small { margin-top: 5px; font-size: 10px; color: #778984; }

.ns-rank-chart-section,
.ns-rank-table-section,
.ns-rank-methodology { margin-top: 80px; }

.ns-rank-section-heading h2,
.ns-rank-methodology h2,
.ns-rank-next-tool h2 { font-size: clamp(30px, 4vw, 42px); }

.ns-rank-chart {
	display: grid;
	gap: 4px;
	margin-top: 29px;
	padding: 22px 28px;
	border: 1px solid var(--rank-line);
	background: #fff;
}

.ns-rank-chart__row {
	display: grid;
	grid-template-columns: 32px 170px minmax(120px, 1fr) 88px;
	align-items: center;
	gap: 15px;
	min-height: 47px;
	padding: 4px 0;
	border-bottom: 1px solid #edf1ef;
}

.ns-rank-chart__row:last-child { border-bottom: 0; }
.ns-rank-chart__rank { font-family: Georgia, 'Times New Roman', serif; font-size: 16px; color: #73847f; }
.ns-rank-chart__state { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ns-rank-chart__state b,
.ns-rank-state b { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 50%; background: #e4f0ec; font-size: 9px; letter-spacing: .05em; color: var(--rank-green); }
.ns-rank-chart__state strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.ns-rank-chart__track { display: block; height: 9px; overflow: hidden; border-radius: 10px; background: #edf2f0; }
.ns-rank-chart__track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--rank-green), #2f927c); transition: width .3s ease; }
.ns-rank-chart__row:nth-child(2) .ns-rank-chart__track i { background: linear-gradient(90deg, var(--rank-blue), #6994cd); }
.ns-rank-chart__row:nth-child(3) .ns-rank-chart__track i { background: linear-gradient(90deg, #c1872e, #d8aa61); }
.ns-rank-chart__value { font-family: Georgia, 'Times New Roman', serif; font-size: 15px; text-align: right; color: var(--rank-ink); }

.ns-rank-section-heading--table { align-items: flex-end; }
.ns-rank-actions { display: flex; gap: 8px; }

.ns-rank-search { position: relative; display: block; }
.ns-rank-search svg { position: absolute; left: 12px; top: 50%; width: 16px; height: 16px; fill: none; stroke: #657a74; stroke-width: 1.8; transform: translateY(-50%); }
.ns-rank-search input { width: 175px; height: 42px; padding: 0 12px 0 37px; border: 1px solid #b8cac5; border-radius: 3px; background: #fff; font: 600 12px/1 var(--wikipress-font-ui); color: var(--rank-ink); }

.ns-rank-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	min-height: 42px;
	padding: 0 14px;
	border: 1px solid var(--rank-green);
	border-radius: 3px;
	background: var(--rank-green);
	font: 800 11px/1 var(--wikipress-font-ui);
	color: #fff;
	cursor: pointer;
}

.ns-rank-button:hover { background: var(--rank-green-dark); }
.ns-rank-button--ghost { background: #fff; color: var(--rank-green); }
.ns-rank-button--ghost:hover { background: #eaf5f1; }
.ns-rank-button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ns-rank-result-count { margin: 17px 0 8px; font-size: 11px; color: var(--rank-muted); }

.ns-rank-table-wrap { overflow-x: auto; border: 1px solid var(--rank-line); background: #fff; }

.ns-rank-table {
	width: 100%;
	min-width: 760px;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	font-family: var(--wikipress-font-ui);
}

.ns-rank-table th,
.ns-rank-table td { padding: 14px 18px; border: 0; border-bottom: 1px solid #e8eeec; text-align: left; }
.ns-rank-table thead th { padding-top: 13px; padding-bottom: 13px; background: var(--rank-ink); font-size: 9px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; color: #fff; }
.ns-rank-table tbody tr:last-child th,
.ns-rank-table tbody tr:last-child td { border-bottom: 0; }
.ns-rank-table tbody tr:hover { background: #f7faf9; }
.ns-rank-table__rank { width: 70px; }
.ns-rank-table__rank span { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #cfdbd7; border-radius: 50%; font-family: Georgia, 'Times New Roman', serif; font-size: 13px; color: var(--rank-ink); }
.ns-rank-table tbody tr:nth-child(1) .ns-rank-table__rank span { border-color: #d29b43; background: #fbf4e8; }
.ns-rank-state { display: flex; align-items: center; gap: 11px; }
.ns-rank-state strong { font-size: 13px; color: var(--rank-ink); }
.ns-rank-table__value { font-family: Georgia, 'Times New Roman', serif; font-size: 16px; color: var(--rank-ink); }
.ns-rank-change { display: inline-block; min-width: 64px; padding: 4px 7px; border-radius: 2px; background: #e8f4f0; font-size: 9px; font-weight: 900; text-align: center; color: var(--rank-green); }
.ns-rank-change.is-below { background: #f4f0e8; color: #82652e; }
.ns-rank-table__bar { width: 24%; }
.ns-rank-table__bar > span { display: block; height: 6px; overflow: hidden; border-radius: 6px; background: #edf2f0; }
.ns-rank-table__bar i { display: block; height: 100%; border-radius: inherit; background: var(--rank-green); }
.ns-rank-empty { padding: 32px; border: 1px solid var(--rank-line); background: #fff; text-align: center; color: var(--rank-muted); }

.ns-rank-methodology {
	display: grid;
	grid-template-columns: .7fr 1.3fr;
	gap: 68px;
	padding: 55px 58px;
	border-top: 4px solid #d29b43;
	background: var(--rank-ink);
	color: #fff;
}

.ns-rank-methodology .ns-rank-label { color: var(--rank-mint); }
.ns-rank-methodology h2 { color: #fff; }
.ns-rank-methodology__body > p:first-child { margin: 0 0 28px; font-family: Georgia, 'Times New Roman', serif; font-size: 15px; line-height: 1.7; color: #bdccc8; }
.ns-rank-sources { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ns-rank-sources a { display: flex; flex-direction: column; gap: 4px; padding: 13px 15px; border: 1px solid rgba(255, 255, 255, .14); color: #fff; }
.ns-rank-sources a:hover { border-color: var(--rank-mint); text-decoration: none; }
.ns-rank-sources span { font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #8fa7a1; }
.ns-rank-sources strong { font-size: 10px; color: var(--rank-mint); }
.ns-rank-methodology__note { margin: 23px 0 0; padding-top: 19px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 10px; line-height: 1.6; color: #91a7a1; }

.ns-rank-next-tool {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	margin-top: 24px;
	padding: 34px 42px;
	border: 1px solid var(--rank-line);
	background: #fff;
}

.ns-rank-next-tool h2 { font-size: 28px; }
.ns-rank-next-tool a { flex: 0 0 auto; padding: 13px 18px; border-radius: 3px; background: var(--rank-green); font-size: 12px; font-weight: 900; color: #fff; }
.ns-rank-next-tool a:hover { background: var(--rank-green-dark); text-decoration: none; }

@media (max-width: 930px) {
	.ns-rank-hero { grid-template-columns: 1fr 280px; padding: 50px 44px 66px; }
	.ns-rank-controls__grid { grid-template-columns: 1fr 1fr; }
	.ns-rank-snapshot { grid-template-columns: 1.2fr .8fr; }
	.ns-rank-snapshot > div:nth-child(3) { grid-column: 1 / -1; border-top: 1px solid var(--rank-line); border-left: 0; }
	.ns-rank-section-heading--table { align-items: flex-start; flex-direction: column; }
	.ns-rank-methodology { grid-template-columns: 1fr; gap: 34px; }
}

@media (max-width: 680px) {
	.ns-rank__shell { width: min(100% - 28px, 1180px); padding-top: 14px; }
	.ns-rank-breadcrumbs { margin-bottom: 14px; }
	.ns-rank-hero { display: block; min-height: 0; padding: 38px 25px 44px; }
	.ns-rank-hero h1 { font-size: clamp(43px, 13vw, 59px); }
	.ns-rank-hero__copy > p:last-child { font-size: 15px; }
	.ns-podium { min-height: 183px; margin-top: 26px; transform: scale(.84); transform-origin: bottom center; }
	.ns-rank-controls { margin: -14px 0 0; padding: 25px 20px; }
	.ns-rank-controls__top,
	.ns-rank-section-heading { align-items: flex-start; flex-direction: column; gap: 9px; }
	.ns-rank-controls__grid { grid-template-columns: 1fr 1fr; }
	.ns-rank-field--metric { grid-column: 1 / -1; }
	.ns-rank-field:last-child { grid-column: auto; }
	.ns-rank-snapshot { grid-template-columns: 1fr; margin-top: 48px; }
	.ns-rank-snapshot > div { min-height: 132px; }
	.ns-rank-snapshot > div + div { border-top: 1px solid var(--rank-line); border-left: 0; }
	.ns-rank-snapshot > div:nth-child(3) { grid-column: auto; }
	.ns-rank-chart-section,
	.ns-rank-table-section,
	.ns-rank-methodology { margin-top: 60px; }
	.ns-rank-chart { padding: 16px; }
	.ns-rank-chart__row { grid-template-columns: 25px minmax(100px, 1fr) 64px; gap: 8px; }
	.ns-rank-chart__track { grid-column: 2 / 4; height: 6px; margin-top: -5px; }
	.ns-rank-chart__value { font-size: 13px; }
	.ns-rank-actions { width: 100%; flex-wrap: wrap; }
	.ns-rank-search { width: 100%; }
	.ns-rank-search input { width: 100%; }
	.ns-rank-button { flex: 1; }
	.ns-rank-table__bar-heading,
	.ns-rank-table__bar { display: none; }
	.ns-rank-methodology { padding: 38px 24px; }
	.ns-rank-sources { grid-template-columns: 1fr; }
	.ns-rank-next-tool { align-items: flex-start; flex-direction: column; padding: 28px 24px; }
}

@media (max-width: 430px) {
	.ns-rank-controls__grid { grid-template-columns: 1fr; }
	.ns-rank-field--metric { grid-column: auto; }
	.ns-podium { margin-left: -20px; margin-right: -20px; }
}

@media (prefers-reduced-motion: reduce) {
	.ns-rank-chart__track i { transition: none; }
}