/* Homepage colors: navy for emphasis, blue for actions, neutral surfaces. */
#page-home {
  --home-ink: #0a2540;
  --home-panel: #13344e;
  --home-frame-inset: var(--mt-guide-offset);
  --home-accent: #315ed2;
  --home-accent-hover: #244bb1;
  --home-muted: #52677b;
  --home-paper: #fff;
  --home-canvas: var(--site-canvas, #f5f5f5);
  --home-soft: #edf2fb;
  --home-line: #dce5ee;
  --home-inverse-muted: #c5d1df;
  --home-highlight: #b5ccff;
  color: var(--home-ink);
}
@media (min-width: 681px) {
  #page-home { --home-frame-inset: var(--home-guide-inset, var(--mt-guide-offset)); }
}
#page-home.page.active::after {
  left: var(--home-frame-inset);
  right: var(--home-frame-inset);
}

/* Override the older multicolored page wash only on the homepage. */
body:has(#page-home.active),
body .page#page-home.active {
  background: var(--site-canvas, #f5f5f5) !important;
}
body:has(#page-home.active) > #bg-canvas { display: none; }
body:has(#page-home.active) > nav .logo > span:last-child { color: #315ed2 !important; }

/* The service tiles retain their photos and existing interactions. */
#page-home #homeMosaic .hm-row1 > .hm-card--sell {
  background: var(--home-accent) !important;
}
#page-home #homeMosaic #hmTilePieces {
  background: var(--home-panel) !important;
}
#page-home #homeMosaic .hm-card--pieces > .hm-scrim {
  background: none;
}
#page-home #homeMosaic .hm-card--annonces .hm-action {
  color: var(--home-ink);
  background: var(--home-paper);
}

/* One heading and icon palette for the introduction and listings. */
#page-home #homeVision h2,
#page-home #homeVision .hv-ptitle { color: var(--home-ink) !important; }
#page-home #homeVision .hv-ico {
  color: var(--home-accent);
  background: var(--home-soft);
  border-color: var(--home-line);
}
#page-home #homeVision .hv-ptext { color: var(--home-muted); }
#page-home #homeVision .hv-pillar {
  box-sizing: border-box;
  min-width: 0;
  padding: 26px 20px 24px;
  background: var(--home-paper);
  border: 1px solid #e4e7eb;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(10, 37, 64, .035);
}
@media (max-width: 680px) {
  #page-home #homeVision .hv-pillar { padding: 20px 12px; }
}
#page-home #homeVision .mt-wordmark > span:first-child { color: var(--home-ink) !important; }
#page-home #homeVision .mt-wordmark > span:last-child { color: var(--home-accent) !important; }

/* The data panel and guide use the same dark surface, on every screen size. */
@media (max-width: 680px) {
  #page-home #homeJourney .journey-preview-stop { background: transparent; }
}
#page-home #homeAnalyses .ha-entry,
#page-home #homeAnalyses .ha-mobile {
  background: var(--home-panel);
  border-color: var(--home-panel);
  color: var(--home-paper);
}
#page-home #homeAnalyses .ha-copy em,
#page-home #homeAnalyses .ha-mobile h2 em { color: var(--home-highlight); }
#page-home #homeAnalyses :is(.ha-label, .ha-topics, .ha-mobile-label, .ha-mobile p) {
  color: var(--home-inverse-muted);
}
#page-home #homeAnalyses .ha-action,
#page-home #homeAnalyses .ha-mobile-actions a {
  background: var(--home-paper);
  border-color: var(--home-paper);
  color: var(--home-panel);
}
#page-home #homeAnalyses .ha-entry:hover .ha-action,
#page-home #homeAnalyses .ha-mobile-actions a:hover {
  background: var(--home-soft);
  border-color: var(--home-soft);
}

/* Listing accents use the same blue as the primary buttons. */
#page-home #homeLatest {
  --latest-ink: var(--home-ink);
  --latest-accent: var(--home-accent);
}
#page-home #hmTrend > .tr242-shell { background: transparent !important; }
#page-home #hmTrend #trend89-title { color: #b63726 !important; }
#page-home #homeLatest :is(.lt89-eyebrow, .lt89-new) { color: var(--home-accent); }
#page-home #homeLatest .lt89-new i,
#page-home #homeLatest .lt89-eyebrow::before { background: var(--home-accent); }
#page-home #homeLatest .lt296-brand { color: var(--home-muted); }
#page-home #homeLatest :is(.lt89-open, .lt296-empty-icon) {
  background: var(--home-soft);
  border-color: var(--home-line);
  color: var(--home-accent);
}
#page-home #homeLatest .lt89-card:is(:hover, :focus-visible) .lt89-open {
  background: var(--home-accent);
  border-color: var(--home-accent);
  color: var(--home-paper);
}
#page-home #homeLatest .lt89-all {
  background: var(--home-paper);
  border-color: var(--home-line);
  color: var(--home-accent);
}
#page-home #homeLatest .lt89-all:hover { background: var(--home-soft); }
#page-home #hmTrend .tr242-open {
  background: #fff0ec;
  border-color: #f3beb2;
  color: #b63726;
}
#page-home #hmTrend .tr242-card:is(:hover, :focus-visible) .tr242-open,
#page-home #hmTrend .tr242-explore {
  background: #b63726;
  border-color: #b63726;
  color: #fff;
}
#page-home #hmTrend .tr242-explore:hover { background: #9c2e20; }

/* A navy closing band, with white illustration surfaces for clear outlines. */
#page-home #homeJourney #homeJourneyTitle,
#page-home #homeJourney .journey-preview-panel strong { color: var(--home-paper); }
#page-home #homeJourney #homeJourneyTitle em { color: var(--home-highlight); }
#page-home #homeJourney :is(.journey-entry-kicker, .journey-entry-description, .journey-preview-panel span) {
  color: var(--home-inverse-muted);
}
#page-home #homeJourney .journey-next { color: var(--home-highlight); }
#page-home #homeJourney .journey-scene {
  background: var(--home-paper);
  border-radius: 12px;
}
#page-home #homeExplore #openJourney {
  background: var(--home-paper);
  border-color: var(--home-paper);
  color: var(--home-panel);
  box-shadow: none;
}
#page-home #homeExplore #openJourney:hover {
  background: var(--home-soft);
  border-color: var(--home-soft);
}
#page-home :is(button, a, select, [role="button"]):focus-visible {
  outline-color: #84afea;
}
#page-home #homeLatest :is(button, select):focus-visible { outline-color: #84afea; }
