*{box-sizing:border-box}
body{margin:0;font-family:Segoe UI,Arial;background:#0b0b0b;color:#f5f5f5}
a{text-decoration:none}
.topbar{
 position:fixed;top:0;left:0;right:0;height:64px;
 display:flex;align-items:center;justify-content:space-between;
 padding:0 32px;background:rgba(0,0,0,.85);z-index:1000
}
.logo{color:#f5c400;font-weight:900;letter-spacing:2px}
.nav a{margin-left:18px;color:#fff;font-size:.95rem}
.nav a.active{color:#f5c400}
.btn{background:#f5c400;color:#000;padding:8px 16px;border-radius:18px;font-weight:600}
.btn-outline{border:1px solid #f5c400;color:#f5c400;padding:8px 16px;border-radius:18px}
.hero{
 height:100vh;
 background:url('assets/images/banner.jpg') center/cover no-repeat;
 display:flex;align-items:center;justify-content:center;position:relative
}
.hero::after{
 content:'';position:absolute;inset:0;background:rgba(0,0,0,.45);
 pointer-events:none
}
.hero-content{position:relative;text-align:center}
.hero h1{font-size:4.2rem;color:#f5c400;margin:0}
.hero p{opacity:.9}
.section{padding:96px 32px;max-width:1200px;margin:auto}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.card{background:#141414;border-radius:16px;padding:24px}
.footer{padding:32px;text-align:center;color:#888}
.form{max-width:420px;margin:120px auto;background:#141414;padding:32px;border-radius:18px}
input,button{width:100%;padding:14px;margin-top:12px;border:none;border-radius:12px}
button{background:#f5c400;font-weight:700;cursor:pointer}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid #333;text-align:left}