/* Generado por migracion/build_css.py desde los prototipos interiores. No editar a mano. */

/* ===== servicio-auditoria ===== */
:root{
  color-scheme:dark;
  --ink:#070D24;--ink-2:#0C1638;--ink-3:#132A7A;
  --paper:#EEF3FF;--fg:#EEF3FF;--fg-2:#B4C4EA;--fg-3:#8496C8;
  --cobalt:#2F5BD3;--cyan:#56D7FF;--cta:#FF5A36;--cta-2:#E0431F;
  --line:rgba(170,195,255,.16);--line-2:rgba(170,195,255,.32);
  --serif:'Shippori Mincho','Hiragino Mincho ProN','Yu Mincho',Georgia,serif;
  --sans:'Archivo','Helvetica Neue',Arial,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box}
html,body{background:var(--ink);color:var(--fg);overflow-x:clip}
body{font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.wrap{width:min(1180px,100%);margin-inline:auto;padding-inline:16px}
h2{margin:0;font-family:var(--serif);font-weight:800;font-size:clamp(32px,6.4vw,54px);line-height:1.05;text-wrap:balance}
.lede{margin:12px 0 0;color:var(--fg-2);max-width:56ch}
.kicker{font-family:var(--serif);font-weight:700;color:var(--cyan);font-size:15px;margin:0 0 10px;display:flex;align-items:center;gap:10px}
.kicker::before{content:"";width:22px;height:2px;background:var(--cyan)}
.cta{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;background:var(--cta);color:#fff;font-weight:700;text-decoration:none;border:0;cursor:pointer;transition:background .2s}
.cta:hover{background:var(--cta-2)}
.ghost{display:inline-flex;align-items:center;min-height:52px;padding:0 20px;border:1px solid var(--line-2);text-decoration:none;font-weight:600}
.ghost:hover{border-color:var(--fg)}
section{padding-block:clamp(72px,10vw,120px)}
.logo{position:absolute;top:calc(env(safe-area-inset-top,0px) + 16px);left:16px;z-index:5;display:inline-flex;padding:10px 14px;border:1px solid var(--line-2);background:rgba(7,13,36,.6);backdrop-filter:blur(6px);text-decoration:none}
.logo b{font-family:var(--serif);font-weight:800;font-size:22px;line-height:1}
.logo i{font-style:normal;color:var(--cyan)}
.hero{position:relative;overflow:hidden;isolation:isolate;padding:104px 0 70px;background:radial-gradient(ellipse 70% 60% at 70% 45%,#132A7A 0%,#070D24 70%)}
#rain{position:absolute;inset:0;width:100%;height:100%;z-index:-2;opacity:.55;image-rendering:pixelated}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(7,13,36,.95) 0%,rgba(7,13,36,.75) 45%,rgba(7,13,36,.2) 100%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;align-items:center}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--fg-3);margin:0 0 18px;padding:0;list-style:none}
.crumbs li+li::before{content:"/";margin-right:8px;color:var(--line-2)}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--fg)}
.hero h1{margin:0;font-family:var(--serif);font-weight:800;font-size:clamp(38px,8vw,72px);line-height:1.02;letter-spacing:-.01em;text-wrap:balance}
.hero h1 span{color:var(--cyan)}
.hero .intro{margin:20px 0 0;color:var(--fg-2);max-width:52ch;font-size:17px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.facts{display:flex;flex-wrap:wrap;gap:8px 22px;margin:26px 0 0;padding:0;list-style:none;font-size:14px;color:var(--fg-2)}
.facts li{display:flex;align-items:center;gap:8px}
.facts li::before{content:"";width:8px;height:8px;background:var(--cyan);transform:rotate(45deg)}
.arcana{justify-self:center;perspective:1200px;width:min(62vw,260px)}
.arcana .card{position:relative;aspect-ratio:7/12;transform-style:preserve-3d;animation:flip 1.4s var(--ease) .5s both}
@keyframes flip{from{transform:rotateY(180deg) translateY(20px)}to{transform:none}}
.arcana .face,.arcana .back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:12px;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 50px rgba(86,215,255,.18)}
.arcana .back{transform:rotateY(180deg);background:#081544}
.arcana svg{width:100%;height:100%;display:block}
.lamp{transform-box:fill-box;transform-origin:50% 0;animation:lamp 3.2s ease-in-out infinite}
@keyframes lamp{50%{transform:rotate(6deg)}}
.lamp-glow{animation:glow 1.6s ease-in-out infinite alternate}
@keyframes glow{to{opacity:.45}}
.arcana figcaption{text-align:center;margin-top:14px;font-size:13px;color:var(--fg-3)}
.h2w{display:inline-block;white-space:nowrap}
.h2c{display:inline-block}
html.fx h2.anim .h2c{opacity:0;transform:translate3d(0,.7em,0) rotate(-10deg) scale(1.35)}
html.fx h2.anim.in .h2c{animation:h2c .75s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(var(--i)*30ms)}
@keyframes h2c{0%{opacity:0;transform:translate3d(0,.7em,0) rotate(-10deg) scale(1.35);color:var(--cyan)}60%{opacity:1;color:var(--cyan)}100%{opacity:1;transform:none;color:inherit}}
h2.anim::after{content:"";display:block;height:5px;width:0;margin-top:16px;background:var(--cyan);border-radius:3px;transition:width 1s .5s var(--ease)}
h2.anim.in::after{width:110px}
.center{text-align:center}
.center h2.anim::after{margin-inline:auto}
.center .lede{margin-inline:auto}
.lantern{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:36px}
.sit{position:relative;padding:26px 22px 24px;border:1px solid var(--line);background:#060B1E;overflow:hidden;--mx:50%;--my:-40%}
.sit::before{content:"";position:absolute;inset:0;background:radial-gradient(260px circle at var(--mx) var(--my),rgba(86,215,255,.22),transparent 60%);transition:opacity .4s;pointer-events:none}
.sit > *{position:relative;opacity:.35;transition:opacity .5s}
.sit.lit > *{opacity:1}
.sit.lit{border-color:var(--line-2)}
.sit .k{font-family:var(--serif);font-weight:800;font-size:34px;line-height:1;color:var(--cyan)}
.sit h3{margin:12px 0 8px;font-family:var(--serif);font-weight:800;font-size:22px;line-height:1.15}
.sit p{margin:0;color:var(--fg-2)}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0;padding:0;list-style:none}
.tags li{font-size:12.5px;padding:4px 10px;border:1px solid var(--line-2);color:var(--fg-2)}
.hint{margin-top:16px;font-size:13px;color:var(--fg-3)}
.deliver{background:var(--paper);color:#0B1640}
.deliver .lede{color:#3A4670}
.deliver h2.anim::after{background:var(--cobalt)}
.deliver .kicker{color:var(--cobalt)}
.deliver .kicker::before{background:var(--cobalt)}
.dgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:34px;margin-top:34px;align-items:start}
.gets{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.gets li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start}
.gets b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cobalt);color:#fff;font-family:var(--serif);font-size:15px}
.gets span{padding-top:5px}
.note{background:#fff;border:1px solid #D3DCF2;box-shadow:0 24px 50px rgba(11,22,64,.14);min-width:0}
.note-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;padding:12px 18px;border-bottom:1px solid #E1E8F7;font-size:12.5px;color:#55628C}
.note-body{padding:18px;display:grid;gap:12px}
.note h3{margin:0;font-family:var(--serif);font-size:20px;line-height:1.2}
.note dl{margin:0;display:grid;grid-template-columns:110px minmax(0,1fr);gap:8px 14px;font-size:14.5px}
.note dt{color:#55628C}
.note dd{margin:0}
.decision{padding:14px 16px;background:#EAF1FF;border-left:4px solid var(--cobalt);transition:background .6s,box-shadow .6s}
.decision b{display:block;font-size:12.5px;color:var(--cobalt);margin-bottom:4px}
.decision.on{background:#DFF6FF;box-shadow:0 0 0 3px rgba(86,215,255,.45)}
.ticket{display:grid;gap:4px;padding:12px 14px;border:1px dashed #B9C4E4;font-size:14px}
.ticket b{font-size:12.5px;color:#55628C}
.scope{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;margin-top:34px;background:var(--line);border:1px solid var(--line)}
.sc{background:var(--ink);padding:24px 20px;display:grid;gap:8px;align-content:start}
.sc .ico{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(86,215,255,.12);box-shadow:inset 0 0 0 1px rgba(86,215,255,.4)}
.sc .ico svg{width:22px;height:22px;color:var(--cyan)}
.sc h3{margin:6px 0 0;font-family:var(--serif);font-size:20px}
.sc p{margin:0;color:var(--fg-2)}
.sc.out .ico{background:rgba(255,90,54,.12);box-shadow:inset 0 0 0 1px rgba(255,90,54,.5)}
.sc.out .ico svg{color:var(--cta)}
.torii-list{list-style:none;margin:40px 0 0;padding:0 0 0 40px;display:grid;gap:44px;position:relative}
.rope{position:absolute;left:12px;top:10px;bottom:10px;width:3px;background:repeating-linear-gradient(180deg,var(--fg-3) 0 3px,transparent 3px 9px);opacity:.5}
.rope i{position:absolute;left:-1px;top:0;width:5px;height:0;background:var(--cyan);box-shadow:0 0 12px var(--cyan);border-radius:3px}
.torii{position:relative;padding:40px 20px 20px 24px;border-inline:6px solid var(--cyan);background:linear-gradient(180deg,rgba(86,215,255,.08),transparent 70%)}
.torii::before{content:"";position:absolute;left:-20px;right:-20px;top:-9px;height:11px;background:var(--cyan);border-radius:6px 6px 2px 2px}
.torii::after{content:"";position:absolute;left:-6px;right:-6px;top:14px;height:6px;background:var(--cyan)}
.torii .tn{font-family:var(--serif);font-weight:800;font-size:26px;color:var(--cyan);line-height:1;margin:0 0 6px}
.torii h3{margin:0 0 6px;font-family:var(--serif);font-size:22px}
.torii p{margin:0;color:var(--fg-2)}
.torii .out{margin-top:10px;font-size:14px}
.torii .out b{color:var(--cyan)}
html.fx .torii{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
html.fx .torii.in{opacity:1;transform:none}
.roles{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin-top:34px}
.role{position:relative;border:1px solid var(--line);background:var(--ink-2);padding:22px 20px 22px 110px;min-height:130px;display:grid;align-content:center;gap:6px}
.role img{position:absolute;left:10px;bottom:10px;height:96px;width:auto;image-rendering:auto}
.role h3{margin:0;font-family:var(--serif);font-size:21px}
.role p{margin:0;color:var(--fg-2)}
.role .who{font-size:12.5px;color:var(--cyan);font-weight:700}
.quotes{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:30px}
.quotes figure{margin:0;padding:24px 22px;border:1px solid var(--line);background:var(--ink-2);position:relative}
.quotes figure::before{content:"“";position:absolute;top:-6px;left:16px;font-family:var(--serif);font-size:64px;line-height:1;color:var(--cyan)}
.quotes blockquote{margin:16px 0 14px;font-family:var(--serif);font-size:19px;line-height:1.4;color:var(--fg)}
.quotes figcaption{font-size:14px;color:var(--cyan);font-weight:700}
@media (min-width:900px){.quotes{grid-template-columns:repeat(3,minmax(0,1fr))}}
.hacc-wrap{margin-top:34px;overflow-x:auto}
.hacc{display:flex;gap:8px;height:420px;min-width:100%}
.hitem{flex:0 0 48px;display:flex;flex-direction:column;border:1px solid var(--line);background:var(--ink-2);overflow:hidden;transition:flex-basis .55s var(--ease)}
.hitem.on{flex:0 0 min(78vw,560px);background:linear-gradient(180deg,rgba(86,215,255,.1),var(--ink-2) 60%)}
.htab{flex:1;display:flex;flex-direction:column;align-items:center;gap:12px;padding:14px 0;border:0;background:none;cursor:pointer}
.htab .hn{font-family:var(--serif);font-weight:800;color:var(--cyan)}
.htab .hq{writing-mode:vertical-rl;transform:rotate(180deg);font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-height:350px;color:var(--fg-2)}
.hitem.on .htab{flex:0 0 auto;flex-direction:row;align-items:baseline;padding:22px 22px 0;cursor:default}
.hitem.on .htab .hq{writing-mode:horizontal-tb;transform:none;white-space:normal;font-family:var(--serif);font-weight:800;font-size:clamp(21px,2.6vw,27px);line-height:1.15;color:var(--fg);max-height:none;text-align:left}
.hpanel{padding:12px 22px 22px 52px;color:var(--fg-2)}
.hitem:not(.on) .hpanel{display:none}
.others{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:30px}
.others a{background:var(--ink);padding:20px 16px;text-decoration:none;display:grid;gap:4px;transition:background .25s}
.others a:hover{background:var(--ink-2)}
.others b{font-family:var(--serif);font-size:18px}
.others span{font-size:13px;color:var(--fg-3)}
.close{background:linear-gradient(160deg,#0B2A86,#1240B8 55%,#0A1F66);text-align:left}
.close-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:30px;align-items:center}
.close h2{color:#fff}
.close .lede{color:#D6E2FF}
.close h2.anim::after{background:#fff}
.close-art{justify-self:center;width:min(70vw,300px);border-radius:10px;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.4)}
.close-art img{width:100%;display:block}
.foot{background:var(--ink-2);border-top:3px solid var(--cyan);padding:44px 16px calc(120px + env(safe-area-inset-bottom,0px));color:var(--fg-3);font-size:14px}
.foot .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between}
.foot b{font-family:var(--serif);color:var(--fg);font-size:22px}
.foot b i{font-style:normal;color:var(--cyan)}
.px{position:fixed;right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:31;border:0;padding:0;background:none;cursor:pointer}
.px img{height:96px;width:auto;display:block;filter:drop-shadow(0 6px 8px rgba(0,0,0,.45))}
.px span{position:absolute;right:calc(100% - 10px);top:-2px;background:var(--paper);color:var(--ink);font-family:var(--serif);font-weight:800;font-size:15px;padding:6px 12px;border-radius:16px;white-space:nowrap}
.menu{position:fixed;inset:0;z-index:50;background:var(--ink);display:none;flex-direction:column;padding:84px 24px 40px;overflow:auto}
.menu.open{display:flex}
.menu nav{display:grid;gap:4px;max-width:640px}
.menu a{font-family:var(--serif);font-weight:800;font-size:clamp(28px,7vw,44px);line-height:1.2;text-decoration:none;padding:6px 0;display:flex;align-items:baseline;gap:14px}
.menu a span{font-size:15px;color:var(--cyan);font-weight:700;min-width:22px}
.menu-foot{margin-top:26px;color:var(--fg-3);font-size:14px}
.menu.open nav a{animation:menu-a .5s var(--ease) both}
.menu.open nav a:nth-child(2){animation-delay:.04s}
.menu.open nav a:nth-child(3){animation-delay:.08s}
.menu.open nav a:nth-child(4){animation-delay:.12s}
.menu.open nav a:nth-child(5){animation-delay:.16s}
.menu.open nav a:nth-child(6){animation-delay:.2s}
.menu.open nav a:nth-child(7){animation-delay:.24s}
.menu.open nav a:nth-child(8){animation-delay:.28s}
@keyframes menu-a{from{opacity:0;transform:translateY(12px)}}
.menu a:hover{color:var(--cyan)}
.menu .x{position:fixed;z-index:3;top:calc(env(safe-area-inset-top,0px) + 16px);right:16px;width:48px;height:48px;border:0;background:var(--ink);border-radius:50%;cursor:pointer;display:grid;place-items:center;color:var(--fg)}
.menu .x svg{width:24px;height:24px}
.scene{margin:0;justify-self:center;width:min(100%,520px)}
.scene canvas{display:block;width:100%;height:auto;aspect-ratio:160/112;image-rendering:pixelated;border:2px solid rgba(86,215,255,.35);box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 50px rgba(86,215,255,.12);background:#000}
.scene figcaption{text-align:center;margin-top:12px;font-size:13px;color:var(--fg-3)}
@media (min-width:900px){.scene{width:100%}}
@media (min-width:900px){
  .hero{padding:130px 0 100px}
  .hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px}
  .arcana{width:280px}
  .lantern{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dgrid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px}
  .scope{grid-template-columns:repeat(4,minmax(0,1fr))}
  .torii-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px;padding-left:0}
  .torii-list .rope{display:none}
  .roles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hitem{flex-basis:62px}
  .others{grid-template-columns:repeat(4,minmax(0,1fr))}
  .close-grid{grid-template-columns:minmax(0,1fr);max-width:760px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .sit > *{opacity:1}
}
.pxi img,.tgate img,.slamp img,.oico,.gets b{image-rendering:pixelated}
body.qs-servicio section{padding-block:clamp(60px,8vw,96px)}
.sit > *{opacity:1}
.sit p{color:var(--fg-2)}
.sit:not(.lit) h3{color:#C9D5F2}
.slamp{position:absolute!important;right:18px;top:18px;width:21px;height:39px}
.slamp img{position:absolute;inset:0;width:21px;height:39px}
.slamp .on{visibility:hidden}
.sit.lit .slamp .on{visibility:visible}
.sit.lit .slamp::after{content:"";position:absolute;left:50%;top:45%;width:60px;height:60px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,200,90,.3),transparent 65%)}
.gets li{grid-template-columns:40px minmax(0,1fr)}
.gets b{width:40px;height:40px;border-radius:0;background:url(../img/px8/med-on.png) center/40px 40px no-repeat;font:400 14px/1 'DotGothic16',monospace;color:#fff}
.gets span{padding-top:9px}
.sc .ico.pxi,.sc.out .ico.pxi{width:64px;height:64px;border-radius:0;background:none;box-shadow:none}
.sc .ico.pxi img{width:64px;height:64px;display:block}
.torii{border:0;padding:118px 20px 22px 22px;background:linear-gradient(180deg,rgba(86,215,255,.07),transparent 70%)}
.torii::before,.torii::after{content:none}
.torii .tn{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.tgate{position:absolute;left:16px;top:6px;width:96px;height:100px}
.tgate img{width:96px;height:100px;display:block}
.tgate b{position:absolute;left:42px;top:16px;width:12px;height:14px;display:grid;place-items:center;font:400 11px/1 'DotGothic16',monospace;color:#FFD76A}
html.fx .torii .tgate{clip-path:inset(100% 0 0 0);transition:clip-path .7s steps(8,end) .1s}
html.fx .torii.in .tgate{clip-path:inset(0 0 0 0)}
.rope{width:4px;background:repeating-linear-gradient(180deg,#F2B53A 0 4px,transparent 4px 10px);opacity:.7}
.quotes figure{border:21px solid transparent;border-image:url(../img/px8/marco-azul.png) 21 fill / 21px / 0 repeat;background:none;padding:10px 6px}
.quotes figure::before{top:-14px;left:4px}
.others a{grid-template-columns:40px minmax(0,1fr);column-gap:12px;align-items:center}
.others .oico{grid-row:span 2;width:40px;height:40px}
@media (min-width:900px){.hero-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}.scene{width:100%}}
.role{padding-left:138px}
.role .rs{position:absolute;left:12px;bottom:12px;height:92px;display:block}
.role .rs > img{position:relative;left:auto;bottom:auto;height:100%;width:auto;display:block;z-index:1;image-rendering:pixelated;filter:drop-shadow(0 6px 8px rgba(0,0,0,.45))}
.role .rs .type{position:absolute;inset:0;height:100%;left:0;bottom:auto}
.st-fire{width:calc(92px * 284 / 234)}
.st-pc{width:calc(92px * 230 / 228)}
.st-med{width:calc(92px * 205 / 201)}
.pxs > img{height:100%;width:auto;display:block;position:relative;z-index:1;filter:drop-shadow(0 6px 8px rgba(0,0,0,.45))}
.st-fire .flame{position:absolute;z-index:2;left:68.5%;width:27.5%;top:36%;height:43%;overflow:visible}
.flame g{transform-box:fill-box;transform-origin:50% 100%}
.flame .f1{animation:fl1 .42s steps(3) infinite alternate}
.flame .f2{animation:fl2 .36s steps(3) infinite alternate}
.flame .f3{animation:fl3 .3s steps(2) infinite alternate}
.flame .f4{animation:fl3 .24s steps(2) infinite alternate-reverse}
@keyframes fl1{0%{transform:scaleY(.92) skewX(-4deg)}50%{transform:scaleY(1.06) skewX(3deg)}100%{transform:scaleY(.98) skewX(-2deg);filter:hue-rotate(-8deg)}}
@keyframes fl2{0%{transform:scaleY(1.05) skewX(4deg)}100%{transform:scaleY(.9) skewX(-3deg);filter:hue-rotate(6deg)}}
@keyframes fl3{0%{transform:scaleY(.85) scaleX(1.05)}100%{transform:scaleY(1.1) scaleX(.94)}}
.st-fire .glow{position:absolute;z-index:0;left:55%;top:40%;width:56%;height:62%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,150,40,.55),rgba(255,90,20,.18) 55%,transparent);animation:glowp 1.1s ease-in-out infinite alternate}
@keyframes glowp{to{transform:scale(1.12);opacity:.75}}
.sparks{position:absolute;z-index:3;left:82%;top:60%;width:0;height:0}
.sparks i{position:absolute;left:0;top:0;width:3px;height:3px;background:var(--c);box-shadow:0 0 4px var(--c);opacity:0;animation:spark var(--t) linear infinite;animation-delay:var(--d)}
@keyframes spark{0%{opacity:0;transform:translate(0,0)}10%{opacity:1}100%{opacity:0;transform:translate(calc(var(--x) * .9),-70px)}}
.steam{position:absolute;z-index:3;left:57%;top:40%;width:0;height:0}
.steam i{position:absolute;left:var(--x);top:0;width:4px;height:4px;background:rgba(170,195,255,.75);box-shadow:4px -6px 0 rgba(170,195,255,.5),-3px -12px 0 rgba(170,195,255,.35);opacity:0;animation:steam 2.7s ease-in-out infinite;animation-delay:var(--d)}
@keyframes steam{0%{opacity:0;transform:translate(0,0)}20%{opacity:.9}50%{transform:translate(4px,-14px)}100%{opacity:0;transform:translate(-3px,-30px)}}
.st-pc .type{position:absolute;inset:0;height:100%;z-index:2;filter:none}
.st-pc .t1{clip-path:inset(45% 53% 42% 38%);animation:tap .32s steps(1) infinite}
.st-pc .t2{clip-path:inset(45% 44% 42% 47%);animation:tap .32s steps(1) infinite .16s}
@keyframes tap{0%{transform:translateY(-2px)}50%{transform:translateY(0)}}
.keys{position:absolute;z-index:3;left:42%;top:55%;width:16%;height:3%}
.keys i{position:absolute;top:0;width:3px;height:2px;background:#9FD3FF;box-shadow:0 0 3px #9FD3FF;opacity:0;animation:key .96s steps(1) infinite}
.keys i:nth-child(1){left:10%}
.keys i:nth-child(2){left:50%;animation-delay:.32s}
.keys i:nth-child(3){left:80%;animation-delay:.64s}
@keyframes key{0%{opacity:1}30%{opacity:0}}
.aura{position:absolute;z-index:0;inset:-14% -18% -6% -18%;border-radius:50%;background:radial-gradient(closest-side,rgba(143,180,255,.55),rgba(90,120,255,.22) 55%,transparent 75%);animation:aura-p 2.4s ease-in-out infinite alternate}
@keyframes aura-p{0%{transform:scale(.92);opacity:.7}100%{transform:scale(1.08);opacity:1}}
.aura .ring{position:absolute;inset:14%;border-radius:50%;border:2px dashed rgba(190,215,255,.6);animation:ring 9s linear infinite}
.aura .r2{inset:24%;border-color:rgba(255,215,122,.45);animation-duration:6s;animation-direction:reverse}
@keyframes ring{to{transform:rotate(360deg)}}
.motes{position:absolute;inset:0;z-index:2;pointer-events:none}
.motes i{position:absolute;left:var(--x);bottom:10%;width:3px;height:3px;background:#CFE2FF;box-shadow:0 0 5px #8DB6E2;opacity:0;animation:mote var(--t) ease-in infinite;animation-delay:var(--d)}
@media (prefers-reduced-motion:reduce){.flame g,.st-fire .glow,.sparks i,.steam i,.st-pc .type,.keys i,.motes i{animation:none!important}.sparks,.steam,.motes,.keys{display:none}}
.sheet-ex .note-body{gap:8px}
.sheet-ex h3{margin:0 0 4px;font-family:var(--serif);font-size:19px;color:#0B1640}
.tmonth{margin:8px 0 0;font-size:12px;font-weight:700;letter-spacing:.06em;color:#55628C;text-transform:none;border-bottom:1px solid #E1E8F7;padding-bottom:4px}
.trows{list-style:none;margin:0;padding:0;display:grid}
.trow{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:start;padding:10px 6px;border-bottom:1px dashed #E1E8F7;transition:background .6s,box-shadow .6s}
.tdate{font-size:12.5px;color:#55628C;font-variant-numeric:tabular-nums;padding-top:2px}
.tmain{display:grid;gap:3px;min-width:0}
.tmain b{font-size:14px;line-height:1.35;color:#0B1640}
.tmain small{font-size:12.5px;line-height:1.4;color:#55628C}
.ttype{font-style:normal;font-size:11px;font-weight:700;color:#2F5BD3;justify-self:start;padding:1px 8px;border:1px solid #C9D6F5;border-radius:999px}
.tst{font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:999px;white-space:nowrap}
.tst.ok{background:#DDF5E5;color:#1D6B3A}
.tst.wip{background:#FFF0CC;color:#8A5A00}
.tst.todo{background:#EEF1F8;color:#55628C}
.trow#decision.on{background:#EAF1FF;box-shadow:inset 4px 0 0 var(--cobalt)}

/* ===== blog-categoria ===== */
.pxi,.pxi img,.chip img,.ptag img{image-rendering:pixelated}
.mframe{border:21px solid transparent;border-image:url(../img/px8/marco-azul.png) 21 fill / 21px / 0 repeat;image-rendering:pixelated}
.mframe.gold{border-image-source:url(../img/px8/marco-oro.png)}
.hero.short{padding:100px 0 56px}
.hero.short h1{font-size:clamp(36px,7vw,64px)}
.bhero{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:end}
.writer{position:relative;margin:0;justify-self:center;width:min(100%,460px)}
.writer img{display:block;width:100%;height:auto;image-rendering:pixelated;position:relative;z-index:1;filter:drop-shadow(0 18px 24px rgba(0,0,0,.5))}
.writer .lamp-glow{position:absolute;left:78%;top:2%;width:34%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,196,90,.45),rgba(255,160,60,.12) 45%,transparent 70%);animation:lampf 2.4s steps(4) infinite alternate}
@keyframes lampf{0%{opacity:.75;transform:scale(.94)}100%{opacity:1;transform:scale(1.06)}}
@media (prefers-reduced-motion:reduce){.writer .lamp-glow{animation:none}}
@media (min-width:1000px){.bhero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px}.writer{width:100%}}
.tools{display:grid;gap:18px;margin-top:28px}
.bsearch{position:relative;max-width:560px}
.bsearch input{width:100%;min-height:54px;padding:0 18px 0 48px;background:rgba(7,13,36,.75);border:1px solid var(--line-2);color:var(--fg);font:inherit;font-size:16px}
.bsearch input:focus{outline:2px solid var(--cyan);outline-offset:0;border-color:transparent}
.bsearch svg{position:absolute;left:16px;top:50%;width:20px;height:20px;transform:translateY(-50%);color:var(--fg-3)}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.chip{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 14px;border:1px solid var(--line-2);background:rgba(7,13,36,.7);cursor:pointer;font-weight:600;font-size:14px}
.chip img{width:28px;height:28px}
.chip em{font-style:normal;font:400 13px/1 'DotGothic16',monospace;color:var(--cyan)}
.chip.on{background:var(--cobalt);border-color:var(--cobalt);color:#fff}
.chip.on em{color:#fff}
.chip:hover{border-color:var(--fg)}
.featured{margin-top:8px}
.feat{display:grid;grid-template-columns:minmax(0,1fr);text-decoration:none}
.feat-art{position:relative;min-height:220px;background:radial-gradient(circle at 50% 60%,#1B3A9E,#0A1440 70%);display:grid;place-items:center;overflow:hidden}
.feat-art img.sp{height:150px;width:auto;image-rendering:pixelated;position:relative;z-index:1}
.feat-art .glow{position:absolute;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(86,215,255,.35),transparent 65%)}
.feat-art .badge{position:absolute;left:14px;top:14px;font:400 13px/1 'DotGothic16',monospace;background:var(--cyan);color:var(--ink);padding:6px 10px}
.feat-body{padding:22px 4px 6px;display:grid;gap:10px;align-content:center}
.feat-body h2{font-size:clamp(26px,4.4vw,40px)}
.feat-body p{margin:0;color:var(--fg-2)}
.ptag{display:inline-flex;align-items:center;gap:6px;justify-self:start;font-size:12.5px;font-weight:700;color:var(--cyan)}
.more{font-weight:700;color:var(--fg);display:inline-flex;align-items:center;gap:8px}
.more::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-top:2px solid currentColor;transform:rotate(45deg);transition:transform .2s}
a:hover .more::after{transform:translate(3px,0) rotate(45deg)}
.grid{list-style:none;margin:34px 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.post a{height:100%;display:grid;grid-template-rows:auto auto auto 1fr auto;gap:10px;padding:0 0 20px;border:1px solid var(--line);background:var(--ink-2);text-decoration:none;transition:border-color .2s,transform .2s var(--ease)}
.post a > :not(.pthumb){margin-inline:20px}
.post a:hover{border-color:var(--line-2);transform:translateY(-3px)}
.post h3{margin:0;font-family:var(--serif);font-size:20px;line-height:1.2;text-wrap:balance}
.post p{margin:0;color:var(--fg-2);font-size:15px}
.pthumb{height:110px;display:grid;place-items:center;background:var(--th);border-bottom:1px solid var(--line)}
.pthumb img{width:64px;height:64px;image-rendering:pixelated;transition:transform .2s steps(2)}
.post a:hover .pthumb img{transform:translateY(-6px)}
.t-tec{--th:linear-gradient(135deg,#0E2370,#183A9E)}
.t-local{--th:linear-gradient(135deg,#3A1424,#7A2230)}
.t-ecom{--th:linear-gradient(135deg,#0B3240,#13606E)}
.t-ia{--th:linear-gradient(135deg,#21124A,#3E2A8A)}
.t-sect{--th:linear-gradient(135deg,#3B2A08,#7A5810)}
.post[hidden]{display:none}
.empty{margin-top:30px;color:var(--fg-2)}
.pager{display:flex;justify-content:center;gap:8px;margin-top:40px}
.pager a,.pager span{min-width:46px;min-height:46px;display:grid;place-items:center;border:1px solid var(--line-2);text-decoration:none;font:400 16px/1 'DotGothic16',monospace}
.pager .cur{background:var(--cobalt);border-color:var(--cobalt)}
.subscribe{display:grid;gap:16px}
.subscribe h2{font-size:clamp(28px,5vw,44px)}
.subscribe form{display:flex;flex-wrap:wrap;gap:10px}
.subscribe input{flex:1 1 240px;min-width:0;min-height:52px;padding:0 16px;background:var(--ink);border:1px solid var(--line-2);color:var(--fg);font:inherit}
.subscribe .ok{margin:0;color:var(--cyan);font-weight:700}
@media (min-width:700px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.feat{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px}.feat-art{min-height:340px}.feat-art img.sp{height:210px}}

/* ===== blog-post ===== */
.post-hero{padding-bottom:40px}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:24px;font-size:14px;color:var(--fg-2)}
.meta .who{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--fg)}
.meta .who img{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:50% 0;background:#1A3A9A;image-rendering:pixelated}
.meta i{font-style:normal;color:var(--fg-3)}
.readbar{position:sticky;top:0;z-index:20;background:rgba(7,13,36,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.readbar .wrap{display:flex;align-items:center;gap:12px;min-height:56px}
.tocbtn{display:flex;align-items:center;gap:10px;min-height:44px;flex:1;min-width:0;padding:0 12px;border:1px solid var(--line-2);background:none;cursor:pointer;text-align:left}
.tocbtn b{font:400 13px/1 'DotGothic16',monospace;color:var(--cyan);flex:none}
.tocbtn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;font-weight:600}
.pct{font:400 14px/1 'DotGothic16',monospace;color:var(--cyan);min-width:42px;text-align:right}
.path{position:absolute;left:0;right:0;bottom:-1px;height:3px;background:repeating-linear-gradient(90deg,var(--line-2) 0 4px,transparent 4px 8px)}
.path i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--cyan)}
.walker{position:absolute;bottom:2px;width:32px;height:32px;background:url(../img/px/sprite_caminar_16_frames_128x128.png) 0 0/256px 64px no-repeat;image-rendering:pixelated;transform:translateX(-16px);pointer-events:none}
.tocsheet{position:fixed;inset:0;z-index:45;display:none}
.tocsheet.open{display:block}
.tocsheet .scrim{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.tocsheet .panel{position:absolute;left:0;right:0;bottom:0;max-height:80svh;overflow:auto;background:var(--ink-2);border-top:3px solid var(--cyan);border-radius:18px 18px 0 0;padding:16px 18px calc(24px + env(safe-area-inset-bottom,0px))}
.tocsheet .x{position:sticky;top:0;margin:-4px -6px -40px auto;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--ink-2);box-shadow:0 0 0 1px var(--line-2);cursor:pointer;color:var(--fg)}
.tocsheet h2{font-size:24px;margin-bottom:12px}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.toc a{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:center;gap:10px;padding:8px 6px;text-decoration:none;color:var(--fg-2);font-size:15px;line-height:1.3;border-left:3px solid transparent}
.toc a b{width:32px;height:32px;display:grid;place-items:center;background:url(../img/px8/med-off.png) center/32px 32px no-repeat;image-rendering:pixelated;font:400 12px/1 'DotGothic16',monospace;color:#B9C8F2}
.toc a.on{color:var(--fg);border-left-color:var(--cyan);background:rgba(86,215,255,.07)}
.toc a.on b{background-image:url(../img/px8/med-on.png);color:#fff}
.toc a.done b{background-image:url(../img/px8/med-on.png);color:#fff;filter:saturate(.6)}
.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;padding-block:40px 80px}
.aside{display:none}
.article{min-width:0;max-width:700px;font-size:18px;line-height:1.75}
.article .lead{font-size:20px;line-height:1.6;color:var(--fg);margin:0 0 10px}
.ps{padding-top:30px;scroll-margin-top:80px}
.ps h2{font-size:clamp(28px,4.4vw,38px);margin-bottom:14px}
.ps h3{font-family:var(--serif);font-size:23px;margin:26px 0 10px;scroll-margin-top:80px}
.ps p{margin:0 0 16px;color:var(--fg-2)}
.mlist,.qlist,.xlist{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.mlist li,.xlist li{position:relative;padding-left:40px;color:var(--fg-2)}
.mlist li::before{content:"";position:absolute;left:0;top:2px;width:28px;height:28px;background:url(../img/px8/sc1.png) center/28px no-repeat;image-rendering:pixelated}
.xlist li::before{content:"";position:absolute;left:0;top:2px;width:28px;height:28px;background:url(../img/px8/sc3.png) center/28px no-repeat;image-rendering:pixelated}
.qlist{counter-reset:q}
.qlist li{counter-increment:q;display:grid;grid-template-columns:40px minmax(0,1fr);gap:10px;align-items:center;padding:12px 14px;border:1px solid var(--line);background:var(--ink-2);color:var(--fg)}
.qlist li::before{content:counter(q);width:36px;height:36px;display:grid;place-items:center;background:url(../img/px8/med-on.png) center/36px no-repeat;image-rendering:pixelated;font:400 13px/1 'DotGothic16',monospace;color:#fff}
.callout{margin:22px 0;padding:6px 8px}
.callout b{font:400 14px/1 'DotGothic16',monospace;color:var(--cyan);display:block;margin-bottom:8px}
.callout.warn b{color:#F2B53A}
.callout p{margin:0;color:var(--fg)}
.inline-cta{display:grid;grid-template-columns:60px minmax(0,1fr);gap:14px;align-items:center;margin:22px 0;padding:6px}
.inline-cta img{width:60px;height:auto;image-rendering:pixelated}
.inline-cta b{font-family:var(--serif);font-size:20px}
.inline-cta p{margin:2px 0 0;font-size:15px}
.inline-cta .cta{grid-column:1/-1}
.qa{border:1px solid var(--line);background:var(--ink-2);margin-bottom:10px}
.qa summary{cursor:pointer;list-style:none;padding:16px 50px 16px 18px;font-family:var(--serif);font-weight:800;font-size:19px;position:relative}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font:400 22px/1 'DotGothic16',monospace;color:var(--cyan)}
.qa[open] summary::after{content:"−"}
.qa p{margin:0;padding:0 18px 18px;color:var(--fg-2)}
.authorbox{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center;margin-top:40px;padding:6px}
.authorbox img{width:120px;height:auto;image-rendering:pixelated;align-self:end}
@media (max-width:560px){.authorbox{grid-template-columns:96px minmax(0,1fr);align-items:start}.authorbox img{width:96px}.authorbox p{grid-column:1/-1}.authorbox > div{display:contents}.authorbox b{align-self:center}}
.authorbox b{font-family:var(--serif);font-size:21px;display:block}
.authorbox p{margin:6px 0 0;font-size:15px;color:var(--fg-2)}
.authorbox a{color:var(--cyan)}
.share{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.share button{min-height:44px;padding:0 14px;border:1px solid var(--line-2);background:none;cursor:pointer;font-weight:600;font-size:14px}
@media (min-width:1000px){
  .layout{grid-template-columns:270px minmax(0,1fr);gap:64px}
  .aside{display:block}
  .aside .toc{position:sticky;top:84px}
  .aside h2{font-size:15px;font-family:var(--sans);font-weight:700;color:var(--fg-3);margin:0 0 10px}
  .tocbtn{pointer-events:none;border-color:transparent;padding-left:0}
  .tocbtn .chev{display:none}
}

/* ===== contacto ===== */
[hidden]{display:none!important}
.chero{padding:100px 0 40px}
.cgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:start}
.direct{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:10px}
.direct li{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--line);background:rgba(7,13,36,.7)}
.direct .ic{width:44px;height:44px;display:grid;place-items:center;background:url(../img/px8/med-on.png) center/44px no-repeat;image-rendering:pixelated;font:400 14px/1 'DotGothic16',monospace;color:#fff}
.direct small{display:block;font-size:12.5px;color:var(--fg-3)}
.direct b{font-weight:700;font-size:16px;word-break:break-all;user-select:all}
.direct a.go,.direct button{min-height:40px;padding:0 12px;border:1px solid var(--line-2);background:none;cursor:pointer;font-size:13px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center}
.direct a.go:hover,.direct button:hover{border-color:var(--fg)}
.direct .wa{background:#1F7A4A;border-color:#1F7A4A;color:#fff}
.stage{position:relative;justify-self:center;width:min(100%,420px);aspect-ratio:4/3;display:grid;place-items:end center}
.stage .gate{position:absolute;left:50%;bottom:0;width:78%;transform:translateX(-50%);image-rendering:pixelated;opacity:.95}
.stage .me{position:relative;z-index:2;height:62%;width:auto;image-rendering:pixelated;filter:drop-shadow(0 12px 16px rgba(0,0,0,.5));margin-bottom:2%}
.stage .farol{position:absolute;bottom:0;width:13%;image-rendering:pixelated;z-index:1}
.stage .farol.l{left:0}
.stage .farol.r{right:0}
.stage .farol .on{position:absolute;inset:0;width:100%;opacity:0;transition:opacity .3s steps(3)}
.stage.lit .farol .on{opacity:1}
.stage .farol img{width:100%;display:block;image-rendering:pixelated}
.stage .bubble{position:absolute;z-index:3;right:6%;top:4%;background:var(--paper);color:var(--ink);font:400 15px/1.3 'DotGothic16',monospace;padding:10px 12px;max-width:200px;box-shadow:4px 4px 0 var(--cobalt)}
.stage .bubble::after{content:"";position:absolute;left:18px;bottom:-10px;border:10px solid transparent;border-top-color:var(--paper);border-bottom:0}
.fwrap{display:grid;grid-template-columns:minmax(0,1fr);gap:34px;align-items:start}
.cform{padding:10px 6px}
.cform form{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
.f{display:grid;gap:6px;min-width:0}
.f label,.f legend{font-weight:700;font-size:14px}
.f .opt{font-weight:400;color:var(--fg-3)}
.f input,.f textarea,.f select{width:100%;min-width:0;min-height:50px;padding:10px 14px;background:var(--ink);border:1px solid var(--line-2);color:var(--fg);font:inherit;font-size:16px}
.f textarea{min-height:130px;resize:vertical}
.f input:focus,.f textarea:focus,.f select:focus{outline:2px solid var(--cyan);outline-offset:0;border-color:transparent}
.f .help{font-size:13px;color:var(--fg-3);margin:0}
.f .err{font-size:13px;color:#FF8A6E;margin:0}
.f.bad input,.f.bad textarea{border-color:#FF8A6E}
fieldset.f{border:0;padding:0;margin:0}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills label{position:relative;cursor:pointer}
.pills input{position:absolute;opacity:0;width:1px;height:1px}
.pills span{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--line-2);font-weight:600;font-size:14px}
.pills img{width:24px;height:24px;image-rendering:pixelated}
.pills input:checked + span{background:var(--cobalt);border-color:var(--cobalt);color:#fff}
.pills input:focus-visible + span{outline:2px solid var(--cyan);outline-offset:2px}
.consent{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;font-size:14px;color:var(--fg-2)}
.consent input{width:20px;height:20px;margin-top:2px;accent-color:var(--cobalt)}
.sent{display:grid;gap:12px;padding:6px 4px}
.sent h3{margin:0;font-family:var(--serif);font-size:28px}
.sent p{margin:0;color:var(--fg-2)}
.next{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.next li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:start}
.next b.n{width:48px;height:48px;display:grid;place-items:center;background:url(../img/px8/med-off.png) center/48px no-repeat;image-rendering:pixelated;font:400 15px/1 'DotGothic16',monospace;color:#B9C8F2;transition:none}
.next li.on b.n{background-image:url(../img/px8/med-on.png);color:#fff}
.next h3{margin:4px 0 4px;font-family:var(--serif);font-size:20px}
.next p{margin:0;color:var(--fg-2);font-size:15px}
@media (min-width:1000px){.cgrid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}.fwrap{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:56px}.cform form{grid-template-columns:repeat(2,minmax(0,1fr))}.cform .full{grid-column:1/-1}}
