:root{
  --void: #0A0A13;
  --void-2: #0E0E1A;
  --glass: rgba(255,255,255,0.045);
  --glass-hover: rgba(255,255,255,0.075);
  --glass-border: rgba(255,255,255,0.10);
  --violet: #8B5CFF;
  --magenta: #FF5FA8;
  --cyan: #46E0FF;
  --green: #6EE7A8;
  --text: #F3F1FA;
  --muted: #A9A6C2;
  --faint: #6E6A8C;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--void);
  color:var(--text);
  font-family:'Inter', sans-serif;
  line-height:1.5;
  overflow-x:hidden;
  position:relative;
}
h1,h2,h3{font-family:'Space Grotesk', sans-serif; letter-spacing:-0.02em; font-weight:600;}
.mono{font-family:'IBM Plex Mono', monospace; letter-spacing:0.02em;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
.gradient-text{
  background:linear-gradient(100deg, var(--violet) 0%, var(--magenta) 50%, var(--cyan) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ---------- aurora background ---------- */
.aurora-field{position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none;}
.aurora-blob{position:absolute; border-radius:50%; filter:blur(90px); opacity:0.55; will-change:transform;}
.aurora-blob.b1{width:560px; height:560px; top:-140px; left:-80px; background:radial-gradient(circle, var(--violet), transparent 70%); animation:drift1 26s ease-in-out infinite alternate;}
.aurora-blob.b2{width:620px; height:620px; top:10%; right:-160px; background:radial-gradient(circle, var(--magenta), transparent 70%); animation:drift2 32s ease-in-out infinite alternate;}
.aurora-blob.b3{width:520px; height:520px; bottom:-180px; left:20%; background:radial-gradient(circle, var(--cyan), transparent 70%); animation:drift3 28s ease-in-out infinite alternate;}
@keyframes drift1{ from{transform:translate(0,0) scale(1);} to{transform:translate(60px,80px) scale(1.15);} }
@keyframes drift2{ from{transform:translate(0,0) scale(1);} to{transform:translate(-70px,50px) scale(0.9);} }
@keyframes drift3{ from{transform:translate(0,0) scale(1);} to{transform:translate(40px,-60px) scale(1.1);} }
.noise-veil{position:fixed; inset:0; z-index:-1; background:var(--void); opacity:0.35; mix-blend-mode:normal;}

/* ---------- glass utility ---------- */
.glass{
  background:var(--glass);
  border:1px solid var(--glass-border);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-radius:20px;
}

/* ---------- nav ---------- */
nav{position:fixed; top:18px; left:0; right:0; z-index:100; display:flex; justify-content:center; padding:0 20px;}
.nav-inner{
  width:100%; max-width:1100px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(20,18,32,0.55);
  border:1px solid var(--glass-border);
  backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px);
  border-radius:999px;
  box-shadow:0 8px 30px rgba(0,0,0,0.25);
}
.logo{display:flex; align-items:center; gap:9px; font-size:16px; font-weight:700; letter-spacing:0.01em;}
.logo-icon{width:22px; height:22px; display:block;}
.nav-links{display:flex; gap:30px; font-size:14px; color:var(--muted);}
.nav-links a:hover{color:var(--text);}
.nav-cta{
  font-size:13.5px; padding:9px 20px; border-radius:999px; color:#0A0A13; font-weight:600;
  background:linear-gradient(100deg, var(--violet), var(--magenta));
}
.nav-cta:hover{filter:brightness(1.08);}
@media (max-width:760px){ .nav-links{display:none;} }

/* ---------- hero ---------- */
.hero{position:relative; padding:180px 32px 90px; min-height:100vh; display:flex; align-items:center;}
.hero.hero-compact{min-height:auto; padding:170px 32px 90px;}
.hero-content{position:relative; z-index:2; max-width:660px;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--text);
  border:1px solid var(--glass-border); background:var(--glass);
  backdrop-filter:blur(14px);
  padding:7px 14px; border-radius:999px; margin-bottom:28px;
}
.eyebrow::before{content:'●'; font-size:8px; color:var(--cyan); animation:blink 2s infinite;}
@keyframes blink{ 0%,100%{opacity:1;} 50%{opacity:0.25;} }
.hero h1{font-size:clamp(40px, 5.6vw, 66px); line-height:1.05; margin-bottom:24px;}
.hero p.sub{font-size:17.5px; color:var(--muted); max-width:500px; margin-bottom:40px;}
.hero-actions{display:flex; gap:14px; align-items:center; margin-bottom:56px; flex-wrap:wrap;}
.btn-primary{
  background:linear-gradient(100deg, var(--violet), var(--magenta));
  color:#0A0A13; font-weight:600; font-size:14.5px; padding:14px 26px; border-radius:999px;
  transition:transform 0.15s ease, box-shadow 0.15s ease; display:inline-block; border:none; cursor:pointer;
  font-family:'Inter', sans-serif;
}
.btn-primary:hover{box-shadow:0 0 30px rgba(255,95,168,0.35); transform:translateY(-1px);}
.btn-ghost{
  font-size:14.5px; color:var(--text); padding:13px 24px; border-radius:999px;
  border:1px solid var(--glass-border); background:var(--glass); backdrop-filter:blur(14px); display:inline-block;
}
.btn-ghost:hover{border-color:rgba(255,255,255,0.22);}

.coverage{
  display:flex; gap:0; flex-wrap:wrap; padding:22px 26px;
  max-width:600px;
}
.hub{padding-right:26px; margin-right:26px; border-right:1px solid var(--glass-border);}
.hub:last-child{border-right:none; margin-right:0; padding-right:0;}
.hub-name{font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--faint); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:6px; display:flex; align-items:center; gap:6px;}
.hub-dot{width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 6px 1px rgba(110,231,168,0.6);}
.hub-time{font-family:'IBM Plex Mono', monospace; font-size:18px; color:var(--text);}

/* ---------- section shared ---------- */
section{padding:110px 32px; position:relative;}
.section-head{max-width:620px; margin-bottom:56px;}
.section-tag{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--cyan); margin-bottom:16px; display:block;}
.section-head h2{font-size:clamp(28px,3.4vw,40px); margin-bottom:16px;}
.section-head p{color:var(--muted); font-size:16px; max-width:520px;}

/* ---------- bento services grid ---------- */
.bento{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:170px; gap:16px;}
.bento-card{
  grid-column:span 1; padding:28px; display:flex; flex-direction:column; justify-content:flex-end;
  transition:background 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
  position:relative; overflow:hidden;
}
.bento-card:hover{background:var(--glass-hover); transform:translateY(-3px); border-color:rgba(255,255,255,0.18);}
.bento-card.span-2{grid-column:span 2;}
.cap-icon{
  width:36px; height:36px; margin-bottom:auto; border-radius:10px;
  background:linear-gradient(135deg, rgba(139,92,255,0.25), rgba(255,95,168,0.2));
  border:1px solid var(--glass-border);
  display:flex; align-items:center; justify-content:center; color:var(--text); font-size:15px;
}
.bento-card h3{font-size:17px; margin-bottom:8px; line-height:1.25;}
.bento-card p{color:var(--muted); font-size:13.5px;}
@media (max-width:980px){ .bento{grid-template-columns:repeat(2,1fr); grid-auto-rows:auto;} .bento-card.span-2{grid-column:span 2;} .bento-card{min-height:170px;} }
@media (max-width:600px){ .bento{grid-template-columns:1fr;} .bento-card.span-2{grid-column:span 1;} }

/* ---------- groups ---------- */
.group-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.group-card{padding:32px 28px;}
.group-eyebrow{
  display:inline-block; font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--void);
  background:linear-gradient(100deg, var(--cyan), var(--violet));
  text-transform:uppercase; letter-spacing:0.08em; margin-bottom:16px; padding:4px 10px; border-radius:999px; font-weight:600;
}
.group-card h3{font-size:20px; margin-bottom:14px;}
.group-card ul{list-style:none;}
.group-card li{color:var(--muted); font-size:14px; padding:9px 0; border-top:1px solid var(--glass-border);}
.group-card li:first-child{border-top:none;}
@media (max-width:860px){ .group-grid{grid-template-columns:1fr;} }

/* ---------- proof ---------- */
.proof{padding:52px 32px; text-align:center;}
.proof p{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--faint); letter-spacing:0.08em; text-transform:uppercase; margin-bottom:30px;}
.proof-logos{display:flex; justify-content:center; gap:56px; flex-wrap:wrap; color:var(--faint); font-size:15px; font-weight:600; letter-spacing:0.03em;}

/* ---------- cta ---------- */
.cta-section{text-align:center; padding:130px 32px;}
.cta-card{max-width:720px; margin:0 auto; padding:70px 50px;}
.cta-section h2{font-size:clamp(30px,4vw,46px); margin-bottom:20px;}
.cta-section p{color:var(--muted); margin-bottom:38px; font-size:16px;}

/* ---------- footer ---------- */
footer{padding:80px 32px 40px; max-width:1180px; margin:0 auto;}
.footer-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:44px; margin-bottom:56px;}
.footer-brand .logo{margin-bottom:16px;}
.footer-brand p{color:var(--muted); font-size:14px; max-width:280px; line-height:1.6;}
.footer-heading{font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--cyan); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:18px;}
.footer-col ul{list-style:none;}
.footer-col li{margin-bottom:11px; font-size:14px; color:var(--muted); line-height:1.5;}
.footer-col a{color:var(--muted); font-size:14px;}
.footer-col a:hover{color:var(--text);}
.footer-subhead{font-size:14.5px; color:var(--text); font-weight:600; margin-bottom:12px;}
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  padding-top:28px; border-top:1px solid var(--glass-border);
}
.footer-bottom .mono{color:var(--faint); font-size:12.5px;}
@media (max-width:860px){ .footer-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .footer-grid{grid-template-columns:1fr;} }

/* ---------- contact page ---------- */
.contact-section{padding:60px 32px 130px;}
.contact-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:16px;}
.contact-form-panel, .contact-info-panel{padding:40px;}
.field{margin-bottom:22px;}
.field label{display:block; font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--faint); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:9px;}
.field input, .field select, .field textarea{
  width:100%; background:rgba(255,255,255,0.03); border:1px solid var(--glass-border); color:var(--text);
  padding:12px 14px; border-radius:10px; font-family:'Inter', sans-serif; font-size:14.5px;
}
.field select{appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23A9A6C2'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center;}
.field textarea{resize:vertical; min-height:120px; font-family:'Inter', sans-serif;}
.field input:focus, .field select:focus, .field textarea:focus{outline:none; border-color:var(--violet); box-shadow:0 0 0 3px rgba(139,92,255,0.18);}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.form-note{font-size:12.5px; color:var(--faint); margin-top:4px;}

.info-block{margin-bottom:32px;}
.info-block:last-child{margin-bottom:0;}
.info-label{font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--cyan); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:10px;}
.info-value{font-size:16.5px; margin-bottom:4px;}
.info-sub{color:var(--muted); font-size:13.5px;}
.info-divider{border-top:1px solid var(--glass-border); margin:32px 0;}

.form-success{
  display:none; background:rgba(110,231,168,0.1); border:1px solid rgba(110,231,168,0.35);
  color:var(--green); padding:14px 16px; border-radius:12px; font-size:14px; margin-bottom:22px;
  font-family:'IBM Plex Mono', monospace;
}
.form-success.visible{display:block;}

@media (max-width:900px){ .contact-grid{grid-template-columns:1fr;} .field-row{grid-template-columns:1fr;} }

@media (prefers-reduced-motion: reduce){ * { animation:none !important; transition:none !important; } }
:focus-visible{outline:2px solid var(--cyan); outline-offset:2px;}
