:root{
      --hero-grad-start:#5C74B4;
      
      --card-radius:18px;
      --card-shadow: 0 10px 30px rgba(0,0,0,.12);
    }
    .demo-hero{
      background: radial-gradient(1200px 600px at 85% -10%, rgba(255,255,255,.20) 0%, rgba(255,255,255,0) 60%),
                  linear-gradient(145deg, var(--hero-grad-start), var(--hero-grad-start));
      color:#fff;
      padding: 72px 0;
    }
    .demo-hero .headline{
      font-weight: 700;
      line-height: 1.05;
      letter-spacing: .3px;
      margin-bottom: 22px;
      font-size: clamp(28px, 4vw, 56px);
    }
    .demo-hero .headline .thin{
      font-weight: 400;
    }
    .demo-hero .points .bi{
      font-size: 1.05rem;
      vertical-align: -2px;
      margin-right: .55rem;
    }
    .form-card{
      background: #fff;
      color:#212529;
      border-radius: var(--card-radius);
      box-shadow: var(--card-shadow);
      padding: 28px;
    }
    .form-card label{
      font-weight: 600;
      font-size: .95rem;
      margin-bottom: .35rem;
    }
    .form-card .form-control{
      height: 46px;
      border-color:#e6e6e6;
    }
    .form-card textarea.form-control{
      height: 120px;
      resize: vertical;
    }
    .req{
      color:#e11d48; /* nice red for * */
      margin-left: 2px;
    }
    .btn-demo{
      /* background:#6a57f3; */
      border:0;
      padding: .8rem 1.25rem;
      font-weight:700;
      border-radius: 10px;
      border:1px solid var(--hero-grad-start);
box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.21);
    }
    .btn-demo:hover{ filter: brightness(.95); }
    .form-card span{
        color: var(--hero-grad-start);
    }
    .btn-demo-new{
        background-color: var(--hero-grad-start);
        color: white;
        border-radius: 0px;
        padding: 5px;
        border: 1px solid var(--card-grad-strat);
    }