:root{
  --bg:#06070a;
  --panel:#0c0e12;
  --panel2:#101319;
  --text:#f2f4f7;
  --muted:#9299a7;
  --faint:#565e6b;
  --line:rgba(255,255,255,.09);
  --accent:#a7f3ff;
  --green:#86f7ac;
  --yellow:#f3d36a;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.55;overflow-x:hidden;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(to bottom,#000 0%,transparent 72%);
}
.noise{
  position:fixed;inset:0;pointer-events:none;z-index:10;opacity:.025;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}
.scanline{
  position:fixed;left:0;right:0;top:-2px;height:1px;background:rgba(167,243,255,.15);
  pointer-events:none;z-index:11;animation:scan 8s linear infinite;
}
@keyframes scan{to{transform:translateY(100vh)}}
a{color:inherit;text-decoration:none}
.section,.site-header,.site-footer{position:relative;z-index:2;width:min(var(--max),calc(100% - 40px));margin:auto}
.site-header{
  height:78px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;
}
.brand{display:flex;align-items:center;gap:11px;font-size:.82rem;font-weight:900;letter-spacing:.15em}
.brand-symbol{
  width:30px;height:30px;display:grid;place-items:center;
  border:1px solid rgba(167,243,255,.8);color:var(--accent);font-size:.75rem;
}
.brand-word span{color:var(--accent);margin:0 4px}
.nav{display:flex;gap:28px;color:var(--muted);font-size:.82rem}
.nav a:hover{color:var(--text)}
.header-state{font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--green);letter-spacing:.1em;display:flex;align-items:center;gap:7px}
.header-state span{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
.hero{
  min-height:690px;padding:110px 0 95px;
  display:grid;grid-template-columns:1fr .88fr;gap:70px;align-items:center;
}
.eyebrow{
  display:flex;align-items:center;gap:8px;color:var(--accent);
  font-size:.66rem;font-weight:850;letter-spacing:.2em;
}
.pulse{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
h1{font-size:clamp(4rem,8vw,8rem);line-height:.83;letter-spacing:-.07em;margin:22px 0 30px}
h1 .ghost{color:#6d7480}
h1 strong{font-weight:900}
h1 .outline{color:transparent;-webkit-text-stroke:1px rgba(242,244,247,.55)}
.hero-lead{max-width:590px;color:var(--muted);font-size:1.02rem}
.hero-lead b{color:var(--text)}
.hero-actions{display:flex;gap:10px;margin-top:31px;flex-wrap:wrap}
.btn{
  min-height:49px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:14px;
  border:1px solid var(--line);font-size:.75rem;font-weight:800;letter-spacing:.04em;transition:.2s ease;
}
.btn-primary{background:var(--text);color:var(--bg);border-color:var(--text)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:rgba(167,243,255,.5);color:var(--accent)}
.hero-foot{
  max-width:610px;margin-top:44px;padding-top:14px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:12px;color:var(--faint);
  font:9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.13em;
}
.hero-core{
  width:min(460px,100%);aspect-ratio:1;justify-self:end;position:relative;overflow:hidden;
  border:1px solid var(--line);background:radial-gradient(circle at 50% 50%,rgba(167,243,255,.06),transparent 39%),#07090c;
  box-shadow:0 30px 100px rgba(0,0,0,.4);
}
.hero-core:before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 50% 50%,transparent 0 23%,rgba(255,255,255,.025) 23.2%,transparent 23.5%),
    linear-gradient(90deg,transparent 49.85%,rgba(255,255,255,.06) 50%,transparent 50.15%),
    linear-gradient(0deg,transparent 49.85%,rgba(255,255,255,.06) 50%,transparent 50.15%);
}
.core-rings{position:absolute;border:1px solid rgba(167,243,255,.26);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}
.ring-1{width:43%;height:43%;box-shadow:0 0 45px rgba(167,243,255,.04),inset 0 0 45px rgba(167,243,255,.03)}
.ring-2{width:65%;height:65%;border-color:rgba(255,255,255,.1)}
.ring-3{width:86%;height:86%;border-style:dashed;border-color:rgba(167,243,255,.16);animation:spin 18s linear infinite}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.core-cross:before,.core-cross:after{content:"";position:absolute;background:rgba(167,243,255,.22)}
.core-cross:before{width:1px;height:100%;left:50%;top:0}
.core-cross:after{height:1px;width:100%;top:50%;left:0}
.core-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:112px;height:112px;border:1px solid rgba(167,243,255,.55);border-radius:50%;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  background:rgba(6,7,10,.86);box-shadow:0 0 55px rgba(167,243,255,.08);
}
.core-center span{font-size:1.25rem;font-weight:900;letter-spacing:.14em}
.core-center small{font-size:.56rem;color:var(--accent);letter-spacing:.3em;margin-left:.3em}
.core-label{position:absolute;color:#68717d;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}
.top-left{left:17px;top:15px}.top-right{right:17px;top:15px}.bottom-left{left:17px;bottom:15px}.bottom-right{right:17px;bottom:15px;color:var(--accent)}
.ticker{
  width:100%;position:relative;z-index:2;display:flex;justify-content:center;flex-wrap:wrap;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  color:#686f7c;font-size:.61rem;font-weight:800;letter-spacing:.19em;
}
.ticker div{padding:15px 24px;border-right:1px solid var(--line)}
.ticker div:last-child{border:0}
.section-heading{
  padding:110px 0 40px;display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:end;
}
.section-heading h2,.lab-copy h2,.about-header h2,.contact-box h2{
  margin:10px 0 0;font-size:clamp(2.2rem,4.3vw,4rem);line-height:.97;letter-spacing:-.05em;
}
.section-heading p{margin:0;max-width:450px;color:var(--muted);font-size:.9rem}
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.project-card{
  min-height:475px;padding:22px;display:flex;flex-direction:column;
  background:linear-gradient(180deg,var(--panel2),var(--panel));
  border:1px solid var(--line);transition:.22s ease;position:relative;
}
.project-card:after{
  content:"";position:absolute;left:22px;right:22px;top:61px;height:1px;background:var(--line)
}
.project-card:hover{transform:translateY(-4px);border-color:rgba(167,243,255,.26)}
.project-card.featured{box-shadow:inset 0 1px 0 rgba(167,243,255,.22)}
.project-top{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}
.project-id,.status{font:9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em}
.project-id{color:#66707d}.status{display:flex;align-items:center;gap:6px}
.status i{width:6px;height:6px;border-radius:50%;background:currentColor}
.status.live{color:var(--green)}.status.build{color:var(--yellow)}.status.lab{color:var(--accent)}
.project-body{margin-top:58px}
.project-kicker{color:#697281;font-size:.6rem;letter-spacing:.16em;font-weight:800}
.project-card h3{font-size:2.1rem;letter-spacing:-.05em;margin:18px 0 3px}
.project-title{color:#c7ccd4;font-size:.85rem;margin:0 0 18px}
.project-copy{color:var(--muted);font-size:.82rem;max-width:36ch}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:22px}
.tags span{border:1px solid var(--line);padding:5px 7px;color:#747d8a;font-size:.57rem;letter-spacing:.08em}
.project-link{
  margin-top:auto;padding-top:18px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;color:var(--accent);font-size:.65rem;font-weight:900;letter-spacing:.12em
}
.lab-section{margin-top:120px;display:grid;grid-template-columns:1.05fr .95fr;gap:75px;align-items:center}
.lab-panel{
  min-height:470px;border:1px solid var(--line);background:#07090c;overflow:hidden;position:relative;
}
.panel-head{
  height:40px;padding:0 15px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;color:#646d79;
  font:9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;
}
.map{position:absolute;inset:40px 0 0;background:
  linear-gradient(rgba(167,243,255,.055) 1px,transparent 1px),
  linear-gradient(90deg,rgba(167,243,255,.055) 1px,transparent 1px);
  background-size:34px 34px;
}
.map:before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 48%,rgba(167,243,255,.07),transparent 36%);
}
.map-line{position:absolute;height:1px;background:rgba(167,243,255,.18);transform-origin:left center}
.line-a{width:190px;left:27%;top:49%;transform:rotate(-20deg)}
.line-b{width:175px;left:51%;top:49%;transform:rotate(20deg)}
.line-c{width:160px;left:49%;top:50%;transform:rotate(88deg)}
.node{
  position:absolute;min-width:105px;padding:12px 13px;background:rgba(8,10,14,.93);
  border:1px solid var(--line);display:flex;flex-direction:column;gap:2px;
}
.node strong{font-size:.68rem;letter-spacing:.09em}
.node small{font:8px ui-monospace,SFMono-Regular,Menlo,monospace;color:#6a7380}
.node-dot{width:5px;height:5px;border-radius:50%;background:var(--accent);margin-bottom:5px;box-shadow:0 0 9px rgba(167,243,255,.5)}
.node-core{left:39%;top:39%;border-color:rgba(167,243,255,.45)}
.node-sec{left:8%;top:22%;}.node-sec .node-dot{background:var(--green)}
.node-ai{right:7%;top:23%;}.node-ai .node-dot{background:var(--yellow)}
.node-infra{left:42%;bottom:9%;}.node-infra .node-dot{background:#c1a8ff}
.lab-copy>p{max-width:510px;margin-top:25px;color:var(--muted);font-size:.95rem}
.command-list{margin-top:32px}
.command-list>div{
  display:grid;grid-template-columns:34px 90px 1fr;gap:13px;padding:12px 0;border-top:1px solid var(--line);
  font-size:.74rem;align-items:center;
}
.command-list span{color:#59616d;font:9px ui-monospace,SFMono-Regular,Menlo,monospace}
.command-list b{font-size:.68rem;letter-spacing:.1em}
.command-list em{font-style:normal;color:#727b88}
.about-section{padding:115px 0}
.about-header{display:grid;grid-template-columns:1fr .8fr;gap:50px;align-items:end;margin-bottom:38px}
.about-header p{margin:0;color:var(--muted);max-width:440px;font-size:.9rem}
.identity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.identity-card{border-top:1px solid var(--line);padding:18px 0}
.identity-card span{font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:#5f6772}
.identity-card h3{font-size:1rem;letter-spacing:.08em;margin:28px 0 8px}
.identity-card p{margin:0;color:var(--muted);font-size:.79rem}
.contact-section{padding-bottom:75px}
.contact-box{
  padding:42px;border:1px solid rgba(167,243,255,.2);
  background:radial-gradient(circle at 84% 0%,rgba(167,243,255,.07),transparent 34%),rgba(255,255,255,.012);
  display:flex;justify-content:space-between;align-items:flex-end;gap:28px;
}
.contact-box p{margin:16px 0 0;color:var(--muted);font-size:.87rem}
.contact-actions{display:flex;gap:9px;flex-wrap:wrap}
.site-footer{
  padding:25px 0 30px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:20px;color:#636b77;font-size:.68rem;
}
.site-footer>div{display:flex;gap:17px}.site-footer strong{color:#8e97a4}
@media (max-width:900px){
  .nav{display:none}
  .hero,.lab-section{grid-template-columns:1fr}
  .hero{padding-top:75px}
  .hero-core{justify-self:center}
  .project-grid{grid-template-columns:1fr}
  .section-heading,.about-header{grid-template-columns:1fr;gap:18px;padding-top:85px}
  .identity-grid{grid-template-columns:1fr 1fr}
  .contact-box{flex-direction:column;align-items:flex-start}
}
@media (max-width:560px){
  .section,.site-header,.site-footer{width:calc(100% - 28px)}
  .header-state{display:none}
  h1{font-size:4rem}
  .hero{padding-top:55px}
  .hero-foot{flex-wrap:wrap}
  .ticker{justify-content:flex-start}
  .ticker div{padding:13px 14px}
  .hero-core{width:100%}
  .identity-grid{grid-template-columns:1fr}
  .contact-box{padding:28px}
  .site-footer{flex-direction:column}
  .site-footer>div{justify-content:space-between}
}