/* Inner pages v2: the homepage's live pieces, shared for /pages.
   Wire map · pinned Q&A · timeline · pinned live demo · plain-language lists.
   The deck and the rail reuse deck.css/deck.js and sol.css/sol.js unchanged. */

/* wire map */
.wire .stage { height: 100svh; overflow: hidden; display: grid; grid-template-columns: minmax(16rem, 30rem) 1fr; align-items: center;
  gap: 2rem; padding: 5rem var(--sc-gutter) 2rem; box-sizing: border-box; color: #fff;
  background: radial-gradient(42rem 42rem at 32% 52%, rgba(68,48,233,.18), transparent 70%), #050421; }
.wire__copy { position: relative; min-height: 18rem; }
.wire__copy > div { position: absolute; inset: 0 0 auto 0; }
.wire__copy h2 { margin: 0; font-weight: 900; font-size: clamp(2rem, 1.3rem + 2.8vw, 3.6rem); line-height: 1.05; text-wrap: balance; }
.wire__copy p { margin: 1rem 0 0; color: #CFCCE4; font-size: 1.12rem; line-height: 1.6; max-width: 34ch; }
.wire__copy .eyebrow { color: var(--brand-300); font-weight: 700; font-size: 1rem; }
.map { position: relative; width: min(100%, 44rem); aspect-ratio: 1 / 0.82; justify-self: center; }
.map > svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.map .ln { fill: none; stroke: rgba(180,169,248,.55); stroke-width: 1.6; stroke-linecap: round; }
.map .ln-bg { fill: none; stroke: rgba(255,255,255,.06); stroke-width: 1.6; }
.map .pk { fill: #fff; }
.core { position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: 9.5rem; height: 9.5rem; border-radius: 50%; color: #fff;
  display: grid; place-items: center; text-align: center; background: radial-gradient(circle at 50% 40%, #5A47F0, #2A1C9E 70%);
  box-shadow: 0 0 0 1px rgba(255,255,255,.18) inset, 0 30px 80px -20px rgba(68,48,233,.8); }
.core b { display: block; font-size: 1.05rem; }
.core small { font-size: 0.75rem; opacity: 0.8; }
.core svg { width: 22px; height: 22px; margin-bottom: 0.3rem; }
.core::after { content: ""; position: absolute; inset: -14px; border-radius: 50%; border: 1px solid rgba(180,169,248,calc(.15 + var(--glow, 0) * .5)); }
.node { position: absolute; translate: -50% -50%; display: flex; flex-direction: column; align-items: center; gap: 0.45rem; opacity: 0.32; transition: opacity 400ms ease; text-align: center; }
.node.on { opacity: 1; }
.node__chip { width: 4.6rem; height: 4.6rem; border-radius: 20px; display: grid; place-items: center; background: #fff; box-shadow: 0 20px 40px -18px rgba(0,0,0,.7); transition: box-shadow 400ms ease; }
.node.on .node__chip { box-shadow: 0 0 0 3px rgba(140,125,244,.7), 0 20px 50px -14px rgba(68,48,233,.9); }
.node__chip img { width: 70%; height: auto; max-height: 70%; object-fit: contain; }
.node__chip.txt { font-weight: 900; color: var(--ink); font-size: 0.95rem; }
.node span { font-size: 0.8rem; color: #CFCCE4; white-space: nowrap; }
.tick { position: absolute; font-size: 0.78rem; padding: 0.3rem 0.65rem; border-radius: 999px; background: rgba(14,11,51,.92); border: 1px solid rgba(180,169,248,.35);
  color: #E8E5FF; white-space: nowrap; translate: -50% -50%; opacity: 0; transition: opacity 260ms ease; pointer-events: none; }
.tick.on { opacity: 1; }

/* pinned Q&A */
.qa .stage { height: 100svh; display: grid; place-items: center; padding: 0 var(--sc-gutter); box-sizing: border-box; background: #0E0B33; color: #fff; }
.qa__item { position: absolute; inset-inline: var(--sc-gutter); top: 50%; translate: 0 -50%; max-width: 54rem; margin-inline: auto; }
.qa__item .q { margin: 0; font-weight: 900; font-size: clamp(2rem, 1.3rem + 3vw, 4.2rem); line-height: 1.05; }
.qa__item .a { margin: 1.2rem 0 0; font-size: clamp(1.1rem, 1rem + 0.45vw, 1.35rem); line-height: 1.65; color: #D2CFE6; max-width: 46ch; font-weight: 300; }
.qa__label { position: absolute; top: 5.5rem; inset-inline-start: var(--sc-gutter); font-size: 0.95rem; color: var(--brand-200); }

/* timeline */
.proc { padding-block: clamp(5rem, 12vh, 8rem); background: #050421; color: #fff; }
.proc__grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.proc h2 { margin: 0; font-weight: 900; font-size: clamp(2rem, 1.3rem + 2.8vw, 3.6rem); line-height: 1.05; }
.proc .lead { color: #A9A6C4; font-size: 1.1rem; margin: 1rem 0 0; max-width: 40ch; line-height: 1.6; }
.tl { list-style: none; margin: 0; padding: 0; border-inline-start: 2px solid rgba(140,125,244,.35); }
.tl li { position: relative; padding: 0 1.8rem 2rem; }
.tl li::before { content: attr(data-k); position: absolute; inset-inline-start: -1.05rem; top: -0.1rem; width: 2rem; height: 2rem; border-radius: 50%;
  background: var(--brand); color: #fff; display: grid; place-items: center; font: 700 1rem var(--sc-font-mono); }
.tl h3 { margin: 0; font-size: 1.3rem; font-weight: 900; }
.tl p { margin: 0.4rem 0 0; color: #CFCCE4; line-height: 1.6; }

/* pinned live demo */
.live-act .stage { height: 100svh; box-sizing: border-box; display: grid; grid-template-columns: minmax(16rem, 28rem) 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center;
  padding: 5.5rem var(--sc-gutter) 2.5rem; background: radial-gradient(50rem 30rem at 25% 50%, rgba(68,48,233,.2), transparent 65%), #0B0930; color: #fff; overflow: hidden; }
.live-act h2 { margin: 0; font-weight: 900; font-size: clamp(2rem, 1.3rem + 2.6vw, 3.4rem); line-height: 1.05; text-wrap: balance; }
.live-act .lead { margin: 1rem 0 0; color: #CFCCE4; font-size: 1.1rem; line-height: 1.6; max-width: 36ch; }
.live-act .note { display: block; margin-top: 1rem; }
.screens { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; height: min(70svh, 36rem); }
.screens .demo { height: 100%; box-shadow: 0 40px 80px -30px rgba(0,0,0,.7); }
.screens--one { grid-template-columns: 1fr; max-width: 30rem; justify-self: center; width: 100%; }
.big-count { display: flex; align-items: baseline; gap: 0.6rem; margin-top: 1.6rem; }
.big-count b { font: 700 clamp(3rem, 2rem + 3vw, 4.6rem)/1 var(--sc-font-mono); color: var(--ok); font-variant-numeric: tabular-nums; }
.big-count span { color: #CFCCE4; }
.say { list-style: none; display: grid; gap: 0.5rem; margin: 1.6rem 0 0; padding: 0; }
.say li { display: flex; gap: 0.6rem; align-items: center; color: #8C89A8; transition: color 300ms ease; }
.say li::before { content: ""; width: 0.6rem; height: 0.6rem; border-radius: 50%; background: #3A355E; transition: background-color 300ms ease, box-shadow 300ms ease; flex: none; }
.say li.on { color: #fff; }
.say li.on::before { background: var(--brand-300); box-shadow: 0 0 0 4px rgba(140,125,244,.25); }

/* plain-language list on light (the homepage "why") */
.why2 { padding-block: clamp(5rem, 12vh, 8rem); background: var(--bone); color: var(--ink); }
.why2 h2 { margin: 0 0 2.4rem; font-weight: 900; font-size: clamp(2rem, 1.3rem + 2.8vw, 3.6rem); line-height: 1.05; max-width: 22ch; text-wrap: balance; }
.why2__list { display: grid; border-top: 1px solid #DCDAE8; }
.why2__item { display: grid; grid-template-columns: 1fr 1.3fr; gap: 1.5rem; padding: 1.8rem 0; border-bottom: 1px solid #DCDAE8; align-items: baseline; }
.why2__item h3 { margin: 0; font-weight: 900; font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2.2rem); line-height: 1.15; }
.why2__item p { margin: 0; color: #4A4570; font-size: 1.08rem; line-height: 1.65; }

/* deck: cards link to their page */
.deck__card .btn { position: relative; z-index: 1; }

@media (max-width: 900px) {
  .wire .stage, .live-act .stage { grid-template-columns: 1fr; grid-template-rows: auto 1fr; padding-top: 4.6rem; gap: 0.6rem; align-items: start; }
  .wire__copy { min-height: 11.5rem; }
  .wire__copy h2, .live-act h2 { font-size: 1.7rem; }
  .wire__copy p, .live-act .lead { font-size: 0.98rem; }
  .map { width: 100%; }
  .core { width: 6.4rem; height: 6.4rem; }
  .core b { font-size: 0.85rem; }
  .node__chip { width: 3.2rem; height: 3.2rem; border-radius: 14px; }
  .node span { font-size: 0.68rem; }
  .tick { font-size: 0.66rem; }
  .proc__grid, .why2__item { grid-template-columns: 1fr; }
  .screens { grid-template-columns: 1fr; height: 56svh; }
  .screens .demo + .demo { display: none; }
  .big-count { margin-top: 0.6rem; } .big-count b { font-size: 2.4rem; }
  .say { display: none; }
  .qa__item .q { font-size: 1.9rem; }
}