.hero-visual[data-cinematic]{background:radial-gradient(ellipse at 56% 30%,#183d71 0%,#0b1a31 42%,#07101e 78%);border-color:#426184;min-height:0;overflow:hidden;box-shadow:0 26px 70px #02091288;gap:4px}
.orbit-showcase{position:relative;min-width:0;margin:12px -10px 4px;color:#eef5ff}
.orbit-scene{position:relative;height:clamp(230px,27vw,375px);overflow:hidden;isolation:isolate;perspective:850px;border-radius:14px;background:radial-gradient(ellipse at 50% 38%,#293f824d,transparent 62%),linear-gradient(180deg,#0c132618,#050b18);border:1px solid #8eaef02a}
.orbit-beam{position:absolute;inset:-40% -10% 5%;background:conic-gradient(from 142deg at 55% 0%,transparent 0deg,#727eff16 13deg,#a5bbff47 32deg,#ab8dff26 49deg,transparent 68deg);filter:blur(22px);transform-origin:55% 4%;animation:orbit-light 10s ease-in-out infinite alternate}
.orbit-ring{position:absolute;inset:auto 6% 8%;height:29%;border-radius:50%;border:1px solid #a7bcff55;background:radial-gradient(ellipse,#537def29,transparent 66%);box-shadow:inset 0 0 20px #7894ff30,0 0 22px #7198ff26;transform:rotate(-4deg)}
.orbit-ring::after{content:"";position:absolute;inset:12%;border:1px dashed #abc6ff38;border-radius:50%}
.orbit-horizon{position:absolute;inset:auto 0 0;height:35%;opacity:.33;background:repeating-linear-gradient(90deg,transparent 0 32px,#90a5eb30 33px 34px),repeating-linear-gradient(0deg,transparent 0 19px,#90a5eb30 20px 21px);transform-origin:bottom;transform:perspective(200px) rotateX(54deg) scaleX(1.4);mask-image:linear-gradient(transparent,#000)}
.orbit-rig{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .35s ease-out}
.orbit-screen{position:absolute;left:50%;top:47%;width:clamp(145px,57%,320px);min-height:145px;display:flex;flex-direction:column;padding:10px;border:1px solid #98baff77;border-radius:12px;overflow:hidden;background:linear-gradient(140deg,#223865,#0a1227 64%);box-shadow:0 14px 36px #030710d9,0 0 24px #6f91ff33,inset 0 1px #c3d6ff4d;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.8,.2,1),opacity .7s,filter .7s;pointer-events:none}
.orbit-screen[data-slot="center"]{transform:translate(-50%,-50%) translateZ(55px) rotateY(-7deg);z-index:3;opacity:1}
.orbit-screen[data-slot="left"]{transform:translate(-94%,-44%) translateZ(-82px) rotateY(36deg) scale(.78);z-index:1;opacity:.63;filter:saturate(.75)}
.orbit-screen[data-slot="right"]{transform:translate(-3%,-44%) translateZ(-82px) rotateY(-35deg) scale(.78);z-index:2;opacity:.63;filter:saturate(.75)}
.orbit-screen.phone{width:clamp(76px,27%,140px);min-height:169px;border-radius:17px;background:linear-gradient(150deg,#4161a7,#111a36 70%)}
.orbit-screen.phone[data-slot="left"]{transform:translate(-170%,-39%) translateZ(-55px) rotateY(28deg) scale(.84)}
.orbit-screen.phone[data-slot="right"]{transform:translate(69%,-37%) translateZ(-55px) rotateY(-28deg) scale(.84)}
.orbit-screen.editor{background:linear-gradient(140deg,#312b66,#101226 62%)}
.orbit-chrome,.orbit-nav{display:flex;align-items:center;gap:4px;border-bottom:1px solid #a9c1ff2c;padding:0 0 7px}
.orbit-chrome i{width:4px;height:4px;border-radius:50%;background:#a8c4ff}.orbit-chrome i:nth-child(2){opacity:.65}.orbit-chrome i:nth-child(3){opacity:.35}
.orbit-chrome span,.orbit-site small,.orbit-mobile small,.orbit-kicker{font:500 8px/1.2 ui-monospace,monospace;letter-spacing:.09em;color:#c2d3ff}
.orbit-chrome span{margin-left:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.orbit-nav{padding:7px 0 5px}.orbit-nav b{font-size:8px;margin-right:auto;letter-spacing:.13em}.orbit-nav b span{color:#aeabff}.orbit-nav i{width:10%;height:2px;background:#98baff7a;border-radius:4px}
.orbit-site{position:relative;isolation:isolate;min-height:73px;padding:8px 4px 6px;overflow:hidden;background:radial-gradient(ellipse at 80% 36%,#7189e885,transparent 52%)}
.orbit-site strong,.orbit-mobile strong{display:block;font-size:clamp(22px,3.5vw,50px);line-height:.87;letter-spacing:-.085em;color:#f7f8ff}.orbit-site em{color:#b7caff;font-weight:600}.orbit-site small{display:block;margin-top:9px;font-size:7px}
.orbit-stripes{position:absolute;z-index:-1;right:2%;top:13%;width:43%;height:80%;transform:skewY(-21deg) rotate(-12deg);display:flex;gap:5px}.orbit-stripes i{flex:1;border-radius:4px;background:linear-gradient(130deg,#afc2ffab,#505ad63b);border:1px solid #c3d7ff69;box-shadow:0 0 14px #607aff50}.orbit-stripes i:nth-child(2){transform:translateY(-12%)}
.orbit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:6px}.orbit-grid i{height:13px;border-radius:3px;background:linear-gradient(140deg,#9db8ff33,#6673bd14);border:1px solid #a9bbff34}
.orbit-notch{width:29%;height:3px;border-radius:20px;background:#c9d7ff86;margin:6px auto 0}.orbit-mobile{padding:7px 0}.orbit-mobile small{font-size:6px}.orbit-mobile strong{font-size:clamp(20px,3vw,33px);margin:5px 0}.orbit-mobile i{display:block;height:2px;width:84%;background:#a6b8f456;margin:5px 0;border-radius:4px}.orbit-mobile i+ i{width:56%}.orbit-mobile b{font-size:6px}.orbit-wave{height:28px;border-radius:5px;background:repeating-linear-gradient(120deg,#847fff33 0 4px,#b8c7ff7d 5px 6px,#263668 8px 11px)}
.orbit-editor{display:grid;gap:7px;padding:13px 0 9px;font:500 clamp(6px,1vw,12px)/1.2 ui-monospace,monospace;color:#d5deff;white-space:nowrap}.orbit-editor b{color:#dcb0ff}.orbit-editor em{color:#a8edee;font-style:normal}
.orbit-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 4px 2px}.orbit-kicker{display:block;color:#a9c1ff;font-size:9px;margin-bottom:4px}.orbit-caption{display:block;font-size:clamp(11px,1.35vw,14px);font-weight:650}.orbit-controls{display:flex;gap:5px;flex-shrink:0}.orbit-controls button{display:grid;place-items:center;min-width:34px;min-height:34px;border:1px solid #a6b9ff4d;border-radius:7px;background:#172741;color:#e8f1ff;font:700 14px/1 system-ui;cursor:pointer}.orbit-controls button:hover,.orbit-controls button:focus-visible{background:#334d81;outline:2px solid #adceff;outline-offset:2px}.orbit-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.orbit-showcase[data-playing="false"] .orbit-beam{animation-play-state:paused}.orbit-enter{animation:orbit-enter .8s cubic-bezier(.2,.8,.2,1) both}
@keyframes orbit-light{from{transform:rotate(-8deg);opacity:.73}to{transform:rotate(9deg);opacity:1}}@keyframes orbit-enter{from{opacity:.4;translate:0 22px}to{opacity:1;translate:0 0}}
@media(max-width:720px){.hero-visual[data-cinematic]{padding-inline:18px}.orbit-showcase{margin-inline:0}.orbit-scene{height:250px}.orbit-screen{width:57%;min-height:128px;padding:8px}.orbit-screen.phone{min-height:146px}.orbit-editor{gap:6px}.orbit-controls button{min-width:36px;min-height:40px}}
@media(prefers-reduced-motion:reduce){.orbit-showcase *,.orbit-enter{animation:none!important;transition:none!important}.orbit-rig{transform:none}}