/**
 * CaryTamura — a single Neighborhood (CT Single Neighborhood template).
 *
 * 2026 REDESIGN. The sections and their components are unchanged; their
 * presentation follows the redesign: the site gutters and section rhythm
 * instead of the 12px frame, sentence-case left-aligned titles, the
 * Overview on paper with ink figures, Demographics on the dark panel, the
 * photograph and map inset within the gutters, and Explore's cards from
 * sections.css. Values below marked FACT were measured from the original
 * site and describe component internals that were kept.
 *
 * CONTRAST (WCAG AA). Pills, tooltips and red text use Accent Strong
 * (#C8161C: 5.85:1 on white, 5.29:1 on paper, white labels 5.85:1). On the
 * dark Demographics panel an inactive pill's label is --ct-on-dark, since
 * #C8161C text there is only 3.04:1; its border stays Accent Strong. Grey
 * table text is --ct-label (#666666, 5.74:1) instead of #848484 (3.74:1).
 *
 * Loaded on rb_re_neighborhood singles only, after page-hero.css. Part 1:
 * the hero band, Property Listings (the listings plugin's filter bar and
 * browse grid, scoped to this neighborhood in functions.php) and the black
 * Overview band.
 *
 * VALUES. Measured from carytamura.com/neighborhoods/flatiron at 1440, 1024,
 * 768 and 375 wide (FACT) unless marked. The grid runs three across above
 * 1024, two to 769 and one from 768; sections leave the 12px frame from 767.
 */

/* ------------------------------------------------------ property listings */
.ct-nb-listings.e-con {
	--width: 100%;
	--padding-top: var(--ct-space-section);
	--padding-bottom: var(--ct-space-section);
	/* Live centres the content in a 1400px container (50px gutters): a
	 * 1300px measure, the band itself staying full frame. 58px at 1440. */
	--padding-left: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--padding-right: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--row-gap: 32px;
	--flex-wrap: nowrap;
}

.ct-nb-listings__title .elementor-heading-title,
.ct-nb-overview__title .elementor-heading-title {
	margin: 0;
	font-family: var(--ct-font-display);
	font-size: var(--ct-type-h2);
	font-weight: 400;
	line-height: var(--ct-leading-heading);
	letter-spacing: var(--ct-track-heading);
	text-transform: none;
	color: var(--ct-ink);
}

.ct-nb-listings__title .elementor-heading-title {
	text-align: left;
}

/* Filters: underlined fields on the page ground, as the reference draws its
 * selects; the Apply button is the site's primary control. */
.ct-nb-listings .rb-filters {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
}

.ct-nb-listings .rb-filters__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0 24px;
}

.ct-nb-listings .rb-filters__field label {
	display: block;
	margin-bottom: 4px;
	font-family: var(--ct-font-body);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: var(--ct-ink);
}

.ct-nb-listings .rb-filters__field select {
	width: 100%;
	height: 48px;
	padding: 0 24px 0 0;
	border: 0;
	border-bottom: 1px solid var(--ct-border);
	border-radius: 0;
	background-color: transparent;
	font-family: var(--ct-font-body);
	font-size: 13px;
	letter-spacing: 0.5px;
	color: var(--ct-ink-body);
}

.ct-nb-listings .rb-filters__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 24px;
	margin-top: 24px;
}

.ct-nb-listings .rb-filters__submit {
	min-height: 52px;
	padding: 16px 28px;
	border: 1px solid var(--ct-accent-strong);
	border-radius: var(--ct-radius);
	background-color: var(--ct-accent-strong);
	font-family: var(--ct-font-body);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--ct-on-dark);
	cursor: pointer;
	transition: background-color var(--ct-transition), color var(--ct-transition);
}

.ct-nb-listings .rb-filters__submit:hover,
.ct-nb-listings .rb-filters__submit:focus-visible {
	border-color: var(--ct-ink);
	background-color: var(--ct-ink);
	color: var(--ct-on-dark);
}

.ct-nb-listings .rb-filters__reset {
	font-family: var(--ct-font-body);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--ct-ink);
}

/* Grid: 416px cards on a 24/20 gap inside the 1300px measure. */
.ct-nb-listings .rb-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 48px 32px;
	margin: 16px 0 0;
}

.ct-nb-listings .rb-grid__empty,
.ct-nb-listings .rb-empty {
	font-family: var(--ct-font-body);
	text-align: center;
	color: var(--ct-ink-body);
}

/* Card: the redesign's listing card, as on /properties/ — 4:3 photo with the
 * white status chip, then price in the display face, address and facts on
 * the page ground. */
.ct-nb-listings .rb-card {
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0;
	border: 0;
	border-radius: 0;
	background-color: transparent;
	box-shadow: none;
	overflow: hidden;
}

.ct-nb-listings .rb-card__link {
	position: absolute;
	inset: 0;
	z-index: 3;
}

.ct-nb-listings .rb-card__link:focus-visible {
	outline: 2px solid var(--ct-accent);
	outline-offset: -2px;
}

.ct-nb-listings .rb-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	margin: 0;
	border-radius: 0;
	background-color: var(--ct-surface);
	overflow: hidden;
}

.ct-nb-listings .rb-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.2s;
}

@media (hover: hover) and (pointer: fine) {
	.ct-nb-listings .rb-card:hover .rb-card__media img {
		transform: scale(1.02);
	}
}

.ct-nb-listings .rb-badge {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	padding: 7px 12px;
	border: 0;
	border-radius: 0;
	background-color: var(--ct-canvas);
	font-family: var(--ct-font-body);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: #000;
}

/* No uploaded photo: keep the grey box, drop the plugin's "RB" monogram
 * (as /properties/ does). */
.ct-nb-listings .rb-card__placeholder {
	position: absolute;
	inset: 0;
	font-size: 0;
}

.ct-nb-listings .rb-card__star {
	display: none;
}

.ct-nb-listings .rb-card__body {
	display: flex;
	flex-flow: row wrap;
	align-content: flex-start;
	flex: 1;
	padding: 22px 0 0;
	text-transform: none;
	color: var(--ct-ink);
}

.ct-nb-listings .rb-card__pricing { order: 1; }
.ct-nb-listings .rb-card__title   { order: 2; }
.ct-nb-listings .rb-card__location { order: 3; }
.ct-nb-listings .rb-card__meta    { order: 4; }

.ct-nb-listings .rb-card__price {
	font-family: var(--ct-font-display);
	font-size: clamp(22px, 1.8vw, 26px);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0;
	color: #000;
}

.ct-nb-listings .rb-card__title,
.ct-nb-listings .rb-card__location {
	margin: 8px 0 0;
	font-family: var(--ct-font-body);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0;
	color: #000;
}

/* Street and city share the reference's one address line. */
.ct-nb-listings .rb-card__pricing,
.ct-nb-listings .rb-card__meta {
	width: 100%;
}

.ct-nb-listings .rb-card__location::before {
	content: ",\00a0";
}

.ct-nb-listings .rb-card__location svg,
.ct-nb-listings .rb-card__meta svg {
	display: none;
}

.ct-nb-listings .rb-card__meta {
	display: flex;
	flex-wrap: wrap;
	margin: 6px 0 0;
	padding: 0;
	list-style: none;
	font-family: var(--ct-font-body);
	font-size: 14px;
	line-height: 1.5;
	color: var(--ct-label);
}

.ct-nb-listings .rb-card__meta li {
	margin: 0;
}

/* The type is not on the reference card; beds · baths · area are. */
.ct-nb-listings .rb-card__meta li:first-child {
	display: none;
}

.ct-nb-listings .rb-card__meta li + li:not(:nth-child(2))::before {
	content: "\00b7";
	margin: 0 5px;
}

.ct-nb-listings .rb-card__pill,
.ct-nb-listings .rb-card__footer {
	display: none;
}

.ct-nb-listings .rb-grid__pagination {
	margin-top: 40px;
	text-align: center;
}

/* -------------------------------------------------------------- overview --
 * Black band in the frame: 96px above and below, a 1256px measure, the copy
 * at 60% white, then the four figures on red discs. */
.ct-nb-overview.e-con {
	--width: 100%;
	--padding-top: var(--ct-space-section);
	--padding-bottom: var(--ct-space-section);
	/* Same 1400px container, 72px gutters: a 1256px measure. 80px at 1440. */
	--padding-left: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--padding-right: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--row-gap: 0px;
	--flex-wrap: nowrap;
	background-color: var(--ct-paper);
}

.ct-nb-overview__title .elementor-heading-title {
	color: var(--ct-ink);
}

.ct-nb-overview__text {
	max-width: 65%;
	margin: 24px 0 80px;
	font-family: var(--ct-font-body);
	font-size: 17px;
	line-height: 1.7;
	color: var(--ct-ink-body);
}

.ct-nb-stats {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ct-nb-stat {
	display: flex;
	align-items: center;
	margin: 0;
}

.ct-nb-stat__icon {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin-right: 20px;
	border-radius: 50%;
	background-color: var(--ct-dark);
}

.ct-nb-stat__icon::after {
	content: "";
	width: 32px;
	height: 32px;
	background-color: var(--ct-on-dark);
	-webkit-mask: var(--ct-nb-icon) center / contain no-repeat;
	mask: var(--ct-nb-icon) center / contain no-repeat;
}

/* The reference's own line icons, as masks (FACT). */
.ct-nb-stat--population { --ct-nb-icon: url("data:image/svg+xml,%3Csvg width='32' height='32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 3.333A11.347 11.347 0 0 0 4.667 14.668c0 6.644 6.172 10.721 10.256 13.418l.708.47a.667.667 0 0 0 .738 0l.708-.47c4.084-2.697 10.256-6.774 10.256-13.418A11.346 11.346 0 0 0 16 3.333Zm.341 23.64L16 27.2l-.341-.226C11.812 24.434 6 20.594 6 14.667a10 10 0 0 1 20 0c0 5.926-5.812 9.766-9.659 12.307Zm2.527-10.38a4.514 4.514 0 0 0 .142-5.235 4.556 4.556 0 1 0-3.787 7.086 4.514 4.514 0 0 0 2.702-.91l2.267 2.268a.667.667 0 1 0 .944-.944l-2.268-2.266ZM12 13.888a3.223 3.223 0 1 1 6.446-.002 3.223 3.223 0 0 1-6.446.002Z' fill='%23fff'/%3E%3C/svg%3E"); }
.ct-nb-stat--age { --ct-nb-icon: url("data:image/svg+xml,%3Csvg width='32' height='32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 16a5.667 5.667 0 1 0 0-11.333A5.667 5.667 0 0 0 16 16ZM6.667 27.333a9.333 9.333 0 0 1 18.666 0H6.667Z' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.ct-nb-stat--density { --ct-nb-icon: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.829 9.61399C20.7475 9.61399 22.3027 8.05874 22.3027 6.14025C22.3027 4.22175 20.7475 2.6665 18.829 2.6665C16.9105 2.6665 15.3552 4.22175 15.3552 6.14025C15.3552 8.05874 16.9105 9.61399 18.829 9.61399Z' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M25.8066 16.3866C25.6219 15.9647 25.2773 15.6334 24.8484 15.4656C24.4196 15.2977 23.9416 15.3071 23.5197 15.4916C23.0698 15.7545 22.5666 15.9129 22.0473 15.955C21.528 15.9971 21.0058 15.9218 20.5195 15.7347H20.5103C17.9733 14.3556 20.4211 12.3768 17.6803 11.4585C12.7221 9.80156 8.57448 11.1112 6.77624 16.0555C6.69613 16.2702 6.65934 16.4988 6.66798 16.7279C6.67663 16.9569 6.73053 17.182 6.8266 17.3902C6.92266 17.5983 7.05898 17.7854 7.22769 17.9406C7.3964 18.0958 7.59417 18.2161 7.80959 18.2945C8.02501 18.3729 8.25382 18.4079 8.48283 18.3974C8.71183 18.387 8.93651 18.3313 9.14389 18.2336C9.35127 18.1359 9.53726 17.9981 9.69112 17.8282C9.84499 17.6582 9.9637 17.4595 10.0404 17.2435C10.1966 16.6524 10.4765 16.1012 10.8615 15.6264C11.2466 15.1515 11.728 14.7638 12.274 14.4888C13.0785 14.2038 13.9512 14.1727 14.7739 14.3996L10.2477 26.9734C10.1029 27.404 10.1326 27.8742 10.3303 28.2831C10.5281 28.692 10.8782 29.0072 11.3056 29.1611C11.733 29.315 12.2037 29.2953 12.6168 29.1063C13.0298 28.9172 13.3524 28.5739 13.5153 28.1499L16.1646 20.7913L15.6447 22.2352L17.7741 28.1499C17.8478 28.369 17.9645 28.5712 18.1173 28.7447C18.2702 28.9181 18.4561 29.0593 18.6643 29.16C18.8724 29.2606 19.0985 29.3187 19.3294 29.3308C19.5603 29.343 19.7912 29.3089 20.0088 29.2305C20.2263 29.1522 20.426 29.0313 20.5962 28.8748C20.7663 28.7183 20.9035 28.5294 20.9998 28.3191C21.096 28.1089 21.1492 27.8816 21.1564 27.6505C21.1637 27.4194 21.1247 27.1892 21.0417 26.9734L18.1145 18.2636C18.3455 18.456 18.5918 18.6291 18.851 18.7812C19.7977 19.2427 20.8403 19.4737 21.8934 19.4552C22.9466 19.4367 23.9804 19.1692 24.9103 18.6747C25.1195 18.5833 25.3086 18.4517 25.4668 18.2873C25.6251 18.1229 25.7493 17.9288 25.8326 17.7164C25.9158 17.5039 25.9564 17.2771 25.9519 17.0489C25.9474 16.8207 25.898 16.5957 25.8066 16.3866V16.3866Z' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.ct-nb-stat--income { --ct-nb-icon: url("data:image/svg+xml,%3Csvg width='32' height='32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.314 11.942h-2.483a2.15 2.15 0 0 0-.961 4.072l2.26 1.131a2.149 2.149 0 0 1-.96 4.072h-2.494M15.42 21.217v1.74M16.58 10.203v1.739' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16 29.333c7.364 0 13.333-5.97 13.333-13.333 0-7.364-5.97-13.334-13.333-13.334C8.636 2.666 2.667 8.636 2.667 16S8.637 29.333 16 29.333Z' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }

.ct-nb-stat__copy {
	display: flex;
	flex-direction: column;
}

.ct-nb-stat__value {
	margin-bottom: 4px;
	font-family: var(--ct-font-display);
	font-size: 26px;
	line-height: 1.2;
	text-transform: none;
	color: var(--ct-ink);
}

.ct-nb-stat__name {
	position: relative;
	font-family: var(--ct-font-body);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: var(--ct-label);
}

/* The density hint: a red ⓘ after the label, its note on hover or focus.
 * The ⓘ is drawn on ::before: a mask on the hint itself would clip the note,
 * which is its child, and nothing of it would show. */
.ct-nb-stat__hint {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-left: 4px;
	vertical-align: -3px;
	cursor: help;
}

.ct-nb-stat__hint::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: var(--ct-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 1.333a6.667 6.667 0 1 0 0 13.334A6.667 6.667 0 0 0 8 1.334Zm.667 9a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.333v-2A.333.333 0 0 1 7.667 8h.666a.333.333 0 0 1 .334.334v2Zm0-4a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.333v-.667a.333.333 0 0 1 .334-.333h.666a.333.333 0 0 1 .334.333v.667Z' fill='%23848484'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 1.333a6.667 6.667 0 1 0 0 13.334A6.667 6.667 0 0 0 8 1.334Zm.667 9a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.333v-2A.333.333 0 0 1 7.667 8h.666a.333.333 0 0 1 .334.334v2Zm0-4a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.333v-.667a.333.333 0 0 1 .334-.333h.666a.333.333 0 0 1 .334.333v.667Z' fill='%23848484'/%3E%3C/svg%3E") center / contain no-repeat;
}

.ct-nb-stat__tip {
	position: absolute;
	bottom: calc(100% + 8px);
	left: 0;
	z-index: 5;
	width: 240px;
	padding: 12px 16px;
	background-color: var(--ct-on-dark);
	font-size: 14px;
	line-height: 1.5;
	text-transform: none;
	color: #000;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--ct-transition);
}

.ct-nb-stat__tip strong {
	display: block;
}

.ct-nb-stat__name:has(.ct-nb-stat__hint:hover) .ct-nb-stat__tip,
.ct-nb-stat__hint:focus-visible .ct-nb-stat__tip {
	opacity: 1;
	visibility: visible;
}

/* ---------------------------------------------------------- responsive -- */
@media (max-width: 1024px) {
	.ct-nb-listings.e-con {
		--padding-left: 50px;
		--padding-right: 50px;
	}

	.ct-nb-listings .rb-filters__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 16px;
	}

	.ct-nb-listings .rb-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px 24px;
	}

	.ct-nb-overview.e-con {
		--padding-left: 32px;
		--padding-right: 32px;
	}

	.ct-nb-overview__text {
		max-width: none;
		margin: 16px 0 32px;
	}

	.ct-nb-stats {
		flex-wrap: wrap;
		gap: 36px 0;
	}

	.ct-nb-stat {
		width: 50%;
	}
}

@media (max-width: 768px) {
	.ct-nb-listings.e-con,
	.ct-nb-overview.e-con {
		--padding-top: var(--ct-section-padding-compact);
		--padding-bottom: var(--ct-section-padding-compact);
	}

	.ct-nb-listings .rb-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 767px) {
	.ct-nb-listings.e-con,
	.ct-nb-overview.e-con {
		--width: 100%;
		margin-inline: 0;
	}

	.ct-nb-listings.e-con {
		--padding-left: 25px;
		--padding-right: 25px;
	}

	.ct-nb-overview.e-con {
		--padding-left: 24px;
		--padding-right: 24px;
	}

	.ct-nb-listings__title .elementor-heading-title,
	.ct-nb-overview__title .elementor-heading-title {
		font-size: 32px;
		line-height: 1.4;
	}

	.ct-nb-listings .rb-filters__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ct-nb-listings .rb-filters__actions {
		justify-content: stretch;
	}

	.ct-nb-listings .rb-filters__submit {
		width: 100%;
	}

	.ct-nb-stats {
		flex-direction: column;
		gap: 40px;
	}

	.ct-nb-stat {
		width: auto;
	}

	.ct-nb-stat__value {
		font-size: 16px;
	}

	/* The density note opens from the label, 96px in: held 16px clear of
	 * the right edge, which a 240px box passes on a 320px screen. */
	.ct-nb-stat__tip {
		width: min(240px, calc(100vw - 112px));
	}

	/* 16px on every control a phone can focus, or iOS zooms the page in. */
	.ct-nb-listings .rb-filters__field select {
		font-size: 16px;
	}
}

/* ================================================================ around --
 * Part 2: Around {Neighborhood}, NY. White band in the frame, the same
 * 1256px measure as the Overview; the introduction, the three mobility
 * scores between hairlines, then Points of Interest — the listings plugin's
 * POI directory laid out as the reference's table. Measured from
 * carytamura.com/neighborhoods/flatiron (FACT) unless marked. */
.ct-nb-around.e-con {
	--width: 100%;
	--padding-top: var(--ct-space-section);
	--padding-bottom: var(--ct-space-section);
	--padding-left: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--padding-right: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--row-gap: 0px;
	--flex-wrap: nowrap;
}

.ct-nb-around__title .elementor-heading-title {
	margin: 0 0 24px;
	font-family: var(--ct-font-display);
	font-size: var(--ct-type-h2);
	font-weight: 400;
	line-height: var(--ct-leading-heading);
	letter-spacing: var(--ct-track-heading);
	text-transform: none;
	color: var(--ct-ink);
}

.ct-nb-around__intro {
	margin: 0 0 25px;
	font-family: var(--ct-font-body);
	font-size: 16px;
	line-height: 1.666;
	color: #000;
}

/* Scores: a 56px ring filled to the score (conic), the figure on a white
 * disc; walk, bike and transit in the accent at 100%, 75% and 25%. */
.ct-nb-scores {
	display: flex;
	align-items: center;
	gap: 6vw;
	padding: 40px 0;
	border-top: 1px solid #e7e7e7;
	border-bottom: 1px solid #e7e7e7;
}

.ct-nb-scores__divider {
	align-self: stretch;
	width: 1px;
	border-left: 1px solid #e7e7e7;
}

.ct-nb-score {
	display: flex;
	align-items: center;
	gap: 25px;
	--ct-score-color: var(--ct-accent);
}

.ct-nb-score--bike    { --ct-score-color: rgba(237, 33, 39, 0.75); }
.ct-nb-score--transit { --ct-score-color: rgba(237, 33, 39, 0.25); }

.ct-nb-score__chart {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: conic-gradient(var(--ct-score-color) var(--ct-score), #f3f3f3 var(--ct-score));
}

.ct-nb-score__value {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background-color: #fff;
	font-family: var(--ct-font-body);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	color: #000;
}

.ct-nb-score__copy {
	display: flex;
	flex-direction: column;
}

.ct-nb-score__title {
	margin-bottom: 8px;
	font-family: var(--ct-font-body);
	font-size: 16px;
	line-height: 1.5;
	color: #000;
}

.ct-nb-score__help {
	position: relative;
	display: flex;
	align-items: center;
	gap: 6px;
}

.ct-nb-score__label {
	font-family: var(--ct-font-body);
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: #000;
}

.ct-nb-score__toggle {
	flex: none;
	width: 14px;
	height: 14px;
	margin: 0;
	padding: 0;
	border: 0;
	background-color: var(--ct-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath fill='%23000' d='M7 .333a6.667 6.667 0 1 0 0 13.334A6.667 6.667 0 0 0 7 .333Zm.667 9a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.334v-2A.333.333 0 0 1 6.667 7h.666a.333.333 0 0 1 .334.333v2Zm0-4a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.334v-.666a.333.333 0 0 1 .334-.334h.666a.333.333 0 0 1 .334.334v.666Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath fill='%23000' d='M7 .333a6.667 6.667 0 1 0 0 13.334A6.667 6.667 0 0 0 7 .333Zm.667 9a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.334v-2A.333.333 0 0 1 6.667 7h.666a.333.333 0 0 1 .334.333v2Zm0-4a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.334v-.666a.333.333 0 0 1 .334-.334h.666a.333.333 0 0 1 .334.334v.666Z'/%3E%3C/svg%3E") center / contain no-repeat;
	cursor: pointer;
}

.ct-nb-score__toggle:hover,
.ct-nb-score__toggle:focus {
	background-color: var(--ct-accent);
}

.ct-nb-score__toggle:focus-visible {
	outline: 2px solid var(--ct-accent);
	outline-offset: 2px;
}

.ct-nb-score__tip {
	position: absolute;
	bottom: calc(100% + 10px);
	left: 0;
	z-index: 5;
	width: 280px;
	padding: 16px;
	background-color: #fff;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
	font-family: var(--ct-font-body);
	font-size: 14px;
	line-height: 1.5;
	color: #000;
}

.ct-nb-score__tip[hidden] {
	display: none;
}

/* Three across, the last score sits within 280px of the right edge up to
 * about 1130px: its note opens leftward from the label's end instead. */
@media (min-width: 768px) and (max-width: 1200px) {
	.ct-nb-score:last-child .ct-nb-score__tip {
		left: auto;
		right: 0;
	}
}

.ct-nb-score__tip strong {
	display: block;
	margin-bottom: 4px;
}

.ct-nb-score__tip a {
	color: var(--ct-accent-strong);
}

/* Points of Interest. */
.ct-nb-poi {
	margin-top: 40px;
}

.ct-nb-poi__title {
	margin: 0 0 16px;
	font-family: var(--ct-font-display);
	font-size: var(--ct-size-h4);
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0;
	text-transform: none;
	color: #000;
}

.ct-nb-poi__desc {
	max-width: 50%;
	margin: 0 0 24px;
	font-family: var(--ct-font-body);
	font-size: 15px;
	line-height: 1.666;
	color: #000;
}

.ct-nb-poi__filters {
	display: none;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 40px;
}

.ct-nb-poi.is-ready .ct-nb-poi__filters {
	display: flex;
}

.ct-nb-poi__filter {
	height: 34px;
	margin: 0;
	padding: 8px 16px;
	border: 1px solid var(--ct-accent-strong);
	border-radius: 16px;
	background-color: transparent;
	font-family: var(--ct-font-body);
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--ct-accent-strong);
	cursor: pointer;
	transition: background-color 0.3s linear, border 0.3s linear, color 0.3s linear;
}

.ct-nb-poi__filter:hover,
.ct-nb-poi__filter:focus {
	background-color: transparent;
	color: var(--ct-accent-strong);
}

.ct-nb-poi__filter[aria-pressed="true"] {
	background-color: var(--ct-accent-strong);
	color: #fff;
}

.ct-nb-poi__filter:focus-visible {
	outline: 2px solid var(--ct-accent-strong);
	outline-offset: 2px;
}

/* The table: NAME 43%, CATEGORY after it; rows 24px top and bottom on a
 * 12% hairline. */
.ct-nb-poi__head,
.ct-nb-poi .rb-poi-directory__item {
	display: grid;
	grid-template-columns: 43% 1fr;
	align-items: center;
}

.ct-nb-poi__head {
	border-top: 1px solid rgba(0, 0, 0, 0.12);
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.ct-nb-poi__head span {
	padding: 13.5px 16px 12.5px;
	font-family: var(--ct-font-body);
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: #000;
}

.ct-nb-poi .rb-poi-directory {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ct-nb-poi .rb-poi-directory__item {
	grid-template-columns: 40px calc(43% - 81px) 1fr;
	column-gap: 24px;
	margin: 0;
	padding: 24px 0 24px 16px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.ct-nb-poi .rb-poi-directory__item[hidden] {
	display: none;
}

.ct-nb-poi__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: #f3f3f3;
}

.ct-nb-poi__icon::after {
	content: "";
	width: 24px;
	height: 24px;
	background-color: #000;
	-webkit-mask: var(--ct-poi-icon, none) center / contain no-repeat;
	mask: var(--ct-poi-icon, none) center / contain no-repeat;
}

.rb-poi-directory__item:not([data-category="dining"]):not([data-category="shopping"]):not([data-category="active"]):not([data-category="nightlife"]):not([data-category="beauty"]) .ct-nb-poi__icon::after {
	content: none;
}

.rb-poi-directory__item[data-category="dining"] { --ct-poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='M3.286 9.429V21M18.711 14.572h1.931a.643.643 0 0 0 .643-.642c.007-3.283.024-7.25-1.336-10.533a.643.643 0 0 0-1.237.246V21M2 3v5.143a1.286 1.286 0 0 0 2.571 0V3M15.5 8.814a6.148 6.148 0 0 0-8.352-.6M6.5 17.758a6.152 6.152 0 0 0 9 0'/%3E%3C/svg%3E"); }
.rb-poi-directory__item[data-category="shopping"] { --ct-poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23000' d='M18.5 7.5H16v-1a4 4 0 1 0-8 0v1H5.5a2 2 0 0 0-2 2V18c0 2.29 1.21 3.5 3.5 3.5h10c2.29 0 3.5-1.21 3.5-3.5V9.5a2 2 0 0 0-2-2ZM9 6.5a3 3 0 1 1 6 0v1H9v-1ZM19.5 18c0 1.729-.771 2.5-2.5 2.5H7c-1.729 0-2.5-.771-2.5-2.5V9.5a1 1 0 0 1 1-1H8V11a.5.5 0 0 0 1 0V8.5h6V11a.5.5 0 0 0 1 0V8.5h2.5a1 1 0 0 1 1 1V18Z'/%3E%3C/svg%3E"); }
.rb-poi-directory__item[data-category="active"] { --ct-poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='M15.256 6.419a2.21 2.21 0 1 0 0-4.419 2.21 2.21 0 0 0 0 4.419ZM12.163 19.454a1.325 1.325 0 0 1-1.295-1.613 4.65 4.65 0 0 0-1.944-4.847l-.587-.391a1.325 1.325 0 0 1-.265-1.976l3.093-3.535a1.325 1.325 0 0 1 2.033.045 4.537 4.537 0 0 0 3.56 1.712h.265a1.326 1.326 0 0 1 0 2.651h-.265a7.176 7.176 0 0 1-4.53-1.598l-1.195 1.368a7.325 7.325 0 0 1 2.423 7.145 1.325 1.325 0 0 1-1.293 1.039ZM5.535 21a3.535 3.535 0 1 0 0-7.07 3.535 3.535 0 0 0 0 7.07Z'/%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='M18.79 21a3.535 3.535 0 1 0 0-7.07 3.535 3.535 0 0 0 0 7.07Z'/%3E%3C/svg%3E"); }
.rb-poi-directory__item[data-category="nightlife"] { --ct-poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='M8.667 22H14M11.333 22v-8M18.195 7.138A.666.666 0 0 0 17.724 6H4.942a.667.667 0 0 0-.47 1.138L11.332 14l6.862-6.862Z'/%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='M2 2h2.508a1.333 1.333 0 0 1 1.193.737L7.333 6M15.4 6a3.33 3.33 0 1 1 1.68 2.266'/%3E%3C/svg%3E"); }
.rb-poi-directory__item[data-category="beauty"] { --ct-poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23000' d='m21.309 7.951-1.04-3.073C19.8 3.486 19.252 2.5 16.5 2.5h-9c-2.752 0-3.3.986-3.769 2.378l-1.04 3.073a3.474 3.474 0 0 0 .809 3.592V18c0 2.29 1.21 3.5 3.5 3.5h10c2.29 0 3.5-1.21 3.5-3.5v-6.457a3.473 3.473 0 0 0 .809-3.592Zm-17.67.32L4.679 5.2c.358-1.06.574-1.7 2.821-1.7h9c2.247 0 2.463.64 2.821 1.7l1.04 3.072a2.416 2.416 0 0 1-.975 2.888 2.57 2.57 0 0 1-1.286.34 2.79 2.79 0 0 1-2.585-1.667.5.5 0 0 0-.942.003 2.82 2.82 0 0 1-5.144 0 .543.543 0 0 0-.474-.336.5.5 0 0 0-.471.333A2.79 2.79 0 0 1 5.9 11.5a2.57 2.57 0 0 1-1.285-.341 2.416 2.416 0 0 1-.976-2.888ZM13.53 20.5h-3v-3a1.5 1.5 0 1 1 3 0v3Zm3.47 0h-2.47v-3a2.5 2.5 0 0 0-5 0v3H7c-1.729 0-2.5-.771-2.5-2.5v-5.785c.443.188.919.285 1.4.285a3.922 3.922 0 0 0 3.053-1.474 3.888 3.888 0 0 0 6.1 0A3.921 3.921 0 0 0 18.1 12.5c.481 0 .957-.097 1.4-.285V18c0 1.729-.771 2.5-2.5 2.5Z'/%3E%3C/svg%3E"); }

.ct-nb-poi .rb-poi-directory__entry {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	min-width: 0;
}

.ct-nb-poi .rb-poi-directory__name,
.ct-nb-poi .rb-poi-directory__name a {
	font-family: var(--ct-font-body);
	font-size: 14px;
	font-weight: 600;
	line-height: 16px;
	color: #000;
	text-decoration: none;
}

/* The Yelp link's ↗. */
.ct-nb-poi .rb-poi-directory__link::after {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-left: 8px;
	background-color: #000;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='none'%3E%3Cpath fill='%23000' d='M8.863 2.275a.804.804 0 0 0-1.138-1.137L.902 7.96a.804.804 0 1 0 1.137 1.137l6.824-6.823Z'/%3E%3Cpath fill='%23000' d='M2.039 1.942a.804.804 0 1 1 0-1.609h6.823c.43 0 .785.34.804.77l.284 6.539a.804.804 0 0 1-1.607.07l-.25-5.77H2.038Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='none'%3E%3Cpath fill='%23000' d='M8.863 2.275a.804.804 0 0 0-1.138-1.137L.902 7.96a.804.804 0 1 0 1.137 1.137l6.824-6.823Z'/%3E%3Cpath fill='%23000' d='M2.039 1.942a.804.804 0 1 1 0-1.609h6.823c.43 0 .785.34.804.77l.284 6.539a.804.804 0 0 1-1.607.07l-.25-5.77H2.038Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* The address: a grey hairline, an accent line drawn across it on hover. */
.ct-nb-poi .rb-poi-directory__address,
.ct-nb-poi .rb-poi-directory__address a {
	font-family: var(--ct-font-body);
	font-size: 14px;
	font-weight: 400;
	line-height: 14px;
	color: #000;
	text-decoration: none;
}

.ct-nb-poi .rb-poi-directory__map-link {
	position: relative;
	display: inline-block;
	padding-bottom: 2px;
}

.ct-nb-poi .rb-poi-directory__map-link::before,
.ct-nb-poi .rb-poi-directory__map-link::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	height: 1px;
	transition: width 0.4s;
}

.ct-nb-poi .rb-poi-directory__map-link::before {
	width: 100%;
	background-color: #ccc;
}

.ct-nb-poi .rb-poi-directory__map-link::after {
	width: 0;
	background-color: var(--ct-accent);
}

.ct-nb-poi .rb-poi-directory__map-link:hover::after,
.ct-nb-poi .rb-poi-directory__map-link:focus-visible::after {
	width: 100%;
}

.ct-nb-poi .rb-poi-directory__category {
	justify-self: start;
	padding: 4px 8px;
	background-color: #f8f7f5;
	font-family: var(--ct-font-body);
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	color: #000;
}

.ct-nb-poi__more {
	margin-top: 40px;
	text-align: center;
}

.ct-nb-poi__more-btn[hidden] {
	display: none;
}

@media (max-width: 1024px) {
	.ct-nb-around.e-con {
		--padding-top: var(--ct-section-padding-compact);
		--padding-bottom: var(--ct-section-padding-compact);
		--padding-left: 32px;
		--padding-right: 32px;
	}
}

@media (max-width: 768px) {
	.ct-nb-around__title .elementor-heading-title {
		margin-bottom: 8px;
	}

	.ct-nb-scores {
		gap: 56px;
		padding: 32px 0;
	}

	.ct-nb-scores__divider {
		display: none;
	}

	.ct-nb-poi__desc {
		max-width: none;
	}

	/* Rows stack: the name block, then the category. */
	.ct-nb-poi__head {
		display: none;
	}

	.ct-nb-poi .rb-poi-directory__item {
		grid-template-columns: 40px 1fr;
		row-gap: 12px;
		padding: 24px 0;
		border-bottom-color: #e7e7e7;
	}

	.ct-nb-poi .rb-poi-directory__category {
		grid-column: 2;
	}
}

@media (max-width: 767px) {
	.ct-nb-around.e-con {
		--width: 100%;
		--padding-left: 24px;
		--padding-right: 24px;
		margin-inline: 0;
	}

	/* Touch: the ⓘ is a 44px target drawn at its 14px, the extra taken back
	 * as margin so the label beside it does not move. */
	.ct-nb-score__toggle {
		width: 44px;
		height: 44px;
		margin: -15px;
		-webkit-mask-size: 14px 14px;
		mask-size: 14px 14px;
	}

	/* Its note opens from the label, 105px in: held 16px clear of the right
	 * edge, which a 280px box passes on a 320 or 375px screen. */
	.ct-nb-score__tip {
		width: min(280px, calc(100vw - 121px));
	}

	.ct-nb-around__title .elementor-heading-title {
		font-size: 32px;
		line-height: 1.4;
	}

	.ct-nb-scores {
		flex-direction: column;
		align-items: flex-start;
		gap: 48px;
	}

	.ct-nb-poi__title {
		font-size: 18px;
	}

	.ct-nb-poi.is-ready .ct-nb-poi__filters {
		flex-direction: column;
	}

	.ct-nb-poi__more-btn {
		width: 100%;
	}
}

/* ========================================================== demographics --
 * Part 3: Demographics and Employment Data for {Neighborhood}, NY. Black
 * band in the frame, the Overview's 1256px measure. Pill tabs; each panel is
 * its sentence, a stats row between white rules, then its charts. Measured
 * from carytamura.com/neighborhoods/flatiron (FACT) unless marked. */
.ct-nb-demo-section.e-con {
	--width: 100%;
	--padding-top: var(--ct-space-section);
	--padding-bottom: var(--ct-space-section);
	--padding-left: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--padding-right: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--row-gap: 0px;
	--flex-wrap: nowrap;
	background-color: var(--ct-dark);
}

.ct-nb-demo-section__title .elementor-heading-title {
	margin: 0 0 24px;
	font-family: var(--ct-font-display);
	font-size: var(--ct-type-h2);
	font-weight: 400;
	line-height: var(--ct-leading-heading);
	letter-spacing: var(--ct-track-heading);
	text-transform: none;
	color: var(--ct-on-dark);
}

.ct-nb-demo__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
}

.ct-nb-demo__tab {
	height: 34px;
	margin: 0;
	padding: 8px 16px;
	border: 1px solid var(--ct-accent-strong);
	border-radius: 16px;
	background-color: transparent;
	font-family: var(--ct-font-body);
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--ct-on-dark);
	cursor: pointer;
	transition: all 0.3s linear;
}

.ct-nb-demo__tab:focus {
	background-color: transparent;
	color: var(--ct-on-dark);
}

/* Hover takes the active face, as the reference's pills do. */
.ct-nb-demo__tab:hover,
.ct-nb-demo__tab[aria-selected="true"] {
	background-color: var(--ct-accent-strong);
	color: #fff;
}

.ct-nb-demo__tab:focus-visible {
	outline: 2px solid var(--ct-on-dark);
	outline-offset: 2px;
}

.ct-nb-demo__panel[hidden] {
	display: none;
}

.ct-nb-demo__text {
	margin: 0 0 40px;
	font-family: var(--ct-font-body);
	font-size: 15px;
	line-height: 1.666;
	color: rgba(255, 255, 255, 0.5);
}

/* Stats: the first left, the rest centred in double shares, white rules
 * between; a three-up row sits left with 120px gutters. */
.ct-nb-demo__stats {
	display: flex;
	justify-content: space-between;
	padding: 40px 0;
	border-top: 1px solid #fff;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.ct-nb-demo__stat {
	display: flex;
	flex-direction: column;
	flex-grow: 2;
	align-items: center;
	border-right: 1px solid #fff;
}

.ct-nb-demo__stat:first-child {
	flex-grow: 1;
	align-items: flex-start;
}

.ct-nb-demo__stat:last-child {
	border-right: 0;
}

.ct-nb-demo__stat > * {
	min-width: 0;
}

.ct-nb-demo__stats--three {
	justify-content: flex-start;
}

.ct-nb-demo__stats--three .ct-nb-demo__stat {
	flex-grow: 0;
	align-items: flex-start;
	padding: 0 120px;
}

.ct-nb-demo__stats--three .ct-nb-demo__stat:first-child {
	padding-left: 0;
}

.ct-nb-demo__value {
	margin-bottom: 8px;
	font-family: var(--ct-font-body);
	font-size: 17px;
	line-height: 1.4;
	text-transform: uppercase;
	color: #fff;
}

.ct-nb-demo__name {
	position: relative;
	font-family: var(--ct-font-body);
	font-size: 12px;
	line-height: 1.666;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
}

/* Population density ⓘ: the reference's red note above the icon, its arrow
 * on the icon, faded in (0.2s) while the label is hovered or the icon has
 * focus. The icon is drawn on ::before so its mask cannot clip the note. */
.ct-nb-demo__name:has(.ct-nb-demo__hint) {
	cursor: pointer;
}

.ct-nb-demo__hint {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-left: 6px;
	vertical-align: -3px;
}

.ct-nb-demo__hint::before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: var(--ct-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23000' d='M8 1.333a6.667 6.667 0 1 0 0 13.334A6.667 6.667 0 0 0 8 1.334Zm.667 9a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.333v-2A.333.333 0 0 1 7.667 8h.666a.333.333 0 0 1 .334.334v2Zm0-4a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.333v-.667a.333.333 0 0 1 .334-.333h.666a.333.333 0 0 1 .334.333v.667Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23000' d='M8 1.333a6.667 6.667 0 1 0 0 13.334A6.667 6.667 0 0 0 8 1.334Zm.667 9a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.333v-2A.333.333 0 0 1 7.667 8h.666a.333.333 0 0 1 .334.334v2Zm0-4a.333.333 0 0 1-.334.334h-.666a.333.333 0 0 1-.334-.333v-.667a.333.333 0 0 1 .334-.333h.666a.333.333 0 0 1 .334.333v.667Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.ct-nb-demo__tip {
	position: absolute;
	bottom: calc(100% + 5px);
	z-index: 3;
	width: 340px;
	max-width: calc(100vw - 48px);
	padding: 16px;
	background-color: var(--ct-accent-strong);
	font-family: var(--ct-font-body);
	font-size: 14px;
	line-height: 1.5;
	text-transform: none;
	white-space: normal;
	color: #fff;
	opacity: 0;
	visibility: hidden;
	transform: translateX(-8px);
	transition: opacity 0.2s, visibility 0.2s;
}

.ct-nb-demo__tip::after {
	content: "";
	position: absolute;
	bottom: -3px;
	left: 15px;
	width: 8px;
	height: 8px;
	background-color: var(--ct-accent-strong);
	transform: rotate(45deg);
}

.ct-nb-demo__tip strong {
	display: block;
	font-weight: 700;
}

.ct-nb-demo__name:hover .ct-nb-demo__tip,
.ct-nb-demo__hint:focus-visible .ct-nb-demo__tip {
	opacity: 1;
	visibility: visible;
}

/* Chart sections. */
.ct-nb-demo__section {
	padding: 40px 0;
	border-top: 1px solid #fff;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.ct-nb-demo__panel > :last-child {
	border-bottom-color: #fff;
}

.ct-nb-demo__charts {
	display: flex;
	justify-content: space-between;
	gap: 80px;
}

.ct-nb-demo__col {
	flex: 1;
	min-width: 0;
}

.ct-nb-demo__chart-title {
	margin: 0 0 24px;
	font-family: var(--ct-font-body);
	font-size: 12px;
	line-height: 1.666;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
}

/* Age groups: a 24px stone track, the share in the accent, the range at
 * the right; the exact share shows above the fill on hover. */
.ct-nb-demo__age {
	display: flex;
	align-items: center;
	gap: 24px;
	margin-bottom: 40px;
}

.ct-nb-demo__age:last-child {
	margin-bottom: 0;
}

.ct-nb-demo__age-bar {
	position: relative;
	flex: 1;
	height: 24px;
	border-radius: 4px;
	background-color: #f8f7f5;
}

.ct-nb-demo__age-bar::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: var(--ct-value);
	border-radius: 4px;
	background-color: var(--ct-accent);
}

.ct-nb-demo__age-tip {
	position: absolute;
	top: calc(-100% - 10px);
	left: 50%;
	z-index: 2;
	padding: 6px 10px;
	border-radius: 72px;
	background-color: var(--ct-accent-strong);
	font-family: var(--ct-font-body);
	font-size: 12px;
	line-height: 16px;
	white-space: nowrap;
	color: #fff;
	opacity: 0;
	transform: translateX(-50%);
	transition: opacity 0.3s;
	pointer-events: none;
}

.ct-nb-demo__age-tip::after {
	content: "";
	position: absolute;
	bottom: -3px;
	left: 15px;
	width: 8px;
	height: 8px;
	background-color: var(--ct-accent-strong);
	transform: rotate(45deg);
}

.ct-nb-demo__age:hover .ct-nb-demo__age-tip {
	opacity: 1;
}

.ct-nb-demo__age-label {
	flex: none;
	width: 64px;
	font-family: var(--ct-font-body);
	font-size: 12px;
	line-height: 1.666;
	text-align: right;
	color: #fff;
}

/* Education: one stacked bar, shares shading down from the accent, and a
 * legend of dots, labels and counts on white rules. */
.ct-nb-demo__edu {
	display: flex;
	gap: 3px;
	height: 24px;
	margin-bottom: 8px;
}

.ct-nb-demo__edu-seg {
	flex: 0 1 auto;
	min-width: 0;
	background-color: rgba(237, 33, 39, var(--ct-shade));
}

.ct-nb-demo__edu-seg:first-child {
	border-radius: 4px 0 0 4px;
}

.ct-nb-demo__edu-seg:last-child {
	border-radius: 0 4px 4px 0;
}

.ct-nb-demo__edu-legend {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ct-nb-demo__edu-legend li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0;
	padding: 24px 0;
	border-bottom: 1px solid #fff;
	font-family: var(--ct-font-body);
	font-size: 12px;
	line-height: 16px;
	color: #fff;
}

.ct-nb-demo__edu-legend li:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.ct-nb-demo__edu-legend li span:first-child::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: 16px;
	border-radius: 50%;
	background-color: rgba(237, 33, 39, var(--ct-shade));
}

/* Two-part bar: 6px rounded bars, grey then accent, labels beneath. */
.ct-nb-demo__split {
	display: flex;
	gap: 5px;
}

.ct-nb-demo__split-item {
	display: flex;
	flex: 0 1 auto;
	flex-direction: column;
	min-width: 0;
}

.ct-nb-demo__split--percent .ct-nb-demo__split-item:last-child .ct-nb-demo__split-bar {
	background-color: rgba(237, 33, 39, 0.8);
}

.ct-nb-demo__split-bar {
	height: 6px;
	margin-bottom: 12px;
	border-radius: 32px;
	background-color: var(--ct-accent);
}

.ct-nb-demo__split-item:first-child .ct-nb-demo__split-bar {
	background-color: #e7e7e7;
}

.ct-nb-demo__split-label {
	font-family: var(--ct-font-body);
	font-size: 12px;
	line-height: 1.666;
	white-space: nowrap;
	color: #fff;
}

/* A label may be wider than its share: the first runs on from the left,
 * the last back from the right, so a 1% part keeps one readable line. */
.ct-nb-demo__split-item:last-child .ct-nb-demo__split-label {
	align-self: flex-end;
	text-align: right;
}

/* One bar per row: a 6px track, the share shading down from the accent. */
.ct-nb-demo__mono {
	margin-bottom: 24px;
}

.ct-nb-demo__mono:last-child {
	margin-bottom: 0;
}

.ct-nb-demo__mono-bar {
	position: relative;
	display: block;
	height: 6px;
	margin-bottom: 12px;
	border-radius: 32px;
	background-color: #f3f3f3;
}

.ct-nb-demo__mono-bar::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: var(--ct-value);
	border-radius: 32px;
	background-color: rgba(237, 33, 39, var(--ct-shade));
}

.ct-nb-demo__mono-copy {
	display: flex;
	justify-content: space-between;
	font-family: var(--ct-font-body);
	font-size: 12px;
	line-height: 1.666;
	color: #fff;
}

@media (max-width: 1024px) {
	.ct-nb-demo-section.e-con {
		--padding-top: var(--ct-section-padding-compact);
		--padding-bottom: var(--ct-section-padding-compact);
		--padding-left: 32px;
		--padding-right: 32px;
	}

	.ct-nb-demo__tabs {
		margin-bottom: 32px;
	}

	.ct-nb-demo__stats,
	.ct-nb-demo__section {
		padding: 32px 0;
	}

	.ct-nb-demo__stats {
		flex-wrap: wrap;
		gap: 36px 0;
	}

	.ct-nb-demo__stat,
	.ct-nb-demo__stats--three .ct-nb-demo__stat {
		flex-grow: 0;
		width: 33%;
		align-items: flex-start;
		padding: 0;
		border-right: 0;
	}

	.ct-nb-demo__charts {
		flex-direction: column;
		gap: 40px;
	}

	.ct-nb-demo__age {
		margin-bottom: 24px;
	}
}

@media (max-width: 768px) {
	.ct-nb-demo__tabs {
		flex-direction: column;
	}
}

@media (max-width: 767px) {
	.ct-nb-demo-section.e-con {
		--width: 100%;
		--padding-left: 24px;
		--padding-right: 24px;
		margin-inline: 0;
	}

	.ct-nb-demo-section__title .elementor-heading-title {
		font-size: 32px;
		line-height: 1.4;
	}
}

@media (max-width: 560px) {
	.ct-nb-demo__stats {
		flex-direction: column;
		gap: 40px;
	}

	.ct-nb-demo__stat,
	.ct-nb-demo__stats--three .ct-nb-demo__stat {
		width: 100%;
	}

	.ct-nb-demo__value {
		font-size: 16px;
		letter-spacing: 0.75px;
	}
}

@media (max-width: 767px) {
	/* The reference's narrow note: 280px, centred on the icon. */
	.ct-nb-demo__tip {
		width: 280px;
		transform: translateX(-50%);
	}

	.ct-nb-demo__tip::after {
		left: 52%;
	}
}

/* =============================================================== schools --
 * Part 4: Schools in {Neighborhood}, NY. White band in the frame, the
 * 1256px measure; pill tabs per level, the sentence, then the reference's
 * table — Type / Name / Category / Grades / School Rating on black rules.
 * Measured from carytamura.com/neighborhoods/flatiron (FACT). */
.ct-nb-schools-section.e-con {
	--width: 100%;
	--padding-top: var(--ct-space-section);
	--padding-bottom: var(--ct-space-section);
	--padding-left: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--padding-right: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--row-gap: 0px;
	--flex-wrap: nowrap;
}

.ct-nb-schools__title {
	margin: 0 0 24px;
	font-family: var(--ct-font-display);
	font-size: var(--ct-type-h2);
	font-weight: 400;
	line-height: var(--ct-leading-heading);
	letter-spacing: var(--ct-track-heading);
	text-transform: none;
	color: #000;
}

.ct-nb-schools__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
}

.ct-nb-schools__tab {
	height: 34px;
	margin: 0;
	padding: 8px 16px;
	border: 1px solid var(--ct-accent-strong);
	border-radius: 33px;
	background-color: transparent;
	font-family: var(--ct-font-body);
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--ct-accent-strong);
	cursor: pointer;
	transition: all 0.3s linear;
}

.ct-nb-schools__tab:hover,
.ct-nb-schools__tab:focus {
	background-color: transparent;
	color: var(--ct-accent-strong);
}

.ct-nb-schools__tab[aria-pressed="true"] {
	background-color: var(--ct-accent-strong);
	color: #fff;
}

.ct-nb-schools__tab:focus-visible {
	outline: 2px solid var(--ct-accent-strong);
	outline-offset: 2px;
}

.ct-nb-schools__desc {
	max-width: 65%;
	margin: 0 0 32px;
	font-family: var(--ct-font-body);
	font-size: 15px;
	line-height: 1.666;
	color: #000;
}

/* Table: Type 73px and Rating 293px fixed; Name / Category / Grades grow
 * equally from 320 / 125 / 125 (FACT: 1024 and 1440 both measure so). */
.ct-nb-schools__head,
.ct-nb-schools__row {
	display: flex;
	align-items: center;
}

.ct-nb-schools__head {
	padding: 16px 0;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
}

.ct-nb-schools__cell {
	min-width: 0;
	padding-right: 16px;
}

.ct-nb-schools__cell--type { flex: 0 0 73px; padding-left: 16px; }
.ct-nb-schools__cell--name { flex: 1 1 320px; }
.ct-nb-schools__cell--category,
.ct-nb-schools__cell--grades { flex: 1 1 125px; }
.ct-nb-schools__cell--rating { flex: 0 0 293px; padding-left: 16px; }

.ct-nb-schools__head .ct-nb-schools__cell {
	display: flex;
	align-items: center;
	gap: 6px;
	font-family: var(--ct-font-body);
	font-size: 12px;
	font-weight: 600;
	line-height: 14px;
	text-transform: uppercase;
	color: var(--ct-label);
}

.ct-nb-schools__wide {
	white-space: pre;
}

.ct-nb-schools__sort {
	display: inline-flex;
	flex-direction: column;
	gap: 1px;
}

.ct-nb-schools__arrow,
.ct-nb-schools__arrow:hover,
.ct-nb-schools__arrow:focus {
	display: block;
	width: 8px;
	height: 7px;
	margin: 0;
	padding: 0;
	border: 0;
	background-color: transparent;
	cursor: pointer;
}

/* The arrow is drawn (and, for the down arrow, turned) on ::before only.
 * Transforming the button itself would make it the containing block of its
 * screen-reader label and flip Elementor's top: -10000em to ~160,000px below
 * the page. */
.ct-nb-schools__arrow::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: #848484;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='5' viewBox='0 0 6 5' fill='none'%3E%3Cpath fill='%23000' d='M2.43238 0.786516C2.71178 0.399375 3.28822 0.399375 3.56762 0.786516L5.66329 3.69036C5.99739 4.15331 5.66659 4.8 5.09567 4.8H0.904333C0.333408 4.8 0.00260603 4.15331 0.336715 3.69036L2.43238 0.786516Z'/%3E%3C/svg%3E") center / 6px 5px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='5' viewBox='0 0 6 5' fill='none'%3E%3Cpath fill='%23000' d='M2.43238 0.786516C2.71178 0.399375 3.28822 0.399375 3.56762 0.786516L5.66329 3.69036C5.99739 4.15331 5.66659 4.8 5.09567 4.8H0.904333C0.333408 4.8 0.00260603 4.15331 0.336715 3.69036L2.43238 0.786516Z'/%3E%3C/svg%3E") center / 6px 5px no-repeat;
}

.ct-nb-schools__arrow--down::before {
	transform: rotate(180deg);
}

.ct-nb-schools__arrow:hover::before,
.ct-nb-schools__arrow:focus::before {
	background-color: #000;
}

.ct-nb-schools__row {
	padding: 24px 0;
	border-bottom: 1px solid #000;
}

.ct-nb-schools__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: var(--ct-accent);
}

.ct-nb-schools__icon--middle { background-color: rgba(237, 33, 39, 0.75); }
.ct-nb-schools__icon--high   { background-color: rgba(237, 33, 39, 0.5); }
.ct-nb-schools__icon--mixed  { background-color: rgba(237, 33, 39, 0.25); }

.ct-nb-schools__icon::after {
	content: "";
	width: 20px;
	height: 20px;
	background-color: #fff;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath fill='%23000' d='M19 18.5002H18.5V17.0002C18.5186 16.7985 18.4926 16.5953 18.4238 16.4048C18.355 16.2144 18.2451 16.0414 18.1019 15.8982C17.9588 15.755 17.7858 15.6451 17.5954 15.5763C17.4049 15.5075 17.2016 15.4815 17 15.5002H16.5V9.50016H17C17.2016 9.51879 17.4049 9.49278 17.5954 9.42399C17.7858 9.35519 17.9588 9.2453 18.1019 9.10211C18.2451 8.95893 18.355 8.78596 18.4238 8.59551C18.4926 8.40506 18.5186 8.2018 18.5 8.00016V5.44116C18.5009 5.1625 18.4238 4.88916 18.2772 4.65213C18.1307 4.41511 17.9207 4.22389 17.671 4.10016L10.9 0.711164C10.6217 0.573545 10.3155 0.501953 10.005 0.501953C9.69455 0.501953 9.38828 0.573545 9.11 0.711164L2.329 4.10016C2.07931 4.22389 1.86929 4.41511 1.72276 4.65213C1.57623 4.88916 1.49906 5.1625 1.5 5.44116V8.00016C1.48137 8.2018 1.50738 8.40506 1.57618 8.59551C1.64497 8.78596 1.75487 8.95893 1.89805 9.10211C2.04124 9.2453 2.2142 9.35519 2.40465 9.42399C2.5951 9.49278 2.79836 9.51879 3 9.50016H3.5V15.5002H3C2.79836 15.4815 2.5951 15.5075 2.40465 15.5763C2.2142 15.6451 2.04124 15.755 1.89805 15.8982C1.75487 16.0414 1.64497 16.2144 1.57618 16.4048C1.50738 16.5953 1.48137 16.7985 1.5 17.0002V18.5002H1C0.867392 18.5002 0.740215 18.5528 0.646447 18.6466C0.552679 18.7404 0.5 18.8676 0.5 19.0002C0.5 19.1328 0.552679 19.2599 0.646447 19.3537C0.740215 19.4475 0.867392 19.5002 1 19.5002H19C19.1326 19.5002 19.2598 19.4475 19.3536 19.3537C19.4473 19.2599 19.5 19.1328 19.5 19.0002C19.5 18.8676 19.4473 18.7404 19.3536 18.6466C19.2598 18.5528 19.1326 18.5002 19 18.5002ZM15.5 15.5002H12.5V9.50016H15.5V15.5002ZM8.5 15.5002V9.50016H11.5V15.5002H8.5ZM2.5 8.00016V5.44116C2.5 5.34839 2.52582 5.25744 2.57456 5.1785C2.62331 5.09955 2.69305 5.03573 2.776 4.99416L9.553 1.60516C9.6918 1.53581 9.84484 1.4997 10 1.4997C10.1552 1.4997 10.3082 1.53581 10.447 1.60516L17.224 4.99416C17.3069 5.03573 17.3767 5.09955 17.4254 5.1785C17.4742 5.25744 17.5 5.34839 17.5 5.44116V8.00016C17.5 8.39316 17.393 8.50016 17 8.50016H3C2.607 8.50016 2.5 8.39316 2.5 8.00016ZM4.5 9.50016H7.5V15.5002H4.5V9.50016ZM2.5 17.0002C2.5 16.6072 2.607 16.5002 3 16.5002H17C17.393 16.5002 17.5 16.6072 17.5 17.0002V18.5002H2.5V17.0002ZM9 5.00016C9 4.80238 9.05865 4.60904 9.16853 4.44459C9.27841 4.28014 9.43459 4.15197 9.61732 4.07628C9.80004 4.0006 10.0011 3.98079 10.1951 4.01938C10.3891 4.05796 10.5673 4.15321 10.7071 4.29306C10.847 4.43291 10.9422 4.61109 10.9808 4.80507C11.0194 4.99905 10.9996 5.20012 10.9239 5.38285C10.8482 5.56557 10.72 5.72175 10.5556 5.83163C10.3911 5.94151 10.1978 6.00016 10 6.00016C9.73478 6.00016 9.48043 5.89481 9.29289 5.70727C9.10536 5.51973 9 5.26538 9 5.00016Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath fill='%23000' d='M19 18.5002H18.5V17.0002C18.5186 16.7985 18.4926 16.5953 18.4238 16.4048C18.355 16.2144 18.2451 16.0414 18.1019 15.8982C17.9588 15.755 17.7858 15.6451 17.5954 15.5763C17.4049 15.5075 17.2016 15.4815 17 15.5002H16.5V9.50016H17C17.2016 9.51879 17.4049 9.49278 17.5954 9.42399C17.7858 9.35519 17.9588 9.2453 18.1019 9.10211C18.2451 8.95893 18.355 8.78596 18.4238 8.59551C18.4926 8.40506 18.5186 8.2018 18.5 8.00016V5.44116C18.5009 5.1625 18.4238 4.88916 18.2772 4.65213C18.1307 4.41511 17.9207 4.22389 17.671 4.10016L10.9 0.711164C10.6217 0.573545 10.3155 0.501953 10.005 0.501953C9.69455 0.501953 9.38828 0.573545 9.11 0.711164L2.329 4.10016C2.07931 4.22389 1.86929 4.41511 1.72276 4.65213C1.57623 4.88916 1.49906 5.1625 1.5 5.44116V8.00016C1.48137 8.2018 1.50738 8.40506 1.57618 8.59551C1.64497 8.78596 1.75487 8.95893 1.89805 9.10211C2.04124 9.2453 2.2142 9.35519 2.40465 9.42399C2.5951 9.49278 2.79836 9.51879 3 9.50016H3.5V15.5002H3C2.79836 15.4815 2.5951 15.5075 2.40465 15.5763C2.2142 15.6451 2.04124 15.755 1.89805 15.8982C1.75487 16.0414 1.64497 16.2144 1.57618 16.4048C1.50738 16.5953 1.48137 16.7985 1.5 17.0002V18.5002H1C0.867392 18.5002 0.740215 18.5528 0.646447 18.6466C0.552679 18.7404 0.5 18.8676 0.5 19.0002C0.5 19.1328 0.552679 19.2599 0.646447 19.3537C0.740215 19.4475 0.867392 19.5002 1 19.5002H19C19.1326 19.5002 19.2598 19.4475 19.3536 19.3537C19.4473 19.2599 19.5 19.1328 19.5 19.0002C19.5 18.8676 19.4473 18.7404 19.3536 18.6466C19.2598 18.5528 19.1326 18.5002 19 18.5002ZM15.5 15.5002H12.5V9.50016H15.5V15.5002ZM8.5 15.5002V9.50016H11.5V15.5002H8.5ZM2.5 8.00016V5.44116C2.5 5.34839 2.52582 5.25744 2.57456 5.1785C2.62331 5.09955 2.69305 5.03573 2.776 4.99416L9.553 1.60516C9.6918 1.53581 9.84484 1.4997 10 1.4997C10.1552 1.4997 10.3082 1.53581 10.447 1.60516L17.224 4.99416C17.3069 5.03573 17.3767 5.09955 17.4254 5.1785C17.4742 5.25744 17.5 5.34839 17.5 5.44116V8.00016C17.5 8.39316 17.393 8.50016 17 8.50016H3C2.607 8.50016 2.5 8.39316 2.5 8.00016ZM4.5 9.50016H7.5V15.5002H4.5V9.50016ZM2.5 17.0002C2.5 16.6072 2.607 16.5002 3 16.5002H17C17.393 16.5002 17.5 16.6072 17.5 17.0002V18.5002H2.5V17.0002ZM9 5.00016C9 4.80238 9.05865 4.60904 9.16853 4.44459C9.27841 4.28014 9.43459 4.15197 9.61732 4.07628C9.80004 4.0006 10.0011 3.98079 10.1951 4.01938C10.3891 4.05796 10.5673 4.15321 10.7071 4.29306C10.847 4.43291 10.9422 4.61109 10.9808 4.80507C11.0194 4.99905 10.9996 5.20012 10.9239 5.38285C10.8482 5.56557 10.72 5.72175 10.5556 5.83163C10.3911 5.94151 10.1978 6.00016 10 6.00016C9.73478 6.00016 9.48043 5.89481 9.29289 5.70727C9.10536 5.51973 9 5.26538 9 5.00016Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.ct-nb-schools__row .ct-nb-schools__cell--name {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
}

.ct-nb-schools__name {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: var(--ct-font-body);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.666;
	color: #000;
}

.ct-nb-schools__site {
	flex: none;
	width: 16px;
	height: 16px;
	background-color: #000;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill='%23000' d='M11.8626 5.27475C12.1766 4.96071 12.1766 4.45156 11.8626 4.13752C11.5485 3.82349 11.0394 3.82349 10.7253 4.13752L3.90199 10.9609C3.58795 11.2749 3.58795 11.7841 3.90199 12.0981C4.21602 12.4121 4.72518 12.4121 5.03921 12.0981L11.8626 5.27475Z'/%3E%3Cpath fill='%23000' d='M5.03925 4.94159C4.59513 4.94159 4.23511 4.58157 4.23511 4.13745C4.23511 3.69334 4.59513 3.33331 5.03925 3.33331H11.8626C12.2931 3.33331 12.6473 3.6724 12.666 4.10252L12.9503 10.6416C12.9696 11.0853 12.6255 11.4606 12.1818 11.4799C11.7381 11.4992 11.3628 11.1551 11.3435 10.7114L11.0927 4.94159H5.03925Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill='%23000' d='M11.8626 5.27475C12.1766 4.96071 12.1766 4.45156 11.8626 4.13752C11.5485 3.82349 11.0394 3.82349 10.7253 4.13752L3.90199 10.9609C3.58795 11.2749 3.58795 11.7841 3.90199 12.0981C4.21602 12.4121 4.72518 12.4121 5.03921 12.0981L11.8626 5.27475Z'/%3E%3Cpath fill='%23000' d='M5.03925 4.94159C4.59513 4.94159 4.23511 4.58157 4.23511 4.13745C4.23511 3.69334 4.59513 3.33331 5.03925 3.33331H11.8626C12.2931 3.33331 12.6473 3.6724 12.666 4.10252L12.9503 10.6416C12.9696 11.0853 12.6255 11.4606 12.1818 11.4799C11.7381 11.4992 11.3628 11.1551 11.3435 10.7114L11.0927 4.94159H5.03925Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* The address: a grey hairline, the accent drawn across it on hover (0.4s),
 * as the reference's lp-link. */
.ct-nb-schools__address {
	position: relative;
	font-family: var(--ct-font-body);
	font-size: 12px;
	line-height: 12px;
	color: #000;
	text-decoration: none;
}

.ct-nb-schools__address::before,
.ct-nb-schools__address::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	height: 1px;
	transition: width 0.4s;
}

.ct-nb-schools__address::before {
	width: 100%;
	background-color: #ccc;
}

.ct-nb-schools__address::after {
	width: 0;
	background-color: var(--ct-accent);
}

.ct-nb-schools__address:hover::after,
.ct-nb-schools__address:focus-visible::after {
	width: 100%;
}

.ct-nb-schools__category {
	display: inline-block;
	padding: 4px 8px;
	background-color: #f8f7f5;
	font-family: var(--ct-font-body);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	text-transform: capitalize;
	color: #000;
}

.ct-nb-schools__cell--grades,
.ct-nb-schools__score {
	font-family: var(--ct-font-body);
	font-size: 14px;
	line-height: 1;
	color: var(--ct-label);
}

.ct-nb-schools__row .ct-nb-schools__cell--category,
.ct-nb-schools__row .ct-nb-schools__cell--rating {
	line-height: 1;
}

.ct-nb-schools__cell--rating {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ct-nb-schools__score {
	font-size: 16px;
}

/* Five stars in text, filled to the rating in stone over black (FACT). */
.ct-nb-schools__stars {
	width: 80px;
	font-size: 16px;
	line-height: 16px;
}

.ct-nb-schools__stars::before {
	content: "\2605\2605\2605\2605\2605";
	background-image: linear-gradient(90deg, #f8f7f5 calc(var(--ct-rating) / 5 * 100%), #000 0);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

.ct-nb-schools__more {
	margin-top: 32px;
}

.ct-nb-schools__more-btn {
	width: 100%;
}

.ct-nb-schools__more-btn[hidden] {
	display: none;
}

/* ================================================================= photo --
 * The neighborhood's featured image as an inset panel within the gutters. */
.ct-nb-photo.e-con {
	--width: auto;
	--min-height: 0px;
	margin-inline: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	height: clamp(280px, 40vw, 600px);
	padding: 0;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

/* ============================================================== explore --
 * Explore Other Neighborhoods: centred heading, three 10:7 cards across the
 * frame (CT Loop – Neighborhood Card, as on /neighborhoods/), View All. */
.ct-nb-explore.e-con {
	--width: 100%;
	--padding-top: var(--ct-space-section);
	--padding-bottom: var(--ct-space-section);
	--padding-left: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--padding-right: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--row-gap: 32px;
	--flex-wrap: nowrap;
}

.ct-nb-explore__title .elementor-heading-title {
	margin: 0;
	font-family: var(--ct-font-display);
	font-size: var(--ct-type-h2);
	font-weight: 400;
	line-height: var(--ct-leading-heading);
	letter-spacing: var(--ct-track-heading);
	text-transform: none;
	text-align: left;
	color: var(--ct-ink);
}

.ct-nb-explore .elementor-loop-container {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px 32px;
}

.ct-nb-explore .ct-nb-explore__all {
	margin-top: 28px;
	text-align: center;
}

@media (max-width: 1024px) {
	.ct-nb-schools-section.e-con {
		--padding-left: 32px;
		--padding-right: 32px;
	}
}

@media (max-width: 768px) {
	.ct-nb-schools-section.e-con,
	.ct-nb-explore.e-con {
		--padding-top: var(--ct-section-padding-compact);
		--padding-bottom: var(--ct-section-padding-compact);
	}

	.ct-nb-schools__tabs {
		flex-direction: column;
		gap: 14px;
	}

	.ct-nb-schools__desc {
		max-width: none;
	}

	/* Rows stack: name with its icon, then category, grades and rating. */
	.ct-nb-schools__head .ct-nb-schools__cell--type,
	.ct-nb-schools__head .ct-nb-schools__cell--grades {
		display: none;
	}

	.ct-nb-schools__head .ct-nb-schools__cell--name { flex: 0 0 47%; }
	.ct-nb-schools__head .ct-nb-schools__cell--category { flex: 1 1 auto; }
	.ct-nb-schools__head .ct-nb-schools__cell--rating { flex: 0 0 auto; padding-left: 0; }

	/* The icon sits straight after a 320px name column (FACT at 768). */
	.ct-nb-schools__row {
		display: grid;
		grid-template-columns: minmax(0, 320px) 40px;
		gap: 24px 0;
		align-items: start;
	}

	.ct-nb-schools__row .ct-nb-schools__cell {
		padding: 0;
	}

	.ct-nb-schools__row .ct-nb-schools__cell--type { grid-column: 2; grid-row: 1; }
	.ct-nb-schools__row .ct-nb-schools__cell--name { grid-column: 1; grid-row: 1; }
	.ct-nb-schools__row .ct-nb-schools__cell--category,
	.ct-nb-schools__row .ct-nb-schools__cell--grades,
	.ct-nb-schools__row .ct-nb-schools__cell--rating { grid-column: 1 / -1; }

	.ct-nb-photo.e-con {
		height: 395px;
	}

	.ct-nb-explore .elementor-loop-container {
		grid-template-columns: minmax(0, 1fr);
	}

	.ct-nb-explore .ct-nb-explore__all {
		margin-top: 8px;
	}

	.ct-nb-explore .ct-nb-explore__all .elementor-button {
		width: 100%;
	}
}

@media (max-width: 767px) {
	.ct-nb-schools-section.e-con,
	.ct-nb-photo.e-con,
	.ct-nb-explore.e-con {
		--width: 100%;
		margin-inline: 0;
	}

	.ct-nb-schools-section.e-con {
		--padding-left: 24px;
		--padding-right: 24px;
	}

	.ct-nb-schools__title,
	.ct-nb-explore__title .elementor-heading-title {
		font-size: 32px;
		line-height: 1.4;
	}

	.ct-nb-explore__title {
		padding-inline: 25px;
	}

}

@media (max-width: 560px) {
	.ct-nb-schools__head .ct-nb-schools__cell--name { flex-basis: 119px; }
	.ct-nb-schools__wide { display: none; }

	.ct-nb-schools__row {
		grid-template-columns: 1fr;
	}

	.ct-nb-schools__row .ct-nb-schools__cell--type { grid-column: 1; grid-row: 1; }
	.ct-nb-schools__row .ct-nb-schools__cell--name { grid-column: 1; grid-row: 2; }
}

/* =================================================================== map --
 * The neighborhood's centre on VM Listings' location map
 * ([vm_neighborhood_map], Leaflet with the configured provider), in the
 * frame between the photo and Explore: 500px, 206px from 768 (FACT: the
 * live map's heights). The "open in maps" link stays reachable by keyboard
 * and screen reader, shown when focused, so it adds no height. */
.ct-nb-map.e-con {
	--width: 100%;
	--padding-top: var(--ct-space-block);
	--padding-bottom: 0px;
	--padding-left: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--padding-right: max(var(--ct-gutter), calc((100% - var(--ct-max)) / 2));
	--row-gap: 0px;
}

.ct-nb-map .rb-point-map {
	position: relative;
}

.ct-nb-map .rb-point-map__canvas {
	z-index: 0;
	height: 500px;
	background-color: #f3f3f3;
}

/* The reference's pin is black; the vendored marker is tinted to match. */
.ct-nb-map .leaflet-marker-icon {
	filter: grayscale(1) brightness(0.3);
}

.ct-nb-map .rb-point-map__fallback {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 1000;
	margin: 0;
}

.ct-nb-map .rb-point-map__link {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.ct-nb-map .rb-point-map__link:focus {
	position: static;
	display: inline-block;
	width: auto;
	height: auto;
	padding: 8px 12px;
	clip-path: none;
	background-color: #fff;
	font-family: var(--ct-font-body);
	font-size: 14px;
	color: #000;
	outline: 2px solid var(--ct-accent);
}

@media (max-width: 768px) {
	.ct-nb-map .rb-point-map__canvas {
		height: 206px;
	}
}

@media (max-width: 767px) {
	.ct-nb-map.e-con {
		--width: 100%;
		margin-inline: 0;
	}
}
