*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Arial,Helvetica,sans-serif;background:#0b0d10;color:#e6e6e6}
.navbar{display:flex;justify-content:space-between;align-items:center;padding:15px 30px;background:#050607;border-bottom:2px solid #7a1414}
.nav-brand{font-weight:bold;letter-spacing:2px}
.nav-links{list-style:none;display:flex;gap:20px}
.nav-links a{color:#e6e6e6;text-decoration:none;font-weight:bold}
.nav-links a:hover,.active{color:#c62828}
.nav-join{border:1px solid #7a1414;padding:6px 12px}
.hero{background:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url('images/hero.jpg') center/cover no-repeat;height:70vh;display:flex;align-items:center;justify-content:center;text-align:center}
.hero h1{font-size:3rem;letter-spacing:3px}
.hero p{margin:20px 0}
.btn{background:#7a1414;padding:14px 30px;color:white;text-decoration:none;font-weight:bold}
.section{padding:60px 40px}
.narrow{max-width:800px;margin:auto}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.two-col img{width:100%;border:2px solid #333}
.styled-list li{margin-bottom:10px}
.footer{text-align:center;padding:20px;background:#050607;border-top:2px solid #333;font-size:.9rem}

.pipeline {
  display: flex;
  justify-content: space-between;
  margin: 30px 0;
}
.pipeline div {
  border: 2px solid #7a1414;
  padding: 15px;
  width: 18%;
  text-align: center;
  font-weight: bold;
}
.discord-box {
  margin-top: 40px;
  border: 2px solid #333;
  padding: 20px;
}
.note {
  font-size: 0.85rem;
  color: #aaa;
}

.unit-logo {
  width: 90px;
  margin-bottom: 20px;
}
.school-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-top: 40px;
}
.school-grid a {
  border: 2px solid #7a1414;
  padding: 20px;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
}
.school-grid a:hover {
  background: #7a1414;
}
.lead {
  font-size: 1.1rem;
  margin-bottom: 30px;
}