:root{
  --bg:#0d1117; --panel:#111827; --muted:#9aa4b2; --text:#e6edf3; --brand:#3b82f6; --brand-d:#1e60c4; --accent:#ff9900;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,Arial,Segoe UI,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
a{color:var(--brand);text-decoration:none}
a:hover{color:var(--brand-d)}
.header{display:flex;gap:2rem;align-items:center;justify-content:space-between;padding:1rem 2rem;background:#0b1220;border-bottom:1px solid #1f2937}
.logo{font-weight:700;letter-spacing:.2px}
.nav a{margin:0 .75rem;color:#cbd5e1}
.nav a.active, .nav a:hover{color:#fff}
.container{max-width:1100px;margin:0 auto;padding:2rem}
.hero{padding:4rem 2rem;background:linear-gradient(135deg,#0b1220,#13233f);text-align:center;border-bottom:1px solid #1f2937}
.hero h1{margin:0 0 .5rem;font-size:2.2rem}
.hero p{margin:.5rem auto 1.5rem;color:var(--muted);max-width:700px}
.btn{display:inline-block;background:var(--brand);color:#fff;padding:.7rem 1.1rem;border-radius:.6rem;font-weight:600}
.btn:hover{background:var(--brand-d)}
.grid{display:grid;gap:1.25rem}
.cards{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:var(--panel);border:1px solid #1f2937;border-radius:1rem;padding:1.25rem}
.card h3{margin:.5rem 0}
.card p{color:var(--muted);margin:.25rem 0 .75rem}
.card img{width:100%;height:160px;object-fit:cover;border-radius:.6rem;border:1px solid #1f2937;background:#0b1220}
.footer{padding:2rem;color:#9aa4b2;border-top:1px solid #1f2937;text-align:center}
.list li{margin:.4rem 0}
.kicker{font-size:.9rem;color:var(--muted);margin:.25rem 0 1rem}
.notice{font-size:.85rem;color:#94a3b8}
.form{max-width:560px}
.input, textarea{width:100%;padding:.8rem;border-radius:.5rem;border:1px solid #263245;background:#0b1220;color:#e6edf3}
textarea{min-height:140px;resize:vertical}
label{display:block;margin:.75rem 0 .35rem;color:#cbd5e1}
hr{border:0;border-top:1px solid #1f2937;margin:1.5rem 0}
.small{font-size:.85rem;color:#9aa4b2}
.badge{display:inline-block;font-size:.75rem;color:#0b1220;background:#93c5fd;padding:.2rem .5rem;border-radius:.35rem;margin-left:.4rem}
.hero img {
  display: block;
  width: 80%;
  max-width: 1000px;
  height: auto;
  margin: 0 auto;
  border-radius: 12px;
}