/* Avelo 2.0: additive architecture explorer, scoped and reversible */
.a2-ecosystem{padding:110px 0;background:radial-gradient(ellipse at 50% 15%,#23164b 0%,#11132c 52%,#0c1024 100%);color:#fff;overflow:hidden;position:relative}
.a2-ecosystem *{box-sizing:border-box}.a2-ecosystem .container{max-width:1190px;margin:auto;padding:0 24px}
.a2-intro{text-align:center;max-width:850px;margin:0 auto 42px}.a2-intro h2{font-size:clamp(2.2rem,4.6vw,4rem);line-height:1.12;letter-spacing:-.04em;color:#fff;margin:18px 0}.a2-intro h2 em{font-style:normal;color:#bca9ff}.a2-intro p{color:#c9c7dc;font-size:1.08rem;line-height:1.75}
.a2-shell{border:1px solid rgba(190,177,255,.22);border-radius:24px;background:linear-gradient(145deg,rgba(42,36,84,.76),rgba(13,17,39,.95));box-shadow:0 28px 80px #05061670;overflow:hidden}
.a2-topline,.a2-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 26px;color:#bfbcd6;font-size:.69rem;letter-spacing:.11em;font-weight:700}.a2-topline{border-bottom:1px solid #ffffff18}.a2-bottom{border-top:1px solid #ffffff18;letter-spacing:0;font-size:.83rem;font-weight:500}.a2-bottom a{color:#d6c9ff;text-decoration:none;font-weight:700}.a2-bottom a:hover{text-decoration:underline}.a2-pulse{display:inline-block;width:8px;height:8px;border-radius:50%;background:#69edbb;box-shadow:0 0 0 5px #69edbb18;margin-right:10px;animation:a2-pulse 2.5s infinite}
.a2-layout{display:grid;grid-template-columns:1.17fr 1fr;gap:20px;padding:30px}.a2-network{min-height:490px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;border-radius:20px;background:radial-gradient(ellipse at 50% 60%,#50358a45,transparent 66%);border:1px solid #ffffff12;padding:26px 18px}
.a2-system-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;width:100%;z-index:1}.a2-system{font:inherit;cursor:pointer;min-height:83px;border:1px solid #ffffff29;border-radius:13px;background:#211d40;color:#eae6ff;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;font-size:.82rem;transition:transform .23s,border-color .23s,background .23s,box-shadow .23s}.a2-system:hover,.a2-system:focus-visible{transform:translateY(-3px);border-color:#baa1ff;outline-offset:3px}.a2-system.is-selected{border-color:#be9fff;background:#50358d;box-shadow:0 0 27px #9667ff44}.a2-glyph{font-size:1.35rem;color:#dfd2ff}
.a2-conduit{height:78px;width:2px;background:linear-gradient(180deg,#8f71e0,#cbaaff);position:relative;opacity:.9}.a2-packet{width:10px;height:10px;background:#e4d6ff;box-shadow:0 0 17px #c8a5ff;border-radius:50%;position:absolute;left:-4px;top:0;animation:a2-stream 2.3s linear infinite}.a2-hub{min-width:240px;padding:24px 32px;border:1px solid #a98cff88;border-radius:18px;text-align:center;background:linear-gradient(135deg,#463178,#241c52);position:relative;isolation:isolate;box-shadow:0 15px 38px #03061466}.a2-hub small{display:block;font-size:.6rem;letter-spacing:.13em;color:#d5c9fa}.a2-hub strong{display:block;font-size:2rem;letter-spacing:-.04em;color:white;margin:6px 0}.a2-hub strong span{color:#ccb4ff}.a2-hub p{margin:0;color:#ded2ff;font-size:.8rem}.a2-hub-glow{position:absolute;inset:-10px;border:1px solid #9475da44;border-radius:24px;z-index:-1;animation:a2-halo 4s ease-in-out infinite}
.a2-inspector{padding:30px;border:1px solid #ffffff20;border-radius:20px;background:#14162de8;min-width:0}.a2-eyebrow{color:#bba5fc;letter-spacing:.13em;font-size:.7rem;font-weight:800;display:flex;justify-content:space-between;gap:16px}.a2-inspector h3{font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.2;color:#fff;margin:28px 0 12px}.a2-inspector>p{color:#c4c5d8;line-height:1.7;min-height:77px}.a2-flow{display:grid;gap:12px;margin:20px 0}.a2-flow>div{padding:12px 14px;border-left:2px solid #9574ee;background:#ffffff08;border-radius:0 9px 9px 0;display:grid;gap:5px}.a2-flow b{color:#c7aefc;font-size:.68rem;letter-spacing:.09em}.a2-flow span{color:#eeeefa;font-size:.87rem;line-height:1.5}.a2-safety{display:flex;flex-wrap:wrap;gap:8px}.a2-safety span{font-size:.68rem;border:1px solid #89d9b553;background:#2b795027;padding:7px 9px;border-radius:30px;color:#a4ebc9}
@keyframes a2-stream{from{transform:translateY(0);opacity:0}15%{opacity:1}85%{opacity:1}to{transform:translateY(75px);opacity:0}}@keyframes a2-pulse{50%{box-shadow:0 0 0 9px #69edbb08}}@keyframes a2-halo{50%{transform:scale(1.045);opacity:.4}}
@media(max-width:850px){.a2-layout{grid-template-columns:1fr;padding:16px}.a2-network{min-height:365px}.a2-ecosystem{padding:70px 0}.a2-inspector>p{min-height:0}}@media(max-width:470px){.a2-system-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.a2-system{min-height:72px;font-size:.67rem}.a2-topline,.a2-bottom{padding:14px 17px}.a2-hub{min-width:200px}.a2-inspector{padding:21px}.a2-network{padding:15px 9px}}
@media(prefers-reduced-motion:reduce){.a2-ecosystem *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
