@import 'variables.css';
body{margin:0;font-family:system-ui,sans-serif;background:var(--bg);color:var(--text)}
.container{max-width:var(--max);margin:auto;padding:0 24px}
header{position:sticky;top:0;background:#fff;border-bottom:1px solid #ddd}
nav{display:flex;justify-content:space-between;align-items:center;padding:18px 0}
nav a{margin-left:18px;color:var(--text);text-decoration:none}
.hero{padding:90px 0;background:linear-gradient(135deg,#eef5ff,#fff)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.card{background:#fff;padding:24px;border-radius:12px;box-shadow:0 4px 18px rgba(0,0,0,.08)}
.btn{display:inline-block;background:var(--accent);color:#fff;padding:12px 18px;border-radius:8px;text-decoration:none}
footer{background:var(--primary);color:#fff;padding:40px 0;margin-top:60px}
.logo-box{width:170px;height:48px;border:2px dashed #999;display:flex;align-items:center;justify-content:center}