body { background: #000; }

.hiu-page {
  background: radial-gradient(circle at top center, rgba(214,179,106,.12), transparent 36%), linear-gradient(180deg,#020202 0%,#000 100%);
  color: #fff;
  padding: 70px 22px;
}

.hiu-panel {
  max-width: 1040px;
  margin: 0 auto;
  background: #050505;
  border: 1px solid rgba(214,179,106,.35);
  padding: 42px;
}

.hiu-kicker {
  color: #b8924e;
  font-size: 12px;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin: 0 0 18px;
}

.hiu-panel h1 {
  color: #d6b36a;
  font-size: clamp(38px, 6vw, 68px);
  line-height: 1;
  font-weight: 500;
  margin: 0 0 22px;
}

.hiu-intro {
  max-width: 760px;
  color: #cfc7b8;
  font-size: 17px;
  line-height: 1.75;
  margin-bottom: 34px;
}

.hiu-form label {
  display: block;
  color: #b8924e;
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 18px 0 8px;
}

.hiu-form input[type="file"], .hiu-form select {
  width: 100%;
  background: #000;
  color: #fff;
  border: 1px solid rgba(214,179,106,.35);
  padding: 14px;
}

.hiu-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 18px;
  margin-top: 14px;
}

.hiu-form button, .hiu-download-all, .hiu-output-card a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 28px;
  background: #d6b36a;
  color: #000;
  border: 1px solid #d6b36a;
  padding: 14px 20px;
  text-decoration: none;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .22s ease;
}

.hiu-form button:hover, .hiu-download-all:hover, .hiu-output-card a:hover {
  background: transparent;
  color: #d6b36a;
}

.hiu-results {
  margin-top: 46px;
  border-top: 1px solid rgba(214,179,106,.25);
  padding-top: 34px;
}

.hiu-results h2 {
  color: #d6b36a;
  font-weight: 500;
}

.hiu-output-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 22px;
  margin-top: 28px;
}

.hiu-output-card {
  border: 1px solid #242424;
  background: #020202;
  padding: 14px;
}

.hiu-output-card img {
  width: 100%;
  height: auto;
  display: block;
  background: #111;
}

.hiu-output-card a {
  width: 100%;
  margin-top: 14px;
  box-sizing: border-box;
}

.hiu-error, .hiu-warning {
  border: 1px solid rgba(214,179,106,.35);
  background: rgba(214,179,106,.08);
  color: #f2dfb2;
  padding: 14px;
  margin: 18px 0;
}

@media (max-width: 760px) {
  .hiu-page { padding: 46px 18px; }
  .hiu-panel { padding: 28px 22px; }
  .hiu-grid { grid-template-columns: 1fr; }
}