/* Hero journey progressive enhancement: quiet interaction, not a required sequence. */
.home-journey .journey-interaction-hint{margin:-12px 0 18px;font-size:.86rem;line-height:1.5;color:#F2F6EF}
.home-journey .journey-trigger{appearance:none;-webkit-appearance:none;padding:0;font:inherit;cursor:pointer;touch-action:manipulation;transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,border-color .18s ease}
@media (hover:hover) and (pointer:fine){.home-journey .journey-trigger:hover{transform:translateY(-2px) scale(1.06);box-shadow:0 0 0 4px rgba(247,211,76,.20),0 12px 24px rgba(0,0,0,.20)}}
.home-journey .journey-trigger:focus-visible{outline:3px solid #F7D34C;outline-offset:5px;box-shadow:0 0 0 6px rgba(255,253,246,.22)}
.home-journey .journey-trigger.is-selected{border-color:#9F7019;background:#FFE8A2;color:#214C3A;box-shadow:0 0 0 4px rgba(247,211,76,.24),0 8px 20px rgba(0,0,0,.12)}
.home-journey .journey-detail[hidden]{display:none!important}
.home-journey .journey-detail:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr) auto;align-items:center;gap:14px 22px;margin:20px 0 0;padding:18px 20px;background:#FFFDF6;border:1px solid #C7D7C9;border-left:4px solid #F7D34C;border-radius:13px;color:#214C3A;box-shadow:0 8px 22px rgba(0,0,0,.10)}
.home-journey .journey-detail-summary{min-width:0}
.home-journey .journey-detail-eyebrow{margin:0 0 4px;color:#496654;font-size:.72rem;font-weight:750;letter-spacing:.055em;text-transform:uppercase}
.home-journey .journey-detail h3{margin:0;color:#214C3A;font-size:1.13rem;line-height:1.3}
.home-journey .journey-detail-example{margin:0;max-width:none;color:#284A3C;font-size:.96rem;line-height:1.56}
.home-journey .journey-detail-link{display:inline-block;padding:8px 4px;color:#214C3A;font-size:.90rem;font-weight:700;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.home-journey .journey-detail-link:hover{text-decoration-thickness:2px}
.home-journey .journey-detail-link:focus-visible{outline:3px solid #A06906;outline-offset:3px;border-radius:4px}
@media(max-width:900px){.home-journey .journey-detail:not([hidden]){grid-template-columns:minmax(0,1fr);gap:9px}.home-journey .journey-detail-link{justify-self:start;white-space:normal}}
@media(max-width:520px){.home-journey .journey-interaction-hint{margin:0 0 16px}.home-journey .journey-detail:not([hidden]){padding:16px 17px;margin-top:10px}}
@media(prefers-reduced-motion:reduce){.home-journey .journey-trigger{transition:none!important}.home-journey .journey-trigger:hover{transform:none!important}}
@media(forced-colors:active){.home-journey .journey-trigger.is-selected{outline:3px solid Highlight;outline-offset:2px}.home-journey .journey-detail:not([hidden]){border:2px solid CanvasText}.home-journey .journey-detail-link{color:LinkText}}
@media(max-width:520px){.home-journey .journey-step > .journey-detail:not([hidden]){grid-column:1/-1;grid-row:3;min-width:0;width:100%;margin:12px 0 2px;text-align:left}}
@media(max-width:520px){.home-journey .journey-step .journey-detail p,.home-journey .journey-step .journey-detail h3{grid-column:auto;grid-row:auto}}

/* Hero mobile expanded-example contrast fix, October 15, 2026.
   Existing homepage prose is light on forest green; on narrow phones the
   example panel sits inside a journey item and needs dark text on ivory. */
@media (max-width: 520px) {
  .home-journey .journey-step .journey-detail .journey-detail-example { color: #284A3C; }
  .home-journey .journey-step .journey-detail .journey-detail-eyebrow { color: #496654; }
  .home-journey .journey-step .journey-detail h3 { color: #214C3A; }
}

/* Hero homepage: keep example under heading, topic link on right.
   Layout-only change approved October 16, 2026. No text or identity changes. */
@media (min-width: 901px) {
  .home-journey .journey-detail:not([hidden]) {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-items: start;
    column-gap: 28px;
    row-gap: 7px;
  }
  .home-journey .journey-detail-summary { grid-column: 1; grid-row: 1; }
  .home-journey .journey-detail-example { grid-column: 1; grid-row: 2; text-align: left; }
  .home-journey .journey-detail-link {
    grid-column: 2;
    grid-row: 1 / span 2;
    justify-self: end;
    align-self: center;
  }
}

/* Visible focus for the keyboard-activated example heading. */
.home-journey .journey-detail h3:focus{outline:3px solid #A06906;outline-offset:3px;border-radius:4px}

/* Put explanatory text beneath its topic, not in an isolated middle column. */
@media (min-width:901px){
.home-journey .journey-detail:not([hidden]){grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:start;row-gap:7px}
.home-journey .journey-detail-summary{grid-column:1;grid-row:1}
.home-journey .journey-detail-example{grid-column:1;grid-row:2;max-width:68ch}
.home-journey .journey-detail-link{grid-column:2;grid-row:1 / span 2;align-self:center;justify-self:end}
}


/* HERO mobile accessibility refinement — 2026-10-16.
   Preserve existing circle art, color palette, and interaction design.
   The detailed panel moves inside an item only in the one-column mobile layout. */
@media (max-width: 780px) {
  .home-journey .journey-interaction-hint {
    font-size: .95rem;
    line-height: 1.55;
  }
  .home-journey .journey-step > p {
    font-size: .94rem;
    line-height: 1.55;
  }
  .home-journey .journey-detail-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 10px 4px;
    white-space: normal;
  }
}
@media (max-width: 480px) {
  .home-journey .journey-step > p {
    font-size: .96rem;
  }
  .home-journey .journey-step > .journey-detail:not([hidden]) {
    grid-column: 1 / -1;
    grid-row: 3;
  }
}
