:root{
  --ring: rgba(255,255,255,0.12);
}
*{box-sizing:border-box}
html,body{scroll-behavior:smooth}
.font-inter{font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"}
.container{max-width:72rem;margin:0 auto;padding:0 1rem}
.gradient{background:
  radial-gradient(1200px 600px at 10% -10%, rgba(99,102,241,0.25), transparent),
  radial-gradient(1000px 500px at 90% 10%, rgba(16,185,129,0.2), transparent),
  linear-gradient(180deg, #0B1020 0%, #0E1326 100%)
}
.btn-primary{background:#6366f1;color:#fff;padding:.625rem 1rem;border-radius:.75rem;font-weight:600;box-shadow:0 8px 20px rgba(99,102,241,.25); border:1px solid rgba(255,255,255,.08)}
.btn-primary:hover{background:#5457ee;transform:translateY(-1px)}
.btn-lg{padding:.875rem 1.25rem;font-size:1rem}
.glass-border{border-bottom:1px solid rgba(255,255,255,.06)}
.card{padding:1.5rem;border-radius:1rem;background:rgba(255,255,255,.05);border:1px solid var(--ring)}
.card-title{font-weight:600}
.card-text{margin-top:.5rem;color:rgba(255,255,255,.7);font-size:.95rem;line-height:1.5}
.step{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:.5rem;background:#111827;border:1px solid var(--ring);margin-bottom:.5rem;font-weight:600;color:#c7d2fe}
.mockup{background:#0f172a}
.shine{position:relative;overflow:hidden}
.shine:before{content:"";position:absolute;left:-120%;top:0;height:100%;width:40%;background:linear-gradient(120deg, transparent, rgba(255,255,255,.18), transparent);transform:skewX(-15deg);animation:shine 4s infinite}
@keyframes shine{0%{left:-120%}60%{left:120%}100%{left:120%}}