/* ===================
   GlowPayments — Grow × Glow Onboarding
   =================== */
.gs { --gap:16px; --radius:16px; --shadow:0 14px 40px rgba(0,0,0,.10);
      --brand:#0b6bff; --mint:#18e0a9; --ink:#0a1621; --card:#ffffff; }

/* Top progress seed */
.gs-progress { position: sticky; top: 0; height: 4px; background: linear-gradient(90deg, rgba(255,255,255,.06), transparent); z-index: 4; }
.gs-progress__bar{ display:block; height:100%; width: calc(var(--p,0) * 100%); background:
  linear-gradient(90deg, #55ddff 0%, #5cfcc9 50%, #c4ff54 100%); box-shadow: 0 0 14px rgba(99,255,214,.65); transition: width .35s ease; }

/* HERO */
.gs-hero { position: relative; padding: 88px 16px 28px; text-align:center; color:#eef6ff;
  background: radial-gradient(1200px 600px at 50% -120px, rgba(60,130,255,.55) 0%, rgba(24,224,169,.18) 38%, rgba(10,22,33,0) 60%),
              linear-gradient(180deg, #07111a 0%, #0a1621 55%, rgba(10,22,33,0) 100%);
}
.gs-hero__halo{ position:absolute; inset:-20% -10% auto -10%; height:60%; background:
  radial-gradient(800px 320px at 50% 40%, rgba(255,255,255,.18), transparent 60%);
  filter: blur(20px); pointer-events:none; }
.gs-hero h1{ font-size:clamp(28px,3.6vw,48px); margin:0 0 8px; letter-spacing:-.02em; text-shadow:0 2px 20px rgba(0,0,0,.25);}
.gs-hero .lead{ opacity:.92; max-width:760px; margin:0 auto 18px;}
.gs-hero__cta{ display:inline-flex; gap:10px; }

/* Bulb + sprout */
.gs-bulb{ width:min(220px, 40vw); margin:0 auto 12px; animation: float 5s ease-in-out infinite; }
.bulb{ width:100%; height:auto; }
.bulb__glass{ fill:url(#none); stroke:rgba(255,255,255,.7); stroke-width:2; filter: drop-shadow(0 6px 24px rgba(60,130,255,.35)); }
.sprout{ fill:none; stroke:#18e0a9; stroke-width:3; stroke-linecap:round; stroke-linejoin:round;
         filter: drop-shadow(0 0 10px rgba(24,224,169,.8)); animation: grow 2.6s ease forwards; }
.bulb__socket{ fill:#0f1d2b; }
.bulb__ring{ fill:#13263a; }
@keyframes float{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }
@keyframes grow{ from{ stroke-dasharray: 0 400 } to{ stroke-dasharray: 400 0 } }

/* STEPPER */
.gs-stepper{ max-width:1040px; margin: 8px auto 10px; padding:0 16px; }
.gs-stepper ol{ display:grid; grid-template-columns: repeat(3,1fr); gap:12px; list-style:none; padding:0; margin:0; }
.gs-stepper li{ position:relative; text-align:center; color:#9fb3c9; font-weight:700; }
.gs-stepper li::before{
  content:""; display:block; margin:0 auto 6px; width:28px; height:28px; border-radius:999px;
  border:2px solid rgba(255,255,255,.25); background: rgba(255,255,255,.06);
}
.gs-stepper li.active{ color:#e8f5ff; }
.gs-stepper li.active::before{ background: linear-gradient(135deg, #55ddff, #18e0a9); border-color: transparent; box-shadow:0 0 18px rgba(24,224,169,.55); }

/* SECTIONS */
.gs-steps{ padding: 8px 16px 56px; max-width:1040px; margin:0 auto; }
.steps{ list-style:none; padding:0; margin:0; display:grid; gap:22px; }
.steps>li{ background:var(--card); border:1px solid rgba(10,20,30,.08); border-radius:var(--radius); padding:26px; box-shadow:var(--shadow); }
.steps>li.active{ outline:2px solid rgba(24,224,169,.22); }
.steps h3{ margin:0 0 6px; font-size:20px; }
.sub{ margin:0 0 14px; color:#334; }

/* PRODUCT cards */
.product-cards{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--gap); }
.product{ display:grid; gap:6px; justify-items:center; text-align:center; padding:18px; border-radius:14px; border:1px solid rgba(0,0,0,.12);
          background:linear-gradient(180deg,#f5fbff, #ffffff); font-weight:700; cursor:pointer;
          transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease; }
.product:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.08); }
.product__icon{ font-size:22px; }
.product small{ color:#4a5568; font-weight:600; opacity:.9; }
.product.selected{ background:#ffffff; border-color:rgba(11,107,255,.45); outline:3px solid rgba(24,224,169,.22); box-shadow:0 14px 36px rgba(11,107,255,.18); }

/* FORM */
.grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:18px 0; }
label{ display:grid; gap:6px; font-size:14px; color:#223; }
input, select{ height:48px; padding:12px 14px; border-radius:12px; border:1px solid rgba(0,0,0,.12); background:#fff; }
input:focus, select:focus{ outline:2px solid rgba(11,107,255,.25); border-color:rgba(11,107,255,.5); }
.gs-form-actions{ display:flex; align-items:center; gap:12px; }

/* INTEGRATION */
.integration-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.integration-cards .card{ border:1px solid rgba(0,0,0,.08); border-radius:var(--radius); padding:18px; background:#fff; box-shadow:var(--shadow); }
.integration-cards .card h4{ margin:4px 0 10px; }

/* CTA */
a.cta, button.cta{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 18px; border-radius:999px; font-weight:700; border:1px solid rgba(0,0,0,.08); background:#fff;
}
a.cta.primary, button.cta.primary{ background:var(--brand); color:#fff; border-color:var(--brand); }
a.cta.primary:hover, button.cta.primary:hover{ filter:brightness(1.05); }

/* TOAST */
.gs-toast{ position:fixed; right:16px; bottom:16px; background:#0c1a2a; color:#eafffb; padding:12px 14px; border-radius:14px;
           border:1px solid rgba(255,255,255,.12); box-shadow:0 12px 30px rgba(0,0,0,.22); opacity:0; transform:translateY(10px);
           transition: .28s ease; z-index:10; }
.gs-toast.show{ opacity:1; transform:translateY(0); }
.gs-toast__dot{ width:8px; height:8px; border-radius:999px; background:linear-gradient(135deg,#55ddff,#18e0a9); display:inline-block; margin-right:8px; box-shadow:0 0 10px rgba(24,224,169,.8); }

/* A11y */
.visually-hidden{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* Mobile */
@media (max-width: 900px){
  .grid{ grid-template-columns:1fr; }
  .product-cards{ grid-template-columns:1fr; }
  .integration-cards{ grid-template-columns:1fr; }
  .gs-hero{ padding:64px 16px 24px; }
  .steps>li{ padding:22px; }
}

/* ===== Investor Onboarding (Steps 2 & 3) ===== */
.gs-invest .ir-form textarea {
  width: 100%; resize: vertical; min-height: 96px;
  padding: 12px 14px; border-radius: 12px; border:1px solid rgba(0,0,0,.12); background:#fff;
}
.gs-invest .agree { font-size: 13px; color:#3a4452; display:flex; gap:8px; align-items:center; }

.gs-ir { background: radial-gradient(900px 400px at 50% -80px, rgba(11,107,255,.08), transparent 60%); }
.ir-grid {
  display:grid; grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px; margin-top: 16px;
}
.ir-card {
  background: linear-gradient(180deg, #0a1621, #0c1d2f);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px; padding: 22px;
  color: #e9f3ff; box-shadow: 0 16px 40px rgba(0,0,0,.22);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ir-card:hover { transform: translateY(-6px); border-color: rgba(11,107,255,.6); box-shadow: 0 22px 50px rgba(11,107,255,.25); }
.ir-card__hd { display:flex; align-items:center; gap:10px; margin-bottom: 8px; }
.ir-ic { font-style: normal; font-size: 22px; background: linear-gradient(135deg,#55ddff,#18e0a9); -webkit-background-clip:text; background-clip:text; color: transparent; }

@media (max-width: 900px) {
  .ir-grid { grid-template-columns: 1fr; }
}