:root { color-scheme: light dark; --bg:#f7f5ef; --card:#fffefa; --text:#243c33; --muted:#68776e; --line:#dfe5dc; --accent:#277b60; --soft:#e5efdc; --coral:#c86750; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family:system-ui,-apple-system,"Segoe UI",sans-serif; line-height:1.65; }
a { color:var(--accent); text-underline-offset:3px; }
header,main,footer { width:min(860px,calc(100% - 40px)); margin-inline:auto; }
header { padding:28px 0 18px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { color:var(--text); font-weight:800; text-decoration:none; letter-spacing:-.03em; }
nav { display:flex; gap:16px; flex-wrap:wrap; font-size:.92rem; }
main { padding:42px 0 70px; }
.hero,.card { background:var(--card); border:1px solid var(--line); border-radius:24px; padding:clamp(24px,5vw,48px); }
.hero { background:linear-gradient(145deg,var(--soft),var(--card)); }
.eyebrow { color:var(--accent); font-size:.78rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
h1,h2 { line-height:1.22; letter-spacing:-.035em; }
h1 { font-size:clamp(2.1rem,7vw,4rem); margin:.4em 0 .25em; }
h2 { margin-top:2.2em; }
p,li { max-width:72ch; }
.lead { color:var(--muted); font-size:1.08rem; }
.links { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-top:30px; }
.links a { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px; text-decoration:none; font-weight:700; }
.notice { border-left:4px solid var(--coral); padding:2px 0 2px 18px; color:var(--muted); }
footer { border-top:1px solid var(--line); padding:26px 0 42px; color:var(--muted); font-size:.9rem; }
@media (prefers-color-scheme:dark) { :root { --bg:#171d1b; --card:#212a26; --text:#e8eddf; --muted:#a6b3a8; --line:#344239; --accent:#9bd4b0; --soft:#2c4231; --coral:#e9a28a; } }
@media (max-width:600px) { header { align-items:flex-start; flex-direction:column; } main { padding-top:20px; } }