:root{
  --bg:#181c24;
  --panel:#232a36;
  --card:#222733;
  --text:#fff;
  --muted:#b8c3e6;
  --line:rgba(255,255,255,.16);
  --brand:#F4DB7D;
  --brand2:#1A2238;
  --radius: 18px;
  --max: 1120px;
  --pad: 20px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: 'Segoe UI', Arial, Helvetica, sans-serif;
  background: linear-gradient(120deg, #232a36 0%, #181c24 100%);
  color:var(--text);
  line-height:1.6;
  min-height:100vh;
}
a{color:inherit}
main{max-width:var(--max);margin:0 auto;padding:0 var(--pad) 60px}
.hero{padding:48px 0 10px}
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--brand2);
  border-bottom: 2px solid var(--brand);
  box-shadow: 0 2px 8px 0 rgba(0,0,0,0.04);
}
.header-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: var(--max);
  margin: 0 auto;
  padding: 10px var(--pad);
}
.logo-link {
  display: flex;
  align-items: center;
  text-decoration: none;
}
.logo-img {
  display: block;
  height: 40px;
}
.nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 18px;
  align-items: center;
  flex-wrap: wrap;
}
.nav a {
  text-decoration: none;
  color: var(--text);
  font-weight: 500;
  opacity: 0.96;
  transition: color 0.2s, opacity 0.2s;
}
.nav a:hover {
  color: var(--brand);
  opacity: 1;
}
.footer {
  border-top: 2px solid var(--brand);
  background: var(--panel);
  color: var(--text);
  padding: 36px 0 24px;
  margin-top: 48px;
}
.footer-flex {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 var(--pad);
  display: flex;
  gap: 32px;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: flex-start;
}
.footer-brand {
  min-width: 220px;
  margin-bottom: 12px;
}
.footer-muted {
  color: var(--muted);
  font-size: 0.98em;
  margin-bottom: 2px;
}
.footer-links {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 140px;
}
.footer-links a {
  color: var(--text);
  text-decoration: none;
  opacity: 0.92;
  font-weight: 500;
  transition: color 0.2s, opacity 0.2s;
}
.footer-links a:hover {
  color: var(--brand);
  opacity: 1;
}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:14px 0}
.card{
  display:block;
  padding:18px 16px;
  border:2px solid var(--line);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(34,39,51,.92), rgba(34,39,51,.7));
  text-decoration:none;
  color:var(--text);
  box-shadow:0 2px 8px 0 rgba(0,0,0,0.04);
  transition: border 0.2s, box-shadow 0.2s, color 0.2s;
}
.card:hover{
  border:2px solid var(--brand);
  color:var(--brand);
  box-shadow:0 4px 16px 0 rgba(244,219,125,0.08);
  transform:translateY(-2px) scale(1.01);
}
.card span{display:block;margin-top:8px;opacity:.92}
.btn{
  display:inline-block;
  padding:12px 22px;
  border-radius:14px;
  text-decoration:none;
  border:2px solid var(--brand);
  background:var(--brand);
  color:var(--brand2);
  font-weight:700;
  font-size:1.08em;
  letter-spacing:.02em;
  box-shadow:0 2px 8px 0 rgba(244,219,125,0.08);
  transition: background 0.2s, color 0.2s, border 0.2s;
}
.btn:hover{
  background:var(--brand2);
  color:var(--brand);
  border:2px solid var(--brand);
}
.btn.secondary{
  background:transparent;
  color:var(--brand);
  border:2px solid var(--brand);
  opacity:1;
}
.btn.secondary:hover{
  background:var(--brand);
  color:var(--brand2);
}
.cta-row{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.badge{border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:8px 12px;font-size:.92rem}
.grid-2{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;align-items:start}
@media (max-width: 900px){.grid-2{grid-template-columns:1fr}}
.faq dt{font-weight:700;margin-top:12px}
.faq dd{margin:6px 0 0 0;opacity:.92}
.minor-links{margin-top:10px;opacity:.9}
.cta-band{margin-top:40px;padding:22px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(15,26,51,.35)}
/* Forms */
.form{border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:16px;background:rgba(15,26,51,.35)}
.form label{display:block;margin:10px 0}
.form input,.form select,.form textarea{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.14);
  background:transparent;
  color:inherit;
}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width: 700px){.row{grid-template-columns:1fr}}
.fieldset{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:12px;margin:12px 0}
.fieldset legend{padding:0 8px}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width: 700px){.checks{grid-template-columns:1fr}}
.hint{margin:6px 0 0 0;opacity:.85;font-size:.95rem}
.consent{margin-top:10px;display:flex;gap:10px;align-items:flex-start}
.consent input{width:auto;margin-top:3px}
.status{margin-top:10px;opacity:.9}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
/* Downloads */
.downloads{display:grid;gap:10px;margin-top:10px}
.download{display:block;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);text-decoration:none}
.download:hover{transform:translateY(-1px)}
code{opacity:.9}


/* Extra utility classes for direct-upload build */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}

@media (max-width: 700px) {
  .header-flex, .footer-flex {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }
  .footer-links {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 14px;
  }
  .logo-img {
    height: 32px;
  }
}
.section{padding:18px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.muted{opacity:.9}