*{box-sizing:border-box}html{color-scheme:dark;scroll-behavior:smooth}body{margin:0;background:#040d20;color:#eef7ff;font-family:Arial,Helvetica,sans-serif;background-image:radial-gradient(ellipse at 32% 52%,#07345c66,transparent 55%)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit}header,footer{max-width:1480px;margin:auto;padding:28px 4%;display:flex;justify-content:space-between;align-items:center}.brand{text-decoration:none;letter-spacing:2px;font-weight:800;font-size:19px}.brand b{color:#35dafa}.preview,.eyebrow{font-size:12px;letter-spacing:2.4px;color:#72dff3;font-weight:700}.preview{color:#8ca4be;letter-spacing:1.6px}.intro{max-width:1400px;margin:34px auto 0;padding:0 4%}h1{font-size:clamp(32px,3.3vw,52px);line-height:1.12;letter-spacing:-1.8px;margin:18px 0 22px}h1 span{background:linear-gradient(100deg,#177fff,#43e5f4);color:transparent;background-clip:text}.intro>p:last-child{color:#a9bdd1;font-size:17px;line-height:1.65}.experience{max-width:1480px;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr);margin:24px auto 40px;padding:0 4%;gap:38px;align-items:center}.orbit{height:510px;position:relative}.ellipse{position:absolute;inset:94px 85px 95px;border:1px solid #207bb389;border-radius:50%;box-shadow:0 0 70px #066eff0b,inset 0 0 55px #039eff08}.ellipse:after{content:'';position:absolute;inset:19px -21px;border:1px dashed #27688865;border-radius:50%}.core{position:absolute;width:270px;height:270px;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center}.core img{width:100%;height:auto;position:absolute;inset:0;object-fit:contain;filter:drop-shadow(0 0 20px #087cff40)}.core>div{position:relative;text-align:center;margin-top:-2px}.core span{font-size:15px;letter-spacing:2px;display:block}.core strong{display:block;font-size:53px;letter-spacing:2px;line-height:1.1}.core small{font-size:10px;color:#8edbec;display:block;margin-top:6px}.node{position:absolute;width:230px;min-height:68px;background:linear-gradient(110deg,#092440,#07152a);border:1px solid #27516e;border-radius:10px;padding:13px;display:flex;text-align:left;align-items:center;gap:10px;color:#d6e6f6;font-size:16px;font-weight:600;line-height:1.25;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}.node:hover{border-color:#56cee5;transform:translateY(-3px)}.node[aria-selected=true]{background:linear-gradient(110deg,#074eb0,#087caa);border-color:#53def7;color:white;box-shadow:0 0 25px #0079ff26}.num{font-size:11px;color:#f5c65e;font-weight:700}.arrow{margin-left:auto;color:#75dbea}.n0{left:50%;top:4px;margin-left:-115px}.n1{right:0;top:125px}.n2{right:0;bottom:125px}.n3{left:50%;bottom:4px;margin-left:-115px}.n4{left:0;bottom:125px}.n5{left:0;top:125px}.orbit-note{position:absolute;bottom:-35px;width:100%;text-align:center;font-size:12px;color:#7698b6}.details{border-left:1px solid #246080;padding:25px 0 25px 34px;min-height:370px}.panel h2{font-size:clamp(27px,2.4vw,39px);line-height:1.12;letter-spacing:-1px;margin:18px 0}.panel h3{font-size:19px;font-weight:500;color:#b9eaff;line-height:1.4}.panel p{font-size:16px;line-height:1.75;color:#adc1d6}.panel .scope{color:#e1b85d;font-size:12px;line-height:1.8;margin:23px 0}.cta{border:0;border-radius:6px;background:linear-gradient(110deg,#0868ed,#0ab7d0);color:white;padding:16px 20px;font-size:15px;font-weight:700;cursor:pointer;display:inline-flex;gap:25px;align-items:center}.cta:hover{filter:brightness(1.15)}.closing{text-align:center;margin:65px 20px 35px;color:#e1b85d;font-size:14px}.closing span{color:#8ca7c1}footer{border-top:1px solid #183044;color:#7190ac;font-size:11px;letter-spacing:.6px}dialog{background:#081d34;color:#eff8ff;border:1px solid #28799e;border-radius:14px;max-width:560px;width:calc(100% - 32px);padding:40px}dialog::backdrop{background:#010815dc;backdrop-filter:blur(5px)}dialog h2{font-size:30px}dialog p{line-height:1.7;color:#b3c9df}dialog #topic{color:#54def3;font-size:20px}.close{position:absolute;right:15px;top:10px;background:none;border:0;color:white;font-size:30px;cursor:pointer}.demo-note{font-size:13px}.skip{position:fixed;left:15px;top:-100px;z-index:10;background:#fff;color:#001b38;padding:14px}.skip:focus{top:10px}:focus-visible{outline:3px solid #ffd36b;outline-offset:5px}[hidden]{display:none!important}
@media(min-width:1400px){.node{width:245px}.n0,.n3{margin-left:-122px}.core{width:300px;height:300px}}
@media(max-width:1050px){.experience{grid-template-columns:1fr;max-width:820px}.details{border-left:0;border-top:1px solid #246080;padding:30px 0;min-height:0}.orbit{height:500px}.intro{max-width:820px}.panel h2{font-size:34px}}
@media(max-width:600px){header{padding:22px 6%}.preview{font-size:9px;letter-spacing:1px}.brand{font-size:14px}.intro{margin-top:15px;padding:0 6%}h1{letter-spacing:-1px;font-size:34px}.intro>p:last-child{font-size:15px}.intro br{display:block}.experience{display:block;padding:0 6%;margin-top:20px}.orbit{height:auto;padding-top:210px}.ellipse{display:none}.core{top:0;transform:translateX(-50%);width:210px;height:210px}.core strong{font-size:41px}.core span{font-size:12px}.core small{font-size:9px}.nodes{display:grid;gap:0}.node{position:static;margin:0;width:100%;border:0;border-bottom:1px solid #204157;border-radius:0;min-height:62px;font-size:17px;background:transparent;padding:15px 10px}.node:hover{transform:none}.node[aria-selected=true]{box-shadow:none;border-left:3px solid #45e0f3;background:linear-gradient(90deg,#064a91,#082037)}.orbit-note{position:static;margin:20px 0}.details{padding:25px 0}.panel h2{font-size:32px}.closing{text-align:left;margin:25px 6%;line-height:1.8}.closing span{display:block}footer{padding:22px 6%;gap:20px;line-height:1.6}dialog{padding:30px 24px}}
.xr-choices{display:grid;margin:25px 0}.xr-choices button{background:none;color:#dff8ff;border:0;border-bottom:1px solid #265573;padding:20px 0;text-align:left;display:flex;justify-content:space-between;font-size:22px;cursor:pointer}.xr-choices button:hover{color:#4bdff7}.xr-back{margin-top:25px;background:none;border:0;color:#f3cb75;font-size:15px;cursor:pointer;padding:10px 0}.xr-detail h3{font-size:26px;color:#69def3}.demo-status{font-size:14px;border-left:2px solid #39c9e0;padding-left:15px}.demo-status:empty{display:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.node:hover{transform:none}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Conexiones decorativas: sólo cambia la selección, sin animación continua. */
.circuits{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.circuit path{fill:none;stroke:#216285;stroke-width:1.3;vector-effect:non-scaling-stroke}.circuit circle{fill:#09253d;stroke:#367c9b;stroke-width:1.3;vector-effect:non-scaling-stroke}.circuit.active path{stroke:#45e2ff;stroke-width:2.2;filter:drop-shadow(0 0 4px #12bded66)}.circuit.active circle{fill:#88f1ff;stroke:#b5f7ff;stroke-width:1.6}.ellipse{opacity:.4}@media(max-width:600px){.circuits{display:none}}

.core:before{content:'';position:absolute;inset:8%;border-radius:50%;background:#06152b}
/* Dos pistas por rama: azul y oro, sin movimiento continuo. */
.circuit .trace-blue{stroke:#246d94;stroke-width:1.2}
.circuit .trace-gold{stroke:#8f743b;stroke-width:1.1}
.circuit.active .trace-blue{stroke:#56e4ff;stroke-width:1.8;filter:drop-shadow(0 0 3px #17bded55)}
.circuit.active .trace-gold{stroke:#f2c95c;stroke-width:1.6;filter:drop-shadow(0 0 3px #eebd4133)}/* Respuesta puntual al mouse: centro estatico, sin accion de boton. */
@media (hover:hover) and (pointer:fine){
.core img{transition:transform 240ms ease,filter 240ms ease}
.core:hover img{transform:scale(1.025);filter:drop-shadow(0 0 25px #19bfff70)}
}
@media(prefers-reduced-motion:reduce){.core:hover img{transform:none;transition:none}}/* Estados con la paleta presente en el SVG oficial. */
.node:hover{background:linear-gradient(110deg,#004ACA,#002075);border-color:#00D8F4;color:#FFFFFF}
.node[aria-selected=true]{background:linear-gradient(110deg,#0063DC,#004ACA 48%,#002075);border-color:#00D8F4;color:#FFFFFF;box-shadow:0 0 0 1px #00D8F433,0 0 25px #004ACA40}
.node:hover .arrow,.node[aria-selected=true] .arrow{color:#00D8F4}
.title-wordmark{display:block;width:min(440px,100%);height:auto;margin:0 0 16px;object-fit:contain}
/* Botones primarios: azules oficiales con texto blanco y foco celeste. */
.cta{background:linear-gradient(110deg,#004ACA,#002075);color:#FFFFFF;border:1px solid #0063DC}
.cta:hover{background:linear-gradient(110deg,#0063DC,#002075);border-color:#00D8F4;filter:none}
.cta:active{background:#002075;border-color:#00D8F4}
.cta:focus-visible{outline:3px solid #00D8F4;outline-offset:4px}