:root{
  --bg:#070b0e;
  --panel:rgba(8,14,18,.78);
  --line:rgba(113,143,158,.42);
  --line-soft:rgba(113,143,158,.20);
  --text:#eef2f4;
  --muted:#9caab2;
  --accent:#59c6ff;
  --grid-small:rgba(90,114,126,.055);
  --grid-large:rgba(90,114,126,.09);
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{
  margin:0;
  min-width:320px;
  color:var(--text);
  font-family:"Space Mono","Consolas",monospace;
  background-color:var(--bg);
  background-image:
    linear-gradient(var(--grid-large) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid-large) 1px,transparent 1px),
    linear-gradient(var(--grid-small) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid-small) 1px,transparent 1px);
  background-size:64px 64px,64px 64px,16px 16px,16px 16px;
  background-position:-1px -1px;
}
a{color:inherit;text-decoration:none}
.page-frame{
  position:fixed;inset:26px;pointer-events:none;z-index:99;opacity:.9;
  background:
    linear-gradient(var(--muted),var(--muted)) left top/18px 1px no-repeat,
    linear-gradient(var(--muted),var(--muted)) left top/1px 18px no-repeat,
    linear-gradient(var(--muted),var(--muted)) right top/18px 1px no-repeat,
    linear-gradient(var(--muted),var(--muted)) right top/1px 18px no-repeat,
    linear-gradient(var(--muted),var(--muted)) left bottom/18px 1px no-repeat,
    linear-gradient(var(--muted),var(--muted)) left bottom/1px 18px no-repeat,
    linear-gradient(var(--muted),var(--muted)) right bottom/18px 1px no-repeat,
    linear-gradient(var(--muted),var(--muted)) right bottom/1px 18px no-repeat;
}
.shell{width:min(1120px,calc(100% - 72px));margin:0 auto;padding:34px 0 28px}
.topbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 0 22px}
.brand{font-family:"Michroma",sans-serif;font-size:22px;letter-spacing:.19em}
.back{font-size:11px;color:var(--accent)}
.hero{padding:58px 0 44px}
.eyebrow{color:var(--accent);font-size:12px;letter-spacing:.12em;margin-bottom:14px}
h1{font-family:"Michroma",sans-serif;font-size:clamp(34px,5vw,64px);font-weight:400;letter-spacing:.06em;margin:0;line-height:1.1}
.lead{max-width:940px;color:#aab6bd;font-size:14px;line-height:1.85;margin:22px 0 0}
.hero-contact{
  display:flex;
  width:max-content;
  margin:30px auto 0;
  align-items:center;
  justify-content:center;
  min-width:220px;
  padding:15px 28px;
  border:1px solid var(--accent);
  background:var(--accent);
  color:#071016;
  font-family:"Michroma",sans-serif;
  font-size:11px;
  font-weight:400;
  letter-spacing:.08em;
  box-shadow:0 0 28px rgba(89,198,255,.16);
  transition:.18s ease;
}
.hero-contact:hover{
  background:#8bd8ff;
  border-color:#8bd8ff;
  box-shadow:0 0 36px rgba(89,198,255,.28);
  transform:translateY(-1px);
}

.section-block{border:1px solid var(--line);background:var(--panel);margin-bottom:26px}
.section-title{display:grid;grid-template-columns:72px 1fr;border-bottom:1px solid var(--line-soft)}
.section-title>span{display:flex;align-items:center;justify-content:center;border-right:1px solid var(--line-soft);color:var(--accent);font-size:12px}
.section-title>div{padding:22px 26px 24px}
.section-title small{display:block;color:#728894;font-size:10px;letter-spacing:.12em;margin-bottom:7px}
.section-title h2{font-family:"Michroma",sans-serif;font-size:clamp(18px,2.4vw,27px);font-weight:400;letter-spacing:.045em;margin:0}

.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.service-grid article{padding:24px;min-height:210px;border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.service-grid article:nth-child(3n){border-right:0}
.service-grid b,.gaming-row b{display:block;color:var(--accent);font-size:10px;font-weight:400;letter-spacing:.08em;margin-bottom:18px}
.service-grid h3,.gaming-row h3{font-family:"Michroma",sans-serif;font-size:14px;font-weight:400;letter-spacing:.04em;margin:0 0 13px}
.service-grid p,.gaming-row p,.history-row p,.remote-row p,.approach-row p{color:#9eacb4;font-size:12px;line-height:1.8;margin:0}
.gaming-row{display:grid;grid-template-columns:210px 260px minmax(0,1fr);gap:24px;align-items:start;padding:24px;border-top:0}
.gaming-row b{margin:3px 0 0}
.gaming-row h3{margin:0}
strong{color:#e8eef1}

.history{padding:0 26px}
.history-row{display:grid;grid-template-columns:140px 1fr;gap:28px;padding:24px 0;border-bottom:1px solid var(--line-soft)}
.history-row:last-child{border-bottom:0}
.history-label{color:var(--accent);font-size:10px;letter-spacing:.08em;padding-top:3px}

.remote-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center;padding:28px 26px}
.cta{display:inline-flex;border:1px solid var(--accent);color:var(--accent);padding:14px 18px;font-size:11px;letter-spacing:.04em;white-space:nowrap;transition:.18s ease}
.cta:hover{background:rgba(89,198,255,.10);box-shadow:0 0 24px rgba(89,198,255,.10)}

.approach-row{display:grid;grid-template-columns:1.35fr 1fr;gap:0}
.approach-row>p{padding:26px}
.approach-row .highlight{border-left:1px solid var(--line-soft);color:#c7d1d6;position:relative;padding-left:30px}
.approach-row .highlight:before{content:"";position:absolute;left:-1px;top:26px;bottom:26px;width:2px;background:var(--accent)}

footer{border-top:1px solid var(--line-soft);margin-top:42px;padding-top:18px;display:flex;justify-content:space-between;color:#687a84;font-size:10px}

@media(max-width:900px){
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .service-grid article{border-right:1px solid var(--line-soft)!important;border-bottom:1px solid var(--line-soft)!important}
  .service-grid article:nth-child(2n){border-right:0!important}
  .gaming-row{grid-template-columns:1fr;gap:10px}
  .gaming-row b{margin:0 0 4px}
  .remote-row{grid-template-columns:1fr}
  .cta{justify-self:start}
}
@media(max-width:760px){
  .shell{width:calc(100% - 28px);padding-top:18px}.page-frame{inset:10px}.topbar{padding-bottom:16px}.brand{font-size:18px}.back{font-size:9px}.hero{padding:42px 0 30px}.lead{font-size:12px}
  .section-title{grid-template-columns:52px 1fr}.section-title>div{padding:19px 18px 21px}.hero-contact{width:100%;min-width:0}
  .service-grid{grid-template-columns:1fr}.service-grid article{min-height:0;border-right:0!important;border-bottom:1px solid var(--line-soft)!important}
  .gaming-row{padding:22px 20px;grid-template-columns:1fr;gap:8px}
  .history{padding:0 20px}.history-row{grid-template-columns:1fr;gap:8px;padding:20px 0}
  .remote-row{padding:22px 20px;gap:20px}.cta{width:100%;justify-content:center;white-space:normal;text-align:center}
  .approach-row{grid-template-columns:1fr}.approach-row>p{padding:22px 20px}.approach-row .highlight{border-left:0;border-top:1px solid var(--line-soft);padding-left:20px;padding-top:24px}.approach-row .highlight:before{left:20px;right:20px;top:-1px;bottom:auto;width:auto;height:2px}
  footer{gap:16px;flex-direction:column}
}
