:root{
    --bg:#0B1120;
    --bg-2:#0F172A;
    --card:#121E38;
    --card-2:#0E1830;
    --line:rgba(148,163,184,.12);
    --line-strong:rgba(148,163,184,.22);
    --blue:#2563EB;
    --blue-2:#3B82F6;
    --purple:#7C3AED;
    --green:#10B981;
    --amber:#F59E0B;
    --text:#E5EDF7;
    --dim:#93A4BC;
    --white:#FFFFFF;
    --grad:linear-gradient(135deg,#2563EB 0%,#7C3AED 100%);
    --maxw:1200px;
    --r:16px;
  }

  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    background:var(--bg);
    color:var(--text);
    font-family:"Inter",system-ui,-apple-system,sans-serif;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit;text-decoration:none}
  img,svg{display:block}
  .wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:24px}

  /* ---------- type ---------- */
  .eyebrow{
    font-family:"Orbitron",sans-serif;
    font-weight:600;
    font-size:12px;
    letter-spacing:.28em;
    text-transform:uppercase;
    color:var(--blue-2);
  }
  h1,h2,h3{font-family:"Orbitron",sans-serif;line-height:1.1;color:var(--white);letter-spacing:-.01em}
  h2{font-size:clamp(28px,4vw,44px);font-weight:700}
  h3{font-size:18px;font-weight:600;letter-spacing:.02em}
  .lead{color:var(--dim);font-size:clamp(16px,1.4vw,18px);max-width:60ch}

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex;align-items:center;gap:10px;
    font-family:"Inter",sans-serif;font-weight:600;font-size:15px;
    padding:13px 22px;border-radius:12px;border:1px solid transparent;
    cursor:pointer;transition:transform .15s ease,box-shadow .25s ease,background .2s ease,border-color .2s ease;
    white-space:nowrap;
  }
  .btn-primary{background:var(--grad);color:#fff;box-shadow:0 8px 30px -8px rgba(37,99,235,.6)}
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 40px -10px rgba(124,58,237,.7)}
  .btn-ghost{background:rgba(148,163,184,.06);color:var(--text);border-color:var(--line-strong)}
  .btn-ghost:hover{border-color:var(--blue-2);color:#fff;background:rgba(37,99,235,.08)}
  .btn:focus-visible{outline:2px solid var(--blue-2);outline-offset:3px}

  /* ---------- nav ---------- */
  .nav{
    position:sticky;top:0;z-index:50;
    backdrop-filter:blur(12px);
    border-bottom:1px solid transparent;
    transition:background .3s ease,border-color .3s ease;
  }
  .nav.scrolled{background:rgba(11,17,32,.82);border-bottom-color:var(--line)}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:112px}
  .brand{display:flex;align-items:center;gap:14px}
  .brand-logo{height:50px;width:auto}
  .brand-logo--foot{height:42px}
  .brand .word{font-family:"Orbitron",sans-serif;font-weight:800;font-size:20px;color:#fff;letter-spacing:.04em}
  .brand .word b{color:var(--blue-2);font-weight:800}
  .brand .sub{font-family:"Orbitron",sans-serif;font-size:9px;letter-spacing:.45em;color:var(--dim);margin-top:2px}
  .nav-links{display:flex;align-items:center;gap:30px}
  .nav-links a{font-size:14px;color:var(--dim);transition:color .2s ease}
  .nav-links a:hover{color:#fff}
  .nav-cta{display:flex;align-items:center;gap:14px}
  .nav-cta .login{font-size:14px;color:var(--dim)}
  .nav-cta .login:hover{color:#fff}
  .menu-btn{display:none;background:none;border:0;color:#fff;cursor:pointer;padding:8px}

  /* ---------- hero ---------- */
  .hero{position:relative;padding:clamp(48px,8vw,96px) 0 clamp(60px,9vw,110px);overflow:hidden}
  .hero::before{
    content:"";position:absolute;inset:0;z-index:0;
    background:
      radial-gradient(900px 500px at 78% 18%, rgba(37,99,235,.22), transparent 60%),
      radial-gradient(700px 420px at 92% 60%, rgba(124,58,237,.18), transparent 60%);
    pointer-events:none;
  }
  .grid-bg{
    position:absolute;inset:0;z-index:0;opacity:.5;pointer-events:none;
    background-image:
      linear-gradient(rgba(148,163,184,.06) 1px,transparent 1px),
      linear-gradient(90deg,rgba(148,163,184,.06) 1px,transparent 1px);
    background-size:54px 54px;
    -webkit-mask-image:radial-gradient(120% 120% at 50% 0%,#000 35%,transparent 80%);
            mask-image:radial-gradient(120% 120% at 50% 0%,#000 35%,transparent 80%);
  }
  .hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
  .hero-copy .eyebrow{display:inline-block;margin-bottom:20px}
  .hero h1{font-size:clamp(34px,5.4vw,60px);font-weight:800;margin-bottom:22px}
  .hero h1 .accent{color:var(--green)}
  .hero .lead{margin-bottom:32px}
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:34px}
  .hero-meta{display:flex;gap:28px;flex-wrap:wrap}
  .hero-meta .m{display:flex;flex-direction:column;gap:2px}
  .hero-meta .m b{font-family:"Orbitron",sans-serif;color:#fff;font-size:20px;font-weight:700}
  .hero-meta .m span{font-size:12.5px;color:var(--dim)}

  /* ---------- signature: hexagon shield ---------- */
  .sig{position:relative;display:grid;place-items:center;min-height:380px}
  .sig .halo{
    position:absolute;width:340px;height:340px;border-radius:50%;
    background:radial-gradient(circle,rgba(37,99,235,.35),rgba(124,58,237,.18) 45%,transparent 70%);
    filter:blur(8px);animation:pulse 4.6s ease-in-out infinite;
  }
  .sig .ring{
    position:absolute;width:300px;height:300px;border-radius:50%;
    background:conic-gradient(from 0deg,transparent,rgba(59,130,246,.5),transparent 30%,transparent 60%,rgba(124,58,237,.5),transparent 90%);
    -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 2px));
            mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 2px));
    animation:spin 16s linear infinite;
  }
  .sig svg{position:relative;z-index:2;width:230px;height:255px;filter:drop-shadow(0 12px 36px rgba(37,99,235,.45))}
  @keyframes pulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.08);opacity:1}}
  @keyframes spin{to{transform:rotate(360deg)}}

  /* ---------- section shell ---------- */
  section{position:relative}
  .sec{padding:clamp(64px,9vw,104px) 0}
  .sec-head{max-width:62ch;margin-bottom:48px}
  .sec-head .eyebrow{display:inline-block;margin-bottom:16px}
  .sec-head p{color:var(--dim);margin-top:14px;font-size:17px}
  .alt{background:
      linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 12%,var(--bg-2) 88%,var(--bg) 100%)}

  /* ---------- pillars ---------- */
  .pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .card{
    background:linear-gradient(180deg,var(--card) 0%,var(--card-2) 100%);
    border:1px solid var(--line);border-radius:var(--r);padding:26px;
    transition:transform .2s ease,border-color .25s ease,box-shadow .25s ease;
  }
  .card:hover{transform:translateY(-4px);border-color:var(--line-strong);box-shadow:0 18px 40px -22px rgba(0,0,0,.8)}
  .ico{
    width:48px;height:48px;border-radius:12px;display:grid;place-items:center;margin-bottom:18px;
    background:rgba(37,99,235,.12);border:1px solid var(--line-strong);
  }
  .ico svg{width:24px;height:24px}
  .card h3{margin-bottom:8px}
  .card p{color:var(--dim);font-size:14.5px}
  .c-blue .ico{background:rgba(37,99,235,.14)} .c-blue .ico svg{stroke:var(--blue-2)}
  .c-purple .ico{background:rgba(124,58,237,.14)} .c-purple .ico svg{stroke:#a78bfa}
  .c-green .ico{background:rgba(16,185,129,.14)} .c-green .ico svg{stroke:#34d399}
  .c-amber .ico{background:rgba(245,158,11,.14)} .c-amber .ico svg{stroke:#fbbf24}

  /* ---------- flow / stepper ---------- */
  .flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;margin-top:8px}
  .step{padding:28px 24px;border:1px solid var(--line);border-right:0;position:relative;background:var(--card-2)}
  .step:first-child{border-radius:var(--r) 0 0 var(--r)}
  .step:last-child{border-right:1px solid var(--line);border-radius:0 var(--r) var(--r) 0}
  .step .n{font-family:"Orbitron",sans-serif;font-size:13px;font-weight:700;color:var(--blue-2);letter-spacing:.1em}
  .step .arrow{position:absolute;right:-11px;top:50%;transform:translateY(-50%);z-index:3;
    width:22px;height:22px;border-radius:50%;background:var(--bg-2);border:1px solid var(--line-strong);
    display:grid;place-items:center;color:var(--blue-2)}
  .step:last-child .arrow{display:none}
  .step h3{margin:14px 0 6px;font-size:16px}
  .step p{color:var(--dim);font-size:13.5px}

  /* ---------- inside / features ---------- */
  .feat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
  .feat{display:flex;gap:18px;background:linear-gradient(180deg,var(--card),var(--card-2));
    border:1px solid var(--line);border-radius:var(--r);padding:24px;transition:border-color .25s ease,transform .2s ease}
  .feat:hover{border-color:var(--line-strong);transform:translateY(-3px)}
  .feat .ico{flex:0 0 auto;margin-bottom:0}
  .feat h3{margin-bottom:6px}
  .feat p{color:var(--dim);font-size:14.5px}

  /* ---------- verified ---------- */
  .verified{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center;
    background:linear-gradient(135deg,rgba(16,185,129,.08),rgba(37,99,235,.06));
    border:1px solid var(--line);border-radius:24px;padding:clamp(32px,5vw,56px)}
  .seal{position:relative;display:grid;place-items:center;min-height:220px}
  .seal .glow{position:absolute;width:200px;height:200px;border-radius:50%;
    background:radial-gradient(circle,rgba(16,185,129,.32),transparent 68%);filter:blur(6px);animation:pulse 5s ease-in-out infinite}
  .seal svg{position:relative;z-index:2;width:150px;height:150px;filter:drop-shadow(0 10px 28px rgba(16,185,129,.45))}
  .checks{display:grid;gap:14px}
  .checks .eyebrow{color:var(--green);margin-bottom:6px}
  .check{display:flex;align-items:center;gap:13px;font-size:15.5px}
  .check svg{flex:0 0 auto;width:22px;height:22px;stroke:var(--green)}
  .check b{color:#fff;font-weight:600}

  /* ---------- cta band ---------- */
  .cta-band{position:relative;overflow:hidden;border-radius:28px;
    background:linear-gradient(135deg,#1A2A52,#241844);border:1px solid var(--line-strong);
    padding:clamp(40px,6vw,72px);text-align:center}
  .cta-band::before{content:"";position:absolute;inset:0;
    background:radial-gradient(600px 300px at 50% -10%,rgba(59,130,246,.35),transparent 60%);pointer-events:none}
  .cta-band > *{position:relative;z-index:1}
  .cta-band h2{margin-bottom:16px}
  .cta-band p{color:#c9d6ea;max-width:54ch;margin:0 auto 30px;font-size:17px}
  .cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

  /* ---------- footer ---------- */
  footer{border-top:1px solid var(--line);padding:56px 0 40px;margin-top:8px;background:var(--bg)}
  .foot-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-bottom:40px}
  .foot-brand{max-width:320px}
  .foot-brand p{color:var(--dim);font-size:14px;margin-top:14px}
  .foot-cols{display:flex;gap:64px;flex-wrap:wrap}
  .foot-col h4{font-family:"Orbitron",sans-serif;font-size:11px;letter-spacing:.2em;color:var(--dim);text-transform:uppercase;margin-bottom:16px}
  .foot-col a{display:block;color:var(--dim);font-size:14px;margin-bottom:10px;transition:color .2s}
  .foot-col a:hover{color:#fff}
  .foot-bot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
    border-top:1px solid var(--line);padding-top:24px;color:var(--dim);font-size:13px}
  .foot-bot .tag{font-family:"Orbitron",sans-serif;letter-spacing:.2em;font-size:11px}

  /* ---------- reveal ---------- */
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
  .reveal.in{opacity:1;transform:none}

  /* ---------- responsive ---------- */
  @media (max-width:900px){
    .hero-inner{grid-template-columns:1fr;gap:8px}
    .sig{min-height:300px;order:-1}
    .pillars-grid{grid-template-columns:1fr 1fr}
    .flow{grid-template-columns:1fr 1fr}
    .step:nth-child(2){border-right:1px solid var(--line)}
    .step:nth-child(1),.step:nth-child(2){border-radius:0}
    .step:nth-child(2) .arrow{display:none}
    .verified{grid-template-columns:1fr}
    .seal{min-height:180px}
  }
  @media (max-width:680px){
    .nav-links,.nav-cta .login{display:none}
    .menu-btn{display:block}
    .nav.open .nav-links{
      display:flex;position:absolute;top:92px;left:0;right:0;flex-direction:column;gap:0;
      background:rgba(11,17,32,.97);border-bottom:1px solid var(--line);padding:8px 24px 18px;
    }
    .nav.open .nav-links a{padding:12px 0;border-bottom:1px solid var(--line);width:100%}
    .pillars-grid,.feat-grid,.flow{grid-template-columns:1fr}
    .step{border-right:1px solid var(--line)!important;border-radius:0!important}
    .step .arrow{display:none!important}
    .hero-actions .btn,.cta-actions .btn{flex:1 1 auto;justify-content:center}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation:none!important;scroll-behavior:auto}
    .reveal{opacity:1;transform:none;transition:none}
  }
