:root{--paper:#f6f5f0;--white:#fff;--ink:#242921;--muted:#6b7168;--line:#dedfd6;--lime:#d0eb82;--blue:#3060f0;--sans:"Pretendard","Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif;--latin:"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);word-break:keep-all;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
button,a,input,textarea{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
::selection{background:var(--lime);color:var(--ink)}
img{display:block;max-width:100%;height:auto}
svg{display:block}
.container{width:min(1240px,calc(100% - 112px));margin-inline:auto}
.skip-link{position:fixed;z-index:100;left:20px;top:-70px;padding:12px 20px;background:var(--ink);color:white;border-radius:4px}
.skip-link:focus{top:12px}
.site-header{position:sticky;top:0;z-index:20;background:rgba(246,245,240,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.header-inner{height:86px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.wordmark{display:inline-flex;align-items:center;gap:10px;font-family:var(--latin);font-size:27px;font-weight:750;letter-spacing:-1.3px;white-space:nowrap}
.brand-period{margin-left:-10px;color:var(--blue)}
.site-header .brand-period{color:#dc0015}
.brand-logo{--logo-width:44px;--logo-height:51px;position:relative;display:block;flex:0 0 var(--logo-width);width:var(--logo-width);height:var(--logo-height);overflow:hidden;mix-blend-mode:multiply}
.brand-logo img{position:absolute;max-width:none;width:calc(var(--logo-width) * 2.565957);height:auto;left:calc(var(--logo-width) * -.789362);top:calc(var(--logo-width) * -.5)}
.site-header nav{display:flex;align-items:center;gap:35px;font-size:14px;font-weight:600}
.site-header nav a{padding-block:10px;transition:color .18s}
.site-header nav a:hover{color:var(--blue)}
.site-header nav .nav-contact{display:flex;gap:22px;align-items:center;padding:12px 18px;border:1px solid #c3c7b9;border-radius:4px}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:35px;padding-top:64px;padding-bottom:56px}
.eyebrow{display:flex;gap:10px;align-items:center;font-family:var(--latin);font-size:11px;font-weight:600;letter-spacing:1.4px;line-height:1.5;margin:0 0 28px}
.status-dot{width:7px;height:7px;background:var(--blue);border-radius:50%}
.hero h1{font-size:clamp(58px,5.6vw,82px);line-height:1.16;letter-spacing:-4px;margin:0;font-weight:750}
.hero-prefix{display:block;font-size:23px;font-weight:500;line-height:1.3;letter-spacing:-.5px;margin-bottom:13px}
.highlight{position:relative;isolation:isolate}
.highlight:after{content:"";position:absolute;inset:57% -6px 1px -1px;z-index:-1;background:var(--lime);transform:rotate(-1.3deg)}
.hero-description{font-size:17px;line-height:1.85;letter-spacing:-.2px;color:#5f665b;margin:25px 0 28px}
.hero-actions{display:flex;align-items:center;gap:21px;flex-wrap:wrap}
.button{min-height:49px;padding:16px 20px;display:inline-flex;justify-content:space-between;align-items:center;gap:24px;border-radius:4px;line-height:1.2;font-size:14px;font-weight:600;border:1px solid transparent;transition:background .2s,transform .2s}
.button:hover{transform:translateY(-2px)}
.button-dark{background:var(--ink);color:var(--white)}
.button-dark:hover{background:#3c4435}
.text-link{font-size:13px;display:inline-flex;gap:15px;align-items:center;padding-block:12px;color:#5d6557}
.text-link:hover{color:var(--blue)}
.hero-visual{padding-left:1px;min-width:0}
.making-illustration{width:100%;max-width:610px;overflow:visible}
.hero-footnote{display:flex;justify-content:flex-end;gap:20px;border-top:1px solid var(--line);padding-block:22px;font-family:var(--latin);font-size:10px;font-weight:500;letter-spacing:1.2px;color:var(--muted)}
.hero-footnote span:last-child{font-family:var(--sans);letter-spacing:.7px}
.hero-footnote span:last-child span{display:inline-block;margin-left:28px;font-size:18px;color:var(--ink)}
.section{padding-block:93px 100px}
.services{background:var(--white)}
.section-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin-bottom:45px}
.section-intro .eyebrow{color:var(--blue);margin-bottom:20px}
h2{font-size:clamp(31px,3.1vw,43px);letter-spacing:-1.8px;line-height:1.4;font-weight:700;margin:0}
.section-description{font-size:15px;color:var(--muted);line-height:1.85;margin:0 0 6px;max-width:360px}
.service-list{border-top:1px solid var(--ink)}
.service-row{display:grid;grid-template-columns:48px 1.05fr 1.35fr 48px;align-items:center;gap:24px;padding:35px 20px 35px 0;border-bottom:1px solid var(--line)}
.service-number{font-family:var(--latin);font-size:13px;color:var(--muted);align-self:start;padding-top:6px}
.service-english{display:block;font-family:var(--latin);font-size:9px;letter-spacing:1.1px;color:var(--muted);margin-bottom:9px}
.service-name h3{font-size:27px;font-weight:650;letter-spacing:-.9px;margin:0;line-height:1.4}
.service-detail p{font-size:14px;line-height:1.8;color:#62685c;margin:0 0 13px}
.service-tags{list-style:none;padding:0;margin:0;display:flex;gap:13px;flex-wrap:wrap;font-size:11px;color:#727868}
.service-tags li+li:before{content:"/";margin-right:13px;color:#bbc0b3}
.service-action{width:43px;height:43px;border:1px solid #cbd0c1;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:21px;transition:background .18s,border-color .18s,transform .18s}
.service-action:hover{background:var(--lime);border-color:var(--lime);transform:rotate(4deg)}
.service-uv{background:#f1f4e8;padding-left:20px;margin-left:-20px;width:calc(100% + 20px)}
.service-uv .service-english{color:#456135}
.work{background:var(--paper)}
.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.work-art{position:relative;height:278px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.work-literature{background:#e6e8dc}
.work-magazine{background:#dbe4ee}
.work-caption{position:absolute;top:24px;left:25px;font-family:var(--latin);font-size:9px;font-weight:600;letter-spacing:1.3px;color:#747b68}
.app-tile{width:150px;height:150px;border-radius:22px;overflow:hidden;box-shadow:0 15px 28px rgba(36,41,33,.12);transform:rotate(-6deg);z-index:1}
.work-magazine .app-tile{transform:rotate(6deg)}
.app-tile img{width:100%;height:100%;object-fit:cover}
.art-label{position:absolute;bottom:22px;left:25px;font-family:var(--latin);font-size:9px;letter-spacing:1.2px;color:#747b68}
.work-decoration{position:absolute;right:-16px;bottom:-15px;width:150px;height:150px;color:#b4baa3;opacity:.65}
.work-magazine .work-decoration{color:#aabbd3}
.work-info{padding-top:22px}
.work-kind{font-size:11px;color:var(--muted)}
.work-info h3{font-size:23px;font-weight:650;letter-spacing:-.7px;line-height:1.4;margin:8px 0 10px}
.work-info p{font-size:14px;color:var(--muted);line-height:1.85;margin:0}
.contact{background:var(--ink);color:var(--paper);padding-block:85px 88px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:start}
.contact .eyebrow{color:var(--lime);margin-bottom:26px}
.contact h2{font-size:clamp(36px,3.5vw,48px);line-height:1.4;letter-spacing:-2px}
.lime-text{color:var(--lime)}
.contact-copy>p:not(.eyebrow){font-size:14px;line-height:1.9;color:#b8bfb0;margin:20px 0 27px}
.direct-contact{display:flex;flex-direction:column;gap:10px;align-items:flex-start;font-family:var(--latin);font-size:16px;letter-spacing:.1px}
.direct-contact a{display:flex;gap:15px;align-items:center;border-bottom:1px solid #59624f;padding-bottom:4px}
.direct-contact a:hover{color:var(--lime)}
.inquiry{padding-top:6px}
.inquiry fieldset{border:0;margin:0;padding:0}
.inquiry legend,.message-label{display:block;font-size:13px;margin:0 0 15px;font-weight:500}
.inquiry-options{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:24px}
.inquiry-options label{flex:1 1 calc(50% - 9px);cursor:pointer;position:relative}
.inquiry-options input{position:absolute;opacity:0;width:1px;height:1px;left:10px;top:10px}
.inquiry-options span{min-height:44px;display:flex;align-items:center;justify-content:center;font-size:12px;border:1px solid #5a6350;border-radius:3px;color:#c2c9b8;transition:color .15s,background .15s,border-color .15s}
.inquiry-options input:checked+span{background:var(--lime);border-color:var(--lime);color:var(--ink);font-weight:650}
.inquiry-options input:focus-visible+span{outline:3px solid #90adff;outline-offset:3px}
.inquiry-options label:hover span{border-color:var(--lime)}
.message-label{margin-bottom:11px}
.inquiry textarea{width:100%;padding:15px 16px;border-radius:3px;border:1px solid #5a6350;background:#2e342a;color:var(--paper);resize:vertical;min-height:123px;font-size:13px;line-height:1.7}
.inquiry textarea::placeholder{color:#aab29f}
.button-lime{background:var(--lime);color:var(--ink)}
.button-lime:hover{background:#dfefa9}
.email-compose{width:100%;margin-top:13px}
.inquiry-note{font-size:11px;color:#a7b19b;line-height:1.7;margin:12px 0 0;min-height:19px}
.site-footer{background:var(--paper);padding-block:28px}
.footer-inner{display:flex;align-items:center;gap:24px;justify-content:space-between}
.footer-wordmark{font-size:23px;gap:0}
.footer-wordmark .brand-period{margin-left:0}
.footer-inner p{font-family:var(--latin);font-size:10px;letter-spacing:.2px;color:var(--muted);margin:0}
.footer-inner>span{font-size:10px;color:var(--muted)}
.back-to-top{font-size:20px;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid #c9cfbd;border-radius:50%}
.back-to-top:hover{background:var(--lime)}
@media(min-width:1500px){.hero-grid{padding-top:78px;padding-bottom:72px}}
@media(max-width:1100px){.container{width:calc(100% - 72px)}.hero-grid{gap:15px}.hero h1{font-size:65px;letter-spacing:-3px}.hero-actions{gap:10px}.hero-actions .button{padding-inline:15px;font-size:12px;gap:15px}.hero-actions .text-link{font-size:12px}.service-row{grid-template-columns:32px 1fr 1.2fr 43px;gap:18px}.service-name h3{font-size:24px}.service-detail p{font-size:13px}.contact-grid{gap:55px}.footer-inner{gap:15px}.footer-inner p{font-size:9px}}
@media(max-width:800px){.container{width:calc(100% - 48px)}.header-inner{height:74px}.wordmark{font-size:23px}.brand-mark{width:21px;height:21px}.site-header nav{gap:19px;font-size:12px}.site-header nav .nav-contact{padding:10px 13px;gap:12px}.hero-grid{padding-top:42px;padding-bottom:34px}.hero h1{font-size:56px;letter-spacing:-2.7px}.hero-prefix{font-size:19px}.hero .eyebrow{font-size:9px;letter-spacing:1px}.hero-description{font-size:14px;line-height:1.9;margin-top:22px}.hero-actions{gap:4px}.hero-actions .button{font-size:11px;gap:12px;min-height:46px}.hero-visual{margin-right:-4px}.hero-footnote{font-size:8px;letter-spacing:.6px}.hero-footnote span:last-child span{margin-left:10px;font-size:15px}.section{padding-block:67px 72px}.section-intro{gap:30px;margin-bottom:30px}.section-description{font-size:13px}.service-row{grid-template-columns:24px 1fr 1.1fr 38px;gap:14px;padding-block:28px;padding-right:7px}.service-name h3{font-size:21px}.service-english{font-size:8px;letter-spacing:.5px}.service-detail p{font-size:12px}.service-tags{gap:8px;font-size:10px}.service-tags li+li:before{margin-right:8px}.service-action{width:36px;height:36px;font-size:18px}.work-grid{gap:24px}.work-art{height:235px}.work-caption{left:18px;font-size:8px;letter-spacing:.7px}.art-label{left:18px;font-size:8px}.app-tile{width:130px;height:130px}.work-info h3{font-size:20px}.work-info p{font-size:12px}.contact-grid{gap:35px}.contact h2{font-size:36px}.contact-copy>p:not(.eyebrow){font-size:12px}.direct-contact{font-size:14px}.inquiry-options span{font-size:10px}.footer-inner p{display:none}}
@media(max-width:600px){html{scroll-padding-top:75px}.container{width:calc(100% - 40px)}.header-inner{height:69px;gap:12px}.wordmark{font-size:21px;gap:8px;letter-spacing:-1px}.brand-period{margin-left:-8px}.brand-mark{width:18px;height:18px}.site-header nav{gap:14px;font-size:11px}.site-header nav a[href="#work"]{display:none}.site-header nav .nav-contact{padding:9px 10px;gap:7px}.hero-grid{grid-template-columns:1fr;padding-top:40px;padding-bottom:22px;gap:25px}.hero .eyebrow{margin-bottom:27px}.hero h1{font-size:64px;line-height:1.16;letter-spacing:-3px}.hero-prefix{font-size:20px;margin-bottom:11px}.hero-description{font-size:14px;margin:22px 0 23px}.hero-actions{gap:19px}.hero-actions .button{font-size:12px;padding:15px 17px;gap:18px}.hero-actions .text-link{font-size:11px;gap:8px}.hero-visual{width:100%;max-width:440px;margin:0 auto;padding:0 4px}.hero-footnote{flex-direction:column;align-items:flex-start;gap:11px;padding-block:18px;font-size:8px;letter-spacing:.7px}.hero-footnote span:last-child{display:flex;gap:10px;align-items:center;font-size:9px}.hero-footnote span:last-child span{margin-left:7px;font-size:14px}.section{padding-block:57px 60px}.section-intro{display:block;margin-bottom:30px}.section-intro .eyebrow{font-size:10px;margin-bottom:15px}h2{font-size:31px;line-height:1.4;letter-spacing:-1.3px}.section-description{margin-top:19px;font-size:13px}.service-row{grid-template-columns:27px 1fr 38px;gap:8px;padding:26px 0}.service-number{grid-column:1;grid-row:1;font-size:11px;padding-top:3px}.service-name{grid-column:2;grid-row:1}.service-name h3{font-size:23px;letter-spacing:-.8px}.service-english{font-size:8px;letter-spacing:.8px;margin-bottom:8px}.service-detail{grid-column:2 / 4;grid-row:2;margin-top:7px;padding-right:4px}.service-detail p{font-size:13px;margin-bottom:12px;line-height:1.8}.service-tags{font-size:10px;gap:11px}.service-tags li+li:before{margin-right:11px}.service-action{grid-column:3;grid-row:1;align-self:center;width:35px;height:35px}.service-uv{margin-left:-12px;width:calc(100% + 24px);padding:26px 12px}.desktop-break{display:none}.work-grid{grid-template-columns:1fr;gap:32px}.work-art{height:246px}.work-caption{top:20px;left:22px;font-size:8px;letter-spacing:1px}.art-label{left:22px;bottom:20px;font-size:8px;letter-spacing:1px}.app-tile{width:137px;height:137px}.work-info{padding-top:17px}.work-info h3{font-size:21px;margin:7px 0 9px}.work-info p{font-size:13px}.work-kind{font-size:10px}.contact{padding-block:57px 58px}.contact-grid{grid-template-columns:1fr;gap:37px}.contact .eyebrow{margin-bottom:19px}.contact h2{font-size:38px;line-height:1.4;letter-spacing:-1.6px}.contact-copy>p:not(.eyebrow){font-size:13px;margin-block:19px 22px}.direct-contact{gap:10px;font-size:15px}.inquiry{padding-top:0}.inquiry legend,.message-label{font-size:12px}.inquiry-options{margin-bottom:22px}.inquiry-options span{font-size:11px;min-height:45px}.inquiry textarea{font-size:12px;min-height:119px}.email-compose{font-size:13px;min-height:49px}.inquiry-note{font-size:10px}.site-footer{padding-block:25px}.footer-inner{flex-wrap:wrap;gap:14px}.footer-wordmark{font-size:21px;gap:0}.footer-inner>span{font-size:9px;margin-left:auto}.back-to-top{font-size:18px;width:30px;height:30px}}
@media(max-width:360px){.container{width:calc(100% - 32px)}.site-header nav{gap:9px}.wordmark{font-size:19px;gap:6px}.brand-period{margin-left:-6px}.brand-mark{width:16px;height:16px}.hero h1{font-size:59px}.hero-actions{gap:10px}.hero-actions .button{font-size:11px;padding-inline:12px;gap:12px}.hero-actions .text-link{font-size:10px}.service-name h3{font-size:22px}.contact h2{font-size:35px}}
@media(max-width:800px){.brand-logo{--logo-width:34px;--logo-height:39px}}
@media(max-width:600px){.brand-logo{--logo-width:30px;--logo-height:35px}}
@media(max-width:360px){.brand-logo{--logo-width:27px;--logo-height:31px}}
.hero .brand-slogan{font-size:13px;font-weight:500;letter-spacing:.15px;line-height:1.6;align-items:flex-start;gap:9px}
.hero .brand-slogan .status-dot{flex-shrink:0;background:#dc0015;margin-top:7px}
@media(max-width:600px){.hero .brand-slogan{font-size:12px;letter-spacing:0}.hero .brand-slogan .status-dot{margin-top:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
