:root{
  --bg:#071016;
  --bg-2:#0b1720;
  --surface:#0d1a23;
  --surface-2:#10232d;
  --line:rgba(255,255,255,.09);
  --text:#f5f7f8;
  --muted:#91a1ab;
  --cyan:#4ee1d3;
  --lime:#b7f35c;
  --orange:#ffab5c;
  --blue:#61a9ff;
  --violet:#b895ff;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(circle at 90% 8%,rgba(78,225,211,.08),transparent 24%),
    radial-gradient(circle at 10% 30%,rgba(97,169,255,.07),transparent 24%),
    var(--bg);
  color:var(--text);
  font-family:"Prompt",system-ui,-apple-system,sans-serif;
  min-height:100vh;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
.bg-grid{
  position:fixed; inset:0; z-index:-1; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:40px 40px;
  mask-image:linear-gradient(to bottom,black,transparent 75%);
}
.site-header{
  width:min(calc(100% - 32px),var(--max));
  margin:auto;
  height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{
  width:42px;height:42px;border-radius:13px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,var(--cyan),#7ef4a6);
  color:#071016;font-weight:800;font-size:22px;
  box-shadow:0 10px 32px rgba(78,225,211,.14);
}
.brand strong{display:block;font-size:19px;line-height:1}
.brand small{display:block;margin-top:5px;letter-spacing:.2em;color:var(--muted);font-size:9px}
.main-nav{display:flex;align-items:center;gap:30px;color:#b7c3ca;font-size:14px}
.main-nav a:hover{color:white}
.nav-cta{border:1px solid var(--line);padding:10px 17px;border-radius:999px;background:rgba(255,255,255,.03)}
.hero{
  width:min(calc(100% - 32px),var(--max));
  margin:44px auto 58px;
  min-height:560px;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:50px;
  align-items:center;
}
.eyebrow{font-size:12px;letter-spacing:.22em;color:var(--cyan);font-weight:600;margin-bottom:18px}
.hero h1{
  margin:0;
  max-width:820px;
  font-size:clamp(42px,6vw,82px);
  line-height:1.03;
  letter-spacing:-.04em;
  font-weight:650;
}
.hero h1 span{
  color:#9caab2;
  font-weight:400;
}
.hero p{
  max-width:720px;
  color:#9aa9b2;
  font-weight:300;
  line-height:1.9;
  font-size:17px;
  margin:28px 0 0;
}
.hero-actions{display:flex;gap:12px;margin-top:34px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:0 22px;border-radius:14px;
  border:1px solid var(--line);font-weight:500;
  transition:.25s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:var(--text);color:#071016;border-color:transparent}
.btn.ghost{background:rgba(255,255,255,.035);color:#dde5e8}
.hero-visual{
  position:relative;
  aspect-ratio:1;
  max-width:440px;
  width:100%;
  justify-self:end;
  display:grid;
  place-items:center;
}
.orbit{
  position:absolute;border:1px solid rgba(78,225,211,.24);border-radius:50%;
}
.orbit-1{width:75%;height:75%;animation:spin 18s linear infinite}
.orbit-2{width:98%;height:98%;border-color:rgba(255,255,255,.08);animation:spinReverse 28s linear infinite}
.orbit-1:before,.orbit-2:before{
  content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:var(--cyan);top:9%;left:18%;
  box-shadow:0 0 22px var(--cyan);
}
.orbit-2:before{background:var(--blue);top:auto;left:auto;bottom:14%;right:12%;box-shadow:0 0 22px var(--blue)}
.core-node{
  width:138px;height:138px;border-radius:35px;display:grid;place-items:center;
  background:linear-gradient(145deg,#132833,#0c1820);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 25px 80px rgba(0,0,0,.35),inset 0 0 40px rgba(78,225,211,.06);
}
.core-node span{font-size:60px;font-weight:700;line-height:.9}
.core-node small{font-size:9px;letter-spacing:.22em;color:var(--cyan);margin-top:-32px}
.mini-node{
  position:absolute;
  width:58px;height:58px;border-radius:18px;
  display:grid;place-items:center;
  background:#10212a;border:1px solid rgba(255,255,255,.1);
  font-size:11px;font-weight:600;letter-spacing:.07em;
  color:#c8d4d9;
}
.n1{top:10%;left:11%}.n2{right:4%;top:33%}.n3{bottom:3%;left:39%}.n4{left:0;bottom:26%}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes spinReverse{to{transform:rotate(-360deg)}}

.stats-strip{
  width:min(calc(100% - 32px),var(--max));
  margin:0 auto 110px;
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.stats-strip div{padding:24px 22px;border-right:1px solid var(--line)}
.stats-strip div:last-child{border-right:0}
.stats-strip strong{display:block;font-size:16px;margin-bottom:4px}
.stats-strip span{font-size:12px;color:var(--muted)}

.section{width:min(calc(100% - 32px),var(--max));margin:0 auto 120px}
.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px;gap:24px}
.section h2,.solar-copy h2,.about h2{margin:0;font-size:clamp(34px,5vw,60px);letter-spacing:-.035em;line-height:1.08}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.filter{
  border:1px solid var(--line);background:transparent;color:#9aaab2;
  padding:9px 14px;border-radius:999px;cursor:pointer;transition:.2s ease;
}
.filter.active,.filter:hover{background:#eef4f4;color:#071016;border-color:#eef4f4}

.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.project-card{
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.018));
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  transition:.28s ease;
}
.project-card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.18);box-shadow:0 24px 70px rgba(0,0,0,.25)}
.card-link{display:block;height:100%}
.no-link{cursor:default}
.thumb{
  position:relative;
  height:225px;
  display:grid;place-items:center;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.thumb:before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.045),transparent 55%);
}
.thumb svg{width:72%;height:72%;position:relative;z-index:2}
.thumb-label{position:absolute;left:18px;bottom:16px;font-size:10px;letter-spacing:.2em;color:rgba(255,255,255,.58)}
.thumb-core{color:var(--cyan);background:radial-gradient(circle at 50% 45%,rgba(78,225,211,.16),transparent 40%),#0c1820}
.thumb-car{color:#79b6ff;background:radial-gradient(circle at 55% 50%,rgba(97,169,255,.16),transparent 42%),#0c1721}
.thumb-aqua{color:#5fe4db;background:radial-gradient(circle at 55% 48%,rgba(47,213,199,.16),transparent 42%),#071c22}
.thumb-sentinel{color:#b7f35c;background:radial-gradient(circle at 50% 45%,rgba(183,243,92,.12),transparent 42%),#101b16}
.thumb-crew{color:#b895ff;background:radial-gradient(circle at 50% 45%,rgba(184,149,255,.14),transparent 42%),#171424}
.thumb-ai{color:#ffab5c;background:radial-gradient(circle at 50% 45%,rgba(255,171,92,.14),transparent 42%),#20160f}
.card-body{padding:20px 20px 23px}
.card-topline{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.tag{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#93a3ac}
.status{font-size:9px;letter-spacing:.12em;font-weight:600;padding:5px 8px;border-radius:99px}
.status.live{background:rgba(78,225,211,.1);color:var(--cyan)}
.status.build{background:rgba(97,169,255,.1);color:var(--blue)}
.status.lab{background:rgba(184,149,255,.1);color:var(--violet)}
.card-body h3{font-size:21px;margin:0 0 9px}
.card-body p{font-size:13px;line-height:1.75;color:#91a1aa;margin:0;min-height:92px}
.open-link{display:inline-flex;margin-top:20px;font-size:12px;color:#d8e2e5}
.open-link b{margin-left:6px;color:var(--cyan)}
.open-link.muted{color:#667781}
.project-card.hidden{display:none}

.solar-section{
  width:min(calc(100% - 32px),var(--max));
  margin:0 auto 120px;
  padding:56px;
  border-radius:32px;
  display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center;
  background:
    linear-gradient(130deg,rgba(255,171,92,.12),rgba(183,243,92,.055) 45%,rgba(78,225,211,.06)),
    #0e1819;
  border:1px solid rgba(255,255,255,.1);
  overflow:hidden;
}
.solar-art{position:relative;min-height:360px}
.sun{
  position:absolute;width:130px;height:130px;border-radius:50%;right:10%;top:0;
  background:radial-gradient(circle,#fff4c8 0 12%,#ffd978 30%,#ffad52 65%,rgba(255,173,82,.15) 72%,transparent 75%);
  filter:drop-shadow(0 0 35px rgba(255,171,92,.24));
}
.panel{
  position:absolute;width:235px;height:135px;border:4px solid #2d4f5a;border-radius:7px;
  background:
    linear-gradient(90deg,transparent 32%,rgba(255,255,255,.19) 33% 34%,transparent 35% 65%,rgba(255,255,255,.19) 66% 67%,transparent 68%),
    linear-gradient(transparent 48%,rgba(255,255,255,.17) 49% 51%,transparent 52%),
    linear-gradient(135deg,#153d58,#102b42);
  transform:skewY(-8deg) rotate(-4deg);
  box-shadow:0 24px 50px rgba(0,0,0,.25);
}
.panel-a{left:5%;bottom:20px}
.panel-b{left:30%;bottom:78px;transform:skewY(-8deg) rotate(-4deg) scale(.85);opacity:.9}
.panel-c{left:9%;bottom:155px;transform:skewY(-8deg) rotate(-4deg) scale(.68);opacity:.72}
.solar-copy p{color:#9ca9ad;line-height:1.85;font-size:15px;max-width:650px}
.solar-points{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:25px 0 30px;color:#cbd7d5;font-size:13px}
.solar-points span::first-letter{color:var(--lime)}
.solar-btn{background:linear-gradient(90deg,#f6d269,#f4a65b);color:#1a120a;border:0}

.about{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:end;padding-top:30px}
.about-text p{margin:0;color:#95a5ad;line-height:2;font-size:16px}

footer{
  width:min(calc(100% - 32px),var(--max));
  margin:0 auto 28px;
  border-top:1px solid var(--line);
  padding:32px 0 8px;
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:40px;
  align-items:center;
}
.footer-brand{display:flex;align-items:center;gap:13px}
.footer-brand strong{font-size:15px}
.footer-brand p{margin:2px 0 0;color:#74858e;font-size:11px}
.footer-contact span{display:block;color:#6f818a;font-size:9px;letter-spacing:.18em;margin-bottom:4px}
.footer-contact a{font-size:19px;font-weight:600}
.footer-copy{color:#6d7d85;font-size:11px}
.floating-call{
  display:none;position:fixed;right:18px;bottom:18px;width:54px;height:54px;border-radius:18px;
  place-items:center;background:var(--cyan);color:#071016;font-size:22px;font-weight:700;
  box-shadow:0 16px 40px rgba(0,0,0,.32);z-index:20;
}
@media(max-width:980px){
  .hero{grid-template-columns:1fr;min-height:auto;margin-top:52px}
  .hero-visual{justify-self:center;max-width:360px}
  .stats-strip{grid-template-columns:1fr 1fr}
  .stats-strip div:nth-child(2){border-right:0}
  .stats-strip div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .project-grid{grid-template-columns:1fr 1fr}
  .solar-section{grid-template-columns:1fr;padding:38px}
  .solar-art{min-height:310px}
}
@media(max-width:680px){
  .site-header{height:76px}
  .main-nav a:not(.nav-cta){display:none}
  .hero{margin-top:24px}
  .hero h1{font-size:46px}
  .hero p{font-size:14px}
  .hero-visual{max-width:290px}
  .stats-strip{margin-bottom:80px}
  .section{margin-bottom:82px}
  .section-head{align-items:flex-start;flex-direction:column}
  .project-grid{grid-template-columns:1fr}
  .thumb{height:210px}
  .card-body p{min-height:auto}
  .solar-section{padding:28px 22px;border-radius:24px}
  .solar-art{min-height:260px}
  .panel{width:190px;height:110px}
  .solar-points{grid-template-columns:1fr}
  .about{grid-template-columns:1fr;gap:24px}
  footer{grid-template-columns:1fr;gap:24px}
  .floating-call{display:grid}
}
