@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@1,700&display=swap');

:root { color-scheme: dark; --bg:#090611; --text:#f7f4ff; --muted:#aaa3ba; --violet:#9d6cff; --pink:#ed73c8; }
* { box-sizing:border-box; }
html { min-height:100%; }
body { margin:0; min-height:100vh; overflow-x:hidden; display:flex; flex-direction:column; background:var(--bg); color:var(--text); font-family:"DM Sans",sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.28; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E"); }
a { color:inherit; }
.site-header, footer { width:min(1160px,calc(100% - 48px)); margin-inline:auto; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:2; }
.site-header { padding:30px 0; }
.brand { display:flex; align-items:center; gap:11px; font-size:21px; font-weight:700; text-decoration:none; letter-spacing:-.5px; }
.brand-mark { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; background:linear-gradient(135deg,var(--violet),var(--pink)); box-shadow:0 8px 30px #9d6cff55; font-family:"Playfair Display",serif; }
.contact-link { color:var(--muted); text-decoration:none; font-size:14px; transition:.2s; }
.contact-link:hover { color:white; }
main { flex:1; display:grid; place-items:center; padding:65px 24px 90px; position:relative; z-index:1; }
.hero { width:min(900px,100%); text-align:center; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; margin:0 0 28px; padding:7px 13px; border:1px solid #ffffff18; border-radius:99px; background:#ffffff08; color:#c7c0d6; font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow span { width:7px; height:7px; border-radius:50%; background:#b68cff; box-shadow:0 0 12px #b68cff; animation:pulse 2s infinite; }
h1 { margin:0; font-size:clamp(46px,8vw,92px); line-height:1.04; letter-spacing:-.055em; }
h1 em { color:transparent; background:linear-gradient(100deg,#b69aff 15%,#ef83c8 90%); background-clip:text; -webkit-background-clip:text; font-family:"Playfair Display",serif; font-weight:700; }
.intro { max-width:620px; margin:28px auto 35px; color:var(--muted); line-height:1.75; font-size:16px; }
.signup { max-width:550px; margin:auto; }
.form-row { display:flex; gap:8px; padding:6px; border:1px solid #ffffff1c; background:#ffffff0a; border-radius:16px; box-shadow:0 20px 70px #0008; }
input { min-width:0; flex:1; border:0; outline:0; padding:0 16px; background:transparent; color:white; font:inherit; }
input::placeholder { color:#777083; }
input:focus-visible { outline:2px solid var(--violet); outline-offset:8px; border-radius:5px; }
button { border:0; border-radius:11px; padding:14px 20px; color:white; background:linear-gradient(120deg,#8658e8,#b25ca8); font:600 14px inherit; cursor:pointer; white-space:nowrap; transition:transform .2s,box-shadow .2s; }
button:hover { transform:translateY(-2px); box-shadow:0 10px 30px #9d6cff44; }
button:focus-visible, a:focus-visible { outline:2px solid #d9c7ff; outline-offset:4px; }
.form-message { min-height:20px; margin:12px 0 0; color:#777083; font-size:12px; }
.form-message.success { color:#9ce7bc; }
.form-message.error { color:#ff9cac; }
.features { max-width:650px; margin:72px auto 0; padding-top:28px; border-top:1px solid #ffffff12; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.features>div { display:flex; align-items:center; justify-content:center; gap:12px; text-align:left; }
.features>div>span { display:grid; place-items:center; width:35px; height:35px; flex:0 0 auto; border:1px solid #ffffff18; border-radius:10px; color:#c6a6ff; background:#ffffff08; }
.features p { display:flex; flex-direction:column; margin:0; }
.features strong { font-size:13px; }
.features small { margin-top:3px; color:#777083; font-size:11px; }
footer { padding:25px 0 28px; border-top:1px solid #ffffff0d; color:#696273; font-size:12px; }
footer nav { display:flex; gap:22px; }
footer a { text-decoration:none; }
footer a:hover { color:#ccc5d8; }
.glow { position:fixed; border-radius:50%; filter:blur(120px); opacity:.15; pointer-events:none; }
.glow-one { width:520px; height:520px; top:-250px; left:-180px; background:#773cff; }
.glow-two { width:450px; height:450px; right:-160px; bottom:-200px; background:#d43891; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@keyframes pulse { 50% { opacity:.4; transform:scale(.75); } }
@media (max-width:600px) {
  .site-header,footer { width:calc(100% - 32px); }
  .site-header { padding-top:20px; }
  main { padding:45px 18px 65px; }
  h1 { font-size:clamp(43px,14vw,64px); }
  .intro { font-size:15px; }
  .form-row { flex-direction:column; padding:7px; }
  input { min-height:50px; }
  button { width:100%; }
  .features { margin-top:52px; grid-template-columns:1fr; gap:18px; }
  .features>div { justify-content:flex-start; width:160px; margin:auto; }
  footer { align-items:flex-start; gap:18px; }
  footer nav { gap:12px; flex-wrap:wrap; justify-content:flex-end; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
