/* ============================================================
   AurionWorks · Systems Grid design system
   Dark monochrome · Archivo + JetBrains Mono · bordered cells
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  --bg:#0a0a0a;
  --cell:#0d0e0f;
  --cell2:#101113;
  --tx:#ededed;
  --mut:#92969b;
  --faint:#5a5d61;
  --line:rgba(255,255,255,0.13);
  --line2:rgba(255,255,255,0.07);
  --pad:24px;
  --maxw:1440px;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--bg);
  color:var(--tx);
  font-family:'Archivo',sans-serif;
  font-size:15px;
  line-height:1.55;
  letter-spacing:-0.01em;
  -webkit-font-smoothing:antialiased;
  padding:16px;
}
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0; font-weight:600; letter-spacing:-0.03em; }
p{ margin:0; }
img{ max-width:100%; display:block; }

.mono{ font-family:'JetBrains Mono',monospace; }
.kick{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--faint); }

/* ---------- shell ---------- */
.shell{
  max-width:var(--maxw);
  margin:0 auto;
  border:1px solid var(--line);
  background:var(--bg);
}
.rowline{ border-bottom:1px solid var(--line); }

/* ---------- nav ---------- */
.nav{
  display:grid;
  grid-template-columns:1fr auto auto;
  align-items:stretch;
}
.nav .logo{
  display:flex; align-items:center; gap:0;
  font-family:'JetBrains Mono',monospace; font-weight:700; font-size:15px; letter-spacing:0.04em;
  padding:18px var(--pad);
}
.nav .logo .sq{ width:11px; height:11px; background:var(--tx); display:inline-block; }
.nav .logo .car{ color:var(--tx); margin-right:7px; }
.nav .logo .cursor{ display:inline-block; width:8px; height:15px; background:var(--tx); margin-left:3px; animation:awblink 1.1s steps(1) infinite; }
@keyframes awblink{ 50%{ opacity:0; } }
.nav .navlinks{
  display:flex; align-items:center; gap:26px;
  border-left:1px solid var(--line); padding:0 var(--pad);
}
.nav .navlinks a{
  font-family:'JetBrains Mono',monospace; font-size:11.5px; text-transform:uppercase;
  letter-spacing:0.04em; color:var(--mut); padding:6px 0; position:relative;
}
.nav .navlinks a:hover{ color:var(--tx); }
.nav .navlinks a.active{ color:var(--tx); }
.nav .navlinks a.active::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px; background:var(--tx);
}
.nav .navcta{
  display:flex; align-items:center;
  border-left:1px solid var(--line); padding:0 var(--pad);
  font-family:'JetBrains Mono',monospace; font-size:11.5px; text-transform:uppercase; letter-spacing:0.04em;
}
.nav .navcta a{ color:var(--tx); }
.nav .navcta a:hover{ color:var(--mut); }
.navtoggle{ display:none; }

/* ---------- page header ---------- */
.pagehead{ padding:64px var(--pad) 52px; border-bottom:1px solid var(--line); }
.pagehead .kick{ display:block; margin-bottom:26px; }
.pagehead h1{ font-size:58px; line-height:1.0; letter-spacing:-0.035em; max-width:18ch; }
.pagehead h1 .o{ color:var(--faint); }
.pagehead .lead{ color:var(--mut); font-size:17px; line-height:1.6; max-width:60ch; margin-top:26px; }

/* ---------- section bar ---------- */
.secbar{
  display:flex; justify-content:space-between; align-items:center;
  padding:16px var(--pad); border-bottom:1px solid var(--line);
}
.secbar.topline{ border-top:1px solid var(--line); }
.secbar h2{
  font-family:'JetBrains Mono',monospace; font-weight:600; font-size:13px;
  text-transform:uppercase; letter-spacing:0.06em;
}
.secbar .meta{ font-family:'JetBrains Mono',monospace; font-size:11px; text-transform:uppercase; color:var(--faint); letter-spacing:0.05em; }

/* ---------- stat row ---------- */
.statrow{ display:grid; grid-template-columns:repeat(4,1fr); }
.statrow .st{ padding:24px var(--pad); border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.statrow .st:last-child{ border-right:0; }
.statrow .st .n{ font-size:36px; font-weight:600; letter-spacing:-0.03em; }
.statrow .st .l{ font-family:'JetBrains Mono',monospace; font-size:11px; text-transform:uppercase; color:var(--faint); margin-top:5px; letter-spacing:0.04em; }

/* ---------- cell grid (services etc.) ---------- */
.cellgrid{ display:grid; grid-template-columns:repeat(3,1fr); }
.cell{
  padding:28px var(--pad) 30px; border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  min-height:172px; display:flex; flex-direction:column; transition:background .2s;
}
.cellgrid .cell:nth-child(3n){ border-right:0; }
.cell:hover{ background:var(--cell); }
.cell .id{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--faint); margin-bottom:auto; letter-spacing:0.04em; }
.cell .nm{ font-size:21px; font-weight:600; letter-spacing:-0.02em; margin:30px 0 8px; }
.cell .ds{ color:var(--mut); font-size:13.5px; line-height:1.55; }
.cell .tags{ font-family:'JetBrains Mono',monospace; font-size:10.5px; text-transform:uppercase; color:var(--faint); margin-top:14px; letter-spacing:0.04em; }

/* ---------- placeholder image ---------- */
.ph{
  background:repeating-linear-gradient(135deg, rgba(255,255,255,0.035) 0 9px, transparent 9px 18px);
  border:1px solid var(--line); display:flex; align-items:flex-end; padding:14px;
}
.ph span{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--faint); letter-spacing:0.03em; }

/* ---------- work cards ---------- */
.workgrid{ display:grid; grid-template-columns:repeat(3,1fr); }
.workgrid .wcell{ padding:26px var(--pad) 30px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .2s; }
.workgrid .wcell:nth-child(3n){ border-right:0; }
.workgrid .wcell:hover{ background:var(--cell); }
.wcell .ph{ height:158px; margin-bottom:18px; }
.wcell .wt{ font-size:22px; font-weight:600; letter-spacing:-0.02em; }
.wcell .wd{ color:var(--mut); font-size:13.5px; margin-top:5px; }
.wcell .wfoot{ display:flex; justify-content:space-between; align-items:baseline; margin-top:16px; border-top:1px solid var(--line2); padding-top:13px; }
.wcell .wtag{ font-family:'JetBrains Mono',monospace; font-size:10.5px; text-transform:uppercase; color:var(--faint); letter-spacing:0.04em; }
.wcell .wmetric{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--tx); }

/* ---------- two-column split ---------- */
.split{ display:grid; grid-template-columns:1.4fr 1fr; }
.split > .l{ border-right:1px solid var(--line); }
.split .pane{ padding:40px var(--pad); }

/* ---------- principles ---------- */
.prin{ display:grid; grid-template-columns:1fr 1fr; }
.prin .pc{ padding:32px var(--pad); border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.prin .pc:nth-child(2n){ border-right:0; }
.prin .pc .pn{ font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--faint); margin-bottom:18px; }
.prin .pc .pt{ font-size:20px; font-weight:600; letter-spacing:-0.02em; margin-bottom:9px; }
.prin .pc .pd{ color:var(--mut); font-size:14px; line-height:1.6; max-width:44ch; }

/* ---------- CTA band ---------- */
.cta{ display:grid; grid-template-columns:1.4fr 1fr; }
.cta .ctaL{ padding:60px var(--pad); border-right:1px solid var(--line); }
.cta .ctaL h2{ font-size:46px; letter-spacing:-0.03em; line-height:1.0; margin-bottom:14px; }
.cta .ctaL p{ color:var(--mut); font-size:15px; max-width:42ch; }
.cta .ctaR{ display:flex; flex-direction:column; justify-content:center; gap:12px; padding:40px var(--pad); }

/* ---------- buttons / links ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:'JetBrains Mono',monospace; font-size:12.5px; text-transform:uppercase; letter-spacing:0.04em;
  border:1px solid var(--line); padding:14px 18px; color:var(--tx); cursor:pointer; background:transparent;
  transition:background .18s, color .18s, border-color .18s; white-space:nowrap;
}
.btn:hover{ background:var(--tx); color:var(--bg); border-color:var(--tx); }
.btn.solid{ background:var(--tx); color:var(--bg); border-color:var(--tx); }
.btn.solid:hover{ background:transparent; color:var(--tx); }
.alink{ font-family:'JetBrains Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.04em; color:var(--mut); display:inline-flex; gap:7px; align-items:center; }
.alink:hover{ color:var(--tx); }
.alink .ar{ transition:transform .18s; }
.alink:hover .ar{ transform:translateX(3px); }

/* ---------- footer ---------- */
.foot{ border-top:1px solid var(--line); }
.foot .frow{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr; }
.foot .fcol{ padding:34px var(--pad); border-right:1px solid var(--line); }
.foot .fcol:last-child{ border-right:0; }
.foot .fcol .ft{ font-family:'JetBrains Mono',monospace; font-size:10.5px; text-transform:uppercase; color:var(--faint); letter-spacing:0.05em; margin-bottom:16px; }
.foot .fcol .brand{ display:flex; align-items:center; gap:0; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:15px; letter-spacing:0.04em; margin-bottom:14px; }
.foot .fcol .brand .sq{ width:11px; height:11px; background:var(--tx); }
.foot .fcol .brand .car{ color:var(--tx); margin-right:7px; }
.foot .fcol .brand .cursor{ display:inline-block; width:8px; height:14px; background:var(--tx); margin-left:3px; animation:awblink 1.1s steps(1) infinite; }
.foot .fcol .blurb{ color:var(--mut); font-size:13px; line-height:1.6; max-width:34ch; }
.foot .fcol ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.foot .fcol ul a{ color:var(--mut); font-size:13.5px; }
.foot .fcol ul a:hover{ color:var(--tx); }
.foot .fbar{ display:flex; justify-content:space-between; padding:16px var(--pad); border-top:1px solid var(--line); font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--faint); letter-spacing:0.04em; }

/* ---------- forms ---------- */
.field{ display:flex; flex-direction:column; gap:8px; }
.field label{ font-family:'JetBrains Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--faint); }
.field input, .field select, .field textarea{
  background:var(--cell); border:1px solid var(--line); color:var(--tx);
  font-family:'Archivo',sans-serif; font-size:15px; padding:13px 14px; border-radius:0;
  transition:border-color .18s, background .18s; width:100%;
}
.field textarea{ resize:vertical; min-height:130px; }
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--tx); background:var(--cell2); }
.field input::placeholder, .field textarea::placeholder{ color:var(--faint); }
.field.err input, .field.err select, .field.err textarea{ border-color:#c96; }
.field .msg{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:#c96; display:none; }
.field.err .msg{ display:block; }

/* ---------- utilities ---------- */
.muted{ color:var(--mut); }
.big{ font-size:40px; letter-spacing:-0.03em; line-height:1.05; }
.hidden{ display:none !important; }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:920px){
  .pagehead h1{ font-size:44px; }
  .split .l h1{ font-size:46px !important; }
  .cellgrid{ grid-template-columns:1fr 1fr; }
  .cellgrid .cell:nth-child(3n){ border-right:1px solid var(--line); }
  .cellgrid .cell:nth-child(2n){ border-right:0; }
  .workgrid{ grid-template-columns:1fr 1fr; }
  .workgrid .wcell:nth-child(3n){ border-right:1px solid var(--line); }
  .workgrid .wcell:nth-child(2n){ border-right:0; }
  .statrow{ grid-template-columns:1fr 1fr; }
  .statrow .st:nth-child(2n){ border-right:0; }
  .foot .frow{ grid-template-columns:1fr 1fr; }
  .foot .fcol:nth-child(2n){ border-right:0; }
}
@media (max-width:680px){
  body{ padding:8px; overflow-x:hidden; }
  :root{ --pad:18px; }
  .nav{ grid-template-columns:1fr auto; }
  .nav .navlinks{ display:none; position:absolute; }
  .nav .navcta{ display:none; }
  .navtoggle{
    display:flex; align-items:center; border-left:1px solid var(--line); padding:0 18px;
    font-family:'JetBrains Mono',monospace; font-size:11.5px; text-transform:uppercase; color:var(--tx); background:transparent; cursor:pointer; letter-spacing:0.04em;
  }
  .nav.open .navlinks{
    display:flex; position:static; flex-direction:column; align-items:flex-start; gap:0;
    grid-column:1 / -1; border-left:0; border-top:1px solid var(--line); padding:0;
  }
  .nav.open .navlinks a{ width:100%; padding:15px var(--pad); border-bottom:1px solid var(--line2); }
  .nav.open .navcta{ display:flex; grid-column:1 / -1; border-left:0; padding:0; }
  .nav.open .navcta a{ width:100%; padding:15px var(--pad); border-bottom:1px solid var(--line2); }
  .split .l.pane{ padding:36px var(--pad) 30px !important; }
  .split .l h1{ font-size:33px !important; line-height:1.06 !important; }
  .split .l p.muted{ font-size:15px !important; }
  .pagehead{ padding:44px var(--pad) 36px; }
  .pagehead h1{ font-size:36px; }
  .pagehead .lead{ font-size:15px; }
  .cellgrid{ grid-template-columns:1fr; }
  .cellgrid .cell:nth-child(n){ border-right:0; }
  .workgrid{ grid-template-columns:1fr; }
  .workgrid .wcell:nth-child(n){ border-right:0; }
  .statrow{ grid-template-columns:1fr 1fr; }
  .split{ grid-template-columns:1fr; }
  .split > .l{ border-right:0; border-bottom:1px solid var(--line); }
  .prin{ grid-template-columns:1fr; }
  .prin .pc:nth-child(n){ border-right:0; }
  .cta{ grid-template-columns:1fr; }
  .cta .ctaL{ border-right:0; border-bottom:1px solid var(--line); }
  .foot .frow{ grid-template-columns:1fr; }
  .foot .fcol:nth-child(n){ border-right:0; border-bottom:1px solid var(--line); }
  .big{ font-size:30px; }
  .pagehead h1{ max-width:none; }
}
@media (max-width:400px){
  .split .l h1{ font-size:29px !important; }
  .pagehead h1{ font-size:30px; }
  .statrow .st .n{ font-size:30px; }
  .cta .ctaL h2{ font-size:34px; }
}