/* CR8R LABS — SECTION 06 / LIVING LOOP
   Isolated redesign. Scoped to #process only. */
#process.cr8r-s06{position:relative;overflow:hidden;background:radial-gradient(900px 560px at 78% 42%,rgba(53,86,255,.10),transparent 64%),radial-gradient(650px 520px at 16% 82%,rgba(0,213,255,.055),transparent 70%),#03050b!important;padding:clamp(110px,10vw,170px) 0 clamp(92px,9vw,145px)!important}
#process.cr8r-s06 .cr8r-s06-shell{position:relative;z-index:2}
#process.cr8r-s06 .cr8r-s06-intro{display:grid;grid-template-columns:1.05fr .65fr;gap:100px;align-items:end;margin-bottom:74px}
#process.cr8r-s06 .cr8r-s06-kicker{font-family:var(--mono);font-size:.55rem;letter-spacing:.19em;color:#62dcff;margin-bottom:24px}
#process.cr8r-s06 .cr8r-s06-intro h2{margin:0;font-size:clamp(4.4rem,6.4vw,8rem);line-height:.82;letter-spacing:-.09em;font-weight:500}
#process.cr8r-s06 .cr8r-s06-intro h2 em{font-style:normal;background:linear-gradient(100deg,var(--cyan),#6d80ff 38%,var(--pink) 70%,var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent}
#process.cr8r-s06 .cr8r-s06-intro-copy{padding-left:32px;position:relative}
#process.cr8r-s06 .cr8r-s06-intro-copy:before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:2px;border-radius:99px;background:linear-gradient(180deg,var(--cyan),var(--pink),var(--orange))}
#process.cr8r-s06 .cr8r-s06-intro-copy p{margin:0 0 25px;max-width:470px;font-size:1rem;line-height:1.7;color:#d7dee9}
#process.cr8r-s06 .cr8r-s06-live{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:.49rem;letter-spacing:.16em;color:#8997aa}
#process.cr8r-s06 .cr8r-s06-live i{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 16px rgba(25,217,255,.8);animation:s06Live 2s ease-in-out infinite}
#process.cr8r-s06 .cr8r-s06-system{height:510px;position:relative;border:1px solid rgba(255,255,255,.09);border-radius:34px;background:radial-gradient(circle at 50% 48%,rgba(78,105,255,.09),transparent 28%),linear-gradient(135deg,rgba(255,255,255,.025),rgba(255,255,255,.006));box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 35px 100px rgba(0,0,0,.22);overflow:hidden;isolation:isolate}
#process.cr8r-s06 .cr8r-s06-system:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(circle at center,black,transparent 76%);opacity:.5;pointer-events:none}
#process.cr8r-s06 .cr8r-s06-field{position:absolute;inset:0;pointer-events:none}
#process.cr8r-s06 .cr8r-s06-field-line{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(25,217,255,.20),transparent);transform-origin:center}
#process.cr8r-s06 .line-a{width:80%;left:10%;top:50%;transform:rotate(-8deg)}
#process.cr8r-s06 .line-b{width:68%;left:16%;top:49%;transform:rotate(20deg);opacity:.55}
#process.cr8r-s06 .line-c{width:55%;left:23%;top:50%;transform:rotate(72deg);opacity:.32}
#process.cr8r-s06 .cr8r-s06-pulse{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 18px 4px rgba(25,217,255,.7);opacity:.8}
#process.cr8r-s06 .pulse-a{left:23%;top:38%;animation:s06Travel 6s linear infinite}
#process.cr8r-s06 .pulse-b{right:24%;top:63%;animation:s06Travel 8s linear 2s infinite reverse}
#process.cr8r-s06 .cr8r-s06-track{position:absolute;left:13%;right:13%;top:50%;height:1px;background:linear-gradient(90deg,rgba(25,217,255,.10),rgba(25,217,255,.6),rgba(115,95,255,.65),rgba(240,34,185,.55),rgba(255,157,34,.28));box-shadow:0 0 22px rgba(25,217,255,.13)}
#process.cr8r-s06 .cr8r-s06-track span{position:absolute;top:50%;left:0;width:90px;height:3px;transform:translateY(-50%);border-radius:99px;background:linear-gradient(90deg,transparent,#fff,transparent);filter:blur(.2px);animation:s06Beam 4.8s ease-in-out infinite}
#process.cr8r-s06 .cr8r-s06-orbit{position:absolute;border:1px solid rgba(255,255,255,.06);border-radius:50%;pointer-events:none}
#process.cr8r-s06 .orbit-a{width:570px;height:570px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(22deg) scaleY(.36)}
#process.cr8r-s06 .orbit-b{width:760px;height:760px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-28deg) scaleY(.24);border-color:rgba(25,217,255,.055)}
#process.cr8r-s06 .cr8r-s06-node{position:absolute;width:118px;height:118px;border:0;background:none;color:#8794a8;padding:0;cursor:pointer;z-index:4;transform:translate(-50%,-50%);transition:color .35s ease,transform .45s cubic-bezier(.2,.8,.2,1);font:inherit}
#process.cr8r-s06 .cr8r-s06-node:hover{transform:translate(-50%,-50%) scale(1.07);color:#fff}
#process.cr8r-s06 .cr8r-s06-node.is-active{color:#fff}
#process.cr8r-s06 .cr8r-s06-node[data-s06-node="01"]{left:13%;top:50%}
#process.cr8r-s06 .cr8r-s06-node[data-s06-node="02"]{left:34%;top:50%}
#process.cr8r-s06 .cr8r-s06-node[data-s06-node="03"]{left:66%;top:50%}
#process.cr8r-s06 .cr8r-s06-node[data-s06-node="04"]{left:87%;top:50%}
#process.cr8r-s06 .node-core{position:absolute;left:50%;top:50%;width:40px;height:40px;transform:translate(-50%,-50%);display:grid;place-items:center;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:rgba(3,5,11,.86);box-shadow:0 0 0 9px rgba(255,255,255,.015),0 0 30px rgba(25,217,255,.08);transition:all .35s ease}
#process.cr8r-s06 .node-core i{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 18px currentColor}
#process.cr8r-s06 .is-active .node-core{width:54px;height:54px;border-color:rgba(25,217,255,.65);box-shadow:0 0 0 11px rgba(25,217,255,.035),0 0 42px rgba(25,217,255,.24)}
#process.cr8r-s06 .node-label{position:absolute;top:calc(50% + 42px);left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:.50rem;letter-spacing:.15em;white-space:nowrap}
#process.cr8r-s06 .node-no{position:absolute;left:50%;top:calc(50% - 54px);transform:translateX(-50%);font-family:var(--mono);font-size:.45rem;letter-spacing:.12em;opacity:.55}
#process.cr8r-s06 .cr8r-s06-readout{position:absolute;left:50%;top:50%;width:min(390px,35%);transform:translate(-50%,-50%);z-index:3;text-align:center;pointer-events:none}
#process.cr8r-s06 .readout-top{display:flex;justify-content:center;gap:12px;align-items:center;font-family:var(--mono);font-size:.46rem;letter-spacing:.16em;color:#708097;margin-bottom:18px}
#process.cr8r-s06 .readout-top span:first-child{color:#62dcff}
#process.cr8r-s06 .cr8r-s06-readout h3{margin:0 0 12px;font-size:clamp(2.3rem,3.5vw,4rem);line-height:.9;letter-spacing:-.06em;font-weight:500}
#process.cr8r-s06 .cr8r-s06-readout p{margin:0 auto;color:#aeb9ca;font-size:.84rem;line-height:1.55;max-width:350px}
#process.cr8r-s06 .readout-meta{margin:24px auto 0;display:flex;justify-content:center;gap:16px;align-items:center;font-family:var(--mono);font-size:.46rem;letter-spacing:.12em;color:#687892}
#process.cr8r-s06 .readout-arrow{font-size:.9rem;color:#dfe7f1}
#process.cr8r-s06 .cr8r-s06-footer{display:grid;grid-template-columns:repeat(4,1fr);margin-top:22px;border-top:1px solid rgba(255,255,255,.08);padding-top:18px;font-family:var(--mono);font-size:.47rem;letter-spacing:.15em;color:#68758a}
#process.cr8r-s06 .cr8r-s06-footer span:nth-child(2){text-align:center}#process.cr8r-s06 .cr8r-s06-footer span:nth-child(3){text-align:center}#process.cr8r-s06 .cr8r-s06-footer span:nth-child(4){text-align:right}
@keyframes s06Live{0%,100%{opacity:.45;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}
@keyframes s06Beam{0%{left:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:calc(100% - 90px);opacity:0}}
@keyframes s06Travel{0%{transform:translate3d(0,0,0);opacity:0}12%{opacity:.8}88%{opacity:.8}100%{transform:translate3d(280px,70px,0);opacity:0}}
@media (max-width:1200px) and (min-width:901px){#process.cr8r-s06 .cr8r-s06-intro{gap:60px}#process.cr8r-s06 .cr8r-s06-system{height:480px}#process.cr8r-s06 .cr8r-s06-node{width:100px;height:100px}}
@media (max-width:900px){
#process.cr8r-s06{padding:72px 0 64px!important;background:radial-gradient(520px 420px at 88% 38%,rgba(53,86,255,.11),transparent 65%),#03050b!important}
#process.cr8r-s06 .cr8r-s06-intro{display:block;margin-bottom:42px}
#process.cr8r-s06 .cr8r-s06-kicker{margin-bottom:18px;font-size:.48rem}
#process.cr8r-s06 .cr8r-s06-intro h2{font-size:clamp(3.35rem,13vw,5.2rem);line-height:.86}
#process.cr8r-s06 .cr8r-s06-intro-copy{margin-top:26px;padding-left:18px}
#process.cr8r-s06 .cr8r-s06-intro-copy p{font-size:.92rem;line-height:1.58;margin-bottom:18px}
#process.cr8r-s06 .cr8r-s06-system{height:590px;border-radius:28px}
#process.cr8r-s06 .cr8r-s06-track{left:50%;right:auto;top:13%;bottom:13%;width:1px;height:auto;background:linear-gradient(180deg,rgba(25,217,255,.12),rgba(25,217,255,.6),rgba(115,95,255,.65),rgba(240,34,185,.55),rgba(255,157,34,.2));box-shadow:none}
#process.cr8r-s06 .cr8r-s06-track span{width:3px;height:58px;left:50%;top:0;transform:translateX(-50%);animation:s06BeamMobile 4.8s ease-in-out infinite}
#process.cr8r-s06 .cr8r-s06-node{width:90px;height:90px}
#process.cr8r-s06 .cr8r-s06-node[data-s06-node="01"]{left:50%;top:14%}
#process.cr8r-s06 .cr8r-s06-node[data-s06-node="02"]{left:50%;top:34%}
#process.cr8r-s06 .cr8r-s06-node[data-s06-node="03"]{left:50%;top:66%}
#process.cr8r-s06 .cr8r-s06-node[data-s06-node="04"]{left:50%;top:86%}
#process.cr8r-s06 .node-label{top:calc(50% + 35px);left:calc(50% + 58px);transform:none;text-align:left}
#process.cr8r-s06 .node-no{left:calc(50% - 56px);top:50%;transform:translate(-100%,-50%)}
#process.cr8r-s06 .node-core{width:34px;height:34px}
#process.cr8r-s06 .is-active .node-core{width:48px;height:48px}
#process.cr8r-s06 .cr8r-s06-readout{left:50%;top:50%;width:74%;transform:translate(-50%,-50%)}
#process.cr8r-s06 .cr8r-s06-readout h3{font-size:2.15rem}
#process.cr8r-s06 .cr8r-s06-readout p{font-size:.78rem;max-width:280px}
#process.cr8r-s06 .readout-meta{margin-top:17px;font-size:.42rem}
#process.cr8r-s06 .orbit-a{width:460px;height:460px;transform:translate(-50%,-50%) rotate(22deg) scaleY(.58)}
#process.cr8r-s06 .orbit-b{width:560px;height:560px;transform:translate(-50%,-50%) rotate(-28deg) scaleY(.42)}
#process.cr8r-s06 .cr8r-s06-footer{display:flex;gap:16px;overflow:auto;white-space:nowrap;scrollbar-width:none;margin-top:17px;padding-top:15px}
#process.cr8r-s06 .cr8r-s06-footer::-webkit-scrollbar{display:none}
#process.cr8r-s06 .cr8r-s06-footer span{text-align:left!important;flex:0 0 auto}
}
@keyframes s06BeamMobile{0%{top:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{top:calc(100% - 58px);opacity:0}}
@media (prefers-reduced-motion:reduce){#process.cr8r-s06 *{animation:none!important;transition:none!important}}