@layer base{html, body{margin:0;padding:0}body{flex-direction:column;min-height:100vh;display:flex}header{position:sticky;top:0;background:var(--bg);z-index:100}header .header-inner{max-width:1200px;margin:0 auto;padding:1rem 3rem;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box}header nav{display:flex;align-items:center;gap:1em}header nav a{color:var(--text-primary);text-decoration:none;font-size:1rem;transition:opacity 0.2s;&:hover{opacity:0.7}&[aria-current="page"]{color:var(--text-primary)}}header .logo{display:flex;align-items:center}header .logo img{height:32px;width:auto}header .social{display:flex;align-items:center;gap:1em}header .social a{color:var(--text-primary);transition:opacity 0.2s;&:hover{opacity:0.7}}header .social svg{width:20px;height:20px;fill:currentColor}main{flex:1;width:100%;max-width:1000px;margin:0 auto;padding:var(--l) 2rem;box-sizing:border-box}article{max-width:900px;margin:0 auto}.hero{text-align:center;max-width:900px;margin:0 auto var(--xl);padding:var(--xl) 0}.hero h1{font-size:1.5rem;font-weight:400;color:#fff !important;margin-bottom:var(--m)}.hero p{font-size:1rem;color:#fff !important;max-width:600px;margin:0 auto}footer{display:flex;align-items:center;justify-content:center;padding:var(--m) 2rem;color:var(--text-muted);font-size:0.875rem;box-sizing:border-box}}