:root{--bg:#0F100E;--s1:#1A1B18;--s2:#2A2C27;--tx:#fff;--mu:#9A9C94;--so:#D9DAD5;--lima:#C8F031}
*{margin:0;padding:0;box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font-family:"Inter Tight",system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.45}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.w{max-width:680px;margin:0 auto;padding:0 20px}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}
.chip{display:inline-flex;align-items:center;gap:8px;font-family:"JetBrains Mono",monospace;font-weight:700;font-size:12px;color:var(--bg);background:var(--lima);padding:5px 10px;border-radius:6px}
.lab{font-family:"JetBrains Mono",monospace;font-weight:700;font-size:12px;letter-spacing:.08em;color:var(--lima);margin-bottom:14px}
nav{display:flex;justify-content:space-between;align-items:center;padding:20px 0}
nav .marca{font-weight:800;letter-spacing:-.02em;font-size:17px}
nav .marca{display:inline-flex;align-items:center;gap:10px}
nav .marca .kf{width:26px;height:26px}
nav .marca b{color:var(--lima)}
nav .ln{display:flex;gap:18px;font-family:"JetBrains Mono",monospace;font-size:13px;color:var(--mu)}
nav .ln a:hover{color:var(--lima)}
.hero{padding:36px 0 8px;text-align:center}
.foto{width:188px;height:188px;border-radius:50%;margin:0 auto 20px;border:3px solid var(--lima);object-fit:cover;background:#000;box-shadow:0 0 0 8px rgba(200,240,49,.08),0 20px 60px rgba(0,0,0,.6);display:block}
.mono-kf{width:112px;height:112px;border-radius:50%;margin:0 auto 18px;border:3px solid var(--lima);background:var(--s1);display:grid;place-items:center;font-weight:800;font-size:38px;color:var(--lima);letter-spacing:-.04em}
h1{font-weight:800;font-size:clamp(32px,7.6vw,48px);line-height:1.04;letter-spacing:-.03em}
h1 .l{color:var(--lima)}
.sub{margin:14px auto 0;font-size:17px;color:var(--so);max-width:31em}
.nuevo{margin-top:18px}
.btns{display:flex;flex-direction:column;gap:10px;margin:28px auto 0;max-width:420px}
.b{display:flex;justify-content:center;align-items:center;gap:10px;font-weight:700;font-size:16px;padding:15px 18px;border-radius:12px;border:1px solid var(--s2);background:var(--s1);transition:border-color .15s,transform .15s}
.b:hover{border-color:var(--lima);transform:translateY(-1px)}
.b.p{background:var(--lima);color:var(--bg);border-color:var(--lima)}
.b.p:hover{filter:brightness(1.06)}
.redes{display:flex;justify-content:center;gap:14px;margin-top:16px;font-family:"JetBrains Mono",monospace;font-size:13px;color:var(--mu)}
.redes a:hover{color:var(--lima)}
section.s{padding-top:64px}
h2{font-weight:800;font-size:clamp(24px,5.4vw,32px);letter-spacing:-.025em;line-height:1.1}
.s .intro{color:var(--so);margin-top:8px;font-size:16px}
.maq{display:grid;gap:12px;margin-top:22px}
.mq{display:grid;grid-template-columns:112px 1fr;gap:16px;align-items:center;background:var(--s1);border:1px solid var(--s2);border-radius:16px;padding:12px}
.mq img{width:112px;height:112px;object-fit:cover;border-radius:10px;background:#000}
.mq b{font-weight:800;font-size:18px;letter-spacing:-.01em}
.mq p{color:var(--mu);font-size:14px;margin-top:4px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.card{background:var(--s1);border:1px solid var(--s2);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s,transform .15s}
.card:hover{border-color:var(--lima);transform:translateY(-2px)}
.card img{aspect-ratio:4/3;object-fit:cover;background:#000}
.card .c{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.card b{font-weight:800;font-size:16px;line-height:1.2;letter-spacing:-.01em}
.card .m{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--mu);margin-top:auto}
.vertodas{display:inline-block;margin-top:16px;font-family:"JetBrains Mono",monospace;font-weight:700;font-size:13px;color:var(--lima)}
.lista{background:var(--s1);border:1px solid var(--s2);border-left:3px solid var(--lima);border-radius:16px;padding:24px 20px}
.lista p{color:var(--so);margin-top:8px}
form.fl{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
form.fl input{flex:1;min-width:200px;background:var(--bg);border:1px solid var(--s2);border-radius:10px;color:var(--tx);font:500 16px "Inter Tight",sans-serif;padding:13px 14px}
form.fl input:focus{outline:none;border-color:var(--lima)}
form.fl button,.btnl{font-family:"JetBrains Mono",monospace;font-weight:700;font-size:14px;color:var(--bg);background:var(--lima);border:0;border-radius:10px;padding:13px 16px;cursor:pointer;display:inline-block;margin-top:16px}
form.fl button{margin-top:0}
.nota{font-size:12px;color:var(--mu);margin-top:10px}
.neg{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;background:var(--s1);border:1px solid var(--s2);border-radius:16px;padding:20px}
.neg p{color:var(--so);font-size:15px;margin-top:4px}
footer{margin-top:72px;border-top:1px solid var(--s2);padding:28px 0 40px}
.cols{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.cols h4{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.08em;color:var(--mu);margin-bottom:10px;font-weight:700}
.cols a{display:block;font-size:14px;color:var(--so);margin-bottom:6px}
.cols a:hover{color:var(--lima)}
.seo{margin-top:28px;font-size:13px;color:var(--mu);max-width:42em}
.legal{margin-top:16px;font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--mu)}
/* bóveda */
.filtros{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.f{font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:700;padding:7px 11px;border-radius:999px;border:1px solid var(--s2);background:var(--s1);color:var(--so);cursor:pointer}
.f.on{background:var(--lima);color:var(--bg);border-color:var(--lima)}
.cuenta{font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--mu);margin-top:14px}
/* guía */
.gh{padding:28px 0 8px}
.gh img{width:100%;max-height:340px;object-fit:cover;border-radius:16px;margin-bottom:22px;background:#000}
.meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.tag{font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;color:var(--lima);border:1px solid var(--s2);border-radius:6px;padding:3px 8px}
.doc{padding-top:18px;font-size:17px;color:var(--so)}
.doc h2{color:var(--tx);font-size:24px;margin:36px 0 10px}
.doc h3{color:var(--tx);font-size:19px;font-weight:800;margin:26px 0 8px}
.doc p{margin:12px 0}
.doc strong{color:var(--tx)}
.doc em{color:var(--so)}
.doc a{color:var(--lima);text-decoration:underline;text-underline-offset:3px}
.doc ul,.doc ol{margin:12px 0 12px 22px}
.doc li{margin:6px 0}
.doc hr{border:0;border-top:1px solid var(--s2);margin:32px 0}
.doc blockquote{border-left:3px solid var(--lima);padding:4px 0 4px 16px;margin:16px 0;color:var(--tx)}
.doc pre{background:var(--s1);border:1px solid var(--s2);border-radius:12px;padding:16px;overflow-x:auto;margin:14px 0;position:relative}
.doc code{font-family:"JetBrains Mono",monospace;font-size:14px;color:#E8E9E4}
.doc p code,.doc li code{background:var(--s1);border:1px solid var(--s2);border-radius:5px;padding:1px 5px;font-size:13px}
.copiar{position:absolute;top:8px;right:8px;font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;background:var(--s2);color:var(--so);border:0;border-radius:6px;padding:4px 8px;cursor:pointer}
.doc table{border-collapse:collapse;width:100%;margin:14px 0;font-size:15px}
.doc th,.doc td{border:1px solid var(--s2);padding:8px 10px;text-align:left}
.volver{font-family:"JetBrains Mono",monospace;font-size:13px;color:var(--mu)}
.volver:hover{color:var(--lima)}
.pg{padding-top:28px}
.pg h1{font-size:clamp(30px,7vw,46px)}
.bl{margin-top:44px}
.bl h2{font-size:clamp(22px,5vw,28px)}
.bl p,.bl li{color:var(--so);font-size:17px}
.bl p{margin-top:10px}
.pasos{display:grid;gap:10px;margin-top:16px}
.pa{display:grid;grid-template-columns:44px 1fr;gap:14px;background:var(--s1);border:1px solid var(--s2);border-radius:14px;padding:16px}
.pa .n{font-family:"JetBrains Mono",monospace;font-weight:700;color:var(--lima);font-size:15px}
.pa b{display:block;color:var(--tx);font-size:17px}
.pa span{color:var(--mu);font-size:15px}
.dos{display:grid;gap:12px;margin-top:16px}
.caja{background:var(--s1);border:1px solid var(--s2);border-radius:14px;padding:18px}
.caja h3{font-size:14px;font-family:"JetBrains Mono",monospace;letter-spacing:.06em;margin-bottom:8px}
.caja.si h3{color:var(--lima)}
.caja.no h3{color:var(--mu)}
.caja ul{margin-left:18px}
.caja li{margin:6px 0;font-size:16px}
.faq details{border-bottom:1px solid var(--s2);padding:14px 0}
.faq summary{cursor:pointer;font-weight:700;font-size:17px;color:var(--tx)}
.faq details p{margin-top:8px}
@media (min-width:620px){.dos{grid-template-columns:1fr 1fr}}
.sk-grid{display:grid;gap:14px;margin-top:22px}
.sk{background:var(--s1);border:1px solid var(--s2);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:10px}
.sk .top2{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.sk b{font-weight:800;font-size:19px;letter-spacing:-.01em;color:var(--tx)}
.sk .de{font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--mu)}
.sk .de a:hover{color:var(--lima)}
.sk p{color:var(--so);font-size:15px}
.sk .uso{font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;color:var(--bg);background:var(--lima);border-radius:6px;padding:3px 7px;white-space:nowrap}
.sk .lab2{font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--lima);margin-top:4px}
.sk pre{background:var(--bg);border:1px solid var(--s2);border-radius:10px;padding:38px 14px 14px;overflow-x:auto;position:relative;margin:0}
.sk code{font-family:"JetBrains Mono",monospace;font-variant-ligatures:none;font-size:13px;color:#E8E9E4;white-space:pre-wrap;word-break:break-word}
.cat{margin-top:40px}
.banner-sk{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:22px;background:var(--s1);border:1px solid var(--lima);border-radius:16px;padding:18px 20px}
.banner-sk b{font-size:18px}
.banner-sk span{color:var(--so);font-size:15px;display:block;margin-top:2px}
.banner-sk .chip{color:var(--bg);display:inline-flex;margin-top:0;font-size:13px;padding:8px 12px}
@media (min-width:960px){.sk-grid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:620px) and (max-width:959px){.sk-grid{grid-template-columns:1fr 1fr}}
@media (min-width:620px){.grid{grid-template-columns:repeat(3,1fr)}.cols{grid-template-columns:repeat(4,1fr)}}
/* ---------- escritorio ---------- */
@media (min-width:960px){
.w{max-width:1160px;padding:0 40px}
nav{padding:28px 0}
nav .ln{gap:28px;font-size:14px}
/* inicio: texto a la izquierda, retrato a la derecha */
.hero{display:grid;grid-template-columns:1fr 380px;column-gap:64px;align-items:center;text-align:left;padding:56px 0 24px}
.hero>*{grid-column:1}
.hero .foto,.hero .mono-kf{grid-column:2;grid-row:1/span 6;width:360px;height:360px;margin:0;justify-self:end}
.hero h1{font-size:60px}
.hero .sub{margin:16px 0 0;font-size:19px}
.hero .btns{flex-direction:row;flex-wrap:nowrap;max-width:none;margin:28px 0 0}
.hero .btns .b{padding:14px 18px;font-size:15px;white-space:nowrap}
.hero .redes{justify-content:flex-start}
section.s{padding-top:88px}
h2{font-size:36px}
.maq{grid-template-columns:repeat(3,1fr);gap:16px}
.mq{grid-template-columns:1fr;grid-template-rows:200px auto;align-items:start;padding:0;overflow:hidden}
.mq img{width:100%;height:200px;border-radius:0}
.mq>div{padding:4px 20px 22px}
.grid{grid-template-columns:repeat(4,1fr);gap:16px}
.card img{aspect-ratio:16/10}
.card b{font-size:17px}
.lista{display:grid;grid-template-columns:1fr 1fr;column-gap:48px;align-items:center;padding:36px 40px}
.lista>*{grid-column:1}
.lista form.fl,.lista .btnl,.lista .nota{grid-column:2}
.lista form.fl{grid-row:1/span 2;align-self:end;margin:0}
.lista .btnl{grid-row:1/span 2;align-self:end;justify-self:start}
.lista .nota{grid-row:3}
.neg{padding:28px 40px}
/* bóveda */
section>.filtros{max-width:900px}
/* guías: columna de lectura */
article{max-width:760px;margin:0 auto}
.gh img{max-height:380px}
article~section.s{max-width:760px;margin-left:auto;margin-right:auto}
/* páginas internas */
.pg{padding-top:56px;max-width:860px}
.pg h1{font-size:54px}
.bl{margin-top:72px}
.bl>.pasos{grid-template-columns:1fr 1fr}
.bl>p{max-width:760px}
.faq{max-width:860px}
footer{margin-top:96px}
}
@media (max-width:420px){nav .ln{gap:12px;font-size:12px}nav .marca{font-size:15px}}
.busca{display:flex;align-items:center;gap:10px;margin-top:24px;background:var(--s1);border:1px solid var(--s2);border-radius:12px;padding:0 14px;color:var(--mu)}
.busca:focus-within{border-color:var(--lima)}
.busca input{flex:1;background:none;border:0;color:var(--tx);font:500 16px "Inter Tight",sans-serif;padding:14px 0;outline:none}
.lista-b{margin-top:16px;border:1px solid var(--s2);border-radius:16px;overflow:hidden;background:var(--s1)}
.row{display:grid;grid-template-columns:56px 1fr 20px;gap:16px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--s2);transition:background .15s}
.row:last-child{border-bottom:0}
.row:hover{background:#20211d}
.row:hover .ar{color:var(--lima);transform:translateX(3px)}
.row .ic{width:56px;height:56px;border-radius:12px;background:var(--bg);border:1px solid var(--s2);display:grid;place-items:center;color:var(--so);overflow:hidden}
.row .ic.th img{width:56px;height:56px;object-fit:cover}
.rb{display:flex;flex-direction:column;gap:5px;min-width:0}
.rt{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rt b{font-weight:800;font-size:17px;letter-spacing:-.01em}
.bd{font-family:"JetBrains Mono",monospace;font-size:10px;font-weight:700;letter-spacing:.06em;color:var(--mu);border:1px solid var(--s2);border-radius:5px;padding:2px 6px}
.bd.l{color:var(--bg);background:var(--lima);border-color:var(--lima)}
.bd.n{color:var(--lima);border-color:#3a4320}
.rd{color:var(--so);font-size:14px;line-height:1.4}
.rm{font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--mu)}
.rm code{color:var(--so)}
.ar{color:var(--mu);font-size:18px;transition:transform .15s,color .15s}
/* detalle de skill */
.migas{font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--mu);display:flex;gap:8px;flex-wrap:wrap;padding-top:24px}
.migas a:hover{color:var(--lima)}
.det h1{font-size:clamp(30px,6.6vw,48px);margin-top:14px;max-width:900px}
.det .intro{color:var(--so);font-size:18px;margin-top:14px;max-width:760px}
.metac{margin-top:26px;background:var(--s1);border:1px solid var(--s2);border-radius:16px;padding:20px}
.metac .l1{font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--mu);letter-spacing:.06em}
.metac .l2{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-top:10px;font-weight:700}
.metac .l2 code{font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:500;background:var(--bg);border:1px solid var(--s2);border-radius:6px;padding:3px 8px;color:var(--so)}
.anclas{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.anclas a{font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:700;border:1px solid var(--s2);border-radius:8px;padding:7px 10px;color:var(--so)}
.anclas a:hover{border-color:var(--lima);color:var(--lima)}
.tres{display:grid;gap:12px;margin-top:18px}
.ci{background:var(--s1);border:1px solid var(--s2);border-radius:14px;padding:16px}
.ci b{display:block;font-size:15px}
.ci span{display:block;color:var(--mu);font-size:14px;margin-top:4px}
.ci a{color:var(--lima)}
.callout{margin-top:16px;border-radius:14px;padding:18px 20px;background:#171a10;border:1px solid #3a4320}
.callout b{color:var(--lima)}
.callout p{color:var(--so);margin-top:6px}
.cmdbox{margin-top:16px;background:var(--s1);border:1px solid var(--s2);border-radius:14px;padding:16px}
.cmdbox .t{font-weight:700;font-size:15px}
.cmdbox pre{margin-top:10px;background:#000;border:1px solid var(--s2);border-radius:10px;padding:14px;overflow-x:auto}
.cmdbox code{font-family:"JetBrains Mono",monospace;font-variant-ligatures:none;font-size:14px;color:#E8E9E4;white-space:pre-wrap;word-break:break-word}
.cp{margin-top:10px;font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:700;background:var(--bg);border:1px solid var(--s2);color:var(--so);border-radius:8px;padding:7px 10px;cursor:pointer}
.cp:hover{border-color:var(--lima);color:var(--lima)}
.cp.ok{background:var(--lima);color:var(--bg);border-color:var(--lima)}
.sec{margin-top:64px;scroll-margin-top:20px}
.sec h2{margin-top:6px}
@media (min-width:760px){.tres{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.row{grid-template-columns:44px 1fr;gap:12px;padding:14px}.row .ic,.row .ic.th img{width:44px;height:44px}.ar{display:none}}