
*{box-sizing:border-box}html,body{margin:0;background:#fff;color:#111;font-family:Arial,"Noto Sans KR",sans-serif}a{color:inherit;text-decoration:none}
.page{width:min(1180px,calc(100% - 64px));margin:auto;padding:18px 0 70px;display:grid;grid-template-columns:155px minmax(0,1fr);gap:42px}
.side{position:sticky;top:18px;align-self:start}.logo{width:96px;height:96px;background:#e8e8e6;display:grid;place-items:center;overflow:hidden}.logo img{width:100%;height:100%;object-fit:cover}
nav{display:flex;flex-direction:column;gap:13px;margin-top:24px;font-size:14px}nav a{width:max-content;position:relative}nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:1px;background:#111;transition:right .25s}nav a:hover:after,nav a.active:after{right:0}.contact{margin-top:38px;font-size:10px;line-height:1.8;color:#888}
.content{min-width:0}.mobile{display:none}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0 16px;align-items:start}.col{display:flex;flex-direction:column;gap:31px}.card{display:block}.media{position:relative;background:#e9e9e6;overflow:hidden}.media img{width:100%;height:100%;display:block;object-fit:cover}.sq{aspect-ratio:1}.pt{aspect-ratio:1/1.3}.media:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,0);transition:.28s}.hover{position:absolute;z-index:2;inset:0;display:grid;place-content:center;text-align:center;color:#fff;opacity:0;font-size:13px;line-height:1.5;transition:.28s;transform:translateY(4px)}.hover small{font-size:11px}.card:hover .media:after{background:rgba(0,0,0,.28)}.card:hover .hover{opacity:1;transform:none}.caption{padding-top:9px}.caption b{display:block;font-size:11px;font-weight:500}.caption span{display:block;color:#888;font-size:10px;margin-top:4px;line-height:1.45}
.detail-head{padding:28px 0 45px;display:grid;grid-template-columns:1.2fr .8fr;gap:45px}.detail-head h1{font-size:28px;margin:0 0 14px}.desc{font-size:12px;line-height:1.7;color:#555}.meta{font-size:10px;line-height:1.9}.meta b{display:inline-block;width:95px;color:#888;font-weight:400}.visual{margin-bottom:15px}.visual img{width:100%;display:block}.half{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px}.prevnext{border-top:1px solid #111;margin-top:55px;padding-top:18px;display:flex;justify-content:space-between;font-size:10px}
.about{max-width:760px;padding-top:31px}.eyebrow{font-size:10px;color:#888;margin-bottom:52px}.about h1{font-size:34px;margin:0 0 11px}.role{font-size:12px;color:#555;margin-bottom:48px}.statement{font-size:16px;line-height:1.8;margin-bottom:68px}.section{border-top:1px solid #111;padding-top:13px;margin-top:38px}.section h2{font-size:10px;margin:0 0 20px}.career{display:grid;grid-template-columns:100px 1fr 1fr;gap:18px;padding:10px 0;border-bottom:1px solid #eee;font-size:10px}.areas{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.areas span{font-size:10px;padding:10px 0;border-bottom:1px solid #eee}
@media(max-width:760px){body{padding-top:48px}.mobile{display:flex;position:fixed;top:0;left:0;right:0;height:48px;background:#fff;border-bottom:1px solid #eee;z-index:10;align-items:center;justify-content:space-between;padding:0 10px}.page{display:block;width:auto;padding:10px 9px 45px}.side{display:none}.grid{display:block}.col{display:contents}.card{margin-bottom:30px}.hover{display:none}.caption b{font-size:12px}.caption span{font-size:11px}.detail-head{display:block;padding:20px 4px 30px}.half{grid-template-columns:1fr}.about{padding:10px 5px}.career{grid-template-columns:82px 1fr}.career span:last-child{grid-column:2}.areas{grid-template-columns:1fr}}

/* Sidebar portfolio PDF link */
.portfolio-pdf{margin-top:18px}
.portfolio-pdf a{display:inline-block;color:#111;text-decoration:none;border:1px solid #111;padding:8px 10px;font-size:13px;font-weight:600;line-height:1;letter-spacing:.01em;transition:background .2s,color .2s}
.portfolio-pdf a:hover{background:#111;color:#fff}
