*{box-sizing:border-box;margin:0;padding:0}
:root{--ink:#16181d;--muted:#5b616e;--line:#e6e8ec;--soft:#f6f7f9;--accent:#0b5cad}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.65;-webkit-font-smoothing:antialiased;font-size:17px}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
header{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);border-bottom:1px solid var(--line);z-index:10}
nav{max-width:1040px;margin:0 auto;padding:14px 24px;display:flex;justify-content:space-between;align-items:center;font-size:15px}
nav .brand{font-weight:650;color:var(--ink);letter-spacing:-.01em;display:flex;align-items:center;gap:10px}
nav .brand img{width:26px;height:26px}
nav ul{list-style:none;display:flex;gap:24px}nav ul a{color:#3a3f4a}nav ul a[aria-current]{color:var(--ink);font-weight:600}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px}
.hero{padding:104px 0 88px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}
.hero h1{font-size:clamp(34px,5.6vw,54px);font-weight:700;letter-spacing:-.025em;line-height:1.08;max-width:820px}
.hero p.lead{font-size:clamp(18px,2.2vw,21px);color:var(--muted);max-width:720px;margin-top:22px}
.hero .actions{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-block;padding:11px 22px;border-radius:8px;font-size:16px;font-weight:550;border:1px solid var(--accent)}
.btn.primary{background:var(--accent);color:#fff}.btn.primary:hover{background:#094c90;text-decoration:none}
.btn.ghost{color:var(--accent);background:#fff}.btn.ghost:hover{background:#f1f6fc;text-decoration:none}
section{padding:80px 0;border-top:1px solid var(--line)}
section.alt{background:var(--soft)}
h2{font-size:clamp(26px,3.6vw,36px);font-weight:700;letter-spacing:-.02em;margin-bottom:14px}
.sub{color:var(--muted);max-width:720px;margin-bottom:40px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:22px}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:30px}
section:not(.alt) .card{background:var(--soft);border-color:transparent}
.card h3{font-size:20px;letter-spacing:-.01em;margin-bottom:10px}
.card p{color:#3a3f4a}
.card ul{margin:14px 0 0 18px;color:#3a3f4a}.card li{margin:6px 0}
.card .more{display:inline-block;margin-top:16px;font-weight:550}
.principles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px}
.principles h3{font-size:17px;margin-bottom:6px}.principles p{color:var(--muted);font-size:16px}
.pubs{list-style:none;border-top:1px solid var(--line)}
.pubs li{padding:24px 0;border-bottom:1px solid var(--line)}
.pubs .tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.pubs h3{font-size:18px;line-height:1.4;font-weight:600}
.pubs h3 a{color:var(--ink)}.pubs h3 a:hover{color:var(--accent)}
.pubs .meta{font-size:15px;color:var(--muted);margin-top:6px}
.pubs .note{font-size:15px;color:#3a3f4a;margin-top:8px;max-width:820px}
.area{display:grid;grid-template-columns:1fr 1.6fr;gap:40px;align-items:start}
.area h2{margin-bottom:8px}
.area .body p{margin-bottom:16px;color:#2c3039}
.area .body h3{font-size:18px;margin:26px 0 8px}
.area .body ul{margin:0 0 16px 20px;color:#2c3039}.area .body li{margin:6px 0}
.contact p{font-size:19px;color:#3a3f4a;max-width:680px}
.contact .btn{margin-top:24px}
footer{border-top:1px solid var(--line);padding:30px 0;font-size:14px;color:#7a808c}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer a{color:#7a808c}
@media(max-width:760px){.area{grid-template-columns:1fr;gap:12px}}
@media(max-width:600px){body{font-size:16px}nav ul{gap:16px}nav ul li.hide{display:none}.hero{padding:72px 0 60px}section{padding:56px 0}.card{padding:24px}}