.showcase{flex-direction:column;gap:20px;min-height:680px}.showcase-tabs{z-index:2;border-radius:var(--radius-pill);background:var(--white);border:1px solid #0c0c0c24;gap:4px;padding:4px;display:flex;position:relative;box-shadow:0 8px 24px #0c0c0c1f}.showcase-tabs button{border-radius:var(--radius-pill);color:#0c0c0c99;min-height:36px;font:inherit;cursor:pointer;background:0 0;border:0;padding:6px 16px;font-size:14px;font-weight:700;transition:background .25s,color .25s}.showcase-tabs button.active{background:var(--orange);color:var(--white)}.showcase:before{display:none}.showcase-backdrop{z-index:0;background:var(--orange);border-radius:50%;grid-area:1/1;width:450px;height:450px;transition:width .5s,height .5s,border-radius .5s,transform .5s;position:relative}.on-dashboard .showcase-backdrop{border-radius:var(--radius-lg);width:560px;height:420px;transform:translate(-36px,36px)}.showcase-devices{z-index:1;place-items:center;width:100%;height:590px;display:grid;position:relative}.showcase-device{z-index:1;opacity:0;visibility:hidden;grid-area:1/1;transition:opacity .45s,transform .45s,visibility 0s linear .45s;position:relative;transform:scale(.94)translateY(12px)}.showcase-device.is-active{opacity:1;visibility:visible;transition:opacity .45s .1s,transform .45s .1s;transform:none}.dash-window{border-radius:var(--radius-lg);background:var(--white);border:1px solid #0c0c0c24;flex-direction:column;width:560px;height:420px;display:flex;overflow:hidden;box-shadow:0 8px 24px #0c0c0c1f}.window-bar{background:var(--warm);border-bottom:1px solid #0c0c0c24;flex:none;align-items:center;gap:6px;height:36px;padding-inline:14px;display:flex}.window-bar i{background:#0c0c0c24;border-radius:50%;width:9px;height:9px}.window-bar span{border-radius:var(--radius-pill);background:var(--white);color:#0c0c0c99;direction:ltr;margin-inline:auto;padding:2px 14px;font-size:11px}.window-body{flex:1;grid-template-columns:140px 1fr;min-height:0;display:grid}.window-side{background:var(--ink);color:var(--warm);flex-direction:column;gap:4px;padding:14px 10px;display:flex}.window-venue{align-items:center;gap:8px;margin-bottom:12px;font-size:12px;font-weight:700;display:flex}.window-venue i{background:var(--warm);width:26px;height:26px;color:var(--ink);border-radius:50%;place-items:center;font-style:normal;font-weight:900;display:grid}.window-nav{border-radius:var(--radius-sm);color:#f5f5f08c;align-items:center;gap:8px;padding:7px 8px;font-size:12px;font-weight:700;transition:background .3s,color .3s;display:flex}.window-nav svg{width:15px;height:15px}.window-nav.active{background:var(--orange);color:var(--white)}.window-main{min-width:0;position:relative}.showcase-scene{opacity:0;visibility:hidden;padding:0 18px 18px;transition:opacity .45s,transform .45s,visibility 0s linear .45s;position:absolute;inset:0;transform:translateY(12px)}.showcase-scene.is-active{opacity:1;visibility:visible;transition:opacity .45s .15s,transform .45s .15s;transform:none}.screen-head{justify-content:space-between;align-items:center;padding:12px 0 16px;display:flex}.screen-head strong{font-size:18px;font-weight:900}.screen-head span{border-radius:var(--radius-pill);background:#0c0c0c0d;padding:3px 10px;font-size:11px;font-weight:700}.screen-kpis{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.screen-kpis div,.screen-chart{border-radius:var(--radius-md);border:1px solid #0c0c0c24;padding:12px}.screen-kpis small,.screen-chart small,.screen-label{color:#0c0c0c99;font-size:11px;font-weight:700;display:block}.screen-kpis b{margin-top:4px;font-size:20px;font-weight:900;line-height:1.2;display:block}.screen-chart{margin-top:8px}.screen-bars{align-items:flex-end;gap:6px;height:150px;margin-top:16px;display:flex}.screen-bars i{border-radius:var(--radius-xs) var(--radius-xs) 0 0;transform-origin:bottom;background:#0c0c0c24;flex:1;transition:transform .6s;transform:scaleY(0)}.screen-bars i.peak,.rank-track i.peak{background:var(--orange)}.is-active .screen-bars i{transition-delay:calc(var(--i) * 40ms + .15s);transform:scaleY(1)}.screen-hours{color:#0c0c0c99;justify-content:space-between;margin-top:8px;font-size:10px;display:flex}.screen-label{margin-bottom:12px}.screen-rank{flex-direction:column;gap:18px;display:flex}.rank-row{grid-template-columns:40px 110px 1fr auto;align-items:center;gap:12px;display:grid}.rank-row .rank-thumb{object-fit:cover;border-radius:var(--radius-sm);width:40px;height:40px;display:block}.rank-row strong{font-size:13px;font-weight:700}.rank-row small{color:#0c0c0c99;white-space:nowrap;font-size:11px}.rank-track{border-radius:var(--radius-pill);background:#0c0c0c0d;height:8px;display:block;overflow:hidden}.rank-track i{border-radius:inherit;transform-origin:100%;background:#0c0c0c24;height:100%;transition:transform .6s;display:block;transform:scaleX(0)}.is-active .rank-track i{transition-delay:calc(var(--i) * 80ms + .15s);transform:scaleX(1)}.showcase-float{opacity:0;pointer-events:none;transition:opacity .45s,transform .45s;transform:translateY(12px)}.window-float{bottom:4px}.showcase-float.is-active{opacity:1;transform:none}.showcase-float small{color:#0c0c0c99;font-size:13px;font-weight:700;display:block}.showcase-float b{margin-top:4px;font-size:20px;font-weight:900;display:block}@media (max-width:1050px){.dash-window,.on-dashboard .showcase-backdrop{width:min(560px,100%)}}@media (max-width:720px){.showcase{min-height:640px}.showcase-tabs button{padding:6px 12px;font-size:13px}.showcase-devices{height:548px}.showcase-backdrop{width:340px;height:340px}.on-dashboard .showcase-backdrop{width:100%;height:400px;transform:translate(-12px,16px)}.dash-window{width:100%;height:400px}.window-body{grid-template-columns:1fr}.window-side{display:none}.showcase .window-float{bottom:-20px}.showcase-scene{padding:0 14px 14px}.screen-kpis b{font-size:17px}.screen-bars{height:130px}.rank-row{grid-template-columns:36px 1fr auto;grid-template-areas:"img name count""img track track";row-gap:6px}.rank-row .rank-thumb{grid-area:img;width:36px;height:36px}.rank-row strong{grid-area:name}.rank-row small{grid-area:count}.rank-track{grid-area:track}}@media (prefers-reduced-motion:reduce){.screen-bars i,.rank-track i{transform:none}}
.hero{padding:96px 0;overflow:hidden}.hero-grid{grid-template-columns:repeat(12,1fr);align-items:center;gap:24px;display:grid}.hero-copy{grid-column:span 6;max-width:600px}.hero-copy>p{color:#0c0c0ca6;max-width:600px;font-size:18px}.hero-slides{display:grid}.hero-slide{opacity:0;visibility:hidden;grid-area:1/1;transition:opacity .4s,transform .4s,visibility 0s linear .4s;transform:translateY(8px)}.hero-slide.is-active{opacity:1;visibility:visible;transition:opacity .4s .12s,transform .4s .12s;transform:none}.hero-note{color:#0c0c0c99;margin-top:12px;font-size:14px;display:block}.problem-heading{max-width:760px;margin-bottom:48px}.problem-heading .lead{max-width:640px}.problem-cta{border-radius:var(--radius-lg);border:1px solid #0c0c0c24;justify-content:space-between;align-items:center;gap:24px;margin-top:32px;padding:24px 32px;display:flex}.problem-cta p{margin:0;font-size:19px;font-weight:700}.problem-grid article{border-top:4px solid var(--orange);background:var(--white);flex-direction:column;min-height:180px;padding:32px;transition:transform .18s,box-shadow .18s;display:flex}.problem-grid article:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0c0c0c1f}.problem-grid svg{width:28px;height:28px;margin-bottom:32px}.problem-grid p{margin:0;font-size:19px;font-weight:700}.problem-grid .problem-text{color:#0c0c0c99;min-height:2lh;font-size:17px;font-weight:400}.problem-solution{border-top:1px solid #0c0c0c24;flex-direction:column;gap:12px;margin-top:24px;padding-top:24px;display:flex}.solution-arrow{background:var(--orange);width:32px;height:32px;color:var(--white);border-radius:50%;justify-content:center;align-items:center;display:flex}.problem-grid .solution-arrow svg{width:18px;height:18px;margin:0}.reveal-ready .problem-solution{opacity:0;transition:opacity .5s,transform .5s;transition-delay:calc(var(--i) * .15s + .2s);transform:translateY(12px)}.reveal-ready.is-visible .problem-solution{opacity:1;transform:none}.feature-card{border-radius:var(--radius-md);background:var(--warm);border:1px solid #0c0c0c24;min-height:330px;padding:32px}.feature-card p{color:#0c0c0ca6}.feature-card h3,.step h3{font-weight:700}.steps-grid{grid-template-columns:repeat(4,1fr);gap:24px;display:grid}.step{padding-top:16px}.step>strong{font-size:72px;font-weight:900;line-height:1;display:block}.step>i{border-radius:var(--radius-xs);background:var(--orange);width:48px;height:6px;margin:20px 0 32px;display:block}.step p{color:#0c0c0ca6}@media (max-width:1050px){.hero-copy{grid-column:span 6}}@media (max-width:720px){.problem-heading{margin-bottom:32px}.problem-grid .problem-text{min-height:0}.problem-cta{text-align:center;flex-direction:column;align-items:stretch;padding:24px}.hero{padding:64px 0}.hero-grid{flex-direction:column;gap:48px;display:flex}.hero-copy{max-width:none}.hero-copy>p{font-size:17px}.steps-grid{grid-template-columns:1fr;gap:48px}.feature-card{min-height:280px}.step>strong{font-size:64px}}
