:root{
  --navy:#0A2540;
  --blue:#3B82D6;
  --blue-deep:#2A6BB8;
  --slate:#4A6A8A;
  --mist:#A0B4C7;
  --sky:#E8F1FC;
  --sky-soft:#CDE3FA;
  --edge:#C7D5E0;

  --paper:#F6FAFE;
  --white:#FFFFFF;
  --line:rgba(10,37,64,.12);

  --display:'Unbounded',system-ui,sans-serif;
  --body:'Onest',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--paper);
  color:var(--navy);
  font-family:var(--body);
  font-size:16.5px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

.wrap{max-width:1140px;margin:0 auto;padding:0 28px}

.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(246,250,254,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{
  font-family:var(--display);font-weight:800;font-size:21px;
  letter-spacing:-.02em;text-decoration:none;color:var(--navy);
}
.brand span{color:var(--blue)}
.back{
  color:var(--slate);text-decoration:none;font-size:14.5px;font-weight:500;
  transition:color .2s;
}
.back:hover{color:var(--blue)}

.doc{max-width:760px;margin:0 auto;padding:64px 28px 100px}

.doc-kicker{
  font-family:var(--mono);font-size:11.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--blue);
  margin-bottom:20px;
}
.doc h1{
  font-family:var(--display);font-weight:600;
  font-size:clamp(28px,4vw,42px);line-height:1.12;
  letter-spacing:-.03em;margin-bottom:14px;
}
.doc-date{
  font-family:var(--mono);font-size:13px;color:var(--slate);
  padding-bottom:34px;margin-bottom:40px;border-bottom:1px solid var(--line);
}

.doc h2{
  font-family:var(--display);font-weight:600;font-size:21px;
  letter-spacing:-.025em;margin:48px 0 16px;line-height:1.25;
}
.doc h2:first-of-type{margin-top:0}

.doc h3{
  font-family:var(--body);font-weight:600;font-size:17px;
  margin:28px 0 10px;
}

.doc p{margin-bottom:14px;color:var(--slate)}
.doc p strong{color:var(--navy);font-weight:600}

.doc ul{margin:0 0 18px 0;padding-left:0;list-style:none}
.doc li{color:var(--slate);margin-bottom:9px;padding-left:22px;position:relative}
.doc li::before{
  content:"";position:absolute;left:4px;top:11px;
  width:5px;height:5px;border-radius:50%;background:var(--blue);
}

.doc table{width:100%;border-collapse:collapse;margin:20px 0 26px;font-size:15px}
.doc th{
  text-align:left;font-family:var(--mono);font-size:11px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--mist);
  padding:0 14px 10px 0;border-bottom:1.5px solid var(--edge);
}
.doc td{
  padding:13px 14px 13px 0;border-bottom:1px solid var(--line);
  color:var(--slate);vertical-align:top;
}
.doc td:last-child,.doc th:last-child{padding-right:0}

.doc a{color:var(--blue);text-decoration:none;border-bottom:1px solid rgba(59,130,214,.35)}
.doc a:hover{border-bottom-color:var(--blue)}

.callout{
  background:var(--sky);border-radius:16px;padding:22px 24px;
  border:1px solid var(--sky-soft);margin:24px 0;
}
.callout p{color:var(--navy)}
.callout p:last-child{margin-bottom:0}

.reqs{
  background:var(--navy);color:#fff;border-radius:20px;
  padding:30px 32px;margin-top:44px;
}
.reqs h2{color:#fff;margin:0 0 14px;font-size:18px}
.reqs p{color:var(--sky-soft);margin-bottom:5px;font-size:15px}
.reqs a{color:#fff;border-bottom-color:rgba(255,255,255,.4)}

footer{border-top:1px solid var(--line);padding:40px 0 52px;background:var(--white)}
.foot{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;font-size:14px}
.foot a{color:var(--navy);text-decoration:none;margin-left:24px}
.foot a:first-child{margin-left:0}
.foot a:hover{color:var(--blue)}
.foot-l{color:var(--slate)}

a:focus-visible{outline:2.5px solid var(--blue);outline-offset:3px;border-radius:3px}

@media(max-width:620px){
  .doc{padding:44px 24px 72px}
  .doc table{font-size:14px}
  .foot{flex-direction:column;gap:14px}
  .foot a{margin-left:0;margin-right:20px}
}