:root{color-scheme:dark;--bg:#080d17;--fg:#eef5ff;--muted:#9aaac2;--line:#293a55;--blue:#5b9fff;--green:#a4df64;--orange:#ffad65;--cyan:#58e0da}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--fg)}body{overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 80% 20%,#20426973,transparent 42%),radial-gradient(ellipse at 12% 80%,#184a3a45,transparent 32%);z-index:-2}.grain{position:fixed;inset:0;pointer-events:none;opacity:.23;background-image:linear-gradient(#afc6ed0c 1px,transparent 1px),linear-gradient(90deg,#afc6ed0c 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 90%);z-index:-1}.shell{max-width:1350px;margin:auto;padding:25px clamp(22px,5vw,72px) 22px}.top{display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{display:flex;gap:12px;align-items:center;color:inherit;text-decoration:none}.logo{width:48px;height:48px}.brand strong{display:block;font-size:19px;letter-spacing:.05em}.brand small{font-size:10px;letter-spacing:.19em;color:var(--muted)}.top-right{display:flex;align-items:center;gap:20px}.server{color:#b4c8e5;font:600 11px ui-monospace,SFMono-Regular,monospace;letter-spacing:.14em;padding:10px 14px;border:1px solid #344961;border-radius:100px;background:#ffffff08}.help{text-decoration:none;color:white;border:1px solid #6f8cb0;padding:12px 20px;border-radius:100px;font-size:13px;font-weight:700;transition:.2s}.help:hover{background:#1f3d63}.main{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;min-height:calc(100vh - 210px);gap:30px}.eyebrow{display:flex;align-items:center;gap:9px;letter-spacing:.21em;text-transform:uppercase;color:var(--cyan);font-size:11px;font-weight:750}.dot{height:8px;width:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 17px var(--cyan)}h1{font-size:clamp(63px,8.8vw,133px);line-height:.9;letter-spacing:-.105em;margin:30px 0 8px;font-weight:850;white-space:nowrap}.word{display:flex;gap:.01em}.letter{display:inline-block;position:relative;user-select:none;touch-action:none;cursor:grab;will-change:transform}.letter:active{cursor:grabbing}.word .letter:first-child{color:var(--green)}.word:last-child .letter:first-child{color:var(--blue)}.headline-underline{height:6px;width:150px;background:linear-gradient(90deg,var(--green) 30%,var(--orange) 65%,var(--blue) 100%);border-radius:5px;margin:24px 0}.lead{font-size:clamp(17px,2.1vw,23px);line-height:1.45;max-width:530px;color:#c6d4e8;margin:0 0 24px}.buttons{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 32px}.btn{border:none;text-decoration:none;cursor:pointer;color:#07121a;background:var(--green);padding:15px 21px;border-radius:11px;font:750 14px inherit;font-size:14px;font-weight:800;display:inline-flex;align-items:center;gap:9px;transition:transform .18s,background .18s}.btn:hover{transform:translateY(-2px);background:#c4f58e}.btn.secondary{background:#ffffff0b;color:#edf4ff;border:1px solid #62718e}.btn.secondary:hover{background:#ffffff19}.hint{color:#8298b5;font-size:12px;display:flex;gap:8px;align-items:center}.key{border:1px solid #5c7395;padding:4px 8px;border-radius:6px;background:#172740;color:#f4f7ff;font-weight:800;font-size:13px}.scene{height:520px;position:relative;display:grid;place-items:center;isolation:isolate}.halo{position:absolute;width:min(430px,93%);aspect-ratio:1;border:1px solid #486786;border-radius:50%;box-shadow:inset 0 0 80px #183e5c66,0 0 100px #204b7270;animation:spin 45s linear infinite}.halo:before,.halo:after{content:"";position:absolute;inset:16%;border:1px dashed #86b4ed55;border-radius:50%}.halo:after{inset:-11%;border-style:solid;border-color:#4d709344}.orb{position:relative;width:300px;height:300px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 30% 25%,#305a74,#102037 56%,#0b1426);border:1px solid #6383a4;box-shadow:0 0 80px #3c83cb24, inset -25px -35px 70px #0008;animation:float 5s ease-in-out infinite}.orb svg{width:190px;height:190px;filter:drop-shadow(0 0 18px #75b9ff55)}.sat{position:absolute;z-index:3;border-radius:12px;border:1px solid #4f6d8f;background:#12253bcc;backdrop-filter:blur(6px);padding:14px 16px;box-shadow:0 14px 40px #0007;font-size:12px;color:#d6e6f6}.sat strong{display:block;color:white;font-size:14px;margin-top:4px}.sat.one{top:70px;left:5px;transform:rotate(-7deg)}.sat.two{bottom:73px;right:-5px;transform:rotate(5deg)}.sat.three{top:115px;right:-10px;transform:rotate(8deg)}.sat i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:4px}.dock{border-top:1px solid #2b3e58;display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:18px;color:#9caec8;font-size:12px}.dock a{color:#deedff;text-decoration:none}.countdown{display:flex;align-items:center;gap:13px}.progress{width:90px;height:4px;background:#1b2d44;border-radius:8px;overflow:hidden}.progress span{display:block;background:linear-gradient(90deg,var(--green),var(--blue));height:100%;width:100%;transform-origin:left}.pause{padding:6px 9px;background:#15263d;border:1px solid #415675;border-radius:7px;color:white;cursor:pointer;font-size:11px}.services{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}.service{font-size:11px;color:#b5c8dd;border:1px solid #42556e;padding:7px 10px;border-radius:100px;background:#15253c69}.foot{display:flex;justify-content:space-between;gap:12px;align-items:center;padding-top:16px;font-size:11px;color:#7286a1}.foot a{color:#b5c6e0;text-decoration:none}.foot a:hover{text-decoration:underline}.gravity-mode .letter{filter:drop-shadow(0 15px 13px #0007)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{50%{transform:translateY(-15px)}}@media(max-width:960px){.main{grid-template-columns:1fr;min-height:0;padding:60px 0 20px}.scene{height:370px;order:-1}.orb{width:220px;height:220px}.orb svg{width:155px}.halo{width:330px}.sat.one{left:0}.sat.two{right:0}.sat.three{right:0;top:45px}h1{font-size:clamp(64px,13vw,120px)}.foot{flex-wrap:wrap}}@media(max-width:520px){.shell{padding:18px}.top-right{gap:8px;flex-wrap:wrap;justify-content:flex-end}.server{display:inline-block;font-size:9px;padding:7px 9px;letter-spacing:.03em}.help{padding:10px 12px}.brand strong{font-size:15px}.logo{width:40px;height:40px}.main{padding-top:20px}.scene{height:320px}.halo{width:255px}.orb{width:185px;height:185px}.orb svg{width:125px}.sat{font-size:10px;padding:8px 10px}.sat strong{font-size:11px}.sat.one{top:23px}.sat.two{bottom:22px}.sat.three{top:64px}h1{font-size:clamp(58px,13.2vw,82px)}.dock{align-items:flex-start;flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){.orb,.halo{animation:none!important}.letter{transition:none!important}}

/* V2 — Interactive cosmic edition */
:root{--blue:#58baff;--green:#a8ef55;--cyan:#49e2eb}
body{background:#060b14;min-height:100svh}body:before{background:radial-gradient(ellipse at 71% 49%,#154c677a,transparent 37%),radial-gradient(ellipse at 0% 75%,#2b214f70,transparent 40%),radial-gradient(ellipse at 100% 0%,#153c4c6b,transparent 40%)}
.grain{opacity:.40;background-size:55px 55px}
.shell{max-width:1550px;padding-top:29px}.top{position:relative;z-index:20}.brand strong{letter-spacing:.11em}.brand small{color:#71c7f4}.help{border-color:#75b8ef;color:#edfcff;box-shadow:0 0 18px #56c6fe22}.help:hover{box-shadow:0 0 26px #56c6fe70}
.main{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:8px;min-height:calc(100svh - 192px)}.intro{position:relative;z-index:4}.eyebrow{color:#86dff2;font-size:10px;letter-spacing:.20em}
h1{font-size:clamp(65px,8vw,118px);line-height:.87;margin:29px 0 10px;letter-spacing:-.095em}.word{width:max-content}.word:last-of-type{letter-spacing:-.08em}.mexico{display:flex;position:relative;width:max-content;gap:.03em;margin-top:13px;letter-spacing:.14em;font-size:clamp(27px,3.8vw,57px);font-weight:850;line-height:1.1;color:#71cfff;text-shadow:0 0 40px #2b9fdc4d}.mexico .letter{background:linear-gradient(135deg,#fff 5%,#8ce7fc 58%,#5a98f7);color:transparent;background-clip:text}.mexico-dot{align-self:center;height:8px;width:8px;border-radius:50%;background:#a8ef55;box-shadow:0 0 18px #a8ef55}
.headline-underline{height:4px;width:180px;margin:26px 0}.lead{max-width:535px}.btn{border-radius:100px;padding:16px 22px}.btn.secondary{backdrop-filter:blur(10px)}.gravity-button{color:#06131c;border:1px solid #9ad9fd;background:#6acbf7;font-weight:800}.gravity-button:hover{background:#b4e8ff}.hint{flex-wrap:wrap}.service{background:#11283b88;border-color:#426784}.service:hover{border-color:#a8ef55;color:white}
.scene{height:615px;min-width:0;perspective:900px;overflow:visible;cursor:crosshair}.scene::before{content:"";position:absolute;width:80%;height:70%;top:14%;border-radius:50%;background:radial-gradient(ellipse,#48d1ff22,transparent 65%);filter:blur(40px);pointer-events:none}.scene::after{content:"";position:absolute;width:120px;height:120px;border:1px solid #62d3f855;border-radius:50%;inset:45% auto auto 43%;transform:translate(-50%,-50%);box-shadow:0 0 140px 70px #2c92a611;pointer-events:none}
.stars{position:absolute;inset:0;opacity:.9;pointer-events:none;background-image:radial-gradient(1px 1px at 10% 25%,#b9edff,transparent),radial-gradient(2px 2px at 71% 18%,#7aeef1,transparent),radial-gradient(1px 1px at 46% 13%,#b9edff,transparent),radial-gradient(2px 2px at 86% 62%,#b9edff,transparent),radial-gradient(1px 1px at 21% 76%,#b9edff,transparent),radial-gradient(2px 2px at 60% 85%,#a8ef55,transparent),radial-gradient(1px 1px at 90% 34%,#b9edff,transparent)}
.halo{width:min(490px,85%);border-color:#66c9f655;box-shadow:inset 0 0 70px #133e5a66,0 0 120px #204b7270;animation:spin 65s linear infinite}.halo:after{inset:-13%;border-color:#6cd6f426}.orbit{pointer-events:none;position:absolute;width:min(570px,98%);height:235px;border:1px solid #5ce4e846;border-radius:50%;transform:rotate(-35deg);box-shadow:0 0 16px #47d9fc08}.orbit-b{transform:rotate(40deg);border-color:#c1fa7840;height:270px}
.orb{width:290px;height:290px;border-color:#70c5d7;background:radial-gradient(circle at 30% 20%,#365a77,#12263c 56%,#091524);box-shadow:0 0 0 9px #53cde80e,0 0 0 24px #53cde808,0 0 120px #33cbda33,inset -25px -35px 70px #000a;animation:float 5.5s ease-in-out infinite;transition:box-shadow .3s}.orb svg{filter:drop-shadow(0 0 20px #84f8ff55)}.orb:hover{box-shadow:0 0 0 9px #53cde820,0 0 0 24px #53cde808,0 0 150px #33cbda60,inset -25px -35px 70px #000a}
.sat{z-index:8;padding:15px 17px;border:1px solid #69c5ee8a;background:linear-gradient(140deg,#193752eb,#101c33eb);box-shadow:0 18px 40px #0009,0 0 22px #56c6fe26;cursor:grab;touch-action:none;user-select:none;transition:border-color .2s,box-shadow .2s;min-width:150px;text-decoration:none}.sat:hover{border-color:#afffcb;box-shadow:0 18px 40px #0009,0 0 35px #56c6fe6b}.sat:active{cursor:grabbing}.sat i{background:#a8ef55;box-shadow:0 0 9px #a8ef55}.sat small{display:block;font-size:9px;letter-spacing:.14em;color:#78c8e3;margin-top:10px}.sat.one{top:8%;left:3%;transform:rotate(-8deg)}.sat.two{bottom:8%;right:5%;transform:rotate(5deg)}.sat.three{top:10%;right:-1%;transform:rotate(8deg)}.sat.four{bottom:9%;left:-4%;transform:rotate(-5deg)}.node{position:absolute;z-index:6;cursor:grab;touch-action:none;user-select:none;font-weight:300;color:#a8ef55;text-shadow:0 0 24px #a8ef55;font-size:38px}.node-a{top:27%;left:14%}.node-b{top:30%;right:10%;color:#6bdff2}.node-c{bottom:22%;right:18%;font-size:28px;color:#e6aaff}.scene-note{position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;font:10px ui-monospace,monospace;letter-spacing:.2em;color:#6b94b2}
.gravity-mode .physics{box-shadow:0 10px 15px #0008}.gravity-mode .orbit{animation-play-state:paused}.gravity-mode .orb{animation-play-state:paused}.dock{position:relative;z-index:25;border-top-color:#365674}.pause{cursor:pointer}.physics{will-change:transform}.footer{z-index:5}
@media(max-width:1100px){.main{grid-template-columns:1fr 1fr}.scene{height:500px}.orb{width:235px;height:235px}.orb svg{width:155px}.sat{min-width:120px;padding:10px}.sat.one{left:-3%}.sat.three{right:-5%}.sat.four{left:-8%}}
@media(max-width:960px){.main{grid-template-columns:1fr}.scene{order:0;height:440px}.sat.one{left:10%}.sat.two{right:10%}.sat.three{right:8%}.sat.four{left:9%}.intro{padding-top:30px}.mexico{font-size:clamp(33px,6vw,58px)}}
@media(max-width:520px){.main{padding:16px 0}.intro{padding-top:22px}.scene{height:330px}.orb{width:172px;height:172px}.orb svg{width:122px}.halo{width:260px}.orbit{width:330px;height:140px}.orbit-b{height:160px}.sat{min-width:auto;padding:8px 9px;font-size:9px}.sat strong{font-size:10px}.sat small{display:none}.sat.one{left:0;top:6%}.sat.two{right:0;bottom:9%}.sat.three{right:-4%;top:9%}.sat.four{left:-2%;bottom:9%}.node{font-size:21px}.scene-note{font-size:8px}h1{font-size:clamp(59px,13.1vw,80px)}.mexico{font-size:clamp(28px,7vw,41px)}.hint{gap:7px}.gravity-button{font-size:10px}}
@media(prefers-reduced-motion:reduce){.orb,.halo{animation:none!important}.orbit{animation:none!important}}

/* ===================================================================
   V5 — Intro inmersiva + escenario holográfico
   =================================================================== */
:root{--holo:#9fe9ff;--ink:#04080f;--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace}

/* ---------- Intro ---------- */
.hx{position:fixed;inset:0;z-index:1000;background:var(--ink);color:#e8f6ff;overflow:hidden;display:none;--px:0;--py:0;--hold:0;--cy:42vh;--ret:560px;cursor:crosshair;user-select:none;-webkit-user-select:none;touch-action:none}
.intro-on .hx{display:block}
.intro-on body{overflow:hidden}
.hx[hidden]{display:none!important}
.hx-canvas{position:absolute;inset:0;display:block}
.hx-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 60% at 50% var(--cy),transparent 40%,#02050bcc 100%)}
.hx-scan{position:absolute;inset:0;pointer-events:none;opacity:.35;background:repeating-linear-gradient(to bottom,#9fe9ff08 0 1px,transparent 1px 3px);mix-blend-mode:screen}
.hx-scan:after{content:"";position:absolute;left:0;right:0;height:22vh;top:-22vh;background:linear-gradient(to bottom,transparent,#49e2eb10 70%,#49e2eb24 98%,transparent);animation:hxSweep 6.5s linear infinite}
@keyframes hxSweep{to{transform:translateY(144vh)}}
.hx-frame{position:absolute;inset:clamp(12px,2.2vw,28px);pointer-events:none}
.hx-frame i{position:absolute;width:34px;height:34px;border:1.5px solid #9fe9ff99;opacity:0;animation:hxIn .5s .15s forwards}
.hx-frame i:nth-child(1){top:0;left:0;border-right:0;border-bottom:0}.hx-frame i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0}
.hx-frame i:nth-child(3){bottom:0;left:0;border-right:0;border-top:0}.hx-frame i:nth-child(4){bottom:0;right:0;border-left:0;border-top:0}

.hx-top{position:absolute;top:clamp(22px,3.4vw,44px);left:clamp(30px,4vw,64px);right:clamp(30px,4vw,64px);display:flex;align-items:center;gap:18px;opacity:0;animation:hxIn .6s .3s forwards}
.hx-brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.08em;font-size:14px}
.hx-brand svg{width:28px;height:28px}
.hx-clock{margin-left:auto;font:500 12px var(--mono);color:#7fc4dd;letter-spacing:.12em}
.hx-skip{font:600 12px inherit;font-family:inherit;color:#cfe9f7;background:#0c1a2acc;border:1px solid #3f6a8a;border-radius:100px;padding:9px 16px;cursor:pointer;transition:border-color .2s,background .2s}
.hx-skip:hover{border-color:#9fe9ff;background:#13304a}
.hx button:focus-visible,.hx a:focus-visible{outline:2px solid #a8ef55;outline-offset:3px}

.hx-reticle{position:absolute;left:50%;top:var(--cy);width:var(--ret);height:var(--ret);transform:translate(-50%,-50%) rotateX(calc(var(--py)*-14deg)) rotateY(calc(var(--px)*16deg)) scale(calc(1 - var(--hold)*.08));pointer-events:none;opacity:0;animation:hxIn 1.2s 1.6s forwards;transition:transform .25s ease-out}
.hx-reticle .r-slow{transform-origin:300px 300px;animation:spin 60s linear infinite}
.hx-reticle .r-fast{transform-origin:300px 300px;animation:spin 9s linear infinite}
.hx-reticle .r-rev{transform-origin:300px 300px;animation:spin 24s linear infinite reverse}
.hx-holding .hx-reticle .r-fast{animation-duration:1.4s}

/* Paneles holográficos flotantes */
.hx-panel{position:absolute;top:calc(var(--cy) - 120px);width:min(260px,22vw);padding:16px 18px 18px;border:1px solid #49e2eb55;border-radius:4px 18px 4px 18px;
  background:linear-gradient(160deg,#0f2a3dcc,#07121ecc);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  box-shadow:0 0 0 1px #49e2eb14 inset,0 0 40px #49e2eb18,0 30px 60px #000a;opacity:0;clip-path:inset(0 0 100% 0);
  transition:transform .35s ease-out;animation:hxPanel .9s cubic-bezier(.2,.8,.2,1) forwards}
.hx-panel:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:repeating-linear-gradient(to bottom,#9fe9ff0a 0 1px,transparent 1px 4px)}
.hx-panel:after{content:"";position:absolute;width:56px;height:2px;top:-1px;left:18px;background:#a8ef55;box-shadow:0 0 12px #a8ef55}
.hx-left{left:clamp(30px,5vw,90px);transform:perspective(900px) rotateY(calc(18deg + var(--px)*-14deg)) rotateX(calc(var(--py)*10deg)) translateZ(0);animation-delay:2.1s}
.hx-right{right:clamp(30px,5vw,90px);transform:perspective(900px) rotateY(calc(-18deg + var(--px)*-14deg)) rotateX(calc(var(--py)*10deg));animation-delay:2.45s}
.hx-right:after{background:#58baff;box-shadow:0 0 12px #58baff;left:auto;right:18px}
.hx-panel h3{margin:0 0 12px;font-size:13px;font-weight:700;color:#eafcff;letter-spacing:.02em}
.hx-panel dl{margin:0;display:grid;gap:8px}
.hx-panel dl div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed #49e2eb26;padding-bottom:6px}
.hx-panel dt{font-size:11px;color:#7fa9c2}
.hx-panel dd{margin:0;font:600 11px var(--mono);color:#bff4ff;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:62%}
.hx-panel canvas{display:block;width:100%;height:auto;margin:2px 0 10px;border:1px solid #49e2eb1f;border-radius:6px;background:#03101a88}
.hx-bars{display:flex;align-items:flex-end;gap:4px;height:28px;margin-top:14px}
.hx-bars span{flex:1;background:linear-gradient(to top,#49e2eb,#a8ef55);border-radius:2px;opacity:.75;animation:hxBar 1.4s ease-in-out infinite alternate}
.hx-bars span:nth-child(3n){animation-duration:.9s}.hx-bars span:nth-child(4n+1){animation-duration:1.9s}.hx-bars span:nth-child(5n+2){animation-delay:-.6s}.hx-bars span:nth-child(2n){animation-delay:-1.1s}
@keyframes hxBar{from{height:18%}to{height:100%}}
@keyframes hxPanel{0%{opacity:0;clip-path:inset(0 0 100% 0)}40%{opacity:1}60%{opacity:.4}70%{opacity:1}100%{opacity:1;clip-path:inset(0 0 0 0)}}

/* Bitácora */
.hx-log{position:absolute;left:clamp(30px,4vw,64px);bottom:clamp(30px,4.5vw,60px);margin:0;padding:0;list-style:none;font:12px/1.9 var(--mono);color:#7fc4dd;max-width:36ch}
.hx-log li{animation:hxType .5s steps(24) both;white-space:nowrap;overflow:hidden}
.hx-log li:before{content:"›  ";color:#a8ef55}
.hx-log li:last-child{color:#dff8ff}
@keyframes hxType{from{max-width:0}to{max-width:40ch}}

/* Título */
.hx-center{position:absolute;left:0;right:0;top:calc(var(--cy) + var(--ret)*.5 + 8px);text-align:center;pointer-events:none}
.hx-title{margin:0;font-size:clamp(34px,5.4vw,78px);font-weight:850;letter-spacing:.32em;padding-left:.32em;line-height:1;color:#f2fbff;min-height:1em;
  text-shadow:-2px 0 #ffad6599,2px 0 #58baffaa,0 0 34px #49e2eb66;white-space:nowrap}
.hx-sub{margin:14px 0 0;font-size:clamp(13px,1.3vw,16px);color:#9fc6da;letter-spacing:.04em;opacity:0;animation:hxIn .8s 2.6s forwards}

/* Botón mantener para entrar */
.hx-enter{position:absolute;right:clamp(30px,4vw,64px);bottom:clamp(26px,4vw,52px);display:flex;align-items:center;gap:16px;opacity:0;animation:hxIn .8s 2.9s forwards}
.hx-hold{position:relative;width:104px;height:104px;border-radius:50%;border:0;background:none;color:#eafcff;cursor:pointer;display:grid;place-items:center;touch-action:none;-webkit-tap-highlight-color:transparent;font-family:inherit}
.hx-hold svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.hx-hold .trk{fill:#07131fcc;stroke:#49e2eb44;stroke-width:2}
.hx-hold .prg{fill:none;stroke:#a8ef55;stroke-width:4;stroke-linecap:round;stroke-dasharray:339.3;stroke-dashoffset:339.3;filter:drop-shadow(0 0 6px #a8ef55)}
.hx-hold-core{position:absolute;width:22px;height:22px;border-radius:50%;background:radial-gradient(circle,#fff,#a8ef55 45%,transparent 70%);box-shadow:0 0 22px #a8ef55;transform:scale(calc(.8 + var(--hold)*1.6));animation:hxPulse 1.6s ease-in-out infinite}
.hx-hold-label{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px;font-weight:700;color:#dff8ff}
.hx-hold:hover .trk{stroke:#9fe9ff}
.hx-holding .hx-hold-core{animation:none}
.hx-auto{margin:0 0 0;max-width:24ch;font-size:12px;line-height:1.5;color:#7fa9c2;text-align:right;order:-1}
.hx-auto b{color:#dff8ff;font-variant-numeric:tabular-nums}
.hx-nudge .hx-hold-label{animation:hxShake .45s}
.hx-nudge .hx-auto{color:#ffad65}
@keyframes hxPulse{50%{opacity:.55}}
@keyframes hxShake{25%{transform:translateX(calc(-50% - 5px))}75%{transform:translateX(calc(-50% + 5px))}}
@keyframes hxIn{to{opacity:1}}

/* Entrada y salida */
.hx-flash{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% var(--cy),#ffffff 0%,#bff4ff 30%,#49e2eb00 70%);opacity:0}
.hx-entering .hx-panel,.hx-entering .hx-log,.hx-entering .hx-enter,.hx-entering .hx-top{transition:opacity .5s,transform .7s cubic-bezier(.6,0,.8,.2);opacity:0!important}
.hx-entering .hx-left{transform:perspective(900px) rotateY(60deg) translateX(-120px)}
.hx-entering .hx-right{transform:perspective(900px) rotateY(-60deg) translateX(120px)}
.hx-entering .hx-reticle{transition:transform 1.2s cubic-bezier(.6,0,.4,1),opacity 1s;transform:translate(-50%,-50%) scale(2.4);opacity:0!important}
.hx-flying .hx-flash{transition:opacity .9s ease-in;opacity:.85}
.hx-flying .hx-center{transition:transform .9s cubic-bezier(.6,0,.8,.2),opacity .8s;transform:scale(1.8);opacity:0}
.hx-out{transition:opacity .55s ease;opacity:0;pointer-events:none}

/* Revelado de la página tras la intro: un solo momento coordinado */
.reveal .intro>*{animation:gitRise .9s cubic-bezier(.2,.8,.2,1) both}
.reveal .intro>:nth-child(2){animation-delay:.06s}.reveal .intro>:nth-child(3){animation-delay:.12s}.reveal .intro>:nth-child(4){animation-delay:.18s}.reveal .intro>:nth-child(5){animation-delay:.24s}.reveal .intro>:nth-child(n+6){animation-delay:.3s}
.reveal .stage{animation:gitMaterialize 1.3s cubic-bezier(.2,.8,.2,1) both}
.reveal .sat,.reveal .node{animation:gitIn .8s .45s both}
.reveal .top,.reveal .dock,.reveal .foot{animation:gitIn .8s .2s both}
@keyframes gitRise{from{opacity:0;transform:translateY(26px);filter:blur(8px)}}
@keyframes gitMaterialize{from{opacity:0;transform:scale(1.6);filter:blur(14px) brightness(2)}}
@keyframes gitIn{from{opacity:0}}

/* ---------- Página principal: fondo de constelación ---------- */
.ambient{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;opacity:.9}
.grain{z-index:-1}

/* Escenario 3D */
.stage{position:absolute;inset:0;display:grid;place-items:center;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.stage .orb{pointer-events:auto}
.ring-hud{position:absolute;width:min(560px,96%);aspect-ratio:1;pointer-events:none;transform:translateZ(60px);opacity:.85}
.ring-hud .rh-a{transform-origin:300px 300px;animation:spin 80s linear infinite reverse}
.ring-hud .rh-b{transform-origin:300px 300px;animation:spin 14s linear infinite}
.orbit-a{transform:rotate(-35deg) translateZ(-40px)}.orbit-b{transform:rotate(40deg) translateZ(30px)}
.orb{overflow:hidden;transform:translateZ(20px)}
.orb-scan{position:absolute;inset:0;border-radius:50%;pointer-events:none;background:linear-gradient(to bottom,transparent 0%,#9fe9ff22 48%,#9fe9ff55 50%,transparent 52%) 0 0/100% 260%;animation:orbScan 4.5s ease-in-out infinite;mix-blend-mode:screen}
@keyframes orbScan{0%{background-position:0 130%}60%,100%{background-position:0 -130%}}

/* Tarjetas holográficas: brillo que sigue al puntero */
.sat{overflow:hidden;--mx:50%;--my:50%}
.sat:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .25s;background:radial-gradient(180px circle at var(--mx) var(--my),#9fe9ff2e,transparent 60%),repeating-linear-gradient(to bottom,#9fe9ff09 0 1px,transparent 1px 3px)}
.scene:hover .sat:after{opacity:1}
.sat:before{content:"";position:absolute;left:12px;right:12px;top:0;height:1px;background:linear-gradient(90deg,transparent,#9fe9ffaa,transparent)}

.replay{margin-left:10px;background:transparent;border-color:#3a5a78;color:#bfe3f5}
.replay:hover{border-color:#9fe9ff;color:#fff}
.pause:focus-visible,.btn:focus-visible,.help:focus-visible,.sat:focus-visible{outline:2px solid #a8ef55;outline-offset:3px}

/* ---------- Responsivo ---------- */
@media(max-width:1100px){.hx-panel{width:220px}.hx-left{left:24px}.hx-right{right:24px}}
@media(max-width:860px){
  .hx-panel{display:none}
  .hx-log{left:50%;transform:translateX(-50%);bottom:auto;top:calc(var(--cy) + var(--ret)*.5 + 110px);font-size:11px;text-align:left;max-width:90vw}
  .hx-enter{left:0;right:0;bottom:clamp(30px,6vh,56px);flex-direction:column-reverse;gap:30px}
  .hx-auto{text-align:center;max-width:none}
  .hx-title{letter-spacing:.2em;padding-left:.2em}
}
@media(max-width:520px){
  .hx-top{gap:10px}.hx-clock{display:none}.hx-brand{margin-right:auto}
  .hx-log{display:none}
  .hx-hold{width:92px;height:92px}
  .hx-title{font-size:clamp(28px,9vw,40px)}
  .ring-hud{width:300px}
}
@media(prefers-reduced-motion:reduce){
  .ring-hud g,.orb-scan,.reveal *{animation:none!important}
  .stage{transition:none}
}
/* Correcciones V5: 'perspective' en .scene convertía a .scene en el contenedor de los
   elementos fijos y las tarjetas salían de la pantalla en modo gravedad. */
.scene{perspective:none}
.orb-scan{opacity:.45}
@media(max-width:520px){.top{flex-wrap:wrap}.brand span{white-space:nowrap}.hx-title{white-space:normal;letter-spacing:.16em;padding:0 4vw 0 calc(4vw + .16em);line-height:1.25}}
.orb-scan{opacity:1;background:linear-gradient(to bottom,transparent 38%,#9fe9ff14 47%,#9fe9ff2e 50%,#9fe9ff14 53%,transparent 62%) 0 0/100% 260%}

/* ===== V7: GLOBAL IT en una línea, MÉXICO debajo en blanco, logotipo real ===== */
.logo-img{height:38px;width:auto;display:block}
.brand{gap:14px}
.brand-mx{font-size:10px;letter-spacing:.19em;color:#71c7f4;padding-left:14px;border-left:1px solid #2f4a6b}
h1{font-size:clamp(56px,7vw,108px)}
.gi-line{display:flex;gap:.2em}
.mexico{margin-top:18px;color:#eef5ff;text-shadow:0 0 30px #58baff33}
.mexico .letter{background:none;color:#eef5ff;-webkit-background-clip:initial;background-clip:initial}
.hx-brand img{height:30px;width:auto;display:block}
.hx-title{display:flex;flex-direction:column;align-items:center;gap:.28em}
.hx-t1{display:block;min-height:1em}
.hx-t2{display:block;min-height:1em;font-size:.4em;font-weight:700;letter-spacing:.62em;padding-left:.62em;color:#eef5ff;text-shadow:0 0 24px #58baff55}
.hx-center{top:calc(var(--cy) + var(--ret)*.5 - 6px)}
@media(max-width:960px){h1{font-size:clamp(52px,11vw,100px)}}
@media(max-width:520px){
  .logo-img{height:30px}.brand-mx{display:none}
  h1{font-size:clamp(44px,12.4vw,66px)}
  .hx-title{white-space:nowrap;letter-spacing:.2em;padding:0 0 0 .2em;line-height:1}
  .hx-brand img{height:26px}
}

/* ===== V8: lema ===== */
.headline-underline{margin:24px 0 18px}
.slogan{margin:0 0 20px;font-size:clamp(20px,2.1vw,28px);font-weight:750;font-style:italic;letter-spacing:-.01em;color:#fff}
.hx-sub{font-size:clamp(15px,1.5vw,19px);font-weight:600;font-style:italic;color:#dcecfa;letter-spacing:.02em}
@media(max-width:520px){.slogan{font-size:19px}}