.r8-showcase{background:var(--r-bg);padding:28px 0 104px}.r8-showcase-head{display:flex;gap:35px;justify-content:space-between;align-items:end;margin-bottom:25px}.r8-showcase-head h2{font:750 clamp(38px,5vw,66px)/1.05 var(--r-headfont);letter-spacing:-.07em;color:var(--r-ink);margin:12px 0 0}.r8-showcase-head p{max-width:340px;color:var(--r-muted);font-size:14px;line-height:1.75;margin:0}.r8-demo-frame{background:#111827;border:1px solid #3b465e;border-radius:23px;box-shadow:0 35px 100px #050b1829;overflow:hidden;color:#f7f8ff}
.r8-showcase-nav{display:flex;flex-wrap:wrap;gap:0;align-items:stretch;border-bottom:1px solid #324055}.r8-nav-choice{flex:1;min-width:125px;border:0;border-right:1px solid #324055;background:#151f30;color:#aebdd0;padding:19px 17px;text-align:left;cursor:pointer;transition:background .23s,color .23s}.r8-nav-choice:last-child{border-right:0}.r8-nav-choice span{color:#7e94b2;display:block;font:750 10px system-ui;letter-spacing:.1em;margin-bottom:5px}.r8-nav-choice b{font:720 14px system-ui;letter-spacing:-.03em}.r8-nav-choice[aria-selected="true"]{background:#23334c;color:#ffffff;box-shadow:inset 0 -3px 0 #c2ee80}.r8-nav-choice:focus-visible{outline:2px solid #c3e6ff;outline-offset:-3px}
.r8-stage{display:grid;grid-template-columns:0.9fr 1.1fr;min-height:385px}.r8-stage-copy{padding:54px clamp(25px,4vw,64px);display:flex;flex-direction:column;justify-content:space-between}.r8-stage-copy .r8-overline{color:#9aabff;font-size:11px;letter-spacing:.14em;font-weight:750}.r8-stage-copy h3{font-size:clamp(31px,3.1vw,49px);line-height:1.08;letter-spacing:-.06em;margin:15px 0 14px;color:white}.r8-stage-copy p{color:#a8bbd1;font-size:14px;line-height:1.7;max-width:410px;margin:0}.r8-stage-link{display:inline-flex;gap:16px;justify-content:space-between;align-items:center;background:#c8f379;color:#10231f;text-decoration:none;border-radius:11px;font-size:13px;font-weight:750;padding:14px 19px;max-width:230px;margin-top:30px}.r8-stage-link:hover{background:#dbff9e}.r8-stage-report{padding:24px;display:flex;align-items:center;background:radial-gradient(ellipse at 60% 10%,#3b4c9470,transparent 65%),#17253a;border-left:1px solid #34445d}.r8-stage-window{width:100%;min-width:0;border:1px solid #3c516c;border-radius:15px;background:#121f32;box-shadow:0 25px 50px #0003;padding:19px}.r8-stage-top{display:flex;gap:12px;justify-content:space-between;align-items:center;color:#b4c4d7;font-size:10px;margin-bottom:18px}.r8-stage-top span:first-child:before{content:'●';color:#76dcb7;margin-right:8px}.r8-stage-badge{border-radius:30px;padding:5px 9px;border:1px solid #3c5564;color:#a8dfca;font-size:9px;letter-spacing:.07em}.r8-stage-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}.r8-stage-metric{background:#1c2b41;padding:18px;border-radius:11px;border:1px solid #35445b}.r8-stage-metric small{display:block;color:#9eb2cb;font-size:10px;font-weight:750;letter-spacing:.07em}.r8-stage-metric strong{display:block;color:#fff;font:760 30px/1.3 system-ui;letter-spacing:-.045em;margin-top:5px;font-variant-numeric:tabular-nums}.r8-stage-metric:last-child strong{color:#bbec90}.r8-stage-plot{height:132px;margin-top:18px;display:flex;align-items:flex-end;gap:8px;padding:10px 6px 0;border-bottom:1px solid #3a4c61;background:repeating-linear-gradient(to top, transparent 0px,transparent 36px,#31445a 37px,#31445a 38px)}.r8-stage-plot i{flex:1;min-height:3px;background:linear-gradient(180deg,#b0a9ff,#6fe3c6);border-radius:5px 5px 0 0;transition:height .6s cubic-bezier(.2,.7,.2,1);display:block}.r8-stage-bottom{display:flex;justify-content:space-between;gap:15px;color:#859cb6;font-size:9px;padding-top:13px}
@media(max-width:850px){.r8-showcase-head{flex-direction:column;align-items:flex-start;gap:12px}.r8-showcase-head p{max-width:580px}.r8-stage{grid-template-columns:1fr}.r8-stage-copy{padding:33px}.r8-stage-report{border-left:0;border-top:1px solid #34445d}.r8-stage-window{max-width:none}.r8-showcase-nav{display:grid;grid-template-columns:repeat(2,1fr)}.r8-nav-choice:nth-child(2){border-right:0}}
@media(max-width:450px){.r8-showcase{padding-bottom:65px}.r8-showcase-head h2{font-size:44px}.r8-stage-copy{padding:25px 22px}.r8-stage-report{padding:15px}.r8-stage-window{padding:12px}.r8-stage-metric{padding:12px}.r8-stage-metric strong{font-size:26px}.r8-nav-choice{padding:15px}}
@media(prefers-reduced-motion:reduce){.r8-nav-choice,.r8-stage-plot i{transition:none}}
