/* ── CLUSTERIQ DESIGN SYSTEM ── */
:root {
  --bg: #020205;
  --ink: #ffffff;
  --dim: rgba(255,255,255,0.45);
  --faint: rgba(255,255,255,0.12);
  --line: rgba(255,255,255,0.07);
  --pk: #FF2D6B;
  --or: #FF6B2D;
  --cy: #00E5FF;
  --gr: #00FF88;
  --pu: #9B5CFF;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--ink); font-family:'Space Grotesk',sans-serif; overflow-x:hidden; cursor:none; }

/* NOISE */
.noise { position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.03; 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'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* CURSOR */
#cursor { position:fixed; width:12px; height:12px; border-radius:50%; background:var(--pk); pointer-events:none; z-index:99999; transform:translate(-50%,-50%); mix-blend-mode:difference; transition:width .2s,height .2s; }
#cursor-ring { position:fixed; width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,45,107,0.5); pointer-events:none; z-index:99998; transform:translate(-50%,-50%); transition:width .25s,height .25s,opacity .25s; }

/* NAV */
nav { position:fixed; top:0; left:0; right:0; z-index:500; padding:0 48px; height:72px; display:flex; align-items:center; justify-content:space-between; background:rgba(2,2,5,0.85); backdrop-filter:blur(30px); border-bottom:1px solid var(--line); }
.nav-logo { display:flex; align-items:center; gap:12px; text-decoration:none; }
.nav-logo svg { width:26px; height:26px; }
.logo-name { font-family:'Syne',sans-serif; font-weight:800; font-size:18px; letter-spacing:-.5px; }
.logo-name .c { color:var(--pk); }
.logo-name .iq { color:rgba(255,255,255,0.3); font-weight:500; }
.nav-links { display:flex; align-items:center; gap:2px; }
.nav-a { padding:8px 16px; font-size:13px; color:var(--dim); text-decoration:none; border-radius:8px; transition:all .2s; font-weight:400; }
.nav-a:hover, .nav-a.active { color:#fff; background:rgba(255,255,255,0.06); }
.nav-cta { padding:10px 24px; background:var(--pk); color:#fff; font-family:'Syne',sans-serif; font-weight:700; font-size:13px; letter-spacing:.3px; border-radius:100px; text-decoration:none; transition:all .2s; border:none; cursor:none; }
.nav-cta:hover { background:#ff4785; transform:scale(1.04); box-shadow:0 0 40px rgba(255,45,107,0.4); }

/* CORNER CLUSTER */
#cc { position:fixed; top:0; right:0; width:240px; height:240px; pointer-events:none; z-index:2; }

/* PAGE HERO */
.page-hero { min-height:60vh; display:flex; flex-direction:column; justify-content:flex-end; padding:120px 48px 72px; position:relative; overflow:hidden; border-bottom:1px solid var(--line); }
.page-hero-bg { position:absolute; inset:0; background:radial-gradient(ellipse 70% 60% at 60% 50%, rgba(255,45,107,0.07), transparent 65%); pointer-events:none; }
.page-hero-grid { position:absolute; inset:0; background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:80px 80px; mask-image:radial-gradient(ellipse 60% 80% at 40% 50%,black 20%,transparent 100%); pointer-events:none; }
.page-num { position:absolute; top:88px; right:48px; font-family:'Space Mono',monospace; font-size:11px; letter-spacing:3px; color:rgba(255,255,255,0.12); }

.page-headline { font-family:'Syne',sans-serif; font-size:clamp(56px,8vw,120px); font-weight:800; line-height:.92; letter-spacing:-4px; color:#fff; margin-bottom:28px; position:relative; z-index:2; }
.page-headline .acc { background:linear-gradient(90deg,var(--pk),var(--or)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.page-headline .dim { color:rgba(255,255,255,0.2); }
.page-sub { font-size:clamp(16px,1.8vw,20px); color:var(--dim); line-height:1.65; max-width:560px; font-weight:300; position:relative; z-index:2; }

/* LABEL */
.label { font-family:'Space Mono',monospace; font-size:10px; letter-spacing:4px; text-transform:uppercase; color:var(--pk); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
.label::before { content:''; width:24px; height:1px; background:var(--pk); }

/* SECTION */
.wrap { max-width:1200px; margin:0 auto; padding:0 48px; }
.sec { padding:100px 0; border-top:1px solid var(--line); }
.sec-tight { padding:64px 0; border-top:1px solid var(--line); }

/* SECTION HEADLINE */
.sh { font-family:'Syne',sans-serif; font-size:clamp(44px,6vw,88px); font-weight:800; line-height:.94; letter-spacing:-3px; color:#fff; margin-bottom:56px; }
.sh .acc { background:linear-gradient(90deg,var(--pk),var(--or)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.sh .dim { color:rgba(255,255,255,0.18); }
.sh .cy { color:var(--cy); }
.sh .gr { color:var(--gr); }

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

/* CELL — used inside grid */
.cell { background:var(--bg); padding:48px 40px; transition:background .3s; position:relative; overflow:hidden; }
.cell:hover { background:rgba(255,45,107,0.04); }
.cell::before { content:''; position:absolute; top:0;left:0;right:0; height:2px; background:linear-gradient(90deg,var(--pk),var(--or)); transform:scaleX(0); transform-origin:left; transition:transform .4s ease; }
.cell:hover::before { transform:scaleX(1); }

/* CARD — standalone */
.card { background:rgba(255,255,255,0.02); border:1px solid var(--line); border-radius:20px; padding:36px 32px; transition:all .3s; }
.card:hover { background:rgba(255,45,107,0.04); border-color:rgba(255,45,107,0.2); transform:translateY(-4px); }

/* TYPE INSIDE CELLS/CARDS */
.cell-num { font-family:'Syne',sans-serif; font-size:72px; font-weight:800; line-height:1; color:rgba(255,255,255,0.04); margin-bottom:16px; }
.cell-big { font-family:'Syne',sans-serif; font-size:clamp(56px,6vw,88px); font-weight:800; line-height:1; letter-spacing:-2px; background:linear-gradient(135deg,var(--pk),var(--or)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; margin-bottom:12px; }
.cell-title { font-family:'Syne',sans-serif; font-size:22px; font-weight:700; letter-spacing:-.5px; margin-bottom:12px; }
.cell-desc { font-size:14px; color:var(--dim); line-height:1.72; font-weight:300; }
.cell-src { margin-top:14px; font-family:'Space Mono',monospace; font-size:10px; color:rgba(255,255,255,0.2); letter-spacing:.5px; }
.cell-tag { display:inline-block; margin-top:16px; padding:5px 12px; border-radius:6px; font-family:'Space Mono',monospace; font-size:10px; letter-spacing:1px; }
.cell-benefit { margin-top:16px; padding-top:16px; border-top:1px solid var(--line); font-size:13px; color:rgba(255,255,255,0.45); line-height:1.6; }
.cell-benefit::before { content:'→ '; color:var(--pk); }

/* CLUSTER CARD TOP BAR */
.cl-bar { position:absolute; top:0;left:0;right:0; height:2px; }

/* FLOW TRACK */
.flow-track { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:20px; overflow:hidden; }
.flow-cell { padding:40px 32px; border-right:1px solid var(--line); position:relative; transition:background .2s; }
.flow-cell:last-child { border-right:none; }
.flow-cell:hover { background:rgba(255,255,255,0.02); }
.flow-arrow { position:absolute; top:40px; right:-10px; width:20px; height:20px; background:var(--bg); border:1px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:9px; color:var(--pk); z-index:1; }
.flow-cell:last-child .flow-arrow { display:none; }
.flow-num { font-family:'Space Mono',monospace; font-size:10px; letter-spacing:3px; color:var(--pk); margin-bottom:20px; }
.flow-icon { font-size:30px; margin-bottom:16px; }
.flow-title { font-family:'Syne',sans-serif; font-size:20px; font-weight:700; letter-spacing:-.3px; margin-bottom:12px; }
.flow-desc { font-size:13px; color:var(--dim); line-height:1.7; font-weight:300; }

/* GOV TABLE */
.gov-table { border:1px solid var(--line); border-radius:20px; overflow:hidden; }
.gov-row { display:grid; grid-template-columns:60px 1fr 1.5fr 32px; gap:32px; align-items:center; padding:28px 36px; border-bottom:1px solid var(--line); transition:background .2s; }
.gov-row:last-child { border-bottom:none; }
.gov-row:hover { background:rgba(255,255,255,0.02); }
.gov-ic { width:44px; height:44px; border-radius:12px; background:rgba(255,45,107,0.07); border:1px solid rgba(255,45,107,0.12); display:flex; align-items:center; justify-content:center; font-size:18px; }
.gov-title { font-family:'Syne',sans-serif; font-size:16px; font-weight:700; }
.gov-desc { font-size:13px; color:var(--dim); line-height:1.6; }
.gov-check { color:var(--gr); font-size:16px; text-align:right; }

/* STATEMENT QUOTE */
.statement-quote { font-family:'Syne',sans-serif; font-size:clamp(24px,3.5vw,48px); font-weight:600; line-height:1.25; letter-spacing:-1px; color:rgba(255,255,255,0.82); }
.statement-quote .acc { background:linear-gradient(90deg,var(--pk),var(--or)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }

/* FAQ */
.faq-item { border-top:1px solid var(--line); padding:28px 0; }
.faq-item:last-child { border-bottom:1px solid var(--line); }
.faq-q { font-family:'Syne',sans-serif; font-size:18px; font-weight:700; letter-spacing:-.3px; margin-bottom:12px; }
.faq-a { font-size:14px; color:var(--dim); line-height:1.72; font-weight:300; }

/* AUDIT LOG */
.audit-box { background:rgba(255,255,255,0.02); border:1px solid var(--line); border-radius:20px; padding:36px; }
.audit-title { font-family:'Space Mono',monospace; font-size:10px; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,0.25); margin-bottom:24px; }
.log { display:flex; flex-direction:column; gap:8px; }
.le { display:flex; gap:14px; align-items:flex-start; padding:12px 16px; border-radius:10px; font-size:13px; line-height:1.65; }
.le-t { font-family:'Space Mono',monospace; font-size:10px; color:rgba(255,255,255,0.25); white-space:nowrap; margin-top:2px; }
.le-m { flex:1; color:rgba(255,255,255,0.7); }
.le-b { font-family:'Space Mono',monospace; font-size:9px; padding:2px 8px; border-radius:4px; text-transform:uppercase; white-space:nowrap; margin-top:2px; }
.le-ok { background:rgba(0,255,136,0.05); border:1px solid rgba(0,255,136,0.12); }
.le-ok .le-b { background:rgba(0,255,136,0.1); color:var(--gr); }
.le-warn { background:rgba(255,165,0,0.05); border:1px solid rgba(255,165,0,0.12); }
.le-warn .le-b { background:rgba(255,165,0,0.1); color:rgba(255,200,50,0.9); }
.le-block { background:rgba(255,45,107,0.06); border:1px solid rgba(255,45,107,0.15); }
.le-block .le-b { background:rgba(255,45,107,0.1); color:var(--pk); }

/* CTA SECTION */
.cta-sec { min-height:80vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:100px 48px; border-top:1px solid var(--line); position:relative; overflow:hidden; }
.cta-sec::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 60% at 50% 50%,rgba(255,45,107,0.1),transparent 60%); pointer-events:none; }
.cta-h { font-family:'Syne',sans-serif; font-size:clamp(56px,9vw,130px); font-weight:800; line-height:.9; letter-spacing:-4px; position:relative; z-index:1; margin-bottom:28px; }
.cta-h .top { display:block; color:rgba(255,255,255,0.2); }
.cta-h .mid { display:block; background:linear-gradient(90deg,var(--pk),var(--or)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.cta-h .bot { display:block; color:#fff; }
@keyframes gradslide { 0%{background-position:0%;}100%{background-position:200%;} }
.cta-sub { font-size:18px; color:var(--dim); margin-bottom:48px; font-weight:300; position:relative; z-index:1; }
.cta-form { display:flex; gap:10px; max-width:420px; width:100%; position:relative; z-index:1; margin:0 auto 16px; }
.cta-form input { flex:1; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.12); border-radius:14px; padding:16px 22px; color:#fff; font-family:'Space Grotesk',sans-serif; font-size:15px; outline:none; transition:border-color .2s; }
.cta-form input:focus { border-color:rgba(255,45,107,0.5); }
.cta-form input::placeholder { color:rgba(255,255,255,0.25); }
.cta-form button { background:var(--pk); color:#fff; border:none; padding:16px 28px; border-radius:14px; font-family:'Syne',sans-serif; font-weight:700; font-size:15px; cursor:none; white-space:nowrap; transition:all .2s; }
.cta-form button:hover { background:#ff4785; box-shadow:0 0 50px rgba(255,45,107,0.4); }
.cta-ok { display:none; color:var(--gr); font-size:14px; text-align:center; position:relative; z-index:1; }
.cta-proof { font-family:'Space Mono',monospace; font-size:11px; color:rgba(255,255,255,0.2); position:relative; z-index:1; letter-spacing:1px; }

/* GHOST BUTTON */
.btn-ghost { display:inline-flex; align-items:center; gap:8px; padding:14px 28px; border:1px solid rgba(255,255,255,0.1); border-radius:100px; color:rgba(255,255,255,0.5); font-size:14px; text-decoration:none; transition:all .2s; font-family:'Syne',sans-serif; font-weight:600; background:none; cursor:none; }
.btn-ghost:hover { border-color:rgba(255,45,107,0.4); color:#fff; }

/* FOOTER */
footer { border-top:1px solid var(--line); padding:56px 48px 40px; position:relative; z-index:5; }
.foot-top { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; margin-bottom:48px; }
.foot-brand { display:flex; flex-direction:column; gap:16px; }
.foot-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.foot-tagline { font-size:13px; color:rgba(255,255,255,0.3); line-height:1.65; max-width:220px; }
.foot-social { display:flex; gap:8px; }
.fsoc { width:36px; height:36px; border-radius:10px; background:rgba(255,255,255,0.04); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; text-decoration:none; transition:all .2s; color:var(--dim); }
.fsoc:hover { border-color:rgba(255,45,107,0.3); background:rgba(255,45,107,0.08); color:#fff; }
.foot-col h4 { font-family:'Space Mono',monospace; font-size:10px; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,0.2); margin-bottom:18px; }
.fl { display:block; font-size:13px; color:var(--dim); text-decoration:none; margin-bottom:10px; transition:color .2s; }
.fl:hover { color:#fff; }
.foot-bottom { max-width:1200px; margin:0 auto; border-top:1px solid var(--line); padding-top:24px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.foot-copy { font-family:'Space Mono',monospace; font-size:11px; color:rgba(255,255,255,0.2); }
.foot-built { font-family:'Space Mono',monospace; font-size:11px; color:rgba(255,255,255,0.12); max-width:540px; line-height:1.8; text-align:right; }

/* ANIMS */
@keyframes up { from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:translateY(0);} }
.rev { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.rev.on { opacity:1; transform:translateY(0); }
.rev2 { opacity:0; transform:translateY(16px); transition:opacity .5s ease .12s, transform .5s ease .12s; }
.rev2.on { opacity:1; transform:translateY(0); }

/* MOBILE */
@media(max-width:900px){
  nav { padding:0 20px; }.nav-links{display:none;}
  #cc { width:160px; height:160px; }
  .wrap { padding:0 20px; }
  .page-hero { padding:100px 20px 56px; }
  .page-headline { letter-spacing:-2px; }
  .sec,.sec-tight { padding:72px 0; }
  .sh { letter-spacing:-2px; }
  .grid-2,.grid-3,.grid-4 { grid-template-columns:1fr; }
  .flow-track { grid-template-columns:1fr; border-radius:16px; }
  .flow-cell { border-right:none; border-bottom:1px solid var(--line); }
  .gov-row { grid-template-columns:44px 1fr; gap:16px; }.gov-desc,.gov-check{display:none;}
  .cta-form { flex-direction:column; }
  .cta-h { letter-spacing:-2px; }
  footer { padding:40px 20px; }
  .foot-top { grid-template-columns:1fr 1fr; gap:28px; }
  .foot-bottom { flex-direction:column; text-align:center; }.foot-built{text-align:center;}
}