.feature-showcase{--showcase-pin-top:calc(var(--marketing-header-height) + var(--marketing-space-10));--showcase-frame-h:min(36rem, 100svh - var(--showcase-pin-top) - var(--marketing-space-3));--showcase-pin-height:var(--showcase-frame-h);--showcase-dot:color-mix(in oklab, var(--mk-panel-ink,var(--muted-foreground)) 30%, transparent);min-inline-size:0}.showcase-track,.showcase-pin{gap:var(--marketing-space-4);min-inline-size:0;display:grid}.showcase-track-sentinels{display:none}.showcase-rail{min-inline-size:0;padding:calc(var(--marketing-space-1) / 2);border-radius:calc(var(--radius-tile) + var(--marketing-space-1) / 2);background:var(--fill);position:relative}.showcase-tabs{z-index:1;gap:calc(var(--marketing-space-1) / 2);overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:calc(var(--marketing-space-1) / 2);scrollbar-width:none;border-radius:var(--radius-tile);display:flex;position:relative;overflow-x:auto}.showcase-tabs::-webkit-scrollbar{display:none}.showcase-pill{border-radius:var(--radius-tile);background:var(--card);box-shadow:var(--shadow-seg);pointer-events:none;transition:transform .3s var(--ease-out);position:absolute;top:0;left:0}.showcase-progress{display:none}.showcase-tabs button{align-items:center;gap:calc(var(--marketing-space-3) / 2);min-block-size:44px;min-inline-size:0;padding:calc(var(--marketing-space-1) * 5 / 4) var(--marketing-space-2);white-space:nowrap;scroll-snap-align:center;border-radius:var(--radius-tile);color:color-mix(in oklab, var(--foreground) 78%, var(--muted-foreground));font:inherit;text-align:start;cursor:pointer;transition:background-color var(--duration-base) var(--ease-out), color var(--duration-base) var(--ease-out), box-shadow var(--duration-base) var(--ease-out);background:0 0;border:0;flex:none;font-size:14px;font-weight:500;line-height:20px;display:flex;position:relative}.showcase-tabs button:hover{color:var(--foreground)}.showcase-tabs button[aria-selected=true]{color:var(--brand-on-soft)}.showcase-rail:not([data-pill]) .showcase-tabs button[aria-selected=true]{background:var(--card);box-shadow:var(--shadow-seg)}.showcase-tabs button:focus-visible{outline:2px solid var(--ring);outline-offset:2px}.showcase-dot{background:var(--showcase-dot);block-size:10px;inline-size:10px;transition:background-color .3s var(--ease-out), scale .3s var(--ease-out);border-radius:50%;flex-shrink:0;display:none}.showcase-steps{min-inline-size:0;display:grid}.showcase-step{gap:var(--marketing-space-3);grid-area:1/1;align-content:start;min-inline-size:0;display:grid}.showcase-step:not([data-state]){visibility:hidden}.showcase-step:not([data-state]) .showcase-scene>*{display:none}.showcase-step[data-state=leaving]{pointer-events:none}.showcase-step[data-state=active]{z-index:1}.showcase-scene{aspect-ratio:2/3;min-block-size:0;max-block-size:34rem;min-inline-size:0;position:relative;overflow:clip}.showcase-scene>.use-case-scene{inline-size:calc(100% / var(--scene-scale,1));min-block-size:var(--scene-fill,0px);margin-inline:calc((100% - 100% / var(--scene-scale,1)) / 2);transform:scale(var(--scene-scale,1));transform-origin:top;grid-template-rows:minmax(0,1fr)}.showcase-scene .uc-art{display:grid}.showcase-scene .uc-window{min-block-size:0}.showcase-scene .uc-foot{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}.showcase-story{min-inline-size:0;min-block-size:var(--story-h,auto);align-content:start;justify-items:start;display:grid}.feature-showcase .showcase-title{color:var(--foreground);letter-spacing:-.02em;text-wrap:balance;margin:0;font-size:24px;font-weight:600;line-height:1.2}.feature-showcase .showcase-lead{max-inline-size:36rem;margin:var(--marketing-space-2) 0 0;color:var(--muted-foreground);text-wrap:pretty;font-size:17px;line-height:1.55}.showcase-link{margin-block-start:var(--marketing-space-3)}.showcase-link:focus-visible{outline:2px solid var(--ring);outline-offset:calc(var(--marketing-space-1) / 2);border-radius:4px}.showcase-stage[data-animated=true] .showcase-step[data-state=active] .showcase-scene{animation:showcase-rise .4s var(--ease-out) 60ms both}.showcase-stage[data-animated=true] .showcase-step[data-state=active] :is(.showcase-lead,.showcase-link){animation:showcase-copy-in .3s var(--ease-out) calc(.14s + (var(--title-words,1) - 1) * 30ms) both}.showcase-stage[data-animated=true] .showcase-step[data-state=active] [data-words=split] .mk-word{animation:showcase-word-in .3s var(--ease-out) calc(.14s + var(--mk-word,0) * 30ms) both}.showcase-step[data-state=leaving] .showcase-scene{animation:showcase-leave .24s var(--ease-out) both}.showcase-step[data-state=leaving] .showcase-story{animation:showcase-copy-out .12s var(--ease-out) both}@keyframes showcase-rise{0%{opacity:0;transform:translateY(16px)scale(.98)}}@keyframes showcase-copy-in{0%{opacity:0}}@keyframes showcase-copy-out{to{opacity:0}}@keyframes showcase-word-in{0%{opacity:0}}@keyframes showcase-leave{to{opacity:0;transform:translateY(-8px)}}html:lang(ar) .feature-showcase .showcase-title{letter-spacing:normal;line-height:1.4}@media (min-width:768px){.feature-showcase .showcase-title{font-size:28px}}@media (min-width:1024px){.showcase-track{gap:0}.showcase-pin,.showcase-track-sentinels{grid-area:1/1}.showcase-pin{z-index:1;top:var(--showcase-pin-top);gap:var(--marketing-space-5);block-size:var(--showcase-pin-height);grid-template-columns:17rem minmax(0,1fr);align-self:start;align-items:center;position:sticky}.showcase-track-sentinels{pointer-events:none;display:block}.showcase-track-sentinels>div{block-size:55vh}.showcase-rail{--flow-fill:var(--mk-panel-ground,var(--sage-soft));--flow-inset-block:var(--radius-card);padding-block:var(--marketing-space-3);padding-inline:var(--marketing-space-2) var(--marketing-space-4);border-radius:var(--radius-card);background:color-mix(in oklab, var(--mk-panel-line,var(--line)) 40%, var(--mk-panel-ground,var(--fill)));align-content:center;align-self:center;align-items:center;display:flex}.showcase-tabs{z-index:2;scroll-snap-type:none;background:0 0;border-radius:0;flex-direction:column;flex:1;gap:0;min-inline-size:0;padding:0;display:flex;position:relative;overflow:visible}.showcase-tabs button{gap:var(--marketing-space-2);padding-inline:calc(var(--marketing-space-2) * 3 / 4);border-radius:var(--radius-tile);white-space:nowrap;font-size:15px;position:static}.showcase-tabs button[aria-selected=true],.showcase-rail:not([data-pill]) .showcase-tabs button[aria-selected=true]{color:var(--foreground);box-shadow:none;background:0 0}.showcase-pill{display:none}.showcase-progress{z-index:1;inset-block:calc(var(--marketing-space-3) + 22px);background:color-mix(in oklab, var(--foreground) 12%, transparent);pointer-events:none;border-radius:999px;inline-size:2px;display:block;position:absolute;inset-inline-start:calc(var(--marketing-space-2) + 16px)}.showcase-progress:after{content:"";border-radius:inherit;background:var(--foreground);transform:scaleY(var(--showcase-progress,0));transform-origin:top;position:absolute;inset:0}.showcase-tabs button:hover .showcase-dot{background:color-mix(in oklab, var(--foreground) 45%, transparent)}.showcase-tabs button[aria-selected=true] .showcase-dot{background:var(--foreground);scale:1.2}.showcase-dot{display:block}.showcase-stage,.showcase-steps{block-size:100%}.showcase-step{gap:var(--marketing-space-5);grid-template-columns:minmax(0,1fr) 25rem;align-content:center;align-items:center}.showcase-scene{aspect-ratio:auto;max-block-size:none;block-size:var(--showcase-frame-h)}.feature-showcase .showcase-title{font-size:32px}.feature-showcase .showcase-lead{font-size:17px;line-height:1.55}}@media (prefers-reduced-motion:reduce){.feature-showcase *,.feature-showcase :after{transition:none!important;animation:none!important}}
