*{box-sizing:border-box;margin:0;padding:0}
:root{
  --navy:#0f2747;
  --blue:#1d4f91;
  --soft:#eef4fb;
  --text:#132238;
  --muted:#526173;
  --line:#d7e1ee;
}
body{
  min-height:100vh;
  font-family: "Segoe UI", Arial, sans-serif;
  color:var(--text);
  background:
    linear-gradient(135deg, rgba(29,79,145,.06), rgba(15,39,71,.02)),
    #f5f8fc;
}
.layout{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:28px;
}
.panel{
  width:min(780px, 100%);
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 18px 50px rgba(15,39,71,.08);
  padding:0 42px 36px;
}
.topbar{
  height:8px;
  background:linear-gradient(90deg, var(--navy), var(--blue));
  margin:0 -42px 28px;
}
.kicker{
  color:var(--blue);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.82rem;
  margin-bottom:12px;
  font-weight:700;
}
h1{
  font-size:clamp(2rem, 4.6vw, 3.5rem);
  line-height:1.08;
  letter-spacing:-.03em;
}
h2{
  margin-top:10px;
  font-size:1.28rem;
  color:var(--navy);
  font-weight:600;
}
.body-copy{
  margin-top:18px;
  color:var(--muted);
  line-height:1.75;
  max-width:60ch;
}
.status-box{
  margin-top:28px;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:16px;
}
.status-box > div{
  background:var(--soft);
  border:1px solid var(--line);
  padding:18px;
}
.small-label{
  display:block;
  font-size:.78rem;
  color:#6b7a8c;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin-bottom:8px;
}
strong{
  font-size:1rem;
  color:var(--navy);
}
.timeline{margin-top:28px}
.timeline-head{
  display:flex;
  justify-content:space-between;
  color:var(--muted);
  margin-bottom:10px;
}
.timeline-bar{
  height:10px;
  background:#e9eef5;
  border-radius:999px;
  overflow:hidden;
}
.timeline-bar span{
  display:block;
  width:65%;
  height:100%;
  background:linear-gradient(90deg, var(--navy), var(--blue));
}
footer{
  margin-top:34px;
  padding-top:18px;
  border-top:1px solid var(--line);
  color:#738295;
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:.92rem;
}
@media (max-width:640px){
  .panel{padding:0 24px 28px}
  .topbar{margin:0 -24px 24px}
  .status-box{grid-template-columns:1fr}
  footer{flex-direction:column}
}