@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Gowun+Batang:wght@400;700&family=Manrope:wght@400;500;600;700;800&family=Nanum+Gothic:wght@400;700&family=Nanum+Myeongjo:wght@400;700&family=Noto+Sans+KR:wght@400;500;700&display=swap');

:root { color-scheme:light; --ink:#161616; --paper:#f5f3ee; --line:#d9d6ce; --lime:#d7f164; --blue:#82a6e5; --pink:#f59cb5; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,'Noto Sans KR',sans-serif; } .header { height:86px; display:flex; justify-content:space-between; align-items:center; padding:0 5vw; border-bottom:1px solid var(--line); } .brand { font-weight:800; font-size:1.35rem; letter-spacing:-.08em; color:inherit; text-decoration:none; } .brand span { color:#eb3f27; } nav { display:flex; gap:24px; } nav a { color:inherit; text-decoration:none; font-size:.8rem; font-weight:600; }
.hero { min-height:calc(100vh - 86px); padding:12vh 12vw 8vh; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; } .eyebrow,.label,footer { font-family:'DM Mono',monospace; font-size:.68rem; letter-spacing:.05em; } .hero h1 { font-size:clamp(3.4rem,8.3vw,8rem); font-weight:700; letter-spacing:-.085em; line-height:.98; margin:28px 0 30px; } h1 em { font-family:Georgia,serif; font-weight:400; } .intro { color:#555; line-height:1.75; font-size:1rem; } .button { margin-top:30px; background:var(--ink); color:white; text-decoration:none; padding:14px 18px; font-size:.76rem; border-radius:50px; } .button span { padding-left:18px; }
.section { border-top:1px solid var(--line); padding:100px 5vw; display:grid; grid-template-columns:25% 1fr; } .label { margin:4px 0; color:#666; } h2 { font-size:clamp(2rem,4.3vw,4.5rem); line-height:1.12; letter-spacing:-.07em; margin:0 0 38px; } .about > div > p { max-width:500px; color:#555; line-height:1.8; } dl { margin-top:55px; display:grid; grid-template-columns:1fr 1fr; max-width:590px; } dl div { border-top:1px solid var(--ink); padding-top:10px; } dt { font-family:'DM Mono',monospace; font-size:.65rem; color:#777; } dd { margin:8px 0; font-size:.87rem; font-weight:600; }
.projects { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; } .project { min-height:370px; padding:25px; display:flex; align-items:flex-end; position:relative; overflow:hidden; } .project div { position:relative; z-index:1; } .project p { font-family:'DM Mono',monospace; font-size:.7rem; margin:0 0 50px; } .project h3 { font-size:clamp(2rem,4vw,4.4rem); letter-spacing:-.08em; line-height:.88; margin:0 0 17px; } .project span { font-size:.72rem; } .project-one { background:var(--lime); } .project-two { background:var(--blue); } .project-three { background:var(--pink); grid-column:span 2; min-height:250px; } .project::after { content:''; position:absolute; width:230px; height:230px; border:1px solid rgba(0,0,0,.5); border-radius:50%; right:-30px; top:-40px; } .project-two::after { border-radius:0; transform:rotate(45deg); } .project-three::after { width:440px; height:130px; right:3%; top:30%; border-radius:100%; }
.contact { padding-bottom:130px; } .contact-copy { font-size:clamp(2rem,4.5vw,4.5rem); letter-spacing:-.075em; line-height:1.1; margin:0 0 42px; } .email { color:inherit; text-decoration:none; font-family:'DM Mono',monospace; font-size:clamp(1rem,2vw,1.8rem); border-bottom:1px solid var(--ink); padding-bottom:8px; } .email span { margin-left:30px; } footer { display:flex; justify-content:space-between; padding:22px 5vw; border-top:1px solid var(--line); color:#666; }
@media (max-width:650px) { .header { height:70px; } nav { gap:14px; } .hero { min-height:80vh; padding:10vh 7vw; } .hero h1 { font-size:3.35rem; } .section { padding:65px 7vw; display:block; } .label { margin-bottom:40px; } .projects { grid-template-columns:1fr; } .project { min-height:300px; } .project-three { grid-column:auto; } .contact { padding-bottom:85px; } footer { padding:18px 7vw; } }

.review-hero { min-height:65vh; padding:13vh 12vw 8vh; display:flex; flex-direction:column; justify-content:center; } .review-hero h1 { font-size:clamp(3.1rem,7.5vw,7rem); font-weight:700; letter-spacing:-.085em; line-height:.98; margin:26px 0; } .review-hero h1 em { font-family:Georgia,serif; font-weight:400; } .review-hero > p:last-child { max-width:480px; color:#555; line-height:1.8; }.reviews { border-top:1px solid var(--line); padding:70px 5vw 100px; }.review-list { border-top:1px solid var(--ink); }.review-card { display:grid; grid-template-columns:70px 1fr 25px; gap:20px; align-items:start; padding:27px 0; border-bottom:1px solid var(--line); text-decoration:none; color:inherit; transition:padding .2s, background .2s; }.review-card:hover { padding-left:15px; background:#eeeae0; }.review-card > span,.review-card p,.review-card time { font-family:'DM Mono',monospace; font-size:.68rem; }.review-card p { color:#777; margin:0 0 7px; }.review-card h2 { font-size:clamp(1.1rem,2.3vw,2rem); letter-spacing:-.055em; margin:0 0 10px; line-height:1.25; }.review-card time { color:#777; }.review-card b { font-size:1.2rem; font-weight:400; }.article-shell { width:min(860px, 90vw); margin:0 auto; padding:70px 0 130px; }.back { display:inline-block; color:inherit; font-size:.78rem; text-decoration:none; margin-bottom:75px; }.article-shell > h1 { font-size:clamp(2.2rem,5vw,4.7rem); letter-spacing:-.08em; line-height:1.08; margin:20px 0 55px; }.article-body { font-family:'Noto Sans KR',sans-serif; font-size:1rem; line-height:1.9; word-break:keep-all; }.article-body img { display:block; max-width:100%; height:auto; margin:28px auto; }.article-body figure { margin:30px 0; }.article-body figcaption { text-align:center; color:#777; font-size:.78rem; }.article-body a { color:inherit; text-decoration:underline; text-underline-offset:3px; }.article-body h2,.article-body h3 { margin:52px 0 16px; letter-spacing:-.04em; line-height:1.35; }.article-body iframe { display:block; max-width:100%; margin:28px auto; }.article-body .youtube-embed { aspect-ratio:16/9; }.article-body .youtube-embed iframe { width:100%; height:100%; border:0; margin:0; }.article-body table { width:100%; border-collapse:collapse; font-size:.88rem; }.article-body td,.article-body th { border:1px solid var(--line); padding:8px; } @media (max-width:650px) { .review-hero { min-height:60vh; padding:11vh 7vw 7vh; }.reviews { padding:55px 7vw 75px; }.review-card { grid-template-columns:38px 1fr 15px; gap:10px; }.article-shell { padding:50px 0 80px; }.back { margin-bottom:50px; }.article-body { font-size:.94rem; } }

.header { position:sticky; top:0; z-index:20; background:color-mix(in srgb,var(--paper) 90%,transparent); backdrop-filter:blur(14px); transition:box-shadow .2s }
.header.is-scrolled { box-shadow:0 8px 28px rgba(22,22,22,.06) }
.language-switcher { display:flex; align-items:center; gap:2px; margin-left:14px; padding-left:14px; border-left:1px solid var(--line) }
.language-switcher button { min-width:28px; padding:5px 4px; border:0; border-radius:14px; background:transparent; color:#777; text-align:center; cursor:pointer; font:600 .55rem 'DM Mono',monospace }
.language-switcher button:hover,.language-switcher button.is-active { background:var(--ink); color:#fff }
.review-hero { position:relative; overflow:hidden }
.review-hero::after { content:""; position:absolute; width:min(34vw,460px); aspect-ratio:1; border:1px solid var(--ink); border-radius:50%; right:-6vw; top:9vh; box-shadow:-45px 45px 0 var(--lime),-90px 90px 0 var(--blue); opacity:.75; z-index:-1 }
.review-controls { display:flex; justify-content:space-between; align-items:end; margin:42px 0 18px }
.search-box { width:min(520px,70%); display:grid; gap:8px }
.search-box span,.review-controls p { font-family:'DM Mono',monospace; font-size:.65rem; color:#777 }
.search-box input { width:100%; border:0; border-bottom:1px solid var(--ink); background:transparent; padding:10px 0; font:500 1rem Manrope,'Noto Sans KR',sans-serif; outline:none }
.search-box input:focus { border-bottom-width:2px }
.review-card[hidden] { display:none }
.review-card h2 { max-width:900px }
.reading-progress { position:fixed; z-index:100; left:0; top:0; width:100%; height:3px; background:#e7422d; transform:scaleX(0); transform-origin:left }
.toc { border:1px solid var(--line); border-radius:12px; padding:22px 25px; margin:0 0 60px; display:grid; gap:9px }
.toc p { font:500 .65rem 'DM Mono'; color:#777; margin:0 0 7px }
.toc a { text-decoration:none; font-size:.82rem; line-height:1.5 }
.toc a:hover { text-decoration:underline }
.toc .toc-sub { padding-left:16px; color:#666 }
.article-shell.has-toc { width:min(1360px,92vw); display:grid; grid-template-columns:240px minmax(0,860px); column-gap:55px; justify-content:center; align-items:start }
.article-shell.has-toc > .back,.article-shell.has-toc > .eyebrow,.article-shell.has-toc > h1 { grid-column:2 }
.article-shell.has-toc > .toc { grid-column:1; grid-row:4; position:sticky; top:112px; max-height:calc(100vh - 145px); overflow:auto; margin:0; border:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); border-radius:0; padding:20px 8px }
.article-shell.has-toc > .toc { display:flex; flex-direction:column; gap:0 }
.article-shell.has-toc > .toc > p { margin:0 0 7px }
.article-shell.has-toc > .toc > div:not(.review-side-actions) { display:grid; gap:9px }
.article-shell.has-toc > .toc > .review-side-actions { display:grid; gap:8px; margin-top:22px; padding-top:18px; border-top:1px solid var(--line) }
.article-shell.has-toc > .toc > .review-side-actions button,.article-shell.has-toc > .toc > .review-side-actions a { width:100%; border:1px solid var(--line); border-radius:20px; padding:9px 13px; background:transparent; color:inherit; text-decoration:none; font:600 .65rem inherit; cursor:pointer; text-align:center }
.article-shell.has-toc > .toc > .review-side-actions .is-active { background:var(--ink); color:var(--paper); border-color:var(--ink) }
.article-shell.has-toc > .article-body { grid-column:2; grid-row:4 }
.article-shell.has-toc > .revenue-link { grid-column:2 }
.article-shell.has-toc:has(> .revenue-link-top) > .revenue-link-top { grid-row:4 }
.article-shell.has-toc:has(> .revenue-link-top) > .article-body { grid-row:5 }
.article-shell.has-toc:has(> .revenue-link-top) > .toc { grid-row:4 / span 2 }
.article-shell.has-toc:has(> .revenue-link-top) > .revenue-link-bottom { grid-row:6 }
.article-shell.has-toc:not(:has(> .revenue-link-top)) > .revenue-link-bottom { grid-row:5 }
.article-shell.has-toc:not(:has(> .revenue-link-top)):has(> .revenue-link-bottom) > .toc { grid-row:4 / span 2 }
.article-shell.has-toc .toc a { color:#747670; transition:color .2s,transform .2s }
.article-shell.has-toc .toc a.is-active { color:var(--ink); font-weight:700; transform:translateX(4px) }
.article-body blockquote { margin:35px 0; border-left:3px solid var(--ink); padding:5px 0 5px 22px; color:#555 }
.article-body pre { overflow:auto; margin:32px 0; padding:22px; border-radius:10px; background:#171817; color:#f4f4f0; font:400 .82rem/1.7 'DM Mono',monospace; white-space:pre-wrap }
.article-body hr { margin:48px 0; border:0; border-top:1px solid var(--line) }
.revenue-link { margin:34px 0; padding:12px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.35) }
.revenue-link > span { display:block; margin:0 4px 11px; color:#666; font:500 .7rem/1.65 'Noto Sans KR',sans-serif; letter-spacing:0 }
.revenue-link > div { display:grid; gap:7px }
.revenue-link > a,.revenue-link > div > a { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:11px 16px; border-radius:9px; background:var(--ink); color:#fff; text-decoration:none; transition:transform .18s,background .18s }
.revenue-link > a:hover,.revenue-link > div > a:hover { transform:translateY(-2px); background:#2b2c28 }
.revenue-link strong { font-size:.82rem }
.revenue-link b { font-size:1rem }
.revenue-link-top { margin-bottom:48px }
.revenue-link-bottom { margin-top:55px }
.article-body p { margin:1.25em 0 }
.article-body h2 { font-size:clamp(1.5rem,3vw,2.4rem) }
.article-body h3 { font-size:clamp(1.15rem,2vw,1.55rem) }
@media (max-width:650px) {
  .review-hero::after { opacity:.25; width:75vw }
  .review-controls { align-items:center }
  .search-box { width:75% }
  .review-controls p { white-space:nowrap }
  .toc { padding:18px; margin-bottom:40px }
}
@media (max-width:1050px) {
  .article-shell.has-toc { width:min(860px,90vw); display:block }
  .article-shell.has-toc > .toc { position:static; max-height:none; margin:0 0 45px; border:1px solid var(--line); border-radius:12px; padding:20px }
}

.site-footer { display:block; background:var(--paper); color:var(--ink); padding:55px 5vw 25px; border-top:1px solid var(--line) }
.footer-social { display:flex; justify-content:center; gap:10px; margin-bottom:34px }
.footer-social a { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; border:1px solid var(--line); background:#fff; color:var(--ink); text-decoration:none; font:800 .72rem Manrope,sans-serif; transition:transform .2s,background .2s }
.footer-social a:hover { transform:translateY(-3px); background:var(--lime) }
.footer-social img { display:block; width:17px; height:17px; object-fit:contain }
.footer-rule { border-top:1px solid var(--line) }
.footer-info { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:35px; padding:28px 0 34px }
.footer-info strong { color:var(--ink); font-size:1.1rem; letter-spacing:-.04em }
.footer-info p { margin:10px 0 0; color:#777972; font:400 .67rem/1.7 'DM Mono',monospace }
.footer-info > div { display:flex; flex-direction:column; align-items:flex-start; gap:8px }
.footer-info span { color:#8a8b85; font:500 .58rem 'DM Mono',monospace; letter-spacing:.09em }
.footer-info a,.footer-info nav a { color:#4f514d; text-decoration:none; font:500 .69rem Manrope,'Noto Sans KR',sans-serif }
.footer-info a:hover,.footer-info nav a:hover { color:var(--ink); text-decoration:underline }
.footer-info nav { display:flex; justify-content:flex-end; gap:20px; align-items:flex-start }
.footer-info nav a:first-child { color:var(--ink); font-weight:700 }
.footer-bottom { display:flex; justify-content:space-between; padding-top:18px; border-top:1px solid var(--line); color:#8a8b85; font:400 .57rem 'DM Mono',monospace; letter-spacing:.04em }
.policy { min-height:calc(100vh - 86px) }
@media (max-width:720px) {
  .site-footer { padding:45px 7vw 22px }
  .footer-info { grid-template-columns:1fr 1fr; gap:28px 18px }
  .footer-info nav { justify-content:flex-start; flex-direction:column; gap:9px }
  .footer-bottom { gap:15px; line-height:1.5 }
}

.resume-page { background:var(--paper) }
.resume-page .header nav a[aria-current="page"] { font-weight:700; border-bottom:1px solid var(--ink) }
.resume-hero { min-height:92vh; padding:15vh 7vw 9vh; display:grid; grid-template-columns:1.25fr .75fr; gap:7vw; align-items:center; border-bottom:1px solid var(--line) }
.resume-hero h1 { margin:24px 0 0; font-size:clamp(4.3rem,9vw,9rem); line-height:.88; letter-spacing:-.09em }
.resume-hero h1 em,.resume-closing h2 em { font-family:Georgia,serif; font-weight:400 }
.resume-intro { max-width:510px; font-size:.92rem; line-height:1.8; color:#585a56 }
.resume-intro blockquote { margin:28px 0; color:var(--ink); font-size:clamp(1.5rem,2.5vw,2.25rem); line-height:1.3; letter-spacing:-.055em; font-weight:700 }
.resume-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:35px }
.resume-actions a,.resume-actions button { border:1px solid var(--ink); border-radius:30px; padding:13px 17px; font:600 .72rem inherit; text-decoration:none; cursor:pointer }
.resume-actions a { background:var(--ink); color:white }
.resume-actions button { background:transparent; color:var(--ink) }
.resume-contact,.resume-section { padding:90px 7vw; border-bottom:1px solid var(--line) }
.resume-facts { margin-top:38px; display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line); border:1px solid var(--line) }
.resume-facts > div { min-height:125px; padding:22px; background:var(--paper); display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start }
.resume-facts span,.work-meta,.compact-list time { font:500 .6rem 'DM Mono'; letter-spacing:.06em; color:#888a84 }
.resume-facts strong,.resume-facts a { color:var(--ink); font-size:.84rem; text-decoration:none; word-break:break-word }
.resume-section { display:grid; grid-template-columns:minmax(180px,.35fr) 1fr; gap:7vw }
.resume-section-title h2,.split-section h2 { margin:16px 0 0; font-size:clamp(2rem,4vw,4.2rem); line-height:1; letter-spacing:-.075em }
.timeline article { display:grid; grid-template-columns:160px 1fr; gap:25px; padding:25px 0; border-top:1px solid var(--line) }
.timeline time { font:500 .63rem 'DM Mono'; color:#858781 }
.timeline h3,.compact-list h3 { margin:0; font-size:1.2rem; letter-spacing:-.04em }
.timeline p,.compact-list p { margin:8px 0 0; color:#777; font-size:.78rem }
.work-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px }
.work-card { min-height:430px; padding:28px; border:1px solid var(--line); border-radius:16px; background:#fff; color:var(--ink); text-decoration:none; display:grid; grid-template-columns:35px 1fr; gap:20px; transition:transform .25s,box-shadow .25s }
.work-card:hover { transform:translateY(-4px); box-shadow:0 18px 45px #1b1c1912 }
.work-card-featured { grid-column:auto; min-height:430px }
.work-number { font:500 .65rem 'DM Mono'; color:#aaa }
.work-body { display:flex; flex-direction:column; align-items:flex-start }
.work-body h3 { margin:12px 0 22px; font-size:clamp(2rem,4vw,4rem); letter-spacing:-.075em }
.work-body > p:not(.work-meta) { max-width:650px; margin:0; line-height:1.75; color:#5f615d; font-size:.83rem }
.work-body ul { padding-left:18px; margin:25px 0; color:#5f615d; font-size:.77rem; line-height:1.9 }
.work-body strong { font-size:.8rem; margin-top:auto }
.work-card-image { width:100%; height:190px; margin:0 0 22px; overflow:hidden; background:#e4e3dd }
.work-card-image img { width:100%; height:100%; object-fit:cover; transition:transform .4s }
.work-card:hover .work-card-image img { transform:scale(1.025) }
.work-card-featured .work-card-image { height:190px }
.partners-section { padding:70px 5vw; border-top:1px solid var(--line); border-bottom:1px solid var(--line) }
.home-partners { margin-top:40px; padding:55px 0 15px; border-bottom:0 }
.partners-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:28px }
.partners-heading h2 { margin:0; font-size:clamp(2rem,4vw,4rem); letter-spacing:-.065em }
.partner-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); border-top:1px solid var(--line); border-left:1px solid var(--line) }
.partner-grid a { min-height:125px; padding:20px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr auto; align-items:end; gap:12px; color:var(--ink); text-decoration:none; transition:background .2s }
.partner-grid a:hover { background:#fff }
.partner-grid img { grid-column:1/-1; align-self:center; justify-self:center; display:block; max-width:120px; max-height:48px; object-fit:contain }
.partner-grid span { font-weight:700; font-size:.82rem }
.partner-grid b { font-weight:400 }
.work-detail-link { margin-top:22px; color:var(--ink); font-size:.73rem; text-decoration:underline; text-underline-offset:5px }
.split-section { grid-template-columns:1fr 1fr; gap:7vw }
.compact-list { margin-top:35px }
.compact-list article { min-height:120px; padding:22px 0; border-top:1px solid var(--line) }
.compact-list h3 { margin-top:15px }
.milestone-grid { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line) }
.milestone-grid span { padding:22px 15px 22px 0; border-bottom:1px solid var(--line); font-size:.8rem }
.competition-list { border-top:1px solid var(--line) }
.competition-list p { margin:0; padding:17px 0; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; gap:25px; font-size:.78rem }
.competition-list b { font-family:'DM Mono'; font-size:.65rem; white-space:nowrap }
.resume-dynamic-categories { display:contents }
.resume-dynamic-categories .milestone-grid { grid-template-columns:1fr }
.resume-dynamic-categories .milestone-grid span { display:flex; align-items:baseline; justify-content:space-between; gap:28px; padding:17px 0 }
.resume-dynamic-categories .milestone-grid span b { margin-left:auto; text-align:right; font:600 .65rem 'DM Mono',monospace }
.resume-closing { min-height:75vh; padding:12vh 7vw; display:flex; flex-direction:column; justify-content:center; align-items:flex-start }
.resume-closing h2 { margin:25px 0 45px; font-size:clamp(3rem,7vw,7rem); line-height:.95; letter-spacing:-.085em }
.resume-closing a { color:var(--ink); text-decoration:none; border-bottom:1px solid var(--ink); padding-bottom:8px; font:500 clamp(.9rem,1.8vw,1.5rem) 'DM Mono' }
.case-shell { width:min(1180px,90vw); margin:0 auto; padding:150px 0 110px }
.case-hero { min-height:65vh; display:grid; grid-template-columns:1.2fr .8fr; gap:7vw; align-items:center }
.case-hero h1 { margin:20px 0 0; font-size:clamp(5rem,12vw,11rem); line-height:.78; letter-spacing:-.095em }
.case-hero h1 em { font-family:Georgia,serif; font-weight:400 }
.case-hero > p { max-width:430px; color:#62645f; line-height:1.8 }
.case-cover { margin:0; height:min(66vw,720px); overflow:hidden; background:#ddd }
.case-cover img { width:100%; height:100%; object-fit:cover }
.case-cover-dark { background:#050505 }
.case-cover-dark img { object-fit:contain; padding:clamp(35px,7vw,90px); box-sizing:border-box }
.case-grid { padding:110px 0; display:grid; grid-template-columns:25% 1fr; gap:6vw; border-bottom:1px solid var(--line) }
.case-grid h2,.case-result h2 { margin:0 0 35px; font-size:clamp(2.8rem,6vw,6rem); line-height:.98; letter-spacing:-.08em }
.case-grid > div > p,.case-result > p { max-width:650px; color:#62645f; line-height:1.85 }
.case-list { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border-bottom:1px solid var(--line) }
.case-list article { min-height:300px; padding:32px; background:var(--paper) }
.case-list span { font:500 .62rem 'DM Mono'; color:#999 }
.case-list h3 { margin:70px 0 20px; font-size:1.35rem; letter-spacing:-.04em }
.case-list p { color:#696b66; font-size:.82rem; line-height:1.75 }
.case-result { min-height:75vh; padding:110px 0; display:flex; flex-direction:column; align-items:flex-start; justify-content:center }
.case-result a { margin-top:30px; color:var(--ink); text-underline-offset:6px }
.case-event-image { width:min(100%,1100px); margin:10px 0 34px }
.case-event-image img { display:block; width:100%; height:auto }
.case-gallery-section { padding:110px 0; display:grid; grid-template-columns:260px 1fr; gap:45px; border-bottom:1px solid var(--line) }
.case-gallery-section > div > h2 { margin:18px 0 0; font-size:clamp(2.5rem,4.5vw,4.8rem); line-height:.95; letter-spacing:-.075em }
.case-gallery-section h2 em { font-family:Georgia,serif; font-weight:400 }
.case-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:10px }
.case-gallery figure { margin:0 }
.case-gallery img { display:block; width:100%; aspect-ratio:1; object-fit:cover; background:#ddd }
.case-gallery figcaption { padding:9px 0 18px; font:500 .55rem 'DM Mono'; color:#888; letter-spacing:.05em }
.case-models { padding:55px 0; display:grid; grid-template-columns:25% 1fr; gap:6vw; border-bottom:1px solid var(--line) }
.case-models > p:last-child { margin:0; max-width:780px; font-size:.78rem; line-height:2; color:#666 }
.admin-project-blocks { border-bottom:1px solid var(--line) }
.admin-project-block { padding:90px 0; display:grid; grid-template-columns:25% 1fr; gap:30px 6vw; border-bottom:1px solid var(--line) }
.admin-project-block:last-child { border-bottom:0 }
.admin-project-block-copy h2 { margin:0 0 24px; font-size:clamp(2rem,4.5vw,4.8rem); line-height:1; letter-spacing:-.07em }
.admin-project-block-copy p { margin:0; max-width:700px; color:#62645f; line-height:1.85 }
.admin-project-block > figure,.admin-project-block > .video-frame { grid-column:2; margin:20px 0 0 }
.admin-project-block > figure img { display:block; width:100%; max-height:760px; object-fit:cover }
.admin-project-block.is-link-card { padding:18px 0; display:block }
.admin-project-block.is-link-card > a { display:grid; grid-template-columns:110px 1fr auto; gap:22px; align-items:center; padding:18px; border:1px solid var(--line); border-radius:16px; color:var(--ink); text-decoration:none; transition:transform .2s ease,background .2s ease }
.admin-project-block.is-link-card > a:hover { transform:translateY(-2px); background:#fff }
.admin-project-block.is-link-card figure { grid-column:auto; margin:0; width:110px; aspect-ratio:1; overflow:hidden; border-radius:12px; background:#fff }
.admin-project-block.is-link-card figure img { width:100%; height:100%; object-fit:cover }
.admin-project-block.is-link-card h2 { margin:4px 0 7px; font-size:clamp(1.25rem,2.2vw,2rem); letter-spacing:-.04em }
.admin-project-block.is-link-card p { margin:0; color:#777 }
.admin-project-block.is-link-card span { font:600 .65rem 'DM Mono',monospace }
.video-section { padding:110px 0; border-bottom:1px solid var(--line) }
.video-section-heading { display:grid; grid-template-columns:25% 1fr; gap:6vw; margin-bottom:55px }
.video-section-heading h2 { margin:0; font-size:clamp(2.8rem,6vw,6rem); line-height:.98; letter-spacing:-.08em }
.video-section-heading h2 em { font-family:Georgia,serif; font-weight:400 }
.video-section-heading > p:last-child { grid-column:2; margin:0; max-width:650px; color:#62645f; line-height:1.8 }
.video-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px 14px }
.video-card { min-width:0 }
.video-frame { position:relative; aspect-ratio:16/9; overflow:hidden; background:#111 }
.video-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0 }
.video-card > p { margin:10px 0 0; font:500 .58rem 'DM Mono'; color:#777; letter-spacing:.05em }

/* Public-site color theme */
.theme-toggle {
  order:4;
  flex:0 0 auto;
  width:34px;
  height:34px;
  margin-left:10px;
  border:1px solid var(--line);
  border-radius:50%;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font:500 1rem/1 sans-serif;
  transition:background .2s,border-color .2s,transform .2s;
}
.header > .brand { order:1 }
.header > nav:not(.language-switcher) {
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  justify-content:center;
  order:2;
}
.header > .language-switcher {
  order:3;
  margin-left:auto;
}
.theme-toggle:hover { background:var(--ink); color:var(--paper); transform:translateY(-1px) }

:root[data-theme="dark"] {
  color-scheme:dark;
  --ink:#f1f0eb;
  --paper:#151615;
  --line:#383a37;
  --lime:#b9d94e;
  --blue:#7395d1;
  --pink:#d9829c;
}
:root[data-theme="dark"] body,
:root[data-theme="dark"] .resume-page { background:var(--paper); color:var(--ink) }
:root[data-theme="dark"] .header {
  background:color-mix(in srgb,var(--paper) 90%,transparent);
  box-shadow:none;
}
:root[data-theme="dark"] .header.is-scrolled { box-shadow:0 8px 28px rgba(0,0,0,.28) }
:root[data-theme="dark"] .language-switcher button:hover,
:root[data-theme="dark"] .language-switcher button.is-active { color:var(--paper) }
:root[data-theme="dark"] .project { color:#161616 }
:root[data-theme="dark"] .intro,
:root[data-theme="dark"] .about > div > p,
:root[data-theme="dark"] .review-hero > p:last-child,
:root[data-theme="dark"] .article-body blockquote,
:root[data-theme="dark"] .resume-intro,
:root[data-theme="dark"] .work-body > p:not(.work-meta),
:root[data-theme="dark"] .work-body ul,
:root[data-theme="dark"] .case-hero > p,
:root[data-theme="dark"] .case-grid > div > p,
:root[data-theme="dark"] .case-result > p,
:root[data-theme="dark"] .case-list p,
:root[data-theme="dark"] .case-models > p:last-child,
:root[data-theme="dark"] .admin-project-block-copy p,
:root[data-theme="dark"] .video-section-heading > p:last-child { color:#b9bbb5 }
:root[data-theme="dark"] .label,
:root[data-theme="dark"] dt,
:root[data-theme="dark"] .review-card p,
:root[data-theme="dark"] .review-card time,
:root[data-theme="dark"] .search-box span,
:root[data-theme="dark"] .review-controls p,
:root[data-theme="dark"] .toc p,
:root[data-theme="dark"] .toc .toc-sub,
:root[data-theme="dark"] .toc a,
:root[data-theme="dark"] .revenue-link > span,
:root[data-theme="dark"] .timeline p,
:root[data-theme="dark"] .compact-list p,
:root[data-theme="dark"] .footer-info p,
:root[data-theme="dark"] .footer-info a,
:root[data-theme="dark"] .footer-info nav a,
:root[data-theme="dark"] .video-card > p { color:#9fa29b }
:root[data-theme="dark"] .review-card:hover,
:root[data-theme="dark"] .partner-grid a:hover,
:root[data-theme="dark"] .admin-project-block.is-link-card > a:hover { background:#202220 }
:root[data-theme="dark"] .work-card,
:root[data-theme="dark"] .review-count,
:root[data-theme="dark"] .review-search,
:root[data-theme="dark"] .footer-social a,
:root[data-theme="dark"] .admin-project-block.is-link-card figure { background:#202220 }
:root[data-theme="dark"] .revenue-link { background:rgba(255,255,255,.035) }
:root[data-theme="dark"] .revenue-link > a,
:root[data-theme="dark"] .revenue-link > div > a,
:root[data-theme="dark"] .button,
:root[data-theme="dark"] .resume-actions a { background:#ecece7; color:#151615 }
:root[data-theme="dark"] .revenue-link > a:hover,
:root[data-theme="dark"] .revenue-link > div > a:hover { background:#fff }
:root[data-theme="dark"] .footer-social img { filter:invert(1) }
:root[data-theme="dark"] img { opacity:.94 }

@media (max-width:650px) {
  .theme-toggle { width:31px; height:31px; margin-left:4px }
  .header > nav:not(.language-switcher) { gap:10px }
  .header > nav:not(.language-switcher) a { font-size:.68rem }
  .header > .language-switcher { margin-left:auto; padding-left:8px }
}
@media (max-width:800px) {
  .resume-hero { min-height:auto; padding:15vh 7vw 10vh; grid-template-columns:1fr }
  .resume-hero h1 { font-size:clamp(3.6rem,17vw,6rem) }
  .resume-facts { grid-template-columns:1fr 1fr }
  .resume-section { grid-template-columns:1fr; gap:45px }
  .work-grid,.split-section { grid-template-columns:1fr }
  .work-card-featured { grid-column:auto }
  .milestone-grid { grid-template-columns:1fr }
  .resume-dynamic-categories .milestone-grid span { align-items:flex-start; gap:14px }
  .review-browser-tools { flex-direction:column }
  .review-count { justify-content:space-between }
  .review-search { grid-template-columns:auto 1fr 44px }
  .review-search input { width:100% }
  .partner-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .partners-heading { align-items:start; flex-direction:column }
  .case-hero,.case-grid { grid-template-columns:1fr }
  .case-hero { min-height:70vh }
  .case-list { grid-template-columns:1fr }
  .case-cover { height:85vw }
  .case-gallery-section,.case-models { grid-template-columns:1fr }
  .case-gallery { grid-template-columns:1fr 1fr }
  .video-section-heading { grid-template-columns:1fr; gap:20px }
  .video-section-heading > p:last-child { grid-column:auto }
  .video-grid { grid-template-columns:1fr }
  .admin-project-block { grid-template-columns:1fr }
  .admin-project-block > figure,.admin-project-block > .video-frame { grid-column:auto }
  .admin-project-block.is-link-card > a { grid-template-columns:72px 1fr; gap:14px }
  .admin-project-block.is-link-card figure { width:72px }
  .admin-project-block.is-link-card span { grid-column:2 }
}
@media print {
  .resume-page .header,.resume-actions,.site-footer { display:none!important }
  .resume-hero { min-height:auto; padding-top:30px }
  .resume-contact,.resume-section,.resume-closing { padding:35px 20px; break-inside:avoid }
  .work-card { min-height:auto; break-inside:avoid }
}

.home-showcase { min-height:0; padding:100px 5vw 18px; border-bottom:1px solid var(--line) }
.review-hero[hidden] { display:none!important }
.showcase-grid { display:flex; gap:12px; overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth; scroll-snap-type:x proximity; overscroll-behavior-x:contain; scrollbar-width:none; cursor:grab; touch-action:pan-x; user-select:none }
.showcase-grid::-webkit-scrollbar { display:none }
.showcase-grid.is-dragging { cursor:grabbing; scroll-behavior:auto; scroll-snap-type:none; user-select:none }
.showcase-card { position:relative; flex:0 0 calc((100% - 48px)/5); min-width:0; color:var(--ink); text-decoration:none; scroll-snap-align:start }
.showcase-card img { display:block; width:100%; height:clamp(260px,21vw,370px); object-fit:cover; background:#ddd; filter:saturate(.92); transition:filter .25s,transform .35s; pointer-events:none; -webkit-user-drag:none }
.showcase-card span { display:flex; justify-content:space-between; align-items:center; padding-top:12px }
.showcase-card b { font-size:.76rem }
.showcase-card small { font:400 .6rem 'DM Mono'; color:#92948d }
.showcase-card > i { position:absolute; top:10px; left:10px; padding:6px 8px; background:#f3f2eddd; color:var(--ink); font:500 .52rem 'DM Mono'; letter-spacing:.06em; font-style:normal }
.showcase-card:hover img { filter:saturate(1.08); transform:translateY(-3px) }
.showcase-extra { display:block }
.showcase-bar { display:flex; align-items:center; gap:18px; width:100%; margin:0 0 22px; padding-bottom:14px; border-bottom:1px solid var(--line) }
.showcase-more { display:flex; justify-content:space-between; flex:1; color:#73756f; text-decoration:none; font:500 .62rem 'DM Mono'; letter-spacing:.04em }
.showcase-arrows { display:flex; gap:6px }
.showcase-arrows button { width:30px; height:27px; border:1px solid var(--line); border-radius:15px; background:transparent; color:var(--ink); cursor:pointer }
.showcase-arrows button:hover { background:var(--ink); color:#fff }
.home-showcase + .reviews { padding-top:12px }
.home-showcase + .reviews .review-controls { margin-top:0 }
.reviews > .label:last-child { margin:32px 0 0; text-align:right }
.reviews { scroll-margin-top:80px }
.reviews-more { display:flex; align-items:center; justify-content:space-between; margin-top:26px; padding:20px 22px; border:1px solid var(--ink); border-radius:12px; background:var(--ink); color:#fff; text-decoration:none; font-weight:700; transition:transform .2s,background .2s }
.reviews-more:hover { transform:translateY(-2px); background:#2b2c28 }
.reviews-directory-hero { padding:110px 5vw 55px; border-bottom:1px solid var(--line) }
.reviews-directory-hero h1 { margin:14px 0 0; font-size:clamp(2.8rem,6vw,6rem); letter-spacing:-.075em; line-height:1 }
.reviews-page .reviews { border-top:0; padding-top:45px }
.review-browser { margin-top:36px; padding-top:24px; border-top:1px solid var(--line) }
.review-pagination { display:flex; flex-wrap:wrap; justify-content:center; gap:5px; margin-bottom:18px }
.review-pagination button { min-width:34px; height:34px; padding:0 8px; border:0; border-radius:17px; background:transparent; color:#777; cursor:pointer; font:600 .7rem 'DM Mono',monospace }
.review-pagination button:hover,.review-pagination button.is-active { background:var(--ink); color:#fff }
.review-browser-tools { display:flex; justify-content:center; gap:10px }
.review-count,.review-search { min-height:44px; border:1px solid var(--ink); background:#fff }
.review-count { display:flex; align-items:center; gap:8px; padding:0 12px; font:500 .68rem 'DM Mono',monospace }
.review-count select { border:0; background:transparent; color:inherit; font:inherit; outline:0 }
.review-search { display:grid; grid-template-columns:auto minmax(180px,420px) 44px; align-items:center }
.review-search span { padding:0 12px; border-right:1px solid var(--line); color:#777; font-size:.72rem }
.review-search input { width:min(38vw,420px); height:100%; border:0; padding:0 12px; background:transparent; outline:0; font:inherit }
.review-search button { height:100%; border:0; border-left:1px solid var(--line); background:var(--ink); color:#fff; cursor:pointer; font-size:1.25rem }
.article-ad-side { position:fixed; z-index:2; top:125px; right:max(22px,calc((100vw - 1540px)/2)); width:280px; min-height:250px }
.article-ad-bottom { width:100%; min-height:120px; margin:70px 0 0; padding-top:20px; border-top:1px solid var(--line) }
.article-ad-side > span,.article-ad-bottom > span { display:block; margin-bottom:8px; color:#999; font:500 .52rem 'DM Mono',monospace; letter-spacing:.08em }
@media (max-width:1450px) {
  .article-ad-side.desktop-only { display:none }
  .article-ad-side:not(.desktop-only) { position:static; width:100%; min-height:120px; margin:55px 0 0 }
}
@media (max-width:800px) {
  .home-showcase { padding:82px 7vw 16px }
  .showcase-grid { gap:9px }
  .showcase-card { flex-basis:78vw }
.showcase-card img { height:72vw }
}
@media (max-width:650px) {
  .header {
    height:70px;
    min-height:70px;
    flex-wrap:nowrap;
    padding:0 12px;
  }
  .header > .brand { flex:0 0 auto; font-size:1.08rem }
  .header > nav:not(.language-switcher) {
    left:50%;
    gap:8px;
    white-space:nowrap;
  }
  .header > nav:not(.language-switcher) a { font-size:.61rem }
  .header > .language-switcher {
    width:auto;
    flex:0 0 auto;
    justify-content:flex-end;
    gap:0;
    margin:0 0 0 auto;
    padding:0 0 0 6px;
    border-top:0;
    border-left:1px solid var(--line);
  }
  .header > .language-switcher button { min-width:22px; padding:5px 2px; font-size:.48rem }
  .theme-toggle { width:29px; height:29px; margin-left:3px; font-size:.88rem }
}
@media (max-width:360px) {
  .header { padding-inline:9px }
  .header > .brand { font-size:.98rem }
  .header > nav:not(.language-switcher) { gap:5px }
  .header > nav:not(.language-switcher) a { font-size:.55rem }
  .header > .language-switcher { padding-left:3px }
  .header > .language-switcher button { min-width:19px; font-size:.44rem }
  .theme-toggle { width:27px; height:27px }
}

/* Imported Tistory footer controls */
.article-tools { display:flex; justify-content:flex-end; gap:8px; margin:70px 0 20px; padding-top:20px; border-top:1px solid var(--line) }
.article-tools a,.article-tools button { min-width:105px; padding:12px 17px; border:1px solid var(--ink); border-radius:999px; background:transparent; color:var(--ink); font:600 .7rem 'Noto Sans KR',sans-serif; text-align:center; text-decoration:none; cursor:pointer; transition:background .18s,color .18s,transform .18s }
.article-tools a:hover,.article-tools button:hover { background:var(--ink); color:#fff; transform:translateY(-1px) }
.another_category { margin:0 0 35px; padding:26px; border:1px solid var(--line); border-radius:18px; background:transparent }
.another_category h4 { margin:0 0 18px; padding-bottom:17px; border-bottom:1px solid var(--ink); font-size:1rem; letter-spacing:-.03em }
.another_category h4 a { font-weight:800; text-decoration:none }
.article-body .another_category table { display:block; width:100%; border:0; font-size:.9rem }
.another_category tbody { display:grid }
.another_category tr { display:grid; grid-template-columns:1fr auto; gap:20px; align-items:center; padding:15px 4px; border-bottom:1px solid var(--line); cursor:pointer; transition:padding .18s,background .18s }
.another_category tr:last-child { border-bottom:0 }
.another_category tr:hover { padding-left:12px; background:rgba(0,0,0,.025) }
.article-body .another_category th,.article-body .another_category td { display:block; padding:0; border:0; text-align:left }
.another_category th { min-width:0; font-weight:650 }
.another_category th a { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-decoration:none }
.another_category td { color:#85877f; font:500 .62rem 'DM Mono',monospace; white-space:nowrap }
@media (max-width:650px) {
  .article-tools { margin-top:45px }
  .article-tools a,.article-tools button { flex:1; min-width:0 }
  .another_category { padding:20px 16px }
  .another_category tr { grid-template-columns:1fr; gap:5px }
  .another_category th a { white-space:normal }
}
/* Review product data, comparison and personal reading tools */
.product-summary { margin:34px 0; padding:24px; border:1px solid var(--line,#d9d7cf); border-radius:15px; background:var(--surface,#fff) }
.product-summary-head { display:flex; justify-content:space-between; gap:20px; align-items:start }
.product-summary-head span { font:500 .62rem 'DM Mono',monospace; color:var(--muted,#777); letter-spacing:.08em }
.product-summary-head h2 { margin:7px 0 0; font-size:1.35rem }
.product-summary-head > strong { font-size:2rem; white-space:nowrap }
.product-summary-head > strong small { font-size:.7rem; color:var(--muted,#777) }
.product-summary blockquote { margin:20px 0; padding:15px 18px; border-left:3px solid var(--ink,#171817); background:rgba(127,127,127,.07); font-weight:600 }
.product-summary dl { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line,#ddd); border:1px solid var(--line,#ddd); border-radius:10px; overflow:hidden }
.product-summary dl div { padding:13px; background:var(--surface,#fff) }
.product-summary dt { color:var(--muted,#777); font-size:.62rem }
.product-summary dd { margin:6px 0 0; font-size:.76rem; font-weight:700 }
.product-points { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px }
.product-points > div { padding:15px; border:1px solid var(--line,#ddd); border-radius:10px }
.product-points h3 { margin:0 0 9px; font-size:.75rem }
.product-points ul { margin:0; padding-left:18px; font-size:.72rem; line-height:1.8 }
.product-disclosure { color:var(--muted,#777); font-size:.62rem; margin:16px 0 0 }
.review-utility-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px }
.review-utility-actions button,.review-utility-actions a { border:1px solid var(--line,#ddd); border-radius:20px; padding:9px 13px; background:transparent; color:inherit; text-decoration:none; font:600 .65rem inherit; cursor:pointer }
.review-utility-actions .is-active { background:var(--ink,#171817); color:var(--paper,#fff); border-color:var(--ink,#171817) }
.compare-shell { width:min(1280px,92vw); margin:70px auto }
.compare-shell h1 { font-size:clamp(2.5rem,7vw,6rem); margin:12px 0 }
.compare-lead { color:var(--muted,#777) }
.compare-filter { margin:20px 0 }
.compare-filter select { border:1px solid var(--line,#ddd); border-radius:8px; padding:10px 14px; background:var(--surface,#fff); color:var(--ink,#171817); font:inherit; font-size:.78rem }
.compare-picker-list { display:flex; flex-wrap:wrap; gap:8px; margin:30px 0 }
.compare-picker-list label { cursor:pointer }
.compare-picker-list input { position:absolute; opacity:0; pointer-events:none }
.compare-picker-list span { display:grid; gap:3px; padding:10px 13px; border:1px solid var(--line,#ddd); border-radius:10px; font-size:.58rem }
.compare-picker-list b { font-size:.7rem }
.compare-picker-list input:checked + span { background:var(--ink,#171817); color:var(--paper,#fff); border-color:var(--ink,#171817) }
.compare-grid { display:grid; grid-template-columns:130px repeat(var(--products),minmax(170px,1fr)); border:1px solid var(--line,#ddd); border-radius:13px; overflow:auto }
.compare-grid > * { min-width:0; padding:15px; border-right:1px solid var(--line,#ddd); border-bottom:1px solid var(--line,#ddd); color:inherit; text-decoration:none; font-size:.72rem; word-break:break-word; overflow-wrap:break-word }
.compare-grid > a { display:grid; gap:5px }
.compare-grid > a small { color:var(--muted,#777) }
.compare-label { background:rgba(127,127,127,.08); color:var(--muted,#777); font-weight:700 }
.compare-empty { padding:30px; border:1px dashed var(--line,#ddd); border-radius:12px; color:var(--muted,#777) }
.review-filter-row { display:flex; flex-wrap:wrap; gap:8px; align-items:end; margin:0 0 22px }
.review-filter-row label { display:grid; gap:5px; color:var(--muted,#777); font-size:.58rem }
.review-filter-row select { min-width:120px; border:1px solid var(--line,#ddd); border-radius:8px; padding:9px; background:var(--surface,#fff); color:inherit }
.review-filter-row .review-filter-check { display:flex; align-items:center; gap:7px; min-height:36px; padding:0 10px; border:1px solid var(--line,#ddd); border-radius:8px; color:inherit; cursor:pointer }
.review-filter-row > a { margin-left:auto; padding:10px 14px; border-radius:20px; background:var(--ink,#171817); color:var(--paper,#fff); text-decoration:none; font-size:.65rem }
@media (max-width:700px) {
  .product-summary dl { grid-template-columns:1fr 1fr }
  .product-points { grid-template-columns:1fr }
  .compare-grid { grid-template-columns:90px repeat(var(--products),minmax(145px,1fr)) }
}