:root{--paper:#f2f0e9;--ink:#232923;--muted:#70776e;--line:#d4d8cd;--green:#dbea9c;--dark:#24392d}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #709b35;outline-offset:5px}.wrap{width:min(1240px,90%);margin:auto}header{display:flex;justify-content:space-between;align-items:center;padding:27px 0;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:-.5px}.mark{display:grid;place-items:center;background:var(--dark);color:var(--green);width:32px;height:32px;border-radius:50%;font-size:23px}nav{display:flex;gap:30px;font-size:14px}nav a:hover{text-decoration:underline;text-underline-offset:6px}.hero{padding:78px 0 72px;display:grid;grid-template-columns:1.2fr 1fr;gap:65px;align-items:center}.eyebrow{font:11px monospace;letter-spacing:2px;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px}.dot{width:7px;height:7px;background:#799148;border-radius:50%}h1{font-weight:500;font-size:clamp(40px,5.5vw,76px);line-height:1.23;letter-spacing:-3px;margin:26px 0}h1 em{font-family:Georgia,serif;font-weight:400;color:#637653}.intro{font-size:15px;line-height:1.95;max-width:390px;color:var(--muted)}.cta{display:inline-flex;align-items:center;gap:40px;border-radius:30px;background:var(--ink);color:white;padding:15px 23px;font-size:13px;margin-top:22px}.cta:hover{background:#46603e}.hero-art{aspect-ratio:1;position:relative;border-radius:5px;background:#e2e6d8;overflow:hidden;display:grid;place-items:center}.hero-art svg{width:100%;height:100%}.art-label{position:absolute;bottom:20px;left:24px;font:10px monospace;letter-spacing:1px;color:#52644e}.art-number{position:absolute;right:22px;top:20px;font:10px monospace;color:#52644e}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:0 0 28px}h2{font-size:32px;font-weight:500;letter-spacing:-1px;margin:10px 0 0}.section-heading p{font-size:12px;color:var(--muted)}.filters{display:flex;gap:8px;margin:28px 0}.filter{border:1px solid var(--line);border-radius:22px;background:transparent;padding:9px 18px;font-size:12px;color:var(--muted)}.filter[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}.grid{display:grid;grid-template-columns:1fr 1fr;gap:34px 26px}.project[hidden]{display:none}.project button{display:block;padding:0;text-align:left;border:0;background:none;width:100%;color:inherit}.cover{aspect-ratio:1.45;overflow:hidden;border-radius:4px;position:relative;display:grid;place-items:center;transition:transform .25s}.project button:hover .cover{transform:translateY(-5px)}.cover svg{width:100%;height:100%}.p-meta{display:flex;align-items:start;justify-content:space-between;margin-top:18px;gap:20px}.p-meta h3{font-size:19px;font-weight:500;margin:0}.p-meta p{font-size:12px;color:var(--muted);margin:9px 0}.arrow{font-size:24px}.tag{position:absolute;top:16px;left:16px;font-size:10px;letter-spacing:1px;padding:7px 10px;border-radius:20px;background:#ffffffc9}.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;margin-top:90px;padding:56px 0;border-top:1px solid var(--line)}.about-copy{font-size:17px;line-height:1.9;color:#586052}.skills{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.skills span{font-size:12px;padding:9px 12px;border:1px solid var(--line);border-radius:4px}.contact{padding:45px 50px;margin:20px 0 55px;background:var(--dark);color:var(--paper);display:flex;align-items:center;justify-content:space-between;gap:30px;border-radius:4px}.contact h2{font-size:33px}.contact p{font-size:13px;color:#c5cebe;line-height:1.9}.contact a{background:var(--green);color:var(--dark);border-radius:30px;padding:15px 24px;white-space:nowrap;font-size:13px}footer{display:flex;justify-content:space-between;font:11px monospace;color:var(--muted);padding-bottom:27px;gap:20px}dialog{border:1px solid var(--line);border-radius:10px;background:var(--paper);padding:35px;max-width:560px;width:90%;color:var(--ink)}dialog::backdrop{background:#17271bbb;backdrop-filter:blur(5px)}dialog h2{margin:20px 0;font-size:28px}dialog p{color:var(--muted);line-height:1.9}dialog .close{float:right;border:1px solid var(--line);background:transparent;border-radius:50%;width:32px;height:32px}dialog .detail-label{font:11px monospace;letter-spacing:1px;color:var(--muted)}@media(max-width:760px){header{padding:22px 0}nav{gap:17px;font-size:12px}.hero{grid-template-columns:1fr;gap:30px;padding:50px 0}.hero-art{aspect-ratio:1.15}h1{letter-spacing:-1.5px}.grid{grid-template-columns:1fr}.section-heading p{display:none}.about{grid-template-columns:1fr;gap:15px;margin-top:55px;padding:35px 0}.contact{padding:30px;flex-direction:column;align-items:start}.contact h2{font-size:27px}footer{flex-wrap:wrap}.intro{max-width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.brand-name{display:flex;flex-direction:column;gap:3px;font-size:16px;white-space:nowrap}.brand-name small{font-size:9px;font-weight:400;letter-spacing:2px;color:var(--muted)}