:root{
  --bg:#fbfaf7; --fg:#1c1a17; --muted:#6b655c; --line:#e6e1d8;
  --card:#ffffff; --accent:#8a5a2b; --accent-soft:#f0e7db; --link:#a25a1e;
  --max:860px;
}
@media (prefers-color-scheme:dark){
  :root{ --bg:#17150f; --fg:#eae5db; --muted:#a49c8e; --line:#2c281f;
    --card:#1f1c15; --accent:#d8a45f; --accent-soft:#2a2418; --link:#e2ad63; }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font:17px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--link); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--max); margin:0 auto; padding:0 20px}
header.site{border-bottom:1px solid var(--line); position:sticky; top:0; background:color-mix(in srgb,var(--bg) 92%,transparent); backdrop-filter:blur(6px)}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:14px; padding-bottom:14px; flex-wrap:wrap}
.brand{font-weight:700; font-size:16px; color:var(--fg)}
nav a{margin-left:18px; font-size:15px; color:var(--muted)}
nav a:first-child{margin-left:0}
.hero{padding:64px 0 40px; border-bottom:1px solid var(--line)}
.hero h1{font-size:clamp(30px,6vw,46px); line-height:1.1; margin:0 0 16px; letter-spacing:-.02em}
.hero .lead{font-size:20px; color:var(--muted); max-width:640px; margin:0}
.kicker{display:inline-block; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); font-weight:600; margin-bottom:14px}
section{padding:44px 0; border-bottom:1px solid var(--line)}
section:last-of-type{border-bottom:0}
h2{font-size:28px; letter-spacing:-.01em; margin:0 0 18px}
h3{font-size:20px; margin:0 0 8px}
p{margin:0 0 16px}
.muted{color:var(--muted)}
.callout{background:var(--accent-soft); border:1px solid var(--line); border-radius:12px; padding:18px 20px; margin:20px 0}
.callout p:last-child{margin-bottom:0}
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; margin-top:8px}
.card{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px}
.card h3{font-size:18px}
.card .role{font-size:13px; color:var(--accent); font-weight:600; margin:0 0 10px}
.card p{font-size:15px; color:var(--muted); margin:0}
dl.terms dt{font-weight:700; margin-top:20px}
dl.terms dd{margin:6px 0 0; color:var(--muted)}
.faq details{border:1px solid var(--line); border-radius:12px; padding:6px 18px; margin-bottom:12px; background:var(--card)}
.faq summary{cursor:pointer; font-weight:600; padding:12px 0; font-size:17px}
.faq details[open] summary{border-bottom:1px solid var(--line); margin-bottom:8px}
footer.site{padding:40px 0 60px; color:var(--muted); font-size:14px}
footer.site a{color:var(--muted); text-decoration:underline}
.small{font-size:14px}