:root{
  --bg:#EDE8DD; --ink:#211D17; --ink-2:#5C554A; --ink-3:#8C8475;
  --line:#211D17; --line-soft:#C9C0AE; --card:#F7F3EA;
  --accent:#B4471F; --accent-ink:#8F371A; --live:#2E6F4F;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--ink);font-family:'Plus Jakarta Sans',system-ui,sans-serif;line-height:1.5;min-height:100dvh;-webkit-font-smoothing:antialiased;}
.wrap{width:100%;max-width:880px;margin:0 auto;padding:0 24px 72px;}

.toprule{max-width:880px;margin:0 auto;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1.5px solid var(--line);}
.toprule .name{font-size:13px;font-weight:700;letter-spacing:0.02em;}
.toprule .loc{font-size:12px;color:var(--ink-2);font-weight:500;}

.intro{padding:64px 0 56px;max-width:640px;}
.eyebrow{font-family:'Newsreader',serif;font-style:italic;font-size:17px;color:var(--accent);margin-bottom:20px;}
h1{font-size:clamp(40px,8vw,68px);font-weight:800;letter-spacing:-0.04em;line-height:0.98;margin-bottom:24px;}
.lede{font-family:'Newsreader',serif;font-size:clamp(18px,2.6vw,22px);line-height:1.5;color:var(--ink-2);max-width:540px;}

.group{margin-bottom:8px;}
.group-head{display:flex;align-items:baseline;gap:14px;padding:18px 0 0;}
.group-head .label{font-size:12px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink);white-space:nowrap;}
.group-head .count{font-size:12px;color:var(--ink-3);font-weight:600;}
.group-head .rule{flex:1;height:1.5px;background:var(--line);}

.projects{display:grid;grid-template-columns:1fr;border-left:1.5px solid var(--line);border-top:1.5px solid var(--line);margin-top:22px;}
@media(min-width:640px){.projects{grid-template-columns:1fr 1fr;}}

.project{display:block;text-decoration:none;color:inherit;position:relative;padding:24px 26px 26px;border-right:1.5px solid var(--line);border-bottom:1.5px solid var(--line);background:var(--card);transition:background .18s;}
.project::before{content:"";position:absolute;left:0;top:0;height:100%;width:0;background:var(--accent);transition:width .18s;}
.project:hover{background:#FCEFE6;}
.project:hover::before{width:4px;}
.project.soon{background:transparent;cursor:default;pointer-events:none;}
.project.soon:hover{background:transparent;}

.p-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.p-mark{font-family:'Newsreader',serif;font-size:15px;font-weight:500;color:var(--ink-3);letter-spacing:0.02em;}
.tag{font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:3px 9px;border:1.5px solid var(--line);color:var(--ink);background:transparent;}
.tag.live{border-color:var(--live);color:var(--live);}
.tag.wip{border-color:var(--accent);color:var(--accent-ink);}

.p-name{font-size:22px;font-weight:800;letter-spacing:-0.02em;margin-bottom:8px;display:flex;align-items:center;gap:10px;}
.p-name .go{color:var(--accent);opacity:0;transform:translateX(-4px);transition:opacity .18s,transform .18s;}
.project:hover .p-name .go{opacity:1;transform:translateX(0);}
.p-desc{font-size:14px;color:var(--ink-2);line-height:1.5;max-width:42ch;}

.empty{padding:28px;border:1.5px solid var(--line);border-top:none;font-family:'Newsreader',serif;font-style:italic;color:var(--ink-3);}

footer{margin-top:48px;padding-top:24px;border-top:1.5px solid var(--line);font-size:13px;color:var(--ink-3);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}
footer a{color:var(--ink-2);text-decoration:none;font-weight:600;border-bottom:1.5px solid transparent;transition:border-color .15s,color .15s;}
footer a:hover{color:var(--accent);border-color:var(--accent);}

@media(max-width:480px){.intro{padding:48px 0 40px;}.project{padding:20px;}}