:root{--bg:hsl(271 30% 98%);--fg:hsl(271 25% 14%);--acc:hsl(271 62% 46%);--acc2:hsl(61 58% 52%);--card:#ffffff;--line:hsl(271 20% 88%)}
*{box-sizing:border-box}body{margin:0;font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--fg)}
a{color:var(--acc);text-decoration:none}a:hover{text-decoration:underline}
.wrap{max-width:980px;margin:0 auto;padding:0 20px}
header{border-bottom:1px solid var(--line)}header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;flex-wrap:wrap}
.logo{font-weight:800;font-size:19px;color:var(--fg)}nav a{margin-left:18px;color:var(--fg);opacity:.8}nav a.on{opacity:1;color:var(--acc)}
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}.hero .art{position:absolute;inset:0;width:100%;height:100%}
.hero .wrap{position:relative;padding:72px 20px 80px}h1{margin:0 0 10px;font-size:clamp(30px,6vw,46px);line-height:1.15}.lead{font-size:19px;opacity:.85;max-width:560px;margin:0 0 22px}
.btn{display:inline-block;padding:11px 20px;border-radius:10px;background:var(--acc);color:#fff;font-weight:700}.btn:hover{text-decoration:none;opacity:.92}
main .wrap{padding:44px 20px}h2{margin:0 0 14px;font-size:26px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px}.card h3{margin:0 0 6px}.card p{margin:0;opacity:.85}
footer{border-top:1px solid var(--line);font-size:14px;opacity:.8}footer .wrap{padding:22px 20px}dl{display:grid;grid-template-columns:110px 1fr;gap:6px 14px;margin:0}dt{opacity:.6}dd{margin:0}