/* ==========================================================================
   Nhà Phố Trung Tâm — Modernist interface
   Flat, architectural, one typeface. 2px rules do the organising: no rounded
   corners, no shadows, everything flush left.
   Tokens are copied verbatim from the design handoff.
   ========================================================================== */

:root {
	--color-bg: #f3f2f2;
	--color-surface: #eae9e9;
	--color-text: #201e1d;
	--color-accent: #ec3013;
	--color-accent-600: #dd2b0f;
	--color-accent-700: #ae1800;
	--color-neutral-100: #f8f4f4;
	--color-neutral-700: #605d5d;
	--color-neutral-800: #444141;
	--color-divider: rgba(32, 30, 29, .4);

	--font: "Archivo", system-ui, "Segoe UI", sans-serif;

	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-6: 24px;
	--space-8: 32px;

	--rule: 2px solid var(--color-text);
	--hairline: 1px solid var(--color-divider);
	--shell: 1200px;

	/* Image frames. The handoff fixes these ratios; heights are what the mockup
	   happened to render at one width, so ratio is the source of truth. */
	--ratio-card: 4 / 3;
	--ratio-wide: 16 / 9;
	/* A lone image spans the full width, so it needs a wider frame to land on
	   the same block height as the two- and three-image layouts. At any width
	   all three resolve to 0.375 x container, so the gallery never changes
	   height just because a listing has fewer photographs. */
	--ratio-solo: 8 / 3;
	--fade: background-color .12s linear, color .12s linear, border-color .12s linear;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

.nptt-main-site,
.nptt-main-site *,
.nptt-main-site *::before,
.nptt-main-site *::after {
	box-sizing: border-box;
}

body.nptt-main-site,
.nptt-main-site button,
.nptt-main-site input,
.nptt-main-site select,
.nptt-main-site textarea {
	font-family: var(--font) !important;
}

body.nptt-main-site {
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.55;
	/* clip, not hidden: overflow-x:hidden makes body a scroll container,
	   which silently disables position:sticky on every descendant — including
	   the contact column. clip prevents sideways scrolling without that. */
	overflow-x: clip;
}

.nptt-main-site h1,
.nptt-main-site h2,
.nptt-main-site h3,
.nptt-main-site h4,
.nptt-main-site h5,
.nptt-main-site h6 {
	margin: 0;
	font-weight: 800;
	letter-spacing: -.015em;
	line-height: 1.15;
}

.nptt-main-site p {
	margin: 0;
}

.nptt-main-site img {
	display: block;
	max-width: 100%;
}

.nptt-main-site a {
	color: var(--color-accent);
	text-decoration: none;
	text-underline-offset: 3px;
	transition: var(--fade);
}

.nptt-main-site a:hover {
	color: var(--color-accent-700);
	text-decoration: underline;
}

.nptt-main-site ul,
.nptt-main-site ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

.nptt-main-site :focus {
	outline: none;
}

.nptt-main-site :focus-visible {
	outline: 2px solid var(--color-accent);
	outline-offset: 2px;
}

.nptt-main-site ::selection {
	background: rgba(236, 48, 19, .3);
}

.nptt-main-site .nptt-i {
	flex: none;
}

.nptt-skip-link {
	position: absolute;
	top: -60px;
	left: 0;
	z-index: 200;
	padding: 10px 16px;
	background: var(--color-text);
	color: var(--color-bg) !important;
	font-size: 13px;
	font-weight: 800;
}

.nptt-skip-link:focus {
	top: 0;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* --------------------------------------------------------------------------
   Layout primitives
   -------------------------------------------------------------------------- */

.nptt-shell {
	width: min(100% - 32px, var(--shell));
	margin-inline: auto;
}

.nptt-kicker {
	color: var(--color-accent-700);
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.nptt-label {
	display: block;
	color: var(--color-neutral-700);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.nptt-muted {
	color: var(--color-neutral-700);
	font-size: 13px;
}

.nptt-frame {
	border: var(--rule);
	background: var(--color-neutral-100);
}

/* --------------------------------------------------------------------------
   Buttons, chips, badges
   -------------------------------------------------------------------------- */

/* These are prefixed with .nptt-main-site so they outrank the generic
   `.nptt-main-site a { color: accent }` link rule — an unprefixed
   `.nptt-btn--primary` loses to it and paints red text on a red fill. */
.nptt-main-site .nptt-btn {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: 6px;
	padding: 10px 14px;
	border: 2px solid transparent;
	border-radius: 0;
	background: transparent;
	color: var(--color-text);
	font-family: var(--font);
	font-size: 14px;
	font-weight: 800;
	line-height: 1.2;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
	transition: var(--fade);
}

.nptt-main-site .nptt-btn:hover {
	text-decoration: none;
}

.nptt-main-site .nptt-btn--primary {
	background: var(--color-accent);
	color: var(--color-bg);
}

.nptt-main-site .nptt-btn--primary:hover {
	background: var(--color-accent-600);
	color: var(--color-bg);
}

.nptt-main-site .nptt-btn--primary:active {
	background: var(--color-accent-700);
}

.nptt-main-site .nptt-btn--secondary {
	border-color: var(--color-text);
	color: var(--color-text);
}

.nptt-main-site .nptt-btn--secondary:hover {
	background: rgba(32, 30, 29, .07);
	color: var(--color-text);
}

.nptt-main-site .nptt-btn--secondary:active {
	background: rgba(32, 30, 29, .14);
}

.nptt-main-site .nptt-btn--dark {
	background: var(--color-text);
	color: var(--color-bg);
}

.nptt-main-site .nptt-btn--dark:hover {
	background: #000;
	color: var(--color-bg);
}

.nptt-main-site .nptt-btn--light {
	background: var(--color-bg);
	color: var(--color-text);
}

.nptt-main-site .nptt-btn--light:hover {
	background: #fff;
	color: var(--color-text);
}

.nptt-main-site .nptt-btn--block {
	width: 100%;
}

.nptt-main-site .nptt-btn--sm {
	padding: 6px 10px;
	font-size: 12px;
}

.nptt-main-site .nptt-btn[disabled] {
	opacity: .45;
	cursor: not-allowed;
}

.nptt-main-site .nptt-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 8px;
	border: var(--hairline);
	background: transparent;
	color: var(--color-text);
	font-size: 12px;
	line-height: 1.2;
	cursor: pointer;
	transition: var(--fade);
}

.nptt-main-site .nptt-chip:hover {
	background: rgba(32, 30, 29, .07);
	color: var(--color-text);
	text-decoration: none;
}

.nptt-main-site .nptt-chip.is-active,
.nptt-main-site .nptt-chip[aria-pressed="true"] {
	border-color: var(--color-accent);
	background: var(--color-accent);
	color: var(--color-bg);
	font-weight: 800;
}

.nptt-main-site .nptt-chip.is-active:hover {
	background: var(--color-accent-600);
	color: var(--color-bg);
}

.nptt-main-site .nptt-conditionbar__clear,
.nptt-main-site .nptt-text-link {
	color: var(--color-accent-700);
	font-weight: 800;
}

.nptt-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
}

.nptt-badge {
	display: inline-flex;
	align-items: center;
	padding: 5px 8px;
	background: var(--color-text);
	color: var(--color-bg);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .06em;
	line-height: 1.2;
	text-transform: uppercase;
}

.nptt-badge--accent {
	background: var(--color-accent);
}

/* Fields ------------------------------------------------------------------ */

.nptt-input,
.nptt-main-site select.nptt-input,
.nptt-main-site input.nptt-input {
	width: 100%;
	padding: 8px 10px;
	border: var(--rule);
	border-radius: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font);
	font-size: 13px;
	line-height: 1.4;
	appearance: none;
}

.nptt-input:focus-visible {
	outline: 2px solid var(--color-accent);
	outline-offset: 0;
}

.nptt-select {
	position: relative;
	display: block;
}

.nptt-select select {
	padding-right: 28px;
}

.nptt-select > .nptt-i {
	position: absolute;
	top: 50%;
	right: 8px;
	transform: translateY(-50%);
	pointer-events: none;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

.nptt-utility {
	background: var(--color-text);
	color: var(--color-bg);
	font-size: 12px;
}

.nptt-utility__inner {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	align-items: center;
	justify-content: space-between;
	padding: 8px 20px;
}

.nptt-utility__group {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	align-items: center;
}

.nptt-utility a {
	color: var(--color-bg);
}

.nptt-utility a:hover {
	color: #fff;
}

.nptt-header {
	position: relative;
	z-index: 40;
	border-bottom: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-header__inner {
	display: flex;
	align-items: stretch;
	min-height: 64px;
	padding: 0;
}

.nptt-brand {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 230px;
	padding: 16px 20px;
	border-right: var(--rule);
	color: var(--color-text) !important;
	text-decoration: none;
}

.nptt-brand:hover {
	text-decoration: none;
}

.nptt-brand strong {
	display: block;
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -.015em;
	line-height: 1.1;
}

.nptt-brand small {
	display: block;
	margin-top: 2px;
	color: var(--color-accent-700);
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
}

/* Capped so a Customizer logo keeps the header the same height as the
   wordmark it replaces. */
.nptt-brand img {
	max-height: 32px;
	width: auto;
}

.nptt-nav {
	display: flex;
	flex: 1;
	gap: 26px;
	align-items: center;
	padding: 0 20px;
	overflow: hidden;
}

.nptt-nav a {
	display: flex;
	align-items: center;
	height: 100%;
	border-bottom: 3px solid transparent;
	color: var(--color-text);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	white-space: nowrap;
}

.nptt-nav a:hover {
	color: var(--color-accent-700);
	text-decoration: none;
}

.nptt-nav a[aria-current="page"],
.nptt-nav a.is-current {
	border-bottom-color: var(--color-accent);
	color: var(--color-text);
}

.nptt-header__actions {
	display: flex;
	align-items: stretch;
	border-left: var(--rule);
}

.nptt-main-site .nptt-header__search {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 0 16px;
	border-right: var(--rule);
	color: var(--color-text);
	font-size: 13px;
	font-weight: 400;
}

.nptt-main-site .nptt-header__search:hover {
	background: rgba(32, 30, 29, .07);
	color: var(--color-text);
	text-decoration: none;
}

.nptt-header__cta {
	display: flex;
	align-items: center;
	padding: 0 20px;
	background: var(--color-accent);
	color: var(--color-bg) !important;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	transition: var(--fade);
}

.nptt-header__cta:hover {
	background: var(--color-accent-600);
	text-decoration: none;
}

.nptt-header__cta:active {
	background: var(--color-accent-700);
}

.nptt-menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 48px;
	padding: 0;
	border: 0;
	border-left: var(--rule);
	background: transparent;
	color: var(--color-text);
	cursor: pointer;
}

/* Mobile search + category rail */
.nptt-mobile-search {
	display: none;
	flex-direction: column;
	gap: var(--space-2);
	padding: 10px 16px;
	border-bottom: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-mobile-search form {
	display: flex;
}

.nptt-mobile-search input {
	flex: 1;
	padding: 10px 12px;
	border: var(--rule);
	border-right: 0;
	background: var(--color-bg);
	font-size: 14px;
}

.nptt-mobile-search button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	border: 0;
	background: var(--color-accent);
	color: var(--color-bg);
	cursor: pointer;
}

.nptt-mobile-rail {
	display: flex;
	gap: 6px;
	overflow-x: auto;
	scrollbar-width: none;
}

.nptt-mobile-rail::-webkit-scrollbar {
	display: none;
}

.nptt-mobile-rail .nptt-chip {
	white-space: nowrap;
}

.nptt-mobile-nav {
	border-bottom: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-mobile-nav a {
	display: block;
	padding: 12px 16px;
	border-bottom: var(--hairline);
	color: var(--color-text);
	font-size: 14px;
	font-weight: 800;
}

.nptt-mobile-nav a:last-child {
	border-bottom: 0;
}

/* --------------------------------------------------------------------------
   Home — hero
   -------------------------------------------------------------------------- */

.nptt-home {
	padding-bottom: 0;
}

.nptt-hero {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	margin-top: var(--space-6);
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-hero__copy {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
	padding: 36px 32px 28px;
	border-right: var(--rule);
}

.nptt-hero h1 {
	max-width: 22ch;
	font-size: 40px;
	line-height: 1.05;
}

.nptt-hero__lead {
	max-width: 44ch;
	color: var(--color-neutral-800);
	font-size: 15px;
}

.nptt-quickfilter {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr auto;
	border: var(--rule);
	background: var(--color-bg);
}

.nptt-quickfilter__cell {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 10px 12px;
	border-right: var(--rule);
}

.nptt-quickfilter__cell select {
	width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--color-text);
	font-family: var(--font);
	font-size: 14px;
	font-weight: 800;
	appearance: none;
	cursor: pointer;
}

.nptt-quickfilter button {
	padding-inline: 22px;
	border: 0;
	font-size: 14px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-hero__media {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 360px;
	background: var(--color-surface);
}

.nptt-hero__media > img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nptt-hero__media .nptt-badge {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}

.nptt-hero__card {
	position: relative;
	z-index: 2;
	max-width: 400px;
	margin: var(--space-4);
	padding: var(--space-3) var(--space-4);
	border: var(--rule);
	background: var(--color-neutral-100);
	color: var(--color-text) !important;
}

.nptt-hero__card:hover {
	background: var(--color-surface);
	text-decoration: none;
}

.nptt-hero__card b {
	display: block;
	color: var(--color-accent-700);
	font-size: 26px;
	font-weight: 800;
	line-height: 1.1;
}

.nptt-hero__card strong {
	display: block;
	margin-top: 4px;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.3;
}

.nptt-hero__card span {
	display: block;
	margin-top: 4px;
	color: var(--color-neutral-700);
	font-size: 13px;
}

/* Stats strip -------------------------------------------------------------- */

.nptt-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border: var(--rule);
	border-top: 0;
	background: var(--color-neutral-100);
}

.nptt-stats > div {
	padding: 16px 20px;
	border-right: var(--rule);
}

.nptt-stats > div:last-child {
	border-right: 0;
}

.nptt-stats strong {
	display: block;
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
}

.nptt-stats span {
	display: block;
	margin-top: 2px;
	color: var(--color-neutral-700);
	font-size: 12px;
}

/* --------------------------------------------------------------------------
   Section blocks
   -------------------------------------------------------------------------- */

.nptt-block {
	margin-top: var(--space-8);
}

.nptt-block__head {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: var(--space-4);
}

.nptt-block__head h2 {
	font-size: 22px;
}

.nptt-block__head a {
	font-size: 13px;
	font-weight: 800;
}

.nptt-block__note {
	margin-top: 4px;
	color: var(--color-neutral-700);
	font-size: 13px;
}

/* Category grid ------------------------------------------------------------ */

.nptt-typegrid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-typegrid a {
	display: flex;
	flex-direction: column;
	border-right: var(--rule);
	color: var(--color-text) !important;
}

.nptt-typegrid a:last-child {
	border-right: 0;
}

.nptt-typegrid a:hover {
	background: var(--color-surface);
	text-decoration: none;
}

.nptt-typegrid img {
	width: 100%;
	aspect-ratio: var(--ratio-wide);
	object-fit: cover;
	border-bottom: var(--rule);
}

.nptt-typegrid__body {
	padding: var(--space-3);
}

.nptt-typegrid strong {
	display: block;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.nptt-typegrid span {
	display: block;
	margin-top: 2px;
	color: var(--color-neutral-700);
	font-size: 12px;
}

/* Sort row ----------------------------------------------------------------- */

.nptt-sortrow {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-4);
	align-items: center;
}

.nptt-sortrow a {
	padding-bottom: 3px;
	border-bottom: 3px solid transparent;
	color: var(--color-text);
	font-size: 12px;
	font-weight: 800;
}

.nptt-sortrow a:hover {
	color: var(--color-accent-700);
	text-decoration: none;
}

.nptt-sortrow a.is-active {
	border-bottom-color: var(--color-accent);
}

/* Card grid ---------------------------------------------------------------- */

.nptt-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

/* --------------------------------------------------------------------------
   Standard listing card — the one card used on every screen
   -------------------------------------------------------------------------- */

.nptt-card {
	display: flex;
	flex-direction: column;
	border: var(--rule);
	background: var(--color-neutral-100);
	transition: var(--fade);
}

.nptt-card:hover {
	background: var(--color-surface);
}

.nptt-card__media {
	position: relative;
	display: block;
	aspect-ratio: var(--ratio-card);
	overflow: hidden;
	background: var(--color-surface);
}

.nptt-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nptt-card__media .nptt-badge {
	position: absolute;
	top: 0;
	left: 0;
}

.nptt-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--space-2);
	padding: 14px;
}

.nptt-card__price {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: baseline;
}

.nptt-card__price strong {
	color: var(--color-accent-700);
	font-size: 22px;
	font-weight: 800;
	line-height: 1.1;
}

.nptt-card__price span {
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-card__title {
	display: -webkit-box;
	overflow: hidden;
	font-size: 15px;
	font-weight: 800;
	line-height: 1.3;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.nptt-card__title a {
	color: var(--color-text);
}

.nptt-card__title a:hover {
	color: var(--color-accent-700);
	text-decoration: none;
}

.nptt-card__address {
	color: var(--color-neutral-700);
	font-size: 13px;
}

.nptt-card__specs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin-top: auto;
	border-top: var(--hairline);
	border-bottom: var(--hairline);
}

.nptt-card__specs > div {
	padding: var(--space-2) 0;
	border-right: var(--hairline);
	padding-right: var(--space-2);
}

.nptt-card__specs > div + div {
	padding-left: var(--space-2);
}

.nptt-card__specs > div:last-child {
	border-right: 0;
	padding-right: 0;
}

.nptt-card__specs strong {
	display: block;
	font-size: 14px;
	font-weight: 800;
	line-height: 1.3;
}

.nptt-card__foot {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: center;
	justify-content: space-between;
}

.nptt-card__foot time {
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-card__actions {
	display: flex;
	gap: 6px;
}

/* --------------------------------------------------------------------------
   Red CTA banner
   -------------------------------------------------------------------------- */

.nptt-cta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-6);
	align-items: center;
	justify-content: space-between;
	margin-top: var(--space-8);
	padding: 32px;
	background: var(--color-accent);
	color: var(--color-bg);
}

.nptt-cta .nptt-kicker {
	color: var(--color-bg);
	opacity: .85;
}

.nptt-cta h2 {
	max-width: 26ch;
	margin-top: var(--space-2);
	font-size: 32px;
	line-height: 1.1;
}

/* --------------------------------------------------------------------------
   Archive / filter results
   -------------------------------------------------------------------------- */

/* Both listing screens and the detail page sit inside one drawn frame. */
.nptt-archive,
.nptt-detail {
	margin-top: var(--space-6);
	border: var(--rule);
	background: var(--color-bg);
}

.nptt-archive > .nptt-grid,
.nptt-archive > .navigation,
.nptt-archive > .nptt-empty {
	margin: var(--space-6);
}

.nptt-archive > .nptt-empty {
	border: 0;
	margin: 0;
}

.nptt-page-head {
	padding: 20px 24px;
}

.nptt-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-breadcrumb a {
	color: var(--color-neutral-700);
}

.nptt-breadcrumb a:hover {
	color: var(--color-accent-700);
}

.nptt-page-head h1 {
	margin: var(--space-2) 0 6px;
	font-size: 30px;
}

.nptt-page-head__context {
	color: var(--color-neutral-800);
	font-size: 14px;
}

.nptt-listing-layout {
	display: grid;
	grid-template-columns: 280px 1fr;
	border-top: var(--rule);
}

/* Filter column ------------------------------------------------------------ */

.nptt-filter {
	align-self: start;
	position: sticky;
	top: 0;
	border-right: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-filter__head {
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
	flex-direction: column;
	padding: var(--space-3) var(--space-4);
	border-bottom: var(--rule);
}

.nptt-filter__head strong {
	font-size: 14px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-filter__head span {
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-filter__body {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
	padding: var(--space-4);
}

.nptt-filter__group > .nptt-label {
	margin-bottom: 6px;
}

.nptt-rangelist {
	display: flex;
	flex-direction: column;
}

.nptt-rangelist a {
	display: flex;
	gap: var(--space-2);
	align-items: baseline;
	justify-content: space-between;
	padding: 5px 0;
	border-bottom: var(--hairline);
	color: var(--color-text);
	font-size: 13px;
}

.nptt-rangelist a:last-child {
	border-bottom: 0;
}

.nptt-rangelist a:hover {
	color: var(--color-accent-700);
	text-decoration: none;
}

.nptt-rangelist a.is-active {
	color: var(--color-accent-700);
	font-weight: 800;
}

.nptt-rangelist em {
	color: var(--color-neutral-700);
	font-size: 12px;
	font-style: normal;
}

.nptt-filter__submit {
	padding: var(--space-4);
	padding-top: 0;
}

.nptt-filter__submit .nptt-btn {
	padding: 12px 14px;
}

.nptt-filter__close {
	display: none;
}

/* Results ------------------------------------------------------------------ */

.nptt-results {
	min-width: 0;
}

.nptt-conditionbar {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	align-items: center;
	justify-content: space-between;
	padding: var(--space-3) 20px;
	border-bottom: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-conditionbar__left {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: center;
	font-size: 12px;
}

.nptt-conditionbar__left > span {
	color: var(--color-neutral-700);
}

.nptt-conditionbar .nptt-chip {
	border-color: var(--color-text);
	padding: 4px 8px;
}

.nptt-conditionbar__clear {
	color: var(--color-accent-700);
	font-size: 12px;
	font-weight: 800;
}

.nptt-main-site .nptt-mobile-filter-open {
	display: none;
}

/* Result row --------------------------------------------------------------- */

.nptt-row {
	display: flex;
	border-bottom: var(--rule);
	background: var(--color-bg);
	transition: var(--fade);
}

.nptt-row:hover {
	background: var(--color-neutral-100);
}

.nptt-row__media {
	position: relative;
	flex: 0 0 220px;
	aspect-ratio: var(--ratio-card);
	overflow: hidden;
	border-right: var(--rule);
	background: var(--color-surface);
}

.nptt-row__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nptt-row__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	padding: 14px 18px;
}

.nptt-row__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: center;
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-row__title {
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
}

.nptt-row__title a {
	color: var(--color-text);
}

.nptt-row__title a:hover {
	color: var(--color-accent-700);
	text-decoration: none;
}

.nptt-row__address {
	color: var(--color-neutral-700);
	font-size: 13px;
}

.nptt-row__specs {
	display: flex;
	flex-wrap: wrap;
	gap: 22px;
	margin-top: auto;
	font-size: 13px;
}

.nptt-row__specs span {
	color: var(--color-neutral-700);
}

.nptt-row__specs strong {
	font-weight: 800;
}

.nptt-row__aside {
	display: flex;
	flex: 0 0 210px;
	flex-direction: column;
	gap: var(--space-2);
	padding: 14px;
	border-left: var(--rule);
}

.nptt-row__price {
	color: var(--color-accent-700);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
}

.nptt-row__persqm {
	margin-bottom: 2px;
	color: var(--color-neutral-700);
	font-size: 12px;
}

/* Pagination --------------------------------------------------------------- */

.nptt-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	align-items: center;
	justify-content: space-between;
	padding: 14px 20px;
}

.nptt-pagination__pages {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

.nptt-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	padding: 6px 11px;
	border: var(--hairline);
	color: var(--color-text);
	font-size: 13px;
	font-weight: 800;
}

.nptt-pagination .page-numbers:hover {
	background: rgba(32, 30, 29, .07);
	text-decoration: none;
}

.nptt-pagination .page-numbers.current {
	border-color: var(--color-text);
	background: var(--color-text);
	color: var(--color-bg);
}

.nptt-pagination .page-numbers.dots {
	border-color: transparent;
}

.nptt-pagination__count {
	color: var(--color-neutral-700);
	font-size: 12px;
}

/* Empty state -------------------------------------------------------------- */

.nptt-empty {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	align-items: flex-start;
	padding: 32px 24px;
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-empty h2 {
	font-size: 22px;
}

.nptt-empty p {
	max-width: 62ch;
	color: var(--color-neutral-800);
}

.nptt-empty__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
}

/* --------------------------------------------------------------------------
   Property detail
   -------------------------------------------------------------------------- */

.nptt-detail__head {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-4);
	align-items: flex-start;
	justify-content: space-between;
	padding: 20px 24px;
	border-bottom: var(--rule);
}

.nptt-detail__head h1 {
	max-width: 34ch;
	margin: var(--space-2) 0 6px;
	font-size: 30px;
	line-height: 1.15;
}

.nptt-detail__address {
	color: var(--color-neutral-800);
	font-size: 14px;
}

.nptt-detail__ref {
	color: var(--color-neutral-700);
	font-size: 12px;
	text-align: right;
}

.nptt-detail__ref strong {
	display: block;
	color: var(--color-text);
	font-size: 13px;
	font-weight: 800;
}

/* Gallery ------------------------------------------------------------------ */

.nptt-gallery {
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: 2px;
	padding: 16px 24px;
}

.nptt-gallery__main {
	position: relative;
	display: block;
	aspect-ratio: var(--ratio-wide);
	overflow: hidden;
	background: var(--color-surface);
}

.nptt-gallery__side {
	display: grid;
	grid-template-rows: repeat(2, minmax(0, 1fr));
	gap: 2px;
	min-height: 0;
}

/* A two-image gallery puts its companion beside the lead, not stacked, so the
   two frames match in height and nothing is left blank. */
.nptt-gallery--2 .nptt-gallery__main,
.nptt-gallery--2 .nptt-gallery__side > a {
	aspect-ratio: var(--ratio-card);
}

.nptt-gallery__side > a {
	position: relative;
	display: block;
	min-height: 0;
	overflow: hidden;
	background: var(--color-surface);
}

.nptt-gallery img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nptt-gallery__more {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 5px 8px;
	background: var(--color-text);
	color: var(--color-bg);
	font-size: 11px;
	font-weight: 800;
}

/* One image fills the width; two split it evenly; three keep the lead-plus-two
   arrangement. --0 is the no-image notice. */
.nptt-gallery--0,
.nptt-gallery--1 {
	grid-template-columns: 1fr;
}

.nptt-gallery--1 .nptt-gallery__main {
	aspect-ratio: var(--ratio-solo);
}

.nptt-gallery--2 {
	grid-template-columns: 1fr 1fr;
}

.nptt-gallery--2 .nptt-gallery__side {
	grid-template-rows: minmax(0, 1fr);
}

.nptt-notice {
	display: flex;
	flex-direction: column;
	gap: 4px;
	justify-content: center;
	min-height: 220px;
	padding: var(--space-6);
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-notice strong {
	font-size: 16px;
	font-weight: 800;
}

.nptt-notice span {
	color: var(--color-neutral-700);
	font-size: 13px;
}

/* Detail body -------------------------------------------------------------- */

.nptt-detail__grid {
	display: grid;
	grid-template-columns: 1fr 330px;
	gap: var(--space-6);
	padding: var(--space-6);
}

.nptt-detail__main {
	display: flex;
	flex-direction: column;
	gap: var(--space-6);
	min-width: 0;
}

.nptt-specs {
	border: var(--rule);
}

.nptt-specs__head {
	padding: 10px 14px;
	border-bottom: var(--rule);
	background: var(--color-neutral-100);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-specs__cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.nptt-specs__cols > div:first-child {
	border-right: var(--rule);
}

.nptt-specs__row {
	display: flex;
	gap: var(--space-3);
	align-items: baseline;
	justify-content: space-between;
	padding: 9px 14px;
	border-bottom: var(--hairline);
	font-size: 14px;
}

.nptt-specs__row:last-child {
	border-bottom: 0;
}

.nptt-specs__row span {
	color: var(--color-neutral-700);
}

.nptt-specs__row strong {
	font-weight: 800;
	text-align: right;
}

.nptt-specs__row--price strong {
	color: var(--color-accent-700);
}

.nptt-desc h2,
.nptt-desc h3 {
	margin-bottom: var(--space-2);
	font-size: 18px;
}

/* The reading measure belongs to running text, not to the block. Capping the
   whole container squeezed pasted images down to 533px inside a 795px column
   and wasted a third of the width on every line. */
.nptt-desc .nptt-desc__body {
	color: var(--color-neutral-800);
	font-size: 15px;
}

.nptt-desc__body p,
.nptt-desc__body ul,
.nptt-desc__body ol,
.nptt-desc__body blockquote {
	max-width: 62ch;
}

/* Media and tables are not prose — give them the column. */
.nptt-desc__body img,
.nptt-desc__body figure,
.nptt-desc__body iframe,
.nptt-desc__body video,
.nptt-desc__body table,
.nptt-desc__body p:has(img) {
	max-width: 100%;
	width: 100%;
}

.nptt-desc__body img {
	height: auto;
}

.nptt-desc__body table {
	border-collapse: collapse;
	font-size: 14px;
}

.nptt-desc__body :is(th, td) {
	padding: 8px 10px;
	border: var(--hairline);
	text-align: left;
}

.nptt-desc .nptt-desc__body p {
	margin-bottom: var(--space-3);
}

.nptt-desc .nptt-desc__body img {
	margin: var(--space-3) 0;
}

.nptt-map {
	border: var(--rule);
}

.nptt-map__head {
	display: flex;
	gap: var(--space-3);
	align-items: center;
	justify-content: space-between;
	padding: 10px 14px;
	border-bottom: var(--rule);
	background: var(--color-neutral-100);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-map__head a {
	font-size: 12px;
	letter-spacing: 0;
	text-transform: none;
}

.nptt-map iframe {
	display: block;
	width: 100%;
	height: 200px;
	border: 0;
}

/* Contact column ----------------------------------------------------------- */

.nptt-contact-col {
	align-self: start;
	position: sticky;
	top: 16px;
}

.nptt-contact {
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-contact__price {
	padding: var(--space-4);
	border-bottom: var(--rule);
}

.nptt-contact__price .nptt-label {
	font-size: 11px;
}

.nptt-contact__price strong {
	display: block;
	margin: 2px 0;
	color: var(--color-accent-700);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.05;
}

.nptt-contact__price span {
	color: var(--color-neutral-700);
	font-size: 13px;
}

.nptt-contact__actions {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	padding: var(--space-4);
}

.nptt-contact__actions .nptt-btn--primary {
	padding: 12px 14px;
	font-size: 15px;
}

.nptt-contact__actions .nptt-btn--secondary {
	padding: 10px 14px;
}

.nptt-contact__person {
	display: flex;
	gap: var(--space-3);
	align-items: center;
	padding: var(--space-4);
	border-top: var(--hairline);
}

.nptt-contact__person img {
	width: 38px;
	height: 38px;
	border-radius: 0 !important;
	object-fit: cover;
}

.nptt-contact__person strong {
	display: block;
	font-size: 14px;
	font-weight: 800;
}

.nptt-contact__person span {
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-contact__note {
	padding: var(--space-3) var(--space-4);
	border-top: var(--hairline);
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-detail__actions {
	display: flex;
	border: var(--rule);
	border-top: 0;
}

.nptt-detail__actions > * {
	display: flex;
	flex: 1;
	gap: 6px;
	align-items: center;
	justify-content: center;
	padding: var(--space-3) var(--space-2);
	border: 0;
	border-right: var(--hairline);
	background: transparent;
	color: var(--color-text);
	font-family: var(--font);
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
	transition: var(--fade);
}

.nptt-detail__actions > *:last-child {
	border-right: 0;
}

.nptt-detail__actions > *:hover {
	background: rgba(32, 30, 29, .07);
	color: var(--color-text);
	text-decoration: none;
}

.nptt-detail__actions .liked {
	color: var(--color-accent-700);
}

/* Related ------------------------------------------------------------------ */

.nptt-related {
	padding: var(--space-6);
	border-top: var(--rule);
}

.nptt-related__head {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: var(--space-4);
}

.nptt-related__head h2 {
	font-size: 20px;
}

.nptt-related__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--space-4);
}

.nptt-minicard {
	display: flex;
	flex-direction: column;
	border: var(--rule);
	background: var(--color-neutral-100);
	color: var(--color-text) !important;
	transition: var(--fade);
}

.nptt-minicard:hover {
	background: var(--color-surface);
	text-decoration: none;
}

.nptt-minicard img {
	width: 100%;
	aspect-ratio: var(--ratio-card);
	object-fit: cover;
	border-bottom: var(--rule);
}

.nptt-minicard__body {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: var(--space-3);
}

.nptt-minicard b {
	color: var(--color-accent-700);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.1;
}

.nptt-minicard strong {
	font-size: 13px;
	font-weight: 800;
	line-height: 1.3;
}

.nptt-minicard span {
	color: var(--color-neutral-700);
	font-size: 12px;
}

/* Engagement row, kept at the very bottom of the page --------------------- */

.nptt-engagement {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-4);
	align-items: center;
	padding: var(--space-3) var(--space-6);
	border-top: var(--rule);
	color: var(--color-neutral-700);
	font-size: 13px;
}

.nptt-engagement a,
.nptt-engagement button {
	display: inline-flex;
	gap: 6px;
	align-items: center;
	border: 0;
	background: transparent;
	color: var(--color-text);
	font-family: var(--font);
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
}

.nptt-engagement a:hover,
.nptt-engagement button:hover {
	color: var(--color-accent-700);
	text-decoration: none;
}

/* Lightbox ----------------------------------------------------------------- */

.nptt-lightbox {
	position: fixed;
	inset: 0;
	z-index: 300;
	display: none;
	align-items: center;
	justify-content: center;
	padding: var(--space-6);
	background: rgba(32, 30, 29, .92);
}

.nptt-lightbox[open],
.nptt-lightbox.is-open {
	display: flex;
}

.nptt-lightbox img {
	max-width: min(1100px, 100%);
	max-height: 82vh;
	object-fit: contain;
}

.nptt-lightbox button {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 2px solid var(--color-bg);
	background: transparent;
	color: var(--color-bg);
	cursor: pointer;
	transition: var(--fade);
}

.nptt-lightbox button:hover {
	background: var(--color-accent);
	border-color: var(--color-accent);
}

.nptt-lightbox__close {
	top: var(--space-4);
	right: var(--space-4);
}

.nptt-lightbox__prev {
	top: 50%;
	left: var(--space-4);
	transform: translateY(-50%);
}

.nptt-lightbox__next {
	top: 50%;
	right: var(--space-4);
	transform: translateY(-50%);
}

.nptt-lightbox__count {
	position: absolute;
	bottom: var(--space-4);
	left: 50%;
	transform: translateX(-50%);
	color: var(--color-bg);
	font-size: 13px;
	font-weight: 800;
}

/* --------------------------------------------------------------------------
   Editorial pages — about, contact, 404, site search
   -------------------------------------------------------------------------- */

.nptt-content-page,
.nptt-standard-page,
.nptt-site-search,
.nptt-not-found {
	width: min(100% - 32px, var(--shell));
	margin-inline: auto;
	padding-bottom: var(--space-8);
}

.nptt-standard-page__inner {
	margin-top: var(--space-6);
	padding: var(--space-6);
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-standard-page__inner h1,
.nptt-standard-page__inner .entry-title {
	margin-bottom: var(--space-3);
	font-size: 30px;
}

.nptt-standard-page__inner .entry-content {
	max-width: 68ch;
	color: var(--color-neutral-800);
}

.nptt-standard-page__inner .entry-content p {
	margin-bottom: var(--space-3);
}

.nptt-page-hero {
	margin-top: var(--space-6);
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-page-hero__inner {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
}

.nptt-page-hero__inner > div:first-child {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	align-items: flex-start;
	padding: 32px;
	border-right: var(--rule);
}

.nptt-page-hero h1 {
	max-width: 24ch;
	font-size: 36px;
	line-height: 1.08;
}

.nptt-page-hero p {
	max-width: 52ch;
	color: var(--color-neutral-800);
}

.nptt-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	margin-top: var(--space-2);
}

.nptt-page-hero__panel {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	padding: 32px;
	background: var(--color-surface);
}

.nptt-page-hero__panel > strong {
	font-size: 15px;
	font-weight: 800;
}

.nptt-page-hero__panel li,
.nptt-page-hero__panel > div {
	padding: var(--space-2) 0;
	border-bottom: var(--hairline);
	font-size: 13px;
}

.nptt-page-hero__panel > div span {
	display: block;
	color: var(--color-neutral-700);
	font-size: 11px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-eyebrow {
	color: var(--color-accent-700);
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.nptt-page-section {
	margin-top: var(--space-8);
}

.nptt-page-heading {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	margin-bottom: var(--space-4);
}

.nptt-page-heading h2,
.nptt-two-column h2 {
	font-size: 26px;
}

.nptt-page-heading p {
	max-width: 62ch;
	color: var(--color-neutral-800);
}

.nptt-values-grid,
.nptt-steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-steps {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.nptt-value-card,
.nptt-steps > li {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	padding: var(--space-4);
	border-right: var(--rule);
}

.nptt-values-grid > *:last-child,
.nptt-steps > li:last-child {
	border-right: 0;
}

.nptt-value-card h3,
.nptt-steps h3 {
	font-size: 15px;
}

.nptt-value-card p,
.nptt-steps p {
	color: var(--color-neutral-800);
	font-size: 13px;
}

.nptt-value-card__icon,
.nptt-steps > li > span {
	color: var(--color-accent-700);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .08em;
}

.nptt-two-column {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: var(--space-6);
}

.nptt-trust-note,
.nptt-contact-note,
.nptt-contact-help {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	padding: var(--space-4);
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-text-link {
	font-size: 13px;
	font-weight: 800;
}

.nptt-check-list li {
	padding: 6px 0;
	border-bottom: var(--hairline);
	font-size: 13px;
}

.nptt-contact-layout {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: var(--space-6);
	align-items: start;
}

.nptt-contact-form-card {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	padding: var(--space-6);
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-contact-aside {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
}

.nptt-contact-form {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	align-items: flex-start;
	margin-top: var(--space-2);
}

.nptt-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-3);
	width: 100%;
}

.nptt-page-hero__panel li:last-child,
.nptt-page-hero__panel > div:last-child,
.nptt-check-list li:last-child {
	border-bottom: 0;
}

.nptt-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.nptt-field--full {
	grid-column: 1 / -1;
}

.nptt-field label {
	color: var(--color-neutral-700);
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-main-site .nptt-field input,
.nptt-main-site .nptt-field select,
.nptt-main-site .nptt-field textarea {
	width: 100%;
	padding: 9px 10px;
	border: var(--rule);
	border-radius: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font);
	font-size: 14px;
}

.nptt-field small {
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-consent {
	display: flex;
	gap: var(--space-2);
	align-items: flex-start;
	font-size: 13px;
}

.nptt-honeypot {
	position: absolute !important;
	left: -9999px;
}

.nptt-form-message {
	display: flex;
	gap: var(--space-3);
	padding: var(--space-3) var(--space-4);
	border: var(--rule);
	font-size: 13px;
}

.nptt-form-message strong {
	display: block;
	font-weight: 800;
}

.nptt-form-message--success {
	border-color: var(--color-text);
	background: var(--color-surface);
}

.nptt-form-message--error {
	border-color: var(--color-accent);
	background: #fff2ef;
	color: var(--color-accent-700);
}

.nptt-faq-list details {
	border-bottom: var(--hairline);
}

.nptt-faq-list summary {
	padding: var(--space-3) 0;
	font-size: 15px;
	font-weight: 800;
	cursor: pointer;
	list-style: none;
}

.nptt-faq-list summary::-webkit-details-marker {
	display: none;
}

.nptt-faq-list p {
	padding-bottom: var(--space-3);
	max-width: 62ch;
	color: var(--color-neutral-800);
	font-size: 14px;
}

.nptt-not-found__inner {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	align-items: flex-start;
	margin-top: var(--space-8);
	padding: 48px 32px;
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-not-found__code {
	color: var(--color-accent);
	font-size: 64px;
	font-weight: 800;
	line-height: 1;
}

.nptt-not-found h1 {
	max-width: 26ch;
	font-size: 32px;
}

.nptt-not-found > div > div {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	margin-top: var(--space-2);
}

/* --------------------------------------------------------------------------
   Footer + mobile action bar
   -------------------------------------------------------------------------- */

.nptt-footer {
	margin-top: var(--space-8);
	border-top: var(--rule);
	background: var(--color-surface);
}

.nptt-footer__grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
}

.nptt-footer__grid > * {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 24px 20px;
	border-right: var(--rule);
}

.nptt-footer__grid > *:last-child {
	border-right: 0;
}

.nptt-footer__brand strong {
	font-size: 15px;
	font-weight: 800;
}

.nptt-footer__brand p {
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-footer h2 {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-footer a {
	color: var(--color-text);
	font-size: 12px;
}

.nptt-footer a:hover {
	color: var(--color-accent-700);
}

.nptt-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	justify-content: space-between;
	padding: var(--space-3) 20px;
	border-top: var(--rule);
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-actionbar {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 90;
	display: none;
	border-top: var(--rule);
}

.nptt-actionbar > * {
	display: flex;
	flex: 1;
	gap: 6px;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: var(--space-2);
	border: 0;
	border-right: 1px solid var(--color-neutral-700);
	color: var(--color-bg) !important;
	font-family: var(--font);
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
}

.nptt-actionbar > *:last-child {
	border-right: 0;
}

.nptt-actionbar__call {
	background: var(--color-accent);
}

.nptt-actionbar__zalo {
	background: var(--color-accent-700);
}

.nptt-actionbar__filter {
	background: var(--color-text);
}

.nptt-actionbar > *:hover {
	text-decoration: none;
}

#backtop {
	position: fixed;
	right: var(--space-4);
	bottom: var(--space-4);
	z-index: 80;
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	/* Padding rather than flex centring: the legacy scroll handler sets an
	   inline `display:block` on this button, which would drop the alignment. */
	padding: 9px;
	border: var(--rule);
	border-radius: 0 !important;
	background: var(--color-neutral-100);
	color: var(--color-text);
	cursor: pointer;
	transition: var(--fade);
}

#backtop.is-visible {
	display: block;
}

#backtop:hover {
	background: var(--color-accent);
	border-color: var(--color-accent);
	color: var(--color-bg);
}

/* --------------------------------------------------------------------------
   Apartment projects — screens 05 and 06
   -------------------------------------------------------------------------- */

.nptt-page-head--split {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-4);
	align-items: flex-end;
	justify-content: space-between;
	border-bottom: var(--rule);
}

.nptt-page-head--split .nptt-page-head__context {
	max-width: 66ch;
}

/* Two real URLs, not tabs — styled as one control so it reads as a switch. */
.nptt-viewswitch {
	display: flex;
	flex: none;
	border: var(--rule);
}

.nptt-main-site .nptt-viewswitch > * {
	padding: 8px 14px;
	color: var(--color-text);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	transition: var(--fade);
}

.nptt-viewswitch > * + * {
	border-left: var(--rule);
}

.nptt-main-site .nptt-viewswitch .is-active {
	background: var(--color-text);
	color: var(--color-bg);
}

.nptt-main-site .nptt-viewswitch a:hover {
	background: rgba(32, 30, 29, .07);
	text-decoration: none;
}

.nptt-projectfilter {
	display: grid;
	grid-template-columns: repeat(4, 1fr) auto;
	border-bottom: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-projectfilter__cell {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 10px 14px;
	border-right: var(--rule);
}

.nptt-projectfilter__cell select {
	width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--color-text);
	font-family: var(--font);
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
	appearance: none;
}

.nptt-main-site .nptt-projectfilter button {
	padding-inline: 20px;
	border: 0;
	font-size: 13px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-projectgrid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	padding: 20px 24px;
}

/* Project card ------------------------------------------------------------- */

.nptt-project {
	display: flex;
	flex-direction: column;
	border: var(--rule);
	background: var(--color-neutral-100);
	transition: var(--fade);
}

.nptt-project:hover {
	background: var(--color-surface);
}

.nptt-project__media {
	position: relative;
	display: block;
	aspect-ratio: var(--ratio-wide);
	overflow: hidden;
	background: var(--color-surface);
}

.nptt-project__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* The two status labels butt against each other — no gap, by design. */
.nptt-project__badges {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
}

.nptt-project__badges--inline {
	position: static;
	margin-bottom: var(--space-2);
}

.nptt-project__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--space-2);
	padding: 14px;
}

.nptt-project__title {
	font-size: 19px;
	font-weight: 800;
	line-height: 1.2;
}

.nptt-main-site .nptt-project__title a {
	color: var(--color-text);
}

.nptt-main-site .nptt-project__title a:hover {
	color: var(--color-accent-700);
	text-decoration: none;
}

.nptt-project__where {
	margin-top: 2px;
	color: var(--color-neutral-700);
	font-size: 13px;
}

.nptt-project__price {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: baseline;
}

.nptt-project__price > span {
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-project__price strong {
	color: var(--color-accent-700);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
}

.nptt-project__price em {
	color: var(--color-neutral-700);
	font-size: 12px;
	font-style: normal;
}

.nptt-project__specs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	margin-top: auto;
	border-top: var(--hairline);
	border-bottom: var(--hairline);
}

.nptt-project__specs > div {
	padding: var(--space-2) var(--space-2) var(--space-2) 0;
	border-right: var(--hairline);
}

.nptt-project__specs > div + div {
	padding-left: var(--space-2);
}

.nptt-project__specs > div:last-child {
	border-right: 0;
}

.nptt-project__specs strong {
	display: block;
	font-size: 14px;
	font-weight: 800;
	line-height: 1.3;
}

.nptt-project__foot {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: center;
	justify-content: space-between;
	font-size: 13px;
}

/* Price map ---------------------------------------------------------------- */

.nptt-unittypes__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
}

.nptt-main-site .nptt-unittypes__cell {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 12px 14px;
	border-right: var(--rule);
	color: var(--color-text);
	transition: var(--fade);
}

.nptt-unittypes__cell:last-child {
	border-right: 0;
}

.nptt-main-site .nptt-unittypes__cell:hover {
	background: var(--color-surface);
	text-decoration: none;
}

.nptt-main-site .nptt-unittypes__cell.is-active {
	background: var(--color-surface);
	box-shadow: inset 3px 0 0 var(--color-accent);
}

.nptt-unittypes__cell strong {
	font-size: 15px;
	font-weight: 800;
}

.nptt-unittypes__cell span {
	color: var(--color-neutral-700);
	font-size: 13px;
}

.nptt-unittypes__cell b {
	color: var(--color-accent-700);
	font-size: 16px;
	font-weight: 800;
}

.nptt-unittypes__cell em {
	color: var(--color-neutral-700);
	font-size: 12px;
	font-style: normal;
}

.nptt-chips--static .nptt-chip {
	cursor: default;
}

.nptt-map__frame--short {
	height: 190px;
}

.nptt-contact__invest {
	padding: var(--space-3) var(--space-4);
	border-bottom: var(--rule);
	font-size: 13px;
}

.nptt-contact__invest p {
	display: flex;
	gap: var(--space-2);
	justify-content: space-between;
}

.nptt-contact__invest span {
	color: var(--color-neutral-700);
}

/* Unit table --------------------------------------------------------------- */

.nptt-units {
	border-top: var(--rule);
}

.nptt-units__head {
	padding: 20px 24px 8px;
}

.nptt-units__head h2 {
	font-size: 22px;
}

.nptt-units__table {
	margin: 14px 24px 24px;
	border: var(--rule);
}

.nptt-units__filters {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	align-items: center;
	justify-content: space-between;
	padding: 10px 14px;
	border-bottom: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-units__selects {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.nptt-units__select select {
	padding: 5px 8px;
	border: var(--hairline);
	border-radius: 0;
	background: transparent;
	color: var(--color-text);
	font-family: var(--font);
	font-size: 12px;
	cursor: pointer;
}

.nptt-unit {
	display: grid;
	grid-template-columns: 82px 1.6fr .8fr .7fr .8fr .9fr 168px;
	gap: 12px;
	align-items: center;
	padding: 12px 14px;
	border-bottom: var(--hairline);
	transition: var(--fade);
}

.nptt-unit:last-of-type {
	border-bottom: 0;
}

.nptt-unit:not(.nptt-unit--header):hover {
	background: var(--color-neutral-100);
}

.nptt-unit--header {
	border-bottom: var(--rule);
	background: var(--color-bg);
	color: var(--color-neutral-700);
	font-size: 10px;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.nptt-unit__media {
	display: block;
	aspect-ratio: var(--ratio-card);
	overflow: hidden;
	background: var(--color-surface);
}

.nptt-unit__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nptt-unit__id {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	font-size: 15px;
}

.nptt-main-site .nptt-unit__id a {
	color: var(--color-text);
	font-weight: 800;
}

.nptt-main-site .nptt-unit__id a:hover {
	color: var(--color-accent-700);
	text-decoration: none;
}

.nptt-unit__id span {
	color: var(--color-neutral-700);
	font-size: 12px;
	font-weight: 400;
}

.nptt-unit__cell {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	font-size: 14px;
}

.nptt-unit__cell strong {
	font-weight: 800;
}

.nptt-unit__cell span:not(.nptt-unit__key) {
	color: var(--color-neutral-700);
	font-size: 12px;
}

/* The column names live in the header row on desktop. */
.nptt-unit__key {
	display: none;
}

.nptt-unit__price strong {
	color: var(--color-accent-700);
	font-size: 19px;
	line-height: 1.1;
}

.nptt-unit__actions {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.nptt-units__empty,
.nptt-units__none {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	align-items: flex-start;
	padding: 24px;
}

.nptt-units__none {
	margin: 14px 24px 24px;
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-units__none strong {
	font-size: 16px;
	font-weight: 800;
}

.nptt-units__none span {
	color: var(--color-neutral-700);
	font-size: 13px;
}

/* Lead dialog -------------------------------------------------------------- */

.nptt-modal {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--space-4);
	background: rgba(32, 30, 29, .6);
}

.nptt-modal[hidden] {
	display: none;
}

.nptt-modal__panel {
	width: min(420px, 100%);
	max-height: 90dvh;
	overflow-y: auto;
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-modal__head {
	display: flex;
	gap: var(--space-3);
	align-items: center;
	justify-content: space-between;
	padding: var(--space-3) var(--space-4);
	border-bottom: var(--rule);
}

.nptt-modal__head h2 {
	font-size: 17px;
}

.nptt-modal__close {
	width: 32px;
	height: 32px;
	border: var(--rule);
	background: transparent;
	color: var(--color-text);
	font-family: var(--font);
	cursor: pointer;
}

.nptt-modal__close:hover {
	background: var(--color-accent);
	border-color: var(--color-accent);
	color: var(--color-bg);
}

.nptt-modal__form {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	padding: var(--space-4);
}

.nptt-main-site .nptt-modal__form input,
.nptt-main-site .nptt-modal__form select {
	width: 100%;
	padding: 9px 10px;
	border: var(--rule);
	border-radius: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font);
	font-size: 14px;
}

/* --------------------------------------------------------------------------
   Share menu, saved listings, comments
   -------------------------------------------------------------------------- */

.nptt-share {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	padding: var(--space-3);
	border: var(--rule);
	border-top: 0;
	background: var(--color-neutral-100);
	font-size: 13px;
	font-weight: 800;
}

.nptt-share[hidden] {
	display: none;
}

.nptt-main-site .nptt-like.is-liked,
.nptt-main-site .nptt-like[aria-pressed="true"] {
	color: var(--color-accent-700);
}

.nptt-main-site .nptt-like[aria-pressed="true"] .nptt-i {
	fill: currentColor;
}

.nptt-post-figure {
	margin: var(--space-4) 0;
	border: var(--rule);
}

.nptt-post-figure img {
	width: 100%;
	aspect-ratio: var(--ratio-wide);
	object-fit: cover;
}

.nptt-comments {
	margin-top: var(--space-6);
	padding: var(--space-6);
	border: var(--rule);
	background: var(--color-neutral-100);
}

.nptt-comments__title {
	margin-bottom: var(--space-4);
	font-size: 18px;
}

.nptt-comments__list,
.nptt-comments__list .children {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nptt-comments__list .children {
	margin-left: var(--space-6);
	border-left: var(--hairline);
	padding-left: var(--space-4);
}

.nptt-comments__list .comment-body {
	padding: var(--space-3) 0;
	border-bottom: var(--hairline);
}

.nptt-comments__list .comment-author {
	display: flex;
	gap: var(--space-2);
	align-items: center;
	font-size: 14px;
	font-weight: 800;
}

.nptt-comments__list .comment-author img {
	border-radius: 0 !important;
}

.nptt-comments__list .comment-meta,
.nptt-comments__list .comment-metadata {
	color: var(--color-neutral-700);
	font-size: 12px;
}

.nptt-comments__list .comment-content {
	margin-top: var(--space-2);
	color: var(--color-neutral-800);
	font-size: 14px;
}

.nptt-comments__list .comment-content p {
	margin-bottom: var(--space-2);
}

.nptt-comment-form,
.nptt-main-site .comment-form {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	margin-top: var(--space-4);
}

.nptt-main-site .comment-form input:not([type="submit"]):not([type="checkbox"]),
.nptt-main-site .comment-form textarea {
	width: 100%;
	padding: 9px 10px;
	border: var(--rule);
	border-radius: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font);
	font-size: 14px;
}

.nptt-main-site .comment-form label {
	display: block;
	margin-bottom: 4px;
	color: var(--color-neutral-700);
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.nptt-main-site .comment-form .form-submit {
	margin: 0;
}
/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

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

	.nptt-projectfilter {
		grid-template-columns: repeat(3, 1fr);
	}

	.nptt-projectfilter__cell:nth-child(3n) {
		border-right: 0;
	}

	.nptt-main-site .nptt-projectfilter button {
		grid-column: 1 / -1;
		border-top: var(--rule);
		justify-content: center;
	}

	/* The thumbnail is decoration — the first thing to go when space is tight. */
	.nptt-unit {
		grid-template-columns: 1.6fr .8fr .7fr .8fr .9fr 150px;
	}

	.nptt-unit__media {
		display: none;
	}

	.nptt-unit--header span:first-child {
		display: none;
	}

	.nptt-unittypes__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.nptt-unittypes__cell:nth-child(2n) {
		border-right: 0;
	}

	.nptt-unittypes__cell:nth-child(-n+2) {
		border-bottom: var(--rule);
	}

	.nptt-listing-layout {
		grid-template-columns: 260px 1fr;
	}

	.nptt-detail__grid {
		grid-template-columns: 1fr 300px;
	}

	.nptt-typegrid {
		grid-template-columns: repeat(3, 1fr);
	}

	.nptt-typegrid a:nth-child(3n) {
		border-right: 0;
	}

	.nptt-typegrid a:nth-child(-n+3) {
		border-bottom: var(--rule);
	}

	.nptt-related__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.nptt-values-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.nptt-values-grid > *:nth-child(2n) {
		border-right: 0;
	}

	.nptt-values-grid > *:nth-child(-n+2) {
		border-bottom: var(--rule);
	}
}

@media (max-width: 899px) {
	.nptt-nav,
	.nptt-header__search {
		display: none;
	}

	.nptt-menu-toggle {
		display: flex;
	}

	.nptt-header__inner {
		justify-content: space-between;
	}

	.nptt-brand {
		flex: 1;
		min-width: 0;
	}

	.nptt-hero,
	.nptt-page-hero__inner {
		grid-template-columns: 1fr;
	}

	.nptt-hero__copy,
	.nptt-page-hero__inner > div:first-child {
		border-right: 0;
		border-bottom: var(--rule);
	}

	.nptt-stats {
		grid-template-columns: repeat(2, 1fr);
	}

	.nptt-stats > div:nth-child(2n) {
		border-right: 0;
	}

	.nptt-stats > div:nth-child(-n+2) {
		border-bottom: var(--rule);
	}

	/* Filter becomes a full-screen drawer. */
	.nptt-listing-layout {
		grid-template-columns: 1fr;
	}

	.nptt-filter {
		position: fixed;
		inset: 0;
		/* dvh, not inset alone: on a phone the URL bar shrinks the viewport, and
		   the "Áp dụng bộ lọc" button has to stay reachable. */
		height: 100dvh;
		max-height: 100dvh;
		z-index: 120;
		overflow-y: auto;
		overscroll-behavior: contain;
		border-right: 0;
		display: none;
	}

	.nptt-filter.is-open {
		display: block;
	}

	.nptt-filter__close {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		padding: 0;
		border: var(--rule);
		background: transparent;
		color: var(--color-text);
		cursor: pointer;
	}

	.nptt-filter__head {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.nptt-filter__submit {
		position: sticky;
		bottom: 0;
		background: var(--color-neutral-100);
		padding-top: var(--space-4);
		border-top: var(--rule);
	}

	.nptt-main-site .nptt-mobile-filter-open {
		display: inline-flex;
	}

	.nptt-detail__grid {
		grid-template-columns: 1fr;
	}

	.nptt-contact-col {
		position: static;
	}

	.nptt-projectgrid {
		grid-template-columns: 1fr;
	}

	/* Four columns only: code, type, area, price. The call buttons drop to
	   their own line so they keep a full-width tap target. */
	.nptt-unit {
		grid-template-columns: 1.6fr .7fr .8fr .9fr;
	}

	.nptt-unit__cell:nth-of-type(3) {
		display: none;
	}

	.nptt-unit__actions {
		grid-column: 1 / -1;
		flex-direction: row;
	}

	.nptt-main-site .nptt-unit__actions .nptt-btn {
		flex: 1;
		justify-content: center;
	}

	.nptt-unit--header {
		display: none;
	}

	.nptt-unit__key {
		display: block;
	}

	.nptt-two-column,
	.nptt-contact-layout {
		grid-template-columns: 1fr;
	}

	.nptt-steps {
		grid-template-columns: 1fr;
	}

	.nptt-steps > li {
		border-right: 0;
		border-bottom: var(--rule);
	}

	.nptt-steps > li:last-child {
		border-bottom: 0;
	}

	.nptt-footer__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.nptt-footer__grid > * {
		border-bottom: var(--rule);
	}

	.nptt-footer__grid > *:nth-child(2n) {
		border-right: 0;
	}
}

@media (max-width: 639px) {
	body.nptt-main-site {
		padding-bottom: 52px;
	}

	/* Nothing drops below 12px on a phone — the 10px uppercase labels are a
	   desktop-only density. */
	.nptt-main-site .nptt-label,
	.nptt-main-site .nptt-badge,
	.nptt-main-site .nptt-brand small,
	.nptt-main-site .nptt-card__foot time,
	.nptt-main-site .nptt-card__price span,
	.nptt-main-site .nptt-utility__inner,
	.nptt-main-site .nptt-footer a,
	.nptt-main-site .nptt-footer h2,
	.nptt-main-site .nptt-footer__brand p,
	.nptt-main-site .nptt-footer__bottom,
	.nptt-main-site .nptt-pagination__count,
	.nptt-main-site .nptt-contact__note,
	.nptt-main-site .nptt-detail__ref {
		font-size: 12px;
	}

	/* Every button is a one-thumb target on a phone. */
	.nptt-main-site .nptt-btn,
	.nptt-main-site .nptt-button {
		min-height: 44px;
	}

	.nptt-shell {
		width: min(100% - 24px, var(--shell));
	}

	.nptt-utility__inner {
		justify-content: center;
		padding: 6px 16px;
	}

	.nptt-utility__group--secondary {
		display: none;
	}

	.nptt-header__inner {
		min-height: 56px;
	}

	.nptt-brand {
		padding: 10px 16px;
	}

	.nptt-brand strong {
		font-size: 14px;
	}

	.nptt-header__cta {
		display: none;
	}

	.nptt-mobile-search {
		display: flex;
	}

	.nptt-hero {
		margin-top: var(--space-4);
	}

	.nptt-hero__copy {
		gap: var(--space-3);
		padding: 20px 16px;
	}

	.nptt-hero h1 {
		font-size: 24px;
	}

	.nptt-hero .nptt-kicker {
		font-size: 11px;
	}

	/* Two cells only — area and price. Everything else lives in the drawer. */
	.nptt-quickfilter {
		grid-template-columns: 1fr 1fr;
	}

	.nptt-quickfilter__cell:nth-child(2) {
		display: none;
	}

	.nptt-quickfilter__cell:nth-child(3) {
		border-right: 0;
	}

	.nptt-quickfilter button {
		grid-column: 1 / -1;
		min-height: 46px;
		border-top: var(--rule);
	}

	.nptt-hero__media {
		aspect-ratio: var(--ratio-wide);
		min-height: 0;
	}

	.nptt-grid,
	.nptt-related__grid,
	.nptt-values-grid {
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.nptt-typegrid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0;
	}

	.nptt-typegrid a {
		min-width: 0;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		border-right: var(--rule);
		border-bottom: var(--rule);
	}

	.nptt-typegrid a:nth-child(2n) {
		border-right: 0;
	}

	.nptt-typegrid a:nth-child(odd) {
		border-right: var(--rule);
	}

	.nptt-typegrid a:nth-last-child(-n+2) {
		border-bottom: 0;
	}

	.nptt-typegrid img {
		width: 100%;
		height: 92px;
		aspect-ratio: auto;
		flex: 0 0 92px;
		border-right: 0;
		border-bottom: var(--rule);
	}

	.nptt-typegrid__body {
		min-height: 68px;
		padding: 10px 12px;
	}

	.nptt-values-grid > * {
		border-right: 0;
		border-bottom: var(--rule);
	}

	.nptt-values-grid > *:last-child {
		border-bottom: 0;
	}

	.nptt-card__specs {
		display: flex;
		flex-wrap: wrap;
		gap: var(--space-3);
		border-bottom: 0;
		padding-top: var(--space-2);
	}

	.nptt-card__specs > div {
		display: flex;
		gap: 5px;
		align-items: baseline;
		padding: 0 !important;
		border-right: 0;
		font-size: 12px;
	}

	.nptt-card__specs strong {
		font-size: 12px;
	}

	.nptt-card__actions {
		width: 100%;
	}

	.nptt-card__actions > * {
		flex: 1;
		justify-content: center;
		min-height: 44px;
		font-size: 13px;
	}

	.nptt-row {
		flex-direction: column;
	}

	.nptt-row__media {
		flex: none;
		border-right: 0;
		border-bottom: var(--rule);
	}

	.nptt-row__aside {
		border-left: 0;
		border-top: var(--rule);
	}

	.nptt-row__aside .nptt-btn {
		min-height: 44px;
		justify-content: center;
	}

	.nptt-page-head,
	.nptt-detail__head,
	.nptt-detail__grid,
	.nptt-related,
	.nptt-engagement,
	.nptt-gallery {
		padding-inline: 16px;
	}

	.nptt-detail__head h1 {
		font-size: 24px;
	}

	.nptt-detail__ref {
		text-align: left;
	}

	.nptt-gallery {
		grid-template-columns: 1fr;
	}

	.nptt-notice {
		min-height: 180px;
	}

	.nptt-gallery__side {
		grid-template-rows: none;
		grid-template-columns: 1fr 1fr;
	}

	.nptt-gallery__side > a {
		aspect-ratio: var(--ratio-wide);
	}

	.nptt-gallery--1 .nptt-gallery__main,
	.nptt-gallery--2 {
		grid-template-columns: 1fr;
	}

	/* Its single companion spans the width rather than sitting in a half-row. */
	.nptt-gallery--2 .nptt-gallery__side {
		grid-template-columns: 1fr;
	}

	.nptt-gallery--1 .nptt-gallery__main {
		aspect-ratio: var(--ratio-wide);
	}

	.nptt-gallery--2 .nptt-gallery__main,
	.nptt-gallery--2 .nptt-gallery__side > a {
		aspect-ratio: var(--ratio-wide);
	}

	.nptt-specs__cols {
		grid-template-columns: 1fr;
	}

	.nptt-specs__cols > div:first-child {
		border-right: 0;
		border-bottom: var(--rule);
	}

	.nptt-cta {
		padding: 24px 16px;
	}

	.nptt-cta h2 {
		font-size: 24px;
	}

	.nptt-block__head h2 {
		font-size: 18px;
	}

	.nptt-actionbar {
		display: flex;
	}

	#backtop {
		bottom: 60px;
	}

	.nptt-footer__grid {
		grid-template-columns: 1fr;
	}

	.nptt-footer__grid > * {
		border-right: 0;
	}

	.nptt-form-grid {
		grid-template-columns: 1fr;
	}

	.nptt-lightbox {
		padding: var(--space-3);
	}

	/* Each unit becomes a one-column card. */
	.nptt-unit {
		grid-template-columns: 1fr;
		gap: 6px;
		border-bottom: var(--rule);
	}

	.nptt-unit__cell {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 6px;
		align-items: baseline;
		font-size: 13px;
	}

	.nptt-unit__cell:nth-of-type(3) {
		display: flex;
	}

	.nptt-main-site .nptt-unit__key {
		display: block;
		font-size: 12px;
	}

	.nptt-unit__price strong {
		font-size: 20px;
	}

	.nptt-unit__actions {
		flex-direction: row;
		margin-top: var(--space-2);
	}

	.nptt-main-site .nptt-unit__actions .nptt-btn {
		min-height: 44px;
	}

	.nptt-units__table,
	.nptt-units__none {
		margin-inline: 16px;
	}

	.nptt-units__head,
	.nptt-projectgrid {
		padding-inline: 16px;
	}

	.nptt-units__filters {
		align-items: stretch;
		flex-direction: column;
	}

	.nptt-projectfilter {
		grid-template-columns: 1fr 1fr;
	}

	.nptt-projectfilter__cell:nth-child(2n) {
		border-right: 0;
	}

	.nptt-unittypes__grid {
		grid-template-columns: 1fr;
	}

	.nptt-unittypes__cell {
		border-right: 0;
		border-bottom: var(--rule);
	}

	.nptt-unittypes__cell:last-child {
		border-bottom: 0;
	}

	.nptt-project__specs {
		grid-template-columns: repeat(2, 1fr);
	}

	.nptt-project__specs > div:nth-child(2n) {
		border-right: 0;
	}

	.nptt-page-head--split {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nptt-main-site *,
	.nptt-main-site *::before,
	.nptt-main-site *::after {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
	}
}