/* Production refinements from the September design review. */

/* A clear closing invitation, with a tonal surface in dark mode. */
.members .final .btn{font-size:16px;padding:18px 28px;min-height:58px}
html[data-theme=dark] .members .final{
  background:color-mix(in srgb,var(--bg) 92%,var(--text));
  color:var(--text);
}
html[data-theme=dark] .members .final .btn{
  background:var(--text);border-color:var(--text);color:var(--bg);
}
html[data-theme=dark] .members .final .btn:hover{
  background:var(--muted);border-color:var(--muted);
}

/* Hidden phrases reserve space; their visible text still needs centering. */
@media(min-width:761px){
  .value .swapline{text-align:center}
  .networks .pilot-block{text-align:center}
  .networks .pilot-intro{margin-inline:auto}
  .networks .pilot-benefits{margin-inline:auto;text-align:left}
  .networks .pilot-action{align-items:center;text-align:center}
}

/* Keep the narrow desktop cards, with the same reading scale as page copy. */
.outcome-explorer .classic-card-label{font-size:12px}
.outcome-explorer .classic-insight h3{font-size:22px;line-height:1.35}
.outcome-explorer .classic-insight p{font-size:16px;line-height:1.65}
.outcome-explorer .classic-metric small{font-size:14px}
.outcome-explorer .classic-insight p,
.outcome-explorer .classic-metric small{transition:opacity .25s}

/* Neighbor cards remain navigable previews without competing paragraphs. */
.outcome-explorer .classic-stage{
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
}
.outcome-explorer[data-classic-ready] .classic-card:not(.is-current) .classic-insight p,
.outcome-explorer[data-classic-ready] .classic-card:not(.is-current) .classic-metric small{opacity:0}

@media(max-width:600px){
  .outcome-explorer .classic-stage{
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  }
  .outcome-explorer .classic-track{width:88%}
  .outcome-explorer .classic-card{padding:24px 22px}
  .outcome-explorer .classic-insight h3{font-size:21px}
  .outcome-explorer .classic-card .classic-insight p{font-size:15px}
  .outcome-explorer .classic-card-label{font-size:12px}
}

@media(prefers-reduced-motion:reduce){
  .outcome-explorer .classic-insight p,
  .outcome-explorer .classic-metric small{transition:none}
}
