/* Homepage-only styles. Loaded after site.css, which carries the shared
   tokens and components. Keep this file small: anything reusable belongs
   in site.css so every page stays on the same system. */

[data-page="home"] .logo-lockup {
  margin-bottom: 0;
}

/* The Problems/solutions field-row is a lifted panel — no rule under the header. */
[data-page="home"] header {
  margin-bottom: 0;
  border-bottom: none;
  padding-bottom: 0;
}

@media (max-width: 719px) {
  /* Journey frame top stroke sits on the same band as the wordmark on narrow screens. */
  [data-page="home"] .journey-border {
    clip-path: inset(2px 0 0 0);
  }
}

[data-page="home"] header + .lead {
  margin-top: 1.35rem;
  margin-bottom: 2rem;
}

/* Reading measure. The panel runs to 848px, so prose is capped well short of
   it — line length is set by reading comfort, not by the container. The
   numbered steps need the cap too: full width they run to 105 characters. */
[data-page="home"] .lead,
[data-page="home"] .muted,
[data-page="home"] .rules {
  max-width: 34em;
}

#home-news {
  position: relative;
  padding-top: 1.35rem;
}

#home-news::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 1px;
  background: var(--split-rule-h);
}

#home-news-latest {
  margin-top: 0.85rem;
}

#home-news-latest .project-grid {
  margin-top: 0;
}

.home-news__actions {
  margin-top: 0.85rem;
}

/* Match homepage field-row photos: full track, same inset as the text panel,
   image centred so slack does not pile up against the copy. */
#home-news-latest .home-news-card .project-hero.field-row__photo {
  justify-self: stretch;
  width: 100%;
  min-width: 0;
  overflow: visible;
  box-shadow: var(--split-panel-shadow);
}

.project-card.home-news-card:hover .project-hero.field-row__photo,
.project-card.home-news-card a:focus-visible .project-hero.field-row__photo {
  box-shadow: var(--split-panel-shadow), 0 2px 0 rgba(47, 93, 74, 0.12);
}
