:root{
  --red:#d61f2c;
  --green:#1fa463;
  --black:#05070d;
  --gray:#111827;
  --text:#e5e7eb;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:'Inter',system-ui,Arial;
  background:linear-gradient(180deg,#020617,#05070d);
  color:var(--text);
}
a{text-decoration:none;color:inherit}
.container{max-width:1200px;margin:auto;padding:24px}
header{background:#020617;border-bottom:2px solid var(--red)}
.nav{display:flex;justify-content:space-between;align-items:center}
.nav a{margin-left:18px;font-weight:600}
.logo{font-size:22px;letter-spacing:.5px}
.logo span{color:var(--red)}
.hero{
  background:url('/assets/images/hero-performance.jpg') center/cover no-repeat;
  min-height:70vh;
  display:flex;
  align-items:center;
}
.hero-overlay{
  background:rgba(0,0,0,.65);
  padding:60px;
  border-left:6px solid var(--red);
}
.btn{
  background:var(--red);
  padding:12px 22px;
  border-radius:6px;
  display:inline-block;
  font-weight:700;
}
.btn.alt{background:var(--green)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.card{
  background:#020617;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.4);
}
.card img{width:100%;height:200px;object-fit:cover}
.card-body{padding:16px}
.badge{
  background:var(--green);
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  display:inline-block;
}
section{margin:80px 0}
footer{
  background:#020617;
  border-top:2px solid var(--green);
}