
/* =========================================================
   FELIX — GLOBAL SIDE TECHNOLOGY ECOSYSTEM
   Fixed visual layer only: ZERO layout footprint.
   Hidden below desktop gutter-safe breakpoint.
========================================================= */

.felix-side-ecosystem{
    position:fixed;
    inset:180px 0 12px 0;
    z-index:3;
    pointer-events:none;
    user-select:none;
    overflow:hidden;
    font-family:Inter,Arial,sans-serif;
}

.felix-side-ecosystem__side{
    position:absolute;
    top:0;
    bottom:0;
    width:190px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    padding:22px 8px;
}

.felix-side-ecosystem__side--left{left:4px}
.felix-side-ecosystem__side--right{right:4px}

.felix-side-ecosystem__circuits{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:.72;
}

.felix-side-ecosystem__circuits path,
.felix-side-ecosystem__circuits line{
    fill:none;
    stroke:rgba(0,212,255,.30);
    stroke-width:1.2;
    vector-effect:non-scaling-stroke;
}

.felix-side-ecosystem__circuits .purple{
    stroke:rgba(139,92,246,.30);
}

.felix-side-ecosystem__circuits circle{
    fill:#00D4FF;
    opacity:.9;
    filter:drop-shadow(0 0 5px rgba(0,212,255,.85));
}

.felix-side-ecosystem__side--right .felix-side-ecosystem__circuits{
    transform:scaleX(-1);
}

.felix-side-ecosystem__node{
    position:relative;
    width:170px;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    transform:translateY(0);
    opacity:.96;
    transition:
        transform .35s ease,
        opacity .35s ease,
        filter .35s ease;
}

.felix-side-ecosystem__node.is-active{
    transform:translateY(-4px);
    filter:drop-shadow(0 0 14px rgba(0,212,255,.24));
}

.felix-side-ecosystem__node::before{
    content:"";
    position:absolute;
    left:50%;
    top:30px;
    width:88px;
    height:88px;
    transform:translateX(-50%);
    border:1px solid rgba(0,212,255,.18);
    border-radius:50%;
    box-shadow:
        0 0 18px rgba(0,212,255,.10),
        inset 0 0 18px rgba(0,212,255,.05);
    animation:felixSideHalo 3.8s ease-in-out infinite;
}

.felix-side-ecosystem__icon{
    position:relative;
    z-index:2;
    width:66px;
    height:66px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(0,212,255,.70);
    border-radius:50%;
    background:
        radial-gradient(circle at 35% 30%,rgba(0,212,255,.18),rgba(10,18,38,.96) 58%),
        rgba(5,9,24,.90);
    box-shadow:
        0 0 0 1px rgba(0,212,255,.10),
        0 0 18px rgba(0,212,255,.38),
        0 0 36px rgba(0,212,255,.18);
    color:#7BEAFF;
    font-size:24px;
    text-shadow:
        0 0 9px rgba(0,212,255,.90);
    animation:felixSideIconPulse 3.8s ease-in-out infinite;
}

.felix-side-ecosystem__node:nth-child(even) .felix-side-ecosystem__icon{
    color:#A892FF;
    border-color:rgba(139,92,246,.68);
    box-shadow:
        0 0 0 1px rgba(139,92,246,.10),
        0 0 18px rgba(139,92,246,.32),
        0 0 36px rgba(0,212,255,.13);
    text-shadow:0 0 9px rgba(139,92,246,.80);
}

.felix-side-ecosystem__label{
    position:relative;
    z-index:2;
    margin-top:13px;
    color:#F4F8FF;
    font-size:11px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
    text-shadow:0 0 8px rgba(0,0,0,.75);
}

.felix-side-ecosystem__sub{
    position:relative;
    z-index:2;
    margin-top:4px;
    color:rgba(160,190,220,.72);
    font-size:8px;
    font-weight:700;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.felix-side-ecosystem__trace{
    position:absolute;
    top:63px;
    width:76px;
    height:1px;
    background:linear-gradient(90deg,transparent,#00D4FF,transparent);
    box-shadow:0 0 9px rgba(0,212,255,.35);
    opacity:.68;
}

.felix-side-ecosystem__side--left .felix-side-ecosystem__trace{right:-4px}
.felix-side-ecosystem__side--right .felix-side-ecosystem__trace{left:-4px}

.felix-side-ecosystem__trace::before,
.felix-side-ecosystem__trace::after{
    content:"";
    position:absolute;
    top:50%;
    width:4px;
    height:4px;
    transform:translateY(-50%);
    border-radius:50%;
    background:#00D4FF;
    box-shadow:0 0 8px rgba(0,212,255,.90);
}

.felix-side-ecosystem__trace::before{left:8px}
.felix-side-ecosystem__trace::after{right:8px}

.felix-side-ecosystem__packet{
    position:absolute;
    top:50%;
    left:0;
    width:5px;
    height:5px;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:#FFFFFF;
    box-shadow:
        0 0 7px rgba(255,255,255,.85),
        0 0 16px rgba(0,212,255,.95);
    animation:felixSidePacket 2.8s linear infinite;
}

.felix-side-ecosystem__side--right .felix-side-ecosystem__packet{
    animation-delay:-1.3s;
}

@keyframes felixSidePacket{
    0%{left:0;opacity:0}
    12%{opacity:1}
    88%{opacity:1}
    100%{left:100%;opacity:0}
}

@keyframes felixSideHalo{
    0%,100%{transform:translateX(-50%) scale(.96);opacity:.45}
    50%{transform:translateX(-50%) scale(1.05);opacity:.85}
}

@keyframes felixSideIconPulse{
    0%,100%{transform:scale(.98)}
    50%{transform:scale(1.03)}
}

/* =========================================================
   FELIX SIDE ECOSYSTEM — icon + circuit refinement
========================================================= */
.felix-side-ecosystem__circuits{opacity:.82;mix-blend-mode:screen}
.felix-side-ecosystem__circuits path{
    fill:none;
    stroke-width:1.15;
    vector-effect:non-scaling-stroke;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-dasharray:4 12;
    animation:felixCircuitFlow 5.6s linear infinite;
}
.felix-side-ecosystem__circuits path.purple{stroke:rgba(139,92,246,.42)}
.felix-side-ecosystem__circuits path.cyan{stroke:rgba(0,212,255,.44)}
.felix-side-ecosystem__circuits circle{
    fill:#7BEAFF;
    filter:drop-shadow(0 0 5px rgba(0,212,255,.92));
    animation:felixCircuitNode 2.7s ease-in-out infinite;
}
.felix-side-ecosystem__circuits circle:nth-of-type(2n){animation-delay:-1.1s}
.felix-side-ecosystem__circuits circle:nth-of-type(3n){
    fill:#A892FF;
    filter:drop-shadow(0 0 5px rgba(139,92,246,.92));
}
.felix-side-ecosystem__node{width:176px}
.felix-side-ecosystem__icon{
    width:70px;height:70px;
    background:
        radial-gradient(circle at 35% 28%,rgba(0,212,255,.24),rgba(7,14,34,.96) 58%),
        linear-gradient(145deg,rgba(0,212,255,.07),rgba(139,92,246,.07));
    border:1px solid rgba(0,212,255,.62);
    box-shadow:
        0 0 0 1px rgba(0,212,255,.08),
        0 0 20px rgba(0,212,255,.36),
        0 0 48px rgba(0,212,255,.15),
        inset 0 0 22px rgba(0,212,255,.08);
}
.felix-side-ecosystem__icon::before{
    content:"";
    position:absolute;inset:7px;
    border:1px dashed rgba(123,234,255,.25);
    border-radius:50%;
    animation:felixIconRing 6s linear infinite;
}
.felix-side-ecosystem__icon svg{
    position:relative;z-index:2;
    width:34px;height:34px;
    fill:none;stroke:currentColor;
    stroke-width:2.1;
    stroke-linecap:round;stroke-linejoin:round;
    filter:drop-shadow(0 0 6px currentColor);
}
.felix-side-ecosystem__node:nth-child(even) .felix-side-ecosystem__icon{
    color:#B59BFF;
    border-color:rgba(139,92,246,.62);
    box-shadow:
        0 0 0 1px rgba(139,92,246,.08),
        0 0 20px rgba(139,92,246,.34),
        0 0 48px rgba(0,212,255,.13),
        inset 0 0 22px rgba(139,92,246,.08);
}
.felix-side-ecosystem__node:nth-child(even) .felix-side-ecosystem__icon::before{
    border-color:rgba(181,155,255,.24);
}
.felix-side-ecosystem__node.is-active .felix-side-ecosystem__icon{
    transform:scale(1.06);
    box-shadow:
        0 0 0 1px rgba(255,255,255,.08),
        0 0 26px rgba(0,212,255,.52),
        0 0 62px rgba(0,212,255,.22),
        inset 0 0 26px rgba(0,212,255,.10);
}
.felix-side-ecosystem__node.is-active .felix-side-ecosystem__label{
    color:#FFFFFF;
    text-shadow:0 0 8px rgba(0,212,255,.62),0 0 20px rgba(0,212,255,.26);
}
.felix-side-ecosystem__label{font-size:10px;letter-spacing:.15em}
.felix-side-ecosystem__sub{font-size:7px;letter-spacing:.18em}
.felix-side-ecosystem__trace{width:92px;top:69px;opacity:.74}
.felix-side-ecosystem__trace::before,.felix-side-ecosystem__trace::after{width:5px;height:5px}
.felix-side-ecosystem__packet{width:6px;height:6px;animation-duration:2.35s}
@keyframes felixCircuitFlow{from{stroke-dashoffset:0}to{stroke-dashoffset:-64}}
@keyframes felixCircuitNode{0%,100%{opacity:.45;transform:scale(.75)}50%{opacity:1;transform:scale(1.2)}}
@keyframes felixIconRing{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@media (max-width:1440px) and (min-width:1280px){
    .felix-side-ecosystem__side{width:165px}
    .felix-side-ecosystem__node{width:154px}
    .felix-side-ecosystem__label{font-size:9px}
    .felix-side-ecosystem__sub{font-size:6px}
    .felix-side-ecosystem__trace{width:72px}
}

/* =========================================================
   FELIX SIDE ECOSYSTEM — per-service circuit network
========================================================= */
.felix-side-ecosystem__node{isolation:isolate}
.felix-side-ecosystem__microgrid{
    position:absolute;
    left:50%;
    top:-13px;
    width:176px;
    height:96px;
    transform:translateX(-50%);
    z-index:1;
    overflow:visible;
    opacity:.78;
    pointer-events:none;
}
.felix-side-ecosystem__microgrid path{
    fill:none;
    stroke:rgba(0,212,255,.42);
    stroke-width:1;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-dasharray:3 8;
    animation:felixMicroCircuit 4.6s linear infinite;
    filter:drop-shadow(0 0 3px rgba(0,212,255,.46));
}
.felix-side-ecosystem__microgrid circle{
    fill:#9EEFFF;
    opacity:.9;
    filter:drop-shadow(0 0 4px rgba(0,212,255,.9));
    animation:felixMicroNode 2.3s ease-in-out infinite;
}
.felix-side-ecosystem__microgrid circle:nth-of-type(2n){animation-delay:-.75s}
.felix-side-ecosystem__microgrid circle:nth-of-type(3n){fill:#B79CFF}
.felix-side-ecosystem__node:nth-child(even) .felix-side-ecosystem__microgrid path{
    stroke:rgba(139,92,246,.45);
    filter:drop-shadow(0 0 3px rgba(139,92,246,.46));
}
.felix-side-ecosystem__node:nth-child(even) .felix-side-ecosystem__microgrid circle{
    fill:#C4AEFF;
    filter:drop-shadow(0 0 4px rgba(139,92,246,.9));
}
.felix-side-ecosystem__side--right .felix-side-ecosystem__microgrid{
    transform:translateX(-50%) scaleX(-1);
}
.felix-side-ecosystem__icon,
.felix-side-ecosystem__label,
.felix-side-ecosystem__sub,
.felix-side-ecosystem__trace{
    position:relative;
    z-index:3;
}
.felix-side-ecosystem__node::before{z-index:2}
@keyframes felixMicroCircuit{
    from{stroke-dashoffset:0}
    to{stroke-dashoffset:-55}
}
@keyframes felixMicroNode{
    0%,100%{opacity:.36;transform:scale(.72)}
    50%{opacity:1;transform:scale(1.25)}
}

/* Animated energy traveling from node to node on the routed circuits. */
.felix-network__traces path{
    stroke-dasharray:2.5 7.5;
    animation:felixNetworkDash 7s linear infinite;
}
.felix-network__energy{
    fill:none!important;
    stroke:#FFFFFF!important;
    stroke-width:2.2!important;
    stroke-linecap:round!important;
    stroke-dasharray:1.35 98.65!important;
    opacity:0;
    filter:drop-shadow(0 0 4px rgba(255,255,255,.95)) drop-shadow(0 0 9px rgba(0,212,255,.9));
    animation:felixEnergyTravel 3.6s linear infinite!important;
    pointer-events:none;
}
.felix-network__traces path.blue{stroke:rgba(70,160,255,.48)}
.felix-network__traces path.purple{stroke:rgba(139,92,246,.5)}
.felix-network__traces path.cyan{stroke:rgba(0,212,255,.56)}
.felix-network__junctions circle{
    fill:#061126;
    stroke:#00D4FF;
    stroke-width:1;
    filter:drop-shadow(0 0 5px rgba(0,212,255,.75));
}
@keyframes felixNetworkDash{
    from{stroke-dashoffset:0}
    to{stroke-dashoffset:-40}
}
@keyframes felixEnergyTravel{
    0%{stroke-dashoffset:100;opacity:0}
    8%{opacity:1}
    88%{opacity:1}
    100%{stroke-dashoffset:0;opacity:0}
}
@media (prefers-reduced-motion:reduce){
    .felix-network__traces path,.felix-network__energy{animation:none!important}
}

/* =========================================================
   FELIX — REAL TECHNOLOGY NETWORK around service icons
========================================================= */
.felix-tech-network{
    position:absolute;
    left:50%;
    top:-38px;
    width:210px;
    height:150px;
    transform:translateX(-50%);
    z-index:1;
    overflow:visible;
    pointer-events:none;
    opacity:.92;
}
.felix-side-ecosystem__side--right .felix-tech-network{
    transform:translateX(-50%) scaleX(-1);
}
.felix-tech-network__traces path{
    fill:none;
    stroke-width:1.25;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-dasharray:3 9;
    vector-effect:non-scaling-stroke;
    opacity:.72;
}
.felix-tech-network__traces .cyan{stroke:rgba(0,212,255,.78)}
.felix-tech-network__traces .blue{stroke:rgba(79,172,254,.58)}
.felix-tech-network__traces .purple{stroke:rgba(139,92,246,.66)}
.felix-tech-network__terminals circle{
    fill:#071225;
    stroke:#69E8FF;
    stroke-width:1.15;
    filter:drop-shadow(0 0 4px rgba(0,212,255,.88));
}
.felix-tech-network__terminals circle:nth-child(3n){
    stroke:#B49BFF;
    filter:drop-shadow(0 0 4px rgba(139,92,246,.9));
}
.felix-tech-network__energy{
    fill:none!important;
    stroke:#FFFFFF!important;
    stroke-width:2.3!important;
    stroke-linecap:round!important;
    stroke-dasharray:1.8 98.2!important;
    opacity:0;
    filter:
        drop-shadow(0 0 4px rgba(255,255,255,1))
        drop-shadow(0 0 9px rgba(0,212,255,.98))
        drop-shadow(0 0 15px rgba(139,92,246,.42));
    animation:felixTechEnergy 3.1s linear infinite!important;
}
.felix-tech-network__traces path{
    animation:felixTechCircuit 6.5s linear infinite;
}
.felix-tech-network__traces path:nth-child(3n){animation-delay:-2s}
.felix-tech-network__traces path:nth-child(4n){animation-delay:-4s}
@keyframes felixTechCircuit{
    from{stroke-dashoffset:0}
    to{stroke-dashoffset:-48}
}
@keyframes felixTechEnergy{
    0%{stroke-dashoffset:100;opacity:0}
    6%{opacity:1}
    86%{opacity:1}
    100%{stroke-dashoffset:0;opacity:0}
}
@media (max-width:1440px) and (min-width:1280px){
    .felix-tech-network{top:-35px;width:190px}
}
@media (prefers-reduced-motion:reduce){
    .felix-tech-network__traces path,
    .felix-tech-network__energy{animation:none!important}
}

/* REFINED PCB NETWORK — hide the old full-height rails; keep only radial node networks */
.felix-side-ecosystem__circuits{display:none!important}
.felix-side-ecosystem__microgrid{display:none!important}

.felix-side-ecosystem__node{
    width:180px;
    min-height:150px;
    overflow:visible;
}
.felix-side-ecosystem__node::before{
    top:31px;
    width:82px;
    height:82px;
    z-index:2;
}
.felix-side-ecosystem__icon{z-index:5}
.felix-side-ecosystem__label,
.felix-side-ecosystem__sub{z-index:6}

.felix-tech-network{
    position:absolute;
    left:50%;
    top:-47px;
    width:228px;
    height:180px;
    transform:translateX(-50%);
    overflow:visible;
    z-index:1;
    pointer-events:none;
}
.felix-side-ecosystem__side--right .felix-tech-network{
    transform:translateX(-50%) scaleX(-1);
}
.felix-tech-network__traces{
    opacity:.96;
}
.felix-tech-network__traces path{
    fill:none;
    stroke-width:1.25;
    stroke-linecap:round;
    stroke-linejoin:miter;
    stroke-dasharray:none!important;
    vector-effect:non-scaling-stroke;
    animation:none!important;
}
.felix-tech-network__traces .cyan{stroke:rgba(0,212,255,.72)}
.felix-tech-network__traces .blue{stroke:rgba(64,153,255,.56)}
.felix-tech-network__traces .purple{stroke:rgba(151,101,255,.68)}

.felix-tech-network__terminals circle{
    fill:#071125;
    stroke:#65E6FF;
    stroke-width:1;
    filter:drop-shadow(0 0 3px rgba(0,212,255,.9));
    animation:felixPCBNode 2.4s ease-in-out infinite;
}
.felix-tech-network__terminals circle:nth-child(3n),
.felix-tech-network__terminals circle:nth-child(3n+1){
    animation-delay:-.8s;
}
.felix-side-ecosystem__side--right .felix-tech-network__terminals circle{
    stroke:#B39AFF;
    filter:drop-shadow(0 0 3px rgba(139,92,246,.9));
}

.felix-tech-network__energy{
    fill:none!important;
    stroke:#FFFFFF!important;
    stroke-width:2.4!important;
    stroke-linecap:round!important;
    stroke-dasharray:1.6 98.4!important;
    opacity:0;
    filter:
      drop-shadow(0 0 3px #fff)
      drop-shadow(0 0 7px rgba(0,212,255,.95))
      drop-shadow(0 0 13px rgba(139,92,246,.55));
    animation:felixPCBTravel 2.9s linear infinite!important;
}
.felix-tech-network__energy:nth-of-type(2n){
    animation-duration:3.4s!important;
}
.felix-tech-network__energy:nth-of-type(3n){
    animation-duration:2.55s!important;
}
@keyframes felixPCBTrace{
    from{stroke-dashoffset:0}
    to{stroke-dashoffset:-44}
}
@keyframes felixPCBTravel{
    0%{stroke-dashoffset:100;opacity:0}
    7%{opacity:1}
    88%{opacity:1}
    100%{stroke-dashoffset:0;opacity:0}
}
@keyframes felixPCBNode{
    0%,100%{opacity:.5;transform:scale(.78)}
    50%{opacity:1;transform:scale(1.18)}
}
@media (max-width:1440px) and (min-width:1280px){
    .felix-tech-network{width:205px;top:-43px}
    .felix-side-ecosystem__node{width:165px}
}
@media (prefers-reduced-motion:reduce){
    .felix-tech-network__traces path,
    .felix-tech-network__energy,
    .felix-tech-network__terminals circle{animation:none!important}
}

/* Static technology circles/rings — no forward/back movement. */
.felix-side-ecosystem__node::before,
.felix-side-ecosystem__icon,
.felix-tech-network__terminals circle{
    animation:none!important;
}
.felix-side-ecosystem__node::before{
    transform:translateX(-50%)!important;
    opacity:.7!important;
}
.felix-side-ecosystem__icon{
    transform:none!important;
}
.felix-tech-network__terminals circle{
    transform:none!important;
    opacity:.9!important;
}

/* MOVING ENERGY DOT — travels over the solid PCB traces */
.felix-tech-network__energy{
    fill:none!important;
    stroke:#FFFFFF!important;
    stroke-width:2.8!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
    stroke-dasharray:1.05 98.95!important;
    stroke-dashoffset:100;
    opacity:0;
    filter:
        drop-shadow(0 0 3px rgba(255,255,255,1))
        drop-shadow(0 0 8px rgba(0,212,255,1))
        drop-shadow(0 0 15px rgba(0,212,255,.72));
    animation:felixPCBTravellingEnergy 2.5s linear infinite!important;
    pointer-events:none!important;
}
.felix-tech-network__energy:nth-of-type(3n){
    animation-duration:3.1s!important;
}
.felix-tech-network__energy:nth-of-type(4n){
    animation-duration:2.1s!important;
}
@keyframes felixPCBTravellingEnergy{
    0%{stroke-dashoffset:100;opacity:0}
    5%{opacity:1}
    15%{opacity:1}
    88%{opacity:1}
    100%{stroke-dashoffset:0;opacity:0}
}

/* Keep the layer visually out of the header and main content gutters. */
@media (max-width:1279px){
    .felix-side-ecosystem{display:none}
}

@media (prefers-reduced-motion:reduce){
    .felix-side-ecosystem__packet,
    .felix-side-ecosystem__node::before,
    .felix-side-ecosystem__icon{animation:none!important}
    .felix-side-ecosystem__node{transition:none!important}
}
