/* Static project landing pages. Tokens come from /style.css. */
.project-page{background:var(--paper);color:var(--ink);font-family:var(--font)}
.pp{padding-block:clamp(28px,5vw,64px) 40px;max-width:1100px}
.pp-crumbs{display:flex;flex-wrap:wrap;gap:8px;font:12px var(--mono);color:var(--muted);margin-bottom:28px}
.pp-crumbs a{color:inherit}
.pp-tags{display:flex;flex-wrap:wrap;gap:8px;font:11px var(--mono);letter-spacing:.06em;color:var(--muted);margin-bottom:18px}
.pp-tags span{padding:6px 8px;border:1px solid var(--line);border-radius:3px}
.pp h1{font-size:clamp(2.4rem,7vw,5.2rem);line-height:.98;letter-spacing:-.03em;margin:0 0 16px}
.pp-tagline{font-size:clamp(1.1rem,2.2vw,1.5rem);line-height:1.35;max-width:36ch;margin:0 0 26px;color:#3b3c34}
.pp-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 34px}
.pp-btn{display:inline-flex;align-items:center;min-height:48px;padding:0 20px;border:1px solid var(--ink);border-radius:999px;color:var(--ink);text-decoration:none;font-weight:600}
.pp-btn-main{background:var(--ink);color:var(--paper)}
.pp-btn:hover,.pp-btn:focus-visible{background:var(--orange);border-color:var(--orange);color:#fff}
.pp-shot{margin:0 0 44px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.pp-shot img{display:block;width:100%;height:auto}
.pp-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 44px;margin-bottom:56px}
.pp-body h2,.pp-more h2{font:600 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#71351e;margin:0 0 10px}
.pp-body p{margin:0;font-size:1.05rem;line-height:1.6}
.pp-more ul{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.pp-more li a{display:block;height:100%;padding:14px 16px;border:1px solid var(--line);border-radius:8px;color:inherit;text-decoration:none}
.pp-more li a:hover,.pp-more li a:focus-visible{border-color:var(--orange)}
.pp-more li b{display:block;margin-bottom:4px}
.pp-more li span{display:block;color:var(--muted);font-size:.92rem;line-height:1.4}
.pp-more>p a{color:var(--ink);font-weight:600}
@media(max-width:700px){.pp-body{grid-template-columns:1fr}.pp-btn{flex:1 1 100%;justify-content:center}.pp-tagline{max-width:none}}
.project-page .direction-tab span{display:flex;flex-direction:column;gap:2px}.project-page .direction-tab small{font:10px var(--mono);color:var(--muted)}
.pp-index{padding-block:20px 56px}.pp-index .pp-more h2{margin-bottom:14px}