:root{--bg:#f4f2ee;--ink:#1d2226;--mute:#6b7075;--line:#d9d5cd;--acc:#2f5d62;--card:#fff}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:17px/1.6 "Helvetica Neue",Arial,sans-serif}
a{color:inherit}
.top{display:flex;justify-content:space-between;align-items:center;padding:22px clamp(16px,5vw,64px);border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(244,242,238,.92);backdrop-filter:blur(6px);z-index:5}
.logo{font-weight:700;letter-spacing:.3em;text-decoration:none;display:flex;align-items:center;gap:12px}
.mark{width:18px;height:18px;border:2px solid var(--ink);border-top-color:var(--acc);transform:rotate(45deg)}
nav{display:flex;gap:28px}
nav a{text-decoration:none;color:var(--mute);font-size:15px}
nav a:hover{color:var(--ink)}
main>section{padding:88px clamp(16px,5vw,64px);border-bottom:1px solid var(--line)}
.eyebrow{color:var(--acc);text-transform:uppercase;letter-spacing:.15em;font-size:13px;margin-bottom:22px}
h1{font-size:clamp(40px,7vw,86px);line-height:1.02;font-weight:300;letter-spacing:-.02em}
h2{font-size:clamp(28px,3.4vw,40px);font-weight:300;margin-bottom:40px}
.lead{max-width:600px;margin-top:30px;color:var(--mute);font-size:19px}
.stats{display:flex;gap:56px;margin-top:64px;flex-wrap:wrap}
.stats b{display:block;font-size:44px;font-weight:300;color:var(--acc)}
.stats span{color:var(--mute);font-size:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:28px}
.card h3{font-weight:500;font-size:19px;margin-top:16px}
.card p{color:var(--mute);font-size:14px}
.pic{aspect-ratio:4/3;position:relative;overflow:hidden;background:#dfe3e0}
.pic i{position:absolute;display:block}
.p1{background:linear-gradient(#cfdde0 60%,#9fb3a8 60%)}
.p1 i:nth-child(1){left:18%;bottom:30%;width:52%;height:26%;background:#f8f6f1}
.p1 i:nth-child(2){left:14%;bottom:56%;width:60%;height:8%;background:#3a4146}
.p1 i:nth-child(3){left:40%;bottom:30%;width:14%;height:18%;background:#2f5d62}
.p2{background:#e7e2d8}
.p2 i:nth-child(1){left:10%;bottom:0;width:80%;height:55%;background:#b9c4c7}
.p2 i:nth-child(2){left:10%;bottom:55%;width:80%;height:6%;background:#1d2226}
.p2 i:nth-child(3){left:18%;bottom:10%;width:64%;height:30%;background:repeating-linear-gradient(90deg,#f4f2ee 0 10px,#8ea0a4 10px 22px)}
.p3{background:linear-gradient(#e9ede7,#c7d3c3)}
.p3 i:nth-child(1){left:30%;bottom:22%;width:40%;height:34%;background:#6d5a48}
.p3 i:nth-child(2){left:26%;bottom:56%;width:48%;height:4%;background:#1d2226}
.p3 i:nth-child(3){left:44%;bottom:22%;width:12%;height:20%;background:#f2d38a}
.p4{background:#efe9df}
.p4 i:nth-child(1){left:0;bottom:0;width:100%;height:28%;background:#c9b79c}
.p4 i:nth-child(2){left:12%;bottom:28%;width:34%;height:16%;background:#2f5d62}
.p4 i:nth-child(3){right:10%;top:12%;width:26%;height:44%;background:#fff;border:6px solid #3a4146}
.method ol{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px;counter-reset:s}
.method li{border-top:2px solid var(--ink);padding-top:18px;counter-increment:s}
.method li:before{content:"0" counter(s);color:var(--acc);font-size:14px;display:block;margin-bottom:10px}
.method b{display:block;font-weight:500;margin-bottom:8px}
.method span{color:var(--mute);font-size:15px}
.studio{display:grid;grid-template-columns:2fr 1fr;gap:48px}
.studio p{color:var(--mute);margin-bottom:16px;max-width:640px}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:10px;align-content:flex-start;margin-top:84px}
.tags li{border:1px solid var(--line);padding:6px 14px;font-size:14px;background:var(--card)}
.cgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px}
.cgrid span{display:block;color:var(--mute);font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:6px}
.cgrid a{font-size:20px;text-decoration:none;border-bottom:1px solid var(--acc);overflow-wrap:anywhere}
footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:28px clamp(16px,5vw,64px);color:var(--mute);font-size:13px}
@media(max-width:760px){nav{display:none}.studio{grid-template-columns:1fr}.tags{margin-top:0}.stats{gap:32px}}
