:root { --ink:#4A2C10; --muted:#8A5A32; --canvas:#FFF8E8; --surface:#FFFFFF; --line:#E9CFA0; --accent:#F08A00; --leaf:#4DB83E; }
* { box-sizing: border-box; }
body { margin:0; font: 17px/1.55 ui-rounded, -apple-system, BlinkMacSystemFont, "SF Pro Rounded", "Helvetica Neue", Arial, sans-serif; color:var(--ink); background:var(--canvas); }
a { color:var(--accent); }
.hero { background: linear-gradient(180deg, #7CCBF2, #C9EEFB 62%, #A9DD9A 62%, #6CC25A); padding:56px 20px 72px; text-align:center; }
.hero img { width:128px; height:128px; border-radius:28px; box-shadow:0 12px 30px rgba(74,44,16,.3); }
.hero h1 { font-size: clamp(34px, 7vw, 58px); line-height:1.05; margin:22px 0 8px; font-weight:900; letter-spacing:-.01em; color:#5A3310; }
.hero p { font-size:20px; max-width:620px; margin:0 auto; font-weight:700; color:#5A3310; }
main { max-width: 900px; margin: 0 auto; padding: 36px 20px 60px; }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap:16px; }
.card { background:var(--surface); border:3px solid var(--line); border-radius:24px; padding:20px; }
.card h3 { margin:0 0 6px; font-size:19px; font-weight:800; }
.card p { color:var(--muted); margin:0; font-size:15.5px; font-weight:600; }
h2 { font-size:26px; margin:40px 0 14px; font-weight:900; }
footer { border-top:3px solid var(--line); color:var(--muted); font-size:14px; padding:24px 20px 40px; text-align:center; font-weight:600; }
.doc { max-width: 720px; }
.doc h1 { font-size:34px; margin: 8px 0 18px; font-weight:900; }
.doc h2 { font-size:21px; margin:28px 0 8px; }
.doc p, .doc li { font-weight:600; }
.top { padding:16px 20px; border-bottom:3px solid var(--line); background:var(--surface); }
.top a { text-decoration:none; color:var(--ink); font-weight:800; display:inline-flex; align-items:center; gap:10px; }
.top img { width:34px; height:34px; border-radius:8px; }