:root{--bg:#faf7f2;--card:#fff;--ink:#2d2a26;--muted:#7a7066;--acc:#8b6f4e;--acc2:#e9e1d4}
*{box-sizing:border-box}body{margin:0;font:17px/1.65 -apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:18px 6vw;background:var(--card);box-shadow:0 1px 0 #eee;position:sticky;top:0}
.logo{font-weight:700;font-size:1.35em;color:var(--acc);text-decoration:none;letter-spacing:.03em}nav a{margin-left:18px;color:var(--ink);text-decoration:none}nav a:hover{color:var(--acc)}
main{max-width:980px;margin:0 auto;padding:28px 20px}.hero{background:linear-gradient(135deg,#efe6d8,#f8f4ee);border-radius:18px;padding:56px 36px;margin-bottom:26px}
.hero h1{margin:0 0 10px;font-size:2.3em}.hero p{color:var(--muted);max-width:620px}.btn{display:inline-block;margin-top:14px;padding:11px 22px;border-radius:10px;background:var(--acc);color:#fff;text-decoration:none}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}.card{background:var(--card);border-radius:14px;padding:22px;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.card h3{margin-top:0}.pic{height:150px;border-radius:12px;background:var(--acc2);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.tag{display:inline-block;font-size:.8em;padding:2px 10px;border-radius:20px;background:var(--acc2);color:var(--acc)}h2{color:var(--acc)}
footer{text-align:center;color:var(--muted);font-size:.9em;padding:34px 20px;border-top:1px solid #eee;margin-top:30px}
@media(max-width:640px){nav a{margin:0 12px 0 0}.hero{padding:34px 22px}.hero h1{font-size:1.7em}}
