/* LIFRO / TECH UNIVERSE • esfera 3D de habilidades
   Elegante, accesible y optimizada. Geometría 3D en Canvas, logotipos en DOM. */
.skill-section{overflow:hidden}
.skills-world{
 --world-aqua:var(--aqua,#40E0D0);
 --world-copper:var(--copper,#B87333);
 position:relative;isolation:isolate;width:min(1010px,100%);
 margin:8px auto 47px;padding:25px 0 15px;
 border-radius:38px;
 background:
 radial-gradient(ellipse 56% 50% at 50% 51%,rgba(64,224,208,.055),transparent 80%),
 radial-gradient(ellipse 45% 40% at 62% 42%,rgba(184,115,51,.035),transparent 87%);
}
.skills-world::before{
 content:"";position:absolute;inset:12px 6%;
 pointer-events:none;z-index:-1;opacity:.3;
 background-image:radial-gradient(rgba(245,245,220,.25) .7px,transparent .9px);
 background-size:23px 23px;
 mask-image:radial-gradient(ellipse at center,#000 1%,transparent 67%);
}
.world-overline{
 display:flex;align-items:center;justify-content:center;gap:11px;
 text-transform:uppercase;font-size:9px;font-weight:800;letter-spacing:.24em;
 color:var(--muted,#aaa9a1);margin:0 14px;
}
.world-overline::before,.world-overline::after{
 content:"";width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--world-aqua));
}
.world-overline::after{transform:rotate(180deg)}
.world-overline i{width:5px;height:5px;border-radius:50%;background:var(--world-aqua);box-shadow:0 0 12px var(--world-aqua)}
.world-viewport{
 position:relative;width:min(780px,100%);height:590px;margin:0 auto;
 cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;
 outline:none;border-radius:50%;overscroll-behavior:contain;
}
.world-viewport.is-dragging{cursor:grabbing}
.world-viewport:focus-visible{outline:2px solid var(--world-aqua);outline-offset:3px}
.world-viewport::before{
 content:"";position:absolute;inset:6% 15%;pointer-events:none;
 background:radial-gradient(ellipse at center,rgba(64,224,208,.045) 0%,rgba(64,224,208,.022) 35%,transparent 72%);
 filter:blur(12px);
}
.world-grid{position:absolute;inset:0;display:block;pointer-events:none;z-index:0}
.world-node-layer{position:absolute;inset:0;z-index:1;pointer-events:none}
.world-tech{
 position:absolute;left:0;top:0;z-index:3;pointer-events:auto;
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 width:88px;height:103px;padding:10px 7px 9px;gap:7px;
 color:var(--pearl,#F5F5DC);
 border:1px solid rgba(245,245,220,.16);border-radius:23px;
 background:linear-gradient(154deg,rgba(41,52,47,.95),rgba(20,27,25,.96));
 box-shadow:0 18px 36px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.07);
 will-change:transform,opacity;backface-visibility:hidden;
 -webkit-tap-highlight-color:transparent;
 cursor:pointer;transition:background .2s,border-color .2s,box-shadow .2s,filter .2s;
}
.world-tech.is-rear{filter:saturate(.78)}
.world-tech:hover,.world-tech:focus-visible,.world-tech.is-active{
 border-color:var(--brand,#40E0D0);
 background:linear-gradient(155deg,rgba(53,67,58,.98),rgba(21,31,29,.98));
 box-shadow:
 0 16px 48px rgba(0,0,0,.45),
 0 0 0 1px color-mix(in srgb,var(--brand,#40E0D0) 55%,transparent),
 0 0 34px color-mix(in srgb,var(--brand,#40E0D0) 38%,transparent),
 inset 0 1px 0 rgba(255,255,255,.11);
 filter:saturate(1.2) brightness(1.18);
}
.world-tech:focus-visible{outline:2px solid var(--world-aqua);outline-offset:4px}
.world-tech-visual{
 display:flex;align-items:center;justify-content:center;width:58px;height:58px;
 flex:0 0 58px;border-radius:15px;
 background:linear-gradient(150deg,rgba(248,248,239,.975),rgba(228,239,232,.93));
 box-shadow:0 5px 16px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.78);
}
.world-tech-visual img{
 width:45px;height:45px;max-width:100%;max-height:100%;
 object-fit:contain;display:block;pointer-events:none;
}
.world-tech-visual strong{font-size:18px;font-weight:900;letter-spacing:-.05em;color:var(--brand,#40E0D0)}
.world-tech-name{
 display:block;width:100%;font-size:9px;line-height:1.16;letter-spacing:-.02em;
 font-weight:750;text-align:center;color:#e8e8de;
 overflow-wrap:break-word;max-height:31px;overflow:hidden;
}
.world-core{
 position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
 display:flex;align-items:center;justify-content:center;flex-direction:column;
 width:146px;height:146px;border-radius:50%;pointer-events:none;z-index:1200;
 background:
 radial-gradient(circle at 35% 29%,rgba(46,100,86,.76),rgba(22,32,29,.93) 66%),
 linear-gradient(120deg,#21362d,#171a18);
 border:1px solid rgba(64,224,208,.38);
 box-shadow:0 0 60px rgba(64,224,208,.12),inset 0 0 29px rgba(64,224,208,.04),0 0 0 12px rgba(64,224,208,.015);
}
.world-core-mark{font-size:31px;line-height:1;color:var(--world-aqua);filter:drop-shadow(0 0 10px rgba(64,224,208,.55));margin-bottom:6px}
.world-core-title{font-size:16px;letter-spacing:.14em;font-weight:900;color:var(--pearl,#F5F5DC)}
.world-core-caption{font-size:8px;font-weight:800;letter-spacing:.2em;color:var(--world-aqua);margin-top:6px;text-transform:uppercase}
.world-status{
 display:flex;align-items:center;flex-direction:column;justify-content:center;
 gap:6px;text-align:center;min-height:69px;padding:7px 15px;
 border:1px solid rgba(64,224,208,.14);border-radius:16px;
 width:min(410px,calc(100% - 40px));margin:-8px auto 17px;
 background:linear-gradient(130deg,rgba(35,43,39,.68),rgba(27,33,30,.58));
 box-shadow:0 8px 28px rgba(0,0,0,.08);
}
.world-status strong{font-size:14px;color:var(--pearl,#F5F5DC);letter-spacing:.01em}
.world-status small{font-size:11px;line-height:1.4;color:#9db5a8}
.world-has-focus .world-status{border-color:rgba(64,224,208,.43);box-shadow:0 0 18px rgba(64,224,208,.07)}
.world-has-focus .world-status strong{color:var(--world-aqua)}
.world-actions{
 display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding:0 15px;
}
.world-action{
 border:1px solid rgba(245,245,220,.18);border-radius:100px;min-height:37px;
 padding:10px 15px;font-size:10px;letter-spacing:.045em;font-weight:700;
 background:rgba(35,43,39,.78);color:#d1ded6;cursor:pointer;
 transition:background .2s,border-color .2s,transform .2s;
}
.world-action:hover,.world-action:focus-visible{
 background:rgba(64,224,208,.12);border-color:var(--world-aqua);
 color:var(--pearl,#F5F5DC);transform:translateY(-1px)
}
.world-action:focus-visible{outline:2px solid var(--world-aqua);outline-offset:3px}
.world-action[aria-pressed=true]{border-color:var(--world-copper);color:#e3bb91}
.world-hint{font-size:10px;letter-spacing:.04em;color:#7f9285;text-align:center;margin:15px 10px 0}
@media(max-width:820px){
 .skills-world{margin-top:0;padding:12px 0 23px}
 .world-viewport{height:530px;width:min(660px,100%)}
 .world-tech{width:83px;height:99px;border-radius:20px}
 .world-tech-visual{width:56px;height:55px;flex-basis:55px}
 .world-tech-visual img{width:43px;height:43px}
 .world-core{width:125px;height:125px}
 .world-core-title{font-size:14px}
 .world-core-mark{font-size:27px}
}
@media(max-width:560px){
 .skills-world{margin-left:auto;margin-right:auto;width:100%;padding:8px 0 17px;border-radius:18px}
 .world-overline{font-size:8px;letter-spacing:.12em}
 .world-overline::before,.world-overline::after{width:20px}
 .world-viewport{width:100%;height:400px}
 .world-tech{width:80px;height:94px;border-radius:21px;padding:8px 5px 6px;gap:4px}
 .world-tech-visual{width:56px;height:56px;flex:0 0 56px;border-radius:15px}
 .world-tech-visual img{width:45px;height:45px}
 .world-tech-name{font-size:9px}
 .world-core{width:93px;height:93px}
 .world-core-mark{font-size:21px;margin-bottom:3px}
 .world-core-title{font-size:11px}
 .world-core-caption{font-size:6px;margin-top:3px}
 .world-status{min-height:60px;margin:-3px auto 15px}
 .world-status strong{font-size:12px}
 .world-status small{font-size:10px}
 .world-hint{font-size:9px}
}
@media(prefers-reduced-motion:reduce){
 .world-tech,.world-action{transition:none!important}
 .skills-world::before{opacity:.13}
}

/* Logotipos R2 disponibles también en la lista completa de habilidades */
.skill-pill-logoed{gap:9px;align-items:center;min-height:39px}.skill-pill-logoed .skill-chip-logo{display:block;width:23px;height:23px;object-fit:contain;padding:3px;background:rgba(245,245,220,.96);border-radius:7px;flex:none}.skill-pill-logoed>span:not(.pill-dot){font-weight:700}.skill-pill-logoed small{color:#9caa9f}

/* Corrección 2026-11-05: una sola esfera, sin animación reveal */
#skillsWorld{opacity:1!important;visibility:visible!important;transform:none!important;transition:none!important}
#skillsWorld:not(.is-ready) .world-node-layer{opacity:0;pointer-events:none}
#skillsWorld.is-ready .world-node-layer{opacity:1;transition:opacity .22s ease-out}
#skillsWorld .world-core,#skillsWorld .world-overline,#skillsWorld .world-status,#skillsWorld .world-hint{display:none!important}
#skillsWorld .world-heading{font-size:clamp(23px,3vw,35px);font-weight:800;line-height:1.22;letter-spacing:-.025em;text-align:center;margin:4px 12px 0;color:var(--pearl,#F5F5DC);text-shadow:0 0 24px rgba(64,224,208,.09)}
#skillsWorld .world-viewport{margin-top:3px}
#skillsWorld .world-actions{margin-top:-3px}
#skillsWorld .world-tech:focus-visible{outline-offset:5px}
#skills .skills-stage,#skills .orbit-node,#skills .skills-core{display:none!important}
@media(max-width:560px){#skillsWorld .world-heading{font-size:25px;margin:12px 12px 2px}}
@media(prefers-reduced-motion:reduce){#skillsWorld.is-ready .world-node-layer{transition:none}}

/* Titular visible al navegar desde el menú fijo */
#skillsWorld{scroll-margin-top:120px}
#skills{scroll-margin-top:90px}
@media(max-width:560px){#skillsWorld{scroll-margin-top:82px}#skills{scroll-margin-top:70px}}