:root{
  --navy:#142235;
  --charcoal:#2f343a;
  --gold:#b89a5b;
  --white:#ffffff;
  --soft:#f4f5f6;
  --line:#d9dde2;
  --text:#1f2933;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  background:linear-gradient(180deg,#f7f8fa 0%,#eef1f4 100%);
  color:var(--text);
}
.page-shell{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px 16px;
}
.card{
  width:min(760px,100%);
  background:var(--white);
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 18px 45px rgba(20,34,53,.12);
  padding:34px;
}
.brand{
  color:var(--navy);
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:.92rem;
}
.tagline{
  color:var(--gold);
  font-weight:700;
  margin:6px 0 22px;
}
h1,h2{
  color:var(--navy);
  margin:0 0 16px;
}
h1{font-size:clamp(2rem,5vw,3rem);line-height:1.05}
h2{font-size:clamp(1.55rem,4vw,2.15rem);line-height:1.15}
p{line-height:1.6}
.meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:18px 0;
}
.pill{
  background:var(--soft);
  border:1px solid var(--line);
  border-radius:999px;
  padding:8px 12px;
  font-size:.92rem;
}
.btn{
  appearance:none;
  border:none;
  border-radius:10px;
  padding:14px 18px;
  font-size:1rem;
  font-weight:700;
  cursor:pointer;
}
.btn-primary{
  background:var(--navy);
  color:#fff;
}
.btn-primary:hover{filter:brightness(1.08)}
.btn-secondary{
  background:#fff;
  color:var(--navy);
  border:1px solid var(--navy);
}
.answers{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:22px;
}
.answer{
  background:#fff;
  color:var(--navy);
  border:1px solid var(--line);
  border-radius:12px;
  padding:16px;
  font-weight:700;
  cursor:pointer;
  text-align:left;
}
.answer:hover,.answer:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(184,154,91,.15);
}
.progress-wrap{margin-bottom:24px}
.progress-row{
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:.92rem;
  color:#59636e;
  margin-bottom:8px;
}
.progress{
  height:10px;
  background:#edf0f2;
  border-radius:999px;
  overflow:hidden;
}
.progress > span{
  display:block;
  height:100%;
  background:var(--gold);
}
.disclaimer{
  margin-top:24px;
  padding-top:16px;
  border-top:1px solid var(--line);
  color:#626b75;
  font-size:.88rem;
  line-height:1.5;
}
.result-box{
  border-left:6px solid var(--gold);
  background:#faf8f2;
  padding:18px 18px 18px 20px;
  border-radius:10px;
  margin:20px 0;
}
.contact-box{
  margin-top:28px;
  padding-top:24px;
  border-top:1px solid var(--line);
}
.field{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:12px 0;
}
.field input{
  padding:12px 13px;
  border:1px solid var(--line);
  border-radius:8px;
  font-size:1rem;
}
.small{font-size:.9rem;color:#626b75}
.hidden{display:none!important}
.notice{
  margin-top:12px;
  font-size:.9rem;
  color:#626b75;
}
@media (max-width:640px){
  .card{padding:24px 18px;border-radius:12px}
  .answers{grid-template-columns:1fr}
}