.nav { background: rgba(7,9,15,.6); }
.dl-hero {
  position: relative; min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  padding: 90px 20px 40px; overflow: hidden;
  background:
    radial-gradient(ellipse at 25% 15%, #2b1e4e 0%, transparent 55%),
    radial-gradient(ellipse at 80% 30%, #3b1d5e 0%, transparent 50%),
    radial-gradient(ellipse at 50% 110%, #14532d 0%, transparent 60%),
    var(--bg);
}
.dl-canvas { position: absolute; inset: 0; z-index: 0; }
#particles { width: 100%; height: 100%; }

.dl-content { position: relative; z-index: 1; text-align: center; max-width: 640px; }
#dl-logo { max-height: 150px; filter: drop-shadow(0 12px 40px rgba(0,0,0,.7)); margin-bottom: 6px; }
.dl-logo-text { font-weight: 900; font-size: 56px; letter-spacing: 3px; transform: rotate(-3deg); line-height: .95; }
.dl-logo-text span { display: block; }

.dl-content h1 { font-size: clamp(28px, 5vw, 42px); font-weight: 900; margin: 18px 0 10px; }
.dl-sub { color: var(--muted); font-size: 15px; line-height: 1.6; margin-bottom: 30px; }

.dl-btn {
  display: inline-flex; align-items: center; gap: 14px; text-decoration: none;
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color: #052e16; padding: 16px 34px; border-radius: 14px;
  transition: transform .15s, box-shadow .2s;
}
.dl-btn:hover { transform: translateY(-3px); box-shadow: 0 14px 40px rgba(74,222,128,.35); }
.dl-ic { font-size: 26px; }
.dl-btn b { display: block; font-size: 17px; font-weight: 800; }
.dl-btn small { display: block; font-size: 12px; opacity: .8; font-weight: 600; }

.dl-steps {
  display: flex; gap: 16px; justify-content: center; flex-wrap: wrap;
  margin: 42px auto 30px; max-width: 620px;
}
.step {
  flex: 1; min-width: 160px;
  background: var(--panel); border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px; padding: 20px 16px;
}
.step span {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 50%;
  background: rgba(74,222,128,.15); color: var(--accent);
  font-weight: 900; margin-bottom: 10px;
}
.step p { font-size: 13px; color: #cbd5e1; line-height: 1.5; }

.dl-req {
  display: flex; gap: 20px; justify-content: center; flex-wrap: wrap;
  font-size: 12.5px; color: var(--muted);
}

footer {
  position: relative; z-index: 1;
  padding: 24px 20px 30px; border-top: 1px solid rgba(255,255,255,.06);
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  color: var(--muted); font-size: 13px;
}
footer b { font-weight: 900; }
.foot-note { font-size: 11px; opacity: .6; }