:root{--ink:#1e1b18;--mut:#8a8078;--bg:#fbf9f6;--cu:#a8623a;--line:#ebe5dd}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 -apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
a{color:var(--cu);text-decoration:none}
img{display:block;width:100%;height:auto}
.w{max-width:1080px;margin:0 auto;padding:0 20px}
header .w{display:flex;justify-content:space-between;align-items:center;padding-top:28px;padding-bottom:28px;gap:16px;flex-wrap:wrap}
.logo{font:600 19px/1 Georgia,serif;letter-spacing:.06em;color:var(--ink);text-transform:uppercase}
.logo b{color:var(--cu);font-weight:600}
header nav{font-size:14px;color:var(--mut)}header nav a{color:var(--mut);margin-left:22px}header nav a:hover{color:var(--ink)}
.intro{padding:40px 0 50px;max-width:520px}
.intro h1{font:400 30px/1.25 Georgia,serif;margin:0 0 12px}
.intro p{color:var(--mut);margin:0}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px 22px}
.item .ph{background:#eee;margin-bottom:12px}
.item h2{font:400 17px/1.3 Georgia,serif;margin:0}
.item .cn{color:var(--mut);font-size:13px;margin-left:6px}
.item .o{color:var(--mut);font-size:13px;margin-top:2px}
.item .p{margin-top:6px;font-size:15px}
.info{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:80px;padding-top:28px;border-top:1px solid var(--line);font-size:15px}
.info h3{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--cu);margin:0 0 8px;font-weight:600}
.info p{margin:0;color:#4a443e}
footer .w{padding-top:50px;padding-bottom:30px;font-size:13px;color:var(--mut);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
@media (max-width:860px){.grid{grid-template-columns:repeat(2,1fr)}.item .cn{display:block;margin:0}.info{grid-template-columns:1fr}}
@media (max-width:420px){header nav a{margin:0 14px 0 0}.intro h1{font-size:26px}}