@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

:root {
  --bg:      #050507;
  --bg2:     #0a0a0f;
  --card:    #0f0f18;
  --border:  rgba(255,255,255,0.07);
  --accent:  #7c3aed;
  --accent2: #06b6d4;
  --green:   #4ade80;
  --text:    #f1f5f9;
  --muted:   #475569;
  --muted2:  #64748b;
  --r:       16px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: 'Inter', sans-serif;
  overflow-x: hidden;
  cursor: none;
  line-height: 1.6;
}
body::before {
  content:''; position:fixed; inset:0; z-index:1000; pointer-events:none;
  opacity:.025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 128px;
}

/* CURSOR */
#cursor { position:fixed; z-index:9999; pointer-events:none; width:10px; height:10px; background:var(--accent); border-radius:50%; transform:translate(-50%,-50%); transition:width .3s,height .3s,background .3s; }
#cursor-ring { position:fixed; z-index:9998; pointer-events:none; width:34px; height:34px; border:1.5px solid rgba(124,58,237,.45); border-radius:50%; transform:translate(-50%,-50%); transition:width .3s,height .3s,opacity .3s; }

/* NAV */
nav.main-nav {
  position:fixed; top:0; left:0; right:0; z-index:500;
  height:68px; padding:0 5vw;
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(5,5,7,.75); backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
}
.nav-logo { font-size:.9rem; font-weight:800; text-decoration:none; color:var(--text); display:flex; align-items:center; gap:.6rem; }
.nav-logo-dot { width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 10px var(--accent); animation:pdot 2s infinite; flex-shrink:0; }
@keyframes pdot { 0%,100%{box-shadow:0 0 8px var(--accent)} 50%{box-shadow:0 0 22px var(--accent),0 0 40px rgba(124,58,237,.3)} }
.nav-links { display:flex; align-items:center; gap:2rem; }
.nav-links a { color:var(--muted); font-size:.85rem; font-weight:500; text-decoration:none; transition:color .2s; }
.nav-links a:hover, .nav-links a.active { color:var(--text); }
.nav-cta { padding:9px 22px; border-radius:999px; background:var(--accent); color:#fff !important; font-size:.82rem; font-weight:700; border:none; cursor:none; transition:box-shadow .3s; }
.nav-cta:hover { box-shadow:0 0 28px rgba(124,58,237,.55); }

/* FOOTER */
.main-footer { border-top:1px solid var(--border); padding:2.5rem 5vw; margin-top:6rem; }
.footer-inner { max-width:1100px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.footer-logo { font-weight:800; font-size:.9rem; }
.footer-legal { display:flex; gap:1.5rem; flex-wrap:wrap; }
.footer-legal a { color:var(--muted); font-size:.78rem; text-decoration:none; transition:color .2s; }
.footer-legal a:hover { color:var(--accent); }
.footer-copy { color:var(--muted); font-size:.78rem; }

/* LAYOUT */
.container { max-width:1100px; margin:0 auto; padding:0 5vw; }
.page-wrap { padding-top:68px; }

/* PAGE HERO */
.page-hero { padding:6rem 0 4rem; }
.page-hero-inner { max-width:1100px; margin:0 auto; padding:0 5vw; }
.page-label { font-size:.7rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:1rem; }
.page-title { font-size:clamp(2.5rem,7vw,5.5rem); font-weight:900; letter-spacing:-3px; line-height:.95; margin-bottom:1.5rem; }
.page-sub { color:var(--muted2); font-size:1rem; max-width:520px; line-height:1.7; }

/* SECTION */
.section { padding:5rem 0; }
.s-label { font-size:.7rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:1rem; }
.s-title { font-size:clamp(1.8rem,4vw,3rem); font-weight:900; letter-spacing:-2px; margin-bottom:2.5rem; }

/* CARDS */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); border:1px solid var(--border); border-radius:20px; overflow:hidden; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:20px; overflow:hidden; }

.card {
  background:var(--bg); padding:2.5rem;
  transition:background .25s; position:relative; overflow:hidden;
}
.card::after { content:''; position:absolute; inset:0; background:radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(124,58,237,.07), transparent 60%); opacity:0; transition:opacity .3s; }
.card:hover { background:rgba(124,58,237,.03); }
.card:hover::after { opacity:1; }

/* BUTTONS */
.btn { display:inline-block; padding:13px 30px; border-radius:999px; font-size:.88rem; font-weight:700; text-decoration:none; border:none; cursor:none; transition:all .25s; }
.btn-p { background:var(--accent); color:#fff; box-shadow:0 0 0 rgba(124,58,237,.4); }
.btn-p:hover { box-shadow:0 0 30px rgba(124,58,237,.55); transform:translateY(-2px); }
.btn-g { background:transparent; color:var(--text); border:1px solid var(--border); }
.btn-g:hover { border-color:rgba(124,58,237,.45); color:#a78bfa; }

/* MARQUEE */
.marquee-wrap { overflow:hidden; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:16px 0; background:rgba(255,255,255,.01); }
.marquee-track { display:flex; width:max-content; animation:mq 22s linear infinite; }
.marquee-track:hover { animation-play-state:paused; }
@keyframes mq { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.mq-item { display:flex; align-items:center; gap:1.5rem; padding:0 2.5rem; white-space:nowrap; font-size:.75rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--muted); }
.mq-dot { width:4px; height:4px; border-radius:50%; background:var(--accent); flex-shrink:0; }

/* TAGS */
.tag { display:inline-block; padding:4px 12px; border-radius:999px; border:1px solid var(--border); font-size:.74rem; color:var(--muted); font-weight:500; background:rgba(255,255,255,.02); }
.tag-accent { border-color:rgba(124,58,237,.35); color:#a78bfa; background:rgba(124,58,237,.08); }

/* REVEAL */
[data-r] { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
[data-r].in { opacity:1; transform:none; }

/* GRADIENT TEXT */
.grad { background:linear-gradient(135deg,var(--accent),var(--accent2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

/* LINE DIVIDER */
.divider { height:1px; background:var(--border); margin:4rem 0; }

@media(max-width:768px) {
  .grid-2, .grid-3 { grid-template-columns:1fr; }
  .nav-links { display:none; }
  body { cursor:auto; }
  #cursor,#cursor-ring { display:none; }
  .page-title { letter-spacing:-2px; }
}