*{margin:0;padding:0;box-sizing:border-box}
body{font-family:system-ui,Arial,sans-serif;color:#1c2a36;line-height:1.6;background:#f6f4ef}
header{background:#0f2230;color:#fff;position:sticky;top:0}
.bar{max-width:900px;margin:0 auto;padding:.9rem 1.3rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{font-weight:700;font-size:1.2rem;letter-spacing:1px;color:#d99a2b;text-decoration:none}
nav ul{list-style:none;display:flex;gap:.3rem}
nav a{color:#c4d1dc;text-decoration:none;padding:.5rem .9rem;border-radius:7px;font-size:.95rem;font-weight:600}
nav a:hover{background:rgba(255,255,255,.1);color:#fff}
nav a.active{background:#d99a2b;color:#0f2230}
.burger{display:none;background:none;border:none;color:#fff;font-size:1.4rem;cursor:pointer}
main{max-width:900px;margin:0 auto;padding:3rem 1.3rem}
h1{font-size:2rem;margin-bottom:1rem;color:#0f2230}
.tag{display:inline-block;background:#0f2230;color:#d99a2b;font-size:.75rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:.3rem .7rem;border-radius:999px;margin-bottom:1rem}
p{color:#56646f;margin-bottom:1rem;max-width:60ch}
.ok{margin-top:2rem;padding:1rem 1.2rem;background:#e7f0e4;border-left:4px solid #3f7a33;border-radius:6px;color:#2f5a27;font-size:.95rem}
@media(max-width:640px){
  nav ul{position:absolute;top:100%;left:0;right:0;flex-direction:column;background:#0f2230;padding:.5rem;display:none}
  nav ul.open{display:flex}
  nav a{padding:.8rem 1rem}
  .burger{display:block}
}