:root{
 --ink:#0D0E10;--panel:#15171A;--line:#2A2D32;--text:#EDEEF0;--muted:#9BA1A8;--y:#F5B400;
 --f12:.75rem;--f16:1rem;--f21:1.3125rem;--f28:1.75rem;--f38:2.375rem;--f50:3.125rem;--f67:4.1875rem;
 --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s6:48px;--s8:64px;--s12:96px;
 --wrap:1200px;--prose:62ch;
 --disp:"Archivo",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{background:var(--ink);color:var(--text);font:400 var(--f16)/1.6 var(--disp);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s3)}
.eyebrow{font:500 var(--f12)/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--y);display:flex;align-items:center;gap:var(--s2);margin-bottom:var(--s3)}
.eyebrow:before{content:"";width:32px;height:2px;background:var(--y)}
h1,h2,h3{font-family:var(--disp);font-stretch:85%;font-weight:700;line-height:1.05;letter-spacing:-.01em}
h1{font-size:clamp(var(--f38),6vw,var(--f67))}
h2{font-size:clamp(var(--f28),4vw,var(--f50));max-width:18ch}
h3{font-size:var(--f21);line-height:1.2;font-weight:650}
p.lead{font-size:var(--f21);line-height:1.5;color:#C9CDD2;max-width:var(--prose)}
p{max-width:var(--prose)}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:var(--s1);padding:var(--s2) var(--s3);font:600 var(--f16)/1 var(--disp);border:1px solid var(--text);border-radius:2px;transition:background .2s,color .2s}
.btn:after{content:"→"}
.btn:hover{background:var(--text);color:var(--ink)}
.btn-y{background:var(--y);border-color:var(--y);color:var(--ink)}
.btn-y:hover{background:#fff;border-color:#fff}
.btn-s{padding:12px var(--s2)}
/* AI diagram */
.diag{border:1px solid var(--line);background:var(--panel);padding:var(--s4);display:grid;gap:var(--s3);position:relative}
.dg-row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2)}
.dg-mods{grid-template-columns:repeat(2,1fr)}
.dg-box,.dg-mod{border:1px solid var(--line);padding:var(--s2);font:500 var(--f12)/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#C9CDD2;position:relative}
.dg-core{border:1px solid var(--y);padding:var(--s3);text-align:center;background:rgba(245,180,0,.06);position:relative}
.dg-core b{display:block;font:700 var(--f21)/1.2 var(--disp);font-stretch:85%;color:var(--y)}
.dg-core span{font:500 var(--f12)/1.4 var(--mono);color:var(--muted);letter-spacing:.06em}
.dg-core:before,.dg-core:after{content:"";position:absolute;left:50%;width:2px;height:var(--s3);background:var(--y)}
.dg-core:before{top:calc(-1 * var(--s3) - 1px)}.dg-core:after{bottom:calc(-1 * var(--s3) - 1px)}
.dg-mod i{display:inline-block;width:8px;height:8px;background:var(--y);margin-right:var(--s1);animation:pulse 2.4s infinite}
.dg-mod small{display:block;font-size:var(--f12);color:var(--muted);margin-top:4px;letter-spacing:.06em}
.dg-next{border-style:dashed}.dg-next i{background:none;border:1px solid var(--y);animation:none}
@keyframes pulse{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.dg-mod i{animation:none}}
/* header */
.bar{position:sticky;top:0;z-index:20;background:rgba(13,14,16,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar-in{display:flex;align-items:center;gap:var(--s4);height:72px}
.brand img{height:48px;width:auto}
#nav{display:flex;gap:var(--s3);margin-left:auto;font-size:var(--f16)}
#nav a{color:#C9CDD2}#nav a:hover{color:var(--y)}
.burger{display:none;background:none;border:0;width:40px;height:40px;cursor:pointer}
.burger span,.burger span:before,.burger span:after{display:block;width:24px;height:2px;background:var(--text);position:relative;margin:auto}
.burger span:before,.burger span:after{content:"";position:absolute}.burger span:before{top:-7px}.burger span:after{top:7px}
/* sections */
section{padding:var(--s12) 0;border-bottom:1px solid var(--line)}
.hero{padding:var(--s8) 0 var(--s8);position:relative;overflow:hidden;
 background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;background-position:-1px -1px}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 30%,rgba(13,14,16,.6));pointer-events:none}
.hero .wrap{position:relative;display:grid;grid-template-columns:5fr 7fr;gap:var(--s6);align-items:center}
.hero h1{margin-bottom:var(--s3)}
.hero p.lead{margin-bottom:var(--s4)}
.btns{display:flex;flex-wrap:wrap;gap:var(--s2)}
.fig{position:relative}
.fig img{width:100%;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--line)}
.fig figcaption{font:500 var(--f12)/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:var(--s1)}
.hero .fig:after{content:"";position:absolute;right:-1px;bottom:26px;width:24px;height:96px;background:repeating-linear-gradient(135deg,var(--y) 0 8px,transparent 8px 16px)}
.stats{padding:0;background:var(--panel)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:var(--s4) var(--s3);border-left:1px solid var(--line)}
.stat:first-child{border-left:0;padding-left:0}
.stat b{display:block;font:500 var(--f38)/1 var(--mono);letter-spacing:-.02em}
.stat b:after{content:"";display:block;width:24px;height:2px;background:var(--y);margin:var(--s2) 0 var(--s1)}
.stat span{font:500 var(--f12)/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.head{margin-bottom:var(--s6)}
.head p{margin-top:var(--s3);color:#C9CDD2}
.split .wrap{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);align-items:center}
.split.rev .fig{order:-1}
.split p{color:#C9CDD2;margin-top:var(--s3)}
ul.ticks{list-style:none;margin-top:var(--s4);display:grid;gap:var(--s2)}
ul.ticks li{padding-left:var(--s4);position:relative;max-width:var(--prose)}
ul.ticks li:before{content:"";position:absolute;left:0;top:.7em;width:16px;height:2px;background:var(--y)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.grid.g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--ink);padding:var(--s4);min-height:100%}
.card h3{margin-bottom:var(--s2)}
.card p{color:var(--muted)}
.card .k{font:500 var(--f12)/1 var(--mono);color:var(--y);letter-spacing:.12em;display:block;margin-bottom:var(--s3)}
.gal{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3)}
.gal img{aspect-ratio:16/9;object-fit:cover;width:100%;border:1px solid var(--line)}
.uas-img{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);margin-bottom:var(--s6)}
.uas-img img{width:100%;aspect-ratio:13/5;object-fit:cover;border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;font-size:var(--f16)}
th,td{text-align:left;padding:var(--s2) var(--s3) var(--s2) 0;border-bottom:1px solid var(--line);vertical-align:top}
th{font:500 var(--f12)/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
td:not(:first-child){font-family:var(--mono);font-size:.9375rem}
td:first-child{color:#C9CDD2}
.note{margin-top:var(--s4);font-size:var(--f12);font-family:var(--mono);color:var(--muted);max-width:none}
.steps{counter-reset:st}
.steps .card .k:before{counter-increment:st;content:"STAGE " counter(st)}
.text p{font-size:var(--f21);line-height:1.5;color:#C9CDD2;margin-top:var(--s3)}
.contact .wrap{display:grid;grid-template-columns:5fr 7fr;gap:var(--s8)}
.contact dl{margin-top:var(--s4);display:grid;gap:var(--s2)}
.contact dt{font:500 var(--f12)/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.contact dd a:hover{color:var(--y)}
form{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
form .full{grid-column:1/-1}
input,textarea{width:100%;background:var(--panel);border:1px solid var(--line);color:var(--text);padding:var(--s2);font:400 var(--f16)/1.4 var(--disp);border-radius:2px}
input:focus,textarea:focus{outline:2px solid var(--y);outline-offset:-1px}
textarea{min-height:128px;resize:vertical}
.fmsg{font-family:var(--mono);font-size:var(--f12);color:var(--y)}
.foot{padding:var(--s4) 0}
.foot-in{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font:500 var(--f12)/1 var(--mono)}
.foot img{height:32px;width:auto;opacity:.7}
@media (max-width:960px){
 #nav,.bar #cta{display:none}.burger{display:block;margin-left:auto}
 body.menu #nav{display:flex;flex-direction:column;position:absolute;top:72px;left:0;right:0;background:var(--ink);padding:var(--s3);border-bottom:1px solid var(--line)}
 .hero .wrap,.split .wrap,.contact .wrap{grid-template-columns:1fr;gap:var(--s4)}
 .split.rev .fig{order:0}
 .grid,.grid.g4{grid-template-columns:1fr 1fr}
 .stats .wrap{grid-template-columns:1fr 1fr}.stat{border-left:0;padding-left:0;border-top:1px solid var(--line)}
 section{padding:var(--s8) 0}
 .stat b{font-size:var(--f28);white-space:nowrap}
}
@media (max-width:600px){
 .grid,.grid.g4,.gal,.uas-img,form,.dg-row,.dg-mods{grid-template-columns:1fr}
 .diag{padding:var(--s3)}
 table{font-size:var(--f12)}th,td{padding-right:var(--s1)}
 td:not(:first-child){font-size:var(--f12)}
}
