/* Consumer reading pages: compact hooks, useful diagrams, comfortable text. */
.bike-event-facts { margin-block: 1.25rem; border-top: 1px solid var(--reading-line); }
.bike-event-facts > div { display: grid; grid-template-columns: minmax(110px,.6fr) minmax(0,2fr); gap: .4rem 1rem; padding: .65rem .5rem; border-bottom: 1px solid var(--reading-line); }
.bike-event-facts :is(dt,dd) { margin: 0; font: .95rem/1.6 system-ui,sans-serif; }
.bike-event-facts dt { font-weight: 650; color: var(--ink); }
.cost-example { margin: 1.25rem 0; border-block: 1px solid var(--reading-line,#d5cec1); }
.cost-example > div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1rem; padding: .6rem .5rem; border-bottom: 1px solid var(--reading-line,#d5cec1); }
.cost-example > div:last-child { border-bottom: 0; }
.cost-example dt,.cost-example dd { margin: 0; font: .95rem/1.6 system-ui,sans-serif; }
.cost-example dd { font-variant-numeric: tabular-nums; white-space: nowrap; }
.cost-example .cost-total { background: var(--reading-surface,#f0eee6); font-weight: 700; }
.cost-example .cost-total :is(dt,dd) { font-weight: 700; color: var(--ink); }
.fortune-return-link { position: sticky; top: .5rem; z-index: 5; display: flex; align-items: center; width: 100%; min-height: 44px; margin-bottom: .75rem; padding: .4rem .75rem; border: 1px solid var(--reading-line,#d5cec1); border-radius: 6px; background: var(--paper); color: var(--teal-dark); font: 650 .95rem/1.5 system-ui,sans-serif; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content h2[id] { scroll-margin-top: 5rem; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .editorial-top { padding-block: 2rem 1.5rem; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-header h1 { font-size: clamp(2rem, 3.1vw, 2.65rem); max-width: 27ch; }
.consumer-illustration { margin: 0; min-width: 0; }
.consumer-illustration img { display: block; width: 100%; height: auto; max-height: 260px; object-fit: contain; border-radius: 12px; }
.consumer-illustration figcaption { margin-top: .65rem; color: var(--body); font: .8rem/1.5 system-ui, sans-serif; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content { font-family: system-ui, sans-serif; font-size: 1.05rem; line-height: 1.8; overflow-wrap: anywhere; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content h2 { font-family: Georgia, serif; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content > p:first-child { font-size: 1.13rem; color: var(--ink); }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content a { text-underline-offset: .18em; text-decoration-thickness: 1px; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content a:focus-visible, .consumer-text-link:focus-visible { outline: 3px solid var(--teal-dark); outline-offset: 3px; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content h2[id] + p { padding: 0; border: 0; background: none; font-size: inherit; }
.consumer-comparison, .transaction-roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-block: 1.5rem; }
.consumer-comparison { grid-template-columns: minmax(0, 1fr); }
.consumer-comparison > div, .transaction-roles > div { padding: 1rem 1.1rem; border: 1px solid #d5cec1; border-radius: 10px; background: #fffcf5; }
.consumer-comparison dt, .transaction-roles dt { font: 700 1rem/1.5 system-ui, sans-serif; color: var(--ink); }
.consumer-comparison dd, .transaction-roles dd { margin: .35rem 0 0; font: .95rem/1.7 system-ui, sans-serif; color: var(--body); }
.investment-types dd p { margin: .4rem 0 0; }
.buyer-roadmap { margin: 1.5rem 0; padding: 0; list-style: none; counter-reset: buyer-step; }
.buyer-roadmap li { position: relative; margin: 0 0 0 1rem; border-left: 2px solid #a3bbb0; padding: 0 0 1.4rem 1.7rem; counter-increment: buyer-step; }
.buyer-roadmap li:last-child { border-color: transparent; padding-bottom: 0; }
.buyer-roadmap li::before { content: counter(buyer-step); position: absolute; left: -.95rem; top: 0; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: #52786c; color: #fff; text-align: center; font: 700 .85rem/1.8rem system-ui, sans-serif; }
.buyer-roadmap strong, .buyer-roadmap span { display: block; }
.buyer-roadmap strong { font: 700 1rem/1.5 system-ui, sans-serif; }
.buyer-roadmap span { margin-top: .35rem; font: .95rem/1.7 system-ui, sans-serif; }
.consumer-next-read { margin-block: 1.7rem; padding: 1rem 1.2rem; border-left: 3px solid #52786c; background: #eaf0e9; border-radius: 0 8px 8px 0; }
.consumer-next-read p { margin: 0; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .consumer-disclaimer { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid #d5cec1; font-size: .82rem; line-height: 1.65; color: var(--body); }
.consumer-text-link { display: inline-flex; align-items: center; min-height: 44px; padding-block: .5rem; color: var(--ink); font: 600 .95rem/1.5 system-ui, sans-serif; text-underline-offset: .2em; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .field-author-card > a { border-radius: 5px; }
.consumer-guide-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; margin-top: 1.75rem; }
.consumer-guide-card { display: flex; flex-direction: column; overflow: hidden; padding: 0 1.1rem 1.1rem; border: 1px solid #d5cec1; border-radius: 12px; background: #fffcf5; color: var(--ink); text-decoration: none; }
:is(.hwf-consumer-page,.hwf-bike-guide-page) .consumer-guide-card img { width: calc(100% + 2.2rem); max-width: none; height: auto; margin: 0 -1.1rem 1rem; border: 0; }
.consumer-guide-card strong { font: 700 1.1rem/1.4 system-ui, sans-serif; }
.consumer-guide-card span { margin-top: .7rem; color: var(--body); font: .95rem/1.65 system-ui, sans-serif; }
.consumer-guide-card em { padding-top: 1rem; margin-top: auto; font: 600 .95rem/1.5 system-ui, sans-serif; text-decoration: underline; }
.consumer-guide-card:hover strong { text-decoration: underline; }
.hwf-consumer-hub .field-article-layout { max-width: 1120px; }
.hwf-consumer-hub .field-article-content > p:first-child { max-width: 65ch; }
/* Topic-led library: short reading paths rather than an undifferentiated grid. */
.consumer-topic-nav { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 2rem; }
.consumer-topic-nav a { min-height: 44px; display: inline-flex; align-items: center; padding: .45rem .85rem; border: 1px solid var(--reading-line); border-radius: 7px; color: var(--ink); font: 600 .95rem/1.4 system-ui,sans-serif; text-decoration: none; }
.consumer-topic-nav a:hover { background: var(--reading-surface); }
.consumer-topic { display: grid; grid-template-columns: minmax(150px,.55fr) minmax(0,2fr); gap: 1.5rem; padding-block: 1.75rem; border-top: 1px solid var(--reading-line); scroll-margin-top: 1rem; }
.hwf-consumer-hub .field-article-content .consumer-topic h2[id] { margin: .2rem 0 .65rem; font: 700 1.5rem/1.2 Georgia,serif; }
.consumer-topic-intro p { margin: 0; color: var(--body); font: .95rem/1.6 system-ui,sans-serif; }
.hwf-consumer-hub .consumer-topic .consumer-guide-cards { grid-template-columns: repeat(2,minmax(0,1fr)); margin: 0; gap: 1rem; }
.hwf-consumer-hub .consumer-topic .consumer-guide-card { padding: 1rem; }
.hwf-consumer-hub .consumer-topic .consumer-guide-card img { height: 125px; margin: 0 0 .8rem; object-fit: contain; }
.hwf-consumer-hub .consumer-topic .consumer-card-copy { display: flex; flex: 1; flex-direction: column; gap: .5rem; margin: 0; font: inherit; }
.consumer-card-copy .consumer-card-step { color: var(--teal-dark); font: 700 .75rem/1.5 system-ui,sans-serif; }
.consumer-card-copy strong { color: var(--ink); min-height: 2.8em; }
.hwf-consumer-hub .consumer-card-copy > span { margin: 0; font: .95rem/1.55 system-ui,sans-serif; }
.consumer-card-copy em { padding-top: .4rem; }
.hwf-consumer-hub .consumer-card-copy em span { display: inline; margin: 0; color: inherit; font: inherit; }
.hwf-consumer-hub .consumer-topic .is-single { grid-template-columns: minmax(0,1fr); }
.hwf-consumer-hub .is-single .consumer-guide-card { display: grid; grid-template-columns: 145px minmax(0,1fr); align-items: center; gap: 1.25rem; }
.hwf-consumer-hub .is-single .consumer-guide-card img { margin: 0; }
.is-single .consumer-card-copy strong { min-height: 0; }
.consumer-topic-nav a:focus-visible, .consumer-guide-card:focus-visible { outline: 3px solid var(--teal-dark); outline-offset: 4px; }
@media (max-width: 760px) {
  .bike-event-facts > div { grid-template-columns: minmax(0,1fr); }
  :is(.hwf-consumer-page,.hwf-bike-guide-page) .editorial-top { padding-block: 1.25rem; }
  :is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-header h1 { font-size: clamp(1.7rem, 7.3vw, 2.125rem); line-height: 1.16; }
  .consumer-illustration img { max-height: 165px; }
  .consumer-illustration figcaption { font-size: .75rem; }
  :is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content, :is(.hwf-consumer-page,.hwf-bike-guide-page) .field-article-content > p:first-child { font-size: 1rem; line-height: 1.75; }
  .transaction-roles, .consumer-guide-cards { grid-template-columns: minmax(0, 1fr); }
  .consumer-guide-card img { max-height: 170px; object-fit: cover; }
  .consumer-next-read { padding: .85rem 1rem; }
  .consumer-topic { grid-template-columns: minmax(0,1fr); gap: 1rem; padding-block: 1.5rem; }
  .hwf-consumer-hub .consumer-topic .consumer-guide-cards { grid-template-columns: minmax(0,1fr); }
  .hwf-consumer-hub .is-single .consumer-guide-card { grid-template-columns: minmax(0,1fr); gap: .8rem; }
  .consumer-card-copy strong { min-height: 0; }
  .consumer-topic-nav { margin-bottom: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
  :is(.hwf-consumer-page,.hwf-bike-guide-page) *, :is(.hwf-consumer-page,.hwf-bike-guide-page) *::before, :is(.hwf-consumer-page,.hwf-bike-guide-page) *::after { scroll-behavior: auto; }
}