/* SyxLabs cinematic B2B layer */
.hero{height:185vh;min-height:1180px;padding:0;display:block;overflow:visible}
.hero-grid{position:sticky;top:82px;min-height:calc(100vh - 82px);padding-top:clamp(46px,6vh,86px);padding-bottom:40px;perspective:1400px}
.hero-copy-column{position:relative;z-index:4;will-change:transform,opacity}
.hero-copy-column:after{position:absolute;right:-38px;top:-18%;width:1px;height:136%;content:"";background:linear-gradient(transparent,var(--line) 18%,var(--line) 82%,transparent)}
.hero-scroll-cue{display:flex;align-items:center;gap:12px;margin-top:22px;color:var(--dim);font:500 9px var(--mono);letter-spacing:.12em;text-transform:uppercase}
.hero-scroll-cue:before{width:34px;height:1px;content:"";background:var(--signal);transform-origin:left;animation:cue-pulse 1.8s ease-in-out infinite}
@keyframes cue-pulse{0%,100%{transform:scaleX(.35);opacity:.45}50%{transform:scaleX(1);opacity:1}}

.cinematic-scene{position:relative;min-height:590px;transform-style:preserve-3d;isolation:isolate;will-change:transform}
.scene-frame{position:absolute;inset:0;overflow:hidden;border:1px solid var(--line);background:#090a08;clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px));transform-style:preserve-3d;box-shadow:0 40px 90px rgba(0,0,0,.32)}
.scene-frame:before{position:absolute;inset:0;z-index:8;content:"";pointer-events:none;background:linear-gradient(105deg,rgba(255,255,255,.045),transparent 28%),radial-gradient(circle at 52% 50%,transparent 0 18%,rgba(8,9,7,.12) 50%,rgba(8,9,7,.76) 100%)}
.scene-frame:after{position:absolute;inset:14px;z-index:9;content:"";pointer-events:none;border:1px solid rgba(255,255,255,.06);clip-path:polygon(0 0,calc(100% - 15px) 0,100% 15px,100% 100%,15px 100%,0 calc(100% - 15px))}
.scene-canvas{position:absolute;z-index:0;inset:0;width:100%;height:100%;opacity:.82}
.scene-scan{position:absolute;z-index:1;inset:-45% 0 auto;height:42%;background:linear-gradient(transparent,rgba(200,255,61,.07),rgba(200,255,61,.18),transparent);transform:skewY(-8deg);animation:scan 6s linear infinite;pointer-events:none}
@keyframes scan{to{transform:translateY(460%) skewY(-8deg)}}
.scene-meta{position:absolute;z-index:12;top:25px;right:26px;left:26px;display:flex;justify-content:space-between;color:#65685f;font:600 8px var(--mono);letter-spacing:.12em;text-transform:uppercase}
.scene-status{display:flex;align-items:center;gap:8px;color:var(--signal)}
.scene-status:before{width:6px;height:6px;content:"";border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor;animation:status 1.5s ease-in-out infinite}
@keyframes status{50%{opacity:.35}}
.scene-axis{position:absolute;z-index:2;top:50%;left:50%;width:76%;height:76%;border:1px solid rgba(200,255,61,.14);border-radius:50%;transform:translate(-50%,-50%) rotateX(68deg) rotateZ(-16deg);box-shadow:inset 0 0 70px rgba(200,255,61,.025)}
.scene-axis:before,.scene-axis:after{position:absolute;inset:14%;content:"";border:1px solid rgba(255,255,255,.07);border-radius:50%}.scene-axis:after{inset:31%;border-color:rgba(200,255,61,.18)}
.flow{position:absolute;z-index:3;top:50%;left:50%;height:1px;background:linear-gradient(90deg,transparent,var(--signal),transparent);transform-origin:left;opacity:.18;will-change:transform,opacity}.f1{width:52%;transform:rotate(14deg)}.f2{width:45%;transform:rotate(126deg)}.f3{width:49%;transform:rotate(226deg)}.f4{width:42%;transform:rotate(310deg)}
.chaos-chip{position:absolute;z-index:5;display:grid;min-width:116px;min-height:62px;padding:13px 15px;border:1px solid var(--strong);background:rgba(8,9,7,.88);color:var(--paper);font:650 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;backdrop-filter:blur(8px);will-change:transform,opacity;box-shadow:0 14px 40px rgba(0,0,0,.28)}
.chaos-chip small{align-self:end;margin-top:8px;color:var(--dim);font:500 7px var(--mono);letter-spacing:.1em}.chip-mail{top:20%;left:8%}.chip-sheet{top:14%;right:8%}.chip-copy{right:5%;bottom:18%}.chip-manual{bottom:13%;left:9%}.chip-gap{top:44%;right:2%}
.scene-core{position:absolute;z-index:6;top:50%;left:50%;width:230px;aspect-ratio:1;display:grid;place-items:center;transform:translate(-50%,-50%) scale(.16);opacity:.08;will-change:transform,opacity}
.core-rings,.core-rings:before,.core-rings:after{position:absolute;inset:0;border:1px solid rgba(200,255,61,.8);border-radius:50%}.core-rings{box-shadow:0 0 70px rgba(200,255,61,.1),inset 0 0 50px rgba(200,255,61,.06);animation:core-rotate 14s linear infinite}.core-rings:before{inset:14%;content:"";border-style:dashed;opacity:.48}.core-rings:after{inset:28%;content:"";border-color:rgba(240,239,233,.34)}
@keyframes core-rotate{to{transform:rotate(360deg)}}
.core-mark{position:relative;width:120px;height:68px;display:grid;place-items:center;overflow:hidden;background:#000;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}.core-mark img{width:110px;height:52px;object-fit:contain}.core-label{position:absolute;top:calc(50% + 130px);left:50%;width:max-content;transform:translateX(-50%);color:var(--signal);font:600 8px var(--mono);letter-spacing:.15em;text-transform:uppercase}
.output-card{position:absolute;z-index:7;right:28px;bottom:58px;left:28px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;padding:22px 24px;border-left:2px solid var(--signal);background:rgba(11,12,9,.92);transform:translateY(135%);opacity:0;will-change:transform,opacity;backdrop-filter:blur(14px)}
.output-card span{color:var(--signal);font:600 8px var(--mono);letter-spacing:.12em;text-transform:uppercase}.output-card strong{display:block;margin-top:7px;font-size:22px;letter-spacing:-.025em}.output-card p{max-width:230px;margin:0;color:var(--muted);font:500 9px/1.6 var(--mono);text-align:right}
.scene-progress{position:absolute;z-index:12;top:52px;right:26px;bottom:auto;left:26px;display:flex;align-items:center;gap:12px;color:#676a61;font:600 8px var(--mono);letter-spacing:.08em}.scene-progress-track{height:1px;flex:1;background:var(--line)}.scene-progress-fill{display:block;width:0;height:100%;background:var(--signal);box-shadow:0 0 9px rgba(200,255,61,.45)}
.scene-caption{position:absolute;z-index:12;bottom:23px;left:27px;color:var(--paper);font:600 9px var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:0;transform:translateY(8px);transition:.3s}.scene-caption.visible{opacity:1;transform:none}

@media(max-width:1100px){.hero{height:auto;min-height:0;padding-block:145px 100px}.hero-grid{position:relative;top:auto;min-height:0;padding-block:0}.hero-copy-column:after,.hero-scroll-cue{display:none}.cinematic-scene{width:min(680px,100%);min-height:560px;margin:auto}.scene-frame{position:absolute}.chaos-chip{min-width:104px}.output-card{bottom:54px}}
@media(max-width:680px){.cinematic-scene{min-height:470px}.scene-frame{clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px))}.scene-meta{top:19px;right:20px;left:20px}.scene-meta span:first-child{display:none}.chaos-chip{min-width:82px;min-height:50px;padding:10px;font-size:8px}.chaos-chip small{display:none}.chip-gap{display:none}.scene-core{width:180px}.core-mark{width:104px}.core-mark img{width:95px}.core-label{top:calc(50% + 102px);font-size:7px}.output-card{right:18px;bottom:48px;left:18px;grid-template-columns:1fr;padding:16px 18px}.output-card strong{font-size:18px}.output-card p{display:none}.scene-progress{top:45px;right:20px;bottom:auto;left:20px}.scene-caption{display:none}}
@media(prefers-reduced-motion:reduce){.scene-scan,.core-rings,.scene-status:before,.hero-scroll-cue:before{animation:none}.chaos-chip{opacity:.15!important}.scene-core{transform:translate(-50%,-50%) scale(1)!important;opacity:1!important}.output-card{transform:none!important;opacity:1!important}.scene-progress-fill{width:100%!important}}