:root{
      --bg:#030812;
      --bg2:#07111f;
      --panel:#081728;
      --panel2:#0b1d33;
      --panel3:#0a1524;
      --text:#f3f8ff;
      --muted:#9fb1c8;
      --muted2:#6f829d;
      --line:rgba(137,177,223,.18);
      --line2:rgba(137,177,223,.28);
      --blue:#1f86ff;
      --cyan:#39d5ff;
      --amber:#ffae18;
      --green:#57df68;
      --red:#ff514d;
      --shadow:0 24px 80px rgba(0,0,0,.45);
      --radius:22px;
      --max:1180px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      color:var(--text);
      background:
        radial-gradient(circle at 82% 12%, rgba(31,134,255,.20), transparent 26%),
        radial-gradient(circle at 12% 5%, rgba(57,213,255,.08), transparent 32%),
        linear-gradient(180deg, #020610 0%, #05101d 42%, #040b14 100%);
      overflow-x:hidden;
    }

    body:before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background-image:
        linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
      background-size:72px 72px;
      mask-image:linear-gradient(to bottom, rgba(0,0,0,.75), rgba(0,0,0,.18));
    }

    a{color:inherit;text-decoration:none}
    .page{position:relative;z-index:1}
    .wrap{max-width:var(--max);margin:0 auto;padding:0 24px}

    .nav{
      height:86px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:28px;
    }
    .brand{display:flex;align-items:center;gap:13px;min-width:190px}
    .mark{
      width:38px;height:38px;position:relative;
      filter:drop-shadow(0 0 16px rgba(31,134,255,.28));
    }
    .mark:before{
      content:"";
      position:absolute;inset:0;
      background:linear-gradient(140deg, #8bd8ff, #1f86ff 55%, #0a4fb5);
      clip-path:polygon(50% 0%, 92% 100%, 64% 100%, 50% 64%, 35% 100%, 8% 100%);
    }
    .mark:after{
      content:"";
      position:absolute;left:16px;top:11px;width:8px;height:20px;
      background:#03101e;
      transform:skew(-20deg);
      border-radius:1px;
      opacity:.88;
    }
    .brand-text strong{display:block;letter-spacing:.19em;font-size:21px;line-height:1;font-weight:800}
    .brand-text span{display:block;letter-spacing:.43em;font-size:9px;color:#c9d8eb;margin-top:4px;font-weight:700}

    .navlinks{display:flex;align-items:center;gap:44px;color:#d8e6f7;font-size:14px;font-weight:750}
    .navlinks a{opacity:.94}.navlinks a:hover{color:white}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;
      border:1px solid rgba(156,193,235,.25);
      background:rgba(255,255,255,.035);
      color:#fff;border-radius:10px;
      padding:14px 21px;
      font-size:14px;font-weight:850;
      box-shadow:none;
      transition:.2s ease;
      white-space:nowrap;
    }
    .btn:hover{transform:translateY(-1px);border-color:rgba(156,193,235,.46)}
    .btn.primary{background:linear-gradient(180deg,#168cff,#0766e8);border-color:#2d91ff;box-shadow:0 16px 40px rgba(20,122,255,.22)}
    .btn.small{padding:11px 16px;font-size:13px;border-radius:9px}

    .hero{position:relative;padding:62px 0 86px}
    .hero-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(480px,.98fr);gap:58px;align-items:center}
    .eyebrow{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan);font-weight:900;margin-bottom:25px}
    h1{font-size:62px;letter-spacing:-.065em;line-height:.98;margin:0 0 24px;font-weight:900;max-width:610px;text-shadow:0 18px 54px rgba(0,0,0,.35)}
    .lead{font-size:22px;line-height:1.32;font-weight:850;color:#fff;max-width:575px;margin:0 0 17px;letter-spacing:-.025em}
    .sublead{font-size:18px;line-height:1.7;color:#aebdd0;max-width:590px;margin:0 0 34px}
    .hero-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap}

    .wave{
      position:absolute;right:-120px;top:118px;width:560px;height:430px;opacity:.65;pointer-events:none;
      background:
        radial-gradient(circle at 72% 45%, rgba(31,134,255,.45), transparent 5%),
        radial-gradient(circle at 68% 44%, rgba(57,213,255,.32), transparent 8%),
        repeating-radial-gradient(ellipse at 76% 46%, rgba(37,138,255,.22) 0 1px, transparent 2px 12px);
      mask-image:radial-gradient(ellipse at center, #000 0%, transparent 72%);
      transform:rotate(-12deg);
    }

    .dashboard{
      position:relative;background:linear-gradient(180deg, rgba(11,29,51,.92), rgba(5,13,24,.93));
      border:1px solid var(--line2);border-radius:22px;padding:22px;box-shadow:var(--shadow);
      backdrop-filter:blur(16px);overflow:hidden;
    }
    .dashboard:before{content:"";position:absolute;inset:0;background:linear-gradient(130deg, rgba(57,213,255,.08), transparent 36%, rgba(255,174,24,.05));pointer-events:none}
    .dash-head,.metrics,.flow,.signals{position:relative;z-index:1}
    .dash-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px;font-weight:850}
    .live{font-size:12px;color:#78ef8c;font-weight:900}.live:after{content:"";display:inline-block;width:6px;height:6px;border-radius:99px;background:#78ef8c;margin-left:6px;box-shadow:0 0 12px rgba(120,239,140,.8)}
    .metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
    .metric{border:1px solid rgba(137,177,223,.16);background:rgba(4,12,22,.45);border-radius:9px;padding:12px;min-height:86px}
    .metric small{display:block;color:#8da0b8;font-size:11px;margin-bottom:8px}.metric b{font-size:24px;letter-spacing:-.04em}.metric span{display:block;color:#7f90a7;font-size:10px;margin-top:3px}.metric.amber b,.metric.amber small{color:var(--amber)}
    .spark{float:right;width:32px;height:20px;border-bottom:2px solid rgba(31,134,255,.65);border-right:2px solid rgba(31,134,255,.65);transform:skew(-25deg);opacity:.8;margin-top:8px}.metric.amber .spark{border-color:rgba(255,174,24,.85)}
    .dash-label{font-size:13px;font-weight:900;margin-bottom:10px;color:#e6f1ff}
    .flow-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:22px}
    .step{position:relative;border:1px solid rgba(137,177,223,.18);background:rgba(5,14,25,.66);border-radius:9px;padding:11px 9px;min-height:73px;font-size:11px;color:#cbd9eb}
    .step b{display:block;font-size:14px;color:#fff;margin-top:2px}.step.hot{border-color:rgba(31,134,255,.7);box-shadow:inset 0 0 24px rgba(31,134,255,.11),0 0 22px rgba(31,134,255,.15)}
    .signal{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:12px;border:1px solid rgba(137,177,223,.16);background:rgba(3,9,17,.5);border-radius:10px;padding:10px 12px;margin-top:9px}
    .sigicon{width:28px;height:28px;border-radius:99px;display:grid;place-items:center;background:rgba(31,134,255,.15);color:#62bdff}.sigicon.green{background:rgba(87,223,104,.12);color:#6df780}.sigicon.amber{background:rgba(255,174,24,.13);color:#ffc252}.signal b{font-size:12px}.signal span{display:block;color:#7f90a7;font-size:11px;margin-top:2px}.signal button{background:transparent;color:#dcecff;border:1px solid rgba(137,177,223,.25);border-radius:7px;padding:8px 11px;font-weight:750}

    section{padding:38px 0}.center{text-align:center}.section-head{max-width:850px;margin:0 auto 30px}.section-head h2{font-size:34px;line-height:1.08;letter-spacing:-.045em;margin:0 0 12px}.section-head p{color:#aab9cc;font-size:17px;line-height:1.58;margin:0 auto;max-width:760px}
    .mini-label{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan);font-weight:900;margin-bottom:12px}

    .cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}
    .card{border:1px solid var(--line);background:linear-gradient(180deg, rgba(11,29,51,.67), rgba(5,14,25,.70));border-radius:14px;padding:21px 20px;min-height:178px;box-shadow:0 14px 42px rgba(0,0,0,.18)}
    .icon{width:38px;height:38px;margin-bottom:36px;color:var(--cyan)}
    .icon svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.icon.amber{color:var(--amber)}.icon.green{color:var(--green)}
    .card h3{font-size:19px;margin:0 0 8px;letter-spacing:-.03em}.card p{margin:0;color:#b0c0d3;line-height:1.55;font-size:15px}


    .control-panel{margin-top:22px;border:1px solid rgba(57,213,255,.22);background:linear-gradient(100deg, rgba(9,25,44,.78), rgba(5,14,25,.72));border-radius:14px;padding:18px 20px;display:grid;grid-template-columns:1.05fr 1fr 1fr;gap:18px;align-items:start;box-shadow:0 14px 44px rgba(0,0,0,.18)}
    .control-panel h3{margin:0 0 7px;font-size:18px;letter-spacing:-.025em}.control-panel p{margin:0;color:#aebdd0;font-size:14px;line-height:1.55}.control-panel .mini-label{margin-bottom:7px;font-size:11px;letter-spacing:.22em}.control-panel strong{color:#fff}

    .gaps{margin-top:10px;border:1px solid var(--line);background:linear-gradient(100deg, rgba(12,32,56,.75), rgba(5,14,25,.86));border-radius:16px;padding:22px;display:grid;grid-template-columns:1.25fr .85fr .85fr .85fr;gap:18px;align-items:stretch}.gaps h2{font-size:30px;letter-spacing:-.045em;margin:12px 0 12px}.gaps p{color:#aab9cc;line-height:1.55;margin:0}.listbox{background:rgba(4,12,22,.52);border:1px solid rgba(137,177,223,.13);border-radius:10px;padding:16px}.listbox h4{font-size:12px;letter-spacing:.15em;text-transform:uppercase;margin:0 0 13px;color:var(--cyan)}.listbox.red h4{color:#ff695f}.listbox.green h4{color:#67e878}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#d7e5f7;font-size:13px;border-top:1px solid rgba(137,177,223,.07);padding:8px 0}.row:first-of-type{border-top:0}.dot{width:15px;height:15px;border-radius:99px;border:1px solid currentColor;display:inline-grid;place-items:center;font-size:10px;flex:0 0 auto}.red .dot{color:var(--red)}.blue .dot{color:#4ea7ff}.green .dot{color:var(--green)}

    .solutions-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.solution{border:1px solid var(--line);background:linear-gradient(180deg, rgba(11,29,51,.62), rgba(5,14,25,.70));border-radius:12px;padding:24px;display:grid;grid-template-columns:52px 1fr;gap:18px;align-items:center;min-height:106px}.solution h3{font-size:18px;margin:0 0 12px}.chips{display:flex;gap:8px;flex-wrap:wrap}.chip{font-size:11px;color:#d3e2f5;background:rgba(137,177,223,.10);border:1px solid rgba(137,177,223,.10);padding:6px 8px;border-radius:5px}.sicon{font-size:36px;line-height:1;color:#7bc9ff}.sicon.amber{color:#ffc126}

    .platform-row{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:34px}.platform-item{display:grid;grid-template-columns:58px 1fr;gap:16px;align-items:start;border-right:1px solid rgba(137,177,223,.14);padding-right:28px}.platform-item:last-child{border-right:0}.platform-item h3{margin:0 0 7px;font-size:18px}.platform-item p{margin:0;color:#aab9cc;line-height:1.5;font-size:14px}

    .cta{margin:48px auto 0;border:1px solid var(--line2);background:linear-gradient(180deg, rgba(12,32,56,.82), rgba(5,13,24,.86));border-radius:15px;text-align:center;padding:38px 24px;box-shadow:0 16px 60px rgba(0,0,0,.28)}.cta h2{font-size:34px;letter-spacing:-.045em;margin:0 0 20px}
    footer{border-top:1px solid rgba(137,177,223,.12);margin-top:0;padding:28px 0 34px;background:rgba(2,7,13,.42)}.foot-grid{display:grid;grid-template-columns:1.45fr repeat(3,.7fr) 1fr;gap:30px;align-items:start}.foot-brand{display:flex;gap:16px;align-items:flex-start}.foot-brand .mark{width:34px;height:34px}.foot-brand p,.copyright{color:#9bacc1;line-height:1.55;font-size:13px;margin:0}.foot-col h4{font-size:13px;margin:0 0 10px}.foot-col a{display:block;color:#9bacc1;font-size:13px;margin:7px 0}.socials{display:flex;gap:15px;margin-top:16px;color:#9bacc1;font-weight:900}


    .proof-strip{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 2px}
    .proof-strip span{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#bcd2eb;border:1px solid rgba(137,177,223,.18);background:rgba(8,23,40,.62);border-radius:999px;padding:8px 11px}
    .card,.solution,.dashboard,.gaps,.cta,.control-panel{transition:transform .18s ease,border-color .18s ease,background .18s ease}
    .card:hover,.solution:hover{transform:translateY(-2px);border-color:rgba(57,213,255,.34);background:linear-gradient(180deg, rgba(13,36,62,.78), rgba(5,14,25,.72))}

    @media (max-width: 980px){
      .navlinks{display:none}.hero-grid{grid-template-columns:1fr;gap:38px}.dashboard{max-width:720px}.cards4,.solutions-grid,.platform-row,.control-panel{grid-template-columns:1fr 1fr}.gaps{grid-template-columns:1fr 1fr}.foot-grid{grid-template-columns:1fr 1fr}.hero{padding-top:34px}h1{font-size:52px}.metrics{grid-template-columns:1fr 1fr}.flow-row{grid-template-columns:1fr 1fr}.step.hot{grid-column:auto}
    }
    @media (max-width: 640px){
      .wrap{padding:0 18px}.nav{height:76px}.brand-text strong{font-size:18px}.btn{width:100%}.hero-actions{align-items:stretch}.hero{padding:28px 0 50px}h1{font-size:42px}.lead{font-size:19px}.sublead{font-size:16px}.cards4,.solutions-grid,.platform-row,.gaps,.control-panel{grid-template-columns:1fr}.card{min-height:auto}.icon{margin-bottom:20px}.solution{grid-template-columns:42px 1fr}.platform-item{border-right:0;border-bottom:1px solid rgba(137,177,223,.14);padding:0 0 22px}.platform-item:last-child{border-bottom:0}.foot-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr}.signal{grid-template-columns:32px 1fr}.signal button{grid-column:2}.section-head h2{font-size:30px}.cta h2{font-size:28px}
    }
