/* Customer-first offer and a single, persistent final panel. */
.hero__scope { max-width: 48ch; margin-top: .7rem; color: #d4e0e9; font-size: 1rem; line-height: 1.5; }
.hero__prices { display: grid; gap: .35rem; margin-top: 1rem; color: #b9c9d7; font-size: .76rem; line-height: 1.45; }
.hero__prices strong, .hero-demo__final-prices strong { color: #f0c967; }
.hero__demo-entry { display: inline-flex; gap: .55rem; align-items: center; min-height: 44px; margin-top: .85rem; color: #c4d3df; font-size: .83rem; text-decoration: underline; text-decoration-color: rgba(196,211,223,.55); text-underline-offset: .25em; }
.hero__demo-entry:hover { color: #fff; text-decoration-color: #fff; }
.hero__actions .button { max-width: 100%; text-align: center; }
.hero-demo__final-cta[hidden] { display: none; }
.hero-demo__final-cta { position: absolute; z-index: 26; top: 16%; left: 4%; display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(150px, .8fr); grid-template-areas: "message proof" "actions proof" "prices proof" "reassurance replay"; gap: .55rem 1.2rem; width: 92%; padding: clamp(.9rem, 2vw, 1.3rem); border: 1px solid rgba(107,170,202,.52); border-radius: 13px; color: #e8f1f7; background: rgba(4,14,27,.95); box-shadow: 0 24px 58px rgba(0,5,14,.38); -webkit-backdrop-filter: blur(13px); backdrop-filter: blur(13px); }
.hero-demo__final-message { grid-area: message; }
.hero-demo__final-cta h2 { max-width: 22ch; margin: 0; color: #f4f8fa; font-size: clamp(1.35rem, 2.05vw, 1.85rem); line-height: 1.16; }
.hero-demo__final-message p { margin-top: .55rem; color: #d2e0e9; font-size: .84rem; line-height: 1.45; }
.hero-demo__proof-points { grid-area: proof; align-self: start; display: grid; gap: .42rem; margin: 0; padding: 0; list-style: none; }
.hero-demo__proof-points li { position: relative; margin: 0; padding: .58rem .65rem .58rem 1.25rem; border: 1px solid rgba(107,136,173,.28); border-radius: 8px; color: #dce8ef; background: rgba(32,56,78,.26); font-size: .74rem; line-height: 1.3; }
.hero-demo__proof-points li::before { position: absolute; top: 50%; left: .62rem; width: 5px; height: 5px; border-radius: 50%; background: #d4a037; content: ""; transform: translateY(-50%); }
.hero-demo__final-actions { grid-area: actions; display: grid; gap: .48rem; }
.hero-demo__final-actions .button { width: 100%; min-height: 44px; padding: .6rem .75rem; font-size: .78rem; line-height: 1.25; text-align: center; }
.hero-demo__final-prices { grid-area: prices; display: grid; gap: .18rem; padding-top: .45rem; border-top: 1px solid rgba(107,136,173,.3); color: #d7e5ed; font-size: .69rem; line-height: 1.35; }
.hero-demo__final-reassurance { grid-area: reassurance; align-self: center; color: #b1c4d4; font-size: .68rem; line-height: 1.35; }
.hero-demo__final-replay { grid-area: replay; justify-self: end; min-width: 72px; min-height: 44px; padding: .4rem; border: 0; color: #c0d5e3; background: transparent; font: 600 .72rem/1.2 var(--font-mono); text-decoration: underline; text-decoration-color: rgba(192,213,227,.55); text-underline-offset: .24em; cursor: pointer; }
.hero-demo__final-replay:hover { color: #fff; text-decoration-color: #fff; }
.hero-demo__skip { min-height: 44px; padding: .45rem .55rem; border: 0; color: #b9c9d7; background: transparent; font: 500 .62rem/1.2 var(--font-mono); text-decoration: underline; text-decoration-color: rgba(185,201,215,.45); text-underline-offset: .2em; cursor: pointer; }
.hero-demo__skip:hover { color: #fff; text-decoration-color: #fff; }
.hero-machine-demo[data-phase="6"] .hero-demo__skip { visibility: hidden; }
.hero-machine-demo[data-phase="6"] .hero-demo__control[data-demo-replay], .hero-machine-demo[data-phase="6"] .hero-demo__control[data-demo-toggle] { display: none; }
.hero-machine-demo[data-phase="6"] .hero-demo__caption { visibility: hidden; }
.hero-machine-demo[data-phase="6"] .hero-demo__machine { opacity: .23; }
.hero-machine-demo[data-phase="6"] *, .hero-machine-demo[data-phase="6"] *::before, .hero-machine-demo[data-phase="6"] *::after { animation-play-state: paused !important; }
.hero-machine-demo.is-interaction-paused *, .hero-machine-demo.is-interaction-paused *::before, .hero-machine-demo.is-interaction-paused *::after { animation-play-state: paused !important; }
/* Evidence stays legible in the compact cards, including after a manual stage change. */
.hero-demo__analysis-stack .analysis-card > span { font-size: .62rem; }
.hero-demo__analysis-stack .analysis-card__value { font-size: .82rem; }
.hero-demo__analysis-stack .analysis-card__detail { font-size: .65rem; line-height: 1.4; }
.hero-demo__analysis-stack .analysis-card--agreement > div { font-size: .59rem; }
@media (min-width: 821px) {
  .hero-machine-demo[data-phase="5"] .hero-demo__analysis-stack { top: 17%; }
}
@media (max-width: 820px) {
  .hero__copy > .hero__demo-column .hero-demo__viewport { min-height: clamp(560px, 72svh, 620px); }
  .hero__copy > .hero__demo-column .hero-demo__header { min-height: 72px; }
  .hero__copy > .hero__demo-column .hero-demo__phase-title strong { max-width: none; overflow: visible; white-space: normal; text-overflow: clip; line-height: 1.2; }
  .hero__copy > .hero__demo-column .hero-demo__chapter-copy strong { overflow: visible; white-space: normal; text-overflow: clip; }
  .hero__copy > .hero__demo-column .hero-demo__control { min-height: 44px; }
  .hero__copy > .hero__demo-column .hero-demo__control { display: inline-flex; min-width: 48px; align-items: center; justify-content: center; padding-inline: .7rem; font-size: .62rem; }
  .hero__copy > .hero__demo-column .hero-demo__control--minimise { min-width: 78px; }
  .hero__copy > .hero__demo-column .hero-demo__steps button { width: 38px; height: 38px; }
  .hero__copy > .hero__demo-column .hero-demo__steps button { font-size: .68rem; }
  .hero__copy > .hero__demo-column .hero-demo__caption p { font-size: .75rem; }
  .hero__copy > .hero__demo-column .hero-demo__caption span { font-size: .62rem; }
  .hero__copy > .hero__demo-column .hero-demo__footer span { font-size: .58rem; }
  .hero__copy > .hero__demo-column .hero-demo__footer { grid-template-columns: minmax(0,1fr) auto; gap: .3rem; padding-block: .25rem; }
  .hero__copy > .hero__demo-column .hero-demo__footer span { padding-inline: .3rem; text-align: left; }
  .hero__copy > .hero__demo-column .hero-demo__footer span:nth-child(2) { display: none; }
  .hero-machine-demo[data-phase="6"] .hero-demo__final-cta { top: 2%; left: 4%; width: 92%; grid-template-columns: minmax(0,1fr); grid-template-areas: "message" "proof" "actions" "prices" "reassurance" "replay"; gap: .45rem; padding: .85rem; }
  .hero-demo__final-cta h2 { max-width: none; font-size: 1.38rem; }
  .hero-demo__final-message p { margin-top: .35rem; font-size: .82rem; }
  .hero-demo__proof-points { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .32rem; }
  .hero-demo__proof-points li { display: flex; min-height: 48px; align-items: center; padding: .48rem .45rem .48rem 1rem; font-size: .66rem; }
  .hero-demo__proof-points li::before { left: .48rem; width: 4px; height: 4px; }
  .hero-demo__final-replay { justify-self: start; }
  .hero-demo__final-prices { font-size: .75rem; }
  .hero-demo__final-reassurance { font-size: .72rem; }
}
@media (max-width: 720px) {
  .hero-machine-demo[data-phase="5"] .hero-demo__caption { bottom: 82px; }
}
@media (min-width: 721px) and (max-width: 820px) {
  .hero-machine-demo[data-phase="5"] .hero-demo__caption { right: 42%; }
}
@media (max-width: 430px) {
  .hero__copy > .hero__demo-column .hero-demo__viewport { min-height: clamp(570px, 74svh, 620px); }
  .hero__copy > .hero__demo-column .hero-demo__header { grid-template-columns: 1fr; gap: .35rem; min-height: 106px; }
  .hero__copy > .hero__demo-column .hero-demo__controls { justify-self: end; }
  .hero-machine-demo[data-phase="6"] .hero-demo__final-cta { padding: .72rem; gap: .35rem; }
  .hero-demo__final-cta h2 { font-size: 1.24rem; }
  .hero-demo__final-prices { font-size: .72rem; }
  .hero-demo__final-actions .button { font-size: .76rem; }
  .hero-machine-demo[data-phase="5"] .hero-demo__caption { bottom: 92px; }
  .hero-demo__skip span { display: none; }
}
@media (max-width: 375px) {
  .hero__copy > .hero__demo-column .hero-demo__viewport { min-height: 610px; }
  .hero-demo__proof-points { grid-template-columns: 1fr; gap: .26rem; }
  .hero-demo__proof-points li { min-height: 34px; }
  .hero__copy > .hero__demo-column .hero-machine-demo[data-phase="5"] .hero-demo__analysis-stack { top: 19%; right: 4%; left: 4%; grid-template-columns: 1fr; gap: .38rem; }
  .hero-machine-demo[data-phase="5"] .analysis-card--trend { grid-row: auto; }
  .hero-machine-demo[data-phase="5"] .analysis-card { padding: .5rem .62rem; }
  .hero-machine-demo[data-phase="5"] .analysis-card--trend svg,
  .hero-machine-demo[data-phase="5"] .analysis-card--agreement > div { display: none; }
}
