:root{
      --bg0:#07080d;
      --bg1:#0b1020;
      --text:#eaeaf0;
      --muted:rgba(234,234,240,.72);
      --jade:#23d6a2;
      --gold:#d7c07a;
    }
    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      color:var(--text);
      background:
        radial-gradient(1200px 600px at 20% -10%, rgba(35,214,162,.18), transparent 55%),
        radial-gradient(900px 500px at 80% 0%, rgba(215,192,122,.12), transparent 52%),
        radial-gradient(1200px 600px at 80% 110%, rgba(35,214,162,.18), transparent 55%),
        radial-gradient(900px 500px at 20% 100%, rgba(215,192,122,.12), transparent 52%),
        linear-gradient(180deg, var(--bg0), var(--bg1));
      overflow:hidden;
    }
    .wrap{
      min-height:100%;
      display:grid;
      place-items:center;
      padding:24px;
    }
    .card{
      width:min(720px, 100%);
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.05);
      border-radius:18px;
      padding:28px 26px;
      box-shadow: 0 24px 70px rgba(0,0,0,.55);
      position:relative;
      overflow:hidden;
    }
    .card:before{
      content:"";
      position:absolute;
      inset:-120px -160px auto auto;
      width:360px;height:360px;
      background: radial-gradient(circle at 30% 30%, rgba(35,214,162,.22), transparent 60%);
      transform: rotate(14deg);
      opacity:.9;
    }
    .brand{
      display:flex;
      align-items:center;
      gap:12px;
      margin-bottom:14px;
      position:relative;
      z-index:1;
    }
    .sigil{
      width:40px;height:40px;border-radius:12px;
      background:
        radial-gradient(circle at 30% 30%, rgba(35,214,162,.45), transparent 60%),
        linear-gradient(135deg, rgba(35,214,162,.18), rgba(255,255,255,.06));
      border:1px solid rgba(255,255,255,.14);
      box-shadow: 0 12px 40px rgba(35,214,162,.12);
    }
    .brand b{
      font-family: ui-serif, Georgia, "Times New Roman", serif;
      letter-spacing:.6px;
    }
    .pill{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 12px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.18);
      color:rgba(234,234,240,.78);
      font-size:12px;
      position:relative;
      z-index:1;
    }
    .pill i{
      width:8px;height:8px;border-radius:999px;
      background: var(--jade);
      box-shadow: 0 0 18px rgba(35,214,162,.55);
      display:inline-block;
    }
    h1{
      margin:14px 0 10px;
      font-family: ui-serif, Georgia, "Times New Roman", serif;
      letter-spacing:.5px;
      font-size:40px;
      line-height:1.05;
      position:relative;
      z-index:1;
    }
    p{
      margin:0;
      color:var(--muted);
      line-height:1.6;
      font-size:15px;
      position:relative;
      z-index:1;
    }
    .links{
      margin-top:18px;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      position:relative;
      z-index:1;
    }
    a.btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:12px 14px;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.06);
      color:rgba(234,234,240,.92);
      text-decoration:none;
      font-size:13px;
      min-width:140px;
    }
    a.btn.primary{
      border-color: rgba(35,214,162,.35);
      background: linear-gradient(135deg, rgba(35,214,162,.22), rgba(255,255,255,.06));
    }
    a.btn:hover{border-color: rgba(215,192,122,.35); background: rgba(215,192,122,.06);}
    .small{
      margin-top:14px;
      font-size:12px;
      color:rgba(234,234,240,.62);
      position:relative;
      z-index:1;
    }
    @media (max-width:520px){
      h1{font-size:32px}
      a.btn{min-width:0; flex:1}
    }