:root{
  --pt-paper:#FAFAF9;--pt-ink:#1C1917;--pt-ink-soft:#57534E;--pt-rule:#E7E5E4;
  --pt-teal:#0F766E;--pt-amber:#D97706;--pt-scale:1;
  --pt-serif:"Noto Serif KR",serif;
  --pt-sans:"Pretendard Variable",Pretendard,system-ui,sans-serif;
  --pt-mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  --pt-pad-x:clamp(20px,5vw,48px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--pt-paper);color:var(--pt-ink);font-family:var(--pt-sans);font-weight:400;-webkit-font-smoothing:antialiased;text-wrap:pretty}
a{color:var(--pt-teal);text-decoration:none;text-underline-offset:.18em}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--pt-teal);outline-offset:3px}
table{border-collapse:collapse}

[data-fade]{transition:opacity .2s ease}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  [data-fade]{opacity:1!important;transition:none}
}
@media (prefers-contrast:more){
  :root{--pt-paper:#FFFFFF;--pt-ink:#000000;--pt-ink-soft:#26211E;--pt-rule:#8C8C8C}
}

.skip-link{position:absolute;left:-9999px;top:0;padding:12px 16px;background:#1C1917;color:#FAFAF9;font-size:14px;z-index:50}
.skip-link:focus{left:0}

.wrap{max-width:1000px;margin:0 auto;padding-left:var(--pt-pad-x);padding-right:var(--pt-pad-x)}

.mono{font-family:var(--pt-mono);font-size:12px;letter-spacing:.08em}
.mono-label{font-family:var(--pt-mono);font-size:12px;letter-spacing:.14em;color:var(--pt-ink-soft)}

/* Header */
.site-header{padding-top:24px;padding-bottom:24px;display:flex;flex-wrap:wrap;gap:16px 28px;align-items:baseline;justify-content:space-between}
.site-nav ul{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:0;padding:0;font-family:var(--pt-mono);font-size:12px;letter-spacing:.08em}
.site-nav a{color:var(--pt-ink-soft)}
.site-nav a:hover{color:var(--pt-teal)}
.lang{display:flex;gap:4px 14px;list-style:none;margin:0;padding:0;font-family:var(--pt-mono);font-size:12px;letter-spacing:.08em}
.lang a{color:var(--pt-ink-soft)}
.lang a:hover{color:var(--pt-teal)}
.lang .cur{color:var(--pt-ink)}

/* Hero */
.hero{min-height:88svh;padding-top:clamp(40px,8vh,96px);padding-bottom:clamp(56px,10vh,120px);display:flex;flex-direction:column;justify-content:center;gap:clamp(28px,5vh,56px);border-bottom:1px solid var(--pt-rule)}
.hero-row{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(16px,4vw,64px)}
.hero h1{margin:0;font-family:var(--pt-serif);font-weight:500;font-size:calc(clamp(56px,11vw,132px) * var(--pt-scale));line-height:1.02;letter-spacing:-.02em}
.hero h1 .accent{color:var(--pt-teal)}
.hero-mark{font-family:var(--pt-serif);font-weight:300;font-size:clamp(120px,26vh,260px);line-height:.8;color:transparent;-webkit-text-stroke:1px var(--pt-teal);user-select:none;margin-left:auto}
.hero-intro{display:flex;flex-direction:column;gap:20px;max-width:52ch}
.hero-intro .lede{margin:0;font-size:calc(clamp(17px,2vw,21px) * var(--pt-scale));line-height:1.75;color:var(--pt-ink)}
.hero-intro .brand-line{margin:0;font-family:var(--pt-mono);font-size:12px;letter-spacing:.1em;color:var(--pt-ink-soft);border-top:1px solid var(--pt-rule);padding-top:16px}

/* Numbered sections */
.section{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:clamp(56px,12vh,140px);padding-bottom:clamp(56px,12vh,140px)}
.section h2{margin:0;font-family:var(--pt-serif);font-weight:500;font-size:calc(clamp(30px,5vw,58px) * var(--pt-scale));line-height:1.3;letter-spacing:-.02em}
.section-num{margin:0;font-family:var(--pt-mono);font-size:12px;letter-spacing:.14em;color:var(--pt-ink-soft)}

.s01{gap:clamp(28px,5vh,48px);border-bottom:1px solid var(--pt-rule)}
.s01 h2{max-width:22ch}
.s01-body{display:flex;flex-direction:column;gap:clamp(20px,3vh,32px);max-width:56ch;font-size:calc(clamp(16px,1.7vw,19px) * var(--pt-scale));line-height:1.85;color:var(--pt-ink-soft)}
.s01-body p{margin:0}
.s01-body .stress{color:var(--pt-ink)}

.s02{gap:clamp(32px,5vh,56px);border-bottom:1px solid var(--pt-rule)}
.s02 h2{max-width:22ch}
.principles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--pt-rule);border-top:1px solid var(--pt-rule);border-bottom:1px solid var(--pt-rule)}
.principles li{background:var(--pt-paper);padding:clamp(24px,4vh,40px) clamp(20px,3vw,32px);display:flex;flex-direction:column;gap:14px}
.principles .num{font-family:var(--pt-mono);font-size:12px;letter-spacing:.12em;color:var(--pt-teal)}
.principles h3{margin:0;font-size:calc(clamp(18px,2vw,22px) * var(--pt-scale));font-weight:600;line-height:1.4}
.principles p{margin:0;font-size:calc(15.5px * var(--pt-scale));line-height:1.8;color:var(--pt-ink-soft)}

.s03-intro{padding-top:clamp(56px,12vh,140px);padding-bottom:0;display:flex;flex-direction:column;gap:clamp(28px,5vh,48px)}
.s03-intro h2{margin:0;font-family:var(--pt-serif);font-weight:500;font-size:calc(clamp(30px,5vw,58px) * var(--pt-scale));line-height:1.3;letter-spacing:-.02em;max-width:24ch}
.s03-intro .lede{margin:0;max-width:52ch;font-size:calc(clamp(16px,1.7vw,19px) * var(--pt-scale));line-height:1.85;color:var(--pt-ink-soft)}

/* Project articles */
.project{min-height:100svh;padding-top:clamp(48px,10vh,120px);padding-bottom:clamp(48px,10vh,120px);display:flex;flex-direction:column;justify-content:center;gap:clamp(24px,4vh,36px)}
.project-inner{border-left:4px solid var(--project-accent,var(--pt-ink));padding-left:clamp(20px,3vw,32px);display:flex;flex-direction:column;gap:clamp(20px,3vh,32px)}
.project h3{margin:0;font-family:var(--pt-serif);font-weight:500;font-size:calc(clamp(26px,4vw,44px) * var(--pt-scale));line-height:1.35;letter-spacing:-.02em;max-width:22ch}
.project-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--pt-mono);font-size:12px;letter-spacing:.08em;color:var(--pt-ink-soft);border-bottom:1px solid var(--pt-rule);padding-bottom:16px}
.project-meta .name{color:var(--pt-ink)}
.project-tagline{margin:0;font-size:calc(clamp(17px,2vw,21px) * var(--pt-scale));line-height:1.7;font-weight:500;max-width:40ch}
.project-body{display:flex;flex-direction:column;gap:20px;max-width:56ch;font-size:calc(clamp(15.5px,1.6vw,17.5px) * var(--pt-scale));line-height:1.85;color:var(--pt-ink-soft)}
.project-body p{margin:0}
.project-body .motto{font-family:var(--pt-serif);font-style:italic;color:var(--pt-ink)}

/* Lineup table */
.lineup{padding-top:clamp(48px,9vh,110px);padding-bottom:clamp(48px,9vh,110px);display:flex;flex-direction:column;gap:clamp(24px,4vh,40px);border-top:1px solid var(--pt-rule)}
.lineup h3{margin:0;font-family:var(--pt-mono);font-size:12px;letter-spacing:.14em;color:var(--pt-ink-soft);font-weight:400}
.lineup table{width:100%;font-size:calc(15.5px * var(--pt-scale))}
.lineup caption{text-align:left;font-size:calc(15px * var(--pt-scale));color:var(--pt-ink-soft);padding-bottom:16px}
.lineup thead tr{border-bottom:1px solid var(--pt-ink)}
.lineup th[scope="col"]{text-align:left;padding:12px 16px;font-family:var(--pt-mono);font-size:12px;letter-spacing:.1em;font-weight:400;color:var(--pt-ink-soft)}
.lineup th[scope="col"]:first-child{padding-left:0}
.lineup th[scope="col"]:last-child{padding-right:0}
.lineup tbody tr{border-bottom:1px solid var(--pt-rule)}
.lineup th[scope="row"]{text-align:left;font-weight:400;font-family:var(--pt-serif);padding:18px 16px 18px 0;line-height:1.6}
.lineup td{padding:18px 16px;color:var(--pt-ink-soft);line-height:1.6}
.lineup td.status{padding-right:0;font-family:var(--pt-mono);font-size:12px;letter-spacing:.06em;white-space:nowrap}
.lineup td.status.todo{color:var(--pt-teal)}

/* External collaboration */
.with{padding-bottom:clamp(56px,10vh,120px);display:flex;flex-direction:column;gap:clamp(24px,4vh,40px)}
.with h3{margin:0;font-family:var(--pt-mono);font-size:12px;letter-spacing:.14em;color:var(--pt-ink-soft);font-weight:400}
.with-row{display:flex;flex-wrap:wrap;gap:clamp(20px,4vw,56px);align-items:baseline;border-top:1px solid var(--pt-ink);border-bottom:1px solid var(--pt-rule);padding:22px 0}
.with-row .question{margin:0;font-family:var(--pt-serif);font-size:calc(clamp(18px,2.2vw,24px) * var(--pt-scale));line-height:1.5;flex:1 1 260px}
.with-row .detail{display:flex;flex-direction:column;gap:6px;flex:0 1 240px}
.with-row .client{font-size:calc(15.5px * var(--pt-scale));color:var(--pt-ink-soft)}
.with-row .link{font-family:var(--pt-mono);font-size:12px;letter-spacing:.06em}
.with-row .state{font-family:var(--pt-mono);font-size:12px;letter-spacing:.06em;color:var(--pt-ink-soft)}
.with .note{margin:0;max-width:56ch;font-size:calc(clamp(15.5px,1.6vw,17.5px) * var(--pt-scale));line-height:1.85;color:var(--pt-ink-soft)}

/* History */
.s04{gap:clamp(32px,5vh,56px);border-top:1px solid var(--pt-rule)}
.s04 h2{max-width:24ch}
.history{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.history li{display:flex;flex-wrap:wrap;gap:8px clamp(20px,4vw,48px);align-items:baseline;padding:clamp(18px,3vh,26px) 0;border-top:1px solid var(--pt-rule)}
.history li:last-child{border-top:1px solid var(--pt-ink);border-bottom:1px solid var(--pt-rule)}
.history .year{font-family:var(--pt-mono);font-size:13px;letter-spacing:.08em;color:var(--pt-teal);flex:0 0 60px}
.history .question{margin:0;font-family:var(--pt-serif);font-size:calc(clamp(17px,2vw,22px) * var(--pt-scale));line-height:1.5;flex:1 1 300px}
.history .who{font-size:calc(15px * var(--pt-scale));color:var(--pt-ink-soft);flex:0 1 240px}

/* Contact */
.s05{gap:clamp(32px,5vh,56px);border-top:1px solid var(--pt-rule)}
.s05 .section-num{color:var(--pt-amber)}
.s05 h2{max-width:22ch;font-size:calc(clamp(30px,5.6vw,66px) * var(--pt-scale));line-height:1.25}
.s05 h2 .underline{border-bottom:2px solid var(--pt-amber)}
.s05 .lede{margin:0;max-width:52ch;font-size:calc(clamp(16px,1.7vw,19px) * var(--pt-scale));line-height:1.85;color:var(--pt-ink-soft)}
.contact{display:flex;flex-direction:column;gap:20px;align-items:flex-start;border-top:1px solid var(--pt-rule);padding-top:clamp(24px,4vh,40px)}
.contact-mail{font-family:var(--pt-serif);font-size:calc(clamp(22px,3.4vw,40px) * var(--pt-scale));line-height:1.3;color:var(--pt-amber);text-decoration:none;border-bottom:1px solid var(--pt-amber);padding-bottom:4px;min-height:44px;display:inline-flex;align-items:center}
.contact-mail:hover{color:#B45309;border-bottom-color:#B45309;text-decoration:none}
.contact .place{margin:0;font-family:var(--pt-mono);font-size:12px;letter-spacing:.1em;color:var(--pt-ink-soft)}

/* Footer */
.site-footer{padding-top:clamp(28px,5vh,48px);padding-bottom:clamp(28px,5vh,48px);border-top:1px solid var(--pt-rule);display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;font-family:var(--pt-mono);font-size:12px;letter-spacing:.08em;color:var(--pt-ink-soft)}
