:root {
  --paper: #f5f1e8;
  --warm-white: #fffdf8;
  --ink: #171915;
  --muted: #5e635b;
  --sage: #7f8d70;
  --deep-sage: #394739;
  --limestone: #d9d0bf;
  --rust: #8a5633;
  --line: rgba(23, 25, 21, .14);
  --shadow: 0 24px 70px rgba(23, 25, 21, .14);
  --serif: Georgia, "Times New Roman", serif;
  --sans: Arial, Helvetica, sans-serif;
  --shell: min(1180px, calc(100% - 40px));
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--paper);
}

body {
  margin: 0;
  background: var(--warm-white);
  color: var(--ink);
  font-family: var(--sans);
  line-height: 1.6;
  text-rendering: optimizeLegibility;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
}

button,
input,
select,
textarea {
  font: inherit;
}

.shell {
  width: var(--shell);
  margin-inline: auto;
}

.narrow {
  max-width: 850px;
}

.skip-link {
  position: fixed;
  left: 16px;
  top: -60px;
  z-index: 999;
  background: #fff;
  padding: 12px 16px;
  border-radius: 6px;
}

.skip-link:focus {
  top: 16px;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 253, 248, .92);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(16px);
}

.header-inner {
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 28px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  margin-right: auto;
}

.brand img {
  width: 54px;
  height: 54px;
  object-fit: contain;
}

.brand span {
  display: grid;
  gap: 1px;
}

.brand strong {
  font-family: var(--serif);
  font-size: 1.14rem;
  letter-spacing: .08em;
}

.brand small {
  color: var(--muted);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 24px;
}

.desktop-nav a {
  text-decoration: none;
  font-size: .88rem;
  font-weight: 700;
}

.desktop-nav a:hover,
.desktop-nav a:focus-visible {
  color: var(--rust);
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 13px 22px;
  border: 1px solid var(--ink);
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, color .2s ease;
}

.button:hover,
.button:focus-visible {
  transform: translateY(-2px);
  background: var(--deep-sage);
}

.button-small {
  min-height: 44px;
  padding: 10px 18px;
  font-size: .88rem;
}

.button-dark {
  width: 100%;
  background: var(--paper);
  color: var(--ink);
  border-color: var(--paper);
}

.hero {
  position: relative;
  min-height: calc(100vh - 82px);
  display: grid;
  align-items: center;
  overflow: hidden;
  background: var(--ink);
}

.hero-background,
.hero-overlay {
  position: absolute;
  inset: 0;
}

.hero-background {
  background-image: url("assets/town-fork-entry.jpg");
  background-size: cover;
  background-position: center 58%;
  transform: scale(1.02);
  filter: saturate(.82) contrast(.96);
}

.hero-overlay {
  background:
    linear-gradient(90deg, rgba(16, 20, 16, .93) 0%, rgba(16, 20, 16, .79) 45%, rgba(16, 20, 16, .30) 76%, rgba(16, 20, 16, .48) 100%),
    linear-gradient(0deg, rgba(16, 20, 16, .42), transparent 45%);
}

.hero-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .55fr);
  align-items: end;
  gap: 72px;
  padding-block: clamp(88px, 12vw, 160px);
}

.hero-copy {
  max-width: 770px;
}

.eyebrow {
  margin: 0 0 14px;
  color: rgba(255,255,255,.76);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.eyebrow.dark {
  color: var(--rust);
}

.eyebrow.light {
  color: #dbe2d4;
}

.hero h1 {
  margin: 0;
  color: #fff;
  font-family: var(--serif);
  font-size: clamp(4rem, 10vw, 8.8rem);
  font-weight: 500;
  line-height: .86;
  letter-spacing: -.045em;
}

.tagline {
  margin: 22px 0 18px;
  color: #fff;
  font-family: var(--serif);
  font-size: clamp(1.7rem, 3vw, 3rem);
  font-style: italic;
}

.hero-lead {
  max-width: 720px;
  margin: 0;
  color: rgba(255,255,255,.84);
  font-size: clamp(1rem, 1.5vw, 1.2rem);
}

.hero-actions {
  margin-top: 34px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 22px;
}

.hero-actions .button {
  background: var(--paper);
  color: var(--ink);
  border-color: var(--paper);
}

.text-link {
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}

.text-link:hover,
.text-link:focus-visible {
  text-decoration: underline;
}

.hero-facts {
  display: grid;
  gap: 1px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 18px;
  overflow: hidden;
  backdrop-filter: blur(10px);
}

.hero-facts div {
  display: grid;
  gap: 4px;
  padding: 22px;
  background: rgba(20, 24, 20, .62);
}

.hero-facts strong {
  color: #fff;
  font-family: var(--serif);
  font-size: 1.8rem;
  font-weight: 500;
}

.hero-facts span {
  color: rgba(255,255,255,.72);
  font-size: .87rem;
}

.section {
  padding-block: clamp(76px, 9vw, 128px);
}

.intro {
  background: var(--paper);
  text-align: center;
}

h2,
h3 {
  font-family: var(--serif);
}

h2 {
  margin: 0 0 24px;
  font-size: clamp(2.4rem, 5vw, 4.8rem);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -.035em;
}

h3 {
  margin: 0 0 12px;
  font-size: 1.55rem;
  line-height: 1.2;
}

.large-copy {
  margin: 0 auto 20px;
  color: var(--ink);
  font-family: var(--serif);
  font-size: clamp(1.35rem, 2.5vw, 2.05rem);
  line-height: 1.45;
}

.intro p:last-child {
  color: var(--muted);
}

.section-heading {
  max-width: 850px;
  margin-bottom: 46px;
}

.section-heading > p:last-child {
  color: var(--muted);
  font-size: 1.05rem;
}

.split-heading {
  max-width: none;
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  align-items: end;
  gap: 64px;
}

.master-planned {
  background: var(--warm-white);
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.feature-card {
  min-height: 310px;
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.feature-number {
  display: inline-block;
  margin-bottom: 48px;
  color: var(--rust);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12em;
}

.feature-card p {
  color: var(--muted);
}

.attainability-callout {
  margin-top: 22px;
  padding: clamp(30px, 5vw, 58px);
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 50px;
  align-items: end;
  border-radius: 18px;
  background: var(--paper);
}

.attainability-callout h3 {
  max-width: 750px;
  font-size: clamp(2rem, 4vw, 3.7rem);
  font-weight: 500;
  letter-spacing: -.025em;
}

.attainability-callout > p {
  color: var(--muted);
}

.plan-section {
  background: #eef0ea;
}

.plan-image-button {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 18px;
  overflow: hidden;
  background: transparent;
  box-shadow: var(--shadow);
  cursor: zoom-in;
}

.plan-image-button img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.plan-image-button span {
  position: absolute;
  right: 18px;
  bottom: 18px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(20, 24, 20, .86);
  color: #fff;
  font-size: .78rem;
  font-weight: 700;
}

.image-note {
  margin: 18px 0 0;
  color: var(--muted);
  font-size: .82rem;
}

.two-column {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: clamp(50px, 8vw, 110px);
  align-items: start;
}

.housing-section {
  background: var(--warm-white);
}

.housing-list {
  border-top: 1px solid var(--line);
}

.housing-list div {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 18px;
  align-items: center;
  padding-block: 22px;
  border-bottom: 1px solid var(--line);
}

.housing-list span {
  color: var(--rust);
  font-size: .78rem;
  font-weight: 800;
}

.housing-list strong {
  font-family: var(--serif);
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  font-weight: 500;
}

.amenities-section {
  background: var(--paper);
}

.amenity-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.amenity-cloud span {
  padding: 13px 17px;
  border: 1px solid rgba(57, 71, 57, .24);
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  font-weight: 700;
}

.neighbor-section {
  background: var(--deep-sage);
  color: #fff;
}

.neighbor-section .section-heading {
  max-width: 930px;
}

.neighbor-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px;
  overflow: hidden;
  background: rgba(255,255,255,.18);
}

.neighbor-grid article {
  min-height: 260px;
  padding: 28px;
  background: rgba(42, 55, 43, .9);
}

.neighbor-grid h3 {
  font-size: 1.35rem;
}

.neighbor-grid p {
  color: rgba(255,255,255,.72);
}

.location-section {
  background: var(--warm-white);
}

.location-grid {
  align-items: center;
}

.status-list {
  margin: 34px 0 0;
  border-top: 1px solid var(--line);
}

.status-list div {
  padding-block: 18px;
  border-bottom: 1px solid var(--line);
}

.status-list dt {
  margin-bottom: 5px;
  color: var(--rust);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.status-list dd {
  margin: 0;
}

.location-card {
  min-height: 390px;
  padding: clamp(30px, 5vw, 58px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  border-radius: 18px;
  background:
    radial-gradient(circle at 65% 30%, rgba(255,255,255,.34), transparent 22%),
    linear-gradient(145deg, var(--limestone), #b9c0a9);
  box-shadow: var(--shadow);
}

.location-pin {
  width: 24px;
  height: 24px;
  margin-bottom: auto;
  border: 7px solid var(--ink);
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}

.location-card strong {
  font-family: var(--serif);
  font-size: 2rem;
}

.location-card span {
  color: rgba(23,25,21,.72);
}

.location-card a {
  margin-top: 24px;
  font-weight: 800;
}

.updates-section {
  background: var(--ink);
  color: #fff;
}

.updates-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(48px, 8vw, 110px);
  align-items: start;
}

.updates-section h2 {
  max-width: 550px;
}

.updates-section p {
  color: rgba(255,255,255,.72);
}

.contact-line a {
  color: #fff;
}

.interest-form {
  padding: clamp(26px, 4vw, 42px);
  border-radius: 18px;
  background: #fff;
  color: var(--ink);
}

.form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.interest-form label {
  display: grid;
  gap: 7px;
  margin-bottom: 16px;
  font-size: .82rem;
  font-weight: 800;
}

.interest-form label span {
  color: var(--muted);
  font-weight: 400;
}

input,
select,
textarea {
  width: 100%;
  border: 1px solid rgba(23,25,21,.22);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  padding: 13px 14px;
}

input:focus,
select:focus,
textarea:focus {
  outline: 3px solid rgba(127,141,112,.28);
  border-color: var(--deep-sage);
}

textarea {
  resize: vertical;
}

.consent {
  grid-template-columns: 20px 1fr !important;
  align-items: start;
  gap: 10px !important;
  font-weight: 400 !important;
}

.consent input {
  width: 18px;
  height: 18px;
  margin-top: 3px;
}

.form-status {
  margin: 12px 0 0;
  color: var(--deep-sage) !important;
  font-weight: 700;
}

.form-note {
  margin: 14px 0 0;
  color: var(--muted) !important;
  font-size: .74rem;
}

.site-footer {
  padding-block: 52px 28px;
  background: #0c0e0b;
  color: #fff;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.2fr .8fr .8fr;
  gap: 50px;
}

.footer-grid > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer-grid a,
.footer-grid span {
  color: rgba(255,255,255,.7);
  text-decoration: none;
}

.footer-brand {
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px;
}

.footer-brand img {
  width: 66px;
  height: 66px;
  border-radius: 50%;
  background: #fff;
}

.footer-brand strong {
  display: block;
  font-family: var(--serif);
  font-size: 1.5rem;
}

.legal {
  margin-top: 42px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.52);
  font-size: .74rem;
}

.plan-dialog {
  width: min(96vw, 1500px);
  max-width: none;
  padding: 0;
  border: 0;
  border-radius: 12px;
  overflow: visible;
  background: transparent;
}

.plan-dialog::backdrop {
  background: rgba(0,0,0,.86);
}

.plan-dialog img {
  max-height: 90vh;
  margin: auto;
  border-radius: 8px;
}

.dialog-close {
  position: absolute;
  right: -6px;
  top: -48px;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  color: #fff;
  font-size: 1.7rem;
  cursor: pointer;
}


.concept-note {
  margin: 14px 0 0;
  color: rgba(255,255,255,.58);
  font-size: .8rem;
}

.neighborhoods-section {
  background: #eef0ea;
}

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

.neighborhood-grid article {
  min-height: 230px;
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--warm-white);
}


.neighborhood-grid h3 {
  font-size: clamp(1.55rem, 2.4vw, 2.15rem);
  font-weight: 500;
}

.neighborhood-grid p {
  margin-bottom: 0;
  color: var(--muted);
}

.neighborhood-grid .naming-card {
  background: var(--deep-sage);
  color: #fff;
}

.neighborhood-grid .naming-card p {
  color: rgba(255,255,255,.72);
}

.vision-gallery-section {
  background: var(--warm-white);
}

.vision-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.gallery-card {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.gallery-wide {
  grid-column: 1 / -1;
}

.gallery-card img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.gallery-wide img {
  aspect-ratio: 16 / 8.2;
  object-position: center 55%;
}

.gallery-card figcaption {
  display: grid;
  gap: 4px;
  padding: 20px 22px 23px;
}

.gallery-card figcaption strong {
  font-family: var(--serif);
  font-size: 1.28rem;
}

.gallery-card figcaption span {
  color: var(--muted);
  font-size: .9rem;
}

.honeypot {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

@media (max-width: 980px) {
  .desktop-nav {
    display: none;
  }

  .hero {
    min-height: auto;
  }

  .hero-content {
    grid-template-columns: 1fr;
    gap: 44px;
    padding-block: 110px 84px;
  }

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

  .split-heading,
  .attainability-callout,
  .two-column,
  .updates-grid {
    grid-template-columns: 1fr;
  }

  .split-heading {
    gap: 12px;
  }

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

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

@media (max-width: 700px) {
  :root {
    --shell: min(100% - 28px, 1180px);
  }

  .site-header .button-small {
    display: none;
  }

  .header-inner {
    min-height: 70px;
  }

  .brand img {
    width: 46px;
    height: 46px;
  }

  .brand strong {
    font-size: 1rem;
  }

  .brand small {
    font-size: .62rem;
  }

  .hero {
    min-height: calc(100svh - 70px);
  }

  .hero-content {
    padding-block: 86px 64px;
  }

  .hero h1 {
    font-size: clamp(4.2rem, 22vw, 6.4rem);
  }

  .hero-overlay {
    background:
      linear-gradient(180deg, rgba(16,20,16,.82), rgba(16,20,16,.9)),
      linear-gradient(90deg, rgba(16,20,16,.9), rgba(16,20,16,.5));
  }

  .hero-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .hero-actions .button {
    width: 100%;
  }

  .text-link {
    text-align: center;
  }

  .hero-facts {
    grid-template-columns: 1fr;
  }

  .hero-facts div {
    padding: 18px;
  }

  .section {
    padding-block: 72px;
  }

  .feature-grid,
  .neighbor-grid,
  .neighborhood-grid,
  .vision-gallery,
  .form-row,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .feature-card {
    min-height: 0;
    padding: 26px;
  }

  .feature-number {
    margin-bottom: 28px;
  }

  .attainability-callout {
    padding: 28px;
    gap: 18px;
  }

  .plan-image-button img {
    aspect-ratio: 4 / 3;
  }

  .plan-image-button span {
    left: 12px;
    right: auto;
    bottom: 12px;
  }

  .housing-list div {
    grid-template-columns: 42px 1fr;
  }

  .neighbor-grid article {
    min-height: 0;
  }

  .location-card {
    min-height: 320px;
  }

  .footer-grid {
    gap: 28px;
  }

  .legal {
    margin-top: 32px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
}


.thank-you-page {
  min-height: 100vh;
  padding: 30px;
  display: grid;
  place-items: center;
  background: var(--paper);
}

.thank-you-card {
  width: min(720px, 100%);
  padding: clamp(34px, 7vw, 72px);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--shadow);
  text-align: center;
}

.thank-you-card img {
  margin: 0 auto 26px;
}

.thank-you-card h1 {
  margin: 0 0 20px;
  font-family: var(--serif);
  font-size: clamp(2.4rem, 6vw, 4.8rem);
  font-weight: 500;
  line-height: 1.05;
}

.thank-you-card p {
  color: var(--muted);
}

.thank-you-card .button {
  margin-top: 18px;
}

.location-card .location-detail {
  margin-top: 14px;
  max-width: 420px;
  color: rgba(23,25,21,.78);
  font-size: .9rem;
}


/* Version 4 revised: corrected Heritage image and common-area amenity placement */

.neighborhood-grid .heritage-card {
  position: relative;
  isolation: isolate;
  justify-content: flex-end;
  overflow: hidden;
  border-color: rgba(255,255,255,.26);
  background:
    linear-gradient(
      180deg,
      rgba(15,18,14,.10) 0%,
      rgba(15,18,14,.22) 42%,
      rgba(15,18,14,.84) 100%
    ),
    url("assets/town-fork-heritage.jpg") center 56% / cover no-repeat;
  color: #fff;
  box-shadow: 0 14px 34px rgba(23,25,21,.16);
}

.neighborhood-grid .heritage-card h3 {
  color: #fff;
}

.neighborhood-grid .heritage-card p {
  color: rgba(255,255,255,.84);
}

.heritage-card-copy {
  position: relative;
  z-index: 1;
}

.amenities-visual-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(28px, 5vw, 58px);
  align-items: center;
}

.amenities-common-image {
  margin: 0;
  overflow: hidden;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 16px 38px rgba(23,25,21,.14);
}

.amenities-common-image img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.amenities-common-image figcaption {
  display: grid;
  gap: 4px;
  padding: 17px 19px 20px;
}

.amenities-common-image figcaption strong {
  font-family: var(--serif);
  font-size: 1.2rem;
}

.amenities-common-image figcaption span {
  color: var(--muted);
  font-size: .86rem;
}

@media (max-width: 980px) {
  .amenities-visual-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .neighborhood-grid .heritage-card {
    min-height: 310px;
    background-position: 56% center;
  }

  .amenities-common-image img {
    aspect-ratio: 4 / 3;
  }
}


/* Version 4 header revision: sticky, complete, chronological section navigation */

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 253, 248, .96);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(16px);
}

.header-primary {
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 18px;
}

.header-primary .brand {
  margin-right: auto;
}

.header-primary .brand img {
  width: 50px;
  height: 50px;
}

.header-update-button {
  flex: 0 0 auto;
}

.section-nav {
  border-top: 1px solid rgba(23, 25, 21, .08);
  background: rgba(245, 241, 232, .97);
}

.section-nav-track {
  display: flex;
  align-items: stretch;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(57, 71, 57, .35) transparent;
}

.section-nav-track::-webkit-scrollbar {
  height: 4px;
}

.section-nav-track::-webkit-scrollbar-thumb {
  border-radius: 99px;
  background: rgba(57, 71, 57, .35);
}

.section-nav-track a {
  position: relative;
  flex: 0 0 auto;
  padding: 12px 13px 11px;
  color: var(--ink);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .025em;
  text-decoration: none;
  white-space: nowrap;
}

.section-nav-track a::after {
  content: "";
  position: absolute;
  right: 13px;
  bottom: 5px;
  left: 13px;
  height: 2px;
  border-radius: 2px;
  background: var(--rust);
  opacity: 0;
  transform: scaleX(.25);
  transition: opacity .18s ease, transform .18s ease;
}

.section-nav-track a:hover,
.section-nav-track a:focus-visible,
.section-nav-track a.is-active {
  color: var(--rust);
}

.section-nav-track a:hover::after,
.section-nav-track a:focus-visible::after,
.section-nav-track a.is-active::after {
  opacity: 1;
  transform: scaleX(1);
}

.mobile-menu-toggle,
.mobile-section-menu {
  display: none;
}

.mobile-menu-toggle {
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--warm-white);
  cursor: pointer;
}

.mobile-menu-toggle span {
  display: block;
  width: 100%;
  height: 2px;
  margin: 4px 0;
  border-radius: 2px;
  background: var(--ink);
  transition: transform .2s ease, opacity .2s ease;
}

.mobile-menu-toggle[aria-expanded="true"] span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.mobile-menu-toggle[aria-expanded="true"] span:nth-child(2) {
  opacity: 0;
}

.mobile-menu-toggle[aria-expanded="true"] span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.mobile-section-menu {
  max-height: 0;
  overflow: hidden;
  border-top: 1px solid transparent;
  background: rgba(255, 253, 248, .99);
  transition: max-height .28s ease, border-color .28s ease;
}

.mobile-section-menu.is-open {
  max-height: min(72vh, 720px);
  overflow-y: auto;
  border-color: var(--line);
}

.mobile-section-links {
  display: grid;
  padding-block: 7px 16px;
}

.mobile-section-links a {
  padding: 12px 2px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: .94rem;
  font-weight: 750;
  text-decoration: none;
}

.mobile-section-links a.is-active {
  color: var(--rust);
}

.mobile-section-links .mobile-updates-link {
  margin-top: 10px;
  padding: 12px 17px;
  border: 1px solid var(--ink);
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  text-align: center;
}

#home,
section[id] {
  scroll-margin-top: 128px;
}

@media (max-width: 1050px) {
  .desktop-section-nav {
    display: none;
  }

  .mobile-menu-toggle,
  .mobile-section-menu {
    display: block;
  }

  .header-primary {
    min-height: 70px;
  }

  .header-update-button {
    display: none;
  }

  #home,
  section[id] {
    scroll-margin-top: 84px;
  }
}

@media (max-width: 700px) {
  .header-primary .brand img {
    width: 44px;
    height: 44px;
  }

  .header-primary .brand strong {
    font-size: .98rem;
  }

  .header-primary .brand small {
    font-size: .6rem;
  }

  .mobile-section-links a {
    padding-block: 11px;
  }
}


/* West Ridge neighborhood card background image */
.neighborhood-grid .west-ridge-card {
  position: relative;
  isolation: isolate;
  justify-content: flex-end;
  overflow: hidden;
  border-color: rgba(255,255,255,.26);
  background:
    linear-gradient(
      180deg,
      rgba(15,18,14,.08) 0%,
      rgba(15,18,14,.20) 42%,
      rgba(15,18,14,.84) 100%
    ),
    url("assets/town-fork-west-ridge.jpg") center 58% / cover no-repeat;
  color: #fff;
  box-shadow: 0 14px 34px rgba(23,25,21,.16);
}

.neighborhood-grid .west-ridge-card h3 {
  color: #fff;
}

.neighborhood-grid .west-ridge-card p {
  color: rgba(255,255,255,.84);
}

.west-ridge-card-copy {
  position: relative;
  z-index: 1;
}

@media (max-width: 700px) {
  .neighborhood-grid .west-ridge-card {
    min-height: 310px;
    background-position: 56% center;
  }
}


/* Header action-button revision */
.header-action-buttons {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-right: 18px;
}

.header-commercial-button,
.header-update-button {
  white-space: nowrap;
}

.header-commercial-button {
  background: var(--deep-sage);
  border-color: var(--deep-sage);
}

.header-commercial-button:hover,
.header-commercial-button:focus-visible {
  background: var(--rust);
  border-color: var(--rust);
}

@media (max-width: 1050px) {
  .header-action-buttons {
    display: none;
  }
}


/* Town Fork Villas neighborhood card background image */
.neighborhood-grid .villas-card {
  position: relative;
  isolation: isolate;
  justify-content: flex-end;
  overflow: hidden;
  border-color: rgba(255,255,255,.26);
  background:
    linear-gradient(
      180deg,
      rgba(15,18,14,.06) 0%,
      rgba(15,18,14,.18) 42%,
      rgba(15,18,14,.84) 100%
    ),
    url("assets/town-fork-villas.jpg") center 54% / cover no-repeat;
  color: #fff;
  box-shadow: 0 14px 34px rgba(23,25,21,.16);
}

.neighborhood-grid .villas-card h3 {
  color: #fff;
}

.neighborhood-grid .villas-card p {
  color: rgba(255,255,255,.84);
}

.villas-card-copy {
  position: relative;
  z-index: 1;
}

@media (max-width: 700px) {
  .neighborhood-grid .villas-card {
    min-height: 310px;
    background-position: 50% center;
  }
}


/* Town Fork Village neighborhood card background image */
.neighborhood-grid .village-card {
  position: relative;
  isolation: isolate;
  justify-content: flex-end;
  overflow: hidden;
  border-color: rgba(255,255,255,.26);
  background:
    linear-gradient(
      180deg,
      rgba(15,18,14,.05) 0%,
      rgba(15,18,14,.18) 42%,
      rgba(15,18,14,.84) 100%
    ),
    url("assets/town-fork-village.jpg") center 54% / cover no-repeat;
  color: #fff;
  box-shadow: 0 14px 34px rgba(23,25,21,.16);
}

.neighborhood-grid .village-card h3 {
  color: #fff;
}

.neighborhood-grid .village-card p {
  color: rgba(255,255,255,.84);
}

.village-card-copy {
  position: relative;
  z-index: 1;
}

@media (max-width: 700px) {
  .neighborhood-grid .village-card {
    min-height: 310px;
    background-position: 50% center;
  }
}


/* Version 4 consolidated-page revision */

.combined-vision-section {
  padding-block: clamp(66px, 7.5vw, 102px);
  background: #e7ebe3;
}

.vision-overview {
  margin-bottom: 22px;
  padding: clamp(28px, 4vw, 46px);
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: clamp(30px, 5vw, 64px);
  align-items: center;
  border-radius: 18px;
  background: var(--deep-sage);
  color: #fff;
}

.vision-overview h3 {
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  font-weight: 500;
}

.vision-overview p {
  margin-bottom: 0;
  color: rgba(255,255,255,.76);
}

.vision-pull-quote {
  padding-left: clamp(24px, 4vw, 44px);
  border-left: 1px solid rgba(255,255,255,.28);
  font-family: var(--serif);
  font-size: clamp(1.4rem, 2.5vw, 2.15rem);
  line-height: 1.35;
}

.compact-feature-grid .feature-card {
  min-height: 235px;
  padding: 28px;
}

.compact-feature-grid .feature-number {
  margin-bottom: 26px;
}

.compact-attainability-callout {
  padding: clamp(28px, 4vw, 46px);
}

.compact-attainability-callout h3 {
  font-size: clamp(1.8rem, 3.4vw, 3rem);
}

.combined-amenities-section {
  padding-block: clamp(70px, 8vw, 108px);
}

.clubhouse-feature {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: clamp(28px, 5vw, 58px);
  align-items: center;
}

.clubhouse-primary-image {
  margin: 0;
  overflow: hidden;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 16px 38px rgba(23,25,21,.14);
}

.clubhouse-primary-image img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center 55%;
}

.clubhouse-primary-image figcaption {
  display: grid;
  gap: 4px;
  padding: 19px 21px 22px;
}

.clubhouse-primary-image figcaption strong {
  font-family: var(--serif);
  font-size: 1.3rem;
}

.clubhouse-primary-image figcaption span {
  color: var(--muted);
  font-size: .9rem;
}

.amenities-summary h3 {
  font-size: clamp(1.75rem, 3vw, 2.7rem);
  font-weight: 500;
}

.amenities-summary > p {
  color: var(--muted);
}

.amenities-secondary-image {
  margin-top: clamp(28px, 5vw, 54px);
}

.amenities-secondary-image img {
  aspect-ratio: 16 / 7;
  object-position: center 54%;
}

.combined-location-section {
  padding-block: clamp(72px, 8vw, 112px);
}

.planning-context-panel {
  margin-top: clamp(54px, 7vw, 84px);
  padding: clamp(34px, 5vw, 58px);
  border-radius: 20px;
  background: var(--deep-sage);
  color: #fff;
}

.planning-context-panel .section-heading {
  max-width: 980px;
  margin-bottom: 34px;
}

.planning-context-panel .section-heading h2 {
  font-size: clamp(2rem, 4vw, 3.8rem);
}

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

.compact-neighbor-grid article {
  min-height: 220px;
}

@media (max-width: 980px) {
  .vision-overview,
  .clubhouse-feature {
    grid-template-columns: 1fr;
  }

  .vision-pull-quote {
    padding-top: 24px;
    padding-left: 0;
    border-top: 1px solid rgba(255,255,255,.28);
    border-left: 0;
  }

  .compact-neighbor-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .combined-vision-section,
  .combined-amenities-section,
  .combined-location-section {
    padding-block: 58px;
  }

  .amenities-secondary-image img {
    aspect-ratio: 4 / 3;
  }
}


/* Version 11 — Town Fork Village commercial feature */
.village-commercial-feature { margin-top: clamp(44px,7vw,82px); padding-top: clamp(38px,5vw,58px); border-top: 1px solid rgba(54,65,48,.18); }
.commercial-feature-heading { display:grid; grid-template-columns:1fr .85fr; gap:clamp(28px,5vw,64px); align-items:end; margin-bottom:28px; }
.commercial-feature-heading h3 { margin-bottom:0; font-size:clamp(2rem,4vw,3.65rem); font-weight:500; }
.commercial-feature-heading>p { margin-bottom:0; color:var(--muted); }
.commercial-anchor-image,.commercial-design-grid figure { margin:0; overflow:hidden; border-radius:18px; background:#fff; box-shadow:0 16px 38px rgba(23,25,21,.14); }
.commercial-anchor-image img { width:100%; aspect-ratio:16/9; object-fit:cover; object-position:center; }
.commercial-anchor-image figcaption,.commercial-design-grid figcaption { display:grid; gap:4px; padding:18px 21px 21px; }
.commercial-anchor-image figcaption strong,.commercial-design-grid figcaption strong { font-family:var(--serif); font-size:1.2rem; }
.commercial-anchor-image figcaption span { color:var(--muted); font-size:.9rem; }
.commercial-design-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:22px; }
.commercial-design-grid img { width:100%; aspect-ratio:16/10; object-fit:cover; }
@media (max-width:850px){ .commercial-feature-heading,.commercial-design-grid{grid-template-columns:1fr;} }


/* Town Fork Carriage Homes neighborhood card background image */
.neighborhood-grid .carriage-homes-card {
  position: relative;
  isolation: isolate;
  justify-content: flex-end;
  overflow: hidden;
  border-color: rgba(255,255,255,.26);
  background:
    linear-gradient(
      180deg,
      rgba(15,18,14,.05) 0%,
      rgba(15,18,14,.18) 42%,
      rgba(15,18,14,.84) 100%
    ),
    url("assets/town-fork-carriage-homes.jpg") center 55% / cover no-repeat;
  color: #fff;
  box-shadow: 0 14px 34px rgba(23,25,21,.16);
}

.neighborhood-grid .carriage-homes-card h3 {
  color: #fff;
}

.neighborhood-grid .carriage-homes-card p {
  color: rgba(255,255,255,.84);
}

.carriage-homes-card-copy {
  position: relative;
  z-index: 1;
}

@media (max-width: 700px) {
  .neighborhood-grid .carriage-homes-card {
    min-height: 310px;
    background-position: 50% center;
  }
}


/* Version 11 — lighter Home hero image on mobile */
@media (max-width: 700px) {
  .hero-background {
    background-position: 54% 58%;
    filter: saturate(.92) contrast(.98) brightness(1.08);
  }

  .hero-overlay {
    background:
      linear-gradient(
        180deg,
        rgba(16,20,16,.28) 0%,
        rgba(16,20,16,.40) 48%,
        rgba(16,20,16,.62) 100%
      ),
      linear-gradient(
        90deg,
        rgba(16,20,16,.44) 0%,
        rgba(16,20,16,.18) 62%,
        rgba(16,20,16,.12) 100%
      );
  }
}


/* Version 11 approved Home, Planning Context, Location, and Phase 1 revisions */
.home-planning-context{padding-block:clamp(34px,5vw,62px);background:var(--warm-white)}
.home-planning-context .planning-context-panel{margin-top:0}
.combined-location-section{padding-block:clamp(56px,6vw,82px)}
.combined-location-section .location-grid{align-items:stretch}
.combined-location-section .location-card{min-height:100%}
.phase-one-plan-feature{margin-top:clamp(48px,7vw,86px);padding-top:clamp(38px,5vw,58px);border-top:1px solid rgba(54,65,48,.18)}
.phase-one-plan-heading{display:grid;grid-template-columns:1fr .82fr;gap:clamp(26px,5vw,58px);align-items:end;margin-bottom:26px}
.phase-one-plan-heading h3{margin-bottom:0;font-size:clamp(2rem,4vw,3.55rem);font-weight:500}
.phase-one-plan-heading>p{margin-bottom:0;color:var(--muted)}
.phase-one-plan-button img{aspect-ratio:16/10;object-fit:contain;background:#fff}
.phase-one-plan-actions{display:flex;justify-content:center;margin-top:22px}
.button-dark{background:var(--deep-sage);border-color:var(--deep-sage);color:#fff}
.button-dark:hover,.button-dark:focus-visible{background:var(--rust);border-color:var(--rust)}
.phase-one-dialog img{max-height:88vh;object-fit:contain;background:#fff}

@media(max-width:700px){
 .hero-background{background-image:url("assets/town-fork-entry-mobile.jpg");background-size:cover;background-position:center center;filter:saturate(.96) contrast(.98) brightness(1.08)}
 .hero-overlay{background:linear-gradient(180deg,rgba(16,20,16,.20) 0%,rgba(16,20,16,.30) 42%,rgba(16,20,16,.66) 100%),linear-gradient(90deg,rgba(16,20,16,.38) 0%,rgba(16,20,16,.14) 68%,rgba(16,20,16,.08) 100%)}
 .hero-facts .hero-fact{position:relative;isolation:isolate;min-height:138px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid rgba(255,255,255,.22);background-position:center;background-size:cover;box-shadow:0 12px 30px rgba(0,0,0,.14)}
 .hero-facts .hero-fact::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(12,16,13,.12),rgba(12,16,13,.80))}
 .hero-fact-400{background-image:url("assets/home-fact-400.jpg")}
 .hero-fact-housing{background-image:url("assets/home-fact-housing.jpg")}
 .hero-fact-connected{background-image:url("assets/home-fact-connected.jpg")}
 .home-planning-context{padding-block:28px 50px}
 .home-planning-context .planning-context-panel{padding:28px 22px}
 .phase-one-plan-heading{grid-template-columns:1fr}
 .phase-one-plan-button img{aspect-ratio:3/4}
 .phase-one-plan-actions .button{width:100%;text-align:center}
}


/* Version 11 — compact mobile Home fact boxes */
@media (max-width: 700px) {
  .hero-facts {
    gap: 10px;
  }

  .hero-facts .hero-fact {
    min-height: 92px;
    padding: 14px 16px;
  }

  .hero-facts .hero-fact strong {
    font-size: 1.45rem;
    line-height: 1;
  }

  .hero-facts .hero-fact span {
    margin-top: 4px;
    font-size: .78rem;
    line-height: 1.25;
  }
}


/* Version 12C — compact Commercial Inquiries placement and shorter Location */
.commercial-inquiries-cta {
  margin-top: clamp(28px, 4vw, 44px);
  padding: clamp(22px, 3.5vw, 34px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  border: 1px solid rgba(54, 65, 48, .16);
  border-radius: 16px;
  background: #f3f0e8;
}

.commercial-inquiries-cta h3 {
  margin-bottom: 8px;
  font-size: clamp(1.55rem, 2.6vw, 2.25rem);
  font-weight: 500;
}

.commercial-inquiries-cta p:last-child {
  margin-bottom: 0;
  color: var(--muted);
}

.location-grid-single {
  display: block;
  max-width: 860px;
}

.combined-location-section {
  padding-block: clamp(46px, 5vw, 70px);
}

@media (max-width: 760px) {
  .commercial-inquiries-cta {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .commercial-inquiries-cta .button {
    width: 100%;
    text-align: center;
  }
}


/* Version 13 — final publication refinements */

.compact-vision-heading {
  margin-bottom: 26px;
}

.compact-vision-overview {
  display: block;
  padding: clamp(24px, 3.5vw, 38px);
}

.compact-vision-overview .vision-pull-quote {
  max-width: 980px;
  margin: 0;
  padding-left: 0;
  border-left: 0;
  text-align: center;
}

.button-outline-dark {
  background: transparent;
  border-color: var(--deep-sage);
  color: var(--deep-sage);
}

.button-outline-dark:hover,
.button-outline-dark:focus-visible {
  background: var(--deep-sage);
  color: #fff;
}

@media (max-width: 700px) {
  /* Planning in Context: retain prominence while reducing vertical scroll. */
  .home-planning-context {
    padding-block: 22px 38px;
  }

  .home-planning-context .planning-context-panel {
    padding: 24px 18px;
  }

  .home-planning-context .section-heading {
    margin-bottom: 20px;
  }

  .home-planning-context .section-heading h2 {
    font-size: clamp(1.8rem, 9vw, 2.65rem);
  }

  .home-planning-context .compact-neighbor-grid {
    gap: 10px;
  }

  .home-planning-context .compact-neighbor-grid article {
    min-height: 0;
    padding: 18px;
  }

  .home-planning-context .compact-neighbor-grid h3 {
    margin-bottom: 7px;
    font-size: 1.15rem;
  }

  .home-planning-context .compact-neighbor-grid p {
    margin-bottom: 0;
    font-size: .9rem;
    line-height: 1.45;
  }

  /* Vision: tighter opening and card spacing. */
  .combined-vision-section {
    padding-block: 50px;
  }

  .compact-vision-heading {
    margin-bottom: 18px;
  }

  .compact-vision-overview {
    padding: 22px 18px;
  }

  .compact-vision-overview .vision-pull-quote {
    padding: 0;
    border: 0;
    font-size: 1.35rem;
  }

  .compact-feature-grid {
    gap: 12px;
  }

  .compact-feature-grid .feature-card {
    min-height: 0;
    padding: 21px;
  }

  .compact-feature-grid .feature-number {
    margin-bottom: 14px;
  }

  .compact-attainability-callout {
    padding: 22px 18px;
  }

  /* Amenities: compact two-column mobile list instead of many wrapping pills. */
  .amenity-cloud {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .amenity-cloud span {
    width: 100%;
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 9px 10px;
    border-radius: 8px;
    font-size: .78rem;
    line-height: 1.2;
  }

  /* Phase 1 plan: shorter preview and compact action row. */
  .phase-one-plan-feature {
    margin-top: 42px;
    padding-top: 32px;
  }

  .phase-one-plan-heading {
    gap: 12px;
    margin-bottom: 18px;
  }

  .phase-one-plan-heading h3 {
    font-size: 1.95rem;
  }

  .phase-one-plan-heading > p {
    font-size: .92rem;
  }

  .phase-one-plan-button {
    max-height: 380px;
    overflow: hidden;
  }

  .phase-one-plan-button img {
    height: 380px;
    aspect-ratio: auto;
    object-fit: cover;
    object-position: center 22%;
  }

  .phase-one-plan-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 14px;
  }

  .phase-one-plan-actions .button {
    width: 100%;
    text-align: center;
  }

  /* Town Fork Village commercial content: reduce excess vertical spacing. */
  .village-commercial-feature {
    margin-top: 38px;
    padding-top: 30px;
  }

  .commercial-feature-heading {
    gap: 12px;
    margin-bottom: 18px;
  }

  .commercial-anchor-image figcaption,
  .commercial-design-grid figcaption {
    padding: 13px 15px 15px;
  }

  .commercial-design-grid {
    gap: 14px;
    margin-top: 14px;
  }

  .commercial-inquiries-cta {
    margin-top: 20px;
  }

  /* Location: deliberately concise with reduced white space. */
  .combined-location-section {
    padding-block: 38px;
  }

  .combined-location-section h2 {
    margin-bottom: 14px;
  }

  .combined-location-section p:last-child {
    margin-bottom: 0;
  }
}


/* Version 13 — tighter mobile Home fact boxes */
@media (max-width: 700px) {
  .hero-facts {
    gap: 8px;
  }

  .hero-facts .hero-fact {
    min-height: 0;
    height: 74px;
    padding: 10px 14px;
    justify-content: flex-end;
  }

  .hero-facts .hero-fact strong {
    margin: 0;
  }

  .hero-facts .hero-fact span {
    margin-top: 3px;
  }
}


/* Version 13 — updated master-plan rendering */
.master-plan-button img {
  aspect-ratio: 4 / 3;
  object-fit: contain;
  background: #fff;
}