:root{
  --bg: #05080a;
  --panel: #0f1418;
  --panel-2: #141a1f;
  --border: rgba(255,255,255,0.08);
  --border-strong: rgba(255,255,255,0.14);
  --text: #f4f6f5;
  --muted: rgba(244,246,245,0.56);
  --muted-2: rgba(244,246,245,0.38);
  --mint: #34e0a1;
  --mint-dim: rgba(52,224,161,0.14);
  --amber: #ffb454;
  --amber-dim: rgba(255,180,84,0.14);
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;overflow-x:hidden;}
body{
  background:
    radial-gradient(ellipse 900px 500px at 15% -5%, rgba(52,224,161,0.10), transparent 60%),
    radial-gradient(ellipse 700px 500px at 100% 10%, rgba(255,180,84,0.06), transparent 55%),
    var(--bg);
  min-height:100vh;
}
.wrap{max-width:1240px;margin:0 auto;padding:0 40px;}

/* faint site-plan grid texture, nod to the physical build sites */
.grid-tex{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse 1000px 700px at 30% 10%, black, transparent 75%);
}

nav{
  position:relative; z-index:2;
  display:flex; align-items:center; justify-content:space-between;
  padding:26px 0;
}
.logo{display:flex; align-items:center; gap:10px; text-decoration:none;}
.logo-mark{
  width:30px; height:30px; border-radius:8px;
  display:block; flex-shrink:0;
  box-shadow:0 0 22px rgba(52,224,161,0.25);
}
.logo-text{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:19px; letter-spacing:-0.01em;}
.logo-text .graft{color:var(--text);}
.logo-text .lync{color:var(--mint);}
.badge{
  font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:500;
  letter-spacing:0.08em; color:var(--muted);
  border:1px solid var(--border-strong); border-radius:6px;
  padding:3px 7px; margin-left:2px;
}
.nav-links{display:flex; align-items:center; gap:36px;}
.nav-links a{color:var(--muted); text-decoration:none; font-size:14.5px; font-weight:500; transition:color .15s;}
.nav-links a:hover, .nav-links a.current{color:var(--text);}
.nav-cta{display:flex; align-items:center; gap:14px;}
.btn{
  font-family:'Inter',sans-serif; font-weight:600; font-size:14.5px;
  border-radius:9px; padding:10px 18px; cursor:pointer; border:none;
  display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  transition:transform .15s ease, box-shadow .15s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--mint); color:#04150e; box-shadow:0 0 0 rgba(52,224,161,0);}
.btn-primary:hover{box-shadow:0 6px 24px rgba(52,224,161,0.28);}
.btn-ghost{background:transparent; color:var(--text); border:1px solid var(--border-strong);}
.btn-ghost:hover{border-color:rgba(255,255,255,0.3);}
.btn-sm{padding:8px 14px; font-size:13.5px;}

main{position:relative; z-index:2;}

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'JetBrains Mono',monospace; font-size:11.5px; font-weight:500;
  letter-spacing:0.09em; color:var(--mint);
  background:var(--mint-dim); border:1px solid rgba(52,224,161,0.25);
  border-radius:100px; padding:6px 13px 6px 10px; margin-bottom:22px;
}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 8px var(--mint);}

h1{
  font-family:'Space Grotesk',sans-serif; font-weight:700;
  font-size:52px; line-height:1.06; letter-spacing:-0.02em;
  margin-bottom:22px;
}
h1 .accent, .accent{
  background:linear-gradient(100deg, var(--mint), #7fe8c4);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sub{
  font-size:16.5px; line-height:1.65; color:var(--muted); max-width:560px; margin-bottom:34px;
}
.cta-row{display:flex; align-items:center; gap:16px; margin-bottom:38px;}
.proof{display:flex; align-items:center; gap:22px; color:var(--muted-2); font-size:13px; flex-wrap:wrap;}
.proof-item{display:flex; align-items:center; gap:8px;}
.proof-item svg{width:15px;height:15px; stroke:var(--mint); flex-shrink:0;}

.page-header{padding:56px 0 20px;}
.page-header .eyebrow{margin-bottom:18px;}
.page-header h1{font-size:42px;}
.page-header .sub{margin-bottom:0;}

.strip{
  position:relative; z-index:2; border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  padding:26px 0; margin-bottom:6px;
}
.strip-inner{display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;}
.strip-label{font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:0.08em; color:var(--muted-2);}
.strip-stats{display:flex; gap:44px; flex-wrap:wrap;}
.stat{display:flex; flex-direction:column; gap:3px;}
.stat b{font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700;}
.stat span{font-size:12px; color:var(--muted-2);}

footer{position:relative; z-index:2; padding:40px 0 60px; margin-top:60px; border-top:1px solid var(--border);}
.footer-inner{display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.footer-inner .logo-text{font-size:15px;}
.footer-links{display:flex; gap:26px;}
.footer-links a{color:var(--muted); text-decoration:none; font-size:13.5px;}
.footer-links a:hover{color:var(--text);}
.footer-note{color:var(--muted-2); font-size:12.5px;}

@media (max-width:880px){
  .nav-links{display:none;}
  h1{font-size:38px;}
  .page-header h1{font-size:32px;}
  .strip-inner{justify-content:flex-start;}
  .footer-inner{flex-direction:column; align-items:flex-start;}
}