:root{--ink:#171512;--paper:#f4f0e8;--muted:#625e56;--line:#d7cec0;--brass:#a57c4d;--display:"Songti SC","STSong","Noto Serif SC",serif;--sans:"PingFang SC","Microsoft YaHei",system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.8 var(--sans)}
a{color:inherit}
img{display:block;max-width:100%}
.skip{position:absolute;left:-999px;top:0;z-index:10;background:#fff;padding:.5rem 1rem}
.skip:focus{left:1rem}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:76px;padding:1rem clamp(1.4rem,5vw,4.5rem);border-bottom:1px solid var(--line)}
.brand{display:inline-flex;align-items:center;gap:.7rem;font-family:var(--display);font-size:1.12rem;letter-spacing:.16em;text-decoration:none;white-space:nowrap}
.brand img{width:32px;height:32px;filter:brightness(0)}
.site-header nav,footer nav{display:flex;align-items:center;flex-wrap:wrap;gap:1.4rem}
.site-header nav a,footer a{text-decoration:none;font-size:.86rem}
.site-header nav a[aria-current]{border-bottom:1px solid var(--brass);color:#805b30}
.site-header nav a:hover,footer a:hover,.text-link:hover{color:#805b30}
.hero{min-height:min(690px,calc(100svh - 76px));display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);overflow:hidden}
.hero-inner{align-self:center;padding:5rem clamp(1.4rem,5vw,4.5rem) 5rem;max-width:780px}
.eyebrow{margin:0 0 1rem;color:var(--brass);font-size:.75rem;font-weight:600;letter-spacing:.22em}
h1,h2,h3,p{margin-top:0}
h1,h2{font-family:var(--display);font-weight:500}
h1{font-size:clamp(2.8rem,5vw,5rem);letter-spacing:.055em;line-height:1.28;margin:0 0 1.5rem}
.lead{max-width:39rem;color:#49443d;font-size:clamp(1rem,1.4vw,1.2rem);line-height:1.95}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:1.3rem;margin:2rem 0 .85rem}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:2rem;min-height:3.3rem;padding:.7rem 1.25rem;background:var(--ink);color:#fff;text-decoration:none;font-size:.9rem}
.button:hover{background:#51402f}
.text-link{text-decoration:none;border-bottom:1px solid var(--brass);font-size:.88rem}
.note{color:var(--muted);font-size:.8rem}
.hero-art{position:relative;display:grid;place-items:center;min-height:450px;background:linear-gradient(140deg,#e9e0d1 5%,#cec3b1 55%,#8e867b 100%);overflow:hidden}
.hero-art:before{content:"";position:absolute;inset:7%;border:1px solid #fff6}
.room{position:relative;width:min(74%,460px);aspect-ratio:4/5;background:linear-gradient(135deg,#e9e4d9 50%,#c0b6a5 50%);box-shadow:24px 40px 70px #39312b30}
.room:before{content:"";position:absolute;top:0;right:0;width:30%;height:100%;background:#aa9d8d}
.room:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:24%;background:#b2a390;clip-path:polygon(0 0,100% 35%,100% 100%,0 100%)}
.window{position:absolute;left:12%;top:9%;width:43%;height:62%;border:10px solid #766e62;background:linear-gradient(135deg,#f9f4e6,#d9c8aa);box-shadow:inset 0 0 0 3px #ece5d8}
.window:after{content:"";position:absolute;left:49%;height:100%;border-left:5px solid #766e62}
.table{position:absolute;z-index:2;bottom:18%;right:3%;width:63%;height:10%;background:#5b5147;border-radius:50%;box-shadow:0 24px 0 -18px #4e4339,0 80px 0 -42px #4e4339}
.light{position:absolute;z-index:1;top:18%;right:7%;width:37%;height:50%;background:#fff5;filter:blur(25px);transform:rotate(-16deg)}
.art-caption{position:absolute;right:2rem;bottom:1.2rem;color:#fff;font-size:.68rem;letter-spacing:.23em}
.zhiban-art{background:radial-gradient(circle at 52% 38%,#d9d2c4,#b8aa96 65%,#867967)}
.thought{display:flex;flex-direction:column;gap:1rem;align-items:flex-start;width:min(70%,420px);padding:2.3rem;background:#f5f1e9;box-shadow:22px 26px 45px #322a2433;transform:rotate(-4deg)}
.thought i{display:block;height:9px;width:76%;background:#d6cbbb;border-radius:20px}
.thought i:nth-child(2){width:92%}.thought i:nth-child(3){width:61%}
.thought span{margin-top:2rem;font-family:var(--display);font-size:clamp(1.5rem,3vw,2.3rem);color:#433b33}
.section{padding:clamp(4rem,8vw,7rem) clamp(1.4rem,5vw,4.5rem)}
.intro{background:#ebe5da}
.section-heading{max-width:700px;margin-bottom:2.5rem}
h2{font-size:clamp(2rem,3.4vw,3.2rem);line-height:1.35;letter-spacing:.06em;margin:0 0 1rem}
.section-heading>p:last-child,.split p,.faq p,.closing p{color:var(--muted)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #bfb4a4}
.steps article{padding:2rem 2rem 0 0;margin-right:2rem;border-right:1px solid #cfc3b2}
.steps article:last-child{border-right:0;margin-right:0}
.steps span{color:var(--brass);font-family:var(--display);font-size:1.3rem}
h3{font-family:var(--display);font-size:1.35rem;font-weight:500;margin:1rem 0 .8rem}
.steps p{color:var(--muted);max-width:24rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.split>div:last-child{padding-top:1.2rem;max-width:36rem}
.questions{background:#fffdf9}
.faq{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin-top:2.5rem}
.faq article{border-top:1px solid var(--line);padding-top:.75rem}
.faq h3{font-family:var(--sans);font-size:1rem;font-weight:600}
.closing{text-align:center;padding:clamp(4rem,8vw,7rem) 1.5rem;background:#27231f;color:#f4f0e8}
.closing p{margin-bottom:2rem}.closing .button{background:var(--paper);color:var(--ink)}.closing .button:hover{background:#dfd4c3}
footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;padding:1.4rem clamp(1.4rem,5vw,4.5rem);font-size:.9rem}
@media(max-width:860px){.hero{grid-template-columns:1fr}.hero-inner{padding-top:4rem;padding-bottom:3rem}.hero-art{min-height:350px}.steps,.faq{grid-template-columns:1fr}.steps article{padding:1.2rem 0;margin:0;border-right:0;border-bottom:1px solid #cfc3b2}.steps article:last-child{border-bottom:0}.split{grid-template-columns:1fr;gap:0}.faq{gap:.4rem}}
@media(max-width:520px){.site-header{align-items:flex-start;flex-direction:column}.site-header nav{gap:1rem}.hero-art{min-height:280px}.thought{padding:1.5rem}.room{width:58%}footer nav{gap:.8rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
