/* Minimal, readable styles */
:root{
  --maxw: 1100px;
  --space: 1rem;
  --radius: 14px;
}

*{box-sizing:border-box}
html,body{margin:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Arial,sans-serif; line-height:1.6}

.container{max-width:var(--maxw); margin:auto; padding:0 1rem}

.site-header{position:sticky; top:0; background:#fff; border-bottom:1px solid #eee}
.nav{display:flex; align-items:center; gap:1rem; padding:0.75rem 0}
.brand{font-weight:700; text-decoration:none}
#menuBtn{margin-left:auto}
.links{display:flex; list-style:none; gap:1rem; margin:0; padding:0}
.links a{text-decoration:none}
@media (max-width:700px){
  .links{display:none; flex-direction:column}
  .links.open{display:flex}
}

.hero{padding:4rem 0 2rem}
.hero h1{font-size:clamp(2rem,6vw,3rem); margin:0 0 0.5rem}
.btn{display:inline-block; padding:0.6rem 1rem; border-radius:999px; border:1px solid #111; text-decoration:none}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; margin:2rem 0}
.card{background:#fafafa; border:1px solid #eee; padding:1rem; border-radius:var(--radius)}
.stack{display:grid; gap:0.75rem}
input,textarea{width:100%; padding:0.6rem; border:1px solid #ddd; border-radius:10px}
.site-footer{border-top:1px solid #eee; margin-top:3rem; padding:1rem 0; color:#444}
.note{color:#555; font-size:0.9rem}