/* Northgate Homes real estate demo: styles for Divi 5 sections built by build-pages.php.
   Brand: --brand-primary (blue #1D4ED8) / --brand-secondary (slate #374151).
   Visual language: crisp property-magazine. White, pale-slate and warm sand sections, a faint blueprint grid,
   illustrated houses drawn in SVG under coloured skies, a blueprint-style floor plan, rounded listing cards,
   and large Instrument Serif headlines with italic blue emphasis over Figtree body copy. */

:root {
	--ngh-blue: var(--brand-primary);
	--ngh-slate: var(--brand-secondary);
	--ngh-ink: #0f172a;
	--ngh-muted: #475569;
	--ngh-bg: #f8fafc;
	--ngh-tint: #eff6ff;
	--ngh-sand: #f7f3ee;
	--ngh-line: #e2e8f0;
	--ngh-serif: "Instrument Serif", Georgia, serif;
	--ngh-sans: "Figtree", "Open Sans", Arial, sans-serif;
	--ngh-shadow: 0 24px 50px -28px rgba(15, 23, 42, .35);
	--ngh-blueprint: linear-gradient(rgba(29,78,216,.07) 1px, transparent 1px) 0 0 / 32px 32px, linear-gradient(90deg, rgba(29,78,216,.07) 1px, transparent 1px) 0 0 / 32px 32px;
}
/* Header CTA uses the brand blue rather than the slate secondary. */
:root:root { --brand-cta-bg: #1D4ED8; --brand-accent: #1D4ED8; }

.logo_container a::before, .logo_container a::after { font-family: var(--ngh-serif); font-weight: 400; }
.logo_container a::after { font-size: 24px; letter-spacing: 0; }
.logo_container a::before { font-size: 24px; }
#top-menu li.csb-nav-cta > a { border-radius: 999px; }

/* ---------- Divi flex layout fixes (gap via --horizontal-gap-parent, wrap on small screens) ---------- */
.et_pb_section[class*="ngh-"] { padding: clamp(64px, 7vw, 108px) 0; background: #fff; gap: 44px; overflow: hidden; }
.et_pb_section[class*="ngh-"] .et_pb_row { width: min(1200px, calc(100% - 40px)); max-width: none; padding: 0; }
.ngh-row { --ngh-gap: 24px; column-gap: var(--ngh-gap) !important; row-gap: 24px !important; flex-wrap: wrap !important; }
.ngh-row > .et_pb_column { --horizontal-gap-parent: var(--ngh-gap); }
.ngh-split, .ngh-heading-row, .ngh-cta-row { --ngh-gap: clamp(28px, 5vw, 64px); }
.ngh-grid-2, .ngh-grid-3, .ngh-grid-4 { align-items: stretch !important; }
.ngh-checks, .ngh-hero-proof, .ngh-specs, .ngh-legend, .ngh-steps, .ngh-works, .ngh-opens { list-style: none !important; padding: 0 !important; }
[class*="ngh-"] { font-variant-numeric: lining-nums; }

/* ---------- Section backgrounds ---------- */
.et_pb_section:is(.ngh-hero, .ngh-page-hero) { background: var(--ngh-blueprint), linear-gradient(180deg, var(--ngh-tint), #fff) !important; }
.et_pb_section:is(.ngh-listings-sec, .ngh-faq-x) { background: var(--ngh-bg) !important; }
.et_pb_section:is(.ngh-hotw, .ngh-value, .ngh-values, .ngh-services, .ngh-contact) { background: var(--ngh-sand) !important; }
.et_pb_section.ngh-calc-sec { background: var(--ngh-blueprint), var(--ngh-tint) !important; }
.et_pb_section.ngh-numbers { background: var(--ngh-ink) !important; padding: 60px 0; }
.et_pb_section.ngh-cta { background: radial-gradient(circle at 90% 10%, rgba(255,255,255,.14), transparent 35%), linear-gradient(120deg, #1e40af, var(--ngh-blue)) !important; }

/* ---------- Base ---------- */
[class*="ngh-"] .et_pb_text_inner, [class*="ngh-"] .et_pb_code_inner { font-family: var(--ngh-sans); color: var(--ngh-muted); font-size: 16.5px; line-height: 1.7; }
[class*="ngh-"] h1, [class*="ngh-"] h2, [class*="ngh-"] h3 { font-family: var(--ngh-serif); color: var(--ngh-ink); font-weight: 400; line-height: 1; padding-bottom: 0; letter-spacing: -.01em; }
[class*="ngh-"] h1 { font-size: clamp(52px, 6.6vw, 98px); margin-bottom: 20px; }
[class*="ngh-"] h2 { font-size: clamp(40px, 4.4vw, 64px); margin-bottom: 14px; }
[class*="ngh-"] h3 { font-size: 28px; line-height: 1.1; margin-bottom: 8px; }
[class*="ngh-"] :is(h1, h2, h3) em { font-style: italic; color: var(--ngh-blue); }
[class*="ngh-"] p { padding-bottom: 0; margin-bottom: 14px; }
[class*="ngh-"] a { color: var(--ngh-blue); }
.ngh-eyebrow { display: inline-flex !important; align-items: center; gap: 10px; font-family: var(--ngh-sans); color: var(--ngh-blue) !important; font-size: 13px !important; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 14px !important; }
.ngh-eyebrow::before { content: ""; width: 9px; height: 9px; border: 2px solid currentColor; transform: rotate(45deg); }
.ngh-lead { font-size: 19px !important; max-width: 640px; color: var(--ngh-ink) !important; opacity: .8; }
.ngh-heading-row { align-items: flex-end; }
.ngh-heading h2 { margin-bottom: 0 !important; }
.ngh-heading-lead .ngh-lead { margin-bottom: 6px !important; }
.ngh-ico { width: 22px; height: 22px; flex: none; vertical-align: middle; }
.ngh-opt { font-weight: 400; color: #64748b; text-transform: none; letter-spacing: 0; }

/* Buttons */
.ngh-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.ngh-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 15px 26px; border-radius: 12px; border: 0; background: var(--ngh-blue); color: #fff !important; font-family: var(--ngh-sans); font-size: 16px; font-weight: 700; text-decoration: none; line-height: 1.2; cursor: pointer; box-shadow: 0 12px 24px -12px rgba(29,78,216,.8); transition: transform .2s, background .2s; }
.ngh-btn:hover { background: #1e40af; transform: translateY(-2px); }
.ngh-btn .ngh-ico { width: 18px; height: 18px; stroke-width: 2.2; }
.ngh-btn--white { background: #fff; color: var(--ngh-blue) !important; box-shadow: none; }
.ngh-btn--white:hover { background: var(--ngh-tint); }
.ngh-btn--ghost { background: rgba(255,255,255,.12); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.5); }
.ngh-btn--ghost:hover { background: rgba(255,255,255,.22); }
.ngh-btn--block { width: 100%; }

/* ---------- Hero & search ---------- */
.ngh-hero { padding-block: clamp(70px, 8vw, 120px) clamp(60px, 7vw, 96px) !important; }
.ngh-hero-text, .ngh-hero-text .et_pb_text_inner, .ngh-page-hero .et_pb_text_inner { text-align: center !important; }
.ngh-hero-text .ngh-lead, .ngh-page-hero .ngh-lead { margin-inline: auto !important; }
.ngh-hero h1, .ngh-page-hero h1 { max-width: 980px; margin-inline: auto !important; }
.ngh-search { max-width: 1000px; margin: 34px auto 0; }
.ngh-search-tabs { display: flex; gap: 6px; padding-left: 14px; }
.ngh-search-tabs label { position: relative; cursor: pointer; }
.ngh-search-tabs input, .ngh-flow-switch input, .ngh-term input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ngh-search-tabs span { display: inline-flex; align-items: center; gap: 8px; padding: 12px 22px; border-radius: 14px 14px 0 0; background: rgba(255,255,255,.6); color: var(--ngh-muted); font-weight: 700; font-size: 15px; transition: all .2s; }
.ngh-search-tabs .ngh-ico { width: 18px; height: 18px; }
.ngh-search-tabs input:checked + span { background: #fff; color: var(--ngh-blue); box-shadow: 0 -6px 16px -10px rgba(15,23,42,.3); }
.ngh-search-tabs input:focus-visible + span { outline: 2px solid var(--ngh-blue); }
.ngh-search-buy, .ngh-search-sell { display: grid; align-items: end; gap: 0; padding: 12px; background: #fff; border-radius: 0 18px 18px 18px; box-shadow: var(--ngh-shadow); }
.ngh-search-buy { grid-template-columns: 1.4fr 1fr .8fr 1fr auto; }
.ngh-search-sell { grid-template-columns: 1fr auto; display: none; }
.ngh-search:has(input[value="sell"]:checked) .ngh-search-buy { display: none; }
.ngh-search:has(input[value="sell"]:checked) .ngh-search-sell { display: grid; }
.ngh-search label:not(.ngh-search-tabs label) { display: grid; gap: 3px; padding: 6px 16px; border-right: 1px solid var(--ngh-line); text-align: left; font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #64748b; }
.ngh-search form label:last-of-type { border-right: 0; }
.ngh-search :is(select, input[type=text]) { width: 100%; padding: 4px 0; border: 0; background: transparent; font: 600 16px/1.4 var(--ngh-sans); letter-spacing: 0; text-transform: none; color: var(--ngh-ink); }
.ngh-search :is(select, input):focus { outline: none; }
.ngh-search form label:focus-within { background: var(--ngh-bg); border-radius: 10px; }
.ngh-search .ngh-btn { padding: 17px 26px; }
.ngh-hero-proof { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px 34px; margin: 30px 0 0 !important; font-size: 15px; color: var(--ngh-muted); }
.ngh-hero-proof li { display: flex; align-items: center; gap: 6px; }
.ngh-hero-proof strong { color: var(--ngh-ink); font-weight: 700; }
.ngh-hero-proof .ngh-ico { width: 16px; height: 16px; color: #f59e0b; }

/* ---------- Market snapshot ---------- */
.ngh-snap { height: 100%; padding: 26px 24px 22px; border: 1px solid var(--ngh-line); border-radius: 18px; background: #fff; }
.ngh-snap-num { font-family: var(--ngh-serif); font-size: 58px; line-height: 1; color: var(--ngh-ink) !important; margin-bottom: 4px !important; }
.ngh-snap-label { font-size: 14px; font-weight: 600; color: var(--ngh-muted) !important; margin-bottom: 12px !important; }
.ngh-spark { display: block; width: 100%; height: 38px; margin-bottom: 12px; }
.ngh-spark polyline { fill: none; stroke: var(--ngh-blue); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.ngh-snap-trend { display: inline-block !important; margin: 0 !important; padding: 4px 10px !important; border-radius: 999px; font-size: 12.5px; font-weight: 700; }
.ngh-snap-trend--up { background: #dcfce7; color: #166534 !important; }
.ngh-snap-trend--flat { background: #f1f5f9; color: #334155 !important; }

/* ---------- Listings ---------- */
.ngh-listings-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 18px; }
.ngh-count { margin: 0 !important; font-weight: 600; color: var(--ngh-ink) !important; }
.ngh-reset { padding: 8px 14px; border: 1px solid var(--ngh-line); border-radius: 999px; background: #fff; font: 600 14px var(--ngh-sans); color: var(--ngh-blue); cursor: pointer; }
.ngh-reset[hidden], .ngh-empty[hidden], .ngh-listing[hidden] { display: none !important; }
.ngh-listing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ngh-listing { overflow: hidden; background: #fff; border-radius: 20px; border: 1px solid var(--ngh-line); transition: transform .25s, box-shadow .25s; }
.ngh-listing:hover { transform: translateY(-5px); box-shadow: var(--ngh-shadow); }
.ngh-listing-art { position: relative; aspect-ratio: 16 / 9.5; overflow: hidden; }
.ngh-house { position: absolute; inset: 8% 0 0; width: 100%; height: 92%; transition: transform .5s; }
.ngh-listing:hover .ngh-house { transform: scale(1.04); }
.ngh-sky--day { background: linear-gradient(180deg, #bfdbfe, #eff6ff 75%, #dcfce7 75%); }
.ngh-sky--morning { background: linear-gradient(180deg, #fde68a, #fef9e7 75%, #dcfce7 75%); }
.ngh-sky--dusk { background: linear-gradient(180deg, #c7d2fe, #fbcfe8 75%, #d9f99d 75%); }
.ngh-sun { fill: #fde047; }
.ngh-sky--dusk .ngh-sun { fill: #fb923c; }
.ngh-sky--morning .ngh-sun { fill: #fff; }
.ngh-badge { position: absolute; top: 14px; left: 14px; padding: 5px 11px; border-radius: 999px; font-size: 12px; font-weight: 700; background: var(--ngh-blue); color: #fff; }
.ngh-badge--open { background: #0f172a; }
.ngh-badge--price { background: #b45309; }
.ngh-badge--pending { background: #64748b; }
.ngh-save { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); color: var(--ngh-ink); cursor: pointer; box-shadow: 0 4px 12px rgba(15,23,42,.15); transition: transform .2s; }
.ngh-save:hover { transform: scale(1.1); }
.ngh-save .ngh-ico { width: 20px; height: 20px; }
.ngh-save[aria-pressed="true"] { color: #e11d48; }
.ngh-save[aria-pressed="true"] .ngh-ico { fill: currentColor; }
.ngh-listing-body { padding: 20px 22px 22px; }
.ngh-listing-price { font-family: var(--ngh-serif); font-size: 36px; line-height: 1; color: var(--ngh-ink) !important; margin-bottom: 6px !important; }
.ngh-listing h3 { font-family: var(--ngh-sans) !important; font-size: 17px !important; font-weight: 700; letter-spacing: 0; margin-bottom: 4px !important; }
.ngh-listing-area { display: flex; align-items: center; gap: 6px; font-size: 14px; margin-bottom: 14px !important; }
.ngh-listing-area .ngh-ico { width: 16px; height: 16px; color: var(--ngh-blue); }
.ngh-specs { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0 !important; padding-top: 14px !important; border-top: 1px solid var(--ngh-line); }
.ngh-specs li { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--ngh-muted); }
.ngh-specs b { color: var(--ngh-ink); font-weight: 700; }
.ngh-specs .ngh-ico { width: 18px; height: 18px; color: #64748b; }
.ngh-specs--lg { border-top: 0; padding-top: 0 !important; margin-bottom: 18px !important; }
.ngh-specs--lg li { padding: 10px 14px; background: #fff; border-radius: 12px; font-size: 15px; }
.ngh-empty { padding: 30px; text-align: center; background: #fff; border: 1px dashed #cbd5e1; border-radius: 18px; margin: 0 !important; }

/* ---------- Home of the week: blueprint floor plan ---------- */
.ngh-hotw .ngh-split { align-items: center; }
.ngh-plan-card { padding: 24px; border-radius: 22px; background: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px) 0 0 / 20px 20px, linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px) 0 0 / 20px 20px, #1e3a8a; box-shadow: var(--ngh-shadow); }
.ngh-plan-tag { display: inline-flex !important; align-items: center; gap: 8px; margin-bottom: 14px !important; font-size: 12.5px !important; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #bfdbfe !important; }
.ngh-plan-tag .ngh-ico { width: 18px; height: 18px; }
.ngh-plan { display: block; width: 100%; height: auto; }
.ngh-room rect { fill: transparent; stroke: #fff; stroke-width: 3; transition: fill .2s; }
.ngh-room:hover rect { fill: rgba(255,255,255,.16); }
.ngh-room text { fill: #fff; font: 700 13px var(--ngh-sans); text-anchor: middle; letter-spacing: .04em; text-transform: uppercase; pointer-events: none; }
.ngh-room text.ngh-dim { font-weight: 500; font-size: 11px; fill: #bfdbfe; text-transform: none; }
.ngh-door { fill: none; stroke: #93c5fd; stroke-width: 2; stroke-dasharray: 4 3; }
.ngh-plan-scale { margin: 12px 0 0 !important; font-size: 12.5px; color: #bfdbfe !important; }
.ngh-hotw-price { font-family: var(--ngh-serif); font-size: 46px; line-height: 1; color: var(--ngh-blue) !important; }

/* ---------- Neighbourhoods ---------- */
.ngh-hood { position: relative; height: 100%; padding: 26px 24px 22px; background: #fff; border-radius: 20px; border: 1px solid var(--ngh-line); border-top: 4px solid var(--ngh-blue); }
.ngh-hood-no { font-family: var(--ngh-serif); font-size: 30px; font-style: italic; line-height: 1; color: #93c5fd !important; margin: 0 0 6px !important; }
.ngh-hood > .et_pb_text_inner > p:not([class]) { font-size: 15px; min-height: 76px; }
.ngh-hood-stats { display: grid; gap: 10px; margin: 6px 0 0; padding-top: 14px; border-top: 1px solid var(--ngh-line); }
.ngh-hood-stats div { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.ngh-hood-stats dt { display: flex; align-items: center; gap: 7px; font-size: 13.5px; color: var(--ngh-muted); }
.ngh-hood-stats dt .ngh-ico { width: 17px; height: 17px; color: var(--ngh-blue); }
.ngh-hood-stats dd { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 700; color: var(--ngh-ink); font-size: 14.5px; }
.ngh-bar { display: inline-block; width: 52px; height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--ngh-blue) var(--v), #e2e8f0 var(--v)); }

/* ---------- Mortgage calculator ---------- */
.ngh-calc-sec .ngh-split { align-items: center; }
.ngh-calc { display: grid; grid-template-columns: 1.15fr 1fr; gap: 26px 34px; padding: clamp(24px, 3vw, 36px); background: #fff; border-radius: 24px; box-shadow: var(--ngh-shadow); }
.ngh-calc-in { display: grid; gap: 20px; align-content: start; }
.ngh-range { display: grid; gap: 10px; }
.ngh-range > span { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; font-weight: 700; color: var(--ngh-ink); }
.ngh-range output { font-weight: 700; color: var(--ngh-blue); }
.ngh-range input { --v: 50%; -webkit-appearance: none; appearance: none; width: 100%; height: 8px; margin: 0; border-radius: 4px; background: linear-gradient(90deg, var(--ngh-blue) var(--v), #e2e8f0 var(--v)); cursor: pointer; }
.ngh-range input::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 3px solid var(--ngh-blue); box-shadow: 0 2px 8px rgba(15,23,42,.25); }
.ngh-range input::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 3px solid var(--ngh-blue); }
.ngh-range input:focus-visible { outline: 2px solid var(--ngh-blue); outline-offset: 6px; }
.ngh-term { display: flex; gap: 8px; border: 0; margin: 0; padding: 0; }
.ngh-term legend { width: 100%; margin-bottom: 8px; padding: 0; font-size: 14px; font-weight: 700; color: var(--ngh-ink); }
.ngh-term label { position: relative; flex: 1; cursor: pointer; }
.ngh-term span { display: block; padding: 11px; text-align: center; border: 1.5px solid var(--ngh-line); border-radius: 12px; font-weight: 700; font-size: 14.5px; color: var(--ngh-muted); transition: all .2s; }
.ngh-term input:checked + span { border-color: var(--ngh-blue); background: var(--ngh-tint); color: var(--ngh-blue); }
.ngh-term input:focus-visible + span { outline: 2px solid var(--ngh-blue); outline-offset: 2px; }
.ngh-calc-out { display: grid; gap: 18px; justify-items: center; align-content: start; padding: 22px; border-radius: 18px; background: var(--ngh-bg); }
.ngh-donut { --a: 76; --b: 18; position: relative; display: grid; place-items: center; width: 190px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(var(--ngh-blue) 0 calc(var(--a) * 1%), #f59e0b 0 calc((var(--a) + var(--b)) * 1%), #10b981 0); transition: background .3s; }
.ngh-donut::before { content: ""; position: absolute; inset: 22px; border-radius: 50%; background: var(--ngh-bg); }
.ngh-donut p { position: relative; display: grid; text-align: center; margin: 0 !important; }
.ngh-donut small { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #64748b; }
.ngh-donut strong { font-family: var(--ngh-serif); font-size: 42px; font-weight: 400; line-height: 1; color: var(--ngh-ink); }
.ngh-legend { width: 100%; margin: 0 !important; }
.ngh-legend li { display: flex; align-items: center; gap: 10px; padding: 7px 0; font-size: 14.5px; border-bottom: 1px solid var(--ngh-line); }
.ngh-legend li:last-child { border-bottom: 0; }
.ngh-legend i { width: 12px; height: 12px; border-radius: 3px; }
.ngh-k1 { background: var(--ngh-blue); } .ngh-k2 { background: #f59e0b; } .ngh-k3 { background: #10b981; }
.ngh-legend b { margin-left: auto; color: var(--ngh-ink); }
.ngh-calc-loan { margin: 0 !important; font-size: 14px; }
.ngh-calc-loan b { color: var(--ngh-ink); }
.ngh-calc-note { grid-column: 1 / -1; margin: 0 !important; font-size: 12.5px; line-height: 1.5; color: #64748b !important; }

/* ---------- Reviews ---------- */
.ngh-review { height: 100%; padding: 28px 26px; background: #fff; border-radius: 20px; border: 1px solid var(--ngh-line); }
.ngh-result { display: inline-block !important; padding: 5px 12px !important; border-radius: 999px; background: #dcfce7; color: #166534 !important; font-size: 13px !important; font-weight: 700; margin-bottom: 16px !important; }
.ngh-review blockquote { margin: 0 0 20px; padding: 0; border: 0; font-family: var(--ngh-serif); font-size: 23px; line-height: 1.35; color: var(--ngh-ink); }
.ngh-who { display: grid; grid-template-columns: 46px 1fr; column-gap: 12px; align-items: center; margin: 0 !important; font-size: 13.5px; }
.ngh-who span { grid-row: 1 / 3; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--ngh-tint); color: var(--ngh-blue); font-weight: 700; }
.ngh-who strong { color: var(--ngh-ink); font-size: 15.5px; }

/* ---------- Valuation form ---------- */
.ngh-split { align-items: center; }
.ngh-split--top { align-items: flex-start; }
.ngh-form { position: relative; display: grid; gap: 16px; padding: clamp(24px, 3.2vw, 38px); background: #fff; border-radius: 24px; box-shadow: var(--ngh-shadow); }
.ngh-form-head { display: flex; gap: 16px; align-items: center; padding-bottom: 16px; border-bottom: 1px solid var(--ngh-line); }
.ngh-form-ico { display: grid; place-items: center; flex: none; width: 56px; height: 56px; border-radius: 16px; background: var(--ngh-blue); color: #fff; }
.ngh-form-ico .ngh-ico { width: 28px; height: 28px; }
.ngh-form .ngh-form-title { margin: 0 0 2px !important; font-size: clamp(28px, 2.6vw, 34px) !important; }
.ngh-form-sub { margin: 0 !important; font-size: 15px; }
.ngh-step { display: flex !important; align-items: center; gap: 10px; margin: 4px 0 -4px !important; font-size: 13px !important; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ngh-ink) !important; }
.ngh-step span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ngh-tint); color: var(--ngh-blue); font-size: 13px; letter-spacing: 0; }
.ngh-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ngh-form-grid--3 { grid-template-columns: 1fr 1fr 1.2fr; }
.ngh-field { display: grid; gap: 6px; align-content: start; font-size: 13.5px; font-weight: 700; color: var(--ngh-ink); }
.ngh-form input:not([type=checkbox]):not([type=radio]), .ngh-form select, .ngh-form textarea { width: 100%; padding: 12px 14px; border: 1.5px solid var(--ngh-line); border-radius: 12px; background: var(--ngh-bg); font: 500 16px/1.4 var(--ngh-sans); color: var(--ngh-ink); transition: border-color .2s, background .2s; }
.ngh-form input:focus, .ngh-form select:focus, .ngh-form textarea:focus { outline: none; border-color: var(--ngh-blue) !important; background: #fff !important; box-shadow: 0 0 0 4px rgba(29,78,216,.12); }
.ngh-choices { border: 0; margin: 0; padding: 0; min-width: 0; }
.ngh-choices legend { margin-bottom: 8px; padding: 0; font-size: 13.5px; font-weight: 700; color: var(--ngh-ink); }
.ngh-choices > div { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.ngh-form label.ngh-choice { position: relative; display: block; cursor: pointer; }
.ngh-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ngh-choice span { display: block; padding: 10px 6px; text-align: center; border: 1.5px solid var(--ngh-line); border-radius: 12px; font-size: 14px; font-weight: 600; color: var(--ngh-muted); background: #fff; transition: all .15s; }
.ngh-choice:hover span { border-color: #93c5fd; }
.ngh-choice input:checked + span { border-color: var(--ngh-blue); background: var(--ngh-tint); color: var(--ngh-blue); }
.ngh-choice input:focus-visible + span { outline: 2px solid var(--ngh-blue); outline-offset: 2px; }
.ngh-form-note { font-size: 13.5px; text-align: center; margin: -4px 0 0 !important; }
.ngh-form-ok { display: flex; align-items: flex-start; gap: 10px; background: #dcfce7; color: #166534 !important; border-radius: 12px; padding: 12px 14px !important; margin: 0 !important; font-size: 15px; }
.ngh-form-ok[hidden] { display: none; }
.ngh-form-ok .ngh-ico { margin-top: 2px; stroke-width: 2.6; }
.ngh-hp { position: absolute; left: -9999px; }
.ngh-checks { margin: 0 0 16px !important; }
.ngh-checks li { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 9px; color: var(--ngh-ink); font-size: 15.5px; }
.ngh-checks .ngh-ico { width: 20px; height: 20px; margin-top: 2px; padding: 3px; border-radius: 50%; background: var(--ngh-tint); color: var(--ngh-blue); stroke-width: 3; }
.ngh-checks--lg li { font-size: 17px; margin-bottom: 14px; }

/* ---------- CTA ---------- */
.ngh-cta-row { align-items: center; }
.ngh-cta :is(h2) { color: #fff !important; }
.ngh-cta h2 em { color: #bfdbfe !important; }
.ngh-cta .ngh-eyebrow { color: #bfdbfe !important; }
.ngh-cta-sub { color: rgba(255,255,255,.85) !important; font-size: 18px; margin: 0 !important; }
.ngh-cta-box { display: grid; gap: 12px; }

/* ---------- About ---------- */
.ngh-story-art { position: relative; aspect-ratio: 16 / 10.5; border-radius: 24px; overflow: hidden; box-shadow: var(--ngh-shadow); }
.ngh-story-art .ngh-house { inset: 6% 0 0; height: 94%; }
.ngh-story-cap { position: absolute; left: 16px; bottom: 16px; margin: 0 !important; padding: 6px 14px !important; border-radius: 999px; background: rgba(255,255,255,.92); font-size: 13px; font-weight: 600; color: var(--ngh-ink) !important; }
.ngh-number { display: grid; gap: 6px; text-align: center; }
.ngh-number .et_pb_text_inner { text-align: center !important; }
.ngh-number strong { display: block; font-family: var(--ngh-serif); font-size: clamp(48px, 5vw, 70px); font-weight: 400; line-height: 1; color: #fff; }
.ngh-number span { display: block; font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #93c5fd; }
.ngh-value-card, .ngh-service { height: 100%; padding: 28px 26px; background: #fff; border-radius: 20px; border: 1px solid var(--ngh-line); }
.ngh-val-ico { margin-bottom: 16px !important; }
.ngh-val-ico .ngh-ico { width: 52px; height: 52px; padding: 13px; border-radius: 14px; background: var(--ngh-tint); color: var(--ngh-blue); }
.ngh-value-card p:last-child, .ngh-agent p:last-child { margin-bottom: 0 !important; }
.ngh-value-card > .et_pb_text_inner > p:not([class]), .ngh-service > .et_pb_text_inner > p:not([class]) { font-size: 15.5px; }
.ngh-agent { height: 100%; padding: 26px; background: #fff; border-radius: 20px; border: 1px solid var(--ngh-line); transition: box-shadow .25s; }
.ngh-agent:hover { box-shadow: var(--ngh-shadow); }
.ngh-agent-photo { display: grid !important; place-items: center; width: 84px; height: 84px; margin-bottom: 16px !important; border-radius: 50%; font-family: var(--ngh-serif); font-size: 32px; color: #fff !important; box-shadow: 0 0 0 5px #fff, 0 0 0 6px var(--ngh-line); }
.ngh-agent-photo--1 { background: linear-gradient(135deg, #1d4ed8, #60a5fa); }
.ngh-agent-photo--2 { background: linear-gradient(135deg, #374151, #94a3b8); }
.ngh-agent-photo--3 { background: linear-gradient(135deg, #b45309, #fbbf24); }
.ngh-agent-photo--4 { background: linear-gradient(135deg, #0e7490, #67e8f9); }
.ngh-agent-photo--5 { background: linear-gradient(135deg, #7c3aed, #c4b5fd); }
.ngh-agent-photo--6 { background: linear-gradient(135deg, #15803d, #86efac); }
.ngh-role { font-size: 13px !important; font-weight: 700; color: var(--ngh-blue) !important; margin-bottom: 8px !important; }
.ngh-agent > .et_pb_text_inner > p:not([class]) { font-size: 15px; }
.ngh-agent-stats { display: flex; gap: 0; margin: 0 !important; border-top: 1px solid var(--ngh-line); }
.ngh-agent-stats span { flex: 1; display: grid; padding-top: 12px; font-size: 12.5px; color: #64748b; }
.ngh-agent-stats span + span { padding-left: 14px; border-left: 1px solid var(--ngh-line); }
.ngh-agent-stats b { font-family: var(--ngh-serif); font-size: 30px; font-weight: 400; line-height: 1; color: var(--ngh-ink); }

/* ---------- Services ---------- */
.ngh-flow-switch { display: inline-flex; gap: 4px; margin: 0 0 34px; padding: 5px; border-radius: 14px; background: var(--ngh-tint); }
.ngh-flow { text-align: center; }
.ngh-flow-switch label { position: relative; cursor: pointer; }
.ngh-flow-switch span { display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 10px; font-weight: 700; color: var(--ngh-muted); transition: all .2s; }
.ngh-flow-switch .ngh-ico { width: 18px; height: 18px; }
.ngh-flow-switch input:checked + span { background: var(--ngh-blue); color: #fff; }
.ngh-flow-switch input:focus-visible + span { outline: 2px solid var(--ngh-blue); outline-offset: 2px; }
.ngh-steps { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; margin: 0 !important; text-align: left; }
.ngh-steps::before { content: ""; position: absolute; top: 27px; left: 5%; right: 5%; border-top: 2px dashed #bfdbfe; }
.ngh-steps--sell, .ngh-flow:has(input[value="sell"]:checked) .ngh-steps--buy { display: none; }
.ngh-flow:has(input[value="sell"]:checked) .ngh-steps--sell { display: grid; }
.ngh-steps li { position: relative; animation: ngh-in .4s ease both; }
.ngh-steps li:nth-child(2) { animation-delay: .05s; } .ngh-steps li:nth-child(3) { animation-delay: .1s; } .ngh-steps li:nth-child(4) { animation-delay: .15s; } .ngh-steps li:nth-child(5) { animation-delay: .2s; }
@keyframes ngh-in { from { opacity: 0; transform: translateY(8px); } }
.ngh-steps b { position: relative; display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 16px; border-radius: 50%; background: #fff; border: 2px solid var(--ngh-blue); font-family: var(--ngh-serif); font-size: 24px; font-weight: 400; color: var(--ngh-blue); }
.ngh-steps h3 { font-size: 24px !important; }
.ngh-steps p { font-size: 15px; margin-bottom: 10px !important; }
.ngh-steps span { display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--ngh-tint); color: var(--ngh-blue); font-size: 12.5px; font-weight: 700; }
.ngh-service .ngh-checks { margin: 14px 0 0 !important; }
.ngh-works { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 !important; }
.ngh-works li { display: grid; gap: 12px; padding: 22px; border-radius: 18px; background: var(--ngh-bg); border: 1px solid var(--ngh-line); }
.ngh-works .ngh-ico { width: 46px; height: 46px; padding: 11px; border-radius: 12px; background: var(--ngh-blue); color: #fff; }
.ngh-works span { display: grid; gap: 2px; font-size: 14.5px; line-height: 1.5; }
.ngh-works b { color: var(--ngh-ink); font-size: 16px; }

/* ---------- FAQ ---------- */
.ngh-sticky-row { align-items: stretch !important; }
.ngh-faq-side .et_pb_code { position: sticky; top: 110px; }
.ngh-faq-title { font-size: 40px !important; margin: 44px 0 16px !important; }
.ngh-faq-main > .et_pb_text:first-child .ngh-faq-title { margin-top: 0 !important; }
.ngh-accordion .et_pb_toggle { border: 1px solid var(--ngh-line); border-radius: 16px; padding: 18px 22px; margin-bottom: 10px !important; background: #fff !important; transition: border-color .2s, box-shadow .2s; }
.ngh-accordion .et_pb_toggle_open { border-color: #93c5fd; box-shadow: 0 10px 24px -16px rgba(29,78,216,.5); }
.ngh-accordion .et_pb_toggle .et_pb_toggle_title { font-family: var(--ngh-sans); font-size: 17px; font-weight: 700; color: var(--ngh-ink) !important; padding-right: 36px; line-height: 1.4; }
.ngh-accordion .et_pb_toggle_title:before { color: var(--ngh-blue) !important; }
.ngh-accordion .et_pb_toggle_content, .ngh-accordion .et_pb_toggle_content p { font-family: var(--ngh-sans); color: var(--ngh-muted); font-weight: 400 !important; padding-top: 8px; font-size: 16px; line-height: 1.7; }
.ngh-gloss { padding: 30px 28px; background: var(--ngh-ink); border-radius: 22px; color: #cbd5e1; }
.ngh-gloss-tag { display: inline-flex !important; align-items: center; gap: 8px; font-size: 12.5px !important; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #93c5fd !important; margin-bottom: 10px !important; }
.ngh-gloss-tag .ngh-ico { width: 18px; height: 18px; }
.ngh-gloss h3 { color: #fff !important; font-size: 34px !important; }
.ngh-gloss dl { margin: 14px 0 22px; }
.ngh-gloss dt { margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.12); font-family: var(--ngh-serif); font-size: 22px; font-style: italic; color: #fff; }
.ngh-gloss dt:first-child { margin-top: 0; }
.ngh-gloss dd { margin: 2px 0 0; font-size: 14.5px; line-height: 1.55; }
.ngh-gloss .ngh-btn { background: #fff; color: var(--ngh-blue) !important; box-shadow: none; }

/* ---------- Contact ---------- */
.ngh-card { padding: 26px; background: #fff; border-radius: 20px; border: 1px solid var(--ngh-line); margin-bottom: 20px; }
.ngh-card-tag { display: inline-flex !important; align-items: center; gap: 8px; font-size: 12.5px !important; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ngh-blue) !important; margin-bottom: 16px !important; }
.ngh-card-tag .ngh-ico { width: 18px; height: 18px; }
.ngh-contact-line { display: flex; gap: 14px; align-items: flex-start; color: var(--ngh-ink) !important; line-height: 1.5; }
.ngh-contact-line:last-child { margin-bottom: 0 !important; }
.ngh-contact-line > .ngh-ico { width: 42px; height: 42px; padding: 10px; border-radius: 12px; background: var(--ngh-tint); color: var(--ngh-blue); }
.ngh-contact-line a { font-family: var(--ngh-serif); font-size: 24px; color: var(--ngh-ink) !important; text-decoration: none; }
.ngh-contact-line a:hover { color: var(--ngh-blue) !important; }
.ngh-contact-line small { display: block; font-size: 13.5px; color: #64748b; }
.ngh-opens { margin: 0 !important; }
.ngh-opens li { display: flex; gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--ngh-line); }
.ngh-opens li:last-child { border-bottom: 0; padding-bottom: 0; }
.ngh-opens b { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 12px; background: var(--ngh-ink); color: #fff; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; }
.ngh-opens span { display: grid; font-weight: 700; color: var(--ngh-ink); font-size: 15.5px; }
.ngh-opens small { font-weight: 500; font-size: 13.5px; color: #64748b; }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
	.ngh-search-buy { grid-template-columns: 1fr 1fr; gap: 6px; }
	.ngh-search label:not(.ngh-search-tabs label) { border-right: 0; background: var(--ngh-bg); border-radius: 10px; padding: 8px 12px; }
	.ngh-search-buy .ngh-btn { grid-column: 1 / -1; }
	.ngh-listing-grid { grid-template-columns: 1fr 1fr; }
	.ngh-calc { grid-template-columns: 1fr; }
	.ngh-steps { grid-template-columns: 1fr 1fr; }
	.ngh-steps::before { display: none; }
	.ngh-faq-side .et_pb_code { position: static; }
	.ngh-snap, .ngh-hood, .ngh-review, .ngh-value-card, .ngh-service, .ngh-agent { height: auto; }
	.ngh-hood > .et_pb_text_inner > p:not([class]) { min-height: 0; }
}
@media (max-width: 640px) {
	[class*="ngh-"] h1 { font-size: clamp(46px, 13vw, 60px); }
	[class*="ngh-"] h2 { font-size: clamp(36px, 10vw, 46px); }
	.ngh-search-tabs { padding-left: 8px; }
	.ngh-search-tabs span { padding: 10px 18px; }
	.ngh-search-sell { grid-template-columns: 1fr; gap: 8px; }
	.ngh-hero-proof { gap: 8px 18px; font-size: 14px; }
	.ngh-listing-grid { grid-template-columns: 1fr; }
	.ngh-snap { padding: 20px 16px; }
	.ngh-snap-num { font-size: 44px; }
	.ngh-snap-label { font-size: 13px; }
	.ngh-snap-trend { font-size: 11.5px; }
	.ngh-grid-4 { --ngh-gap: 12px; }
	.ngh-grid-4 > .et_pb_column { width: calc(50% - 6px) !important; flex: 0 0 calc(50% - 6px) !important; }
	/* Neighbourhood and value cards need the full width */
	:is(.ngh-hoods, .ngh-values) .ngh-grid-4 > .et_pb_column { width: 100% !important; flex: 0 0 100% !important; }
	.ngh-plan-card { padding: 14px; }
	.ngh-room text { font-size: 15px; }
	.ngh-room text.ngh-dim { display: none; }
	.ngh-donut { width: 170px; }
	.ngh-form-grid, .ngh-form-grid--3 { grid-template-columns: 1fr 1fr; }
	.ngh-form-grid--3 label:last-child { grid-column: 1 / -1; }
	.ngh-form-grid:not(.ngh-form-grid--3) { grid-template-columns: 1fr; }
	.ngh-choices > div { grid-template-columns: 1fr 1fr; }
	.ngh-steps { grid-template-columns: 1fr; }
	.ngh-steps li { display: grid; grid-template-columns: 56px 1fr; column-gap: 16px; }
	.ngh-steps b { grid-row: 1 / 4; }
	.ngh-steps span { justify-self: start; }
	.ngh-flow-switch span { padding: 10px 14px; font-size: 14.5px; }
	.ngh-works { grid-template-columns: 1fr; }
	.ngh-number strong { font-size: 44px; }
	.ngh-number span { font-size: 11.5px; letter-spacing: .06em; }
	.ngh-gloss { padding: 24px 20px; }
}
