/* =========================================================================
   OMEGA POINT SOLUTIONS LLC — design system
   Dark, credible, "convergence" intelligence aesthetic. One shared sheet.
   Accent identity (parent/umbrella): cyan #22d3ee -> indigo #818cf8 duotone.
   Product accents are kept local (teal/blue/amber) on their own cards.
   ========================================================================= */

:root{
  /* base */
  --bg:#070d15; --bg2:#0c1622; --bg3:#11202f;
  --acc:#22d3ee; --acc2:#818cf8;            /* omega duotone */
  --acc-rgb:34,211,238; --acc2-rgb:129,140,248;
  --red:#e74c3c; --yel:#f6c843; --grn:#37d39b;
  --t0:#f1faee; --t1:#cddbe4; --t2:#7e95a6;
  --line:rgba(34,211,238,.16);
  --line2:rgba(129,140,248,.14);
  --card:rgba(255,255,255,.022);
  --card-b:rgba(255,255,255,.06);
  --maxw:1180px;
  /* product accents */
  --p-fraudtrax:#3fb6b6; --p-svt:#38bdf8; --p-hatchet:#ffae3b;
  --p-icebreaker:#6ee7ff; --p-oporder:#9aa7ff; --p-ema:#37d39b; --p-grant:#f6c843;
  --p-odin:#a78bfa; --p-dano:#22d3ee;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--t1);
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:16px; line-height:1.6; letter-spacing:-.1px;
  overflow-x:hidden; -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
h1,h2,h3{color:var(--t0); margin:0; font-weight:800; letter-spacing:-1.2px; line-height:1.08}
h1{font-size:clamp(2.3rem,5vw,4.1rem); font-weight:900}
h2{font-size:clamp(1.7rem,3.3vw,2.7rem)}
h3{font-size:1.15rem; letter-spacing:-.4px}
p{margin:.6em 0}
.mono{font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace}
.grad{background:linear-gradient(110deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 26px}
section{position:relative; z-index:2}

/* ---------- animated backdrop ---------- */
#fx{position:fixed; inset:0; z-index:0; pointer-events:none}
.bg-grid{
  position:fixed; inset:-2px; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(34,211,238,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(34,211,238,.05) 1px,transparent 1px);
  background-size:54px 54px;
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 22%,#000 35%,transparent 78%);
          mask-image:radial-gradient(ellipse 80% 60% at 50% 22%,#000 35%,transparent 78%);
  animation:pan 40s linear infinite;
}
@keyframes pan{to{background-position:54px 54px}}
.blob{position:fixed; z-index:0; border-radius:50%; filter:blur(90px); opacity:.5; pointer-events:none}
.blob.b1{width:520px;height:520px;background:radial-gradient(circle,rgba(34,211,238,.30),transparent 70%);top:-160px;left:-120px;animation:drift1 22s ease-in-out infinite}
.blob.b2{width:480px;height:480px;background:radial-gradient(circle,rgba(129,140,248,.26),transparent 70%);bottom:-180px;right:-120px;animation:drift2 26s ease-in-out infinite}
@keyframes drift1{50%{transform:translate(120px,80px) scale(1.12)}}
@keyframes drift2{50%{transform:translate(-100px,-70px) scale(1.1)}}

/* ---------- nav ---------- */
nav{
  position:sticky; top:0; z-index:60;
  backdrop-filter:blur(14px); background:rgba(7,13,21,.72);
  border-bottom:1px solid var(--line);
}
.nav-in{max-width:var(--maxw); margin:0 auto; padding:13px 26px; display:flex; align-items:center; gap:22px}
.brand{display:flex; align-items:center; gap:11px; font-weight:800; color:var(--t0); letter-spacing:-.5px}
.logomark{width:34px;height:34px;flex:0 0 34px}
.brand small{display:block; font:500 10px/1 'JetBrains Mono',monospace; color:var(--t2); letter-spacing:2px; margin-top:3px}
.nav-links{display:flex; gap:5px; margin-left:auto; align-items:center}
.nav-links a{font-size:.86rem; color:var(--t1); padding:8px 12px; border-radius:8px; transition:.2s; white-space:nowrap}
.nav-links a:hover{background:rgba(255,255,255,.05); color:var(--t0)}
.nav-links a.cta{border:1px solid var(--line); color:var(--acc)}
.nav-links a.cta:hover{background:rgba(34,211,238,.1)}
.burger{display:none; margin-left:auto; background:none; border:1px solid var(--line); color:var(--t0); width:42px; height:38px; border-radius:9px; font-size:1.2rem; cursor:pointer}

/* ---------- buttons ---------- */
.btn{display:inline-flex; align-items:center; gap:9px; padding:13px 22px; border-radius:11px; font-weight:600; font-size:.92rem; cursor:pointer; border:1px solid transparent; transition:.22s; text-align:center}
.btn-primary{background:linear-gradient(110deg,var(--acc),var(--acc2)); color:#04121a; box-shadow:0 10px 34px rgba(34,211,238,.22)}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 16px 44px rgba(34,211,238,.34)}
.btn-ghost{border-color:var(--card-b); color:var(--t0); background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:var(--acc); color:var(--acc)}

/* ---------- eyebrow / pills ---------- */
.eyebrow{display:inline-flex; align-items:center; gap:9px; font:600 11px/1 'JetBrains Mono',monospace; letter-spacing:2.4px; text-transform:uppercase; color:var(--acc); padding:8px 14px; border:1px solid var(--line); border-radius:30px; background:rgba(34,211,238,.05)}
.live-dot{width:7px;height:7px;border-radius:50%;background:var(--grn);box-shadow:0 0 0 0 rgba(55,211,155,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(55,211,155,0)}100%{box-shadow:0 0 0 0 rgba(55,211,155,0)}}

/* ---------- hero ---------- */
.hero{padding:62px 0 40px; position:relative}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:46px; align-items:center}
.hero h1{margin:18px 0 14px}
.type{font:600 .95rem/1.5 'JetBrains Mono',monospace; color:var(--acc2); min-height:1.5em; margin-bottom:8px}
.type .cur{display:inline-block; width:9px; background:var(--acc); margin-left:2px; animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero .sub{font-size:1.06rem; color:var(--t1); max-width:46ch; margin:6px 0 26px}
.hero-cta{display:flex; gap:13px; flex-wrap:wrap}
.trust{display:flex; gap:22px; margin-top:26px; flex-wrap:wrap; color:var(--t2); font:500 .8rem/1 'JetBrains Mono',monospace; letter-spacing:.6px}
.trust span{display:flex; align-items:center; gap:7px}
.trust b{color:var(--acc)}

/* hero visual / canvas */
.scanner{position:relative; perspective:1100px; min-height:420px; display:flex; align-items:center; justify-content:center}
.scanner canvas{position:absolute; inset:0; width:100%; height:100%}
.holo-card{position:relative; z-index:3; width:min(420px,92%); background:linear-gradient(160deg,rgba(14,28,43,.92),rgba(9,16,25,.92)); border:1px solid var(--card-b); border-radius:18px; padding:22px; transform-style:preserve-3d; box-shadow:0 30px 80px rgba(0,0,0,.5); overflow:hidden}
.holo-card::after{content:''; position:absolute; inset:0; background:linear-gradient(120deg,transparent 30%,rgba(34,211,238,.10) 50%,transparent 70%); background-size:260% 260%; animation:sheen 7s linear infinite; pointer-events:none}
@keyframes sheen{to{background-position:-260% 0}}
.hc-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px}
.hc-tag{font:600 10px/1 'JetBrains Mono',monospace; letter-spacing:1.6px; text-transform:uppercase; color:var(--t2)}
.hc-row{display:flex; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid rgba(255,255,255,.05); font-size:.85rem; opacity:0; transform:translateY(6px); animation:rowin .5s forwards}
.hc-row span:first-child{color:var(--t2)}
.hc-row span:last-child{color:var(--t0); font-family:'JetBrains Mono',monospace; font-size:.8rem}
@keyframes rowin{to{opacity:1; transform:none}}
.verdict{margin-top:14px; padding:11px 14px; border-radius:10px; font:700 .9rem/1 'Inter'; display:flex; align-items:center; gap:9px; opacity:0; animation:stamp .5s .9s forwards}
.verdict.ok{background:rgba(55,211,155,.12); color:var(--grn); border:1px solid rgba(55,211,155,.3)}
@keyframes stamp{0%{opacity:0; transform:scale(1.15)}100%{opacity:1; transform:scale(1)}}

/* ---------- stat band ---------- */
.stats{border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin:18px 0}
.stat-grid{display:grid; grid-template-columns:repeat(4,1fr)}
.stat{padding:34px 22px; text-align:center; border-right:1px solid var(--line)}
.stat:last-child{border-right:none}
.stat .num{font:800 2.6rem/1 'Inter'; color:var(--t0)}
.stat .num .grad{font-weight:800}
.stat .lbl{font:500 .72rem/1.4 'JetBrains Mono',monospace; letter-spacing:1.4px; text-transform:uppercase; color:var(--t2); margin-top:9px}

/* ---------- generic section heading ---------- */
.sec-head{max-width:620px; margin:0 auto 42px; text-align:center}
.sec-head .eyebrow{margin-bottom:16px}
.sec-head p{color:var(--t2); margin-top:12px}
.section-pad{padding:78px 0}

/* ---------- card grid ---------- */
.grid{display:grid; gap:18px}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--card); border:1px solid var(--card-b); border-radius:16px; padding:24px; transition:.25s; position:relative; overflow:hidden}
.card:hover{transform:translateY(-4px); border-color:var(--line); background:rgba(255,255,255,.035)}
.card .ico{width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:15px; background:rgba(34,211,238,.1); border:1px solid var(--line)}
.card .ico svg{width:24px; height:24px; stroke:var(--acc)}
.card h3{margin-bottom:8px}
.card p{color:var(--t2); font-size:.92rem; margin:0}

/* product card with local accent */
.pcard{--pc:var(--acc); background:var(--card); border:1px solid var(--card-b); border-radius:16px; padding:24px; transition:.25s; position:relative; overflow:hidden; display:flex; flex-direction:column}
.pcard::before{content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--pc),transparent)}
.pcard:hover{transform:translateY(-4px); border-color:color-mix(in srgb,var(--pc) 40%,transparent)}
.pcard .ptag{font:600 10px/1 'JetBrains Mono',monospace; letter-spacing:1.6px; text-transform:uppercase; color:var(--pc); margin-bottom:11px}
.pcard h3{margin-bottom:8px}
.pcard p{color:var(--t2); font-size:.92rem; flex:1}
.pcard .pstat{display:flex; gap:16px; margin-top:15px; padding-top:14px; border-top:1px solid rgba(255,255,255,.06); font:500 .74rem/1.3 'JetBrains Mono',monospace; color:var(--t2)}
.pcard .pstat b{display:block; color:var(--pc); font-size:1rem}
.pcard .badge{position:absolute; top:18px; right:18px; font:600 9px/1 'JetBrains Mono',monospace; letter-spacing:1px; text-transform:uppercase; padding:5px 9px; border-radius:20px}
.badge.live{background:rgba(55,211,155,.14); color:var(--grn); border:1px solid rgba(55,211,155,.3)}
.badge.beta{background:rgba(246,200,67,.14); color:var(--yel); border:1px solid rgba(246,200,67,.3)}
.badge.dev{background:rgba(126,149,166,.14); color:var(--t2); border:1px solid rgba(126,149,166,.3)}

/* ---------- photo rotator ---------- */
.rotator{position:relative; border-radius:18px; overflow:hidden; border:1px solid var(--card-b); aspect-ratio:16/9; background:var(--bg2)}
.rotator .slide{position:absolute; inset:0; opacity:0; transition:opacity 1.4s ease; background-size:cover; background-position:center; transform:scale(1.04); animation:kenburns 9s ease-in-out infinite alternate}
.rotator .slide.on{opacity:1; z-index:2}
@keyframes kenburns{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.12) translate(-2%,-2%)}}
.rotator::after{content:''; position:absolute; inset:0; z-index:3; pointer-events:none; background:linear-gradient(180deg,transparent 45%,rgba(7,13,21,.78)); }
.rotator .cap{position:absolute; left:22px; bottom:20px; z-index:4; max-width:80%}
.rotator .cap .k{font:600 10px/1 'JetBrains Mono',monospace; letter-spacing:2px; text-transform:uppercase; color:var(--acc)}
.rotator .cap h3{margin-top:8px; text-shadow:0 2px 18px rgba(0,0,0,.7)}
.rotator .dots{position:absolute; right:18px; bottom:18px; z-index:5; display:flex; gap:7px}
.rotator .dots i{width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.28); cursor:pointer; transition:.2s}
.rotator .dots i.on{background:var(--acc); width:22px; border-radius:5px}
.ph{display:flex; align-items:center; justify-content:center; height:100%; color:var(--t2); font:500 .8rem 'JetBrains Mono',monospace; text-align:center; padding:20px; flex-direction:column; gap:10px}
.ph svg{width:42px;height:42px;stroke:var(--t2);opacity:.5}

/* small showcase tiles */
.tile{position:relative; border-radius:14px; overflow:hidden; border:1px solid var(--card-b); aspect-ratio:4/3; background:var(--bg2)}
.tile .slide{position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.2s; animation:kenburns 11s ease-in-out infinite alternate}
.tile .slide.on{opacity:1}
.tile .tcap{position:absolute; left:14px; bottom:12px; z-index:3; font:600 11px/1 'JetBrains Mono',monospace; color:#fff; text-shadow:0 1px 8px #000; letter-spacing:1px; text-transform:uppercase}
.tile::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.6)); z-index:2}

/* ---------- API / partners ---------- */
.api-block{background:var(--bg2); border:1px solid var(--line); border-radius:16px; padding:0; overflow:hidden}
.api-head{display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--line); background:rgba(34,211,238,.04)}
.api-head .dot{display:inline-flex; gap:6px}
.api-head .dot i{width:11px;height:11px;border-radius:50%;background:#2a3a48}
pre.code{margin:0; padding:20px; overflow-x:auto; font:500 .82rem/1.7 'JetBrains Mono',monospace; color:var(--t1)}
pre.code .c{color:var(--t2)} pre.code .k{color:var(--acc2)} pre.code .s{color:var(--grn)} pre.code .f{color:var(--acc)}

/* ---------- legal / doc pages ---------- */
.doc{max-width:840px; margin:0 auto; padding:42px 0}
.doc h2{margin:36px 0 12px; padding-bottom:8px; border-bottom:1px solid var(--line)}
.doc h3{margin:24px 0 8px; color:var(--acc2)}
.doc p,.doc li{color:var(--t1); font-size:.96rem}
.doc ul{padding-left:22px} .doc li{margin:6px 0}
.doc .meta{font:500 .8rem 'JetBrains Mono',monospace; color:var(--t2); letter-spacing:.5px}
.callout{border:1px solid var(--line2); background:rgba(129,140,248,.05); border-left:3px solid var(--acc2); border-radius:10px; padding:16px 20px; margin:20px 0}
.callout.warn{border-left-color:var(--yel); background:rgba(246,200,67,.05)}
.toc{position:sticky; top:80px}
.toc a{display:block; padding:5px 0; color:var(--t2); font-size:.85rem; border-left:2px solid transparent; padding-left:12px}
.toc a:hover{color:var(--acc); border-left-color:var(--acc)}

/* ---------- forms ---------- */
.field{margin-bottom:16px}
.field label{display:block; font:600 .8rem 'JetBrains Mono',monospace; letter-spacing:.6px; color:var(--t2); margin-bottom:7px; text-transform:uppercase}
.field input,.field select,.field textarea{width:100%; background:var(--bg2); border:1px solid var(--card-b); border-radius:10px; padding:12px 14px; color:var(--t0); font-family:inherit; font-size:.95rem; transition:.2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--acc); box-shadow:0 0 0 3px rgba(34,211,238,.12)}
.field textarea{min-height:130px; resize:vertical}

/* ---------- CTA band ---------- */
.cta-band{margin:30px auto; max-width:var(--maxw); text-align:center; padding:64px 30px; border-radius:24px; border:1px solid var(--line); background:radial-gradient(ellipse at 50% 0,rgba(34,211,238,.10),transparent 60%),var(--bg2); position:relative; overflow:hidden}
.cta-band h2{margin-bottom:14px}
.cta-band p{color:var(--t2); max-width:50ch; margin:0 auto 26px}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line); margin-top:40px; padding:54px 0 30px; position:relative; z-index:2; background:rgba(7,13,21,.6)}
.foot-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:34px}
.foot-col h4{font:600 .76rem 'JetBrains Mono',monospace; letter-spacing:1.6px; text-transform:uppercase; color:var(--t2); margin:0 0 14px}
.foot-col a{display:block; color:var(--t1); font-size:.88rem; padding:5px 0; transition:.2s}
.foot-col a:hover{color:var(--acc)}
.foot-brand p{color:var(--t2); font-size:.88rem; max-width:34ch}
.foot-bottom{border-top:1px solid var(--line); margin-top:40px; padding-top:22px; display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; color:var(--t2); font:500 .8rem 'JetBrains Mono',monospace}
.foot-bottom a{color:var(--t2)} .foot-bottom a:hover{color:var(--acc)}

/* ---------- reveal ---------- */
.fadeup{opacity:0; transform:translateY(26px); transition:.7s cubic-bezier(.2,.7,.2,1)}
.fadeup.in{opacity:1; transform:none}

/* ---------- responsive ---------- */
@media(max-width:880px){
  .hero-grid{grid-template-columns:1fr; gap:34px}
  .scanner{min-height:340px}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:none}
  .stat{border-bottom:1px solid var(--line)}
  .g-3,.g-2{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .nav-links{display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; background:rgba(7,13,21,.97); border-bottom:1px solid var(--line); padding:14px 18px; gap:2px}
  .nav-links.open{display:flex}
  .nav-links a{padding:12px}
  .burger{display:block}
}
