:root { --navy:#1B2A4A; --teal:#00A99D; --gray:#F4F3F1; --text:#2B2B2B; --muted:#5F6368; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; color:var(--text); line-height:1.6; }
a { color:var(--teal); }
.wrap { max-width:960px; margin:0 auto; padding:0 24px; }
header { border-bottom:1px solid #e5e5e5; }
header .wrap { display:flex; align-items:center; justify-content:space-between; padding-top:16px; padding-bottom:16px; flex-wrap:wrap; gap:12px; }
nav a { color:var(--navy); text-decoration:none; margin-left:20px; font-size:15px; }
nav a.active { color:var(--teal); font-weight:600; }
.hero { background:var(--navy); color:#fff; padding:72px 0; }
.hero h1 { font-size:40px; line-height:1.2; margin:0 0 16px; }
.hero p { font-size:19px; max-width:680px; margin:0 0 28px; color:#E6EAF0; }
.page-head { background:var(--navy); color:#fff; padding:48px 0; }
.page-head h1 { font-size:34px; line-height:1.2; margin:0 0 10px; }
.page-head p { font-size:18px; max-width:700px; margin:0; color:#E6EAF0; }
.btn { display:inline-block; background:var(--teal); color:#fff; text-decoration:none; padding:14px 24px; border-radius:6px; font-weight:600; }
section { padding:48px 0; }
section.alt { background:var(--gray); }
h2 { color:var(--navy); font-size:26px; margin:0 0 16px; }
h3 { color:var(--navy); font-size:19px; margin:28px 0 8px; }
.prose { max-width:720px; }
ul, ol { padding-left:22px; }
li { margin-bottom:8px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:20px; }
.card { background:#fff; border:1px solid #e3e3e3; border-radius:8px; padding:20px; }
.card strong { color:var(--navy); display:block; margin-bottom:6px; }
a.card { text-decoration:none; color:var(--text); display:block; }
a.card:hover { border-color:var(--teal); }
table { border-collapse:collapse; width:100%; margin:12px 0 20px; }
th, td { text-align:left; padding:10px 12px; border-bottom:1px solid #e3e3e3; vertical-align:top; }
th { color:var(--navy); background:var(--gray); }
.tag { display:inline-block; font-size:13px; font-weight:600; padding:2px 10px; border-radius:12px; background:#E0F5F3; color:#00756D; }
.tag.gap { background:#FCEFE3; color:#9A4D00; }
.tag.partial { background:#EEF0F6; color:var(--navy); }
dl dt { font-weight:700; color:var(--navy); margin-top:22px; }
dl dd { margin:6px 0 0 0; }
dl dd .why { color:var(--muted); font-size:15px; }
details { border-bottom:1px solid #e3e3e3; padding:14px 0; }
summary { cursor:pointer; font-weight:600; color:var(--navy); }
details p { margin:10px 0 0; }
.note { color:var(--muted); font-size:14px; }
footer { background:var(--navy); color:#C9D1DC; padding:32px 0; font-size:14px; }
footer a { color:#fff; }
footer .links a { margin-right:16px; }
@media (max-width:600px) { .hero h1, .page-head h1 { font-size:28px; } nav a { margin-left:0; margin-right:16px; } }

/* BP-246: the menu and footer links wrap as whole links on phones */
nav a, footer .links a { white-space:nowrap; display:inline-block; }
@media (max-width:600px) { header nav { flex:1 1 100%; min-width:0; display:flex; flex-wrap:wrap; column-gap:16px; row-gap:2px; } header nav a { margin:0; } }

/* BP-253 menu: Reports, How we work, Sample, About, More, Request a report */
header nav { display:flex; flex-wrap:wrap; align-items:center; column-gap:20px; row-gap:8px; }
header nav a { margin:0; }
.nav-more { position:relative; border:0; padding:0; }
.nav-more summary { list-style:none; cursor:pointer; font-weight:400; font-size:15px; color:var(--navy); white-space:nowrap; }
.nav-more summary::-webkit-details-marker { display:none; }
.nav-more summary::after { content:" \25BE"; font-size:12px; }
.nav-more summary.active { color:var(--teal); font-weight:600; }
.nav-menu { position:absolute; right:0; top:calc(100% + 10px); background:#fff; border:1px solid #e3e3e3; border-radius:8px;
  box-shadow:0 8px 24px rgba(27,42,74,.14); padding:6px 0; min-width:180px; z-index:30; }
.nav-menu a { display:block; padding:8px 16px; }
.nav-menu a:hover { background:var(--gray); }
.nav-cta { background:var(--teal); color:#fff !important; font-weight:600; padding:8px 14px; border-radius:8px; }
@media (max-width:600px) {
  header nav { column-gap:16px; }
  .nav-more[open] { flex-basis:100%; }
  .nav-menu { position:static; box-shadow:none; border:0; border-left:2px solid var(--teal); border-radius:0; margin-top:6px; padding:0 0 0 12px; min-width:0; }
  .nav-menu a { padding:5px 0; }
}