/* Genesis Properties — section ports from the design file.
   Content-only changes; nothing here touches a hook the back end uses. */

/* Approach now runs four pillars, not three. */
.approach-grid--four {
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(22px, 2.6vw, 40px);
}

@media (max-width: 1080px) {
  .approach-grid--four { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 620px) {
  .approach-grid--four { grid-template-columns: 1fr; }
}

/* Leasing gets a call to action under each column. */
.leasing-cta {
  margin-top: 22px;
}

.leasing-col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* ── nav logo ───────────────────────────────────────────────────────────────
   .nav-inner is a flex row. Adding News to the links made that row wide enough
   to squeeze the logo to zero width on narrower desktops — it was still in the
   markup, just collapsed. It never shrinks again. */

.nav-logo {
  flex: none;
}

@media (max-width: 1180px) {
  .nav-links { gap: 16px; }
  .nav-links a { font-size: 11px; letter-spacing: .13em; }
}

@media (max-width: 1040px) {
  .nav-logo { width: 176px; }
  .nav-links { gap: 13px; }
  .nav-links a { font-size: 10.5px; letter-spacing: .11em; }
}

/* One column in the hero now that the aside is gone. */
.hero-grid {
  grid-template-columns: 1fr;
}

/* Portfolio total row hidden. The element stays in the markup so the script that
   writes "Portfolio total 1,597,654" into it still has its target — removing it
   would leave that script writing to nothing. */

#portfolio-total {
  display: none;
}