:root{
  color-scheme:light;
  --bg:#FFFFFF; --panel:#F4F8FA; --line:#D8E4E9;
  --fg:#142B43; --fg-2:#586C7C; --fg-3:#607080;
  --green:#00876E; --green-dp:#0C4A8E;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:16px;line-height:1.68;-webkit-font-smoothing:antialiased;
}
.wrap{max-width:780px;margin:0 auto;padding:0 24px}
a{color:inherit;text-decoration:none}

nav{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:66px;gap:20px;max-width:1140px}
.brand{font-family:inherit;font-size:1.7rem;font-weight:600;letter-spacing:-.045em}
.brand i{color:var(--green);font-style:normal}
.navlinks{display:flex;gap:24px;font-size:.88rem;color:var(--fg-2);flex-wrap:wrap}
.navlinks a:hover{color:var(--fg)}

main{padding:64px 0 40px}
h1{font-family:inherit;font-weight:600;font-size:clamp(2.2rem,4vw,3.5rem);letter-spacing:-.045em;margin:0;line-height:1.1}
.updated{color:var(--fg-3);font-size:.88rem;margin:12px 0 0;padding-bottom:28px;border-bottom:1px solid var(--line)}

.legal h2{
  font-family:inherit;font-weight:600;
  font-size:1.22rem;letter-spacing:-.01em;color:var(--fg);
  margin:44px 0 14px;padding-top:4px;
}
.legal h2:first-child{margin-top:34px}
.legal p{margin:0 0 15px;color:var(--fg-2)}
.legal ul{margin:0 0 18px;padding-left:22px;color:var(--fg-2)}
.legal li{margin-bottom:8px}
.legal li::marker{color:var(--green-dp)}
.legal strong{color:var(--fg);font-weight:650}
.legal a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.legal a:hover{color:var(--fg)}

footer{border-top:1px solid var(--line);margin-top:56px;padding:34px 0 60px;font-size:.85rem;color:var(--fg-3)}
footer .wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;max-width:1140px}
footer a:hover{color:var(--fg-2)}

@media(max-width:560px){
  nav .wrap{height:auto;min-height:76px;flex-wrap:wrap;padding-top:15px;padding-bottom:15px;gap:15px}
  .navlinks{gap:16px;font-size:.75rem}
  main{padding:44px 0 30px}
}

.brand{display:flex;align-items:center;gap:10px}
.brand img{width:32px;height:32px;object-fit:contain;background:#EAF7FB;border-radius:9px;padding:2px;flex:none}
a:focus-visible{outline:2px solid var(--green);outline-offset:5px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
