:root{
  --black:#000000;
  --white:#ffffff;
  --aqua:#5fe3e0;
  --gold:#c9a24d;
  --gray:#f6f7f8;
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family: Arial, Helvetica, sans-serif;
  background:var(--white);
  color:var(--black);
  line-height:1.6;
}

a{color:inherit}

.header{
  background:var(--black);
  color:var(--white);
  position:sticky;
  top:0;
  z-index:50;
}
.nav{
  max-width:1100px;
  margin:0 auto;
  padding:16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  letter-spacing:.3px;
}
.brand .dot{
  width:10px;height:10px;border-radius:99px;background:var(--aqua);
  display:inline-block;
}
.menu a{
  text-decoration:none;
  margin-left:14px;
  font-weight:700;
  opacity:.95;
}
.menu a:hover{color:var(--aqua)}
.menu a.active{border-bottom:2px solid var(--gold); padding-bottom:6px}

.hero{
  background: radial-gradient(circle at 30% 20%, #7cf2ef 0%, var(--aqua) 45%, #35bdb9 100%);
  padding:72px 18px;
  text-align:center;
}
.hero-inner{
  max-width:900px;margin:0 auto;
}
.hero h1{font-size:40px;line-height:1.15;margin-bottom:10px}
.hero p{font-size:18px;margin-bottom:18px}
.badge{
  display:inline-block;
  background:rgba(0,0,0,.12);
  color:#000;
  padding:8px 12px;
  border-radius:999px;
  font-weight:800;
  margin-bottom:14px;
}

.btn{
  display:inline-block;
  text-decoration:none;
  padding:12px 18px;
  border-radius:10px;
  font-weight:900;
  letter-spacing:.2px;
}
.btn-gold{background:var(--gold); color:var(--black)}
.btn-outline{
  border:2px solid var(--black);
  margin-left:10px;
}
.btn:hover{transform:translateY(-1px)}
.small{font-size:14px;opacity:.9}

.section{
  max-width:1100px;
  margin:0 auto;
  padding:54px 18px;
}
.section h2{font-size:28px;margin-bottom:12px}
.muted{color:#333;opacity:.9}

.grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
  margin-top:18px;
}
.card{
  background:var(--black);
  color:var(--white);
  padding:18px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
}
.card h3{font-size:18px;margin-bottom:6px}
.card p{opacity:.92;font-size:14px}

.split{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:start;
  margin-top:18px;
}
.panel{
  background:var(--gray);
  padding:18px;
  border-radius:14px;
  border:1px solid #e7eaee;
}

.black-band{
  background:var(--black);
  color:var(--white);
}
.black-band .section{padding:44px 18px}
.pills{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:12px
}
.pill{
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  padding:8px 12px;
  font-weight:800;
  font-size:13px;
}
.pill strong{color:var(--aqua)}

.form{
  max-width:720px;
  margin-top:18px;
}
label{font-weight:800;display:block;margin:10px 0 6px}
input,select,textarea{
  width:100%;
  padding:12px;
  border-radius:10px;
  border:1px solid #d7dde3;
  font-size:15px;
}
textarea{min-height:120px;resize:vertical}
button{
  width:100%;
  margin-top:12px;
  padding:13px;
  border:0;
  border-radius:10px;
  font-weight:900;
  background:var(--gold);
  cursor:pointer;
}

.footer{
  background:var(--black);
  color:var(--white);
  padding:24px 18px;
  text-align:center;
}
.footer a{color:var(--aqua); text-decoration:none}

@media (max-width:900px){
  .grid{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .hero h1{font-size:32px}
  .menu a{margin-left:10px}
}