:root{
  --bg:#f8f7ff;--card:#fff;--text:#101828;--muted:#667085;--primary:#6d28d9;
  --primary2:#2563eb;--border:#ece7ff;--soft:#ede9fe;--shadow:0 18px 45px rgba(109,40,217,.13);
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;background:radial-gradient(circle at 12% 10%,#f0e7ff 0,transparent 30%),var(--bg);color:var(--text)}
a{text-decoration:none;color:inherit}
.container{width:min(980px,92%);margin:0 auto}
.navbar{background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.nav-inner{height:76px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;gap:8px;align-items:center}
.brand-logo{font-size:30px;font-weight:950;background:linear-gradient(135deg,var(--primary),var(--primary2));-webkit-background-clip:text;color:transparent}
.brand-text{font-weight:900}
.nav-links{display:flex;gap:24px}
.nav-links a{color:var(--muted);font-weight:850}
.nav-links a:hover{color:var(--primary)}
.hero{padding:64px 0 24px}
.hero-box{background:linear-gradient(135deg,#fff,#f3efff);border:1px solid var(--border);border-radius:32px;padding:34px;box-shadow:var(--shadow)}
.eyebrow{display:inline-flex;color:var(--primary);background:#efe9ff;padding:9px 14px;border-radius:999px;font-size:12px;font-weight:900}
h1{font-size:clamp(34px,4.6vw,54px);margin:14px 0 10px;letter-spacing:-1px}
p,li{color:var(--muted);line-height:1.75}
.content{background:#fff;border:1px solid var(--border);border-radius:28px;padding:30px;box-shadow:0 10px 30px rgba(16,24,40,.08);margin:22px 0 70px}
.content h2{margin-top:28px;color:#24124d}
.content h2:first-child{margin-top:0}
.notice{background:#fff7ed;border:1px solid #fed7aa;border-radius:18px;padding:18px;color:#9a3412;font-weight:750}
.footer{text-align:center;color:var(--muted);padding:28px}
@media(max-width:760px){.nav-links{display:none}.content,.hero-box{padding:22px}}