.systems-ai {
  --sa-navy:#071A3D;
  --sa-blue:#1264FF;
  --sa-cyan:#35C8FF;
  position:relative;
  isolation:isolate;
  width:100%;
  max-width:1000px;
  margin:auto;
  padding:clamp(20px,4vw,42px);
  overflow:hidden;
  color:#F4F8FF;
  background:
    radial-gradient(ellipse at 50% 43%,#102c56 0%,transparent 48%),
    linear-gradient(145deg,#06132c,#071A3D 58%,#06152e);
  border:1px solid #35c8ff2a;
  border-radius:24px;
  box-shadow:0 24px 70px #071a3d24;
  font-family:Arial,Helvetica,sans-serif;
}
.systems-ai * {box-sizing:border-box}
.sa-glow {
  position:absolute;z-index:-1;
  width:200px;height:200px;border-radius:50%;
  filter:blur(75px);pointer-events:none;
  animation:sa-glow-drift 12s ease-in-out infinite alternate;
}
.sa-glow-one {top:12%;left:-140px;background:#1264ff45}
.sa-glow-two {right:-130px;bottom:10%;background:#35c8ff30;animation-delay:-5s}
.sa-top {display:flex;justify-content:space-between;align-items:center;gap:12px}
.sa-heading {display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:1.4px;font-weight:700}
.sa-status-dot {width:8px;height:8px;border-radius:50%;background:var(--sa-cyan);box-shadow:0 0 14px var(--sa-cyan)}
.sa-live {display:flex;align-items:center;gap:7px;color:#a7bfdc;font-size:8px;letter-spacing:1px}
.sa-live i,.sa-core-status i {
  width:6px;height:6px;flex-shrink:0;border-radius:50%;
  background:#52e6b0;box-shadow:0 0 10px #52e6b0;
  animation:sa-pulse 1.8s infinite;
}
.sa-intro {position:relative;z-index:2;text-align:center;margin:37px 0 0}
.sa-kicker {color:var(--sa-cyan);font-size:9px;font-weight:700;letter-spacing:3px}
.sa-intro h2 {margin:12px 0 10px;font-size:clamp(32px,5.5vw,55px);line-height:1.04;letter-spacing:-1.8px}
.sa-intro h2 span {
  color:transparent;
  background:linear-gradient(90deg,#fff,#35c8ff,#8faeff,#fff);
  background-size:220% auto;
  background-clip:text;-webkit-background-clip:text;
  animation:sa-text-shine 6s linear infinite;
}
.sa-intro p {margin:0;color:#94abc9;font-size:12px;line-height:1.7}
.sa-stage {position:relative;height:clamp(315px,49vw,430px);max-width:730px;margin:10px auto 0;perspective:900px}
.sa-orbit {position:absolute;top:50%;left:50%;border:1px solid #35c8ff19;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%)}
.sa-orbit-one {width:205px;height:205px;animation:sa-breathe 5s ease-in-out infinite}
.sa-orbit-two {width:305px;height:305px;border-style:dashed;animation:sa-spin 35s linear infinite}
.sa-orbit-three {width:415px;height:415px;border-color:#1264ff1d;animation:sa-breathe 7s ease-in-out infinite reverse}
.sa-wires {position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.sa-wires path {fill:none;stroke:#35c8ff32;stroke-width:1.2;stroke-dasharray:4 7}
.sa-wires .sa-signal {stroke:#35c8ff;stroke-width:2;stroke-dasharray:3 22;animation:sa-signal-flow 3s linear infinite;filter:drop-shadow(0 0 4px #35c8ff)}
.sa-wires .sa-signal-2 {animation-delay:-.7s}
.sa-wires .sa-signal-3 {animation-delay:-1.4s}
.sa-wires .sa-signal-4 {animation-delay:-2.1s}
.sa-node {
  position:absolute;z-index:3;display:flex;align-items:center;gap:8px;
  padding:10px 12px;border:1px solid #72bdff35;border-radius:12px;
  background:linear-gradient(140deg,#15345aef,#0a1c39f5);
  box-shadow:0 10px 25px #0003;
  animation:sa-node-float 4s ease-in-out infinite;
}
.sa-node span {font-size:17px;color:var(--sa-cyan)}
.sa-node b {font-size:10px;white-space:nowrap}
.sa-node-top {top:2%;left:50%;transform:translateX(-50%)}
.sa-node-left {left:0;top:47%;animation-delay:-1s}
.sa-node-right {right:0;top:47%;animation-delay:-2s}
.sa-node-bottom {bottom:2%;left:50%;animation-delay:-3s;transform:translateX(-50%)}
.sa-core {
  position:absolute;z-index:4;left:50%;top:50%;
  width:clamp(158px,24vw,190px);
  padding:24px 12px 18px;text-align:center;
  border:1px solid #75c9ff45;border-radius:23px;
  background:linear-gradient(145deg,#183a67f2,#071a3df7);
  box-shadow:0 24px 65px #0005,inset 0 1px #ffffff19,0 0 45px #1264ff1b;
  transform:translate(-50%,-50%);
  animation:sa-core-float 5s ease-in-out infinite;
}
.sa-core-ring {position:absolute;inset:-7px;border:1px solid #35c8ff30;border-radius:29px;animation:sa-ring-pulse 3s ease-in-out infinite}
.sa-ai-symbol {
  display:grid;grid-template-columns:repeat(3,7px);gap:5px;
  justify-content:center;align-content:center;
  width:58px;height:58px;margin:0 auto 15px;border-radius:18px;
  background:linear-gradient(140deg,#35c8ff,#1264ff 80%);
  box-shadow:0 0 32px #1264ff50;
  transform:rotate(-4deg);
}
.sa-ai-symbol span {width:7px;height:7px;border-radius:2px;background:#fff;animation:sa-pixels 1.8s ease-in-out infinite alternate}
.sa-ai-symbol span:nth-child(2n) {animation-delay:-.7s}
.sa-ai-symbol span:nth-child(3n) {opacity:.5;animation-delay:-1.2s}
.sa-core-label {display:block;color:#91c5ed;font-size:7px;letter-spacing:1.1px}
.sa-core h3 {margin:8px 0 0;font-size:16px}
.sa-core-line {height:1px;margin:15px 5px 12px;background:linear-gradient(90deg,transparent,#35c8ff70,transparent)}
.sa-core-status {display:flex;justify-content:center;align-items:center;gap:6px;color:#a6bedb;font-size:7px;letter-spacing:.6px}
.sa-core-status i {width:5px;height:5px}
.sa-float {
  position:absolute;z-index:5;display:flex;align-items:center;gap:9px;
  padding:10px 12px;border:1px solid #ffffff20;border-radius:13px;
  background:#0b2045e8;backdrop-filter:blur(12px);
  box-shadow:0 12px 30px #0003;animation:sa-chip-float 5s ease-in-out infinite;
}
.sa-float-left {top:17%;left:5%}
.sa-float-right {right:4%;bottom:17%;animation-delay:-2.5s}
.sa-float-icon {display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#1264ff40;font-size:19px;color:#fff}
.sa-float-icon.sa-cyan {background:#35c8ff1c;color:var(--sa-cyan)}
.sa-float small,.sa-float b {display:block}
.sa-float small {font-size:7px;color:#91a9c9;letter-spacing:.8px}
.sa-float b {font-size:10px;margin-top:4px}
.sa-mini-live {width:5px;height:5px;margin-left:3px;border-radius:50%;background:#52e6b0}
.sa-capabilities {position:relative;z-index:2}
.sa-section-title {display:flex;align-items:center;gap:14px;margin:5px 0 13px;color:#91aaca;font-size:8px;letter-spacing:1.5px}
.sa-section-title i {height:1px;flex:1;background:linear-gradient(90deg,#35c8ff40,transparent)}
.sa-tool-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.sa-tool {
  display:flex;align-items:center;gap:9px;min-width:0;
  padding:12px 10px;border:1px solid #ffffff13;border-radius:12px;
  background:linear-gradient(145deg,#ffffff0a,#ffffff03);
  transition:transform .28s ease,border-color .28s ease,background .28s ease;
}
.sa-tool:hover {transform:translateY(-4px);border-color:#35c8ff60;background:#1264ff16}
.sa-tool-icon {display:grid;place-items:center;flex-shrink:0;width:31px;height:31px;border-radius:9px;background:#1264ff2d;color:var(--sa-cyan);font-size:16px}
.sa-tool b,.sa-tool small {display:block}
.sa-tool b {font-size:10px;line-height:1.4}
.sa-tool small {margin-top:4px;color:#839dbd;font-size:8px;line-height:1.4}
.sa-arrow {margin-left:auto;color:#7ca6d5;font-size:13px}
.sa-bottom {display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:11px;margin-top:22px;padding-top:17px;border-top:1px solid #ffffff12;color:#7e9aba;font-size:7px;letter-spacing:1px}
.sa-bottom i {width:3px;height:3px;border-radius:50%;background:var(--sa-cyan);box-shadow:0 0 7px var(--sa-cyan)}

@keyframes sa-pulse {50%{opacity:.4;box-shadow:0 0 3px #52e6b0}}
@keyframes sa-text-shine {to{background-position:220% center}}
@keyframes sa-spin {to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes sa-breathe {50%{opacity:.45;scale:1.035}}
@keyframes sa-core-float {0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes sa-ring-pulse {0%,100%{opacity:.45;scale:1}50%{opacity:1;scale:1.035}}
@keyframes sa-node-float {0%,100%{filter:brightness(1)}50%{filter:brightness(1.25)}}
@keyframes sa-chip-float {0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes sa-signal-flow {to{stroke-dashoffset:-100}}
@keyframes sa-pixels {to{opacity:.4;transform:scale(.75)}}
@keyframes sa-glow-drift {to{translate:45px 25px;scale:1.25}}

@media(max-width:650px) {
  .systems-ai {padding:19px 12px;border-radius:18px}
  .sa-heading {font-size:8px;letter-spacing:.8px}
  .sa-live {font-size:7px}
  .sa-intro {margin-top:30px}
  .sa-intro h2 {letter-spacing:-1px}
  .sa-intro p {max-width:300px;margin:auto;font-size:10px}
  .sa-stage {height:320px;margin-top:12px}
  .sa-orbit-one {width:165px;height:165px}
  .sa-orbit-two {width:245px;height:245px}
  .sa-orbit-three {width:310px;height:310px}
  .sa-core {width:142px;padding:20px 8px 15px;border-radius:19px}
  .sa-ai-symbol {width:47px;height:47px;grid-template-columns:repeat(3,6px);gap:4px;border-radius:14px}
  .sa-ai-symbol span {width:6px;height:6px}
  .sa-core h3 {font-size:14px}
  .sa-core-label,.sa-core-status {font-size:6px}
  .sa-node {padding:8px;gap:5px}
  .sa-node span {font-size:13px}
  .sa-node b {font-size:8px}
  .sa-node-left {left:0}
  .sa-node-right {right:0}
  .sa-float {padding:7px;gap:6px}
  .sa-float-left {left:0;top:18%}
  .sa-float-right {right:0;bottom:17%}
  .sa-float-icon {width:24px;height:24px;font-size:15px}
  .sa-float small {font-size:6px}
  .sa-float b {font-size:8px}
  .sa-tool-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .sa-tool {padding:10px 7px;gap:7px}
  .sa-tool-icon {width:27px;height:27px;font-size:14px}
  .sa-tool b {font-size:9px}
  .sa-tool small {font-size:7px}
  .sa-bottom {gap:7px;font-size:6px;letter-spacing:.5px}
}
@media(prefers-reduced-motion:reduce) {
  .systems-ai *, .systems-ai *::before, .systems-ai *::after {animation:none!important;transition:none!important}
}

.systems-showcase-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(28px,4vw,64px);align-items:center}
.systems-showcase-layout .systems-copy{min-width:0}
.systems-showcase-layout .systems-copy h2{max-width:16ch;font-size:clamp(2rem,3vw,2.8rem);line-height:1.12;letter-spacing:-.04em;text-wrap:balance}
.systems-showcase-layout .systems-copy>p:not(.eyebrow){max-width:48ch;font-size:1rem;line-height:1.7}
.systems-showcase-layout .system-list{grid-template-columns:1fr}
.systems-showcase-layout .system-item{font-size:.85rem;line-height:1.45}
.systems-showcase-layout .system-item b{flex-shrink:0}
.systems-showcase-layout .sa-intro h2{font-size:clamp(1.8rem,2.8vw,2.55rem);line-height:1.12}
.systems-showcase-layout .systems-ai{padding:24px}
.systems-showcase-layout .sa-intro{margin-top:24px}
.systems-showcase-layout .sa-stage{height:335px}
.systems-showcase-layout .sa-core{width:154px;padding:18px 10px 14px}
.systems-showcase-layout .sa-orbit-three{width:330px;height:330px}
.systems-showcase-layout .sa-float{padding:7px;gap:6px}
.systems-showcase-layout .sa-float-left{left:0;top:18%}
.systems-showcase-layout .sa-float-right{right:0;bottom:18%}
.systems-showcase-layout .sa-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.systems-showcase-layout .sa-tool b{font-size:11px}
.systems-showcase-layout .sa-tool small{font-size:10px}
.systems-showcase-layout .systems-ai{min-width:0}
.systems-showcase-layout .system-list{margin-top:24px;box-shadow:none;padding:20px}
.systems-ai.motion-paused *{animation-play-state:paused!important}
.systems-ai.motion-disabled *{animation:none!important;transition:none!important}
@media(max-width:1000px){.systems-showcase-layout{grid-template-columns:minmax(0,1fr);gap:32px}.systems-showcase-layout .systems-copy h2{max-width:24ch;font-size:clamp(2rem,5vw,2.8rem)}.systems-showcase-layout .system-list{grid-template-columns:repeat(2,minmax(0,1fr))}.systems-showcase-layout .systems-ai{max-width:680px}.systems-showcase-layout .sa-intro h2{font-size:clamp(1.8rem,5vw,2.6rem)}}
@media(max-width:650px){.systems-showcase-layout .systems-ai{padding:22px 14px}.systems-showcase-layout .sa-stage{height:320px}.systems-showcase-layout .sa-core{width:138px}.systems-showcase-layout .sa-top{flex-wrap:wrap}.systems-showcase-layout .sa-heading{font-size:9px}.systems-showcase-layout .sa-intro p{font-size:12px}.systems-showcase-layout .sa-float{display:none}.systems-showcase-layout .system-list{grid-template-columns:1fr}.systems-showcase-layout .systems-copy h2{max-width:22ch}.systems-showcase-layout .sa-node{padding:7px 5px;gap:4px}.systems-showcase-layout .sa-node b{font-size:9px}.systems-showcase-layout .sa-node span{font-size:13px}}
@media(max-width:380px){.sa-top{flex-wrap:wrap}.sa-float{display:none}.sa-node b{font-size:7px}.sa-node{gap:3px;padding:6px}.sa-core{width:128px}.sa-tool small{font-size:9px}.sa-tool b{font-size:11px}}
.seyam-particles{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at 75% 45%,rgba(18,100,255,.10),transparent 55%)}
#seyam-particle-canvas{display:block;width:100%;height:100%;opacity:.65}
@media(max-width:700px){#seyam-particle-canvas{opacity:.4}}
@media(prefers-reduced-motion:reduce){#seyam-particle-canvas{opacity:.3}}
