@font-face{font-family:Montserrat;font-style:normal;font-weight:300;font-display:swap;src:url('../assets/fonts/montserrat-300.ttf') format('truetype')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/montserrat-400.ttf') format('truetype')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/montserrat-500.ttf') format('truetype')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/montserrat-600.ttf') format('truetype')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/montserrat-700.ttf') format('truetype')}
:root{--petro-galopante:#09121c;--aquamarina:#b3ece6;--coral:#eb455d;--hueso:#f1f0f0;--cuarzo-ahumado:#89837a;--bone:#f1f0f0}*{box-sizing:border-box}body{margin:0;background:var(--petro-galopante);color:var(--hueso);font-family:Montserrat,sans-serif}body:before{content:'';position:fixed;inset:0;z-index:-1;background:url('../assets/laboratorio/office-blur.png') center/cover no-repeat}a{color:inherit;text-decoration:none}button{font:inherit}.skip{position:fixed;top:-80px;z-index:2000;background:var(--petro-galopante);padding:16px}.skip:focus{top:0}header.site-header,header.site-header.is-scrolled{position:absolute;top:0;left:0;width:100%;margin:0;padding:24px 4%;border:0;background:transparent}.orbit-brand{position:relative;display:block;width:62px;line-height:0}.orbit-brand img{width:100%;height:auto}.orbit-brand span{position:absolute;width:17%;aspect-ratio:1;right:0;bottom:0;border-radius:50%;background:var(--coral)}main{padding:12px 0 0}.orbit-stage{position:relative;width:100%;aspect-ratio:1672/941;margin:auto;container-type:inline-size}.orbit-live{position:absolute;inset:0;transition:opacity .45s ease}.orbit-circuit{position:absolute;width:100%;height:100%;pointer-events:none}.orbit-center{position:absolute;left:50%;top:47.08%;transform:translate(-50%,-50%);width:24%;text-align:center}.orbit-center h1{font-weight:300;font-size:1.9cqw;letter-spacing:.16em;line-height:1.35;margin:0 0 1cqw}.orbit-center img{display:block;width:90%;height:auto;margin:auto}.orbit-tool{position:absolute;width:25.5%;aspect-ratio:1.5;display:block;transition:transform .35s ease;outline-offset:7px}.tool-diagnostico{left:37.45%;top:1%}.tool-aura{left:12.5%;top:27.5%;width:24%}.tool-seo{left:64.2%;top:27.5%;width:26%}.tool-ux{left:18%;top:60.8%;width:26%}.tool-brief{left:56%;top:60.8%;width:26%}.tool-graphic{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:saturate(.4) brightness(.76);transition:filter .4s ease;pointer-events:none}.tool-copy{position:absolute;left:7%;top:35%;width:39%;bottom:20%;height:auto;display:flex;flex-direction:column;gap:.45cqw}.tool-copy h2{font-size:1.35cqw;font-weight:600;line-height:1.18;margin:0}.tool-copy p{font-size:.78cqw;line-height:1.35;margin:0}.tool-cta{font-size:.73cqw;letter-spacing:.04em;font-weight:500;color:var(--aquamarina);margin-top:auto;white-space:nowrap}.orbit-tool:focus-visible{outline:2px solid var(--aquamarina);transform:translateY(-5px)}.orbit-tool:focus-visible .tool-graphic{filter:saturate(1) brightness(1.05)}@media(hover:hover){.orbit-tool:hover{transform:translateY(-5px)}.orbit-tool:hover .tool-graphic{filter:saturate(1) brightness(1.05)}}.orbit-tagline{text-align:center;font-size:clamp(13px,1.1vw,18px);margin:-2% auto 26px;width:90%;line-height:1.6}footer{text-align:center;font-size:11px;letter-spacing:.12em;color:#b8b9ba;padding:0 15px 25px}.orbit-intro{position:absolute;inset:0;z-index:5;opacity:1;transition:opacity .5s ease;background:var(--petro-galopante)}.orbit-intro[hidden]{display:none}.orbit-intro video{display:block;width:100%;height:100%;object-fit:contain}.intro-skip{position:absolute;right:3%;bottom:3%;padding:10px 15px;background:rgba(9,18,28,.8);color:var(--hueso);border:1px solid #b3ece650;border-radius:4px;cursor:pointer}.is-intro .orbit-live{opacity:0;visibility:hidden}.intro-leaving .orbit-intro{opacity:0;pointer-events:none}
@media(max-width:760px){header.site-header,header.site-header.is-scrolled{position:absolute;padding:18px 6%}.orbit-brand{width:42px}main{padding:90px 0 0}.orbit-stage{width:100%;aspect-ratio:auto;container-type:normal}.orbit-live{position:relative;display:flex;flex-direction:column;align-items:center;padding:0 4%}.orbit-center{position:relative;left:auto;top:auto;transform:none;width:85%;margin:15px auto 28px}.orbit-center h1{font-size:24px;letter-spacing:.12em}.orbit-center img{width:230px;max-width:85%;margin:14px auto 0}.orbit-circuit{position:fixed;left:50%;top:160px;transform:translateX(-50%);width:650px;height:365px;opacity:.45;z-index:-1}.orbit-tool,.tool-aura,.tool-seo,.tool-ux,.tool-brief{position:relative;left:auto;top:auto;width:min(100%,490px);margin:0 auto 10px;aspect-ratio:1.5}.tool-copy{gap:7px}.tool-copy h2{font-size:clamp(16px,4.2vw,22px)}.tool-copy p{font-size:clamp(11px,2.7vw,14px)}.tool-cta{font-size:clamp(10px,2.6vw,13px)}.orbit-tagline{margin:20px auto 28px;font-size:14px}.orbit-intro{display:none}footer{font-size:9px;line-height:1.7}.orbit-tool.is-visible .tool-graphic{filter:saturate(.65) brightness(.9)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}.orbit-intro{display:none}}
.orbit-brand span{width:18.4%;bottom:1.2%}

/* La placa de Aura es más alta que las otras cuatro. */
.tool-aura .tool-copy{bottom:13%}
.tool-copy h2{transition:color .35s ease}
.orbit-tool:focus-visible .tool-copy h2{color:var(--aquamarina)}
@media(hover:hover){.orbit-tool:hover .tool-copy h2{color:var(--aquamarina)}}

/* Encuadre compartido por video e interfaz: 1920 × 1080. */
@media(min-width:761px){
 main{padding-top:72px}
 .orbit-stage{width:min(100%,calc((100svh - 145px)*16/9));aspect-ratio:16/9}
 .tool-diagnostico{left:36.9%;top:3%;width:25.5%}
 .tool-aura{left:12.2%;top:30%;width:24%}
 .tool-seo{left:63.8%;top:30%;width:26%}
 .tool-ux{left:17.7%;top:63%;width:26%}
 .tool-brief{left:55.8%;top:63%;width:26%}
 .orbit-tagline{margin:12px auto 15px;font-size:clamp(12px,1vw,16px)}
 footer{padding-bottom:15px}
}

/* Una sola escena a pantalla completa para video y tarjetas. */
@media(min-width:761px){
 body:before{display:none}
 main{position:relative;padding:0;height:100svh;min-height:580px;overflow:hidden;background:var(--petro-galopante)}
 .orbit-stage{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max(100%,177.777778svh,1031.111111px);aspect-ratio:16/9;margin:0}
 .orbit-live{background:url('../assets/laboratorio/office-blur.png') center/cover no-repeat}
 .orbit-intro video{object-fit:cover}
 .intro-skip{position:fixed;right:max(24px,calc((100% - 100vw)/2 + 24px));bottom:max(24px,calc((100% - 100svh)/2 + 24px));z-index:6}
 .orbit-tagline{position:absolute;bottom:20px;left:5%;width:90%;margin:0;z-index:7;text-shadow:0 2px 8px #09121c;font-size:clamp(12px,1vw,16px);pointer-events:none}
 header.site-header{z-index:8}
}

/* Herramientas al 70,625%, como en el nuevo video de Premiere. */
@media(min-width:761px){
 .orbit-live{background:none;isolation:isolate}
 .orbit-live:before{content:'';position:absolute;inset:-12px;background:url('../assets/laboratorio/office-expanded.png') center/cover no-repeat;filter:blur(.5cqw);z-index:-1}
 .orbit-composition{position:absolute;left:14.6875%;top:14.6875%;width:70.625%;height:70.625%;container-type:inline-size}
}
@media(max-width:760px){.orbit-composition{display:contents}}

/* Prueba de continuidad: la escena final del video permanece intacta. */
@media(min-width:761px){
 .is-still .orbit-intro{display:block;z-index:0;opacity:1;transition:none;background:url('../assets/laboratorio/scene-final-clean.png') center/cover no-repeat}
 .is-still .orbit-intro video[hidden]{display:none}
 .is-still .orbit-live{z-index:1;pointer-events:none}
 .is-still .orbit-live:before,.is-still .orbit-circuit{display:none}
 .is-still .orbit-tool{pointer-events:auto;border-radius:8px}
 .is-still .tool-graphic,.is-still .tool-copy{opacity:1}
 
 .is-still .orbit-tool:focus-visible{outline:2px solid var(--aquamarina)}
 .is-still .intro-skip{pointer-events:auto}
 .is-still .intro-skip[hidden]{display:none}
}

@media(min-width:761px){.is-still .orbit-intro video{transition:opacity .45s ease}.is-still.is-ready .orbit-intro video{opacity:0}}

/* Ajuste final de posición de Diagnóstico UX. */
@media(min-width:761px){.tool-ux{left:19.7%}}

/* Encabezado persistente con la escala institucional del sitio. */
header.site-header,header.site-header.is-scrolled{position:fixed;top:0;left:0;right:0;width:100%;margin:0;padding:18px 24px 10px;z-index:1000;border:0;background:rgba(9,18,28,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
header.site-header .orbit-brand{width:28px;flex:0 0 28px}
header.site-header .site-header__inner{width:100%}
header.site-header .site-header__hamburger{width:26px;height:20px;gap:6px}

/* Recorrido circular móvil: un escenario fijo y cinco estaciones de scroll. */
.mobile-orbit-controls{display:none}
@media(max-width:760px){
 .mobile-orbit{height:500svh;min-height:2800px}
 .mobile-orbit .orbit-live{position:sticky;top:72px;height:calc(100svh - 72px);padding:0;overflow:hidden;isolation:isolate;background:linear-gradient(#09121c65,#09121c85),url('../assets/laboratorio/office-blur.png') center/cover}
 .mobile-orbit .orbit-composition{display:block;position:absolute;inset:0}
 .mobile-orbit .orbit-circuit{display:none}
 .mobile-orbit .orbit-composition:before{content:'';position:absolute;width:1100px;height:619px;left:50%;top:52%;background:url('../assets/laboratorio/scene-final-clean.png') center/contain no-repeat;transform:translate(-50%,-50%) rotate(var(--orbit-turn,0deg));opacity:.5;z-index:-1;mask-image:radial-gradient(ellipse at center,transparent 18%,black 30%,black 42%,transparent 53%);-webkit-mask-image:radial-gradient(ellipse at center,transparent 18%,black 30%,black 42%,transparent 53%)}
 .mobile-orbit .orbit-center{position:absolute;left:50%;top:22px;transform:translateX(-50%);width:90%;margin:0}
 .mobile-orbit .orbit-center h1{font-size:19px;line-height:1.5;margin:0}
 .mobile-orbit .orbit-center img{width:180px;margin:12px auto 0}
 .mobile-orbit .orbit-tool{position:absolute;left:50%;top:43%;width:92%;max-width:440px;margin:0;transform:translate(-50%,-50%) translate(var(--card-x,0px),var(--card-y,0px)) scale(var(--card-scale,1));opacity:var(--card-opacity,1);transition:none;pointer-events:none;will-change:transform}
 .mobile-orbit .orbit-tool.is-active{pointer-events:auto;z-index:3}
 .mobile-orbit .orbit-tool .tool-graphic{filter:saturate(.25) brightness(.65)}
 .mobile-orbit .orbit-tool.is-active .tool-graphic{filter:saturate(.85) brightness(1)}
 .mobile-orbit .orbit-tool.is-active h2{color:var(--aquamarina)}
 .mobile-orbit .tool-copy{gap:6px}
 .mobile-orbit .tool-copy h2{font-size:clamp(15px,4.2vw,21px)}
 .mobile-orbit .tool-copy p{font-size:clamp(10px,2.8vw,13px)}
 .mobile-orbit .tool-cta{font-size:11px}
 .mobile-orbit-controls{display:flex;position:absolute;top:70%;left:50%;transform:translateX(-50%);align-items:center;gap:25px;z-index:5}
 .mobile-orbit-controls button{width:44px;height:44px;border:1px solid #b3ece640;border-radius:50%;color:var(--aquamarina);background:#09121c90;font-size:23px;cursor:pointer}
 .mobile-orbit-controls button:disabled{opacity:.3;cursor:default}
 .mobile-orbit-count{font-size:12px;letter-spacing:.18em;white-space:nowrap;color:var(--aquamarina)}
 .mobile-orbit-hint{position:absolute;top:82%;left:10%;width:80%;text-align:center;font-size:11px;letter-spacing:.05em;color:#f1f0f0a6;line-height:1.8}
 .mobile-orbit + .orbit-tagline{margin:24px auto 32px}
}
@media(max-width:760px) and (max-height:650px){.mobile-orbit .orbit-center{top:8px}.mobile-orbit .orbit-center h1{font-size:15px}.mobile-orbit .orbit-center img{width:140px}.mobile-orbit .orbit-tool{top:47%;width:78%}.mobile-orbit-controls{top:76%}.mobile-orbit-hint{top:90%;font-size:10px}}
.mobile-orbit-controls[hidden]{display:none}

/* Introduction vidéo sur mobile, suivie du parcours circulaire. */
@media(max-width:760px){
 body.mobile-intro-playing{overflow:hidden}
 .orbit-stage .orbit-intro{display:block;position:fixed;top:72px;left:0;right:0;bottom:0;z-index:900;background:var(--petro-galopante);opacity:1;transition:opacity .6s ease;touch-action:none}
 .orbit-stage .orbit-intro[hidden]{display:none}
 .orbit-stage .orbit-intro video{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
 .orbit-stage.is-ready .orbit-intro{opacity:0;pointer-events:none}
 .orbit-stage .intro-skip{position:absolute;right:20px;bottom:calc(22px + env(safe-area-inset-bottom));padding:12px 16px;font-size:12px;border-radius:24px;background:#09121cbf;z-index:1}
 .orbit-stage.is-intro .orbit-live{visibility:hidden;opacity:0}
}

/* En móvil, el toque sustituye al hover del escritorio. */
@media(max-width:760px){
 .mobile-orbit .orbit-tool.is-active .tool-graphic{filter:saturate(.4) brightness(.76)}
 .mobile-orbit .orbit-tool.is-active h2{color:var(--hueso)}
 .mobile-orbit .orbit-tool.is-active.is-touch-lit .tool-graphic{filter:saturate(1) brightness(1.05)}
 .mobile-orbit .orbit-tool.is-active.is-touch-lit h2{color:var(--aquamarina)}
 .mobile-orbit .orbit-tool.is-touch-lit{outline:1px solid #b3ece630;outline-offset:-8px;border-radius:8px}
}

/* Le premier toucher révèle une action explicite. */
@media(max-width:760px){
 .mobile-orbit .tool-cta{opacity:0;visibility:hidden;transform:translateY(5px);transition:opacity .25s ease,transform .25s ease;align-self:flex-start;padding:7px 10px;border-radius:5px;background:var(--aquamarina);color:var(--petro-galopante);font-size:10px;font-weight:600;letter-spacing:.03em;white-space:nowrap}
 .mobile-orbit .is-touch-lit .tool-cta,.mobile-orbit .orbit-tool:focus-visible .tool-cta{opacity:1;visibility:visible;transform:translateY(0)}
}
@media(max-width:760px){.mobile-orbit .tool-cta{background:var(--coral);color:#fff}.mobile-orbit .orbit-tool.is-touch-lit{outline:none}}