:root{
  --bg:#FBFBF9; --surface:#FFFFFF; --ink:#16191E; --muted:#5A6270; --faint:#8A929E;
  --line:#E5E6E1; --accent:#0F6E52; --accent-soft:#E8F2EE;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:900px; margin:0 auto; padding:0 24px}
a{color:var(--accent)}

header.site{border-bottom:1px solid var(--line); background:var(--surface)}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:18px; padding-bottom:18px; flex-wrap:wrap}
.brand{font-weight:700; font-size:20px; letter-spacing:-.01em; text-decoration:none; color:var(--ink)}
.brand span{color:var(--accent)}
nav a{margin-left:22px; text-decoration:none; color:var(--muted); font-size:15px}
nav a:hover{color:var(--ink)}
@media(max-width:560px){nav{width:100%} nav a{margin:0 20px 0 0}}

.hero{padding:64px 0 48px}
h1{font-size:clamp(30px,5vw,44px); line-height:1.15; letter-spacing:-.02em; margin:0 0 16px}
.hero p.lede{font-size:19px; color:var(--muted); max-width:60ch; margin:0 0 28px}

h2{font-size:24px; letter-spacing:-.01em; margin:0 0 14px}
h3{font-size:17px; margin:24px 0 8px}
section{padding:34px 0; border-top:1px solid var(--line)}
p{margin:0 0 16px; max-width:68ch}
ul{max-width:68ch}
li{margin-bottom:8px}

.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:18px; margin-top:8px}
.card{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:20px}
.card h3{margin:0 0 6px; font-size:16px}
.card p{margin:0; font-size:15px; color:var(--muted)}

.facts{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:22px; display:grid; grid-template-columns:auto 1fr; gap:10px 22px; font-size:15px; max-width:640px}
.facts dt{color:var(--faint)}
.facts dd{margin:0; font-weight:500}

.notice{background:var(--accent-soft); border:1px solid var(--accent); border-radius:8px; padding:16px 18px; margin:20px 0}
.notice p{margin:0; font-size:15.5px}

footer.site{border-top:1px solid var(--line); margin-top:40px; padding:30px 0 60px; color:var(--muted); font-size:14.5px; background:var(--surface)}
footer.site a{margin-right:18px}
footer.site .legal{margin-top:14px; color:var(--faint); font-size:13.5px}

.doc h1{margin-bottom:6px}
.doc .updated{color:var(--faint); font-size:14px; margin-bottom:28px}
.doc h2{font-size:20px; margin-top:32px}