
:root{
  --black:#030505;
  --panel:#0b0f10;
  --panel2:#111819;
  --line:rgba(255,255,255,.12);
  --text:#f3f6f4;
  --muted:rgba(243,246,244,.68);
  --lime:#b7ff55;
  --green:#44ff99;
  --ice:#79ddff;
  --danger:#ff6b6b;
  --shadow:0 26px 80px rgba(0,0,0,.55);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color:var(--text);
  background:var(--black);
  min-height:100vh;
  overflow-x:hidden;
}
body:before{
  content:"";
  position:fixed; inset:0;
  background:radial-gradient(circle at 50% 8%, rgba(121,221,255,.10), transparent 28%),
             radial-gradient(circle at 88% 88%, rgba(183,255,85,.07), transparent 24%),
             linear-gradient(180deg, rgba(255,255,255,.025), transparent 32%);
  z-index:-4;
}
.background-art{
  position:fixed; inset:0; pointer-events:none; z-index:-3; opacity:.72;
}
.home .background-art{
  background:
    repeating-radial-gradient(circle at 72% 34%, rgba(121,221,255,.11) 0 1px, transparent 1px 90px),
    radial-gradient(circle at 72% 34%, rgba(183,255,85,.16), transparent 6%, transparent 18%, rgba(121,221,255,.06) 19%, transparent 20%),
    conic-gradient(from 120deg at 72% 34%, transparent 0 70deg, rgba(183,255,85,.15) 72deg, transparent 78deg 360deg);
}
.opportunity .background-art{
  background:
    radial-gradient(circle at 17% 23%, rgba(183,255,85,.18), transparent 3%),
    radial-gradient(circle at 38% 62%, rgba(121,221,255,.16), transparent 4%),
    radial-gradient(circle at 76% 30%, rgba(183,255,85,.12), transparent 5%),
    linear-gradient(32deg, transparent 0 48%, rgba(255,255,255,.055) 48.2%, transparent 48.5% 100%),
    linear-gradient(126deg, transparent 0 34%, rgba(121,221,255,.05) 34.2%, transparent 34.5% 100%);
}
.conditions .background-art{
  background:
    radial-gradient(circle at 50% 38%, transparent 0 10%, rgba(121,221,255,.12) 10.3%, transparent 10.8% 20%, rgba(183,255,85,.10) 20.2%, transparent 20.7% 31%, rgba(255,255,255,.045) 31.2%, transparent 31.7%),
    radial-gradient(circle at 50% 38%, rgba(183,255,85,.10), transparent 6%);
}
.architecture .background-art{
  background-image:
    linear-gradient(rgba(121,221,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(121,221,255,.06) 1px, transparent 1px),
    linear-gradient(45deg, transparent 0 49.8%, rgba(183,255,85,.06) 50%, transparent 50.2% 100%);
  background-size:64px 64px,64px 64px,220px 220px;
}
.modernization .background-art{
  background:
    linear-gradient(120deg, rgba(183,255,85,.10), transparent 26%),
    radial-gradient(circle at 75% 28%, rgba(121,221,255,.12), transparent 22%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 26px);
}
.insights .background-art{
  background:
    repeating-linear-gradient(0deg, transparent 0 28px, rgba(121,221,255,.05) 28px 29px),
    radial-gradient(circle at 15% 18%, rgba(121,221,255,.15), transparent 20%),
    radial-gradient(circle at 84% 76%, rgba(183,255,85,.10), transparent 24%);
}
.about .background-art{
  background:
    radial-gradient(circle at 22% 34%, rgba(183,255,85,.12), transparent 8%),
    radial-gradient(circle at 68% 26%, rgba(121,221,255,.12), transparent 9%),
    radial-gradient(circle at 52% 74%, rgba(183,255,85,.10), transparent 11%),
    linear-gradient(115deg, transparent 0 23%, rgba(255,255,255,.045) 23.2%, transparent 23.6% 71%, rgba(255,255,255,.035) 71.2%, transparent 71.7%);
}
.contact .background-art{
  background:
    radial-gradient(circle at 50% 35%, rgba(183,255,85,.20), transparent 9%),
    radial-gradient(circle at 50% 35%, transparent 0 18%, rgba(121,221,255,.10) 18.2%, transparent 18.8% 31%, rgba(183,255,85,.08) 31.2%, transparent 31.8%),
    linear-gradient(180deg, transparent, rgba(0,0,0,.4));
}
.site-header{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:18px clamp(18px,4vw,56px);
  backdrop-filter:blur(18px);
  background:rgba(3,5,5,.78);
  border-bottom:1px solid var(--line);
}
.brand img{height:58px; max-width:190px; object-fit:contain; display:block}
.nav{display:flex; gap:4px; flex-wrap:wrap; justify-content:flex-end}
.nav a{
  color:rgba(255,255,255,.72); text-decoration:none; font-size:13px; letter-spacing:.08em;
  text-transform:uppercase; padding:10px 12px; border-radius:999px; border:1px solid transparent;
}
.nav a:hover,.nav a.active{color:var(--text); border-color:rgba(183,255,85,.32); background:rgba(183,255,85,.08)}
.menu-toggle{display:none;background:transparent;color:var(--text);border:1px solid var(--line);border-radius:999px;padding:9px 14px;text-transform:uppercase;letter-spacing:.08em}
.hero{
  min-height:78vh; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);
  align-items:center; gap:42px; padding:clamp(62px,8vw,120px) clamp(20px,5vw,72px) 72px;
}
.hero-copy{max-width:1050px}
.eyebrow{
  margin:0 0 16px; color:var(--lime); text-transform:uppercase; letter-spacing:.18em; font-weight:800; font-size:12px;
}
h1,h2,h3,p{margin-top:0}
h1{
  font-size:clamp(4rem,10vw,10.8rem);
  line-height:.86; letter-spacing:-.09em; margin-bottom:28px;
  max-width:1120px;
}
.lead{
  font-size:clamp(1.18rem,2.4vw,2rem); line-height:1.28; color:rgba(255,255,255,.83); max-width:960px;
}
.hero-visual{
  min-height:420px; position:relative; border:1px solid var(--line); border-radius:34px;
  background:linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  box-shadow:var(--shadow); overflow:hidden;
}
.visual-ring,.visual-core,.visual-scan{position:absolute; inset:50%; transform:translate(-50%,-50%)}
.visual-ring{
  width:340px;height:340px;border-radius:50%;
  border:1px solid rgba(121,221,255,.35);
  box-shadow:0 0 0 70px rgba(121,221,255,.035),0 0 0 140px rgba(121,221,255,.02);
}
.visual-core{width:16px;height:16px;border-radius:50%;background:var(--lime);box-shadow:0 0 32px var(--lime)}
.visual-scan{
  width:340px;height:340px;border-radius:50%;
  background:conic-gradient(from 15deg, rgba(183,255,85,.33), transparent 54deg 360deg);
  animation:spin 7s linear infinite;
}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.split,.principles,.matrix,.briefings,.cta-panel,.field,.condition-system,.rules,.blueprint,.contact-card,.quote-block{
  margin:0 clamp(20px,5vw,72px) clamp(44px,7vw,90px);
}
.split{
  display:grid; grid-template-columns:.8fr 1.2fr; gap:48px; padding:52px;
  background:rgba(10,15,16,.72); border:1px solid var(--line); border-radius:34px; box-shadow:var(--shadow);
}
.split h2,.field h2,.cta-panel h2,.quote-block h2{font-size:clamp(2.1rem,5vw,5.4rem);line-height:.96;letter-spacing:-.06em;margin:0}
.copy p{color:var(--muted);font-size:1.1rem;line-height:1.65}
.three,.matrix,.briefings,.blueprint{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.principles article,.matrix article,.briefings article,.bp-card{
  background:linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  border:1px solid var(--line); border-radius:28px; padding:30px; min-height:220px;
}
.principles span{color:var(--ice);font-weight:900;letter-spacing:.15em}
article h3,.bp-card h3{font-size:1.35rem;margin:18px 0 12px}
article p,.bp-card p,.cta-panel p,.quote-block p,.contact-card p{color:var(--muted);line-height:1.6}
.field{padding:50px;border-radius:36px;border:1px solid var(--line);background:rgba(5,8,8,.75);box-shadow:var(--shadow)}
.field-head{max-width:840px;margin-bottom:32px}
.signal-board{height:360px;border:1px solid rgba(121,221,255,.2);border-radius:30px;position:relative;overflow:hidden;background:radial-gradient(circle at center, rgba(121,221,255,.06), transparent 40%)}
.signal-board svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:rgba(121,221,255,.22);stroke-width:2}
.node{position:absolute;width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.35)}
.node.hot{background:var(--lime);box-shadow:0 0 22px var(--lime)}
.n1{left:9%;top:74%}.n2{left:22%;top:24%}.n3{left:37%;top:57%}.n4{left:49%;top:21%}.n5{left:64%;top:69%}.n6{left:78%;top:29%}.n7{left:86%;top:78%}.n8{left:72%;top:42%}
.opportunity-lock{position:absolute;right:28px;bottom:24px;color:var(--lime);font-weight:900;letter-spacing:.18em;border:1px solid rgba(183,255,85,.3);padding:12px 16px;border-radius:999px;background:rgba(183,255,85,.08)}
.cta-panel,.quote-block,.contact-card{
  padding:52px;border:1px solid rgba(183,255,85,.25);border-radius:34px;background:linear-gradient(135deg, rgba(183,255,85,.10), rgba(121,221,255,.04));box-shadow:var(--shadow)
}
.button{
  display:inline-flex;margin-top:18px;color:#031006;background:var(--lime);text-decoration:none;font-weight:900;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:15px 20px
}
.condition-system{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:center}
.orbit{
  height:520px;border-radius:50%;border:1px solid rgba(121,221,255,.25);position:relative;background:radial-gradient(circle, rgba(183,255,85,.08), transparent 52%);box-shadow:var(--shadow)
}
.orbit strong{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:var(--lime);letter-spacing:.15em}
.orbit span{position:absolute;border:1px solid var(--line);border-radius:999px;padding:10px 14px;background:rgba(0,0,0,.5);color:rgba(255,255,255,.8)}
.orbit span:nth-child(1){left:43%;top:5%}.orbit span:nth-child(2){right:5%;top:30%}.orbit span:nth-child(3){right:18%;bottom:12%}.orbit span:nth-child(4){left:16%;bottom:10%}.orbit span:nth-child(5){left:4%;top:35%}.orbit span:nth-child(6){left:38%;bottom:1%}
.blueprint{grid-template-columns:repeat(2,minmax(0,1fr))}
.contact-card{display:grid;grid-template-columns:.85fr 1.15fr;gap:38px;align-items:center}
.footer{display:flex;justify-content:space-between;gap:20px;padding:32px clamp(20px,5vw,72px);border-top:1px solid var(--line);color:rgba(255,255,255,.55);font-size:13px}
@media(max-width:900px){
  .site-header{align-items:flex-start}
  .brand img{height:46px}
  .menu-toggle{display:block}
  .nav{display:none;width:100%;padding-top:12px}
  .nav.open{display:flex;flex-direction:column}
  .site-header{flex-wrap:wrap}
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:44px}
  .hero-visual{min-height:300px}
  h1{font-size:clamp(3.2rem,16vw,6.4rem)}
  .split,.condition-system,.contact-card{grid-template-columns:1fr;padding:28px}
  .three,.matrix,.briefings,.blueprint{grid-template-columns:1fr}
  .principles article,.matrix article,.briefings article,.bp-card{min-height:auto}
  .orbit{height:340px}
  .footer{flex-direction:column}
}
