:root{
  --ink:#101114;
  --paper:#F6F7F9;
  --card:#FFFFFF;
  --accent:#6C4EE6;
  --muted:#6B7280;
  --border:#E5E7EB;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:var(--ink);background:var(--paper)}
.container{min-height:100vh;display:flex;flex-direction:column}
.header,.footer{width:100%}
.header-inner,.main-inner,.footer-inner{max-width:900px;margin:0 auto;padding:20px 24px}
.header{border-bottom:1px solid var(--border);background:#fff8;backdrop-filter:saturate(180%) blur(6px)}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:36px;width:auto;display:block;border-radius:6px}
.brand-title{font-weight:700;letter-spacing:0.2px}
.main{flex:1;display:flex;align-items:center}
.hero{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:36px;box-shadow:0 8px 24px rgba(16,17,20,0.06)}
h1{margin:0 0 12px 0;font-size:42px;line-height:1.08;letter-spacing:-0.5px}
h1 .accent{color:var(--accent)}
.sub{margin:0 0 16px 0;font-size:18px;color:var(--ink)}
.bodycopy{color:var(--muted);font-size:16px;line-height:1.6;margin-bottom:24px}
.cta{display:inline-block;background:var(--accent);color:white;text-decoration:none;padding:12px 16px;border-radius:12px;font-weight:600;transition:transform .06s ease, opacity .2s ease}
.cta:hover{opacity:.92; transform:translateY(-1px)}
.cta:active{transform:translateY(0)}
.divider{height:1px;background:var(--border);margin:28px 0}
.footer{border-top:1px solid var(--border);background:#fff;color:var(--muted);font-size:13px}
.footer-actions{display:flex;justify-content:center;padding:16px 0}
.footer-actions .cta{background:#101114}