/* Legibilidad mejorada, menos líneas decorativas y biblioteca interactiva. */
:root{--line:rgba(193,220,236,.075)}
body{font-size:16px}
.announcement{font-size:11px}.brand{font-size:17px}.main-nav{font-size:14px}.eyebrow{font-size:11px;letter-spacing:.09em}
.hero h1{font-size:clamp(50px,5.2vw,72px)}.hero-lede{font-size:18px}.hero-note{font-size:13px}.hero-note p{max-width:310px}.button{font-size:14px;min-height:51px;padding-inline:20px}
.section-heading h2,.faq-layout h2{font-size:clamp(36px,3.5vw,49px)}.section-intro{font-size:15px;max-width:400px}
.service-card{border:0;border-radius:11px;min-height:239px;padding:25px 24px 52px;background:linear-gradient(145deg,#14222d,#101923 80%);box-shadow:inset 0 0 0 1px rgba(193,220,236,.035),0 16px 38px rgba(0,0,0,.12)}.service-card:before{display:none}.service-icon{width:42px;height:42px;margin-bottom:22px;font-size:21px}.service-card h3{font-size:19px}.service-card p{font-size:13px;line-height:1.75;max-width:350px}.service-tag{font-size:10px;bottom:18px;left:24px}
.section-footnote{font-size:13px;border-color:rgba(160,194,210,.12)}
.workflow-item{border-color:rgba(193,220,236,.07)}.workflow-item:first-child{border-top-color:rgba(193,220,236,.07)}.workflow-number{font-size:12px}.workflow-item h3{font-size:17px}.workflow-item p{font-size:13px;line-height:1.7}.workflow-detail{font-size:10px}.status-pill{font-size:10px}.workflow-aside h3{font-size:22px}.workflow-aside>p:not(.eyebrow){font-size:13px}.text-link{font-size:13px}
.method-intro{font-size:14px}.step-n{font-size:12px}.step-card h3{font-size:16px}.step-card p{font-size:13px;max-width:260px}.investment-band strong{font-size:16px}.investment-band>p{font-size:12px}.investment-label{font-size:10px}
.diagnostic-copy h2{font-size:clamp(40px,4.2vw,52px)}.diagnostic-copy>p:not(.eyebrow){font-size:15px}.diagnostic-proof{font-size:12px}.diagnostic-proof small{font-size:11px}.quiz-card{border:0;border-radius:12px;padding:27px 29px;background:#0c1720;box-shadow:0 20px 55px rgba(0,0,0,.22),inset 0 0 0 1px rgba(153,200,216,.09)}.quiz-top{font-size:10px}.quiz-body h3{font-size:23px}.quiz-body>p{font-size:13px}.quiz-option{font-size:13px;min-height:54px;padding:12px 14px}
.resource-viewport{overflow:hidden;margin-inline:-4px;padding:4px}.resource-track{display:flex;gap:20px;transition:transform .55s cubic-bezier(.2,.75,.25,1);will-change:transform}.resource-card{flex:0 0 min(360px,82vw);padding:24px;border:0;border-radius:11px;background:linear-gradient(145deg,#14222d,#0f1821);box-shadow:inset 0 0 0 1px rgba(193,220,236,.04),0 18px 38px rgba(0,0,0,.14);min-height:230px;display:flex;flex-direction:column}.resource-card:hover{background:linear-gradient(145deg,#182c37,#111d27)}.resource-image{width:calc(100% + 48px);height:142px;object-fit:cover;margin:-24px -24px 20px;border-radius:11px 11px 0 0}.resource-top{gap:12px;margin-bottom:19px}.resource-type{font-size:10px;color:#77dfe3}.resource-price{font-size:10px}.resource-card h3{font-size:20px;line-height:1.3;margin:0 0 10px}.resource-card p{font-size:13px;line-height:1.7;color:#a3b2bb}.resource-bottom{margin-top:auto;padding-top:18px;font-size:12px}.resource-action{display:inline-flex;align-items:center;gap:12px;color:var(--cyan);font-weight:700;font:600 13px var(--font)}.resource-action span{font-size:16px}.catalog-toolbar{display:flex;align-items:center;justify-content:space-between;margin:0 0 15px;color:#8ba0aa;font:10px var(--mono);letter-spacing:.1em}.carousel-controls{display:flex;gap:8px}.carousel-controls button{width:42px;height:42px;border:0;border-radius:50%;background:#15232d;color:#cbd9df;font-size:17px;cursor:pointer;transition:background .2s,color .2s}.carousel-controls button:hover,.carousel-controls button:focus-visible{background:#1b3940;color:var(--cyan);outline:2px solid rgba(97,227,232,.45);outline-offset:2px}.catalog-actions{display:flex;align-items:center;gap:16px;margin-top:19px}.catalog-actions>span{font-size:12px;color:#8297a2}.catalog-actions .button{min-height:43px;font-size:12px}.full-catalog{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}.full-catalog[hidden]{display:none!important}.catalog-filter{display:flex;gap:15px;margin-bottom:18px}.catalog-filter label{display:grid;gap:6px;color:#96a9b2;font-size:11px}.catalog-filter input,.catalog-filter select{min-width:190px;padding:10px 12px;border:0;border-radius:5px;background:#111d27;color:var(--ink);font:13px var(--font);box-shadow:inset 0 0 0 1px rgba(193,220,236,.07)}.catalog-filter input:focus-visible,.catalog-filter select:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.full-catalog .resource-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.full-catalog .resource-card{min-width:0;min-height:230px}.catalog-actions .button-quiet{border:1px solid rgba(97,227,232,.22);border-radius:99px;color:var(--cyan)}.resources-footer{font-size:10px;color:#8295a0}.resources-footer a{font-size:12px}
.faq-layout h2{font-size:40px}.faq-layout>div:first-child>p:last-child{font-size:13px}.faq-question{font-size:15px;padding-block:19px}.faq-answer{font-size:13px;line-height:1.8}.closing-inner h2{font-size:clamp(39px,4vw,52px)}.closing-inner>p:not(.eyebrow){font-size:15px}.footer-main>p{font-size:11px}.footer-links{font-size:11px}.footer-bottom{font-size:10px}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
@media(max-width:950px){.full-catalog .resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.announcement{font-size:9px}.main-nav{font-size:14px}.hero h1{font-size:clamp(46px,12vw,62px)}.hero-lede{font-size:16px}.hero-note{font-size:12px}.eyebrow{font-size:10px}.section-heading h2,.faq-layout h2{font-size:clamp(34px,9vw,42px)}.section-intro{font-size:14px}.service-card{min-height:245px;padding:20px 17px 48px}.service-card h3{font-size:16px}.service-card p{font-size:12px}.service-tag{font-size:9px;left:17px}.workflow-item h3{font-size:16px}.workflow-item p{font-size:12px}.step-card h3{font-size:14px}.step-card p{font-size:12px}.investment-band strong{font-size:15px}.diagnostic-copy h2{font-size:39px}.diagnostic-copy>p:not(.eyebrow){font-size:14px}.quiz-card{padding:21px 18px}.quiz-body h3{font-size:20px}.quiz-option{font-size:13px}.resource-card{flex-basis:min(330px,84vw);min-height:236px;padding:21px}.resource-image{width:calc(100% + 42px);margin:-21px -21px 17px}.catalog-actions{align-items:flex-start;flex-direction:column;gap:8px}.catalog-filter{flex-direction:column}.catalog-filter input,.catalog-filter select{width:100%}.full-catalog .resource-grid{grid-template-columns:1fr}.resources-footer{font-size:9px}.resources-footer a{font-size:12px}.faq-question{font-size:14px}.faq-answer{font-size:12px}.closing-inner h2{font-size:36px}.footer-links{font-size:10px}.footer-bottom{font-size:9px}}
@media(prefers-reduced-motion:reduce){.resource-track{transition:none}}

/* Más claridad y espacio útil en el panel de posibilidades. */
.workflow-aside{padding-left:30px;border-color:rgba(193,220,236,.07)!important}.workflow-aside h3{font-size:25px;line-height:1.22;letter-spacing:-.025em;max-width:320px;margin:4px 0 11px}.workflow-aside>p:not(.eyebrow){font-size:13px;line-height:1.75;max-width:355px}.possibility-chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 12px}.possibility-chip{font-size:11px;line-height:1.4;color:#d1e1e8;background:rgba(97,227,232,.065);border:1px solid rgba(97,227,232,.13);border-radius:99px;padding:7px 10px}.workflow-aside .possibility-note{font-size:11px!important;color:#9eafb9!important;margin:2px 0 15px!important}.workflow-column{min-width:0}.workflow-list{max-height:none;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;scroll-behavior:smooth}.workflow-list::-webkit-scrollbar{display:none}.workflow-item{grid-template-columns:39px minmax(0,1fr) minmax(125px,auto);gap:13px;padding:19px 9px;border-color:rgba(193,220,236,.07)!important}.workflow-item h3{font-size:15px}.workflow-item p{font-size:12px;line-height:1.7}.status-pill{white-space:normal;text-align:center;max-width:155px;border:0!important;background:rgba(154,230,191,.08)}.status-pill.status-future{color:var(--amber);background:rgba(255,195,107,.10)}.workflow-controls{min-height:54px;display:flex;align-items:center;justify-content:space-between;padding:8px 10px 0;color:#9caeb9;font:10px var(--mono);letter-spacing:.05em}.workflow-controls>div{display:flex;gap:8px}.workflow-controls button{width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(97,227,232,.1);color:var(--cyan);font-size:20px;cursor:pointer;transition:background .18s,transform .18s}.workflow-controls button:hover{background:rgba(97,227,232,.2);transform:translateY(-1px)}.workflow-controls button:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.workflow-controls button[hidden]{display:none}@media(max-width:700px){.workflow-aside{padding-inline:4px}.workflow-aside h3{font-size:24px}.workflow-item{grid-template-columns:30px minmax(0,1fr);gap:9px;padding:16px 2px}.workflow-item h3{font-size:15px}.workflow-item p{font-size:12px}.status-pill{grid-column:2;justify-self:start;text-align:left;max-width:none}.workflow-controls{padding-inline:4px}}
@media(prefers-reduced-motion:reduce){.workflow-list{scroll-behavior:auto}}
.workflow-list{position:relative}

/* Escena narrativa 3D, creada con CSS/SVG local para explicar el servicio sin una app pesada. */
.hero-art{perspective:1100px;overflow:visible}
.hero-art:before{content:"";position:absolute;width:420px;height:340px;left:50%;top:51%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,rgba(36,185,196,.16),rgba(94,75,175,.07) 42%,transparent 72%);filter:blur(18px);animation:signalGlow 7s ease-in-out infinite alternate;pointer-events:none}
.signal-board{position:absolute;z-index:1;left:50%;top:50%;width:min(395px,88%);height:248px;transform:translate(-50%,-50%) rotateX(8deg) rotateY(-12deg) rotateZ(-2deg);transform-style:preserve-3d;border:1px solid rgba(117,225,230,.2);border-radius:19px;background:linear-gradient(138deg,rgba(22,45,57,.79),rgba(11,22,32,.78) 58%,rgba(24,28,46,.75));box-shadow:inset 0 1px rgba(255,255,255,.075),0 35px 70px rgba(0,0,0,.38),0 0 60px rgba(46,199,207,.08);backdrop-filter:blur(13px);animation:boardDrift 8s ease-in-out infinite}
.signal-board:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,rgba(255,255,255,.075),transparent 34%,transparent 70%,rgba(97,227,232,.06));pointer-events:none}
.board-top{position:absolute;top:17px;left:20px;right:20px;display:flex;justify-content:space-between;color:#afc4cc;font:8px var(--mono);letter-spacing:.11em}.board-top span{display:flex;align-items:center;gap:7px}.board-top i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 11px var(--green)}.board-top small{color:#607b89;font-size:8px}
.board-flow{position:absolute;inset:33px 0 29px;width:100%;height:calc(100% - 62px);overflow:visible}.flow-line{stroke:rgba(97,227,232,.5);stroke-width:1.3;stroke-dasharray:5 8;animation:flowDash 3.6s linear infinite}.flow-line-secondary{stroke:rgba(178,165,255,.45);animation-duration:4.6s;animation-direction:reverse}.flow-line-center{stroke:rgba(255,195,107,.73);stroke-width:2;stroke-dasharray:2 7;animation-duration:2.6s}.flow-node{filter:drop-shadow(0 0 7px currentColor);stroke:rgba(255,255,255,.65);stroke-width:1.2}.node-cyan{fill:#61e3e8;color:#61e3e8}.node-violet{fill:#b2a5ff;color:#b2a5ff}.node-core{fill:#ffc36b;color:#ffc36b;stroke:rgba(255,255,255,.7);stroke-width:2}.node-amber{fill:#ffc36b;color:#ffc36b}.node-green{fill:#9ae6bf;color:#9ae6bf}
.board-label{position:absolute;z-index:1;color:#b8ccd2;font:7px var(--mono);letter-spacing:.07em}.board-label small{display:block;margin-top:4px;color:#75909b;font:8px var(--font);letter-spacing:0}.label-in{left:19px;top:83px}.label-core{left:50%;top:93px;transform:translateX(-50%);text-align:center;color:#ffe0a9}.label-out{right:18px;top:83px;text-align:right}.board-foot{position:absolute;left:19px;right:19px;bottom:14px;display:flex;align-items:center;gap:7px;color:#8ca7b0;font:8px var(--font)}.board-foot>span{font-size:7px;color:var(--green);text-shadow:0 0 7px var(--green)}.board-foot b{margin-left:auto;color:#86d9b6;font:7px var(--mono);letter-spacing:.1em}
.art-orbit{z-index:0;transform-style:preserve-3d;box-shadow:inset 0 0 35px rgba(83,213,218,.025)}.orbit-two{animation:rotate 75s linear infinite,orbitBreathe 6s ease-in-out infinite alternate}.art-core{z-index:3;transform:translateZ(45px);animation:coreFloat 5.5s ease-in-out infinite}.orbit-chip{transform:translateZ(60px);transition:transform .35s,border-color .35s,box-shadow .35s}.chip-top{animation:chipFloat 6s ease-in-out infinite}.chip-right{animation:chipFloat 6.8s ease-in-out -1.8s infinite}.chip-bottom{animation:chipFloat 7.2s ease-in-out -3.1s infinite}.art-spark{animation:sparkPulse 2.8s ease-in-out infinite alternate}.spark-b{animation-delay:-1.2s}.spark-c{animation-delay:-2s}
@keyframes flowDash{to{stroke-dashoffset:-52}}@keyframes boardDrift{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -7px;rotate:.6deg}}@keyframes coreFloat{0%,100%{translate:0 0}50%{translate:0 -7px}}@keyframes chipFloat{0%,100%{translate:0 0}50%{translate:0 -5px}}@keyframes sparkPulse{from{opacity:.42;scale:.72}to{opacity:1;scale:1.25}}@keyframes signalGlow{from{opacity:.62;scale:.92}to{opacity:1;scale:1.08}}@keyframes orbitBreathe{from{border-color:rgba(97,227,232,.14)}to{border-color:rgba(97,227,232,.34)}}
.service-card{transform-style:preserve-3d;transition:transform .38s cubic-bezier(.2,.75,.25,1),box-shadow .38s,background .38s}.service-card:after{content:"";position:absolute;inset:-1px;pointer-events:none;opacity:0;background:linear-gradient(112deg,transparent 25%,rgba(97,227,232,.09) 48%,transparent 67%);transform:translateX(-45%);transition:opacity .25s,transform .7s}.service-card:hover{transform:translateY(-7px) rotateX(1deg);box-shadow:inset 0 0 0 1px rgba(97,227,232,.1),0 22px 48px rgba(0,0,0,.25)}.service-card:hover:after{opacity:1;transform:translateX(45%)}
.trust-strip{position:relative;overflow:hidden}.trust-strip:before{content:"";position:absolute;left:0;top:0;width:25%;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);animation:stripSweep 9s linear infinite}.trust-inner{position:relative}@keyframes stripSweep{from{transform:translateX(-100%)}to{transform:translateX(500%)}}
.motion-target{opacity:0;transform:translateY(22px) scale(.99);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.25,1);transition-delay:calc(var(--motion-order,0)*75ms)}.motion-target.is-visible{opacity:1;transform:translateY(0) scale(1)}
@media(max-width:950px){.signal-board{width:min(365px,94%);height:230px}.label-in{left:14px}.label-out{right:14px}.board-foot{left:14px;right:14px}}
@media(max-width:700px){.hero-art:before{width:335px;height:285px}.signal-board{width:min(350px,91%);height:218px;border-radius:16px;transform:translate(-50%,-50%) rotateX(5deg) rotateY(-8deg) rotateZ(-2deg)}.board-top{top:14px;left:15px;right:15px}.board-label{font-size:6px}.label-in{left:11px;top:80px}.label-out{right:11px;top:80px}.label-core{top:91px}.board-foot{left:14px;right:14px;bottom:12px;font-size:7px}.hero-art{overflow:hidden}.art-core{width:120px;height:120px}.art-core img{width:68px;height:68px}.orbit-chip{min-width:155px}.chip-top{left:10px;top:35px}.chip-right{right:0;top:157px}.chip-bottom{left:12px;bottom:46px}.art-caption{bottom:7px}}
@media(hover:none){.service-card:hover{transform:none}.service-card:after{display:none}}
@media(prefers-reduced-motion:reduce){.signal-board,.hero-art:before,.art-core,.orbit-chip,.art-spark,.orbit-two,.trust-strip:before,.flow-line{animation:none!important}.motion-target{opacity:1;transform:none;transition:none}}

/* Fondo propio de ServiTec: malla de procesos, nodos y conexiones con profundidad. */
.site-header{position:relative;z-index:3}main,.site-footer{position:relative;z-index:1}.ambient-world{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;opacity:.72;isolation:isolate}.ambient-haze{position:absolute;width:58vw;height:58vw;border-radius:50%;filter:blur(70px);opacity:.11;transform:translate3d(var(--ambient-x,0px),var(--ambient-y,0px),0);will-change:transform}.haze-a{right:-18vw;top:4vh;background:radial-gradient(circle,#42c6d0,transparent 69%)}.haze-b{left:22vw;bottom:-40vh;background:radial-gradient(circle,#8074d7,transparent 68%);opacity:.075;transform:translate3d(calc(var(--ambient-x,0px)*-.55),calc(var(--ambient-y,0px)*-.6),0)}.ambient-mesh{position:absolute;top:-12vh;right:-8vw;width:79vw;height:112vh;opacity:.28;background-image:linear-gradient(rgba(102,204,218,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(102,204,218,.055) 1px,transparent 1px),radial-gradient(ellipse at 70% 48%,rgba(26,153,169,.12),transparent 67%);background-size:46px 46px,46px 46px,100% 100%;mask-image:radial-gradient(ellipse at 70% 48%,#000 8%,transparent 72%);transform-origin:70% 50%;transform:perspective(1000px) rotateX(57deg) rotateZ(-15deg) translate3d(var(--ambient-x,0px),calc(var(--ambient-y,0px) + var(--ambient-scroll-shift,0px)),0);will-change:transform}.ambient-links{position:absolute;right:-7vw;top:0;width:min(1220px,100vw);height:100vh;overflow:visible;opacity:.26;transform:translate3d(var(--ambient-x,0px),calc(var(--ambient-y,0px) + var(--ambient-scroll-shift,0px)),0) rotate(var(--ambient-turn,0deg));transform-origin:77% 48%;will-change:transform}.network-wire{stroke:url(#network-line);stroke-width:1.35;stroke-dasharray:3 13;vector-effect:non-scaling-stroke;animation:wireFlow 17s linear infinite}.wire-b{animation-duration:22s;animation-direction:reverse}.wire-c{animation-duration:19s}.wire-d{animation-duration:24s;animation-direction:reverse}.wire-e{animation-duration:15s}.wire-f{animation-duration:20s;animation-direction:reverse}.network-node{fill:url(#network-node);transform-box:fill-box;transform-origin:center;animation:nodeBreath 4.5s ease-in-out infinite alternate}.node-b,.node-e,.node-h{animation-delay:-1.7s}.node-c,.node-f,.node-i{animation-delay:-3.1s}.ambient-label{position:absolute;color:rgba(136,214,220,.31);font:9px var(--mono);letter-spacing:.18em;white-space:nowrap}.ambient-label i{display:inline-block;width:3px;height:3px;margin:0 10px 2px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}.ambient-label-a{right:13%;top:25%}.ambient-label-b{right:11%;bottom:14%;color:rgba(178,165,255,.28)}.hero-art .signal-board{transform:translate(-50%,-50%) rotateX(calc(8deg + var(--tilt-y,0deg) + var(--scroll-tilt,0deg))) rotateY(calc(-12deg + var(--tilt-x,0deg))) rotateZ(-2deg);transition:transform .22s ease-out}.hero-art .art-core{transform:translate3d(calc(var(--float-x,0px)*.24),calc(var(--float-y,0px)*.24),45px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));transition:transform .22s ease-out}.hero-art .orbit-chip{transform:translate3d(var(--float-x,0px),var(--float-y,0px),60px)}
.work-section{background:rgba(11,18,26,.92)}.faq-section{background:rgba(12,19,27,.91)}.trust-strip{background:rgba(11,18,26,.94)}.diagnostic-section{background:linear-gradient(105deg,rgba(16,32,42,.96),rgba(16,32,39,.96) 55%,rgba(17,27,36,.96))}
@keyframes wireFlow{to{stroke-dashoffset:-256}}@keyframes nodeBreath{from{opacity:.32;scale:.68}to{opacity:.9;scale:1.22}}
@media(max-width:950px){.ambient-world{opacity:.53}.ambient-links{right:-17vw;width:116vw}.ambient-mesh{width:91vw;right:-17vw}.ambient-label{opacity:.7}}
@media(max-width:700px){.ambient-world{opacity:.47}.ambient-links{top:4vh;right:-48vw;width:150vw;height:83vh;transform:translate3d(calc(var(--ambient-x,0px)*.45),calc(var(--ambient-y,0px)*.45 + var(--ambient-scroll-shift,0px)),0) rotate(var(--ambient-turn,0deg))}.ambient-mesh{top:2vh;right:-38vw;width:125vw;height:84vh;opacity:.16;background-size:36px 36px,36px 36px,100% 100%;transform:perspective(850px) rotateX(59deg) rotateZ(-18deg) translate3d(calc(var(--ambient-x,0px)*.4),calc(var(--ambient-y,0px)*.4 + var(--ambient-scroll-shift,0px)),0)}.ambient-haze{width:94vw;height:94vw;filter:blur(55px)}.ambient-label{display:none}.wire-c,.wire-d,.wire-f{opacity:.45}.hero-art .signal-board{transform:translate(-50%,-50%) rotateX(calc(5deg + var(--tilt-y,0deg) + var(--scroll-tilt,0deg))) rotateY(calc(-8deg + var(--tilt-x,0deg))) rotateZ(-2deg)}.hero-actions{display:grid;grid-template-columns:1fr;max-width:390px;gap:9px}.hero-actions .button{justify-content:space-between;width:100%}.hero-note{max-width:390px}.hero-art{width:calc(100% + 20px);margin-inline:-10px;height:345px}.signal-board{width:min(330px,calc(100% - 34px));height:208px}.chip-top{left:8px;top:29px}.chip-right{right:0;top:146px}.chip-bottom{left:8px;bottom:40px}.orbit-chip{min-width:148px;padding:8px 9px}.orbit-chip small{font-size:8px}.art-caption{bottom:4px}.art-core{width:112px;height:112px}.art-core img{width:63px;height:63px}.workflow-layout{gap:18px}.workflow-aside{padding-top:26px}.catalog-toolbar{font-size:9px}.carousel-controls button{width:40px;height:40px}.resources-section{overflow:hidden}}
@media(max-width:390px){.hero{padding-top:36px}.hero h1{font-size:clamp(39px,11.6vw,47px);line-height:1.08}.hero-lede{font-size:15px;line-height:1.7}.hero-art{height:318px;margin-inline:-14px;width:calc(100% + 28px)}.signal-board{width:calc(100% - 40px);height:196px}.board-label{font-size:5px}.board-label small{font-size:7px}.label-in{left:8px}.label-out{right:8px}.label-core{top:89px}.board-foot{font-size:6px}.orbit-chip{min-width:137px;gap:7px}.chip-right{right:1px;top:139px}.chip-bottom{bottom:35px}.art-core{width:102px;height:102px}.art-core img{width:58px;height:58px}.service-grid{grid-template-columns:1fr}.service-card{min-height:205px}.quiz-card{padding:19px 15px}.section-wrap,.site-header{width:calc(100% - 34px)}}
@media(prefers-reduced-motion:reduce){.ambient-world{opacity:.3}.network-wire,.network-node,.trust-strip:before,.signal-board,.hero-art:before,.art-core,.orbit-chip,.art-spark,.orbit-two{animation:none!important;transition:none!important}.motion-target{opacity:1;transform:none;transition:none}.hero-art .signal-board,.hero-art .art-core,.hero-art .orbit-chip{transform:none!important}.work-section{background:#0b121a}.faq-section{background:#0c131b}.trust-strip{background:#0b121a}.diagnostic-section{background:linear-gradient(105deg,#10202a,#102027 55%,#111b24)}}
/* Refuerzo de reflujo en móviles pequeños y movimiento táctil más contenido. */
@media(max-width:700px){.ambient-links{transform:translate3d(var(--ambient-x,0px),calc(var(--ambient-y,0px) + var(--ambient-scroll-shift,0px)),0) rotate(var(--ambient-turn,0deg))}.ambient-mesh{transform:perspective(850px) rotateX(59deg) rotateZ(-18deg) translate3d(var(--ambient-x,0px),calc(var(--ambient-y,0px) + var(--ambient-scroll-shift,0px)),0)}.hero-art .art-core{transform:translate3d(var(--float-x,0px),var(--float-y,0px),34px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg))}.hero-art .orbit-chip{transform:translate3d(var(--float-x,0px),var(--float-y,0px),44px)}.section-heading{gap:20px}.service-grid{gap:12px}.service-card{padding-inline:18px}.service-tag{left:18px}}
@media(max-width:430px){.announcement{height:auto;min-height:36px;padding:6px 12px;text-align:center;flex-wrap:wrap;line-height:1.35}.announcement a{margin-left:3px}.section-heading h2,.faq-layout h2{overflow-wrap:anywhere}.hero-actions{max-width:none}.hero-note{font-size:11px}.hero-art{overflow:hidden}.workflow-item{grid-template-columns:25px minmax(0,1fr);}.workflow-item h3{overflow-wrap:anywhere}.status-pill{white-space:normal}.quiz-options{grid-template-columns:1fr}.catalog-toolbar{align-items:center}.catalog-count{max-width:62%}.carousel-controls{flex-shrink:0}.resource-card{flex-basis:min(320px,86vw)}}
@media(max-width:360px){.brand{font-size:13px}.service-card{padding-inline:15px}.service-tag{left:15px}.signal-board{width:calc(100% - 26px)}.board-top{left:11px;right:11px}.board-foot{left:10px;right:10px}.hero-art .board-label{font-size:4.5px}.section-wrap,.site-header{width:calc(100% - 28px)}}
.ambient-label{display:none}

/* Ajustes de lectura y amplitud para la sección de flujos */
.work-section{position:relative;isolation:isolate;overflow:hidden}
.work-section:before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(ellipse at 78% 44%,rgba(20,126,145,.20),transparent 43%),radial-gradient(ellipse at 12% 92%,rgba(83,72,157,.11),transparent 39%),linear-gradient(105deg,rgba(9,18,27,.97),rgba(8,19,28,.86) 58%,rgba(9,17,27,.92))}
.work-section .section-wrap{width:min(1510px,calc(100% - 96px))}
.work-section .section-block{padding-top:112px;padding-bottom:116px}
.work-section .section-heading{gap:clamp(56px,8vw,150px);margin-bottom:48px}
.work-section .section-heading h2{max-width:780px;font-size:clamp(42px,4.3vw,62px);line-height:1.12}
.work-section .section-intro{max-width:490px;font-size:17px;line-height:1.8}
.work-section .workflow-layout{grid-template-columns:minmax(0,1.7fr) minmax(330px,.8fr);gap:clamp(44px,6vw,100px)}
.work-section .workflow-item{grid-template-columns:54px minmax(0,1fr) auto;gap:20px;padding:25px 20px}
.work-section .workflow-number{font-size:13px}
.work-section .workflow-item h3{font-size:19px;line-height:1.35}
.work-section .workflow-item p{font-size:15px;line-height:1.75;max-width:700px}
.work-section .workflow-detail{font-size:10px;margin-top:13px}
.work-section .status-pill{font-size:10px;padding:7px 11px}
.work-section .workflow-aside{padding:28px 12px 16px 42px}
.work-section .aside-orb{width:170px;height:170px;margin-bottom:24px}
.work-section .workflow-aside .eyebrow{font-size:10px}
.work-section .workflow-aside h3{font-size:clamp(25px,2vw,31px);line-height:1.25}
.work-section .workflow-aside>p:not(.eyebrow){font-size:15px;line-height:1.8;max-width:430px}
.work-section .possibility-chips{gap:9px}
.work-section .possibility-chips>*{font-size:12px;padding:9px 13px}
.work-section .possibility-note{font-size:13px!important}
.work-section .text-link{font-size:14px}
@media(max-width:950px){.work-section .section-wrap{width:min(100% - 56px,820px)}.work-section .workflow-layout{grid-template-columns:1fr;gap:28px}.work-section .workflow-aside{border-left:0;border-top:1px solid var(--line);padding:30px 8px 8px;display:grid;grid-template-columns:145px 1fr;column-gap:22px;align-items:center}.work-section .aside-orb{grid-row:1/5;width:130px;height:130px;margin:0}.work-section .workflow-aside .eyebrow,.work-section .workflow-aside h3,.work-section .workflow-aside>p:not(.eyebrow),.work-section .possibility-chips,.work-section .possibility-note,.work-section .text-link{grid-column:2}}
@media(max-width:600px){.work-section .section-wrap{width:calc(100% - 36px)}.work-section .section-block{padding-top:70px;padding-bottom:72px}.work-section .section-heading{display:block;margin-bottom:30px}.work-section .section-heading h2{font-size:clamp(36px,10vw,48px)}.work-section .section-intro{font-size:16px;margin-top:17px}.work-section .workflow-item{grid-template-columns:30px minmax(0,1fr);gap:11px;padding:20px 6px}.work-section .workflow-item h3{font-size:17px}.work-section .workflow-item p{font-size:14px}.work-section .status-pill{grid-column:2;justify-self:start;margin-top:2px}.work-section .workflow-aside{grid-template-columns:1fr;padding:25px 3px 3px}.work-section .aside-orb{grid-row:auto;width:112px;height:112px;margin:0 auto 16px}.work-section .workflow-aside .eyebrow,.work-section .workflow-aside h3,.work-section .workflow-aside>p:not(.eyebrow),.work-section .possibility-chips,.work-section .possibility-note,.work-section .text-link{grid-column:1}.work-section .workflow-aside h3{font-size:25px}.work-section .workflow-aside>p:not(.eyebrow){font-size:14px}.work-section .possibility-chips>*{font-size:11px}}

/* Sistema global de legibilidad y ancho: aplicado a toda la web ServiTec */
:root{--page-gutter:clamp(24px,5.2vw,92px)}
body{font-size:17px;line-height:1.72}
.section-wrap,.site-header{width:min(1510px,calc(100% - (var(--page-gutter)*2)))}
.announcement{font-size:12px;min-height:40px;height:auto;padding:7px 16px}
.site-header{min-height:86px}
.brand{font-size:19px;gap:13px}
.brand img{width:44px;height:44px}
.main-nav{font-size:15px;gap:clamp(20px,2.4vw,38px)}
.nav-cta{padding:11px 18px}
.eyebrow{font-size:12px}
.hero{min-height:650px;gap:clamp(34px,5vw,80px)}
.hero-copy{max-width:720px}
.hero h1{font-size:clamp(54px,6vw,82px);max-width:800px}
.hero-lede{max-width:640px;font-size:19px;line-height:1.8}
.button{min-height:54px;padding-inline:23px;font-size:15px}
.hero-note{font-size:14px}
.hero-note p{max-width:390px}
.trust-inner{min-height:78px;height:auto;gap:22px;font-size:15px;flex-wrap:wrap;padding:14px 0}
.trust-inner>span:first-child{font-size:11px}
.section-block{padding-top:clamp(82px,8vw,126px);padding-bottom:clamp(82px,8vw,126px)}
.section-heading{gap:clamp(40px,7vw,120px);margin-bottom:48px}
.section-heading h2,.faq-layout h2{font-size:clamp(40px,4.5vw,62px);max-width:820px}
.section-intro{font-size:17px;max-width:520px;line-height:1.8}
.service-grid{gap:18px}
.service-card{min-height:260px;padding:30px 28px 58px;border-radius:10px}
.service-icon{width:46px;height:46px;font-size:23px;margin-bottom:24px}
.service-card h3,.resource-card h3{font-size:21px;line-height:1.4}
.service-card p,.resource-card p{font-size:16px;line-height:1.8;max-width:unset}
.service-tag{font-size:10px;left:28px;bottom:20px}
.section-footnote{font-size:14px;padding:17px 20px;line-height:1.7}
.method-section{padding-block:clamp(82px,8vw,126px)}
.method-head{gap:clamp(40px,7vw,120px);margin-bottom:52px}
.method-head h2,.diagnostic-copy h2,.closing-inner h2{font-size:clamp(42px,5vw,64px)}
.method-intro{font-size:16px;max-width:520px;line-height:1.75}
.step-card{padding-top:26px;padding-bottom:30px}
.step-n{font-size:12px;margin-bottom:36px}
.step-card h3{font-size:18px;line-height:1.4}
.step-card p{font-size:15px;line-height:1.8;max-width:330px}
.investment-band{padding:28px 32px;gap:32px}
.investment-label{font-size:11px}
.investment-band strong{font-size:18px}
.investment-band>p{font-size:15px;line-height:1.75}
.diagnostic-layout{min-height:560px;padding-block:clamp(76px,8vw,120px);gap:clamp(45px,7vw,110px)}
.diagnostic-copy h2{max-width:620px}
.diagnostic-copy>p:not(.eyebrow){font-size:16px;max-width:560px;line-height:1.85}
.diagnostic-proof{font-size:14px;flex-wrap:wrap}
.diagnostic-proof small{font-size:12px}
.quiz-card{padding:30px 34px;min-height:360px;border-radius:12px}
.quiz-top{font-size:11px}
.quiz-body{padding-top:30px}
.quiz-body h3{font-size:25px;line-height:1.4}
.quiz-body>p{font-size:15px;line-height:1.7}
.quiz-options{gap:12px}
.quiz-option{min-height:60px;padding:13px 15px;font-size:15px;line-height:1.5}
.quiz-result{padding:20px}
.quiz-result strong{font-size:18px}
.quiz-result p{font-size:14px;line-height:1.8}
.quiz-actions button,.quiz-actions a{padding:12px 16px;font-size:14px}
.resources-section{padding-block:clamp(82px,8vw,120px)}
.resource-grid{gap:18px}
.resource-card{min-height:230px;padding:28px;border-radius:10px}
.resource-type,.resource-price{font-size:11px}
.resource-bottom{font-size:10px}
.resources-footer{font-size:10px;padding-top:17px}
.resources-footer a{font-size:14px}
.faq-layout{padding-block:clamp(72px,7vw,108px);gap:clamp(45px,7vw,110px)}
.faq-layout h2{font-size:clamp(38px,4.2vw,58px)}
.faq-layout>div:first-child>p:last-child{font-size:15px;line-height:1.8}
.faq-question{padding:21px 38px 21px 0;font-size:17px;line-height:1.5}
.faq-question:after{font-size:23px;top:18px}
.faq-answer{font-size:15px;line-height:1.85}
.faq-answer p{padding-bottom:21px}
.closing-cta{padding:clamp(75px,8vw,120px) 0}
.closing-inner h2{max-width:1000px}
.closing-inner>p:not(.eyebrow){font-size:17px;line-height:1.8;max-width:720px}
.footer-main{min-height:125px}
.footer-main>p,.footer-links{font-size:13px}
.footer-links{gap:25px}
.footer-bottom{min-height:56px;height:auto;font-size:10px;gap:16px;flex-wrap:wrap;padding-block:12px}
.admin-link{font-size:12px;padding:11px 15px}
.toast{font-size:14px;padding:14px 18px}
/* Más presencia del fondo de procesos, manteniendo contraste de lectura */
.ambient-world{opacity:.92}
.ambient-haze{opacity:.17}
.haze-b{opacity:.12}
.ambient-mesh{opacity:.38}
.ambient-links{opacity:.34}
@media(max-width:950px){
 :root{--page-gutter:32px}
 .site-header{min-height:78px}
 .main-nav{font-size:14px;gap:17px}
 .hero{min-height:unset;grid-template-columns:1fr 1fr;gap:24px;padding-block:50px 64px}
 .hero h1{font-size:clamp(46px,6vw,65px)}
 .hero-lede{font-size:17px}
 .section-heading,.method-head{gap:32px}
 .section-heading h2,.faq-layout h2{font-size:clamp(37px,5vw,50px)}
 .service-grid{gap:13px}
 .service-card{padding:24px 21px 55px}
 .service-card h3,.resource-card h3{font-size:19px}
 .service-card p,.resource-card p{font-size:15px}
 .service-tag{left:21px}
 .diagnostic-layout{gap:36px}
 .faq-layout{gap:40px}
}
@media(max-width:700px){
 :root{--page-gutter:22px}
 body{font-size:16px}
 .announcement{font-size:10px}
 .site-header{min-height:70px}
 .brand{font-size:16px}
 .brand img{width:37px;height:37px}
 .main-nav{top:110px;font-size:16px;padding:22px;gap:17px}
 .hero{grid-template-columns:1fr;padding-block:48px 58px;gap:12px}
 .hero h1{font-size:clamp(43px,11vw,62px);max-width:680px}
 .hero-lede{font-size:17px;max-width:unset}
 .hero-note{font-size:13px;margin-top:26px}
 .section-block{padding-block:72px}
 .section-heading,.method-head{display:block;margin-bottom:32px}
 .section-heading h2,.faq-layout h2{font-size:clamp(35px,9vw,48px)}
 .section-intro{font-size:16px;margin-top:16px;max-width:unset}
 .service-grid{grid-template-columns:1fr;gap:13px}
 .service-card{min-height:unset;padding:23px 21px 52px}
 .service-card p,.resource-card p{font-size:15px}
 .service-tag{left:21px}
 .trust-inner{justify-content:flex-start;gap:12px;font-size:13px}
 .trust-inner>span:first-child{width:100%}
 .method-head h2,.diagnostic-copy h2,.closing-inner h2{font-size:clamp(36px,9vw,50px)}
 .method-intro{font-size:15px;margin-top:19px}
 .steps-grid{grid-template-columns:1fr 1fr}
 .step-card{padding:19px 14px 22px 0}
 .step-card+.step-card{padding-left:14px}
 .step-card h3{font-size:16px}
 .step-card p{font-size:14px}
 .investment-band{grid-template-columns:1fr;padding:22px;gap:15px}
 .investment-band strong{font-size:17px}
 .investment-band>p{font-size:14px}
 .diagnostic-layout{min-height:unset;padding-block:66px;grid-template-columns:1fr;gap:30px}
 .diagnostic-copy h2{font-size:clamp(36px,9vw,49px)}
 .diagnostic-copy>p:not(.eyebrow){font-size:15px}
 .quiz-card{padding:23px 20px;min-height:unset}
 .quiz-body h3{font-size:22px}
 .quiz-body>p{font-size:14px}
 .quiz-option{font-size:14px;min-height:56px}
 .resources-section{padding-block:72px}
 .resource-grid{grid-template-columns:1fr}
 .resource-card{min-height:unset;padding:23px}
 .faq-layout{padding-block:66px;grid-template-columns:1fr;gap:27px}
 .faq-layout h2{font-size:clamp(35px,9vw,48px)}
 .faq-question{font-size:16px}
 .faq-answer{font-size:14px}
 .closing-cta{padding:70px 0}
 .closing-inner>p:not(.eyebrow){font-size:15px}
 .footer-main{padding-block:23px;flex-wrap:wrap;gap:15px}
 .footer-main>p{width:100%;font-size:12px}
 .footer-links{font-size:12px;gap:15px;flex-wrap:wrap}
 .footer-bottom{font-size:9px}
 .ambient-world{opacity:.63}
 .ambient-haze{opacity:.12}
 .ambient-mesh{opacity:.22}
 .ambient-links{opacity:.26}
}
@media(max-width:390px){:root{--page-gutter:17px}.hero h1{font-size:clamp(39px,10.8vw,46px)}.quiz-options{grid-template-columns:1fr}.step-card p{font-size:13px}}

/* Pulido visual: identidad, escena principal y elementos equivalentes */
.site-header{min-height:94px;border-bottom-color:rgba(97,227,232,.2);background:linear-gradient(90deg,rgba(7,14,21,.72),rgba(11,20,29,.34),rgba(7,14,21,.72));backdrop-filter:blur(14px)}
.brand{position:relative;gap:15px;font-size:22px;font-weight:800;letter-spacing:.01em;text-shadow:0 0 22px rgba(97,227,232,.22);transition:color .25s,transform .25s,text-shadow .25s}
.brand:before{content:"";position:absolute;inset:-14px -20px;border:1px solid rgba(97,227,232,0);border-radius:14px;background:linear-gradient(120deg,rgba(97,227,232,0),rgba(97,227,232,.055),rgba(178,165,255,0));opacity:0;transition:opacity .3s,border-color .3s;z-index:-1}
.brand:hover{color:#fff;transform:translateY(-1px);text-shadow:0 0 28px rgba(97,227,232,.45)}
.brand:hover:before{opacity:1;border-color:rgba(97,227,232,.22)}
.brand img{width:52px;height:52px;filter:drop-shadow(0 0 9px rgba(97,227,232,.46));transition:transform .5s,filter .4s}
.brand:hover img{transform:rotate(-8deg) scale(1.08);filter:drop-shadow(0 0 17px rgba(97,227,232,.8))}
.main-nav a{transition:color .2s,transform .2s,text-shadow .2s}
.main-nav>a:not(.nav-cta):hover{transform:translateY(-2px);text-shadow:0 0 16px rgba(97,227,232,.45)}
.nav-cta{box-shadow:0 0 0 0 rgba(97,227,232,0);transition:box-shadow .25s,background .25s,transform .25s}
.nav-cta:hover{background:rgba(97,227,232,.1);box-shadow:0 0 26px rgba(97,227,232,.18);transform:translateY(-2px)}
.hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(44px,5.5vw,100px);min-height:720px}
.hero-art{height:620px;min-width:0;overflow:visible;transform:scale(1.05);transform-origin:center}
.hero-art:before{width:min(680px,65vw);height:min(570px,56vw);background:radial-gradient(ellipse,rgba(36,185,196,.25),rgba(94,75,175,.13) 44%,transparent 72%);filter:blur(25px)}
.signal-board{width:min(550px,96%);height:350px;border-radius:24px;background:linear-gradient(138deg,rgba(22,50,64,.88),rgba(11,24,36,.88) 58%,rgba(31,34,57,.84));box-shadow:inset 0 1px rgba(255,255,255,.1),0 42px 90px rgba(0,0,0,.48),0 0 85px rgba(46,199,207,.16);animation:boardDrift 7s ease-in-out infinite,boardTurn 13s ease-in-out infinite alternate}
.board-top{top:23px;left:27px;right:27px;font-size:11px;letter-spacing:.12em}
.board-top small{font-size:10px}
.board-top i{width:8px;height:8px}
.board-flow{inset:48px 0 38px;height:calc(100% - 86px)}
.board-label{font-size:10px;letter-spacing:.08em;text-shadow:0 2px 8px #071018}
.board-label small{font-size:12px;line-height:1.45}
.label-in{left:26px;top:123px}.label-core{top:137px}.label-out{right:25px;top:123px}
.board-foot{left:27px;right:27px;bottom:20px;font-size:11px}
.board-foot>span{font-size:9px}.board-foot b{font-size:9px}
.art-orbit{width:clamp(380px,34vw,510px);height:clamp(380px,34vw,510px);border-color:rgba(103,178,195,.2)}
.orbit-two{width:clamp(285px,26vw,390px);height:clamp(285px,26vw,390px);border-color:rgba(97,227,232,.36)}
.art-core{width:174px;height:174px;box-shadow:0 0 0 17px rgba(79,199,205,.055),0 0 100px rgba(40,206,214,.29)}
.art-core img{width:100px;height:100px}
.art-core span{font-size:10px}
.orbit-chip{min-width:235px;padding:16px 18px;gap:13px;font-size:15px;border-color:rgba(189,218,231,.26);background:rgba(14,24,34,.96);box-shadow:0 18px 50px #0007,0 0 24px rgba(97,227,232,.06);animation-duration:7s,8s}
.orbit-chip small{font-size:12px;line-height:1.4;color:#a3b8c2}
.chip-icon{width:39px;height:39px;font-size:21px}
.chip-top{left:3%;top:15%}.chip-right{right:-1%;top:45%}.chip-bottom{left:5%;bottom:15%}
@keyframes boardTurn{0%,100%{rotate:-.7deg}50%{rotate:.7deg}}
@keyframes orbitChipTilt{0%,100%{rotate:-1.2deg}50%{rotate:1.2deg}}
.chip-top{animation:chipFloat 6s ease-in-out infinite,orbitChipTilt 9s ease-in-out infinite}
.chip-right{animation:chipFloat 6.8s ease-in-out -1.8s infinite,orbitChipTilt 10s ease-in-out -2s infinite reverse}
.chip-bottom{animation:chipFloat 7.2s ease-in-out -3.1s infinite,orbitChipTilt 11s ease-in-out -4s infinite}
.hero-note{margin-top:40px;padding:17px 20px;border:1px solid rgba(97,227,232,.2);border-radius:13px;background:linear-gradient(105deg,rgba(18,35,46,.78),rgba(17,26,40,.54));box-shadow:0 14px 40px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.035);max-width:540px}
.hero-note p{font-size:15px;line-height:1.65;max-width:unset;margin:0}
.mini-avatars span{width:37px;height:37px;font-size:11px;box-shadow:0 0 17px rgba(97,227,232,.11)}
.trust-strip{position:relative;background:linear-gradient(90deg,rgba(11,20,28,.98),rgba(14,30,39,.98),rgba(11,20,28,.98));border-color:rgba(97,227,232,.2)}
.trust-strip:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 0,rgba(97,227,232,.11),transparent 70%)}
.trust-inner{min-height:92px;gap:24px;font-size:16px}
.trust-inner>span:first-child{font-size:11px;letter-spacing:.13em;color:#9bb2bf}
.trust-inner strong{font-size:16px;color:#e7f0f4}
.strip-mark{font-size:21px;text-shadow:0 0 14px rgba(255,195,107,.48)}
.aside-orb{filter:drop-shadow(0 0 19px rgba(97,227,232,.12))}
.signal-icon{box-shadow:0 0 0 9px rgba(97,227,232,.05),0 0 32px rgba(97,227,232,.14)}
@media(max-width:950px){.hero{min-height:unset;gap:26px}.hero-art{height:530px;transform:scale(1)}.signal-board{width:min(480px,96%);height:310px}.orbit-chip{min-width:205px}.chip-right{right:-2%}.art-core{width:150px;height:150px}.art-core img{width:86px;height:86px}}
@media(max-width:700px){.site-header{min-height:72px}.brand{font-size:18px;gap:10px}.brand img{width:42px;height:42px}.hero{gap:4px}.hero-art{height:430px;width:100%;margin:0;transform:none;overflow:hidden}.hero-art:before{width:100%;height:330px}.signal-board{width:min(410px,88%);height:268px;border-radius:18px}.board-top{top:15px;left:17px;right:17px;font-size:8px}.board-top small{font-size:8px}.board-flow{inset:34px 0 30px;height:calc(100% - 64px)}.board-label{font-size:7px}.board-label small{font-size:9px}.label-in{left:14px;top:91px}.label-core{top:100px}.label-out{right:13px;top:91px}.board-foot{left:16px;right:16px;bottom:13px;font-size:8px}.board-foot b{font-size:7px}.art-orbit{width:340px;height:340px}.orbit-two{width:250px;height:250px}.art-core{width:125px;height:125px}.art-core img{width:72px;height:72px}.art-core span{font-size:8px}.orbit-chip{min-width:160px;padding:10px 11px;font-size:12px;gap:8px}.orbit-chip small{font-size:9px}.chip-icon{width:31px;height:31px;font-size:17px}.chip-top{left:2%;top:11%}.chip-right{right:0;top:43%}.chip-bottom{left:3%;bottom:10%}.hero-note{margin-top:24px;padding:13px 14px}.hero-note p{font-size:13px}.mini-avatars span{width:31px;height:31px;font-size:9px}.trust-inner{min-height:unset;padding-block:18px;gap:12px}.trust-inner strong{font-size:14px}.trust-inner>span:first-child{font-size:9px}}
@media(max-width:430px){.hero-art{height:365px}.signal-board{width:86%;height:235px}.board-top{font-size:7px}.board-label{font-size:6px}.board-label small{font-size:8px}.label-in{left:10px;top:82px}.label-core{top:91px}.label-out{right:9px;top:82px}.board-foot{font-size:7px}.board-foot b{font-size:6px}.art-orbit{width:290px;height:290px}.orbit-two{width:215px;height:215px}.art-core{width:108px;height:108px}.art-core img{width:63px;height:63px}.orbit-chip{min-width:139px;padding:8px;font-size:11px}.orbit-chip small{font-size:8px}.chip-icon{width:27px;height:27px}.chip-right{right:-1%;top:44%}}
@media(prefers-reduced-motion:reduce){.brand,.brand img,.main-nav a,.nav-cta{transition:none}.brand:hover,.brand:hover img{transform:none}.signal-board,.orbit-chip{animation:none!important}}

/* Ajustes solicitados: cabecera no fija, tarjetas orbitales, iconos y cierre de marca */
.site-header{position:static!important;top:auto!important;inset-block-start:auto!important}
.hero-art .orbit-chip{left:50%;top:50%;right:auto;bottom:auto;offset-path:ellipse(250px 165px at 0 0);offset-anchor:center;offset-rotate:0deg;offset-distance:0%;transform:translate3d(var(--float-x,0px),var(--float-y,0px),60px);animation:chipOrbit 42s linear infinite;will-change:offset-distance,filter;z-index:5}
.hero-art .chip-right{animation-delay:-14s}.hero-art .chip-bottom{animation-delay:-28s}
.hero-art .orbit-chip:hover{filter:brightness(1.25);animation-play-state:paused}
@keyframes chipOrbit{to{offset-distance:100%}}
.art-core{animation:coreFloat 5.5s ease-in-out infinite,logoRipple 3.3s ease-out infinite;}
.art-core:after{content:"";position:absolute;inset:-18px;border:1px solid rgba(97,227,232,.34);border-radius:50%;animation:rippleRing 3.3s ease-out infinite;pointer-events:none}
@keyframes rippleRing{0%{transform:scale(.82);opacity:.8}85%,100%{transform:scale(1.35);opacity:0}}
@keyframes logoRipple{0%,100%{box-shadow:0 0 0 17px rgba(79,199,205,.055),0 0 52px rgba(40,206,214,.2)}50%{box-shadow:0 0 0 24px rgba(79,199,205,.09),0 0 100px rgba(40,206,214,.42)}}
.art-caption{width:220px;height:30px;bottom:7px;justify-content:center;font-size:12px;letter-spacing:.14em;color:#bce9ec}
.art-caption .caption-item{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;animation:captionCycle 9s ease-in-out infinite;color:#c7f8f5;text-shadow:0 0 15px rgba(97,227,232,.45)}
.caption-one{animation-delay:0s!important}.caption-two{animation-delay:3s!important}.caption-three{animation-delay:6s!important}
@keyframes captionCycle{0%,7%{opacity:0;transform:translateY(9px)}13%,27%{opacity:1;transform:translateY(0)}34%,100%{opacity:0;transform:translateY(-7px)}}
/* Iconos propios con color y relieve; la forma varía por solución para que se lea cada categoría */
.service-icon{position:relative;isolation:isolate;width:54px;height:54px;border-radius:15px!important;font-size:27px!important;font-weight:700;box-shadow:inset 0 1px rgba(255,255,255,.18),0 9px 22px rgba(0,0,0,.2),0 0 22px rgba(97,227,232,.12);transition:transform .35s,filter .35s,box-shadow .35s}
.service-icon:before{content:"";position:absolute;inset:-5px;border:1px solid currentColor;border-radius:19px;opacity:.2;z-index:-1;transition:transform .4s,opacity .4s}
.service-card:nth-child(3n+1) .service-icon{background:linear-gradient(145deg,#1c6971,#12323c)!important;color:#9efffa!important}
.service-card:nth-child(3n+2) .service-icon{background:linear-gradient(145deg,#84602a,#382a1a)!important;color:#ffda8f!important}
.service-card:nth-child(3n) .service-icon{background:linear-gradient(145deg,#594a9e,#28233e)!important;color:#d0c4ff!important}
.service-card:hover .service-icon{transform:translateY(-4px) rotate(-7deg) scale(1.08);filter:brightness(1.2);box-shadow:0 12px 32px rgba(0,0,0,.28),0 0 34px currentColor}
.service-card:hover .service-icon:before{transform:scale(1.24) rotate(20deg);opacity:.55}
.service-card{overflow:hidden}
.service-card:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 13% 17%,rgba(97,227,232,.11),transparent 30%),linear-gradient(120deg,transparent 35%,rgba(255,255,255,.025),transparent 65%);opacity:.6}
/* Nueva escena para posibilidades: panel de control con señal, diferente a la órbita del hero */
.work-section .workflow-aside .aside-orb{position:relative;width:min(100%,390px);height:190px;border:1px solid rgba(97,227,232,.23);border-radius:18px;background:linear-gradient(125deg,rgba(14,32,43,.96),rgba(15,25,39,.96) 60%,rgba(39,32,64,.8));overflow:hidden;box-shadow:inset 0 1px rgba(255,255,255,.07),0 22px 50px rgba(0,0,0,.25),0 0 32px rgba(97,227,232,.08);margin:0 0 25px;display:flex;align-items:center;justify-content:center}
.work-section .workflow-aside .aside-orb:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(97,227,232,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(97,227,232,.055) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(90deg,#000,transparent 95%);opacity:.7}
.work-section .workflow-aside .aside-orb:after{content:"PROCESO  /  OPORTUNIDAD  /  MEJORA";position:absolute;left:17px;bottom:14px;color:rgba(159,220,223,.67);font:9px var(--mono);letter-spacing:.14em}
.work-section .workflow-aside .orb-ring{inset:auto;left:12%;top:50%;width:56%;height:1px;border:0;border-top:1px dashed rgba(97,227,232,.52);border-radius:0;animation:flowSignal 4s ease-in-out infinite alternate}
.work-section .workflow-aside .orb-ring:before{inset:auto;left:0;top:-4px;width:9px;height:9px;background:#61e3e8;border:0;border-radius:50%;box-shadow:0 0 15px #61e3e8}
.work-section .workflow-aside .orb-ring:after{inset:auto;right:0;top:-5px;width:11px;height:11px;background:#ffc36b;border:0;border-radius:3px;transform:rotate(45deg);box-shadow:0 0 15px #ffc36b}
.work-section .workflow-aside .orb-center{position:relative;z-index:1;width:100px;height:72px;border-radius:13px;background:linear-gradient(145deg,#183e4b,#152239);border:1px solid rgba(97,227,232,.35);font:700 14px var(--mono);box-shadow:0 0 28px rgba(97,227,232,.22);animation:panelPulse 3s ease-in-out infinite}
.work-section .workflow-aside .orb-center:after{content:"ANÁLISIS";position:absolute;top:48px;color:#9db9c2;font:8px var(--mono);letter-spacing:.13em}
.work-section .workflow-aside .orb-dot{z-index:2;width:8px;height:8px;animation:dotBlink 2.2s ease-in-out infinite alternate}
.work-section .workflow-aside .dot-1{left:12%;top:28%}.work-section .workflow-aside .dot-2{right:13%;bottom:34%}.work-section .workflow-aside .dot-3{left:32%;bottom:21%}
@keyframes flowSignal{from{transform:translateX(-5%);opacity:.55}to{transform:translateX(12%);opacity:1}}
@keyframes panelPulse{50%{box-shadow:0 0 40px rgba(97,227,232,.4);border-color:rgba(97,227,232,.65)}}
@keyframes dotBlink{to{opacity:.45;transform:scale(.72)}}
/* El CTA final repite la identidad de marca con ondas y destello lento */
.closing-orb{position:relative;isolation:isolate;width:78px;height:78px;margin-bottom:24px;border-color:rgba(97,227,232,.58);background:radial-gradient(circle,rgba(97,227,232,.16),rgba(11,25,34,.85) 70%);box-shadow:0 0 0 9px rgba(97,227,232,.045),0 0 35px rgba(97,227,232,.2);animation:brandGlow 2.6s ease-in-out infinite}
.closing-orb:before,.closing-orb:after{content:"";position:absolute;inset:-10px;border:1px solid rgba(97,227,232,.42);border-radius:50%;animation:closingWave 3.2s ease-out infinite;z-index:-1}
.closing-orb:after{animation-delay:1.6s}
.closing-orb img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 0 11px rgba(97,227,232,.7));animation:logoBlink 2.6s ease-in-out infinite}
@keyframes closingWave{0%{transform:scale(.82);opacity:.8}100%{transform:scale(1.8);opacity:0}}
@keyframes logoBlink{0%,100%{filter:drop-shadow(0 0 6px rgba(97,227,232,.38));opacity:.86}50%{filter:drop-shadow(0 0 19px rgba(97,227,232,.95));opacity:1}}
@keyframes brandGlow{50%{box-shadow:0 0 0 13px rgba(97,227,232,.07),0 0 48px rgba(97,227,232,.34)}}
@media(max-width:950px){.hero-art .orbit-chip{offset-path:ellipse(195px 135px at 0 0)}.work-section .workflow-aside .aside-orb{width:min(100%,390px)}}
@media(max-width:700px){.hero-art .orbit-chip{offset-path:ellipse(145px 104px at 0 0)}.art-caption{bottom:2px;font-size:10px}.service-icon{width:48px;height:48px}.work-section .workflow-aside .aside-orb{height:170px;margin-inline:auto}.work-section .workflow-aside .orb-ring{left:14%;width:52%}.closing-orb{width:70px;height:70px}.closing-orb img{width:52px;height:52px}}
@media(prefers-reduced-motion:reduce){.hero-art .orbit-chip,.art-core,.art-core:after,.art-caption .caption-item,.service-icon,.service-icon:before,.work-section .workflow-aside .orb-ring,.work-section .workflow-aside .orb-center,.work-section .workflow-aside .orb-dot,.closing-orb,.closing-orb:before,.closing-orb:after,.closing-orb img{animation:none!important;transition:none!important}}

/* Corregir órbita: las tarjetas recorren únicamente el área alrededor del modelo */
.hero-art .orbit-chip{left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;width:220px;min-width:220px;offset-path:none!important;offset-distance:0!important;offset-anchor:auto;transform:translate(-50%,-50%);animation:orbitInside 36s linear infinite!important;will-change:transform;}
.hero-art .chip-right{animation-delay:-12s!important}.hero-art .chip-bottom{animation-delay:-24s!important}
@keyframes orbitInside{0%{transform:translate(-50%,-50%) translate(0,-145px) rotate(-2deg)}25%{transform:translate(-50%,-50%) translate(205px,0) rotate(1deg)}50%{transform:translate(-50%,-50%) translate(0,145px) rotate(2deg)}75%{transform:translate(-50%,-50%) translate(-205px,0) rotate(-1deg)}100%{transform:translate(-50%,-50%) translate(0,-145px) rotate(-2deg)}}
@media(max-width:950px){.hero-art .orbit-chip{width:195px;min-width:195px}.hero-art .chip-top{animation-delay:0s!important}.hero-art .chip-right{animation-delay:-12s!important}.hero-art .chip-bottom{animation-delay:-24s!important}@keyframes orbitInside{0%{transform:translate(-50%,-50%) translate(0,-115px) rotate(-2deg)}25%{transform:translate(-50%,-50%) translate(160px,0) rotate(1deg)}50%{transform:translate(-50%,-50%) translate(0,115px) rotate(2deg)}75%{transform:translate(-50%,-50%) translate(-160px,0) rotate(-1deg)}100%{transform:translate(-50%,-50%) translate(0,-115px) rotate(-2deg)}}}
@media(max-width:700px){.hero-art .orbit-chip{width:155px;min-width:155px;padding:9px 10px}.hero-art .chip-top{animation-delay:0s!important}.hero-art .chip-right{animation-delay:-12s!important}.hero-art .chip-bottom{animation-delay:-24s!important}@keyframes orbitInside{0%{transform:translate(-50%,-50%) translate(0,-82px) rotate(-1deg)}25%{transform:translate(-50%,-50%) translate(112px,0) rotate(1deg)}50%{transform:translate(-50%,-50%) translate(0,82px) rotate(1deg)}75%{transform:translate(-50%,-50%) translate(-112px,0) rotate(-1deg)}100%{transform:translate(-50%,-50%) translate(0,-82px) rotate(-1deg)}}}
@media(max-width:430px){.hero-art .orbit-chip{width:137px;min-width:137px;padding:7px}.hero-art .chip-top{animation-delay:0s!important}.hero-art .chip-right{animation-delay:-12s!important}.hero-art .chip-bottom{animation-delay:-24s!important}@keyframes orbitInside{0%{transform:translate(-50%,-50%) translate(0,-67px) rotate(-1deg)}25%{transform:translate(-50%,-50%) translate(93px,0) rotate(1deg)}50%{transform:translate(-50%,-50%) translate(0,67px) rotate(1deg)}75%{transform:translate(-50%,-50%) translate(-93px,0) rotate(-1deg)}100%{transform:translate(-50%,-50%) translate(0,-67px) rotate(-1deg)}}}
@media(prefers-reduced-motion:reduce){.hero-art .orbit-chip{animation:none!important}}

/* Órbita EXTERIOR al panel: reducir el tablero y separar las tarjetas de su superficie */
.hero-art .signal-board{width:min(420px,78%);height:260px}
.hero-art .orbit-chip{width:150px;min-width:150px;padding:11px 12px}
.hero-art .orbit-chip>span:last-child{font-size:13px;line-height:1.25}
.hero-art .orbit-chip small{font-size:10px;line-height:1.35}
.hero-art .chip-icon{width:32px;height:32px;flex:0 0 32px}
.hero-art .orbit-chip{animation:orbitOutside 36s linear infinite!important}
.hero-art .chip-right{animation-delay:-12s!important}.hero-art .chip-bottom{animation-delay:-24s!important}
@keyframes orbitOutside{0%{transform:translate(-50%,-50%) translate(0,-165px) rotate(-1deg)}25%{transform:translate(-50%,-50%) translate(290px,0) rotate(1deg)}50%{transform:translate(-50%,-50%) translate(0,165px) rotate(1deg)}75%{transform:translate(-50%,-50%) translate(-290px,0) rotate(-1deg)}100%{transform:translate(-50%,-50%) translate(0,-165px) rotate(-1deg)}}
/* La escena de posibilidades ahora comunica una secuencia: entrada, análisis y resultado */
.work-section .workflow-aside .aside-orb{background:linear-gradient(115deg,rgba(12,28,39,.98),rgba(13,31,43,.98) 55%,rgba(33,29,57,.9));}
.work-section .workflow-aside .orb-ring{left:12%;top:50%;width:76%;height:3px;border:0;background:linear-gradient(90deg,rgba(97,227,232,.28),rgba(97,227,232,.8) 35%,rgba(178,165,255,.8) 62%,rgba(255,195,107,.9));background-size:220% 100%;box-shadow:0 0 12px rgba(97,227,232,.35);animation:timelineProgress 5s linear infinite}
.work-section .workflow-aside .orb-ring:before{left:0;top:-4px;width:11px;height:11px;border:2px solid #b8ffff;background:#38cbd4;box-shadow:0 0 18px #61e3e8}
.work-section .workflow-aside .orb-ring:after{right:0;top:-4px;width:11px;height:11px;border:2px solid #ffe0a3;background:#ffb94f;box-shadow:0 0 18px #ffc36b;transform:none}
.work-section .workflow-aside .orb-center{width:112px;height:76px;border-radius:14px;font-size:15px;background:linear-gradient(145deg,#153b49,#19233d);box-shadow:0 0 30px rgba(97,227,232,.25)}
.work-section .workflow-aside .orb-center:after{content:"ANÁLISIS IA";top:51px}
.work-section .workflow-aside .dot-1{left:12%;top:50%;bottom:auto;transform:translateY(-50%)}
.work-section .workflow-aside .dot-2{right:12%;top:50%;bottom:auto;transform:translateY(-50%)}
.work-section .workflow-aside .dot-3{left:35%;top:30%;bottom:auto}
.work-section .workflow-aside .dot-1:after,.work-section .workflow-aside .dot-2:after{position:absolute;top:17px;left:50%;transform:translateX(-50%);white-space:nowrap;color:#b7ccd4;font:8px var(--mono);letter-spacing:.1em}
.work-section .workflow-aside .dot-1:after{content:"ENTRADA"}.work-section .workflow-aside .dot-2:after{content:"RESULTADO"}
@keyframes timelineProgress{0%{background-position:100% 0;filter:brightness(.75)}50%{filter:brightness(1.3)}100%{background-position:-120% 0;filter:brightness(.85)}}
@media(max-width:950px){.hero-art .signal-board{width:min(390px,78%);height:245px}.hero-art .orbit-chip{width:140px;min-width:140px}@keyframes orbitOutside{0%{transform:translate(-50%,-50%) translate(0,-145px) rotate(-1deg)}25%{transform:translate(-50%,-50%) translate(245px,0) rotate(1deg)}50%{transform:translate(-50%,-50%) translate(0,145px) rotate(1deg)}75%{transform:translate(-50%,-50%) translate(-245px,0) rotate(-1deg)}100%{transform:translate(-50%,-50%) translate(0,-145px) rotate(-1deg)}}}
@media(max-width:700px){.hero-art .signal-board{width:min(310px,74%);height:205px}.hero-art .orbit-chip{width:124px;min-width:124px;padding:8px}.hero-art .orbit-chip>span:last-child{font-size:11px}.hero-art .orbit-chip small{font-size:8px}.hero-art .chip-icon{width:27px;height:27px;flex-basis:27px}@keyframes orbitOutside{0%{transform:translate(-50%,-50%) translate(0,-126px) rotate(-1deg)}25%{transform:translate(-50%,-50%) translate(207px,0) rotate(1deg)}50%{transform:translate(-50%,-50%) translate(0,126px) rotate(1deg)}75%{transform:translate(-50%,-50%) translate(-207px,0) rotate(-1deg)}100%{transform:translate(-50%,-50%) translate(0,-126px) rotate(-1deg)}}.work-section .workflow-aside .orb-center{width:95px;height:68px}.work-section .workflow-aside .orb-center:after{top:45px}}
@media(max-width:430px){.hero-art .signal-board{width:min(280px,72%);height:188px}.hero-art .orbit-chip{width:116px;min-width:116px;padding:7px}.hero-art .orbit-chip>span:last-child{font-size:10px}.hero-art .orbit-chip small{font-size:7px}.hero-art .chip-icon{width:24px;height:24px;flex-basis:24px}@keyframes orbitOutside{0%{transform:translate(-50%,-50%) translate(0,-112px) rotate(-1deg)}25%{transform:translate(-50%,-50%) translate(183px,0) rotate(1deg)}50%{transform:translate(-50%,-50%) translate(0,112px) rotate(1deg)}75%{transform:translate(-50%,-50%) translate(-183px,0) rotate(-1deg)}100%{transform:translate(-50%,-50%) translate(0,-112px) rotate(-1deg)}}}

/* Cabecera normal del documento: acompaña el desplazamiento y no se fija al viewport */
html body>.site-header,.site-header{position:static!important;inset:auto!important;translate:none!important;transform:none!important}
/* Animación constante, discreta y de baja intensidad para la firma ServiTec */
.site-header .brand img{animation:servitecLogoPulse 4s ease-in-out infinite;will-change:filter,transform}
.site-header .brand>span{background:linear-gradient(105deg,#ecf3f7 0%,#ecf3f7 35%,#8ff7f1 50%,#ecf3f7 65%,#ecf3f7 100%);background-size:230% 100%;background-position:100% 50%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:servitecNameShine 7s ease-in-out infinite}
@keyframes servitecLogoPulse{0%,100%{filter:drop-shadow(0 0 6px rgba(97,227,232,.34));transform:scale(1)}50%{filter:drop-shadow(0 0 15px rgba(97,227,232,.72));transform:scale(1.045)}}
@keyframes servitecNameShine{0%,20%{background-position:100% 50%}70%,100%{background-position:0 50%}}
.site-header .brand:hover img{animation-play-state:paused;transform:rotate(-8deg) scale(1.1)}
.site-header .brand:hover>span{animation-play-state:paused;color:#fff}
@media(prefers-reduced-motion:reduce){.site-header .brand img,.site-header .brand>span{animation:none!important}.site-header .brand>span{color:var(--ink);background:none}}

/* Cabecera persistente: acompaña la navegación mientras se recorre la página */
.site-header{position:sticky!important;top:0!important;inset-block-start:0!important;z-index:100!important;translate:0 0!important;transform:none!important;background:rgba(7,14,21,.94)!important;backdrop-filter:blur(18px);box-shadow:0 10px 30px rgba(0,0,0,.18)}

/* Navegación persistente real: conserva su espacio inicial y acompaña el scroll */
.announcement{position:relative;z-index:102;margin-bottom:94px}
body .site-header{position:fixed!important;top:40px!important;left:50%!important;right:auto!important;z-index:101!important;width:min(1510px,calc(100% - (var(--page-gutter,5vw)*2)))!important;min-height:94px;height:94px;margin:0!important;transform:translateX(-50%)!important;transition:top .24s ease,background .24s ease,box-shadow .24s ease!important;background:rgba(7,14,21,.92)!important;backdrop-filter:blur(18px);box-shadow:0 10px 30px rgba(0,0,0,.18)}
body.has-scrolled .site-header{top:0!important;background:rgba(7,14,21,.97)!important;box-shadow:0 12px 34px rgba(0,0,0,.3)}
@media(max-width:700px){.announcement{margin-bottom:72px}body .site-header{top:40px!important;min-height:72px;height:72px}body.has-scrolled .site-header{top:0!important}}

/* Barra anclada al viewport con contenido centrado: visible durante todo el scroll */
.announcement{margin-bottom:94px!important}
body .site-header{position:fixed!important;top:40px!important;left:0!important;right:0!important;bottom:auto!important;width:100%!important;max-width:none!important;height:94px!important;min-height:94px!important;margin:0!important;padding-inline:clamp(24px,calc((100vw - 1510px)/2),190px)!important;box-sizing:border-box!important;transform:none!important;translate:none!important;z-index:1000!important;background:rgba(7,14,21,.95)!important;border-bottom:1px solid rgba(97,227,232,.24);backdrop-filter:blur(18px);box-shadow:0 10px 30px rgba(0,0,0,.22)}
body.has-scrolled .site-header{top:0!important}
@media(max-width:700px){.announcement{margin-bottom:72px!important}body .site-header{top:40px!important;height:72px!important;min-height:72px!important;padding-inline:18px!important}body.has-scrolled .site-header{top:0!important}}

html{scroll-padding-top:108px}.hero#inicio{scroll-margin-top:134px}main section[id]{scroll-margin-top:108px}


/* Corrección definitiva de navegación: esta regla supera los antiguos overrides estáticos. */
html body>header.site-header{position:fixed!important;inset:40px 0 auto!important;width:100%!important;max-width:none!important;height:86px!important;min-height:86px!important;margin:0!important;padding-inline:clamp(24px,calc((100vw - 1510px)/2),190px)!important;transform:none!important;translate:none!important;z-index:1200!important;background:rgba(7,14,21,.96)!important;border-bottom:1px solid rgba(97,227,232,.24)!important;backdrop-filter:blur(18px);box-shadow:0 10px 30px rgba(0,0,0,.22);transition:inset .22s ease,background .22s ease,box-shadow .22s ease!important}
html body.has-scrolled>header.site-header{inset:0 0 auto!important;background:rgba(7,14,21,.98)!important;box-shadow:0 12px 34px rgba(0,0,0,.3)}
html body>.announcement{margin-bottom:86px!important}
html{scroll-padding-top:100px}main section[id]{scroll-margin-top:100px}
@media(max-width:700px){html body>header.site-header{inset:36px 0 auto!important;height:70px!important;min-height:70px!important;padding-inline:18px!important}html body.has-scrolled>header.site-header{inset:0 0 auto!important}html body>.announcement{margin-bottom:70px!important}}

/* === Recursos: tarjeta resumen + cuadros flotantes ===================
   La tarjeta ya no lleva boton: imagen a la izquierda, texto a la
   derecha, descripcion recortada, y al tocarla abre la ficha. */
.resource-card{cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.resource-card:hover,.resource-card:focus-visible{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(97,227,232,.22),0 22px 44px rgba(0,0,0,.2)}
.resource-card:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.resource-card.con-imagen{flex-direction:row;gap:16px;align-items:flex-start}
.resource-card .resource-media{flex:0 0 96px}
.resource-card.con-imagen .resource-image{width:96px;height:96px;object-fit:cover;border-radius:9px;margin:0}
.resource-info{display:flex;flex-direction:column;flex:1;min-width:0}
.resource-info h3{margin:0 0 8px}
/* Unas cuantas lineas y lo demas en la ficha. */
.resource-text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.resource-hint{margin-top:auto;padding-top:14px;color:var(--cyan);font:600 12px var(--font);letter-spacing:.02em}
.resource-hint b{font-weight:700}
.catalog-vacio{grid-column:1/-1;padding:26px;border:1px dashed var(--line);border-radius:9px;color:#8ea3ae;text-align:center}

.modal[hidden]{display:none}
.modal{position:fixed;inset:0;z-index:4000;display:flex;align-items:center;justify-content:center;padding:22px}
.modal-fondo{position:absolute;inset:0;background:rgba(4,8,13,.76);backdrop-filter:blur(5px)}
.modal-caja{position:relative;z-index:1;width:min(660px,100%);max-height:86vh;overflow:auto;padding:30px;border-radius:14px;background:linear-gradient(145deg,#14222d,#0e1821);box-shadow:inset 0 0 0 1px rgba(97,227,232,.16),0 30px 80px rgba(0,0,0,.45)}
.modal-ancho{width:min(1120px,100%)}
.modal-caja>h3{margin:0 0 18px;font-size:20px}
.modal-cerrar{position:absolute;top:12px;right:12px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(193,220,236,.08);color:var(--ink);font-size:19px;line-height:1;cursor:pointer}
.modal-cerrar:hover{background:rgba(97,227,232,.18)}
.modal-cerrar:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.ficha{display:flex;gap:22px;align-items:flex-start}
.ficha-media{flex:0 0 232px}
.ficha-media img{width:100%;border-radius:11px;display:block}
.ficha-info{flex:1;min-width:0}
.ficha-info h3{margin:0 0 12px;font-size:23px}
.ficha-info p{margin:0 0 20px}
.ficha-botones{display:flex;flex-wrap:wrap;gap:12px}
.ficha-botones .resource-action{padding:11px 17px;border-radius:7px;background:rgba(97,227,232,.12);box-shadow:inset 0 0 0 1px rgba(97,227,232,.28)}
.ficha-botones .resource-action:hover{background:rgba(97,227,232,.2)}
.resource-espera{color:#8ea3ae;font-size:13px}
body.con-modal{overflow:hidden}
.modal .catalog-filter{margin-bottom:20px}
@media(max-width:700px){
  .modal{padding:12px}
  .modal-caja{padding:22px 18px;max-height:92vh}
  .ficha{flex-direction:column;gap:16px}
  .ficha-media{flex:0 0 auto;width:100%}
  .resource-card.con-imagen{gap:13px}
  .resource-card .resource-media{flex-basis:76px}
  .resource-card.con-imagen .resource-image{width:76px;height:76px}
}

/* === Etiquetas flotantes de aviso ====================================
   Chicas y pegadas al borde derecho: solo se ve el titulo. Al pasar el
   mouse se abren y sale el texto completo; el alto lo pone el texto.

   No son invasivas a proposito:
   - el contenedor no recibe clics (pointer-events: none), solo la
     etiqueta, asi que no tapan lo que haya debajo;
   - van en z-index 900: por debajo de los cuadros flotantes (4000) y de
     la barra del editor (9999);
   - cerradas miden lo que mide su titulo, con un tope;
   - en movil se van abajo, que es donde menos estorban. */
.promos{
  position:fixed; right:0; z-index:900;
  display:flex; flex-direction:column; align-items:flex-end; gap:10px;
  pointer-events:none;
  max-width:min(340px,86vw);
}
.promos.pos-arriba{top:96px}
.promos.pos-medio{top:50%;transform:translateY(-50%)}
.promos.pos-abajo{bottom:24px}
.promos:empty{display:none}

.promo{
  pointer-events:auto;
  display:grid; grid-template-columns:auto 1fr; align-items:center; gap:9px;
  width:auto; max-width:230px;
  margin:0; padding:11px 15px 11px 13px;
  border:0; border-radius:12px 0 0 12px;
  background:linear-gradient(145deg,#14222d,#0f1821);
  box-shadow:inset 0 0 0 1px rgba(97,227,232,.22),-6px 10px 28px rgba(0,0,0,.34);
  color:var(--ink); font:inherit; text-align:left; text-decoration:none;
  cursor:pointer;
  transition:max-width .28s cubic-bezier(.2,.75,.25,1),transform .28s ease,box-shadow .2s ease;
}
.promo:hover,.promo:focus-visible,.promo.abierta{
  max-width:min(340px,86vw);
  transform:translateX(-6px);
  box-shadow:inset 0 0 0 1px rgba(97,227,232,.4),-10px 14px 36px rgba(0,0,0,.42);
}
.promo:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

.promo-titulo{
  font:700 13px var(--font); letter-spacing:.01em; line-height:1.3;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
/* El texto largo solo existe cuando esta abierta; asi el alto se ajusta
   a lo que haya escrito en vez de quedar fijo. */
.promo-texto{
  grid-column:2; display:none;
  margin-top:5px; font-size:12.5px; line-height:1.5; color:#b9c7d2;
  white-space:normal;
}
.promo:hover .promo-texto,.promo:focus-visible .promo-texto,.promo.abierta .promo-texto{display:block}
.promo:hover .promo-titulo,.promo:focus-visible .promo-titulo,.promo.abierta .promo-titulo{white-space:normal;overflow:visible}

/* El punto que late: es lo que hace que se note sin tapar nada. */
.promo-punto{
  width:9px;height:9px;border-radius:50%;flex:0 0 9px;
  background:var(--cyan);box-shadow:0 0 0 0 rgba(97,227,232,.55);
  animation:promoLatido 2.4s ease-out infinite;
}
@keyframes promoLatido{
  0%{box-shadow:0 0 0 0 rgba(97,227,232,.5)}
  70%{box-shadow:0 0 0 11px rgba(97,227,232,0)}
  100%{box-shadow:0 0 0 0 rgba(97,227,232,0)}
}
.promo.color-ambar .promo-punto{background:var(--amber);box-shadow:0 0 0 0 rgba(255,195,107,.5);animation-name:promoLatidoAmbar}
.promo.color-ambar{box-shadow:inset 0 0 0 1px rgba(255,195,107,.26),-6px 10px 28px rgba(0,0,0,.34)}
@keyframes promoLatidoAmbar{0%{box-shadow:0 0 0 0 rgba(255,195,107,.5)}70%{box-shadow:0 0 0 11px rgba(255,195,107,0)}100%{box-shadow:0 0 0 0 rgba(255,195,107,0)}}
.promo.color-violeta .promo-punto{background:#b2a5ff;box-shadow:0 0 0 0 rgba(178,165,255,.5);animation-name:promoLatidoVioleta}
.promo.color-violeta{box-shadow:inset 0 0 0 1px rgba(178,165,255,.26),-6px 10px 28px rgba(0,0,0,.34)}
@keyframes promoLatidoVioleta{0%{box-shadow:0 0 0 0 rgba(178,165,255,.5)}70%{box-shadow:0 0 0 11px rgba(178,165,255,0)}100%{box-shadow:0 0 0 0 rgba(178,165,255,0)}}
.promo.color-verde .promo-punto{background:#6fdc9b;box-shadow:0 0 0 0 rgba(111,220,155,.5);animation-name:promoLatidoVerde}
.promo.color-verde{box-shadow:inset 0 0 0 1px rgba(111,220,155,.26),-6px 10px 28px rgba(0,0,0,.34)}
@keyframes promoLatidoVerde{0%{box-shadow:0 0 0 0 rgba(111,220,155,.5)}70%{box-shadow:0 0 0 11px rgba(111,220,155,0)}100%{box-shadow:0 0 0 0 rgba(111,220,155,0)}}

/* En modo edicion se ven abiertas, o no se podria editar el texto. */
body.con-editor .promo{max-width:min(340px,86vw)}
body.con-editor .promo .promo-texto{display:block}
body.con-editor .promo .promo-titulo{white-space:normal;overflow:visible}

@media(max-width:760px){
  /* Tope duro: pase lo que pase, en celular no se comen mas del 40%
     de la pantalla. Si alguien agrega seis, las de abajo se cortan en
     vez de tapar la pagina entera. */
  .promos{right:0;left:0;bottom:12px;top:auto;transform:none;
    max-width:none;align-items:stretch;padding-inline:12px;gap:8px;
    max-height:40vh;overflow:hidden;flex-direction:column-reverse}
  .promos.pos-arriba,.promos.pos-medio,.promos.pos-abajo{top:auto;bottom:12px;transform:none}
  .promo,.promo:hover,.promo.abierta{max-width:none;border-radius:12px;transform:none}
  .promo-titulo{font-size:12.5px}
  /* En movil no hay mouse: se abre al tocarla, no al pasar por encima. */
  .promo:hover .promo-texto{display:none}
  .promo.abierta .promo-texto{display:block}
}
@media(prefers-reduced-motion:reduce){
  .promo-punto{animation:none}
  .promo{transition:none}
}

/* --- Que se noten más: entrada, brillo que cruza y relieve ---------- */
/* El punto que late ya avisaba; esto es lo que hace voltear a verlas.
   Tres cosas distintas, ninguna estridente:
   1. entran deslizándose desde el borde, una tras otra;
   2. cada tanto las cruza un brillo, como un destello en vidrio;
   3. al abrirse se levantan un poco. */
.promo{position:relative;overflow:hidden;animation:promoEntra .55s cubic-bezier(.2,.9,.3,1) both}
.promo:nth-child(2){animation-delay:.12s}
.promo:nth-child(3){animation-delay:.24s}
.promo:nth-child(n+4){animation-delay:.36s}
@keyframes promoEntra{
  from{opacity:0;transform:translateX(46px)}
  to{opacity:1;transform:translateX(0)}
}

/* El destello. Va en una capa aparte para no tocar el texto, y no
   recibe clics. */
.promo::after{
  content:'';position:absolute;top:0;bottom:0;left:-60%;width:45%;
  pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.14) 45%,rgba(255,255,255,.22) 50%,rgba(255,255,255,.14) 55%,transparent);
  transform:skewX(-18deg);
  animation:promoBrillo 5.5s ease-in-out infinite;
}
.promo:nth-child(2)::after{animation-delay:1.6s}
.promo:nth-child(3)::after{animation-delay:3.2s}
@keyframes promoBrillo{
  0%,62%{left:-60%}
  86%,100%{left:125%}
}
/* Abierta no destella: ahí la persona ya está leyendo. */
.promo:hover::after,.promo:focus-visible::after,.promo.abierta::after{animation:none;left:-60%}

/* Un borde que respira del lado del contenido, para que se despegue
   del fondo sin ponerle un marco duro. */
.promo::before{
  content:'';position:absolute;left:0;top:14%;bottom:14%;width:3px;
  border-radius:3px;background:var(--cyan);opacity:.85;
  box-shadow:0 0 12px rgba(97,227,232,.75);
  animation:promoBorde 2.4s ease-in-out infinite alternate;
}
.promo.color-ambar::before{background:var(--amber);box-shadow:0 0 12px rgba(255,195,107,.75)}
.promo.color-violeta::before{background:#b2a5ff;box-shadow:0 0 12px rgba(178,165,255,.75)}
.promo.color-verde::before{background:#6fdc9b;box-shadow:0 0 12px rgba(111,220,155,.75)}
@keyframes promoBorde{from{opacity:.45;top:30%;bottom:30%}to{opacity:1;top:12%;bottom:12%}}

.promo:hover,.promo:focus-visible,.promo.abierta{transform:translateX(-6px) translateY(-2px)}

@media(prefers-reduced-motion:reduce){
  .promo,.promo::after,.promo::before{animation:none}
  .promo::after{display:none}
}

/* ============================================================
   REDES FLOTANTES  (abajo a la izquierda)
   Se turnan si hay varias; cada una puede traer su mensajito.
   Va a la IZQUIERDA a proposito: la derecha ya la ocupan los
   avisos flotantes, y encimarlos deja las dos inservibles.
   ============================================================ */
.redes-flotantes{
  position:fixed; left:18px; bottom:18px; z-index:60;
  display:flex; align-items:center; gap:10px;
  pointer-events:none;
}
.redes-flotantes > *{ pointer-events:auto; }

.red-burbuja{
  display:grid; place-items:center;
  width:54px; height:54px; border-radius:50%;
  background:var(--red-color,#61e3e8);
  box-shadow:0 10px 26px rgba(0,0,0,.45), 0 0 0 0 var(--red-color,#61e3e8);
  animation:redEntra .45s cubic-bezier(.2,.9,.3,1.3) both, redLatido 2.8s ease-in-out 1s infinite;
  transition:transform .2s ease;
}
.red-burbuja svg{ width:28px; height:28px; fill:#07121a; }
.red-burbuja:hover{ transform:scale(1.08); }

/* El mensaje entra un poco despues, para que se note que acompana
   al icono y no que son dos cosas sueltas. */
.red-mensaje{
  max-width:min(260px, 52vw);
  padding:10px 14px; border-radius:14px 14px 14px 4px;
  background:rgba(10,18,28,.92);
  border:1px solid rgba(97,227,232,.35);
  color:#e8f6f8; font-size:.86rem; line-height:1.35;
  box-shadow:0 10px 26px rgba(0,0,0,.4);
  backdrop-filter:blur(8px);
  animation:redEntra .45s cubic-bezier(.2,.9,.3,1.3) .12s both;
  order:2;
}

@keyframes redEntra{
  from{ opacity:0; transform:translateY(10px) scale(.86); }
  to{ opacity:1; transform:none; }
}
/* Un halo que se expande y se apaga: llama la atencion sin moverse
   de lugar ni tapar nada. */
@keyframes redLatido{
  0%,100%{ box-shadow:0 10px 26px rgba(0,0,0,.45), 0 0 0 0 var(--red-color,#61e3e8); }
  50%{ box-shadow:0 10px 26px rgba(0,0,0,.45), 0 0 0 12px transparent; }
}

@media (max-width:640px){
  .redes-flotantes{ left:12px; bottom:12px; gap:8px; }
  .red-burbuja{ width:48px; height:48px; }
  .red-burbuja svg{ width:24px; height:24px; }
  .red-mensaje{ font-size:.8rem; max-width:48vw; }
}

/* A quien pidio menos movimiento, se le quita el latido. */
@media (prefers-reduced-motion: reduce){
  .red-burbuja,.red-mensaje{ animation:none; }
}

/* El diagnostico desplegable dentro de "Como trabajamos". */
.diagnostico-plegable[hidden]{ display:none; }
.diagnostico-plegable{ animation:redEntra .4s ease both; }