/* neutralize op-base-b.css's shared .hero (dark bg + padding + glow) for this custom hero */
.hero-wrap > .hero{background:transparent;padding-top:0;padding-bottom:0}
.hero-wrap > .hero::before{content:none}

.hero-wrap{
  position:relative;overflow:hidden;
  background:#0a0a0b;
  padding:140px 24px 0;
}
.hero-wrap::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 60% at 50% 110%,rgba(60,224,0,0.18) 0%,transparent 68%);
}
.hero-wrap::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(60,224,0,0.3),transparent);
}
.hero-wrap .hero{
  position:relative;z-index:1;
  max-width:820px;margin:0 auto;text-align:center;
}
.hero-wrap .eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11.5px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--highlight);margin-bottom:24px;
  border:1px solid rgba(60,224,0,0.25);
  background:rgba(60,224,0,0.07);
  padding:6px 14px;border-radius:100px;
}
.hero-wrap .pulse{
  display:inline-block;width:7px;height:7px;background:var(--highlight);border-radius:50%;
  animation:pulse 2s ease-in-out infinite;
  will-change:transform,opacity;
}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(2);opacity:0}}
.hero-wrap .hero h1{
  font-size:clamp(32px,5vw,64px);font-weight:800;line-height:1.06;
  letter-spacing:-0.035em;margin-bottom:24px;
  color:#fff;
}
.hero-wrap .hero h1 em{font-style:normal;color:var(--highlight)}
.hero-wrap .lede{
  font-size:17px;color:rgba(255,255,255,0.55);line-height:1.65;
  max-width:520px;margin:0 auto 36px;
}
.hero-wrap .hero-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center}
.hero-wrap .btn-primary{
  display:inline-flex;align-items:center;
  background:var(--highlight);color:#0a0a0b;
  font-family:var(--font-body);font-size:14px;font-weight:700;
  padding:13px 26px;border-radius:100px;
  transition:background 0.22s,transform 0.22s,box-shadow 0.22s;
}
.hero-wrap .btn-primary:hover{background:#2fd100;transform:translateY(-1px);box-shadow:0 8px 28px rgba(60,224,0,0.4)}
.hero-wrap .btn-ghost-hero{
  display:inline-flex;align-items:center;
  background:rgba(255,255,255,0.07);color:rgba(255,255,255,0.8);
  border:1px solid rgba(255,255,255,0.15);
  font-family:var(--font-body);font-size:14px;font-weight:600;
  padding:13px 26px;border-radius:100px;
  transition:background 0.22s;
}
.hero-wrap .btn-ghost-hero:hover{background:rgba(255,255,255,0.12)}
.hero-wrap .hero-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  margin-top:64px;
  background:rgba(255,255,255,0.08);
  border-radius:16px;overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);
}
.hero-wrap .hstat{
  background:#111;padding:28px 20px;text-align:center;
  transition:background 0.2s;
}
.hero-wrap .hstat:hover{background:#161616}
.hero-wrap .hstat-num{
  font-family:var(--font-display);font-size:32px;font-weight:800;
  letter-spacing:-0.03em;color:#fff;line-height:1;
}
.hero-wrap .hstat-label{font-size:12px;color:rgba(255,255,255,0.45);margin-top:8px;line-height:1.4}

/* trust bar */

/* responsive (ported from original, scoped) */
@media(max-width:742px){ .hero-wrap .hero-stats{grid-template-columns:1fr 1fr} }
@media(max-width:480px){ .hero-wrap .hero-stats{grid-template-columns:1fr 1fr} }

/* trust strip: restore checkmark sizing/color lost in the migration (was rendering as oversized black SVGs) */
.trust svg{width:14px;height:14px;fill:var(--highlight);flex-shrink:0}
.trust span{display:flex;align-items:center;gap:7px}