@import url('https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Syne:wght@400;600;700;800&display=swap');

:root {
  --bg: #080b0f;
  --surface: #0d1117;
  --card: #111820;
  --border: #1e2d3d;
  --accent: #00ff88;
  --accent2: #00c8ff;
  --text: #e8f0f8;
  --muted: #6a8099;
  --mono: 'Space Mono', monospace;
  --sans: 'Syne', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  overflow-x: hidden;
  ;
}

/* Grid background */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(rgba(0,255,136,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,255,136,0.03) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
  z-index: 0;
}

/* Cursor */
.cursor { width:12px; height:12px; background:var(--accent); border-radius:50%; position:fixed; pointer-events:none; z-index:9999; transition:transform 0.1s; mix-blend-mode:screen; }
.cursor-ring { width:36px; height:36px; border:1px solid var(--accent); border-radius:50%; position:fixed; pointer-events:none; z-index:9998; transition:all 0.15s; opacity:0.5; }

/* NAV */
nav {
  position: fixed; top:0; left:0; right:0; z-index:100;
  padding: 20px 60px;
  display: flex; justify-content:space-between; align-items:center;
  background: rgba(8,11,15,0.9);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
.nav-logo { font-family:var(--mono); font-size:18px; color:var(--accent); text-decoration:none; letter-spacing:2px; }
.nav-logo span { color:var(--text); }
.nav-links { display:flex; gap:36px; list-style:none; }
.nav-links a { font-family:var(--mono); font-size:12px; color:var(--muted); text-decoration:none; letter-spacing:2px; text-transform:uppercase; transition:color 0.2s; }
.nav-links a:hover, .nav-links a.active { color:var(--accent); }
.nav-cta { font-family:var(--mono); font-size:12px; color:var(--bg); background:var(--accent); padding:10px 24px; text-decoration:none; letter-spacing:1px; text-transform:uppercase; transition:all 0.2s; clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); }
.nav-cta:hover { background:var(--accent2); }

/* PAGE HERO */
.page-hero {
  padding: 160px 60px 80px;
  position: relative; z-index:1;
  border-bottom: 1px solid var(--border);
}
.page-hero-tag { font-family:var(--mono); font-size:11px; color:var(--accent); letter-spacing:4px; text-transform:uppercase; margin-bottom:20px; display:flex; align-items:center; gap:12px; }
.page-hero-tag::before { content:''; display:block; width:30px; height:1px; background:var(--accent); }
.page-hero h1 { font-size:clamp(40px,6vw,80px); font-weight:800; letter-spacing:-2px; line-height:1.0; }
.page-hero h1 .accent { color:var(--accent); }
.page-hero p { font-size:18px; color:var(--muted); max-width:560px; line-height:1.7; margin-top:24px; }

/* SECTION */
.section { padding:100px 60px; position:relative; z-index:1; }
.section-alt { background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.section-label { font-family:var(--mono); font-size:11px; color:var(--accent); letter-spacing:4px; text-transform:uppercase; margin-bottom:16px; display:flex; align-items:center; gap:12px; }
.section-label::before { content:''; display:block; width:30px; height:1px; background:var(--accent); }
.section-title { font-size:clamp(28px,4vw,48px); font-weight:800; letter-spacing:-1px; margin-bottom:56px; line-height:1.1; }

/* BUTTONS */
.btn-primary { font-family:var(--mono); font-size:13px; color:var(--bg); background:var(--accent); padding:16px 36px; text-decoration:none; letter-spacing:1px; text-transform:uppercase; transition:all 0.2s; clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%); display:inline-block; }
.btn-primary:hover { background:var(--accent2); transform:translateY(-2px); }
.btn-outline { font-family:var(--mono); font-size:13px; color:var(--accent); border:1px solid rgba(0,255,136,0.4); padding:16px 36px; text-decoration:none; letter-spacing:1px; text-transform:uppercase; transition:all 0.2s; display:inline-block; }
.btn-outline:hover { background:rgba(0,255,136,0.08); border-color:var(--accent); }

/* CARDS */
.card { background:var(--card); border:1px solid var(--border); padding:40px; transition:all 0.3s; position:relative; overflow:hidden; }
.card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(0,255,136,0.05) 0%,transparent 60%); opacity:0; transition:opacity 0.3s; }
.card:hover::before { opacity:1; }
.card:hover { border-color:rgba(0,255,136,0.3); transform:translateY(-4px); }

/* GRID LAYOUTS */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.grid-auto { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2px; }

/* REVEAL */
.reveal { opacity:0; transform:translateY(32px); transition:all 0.7s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* TICKER */
.ticker { background:var(--accent); padding:12px 0; overflow:hidden; }
.ticker-inner { display:flex; white-space:nowrap; animation:ticker 20s linear infinite; }
.ticker-item { font-family:var(--mono); font-size:12px; color:var(--bg); letter-spacing:3px; text-transform:uppercase; padding:0 40px; }
.ticker-item::before { content:'✦ '; }

/* FOOTER */
footer { border-top:1px solid var(--border); padding:48px 60px; display:flex; justify-content:space-between; align-items:center; position:relative; z-index:1; }
.footer-logo { font-family:var(--mono); font-size:16px; color:var(--accent); letter-spacing:2px; }
.footer-copy { font-family:var(--mono); font-size:12px; color:var(--muted); letter-spacing:1px; }
.footer-links { display:flex; gap:32px; list-style:none; }
.footer-links a { font-family:var(--mono); font-size:11px; color:var(--muted); text-decoration:none; letter-spacing:2px; text-transform:uppercase; transition:color 0.2s; }
.footer-links a:hover { color:var(--accent); }

/* ANIMATIONS */
@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
@keyframes ticker { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }
@keyframes spin { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
.blink { animation:blink 1s step-end infinite; }

/* MOBILE */
@media(max-width:768px){
  nav{padding:16px 24px;}
  .nav-links,.nav-cta{display:none;}
  .page-hero{padding:120px 24px 60px;}
  .section{padding:60px 24px;}
  .grid-2,.grid-3{grid-template-columns:1fr;}
  footer{padding:32px 24px;flex-direction:column;gap:16px;text-align:center;}
  .footer-links{display:none;}
}

/* SHARED CURSOR SCRIPT STYLES */
a,button,.card{cursor:none;}