*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:#f8f8f8;color:#000;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(min-width:1280px){body{min-width:1440px}}button{font-family:inherit}a{color:inherit;text-decoration:none}.top-nav{position:fixed;left:50%;top:auto;bottom:16px;transform:translate(-50%);height:44px;z-index:100;border-radius:100px;background:#fff;border:1px solid rgb(222,222,222);box-shadow:0 4px 17.1px #0000001c;display:flex;align-items:center;gap:14px;padding:4px 4px 4px 18px;white-space:nowrap;transition:transform .28s ease}@media(max-width:990px){.top-nav.is-hidden{transform:translate(-50%) translateY(calc(100% + 32px))}}@media(min-width:991px){.top-nav{top:11px;bottom:auto;height:50px;gap:21px;padding:6px 6px 6px 24px}}.top-nav-link{font-size:14px;line-height:22px;letter-spacing:.003em;color:#999;cursor:pointer;padding:0;background:none;border:none;white-space:nowrap}@media(min-width:991px){.top-nav-link{font-size:16px}}.top-nav-link.active{color:#000}.top-nav .cta{border-radius:100px;background:linear-gradient(#1f1f1f,#414040);padding:7px 14px;color:#fff;font-size:14px;line-height:22px;letter-spacing:-.01em;display:inline-flex;align-items:center;white-space:nowrap;flex:none;border:none;cursor:pointer;font-family:inherit}@media(min-width:991px){.top-nav .cta{padding:8px 16px;font-size:16px}}.page{position:relative;width:100%;max-width:1440px;margin:0 auto;background:#f8f8f8}@media(min-width:1280px){.work-page{min-height:2048px}.about-page{min-height:1861px}}.side-rule{display:none;position:absolute;top:0;width:1px;height:100%;background:#999}@media(min-width:1280px){.side-rule{display:block}.side-rule.left{left:136px}.side-rule.right{left:1304px}}.content{position:relative;padding-top:24px;padding-left:20px;padding-right:20px}@media(min-width:768px){.content{padding-left:64px;padding-right:64px}}@media(min-width:1280px){.content{padding-left:160px;padding-right:160px}}.about-page .content{padding-top:96px}@media(min-width:1280px){.about-page .content{padding-top:121px}}.hero{position:relative}.hero-banner{width:100%;max-width:1120px;aspect-ratio:3 / 2;height:auto;border-radius:24px;overflow:hidden;background:#e2e2e2 url(/assets/hero-banner-mobile.png) center/cover no-repeat}@media(min-width:768px){.hero-banner{aspect-ratio:1120 / 260;background-image:url(/assets/hero-banner.png)}}@media(min-width:1280px){.hero-banner{width:1120px;height:260px;aspect-ratio:auto}}.hero-content{padding:24px 0 0}@media(min-width:768px){.hero-content{padding:24px 24px 0}}.hero-row-1{display:flex;flex-direction:column;gap:24px;align-items:flex-start;margin-top:-84px}@media(min-width:768px){.hero-row-1{flex-direction:row;justify-content:space-between;align-items:flex-end;height:187px;margin-top:-114px;gap:16px}}.hero-avatar{width:120px;height:120px;border-radius:50%;background:#e2e2e2 url(/assets/profile.png) center/cover no-repeat;border:8px solid rgb(248,248,248);flex:none}@media(min-width:768px){.hero-avatar{width:187px;height:187px;border-width:10px}}.hero-meta{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center}.meta-chip{display:flex;align-items:center;gap:6px;font-size:12px;line-height:20px;letter-spacing:-.01em;color:#999}.meta-chip.bold{color:#000;font-weight:700}.hero-row-2{margin-top:24px;display:flex;flex-direction:column;gap:24px;align-items:flex-start}@media(min-width:768px){.hero-row-2{flex-direction:row;justify-content:space-between;align-items:flex-start;gap:0}}.hero-title-block{display:flex;flex-direction:column;gap:24px;max-width:884px;align-items:flex-start}@media(min-width:768px){.hero-title-block{gap:32px}}.hero-text-stack{display:flex;flex-direction:column;gap:16px}.hero-title{font-weight:500;font-size:26px;line-height:100%;letter-spacing:-.02em;color:#000}@media(min-width:768px){.hero-title{font-size:32px}}.hero-subtitle{font-size:16px;line-height:22px;letter-spacing:-.02em;color:#999;max-width:492px}.hero-subtitle strong{color:#000;font-weight:400}@media(min-width:768px){.hero-subtitle{font-size:18px;line-height:24px}}.primary-cta{display:inline-flex;align-items:center;justify-content:center;border-radius:1000px;background:linear-gradient(#1f1f1f,#414040);padding:14px 24px;color:#fff;font-weight:500;font-size:16px;line-height:100%;letter-spacing:-.02em;border:none;cursor:pointer;font-family:inherit}.social-row{display:flex;gap:6px}.social-icon{width:48px;height:48px;border-radius:1000px;border:1px solid rgb(222,222,222);display:flex;align-items:center;justify-content:center;color:#000;flex:none;transition:background-color .15s ease,border-color .15s ease}.social-icon:hover{background-color:#0000000a;border-color:#b4b4b4}.social-row.on-dark .social-icon{border-color:#999;color:#fff}.social-row.on-dark .social-icon:hover{background-color:#ffffff14;border-color:#dcdcdc}.work-grid{margin-top:48px;display:grid;grid-template-columns:1fr;gap:14px}@media(min-width:768px){.work-grid{grid-template-columns:repeat(2,1fr);margin-top:64px}}@media(min-width:1280px){.work-grid{margin-top:80px;grid-template-columns:repeat(3,364px);justify-content:space-between}}.project-card{width:100%;aspect-ratio:364 / 400;height:auto;border-radius:24px;background:#e2e2e2 center/cover no-repeat;border:none;padding:0;cursor:pointer;position:relative;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease}@media(min-width:1280px){.project-card{width:364px;height:400px;aspect-ratio:auto}}.project-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #00000014}.footer-area{margin-top:48px;padding-bottom:32px}@media(min-width:1280px){.footer-area{margin-top:14px}}.about-page .footer-area{margin-top:48px}@media(min-width:1280px){.about-page .footer-area{margin-top:64px}}.footer{width:100%;max-width:1120px;min-height:156px;border-radius:24px;background:linear-gradient(#1f1f1f,#414040);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:24px;padding:28px;margin:0 auto}@media(min-width:768px){.footer{flex-direction:row;align-items:center;justify-content:space-between;padding:0 48px;height:156px;gap:0}}.footer-text{display:flex;flex-direction:column;gap:6px;background:none;border:none;padding:0;margin:0;text-align:left;font-family:inherit;color:inherit;cursor:pointer}.footer-title{font-weight:500;font-size:26px;line-height:100%;letter-spacing:-.02em;color:#fff}@media(min-width:768px){.footer-title{font-size:32px}}.footer-copyright{font-size:12px;line-height:100%;color:#fff9}.about-layout{display:flex;flex-direction:column;gap:32px;align-items:stretch}@media(min-width:1024px){.about-layout{flex-direction:row;gap:24px;align-items:flex-start}}.about-photo{width:100%;max-width:386px;aspect-ratio:1;height:auto;border-radius:24px;background:#e5e5e5 url(/assets/profile.png) center/cover no-repeat;flex:none;align-self:center}@media(min-width:1024px){.about-photo{width:386px;height:386px;aspect-ratio:auto;position:sticky;top:121px;align-self:flex-start}}.about-sections{margin-left:0;flex:1;display:flex;flex-direction:column;gap:32px}@media(min-width:1024px){.about-sections{margin-left:26px}}.about-section{display:flex;flex-direction:column;gap:16px}.section-title{font-weight:500;font-size:22px;line-height:100%;letter-spacing:-.02em;color:#000}.body-text{font-size:14px;line-height:20px;letter-spacing:-.01em;color:#999;white-space:pre-line;max-width:586px}.resume-list{display:flex;flex-direction:column;gap:32px}.resume-item{display:flex;flex-direction:column;gap:12px}.resume-info{display:flex;justify-content:space-between;align-items:flex-start}.resume-info-left{display:flex;flex-direction:column;gap:6px}.resume-company{font-weight:500;font-size:16px;line-height:18px;letter-spacing:-.01em;color:#000}.resume-role{font-size:14px;line-height:18px;letter-spacing:-.01em;color:#000}.resume-period{font-style:italic;font-size:12px;line-height:18px;letter-spacing:-.01em;color:#999;text-align:right}.resume-description.body-text{max-width:550px}.logo-circle{width:64px;height:64px;border-radius:1000px;overflow:hidden;display:flex;align-items:center;justify-content:center;flex:none}.logo-image{width:100%;height:100%;object-fit:cover;display:block}.modal{display:none;position:fixed;inset:0;z-index:1000;background:#f8f8f899;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);overflow-y:auto;justify-content:center;align-items:safe center}body.modal-open{overflow:hidden}body.modal-open .modal{display:flex}.modal-inner{position:relative;width:100%;max-width:1440px;padding:32px 20px}@media(min-width:768px){.modal-inner{padding:32px 64px}}@media(min-width:1280px){.modal-inner{padding:32px 0}}.modal-back{position:fixed;left:20px;top:24px;z-index:10;height:34px;border-radius:100px;background:#f8f8f8;border:1px solid rgb(222,222,222);padding:0 16px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;font-size:14px;line-height:100%;letter-spacing:-.02em;color:#000;transition:background-color .15s ease,border-color .15s ease}.modal-back:hover{background-color:#fff;border-color:#b4b4b4}@media(min-width:768px){.modal-back{left:64px;top:60px}}@media(min-width:1280px){.modal-back{left:calc(50% - 560px)}}.modal-card{position:relative;width:100%;max-width:1120px;height:auto;margin:0 auto;border-radius:18px;background:#f8f8f8;border:1px solid rgb(222,222,222);overflow:hidden;display:flex;flex-direction:column;padding:12px;gap:16px}@media(min-width:1024px){.modal-card{flex-direction:row;height:550px;margin:0 auto;gap:24px}}.modal-image{position:relative;width:100%;aspect-ratio:628 / 526;height:auto;border-radius:12px;background:#f5f5f5 center/cover no-repeat;border:1px solid rgb(222,222,222);flex:none;overflow:hidden}.modal-iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}@media(min-width:1024px){.modal-image{width:628px;height:526px;aspect-ratio:auto}}.modal-arrow{position:absolute;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:1000px;background:linear-gradient(#1f1f1f,#414040);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.modal-arrow.prev{left:12px}.modal-arrow.next{right:12px}.modal-arrow.prev svg{transform:rotate(180deg)}.modal-arrow.is-disabled{opacity:.4;pointer-events:none}.modal-pagination{position:absolute;left:50%;bottom:12px;transform:translate(-50%);border-radius:11px;background:#ffffff8c;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);padding:6px;display:flex;gap:8px}.modal-thumb{position:relative;width:50px;height:50px;border-radius:8px;background:#ffffff8c center/cover no-repeat;border:1px solid rgba(255,255,255,.7);cursor:pointer;opacity:.6;transition:opacity .15s ease}.modal-thumb.active{opacity:1;background-color:#fff}.modal-thumb-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#00000059;border-radius:inherit;pointer-events:none}.modal-thumb-play:before{content:"";width:0;height:0;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent #fff;margin-left:2px}.modal-copy{flex:1;padding:4px 12px 12px;display:flex;flex-direction:column;justify-content:flex-start;gap:16px}@media(min-width:1024px){.modal-copy{padding:17px 24px 17px 0;justify-content:space-between;gap:0}}.modal-copy-top{display:flex;flex-direction:column;gap:16px}.modal-client{display:flex;align-items:center}.modal-client-stack{display:flex;flex-direction:column;gap:6px}.modal-client-name{font-weight:500;font-size:16px;line-height:100%;color:#000}.modal-client-category{font-size:12px;line-height:100%;color:#999}.modal-description{font-size:14px;line-height:20px;letter-spacing:-.01em;color:#999;white-space:pre-line}.modal-tags{display:flex;flex-wrap:wrap;gap:4px}.modal-tag{height:28px;border-radius:1000px;border:1px solid rgb(222,222,222);padding:0 12px;display:inline-flex;align-items:center;font-size:12px;color:#999;background:#fff}.modal-copy .primary-cta{align-self:flex-start}.contact-modal{display:none;position:fixed;inset:0;z-index:1100;background:#f8f8f899;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);overflow-y:auto;justify-content:center;align-items:safe center}body.contact-modal-open{overflow:hidden}body.contact-modal-open .contact-modal{display:flex}.contact-modal-inner{position:relative;width:100%;max-width:520px;padding:32px 20px}@media(min-width:768px){.contact-modal-inner{padding:40px 20px}}.contact-close{position:fixed;left:50%;top:24px;transform:translate(-50%);z-index:10;height:34px;border-radius:100px;background:#f8f8f8;border:1px solid rgb(222,222,222);padding:0 16px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;font-size:14px;line-height:100%;letter-spacing:-.02em;color:#000;transition:background-color .15s ease,border-color .15s ease}.contact-close:hover{background-color:#fff;border-color:#b4b4b4}@media(min-width:768px){.contact-close{top:60px}}.contact-card{position:relative;width:100%;border-radius:18px;background:#f8f8f8;border:1px solid rgb(222,222,222);padding:24px}@media(min-width:768px){.contact-card{padding:28px}}.contact-header{display:flex;flex-direction:column;gap:6px;margin-bottom:20px}.contact-title{margin:0;font-weight:400;font-size:16px;line-height:20px;letter-spacing:-.01em;color:#000}.contact-subtitle{margin:0;font-size:14px;line-height:20px;letter-spacing:-.01em;color:#999}.contact-form{display:flex;flex-direction:column;gap:6px}.contact-field{width:100%;min-height:46px;border-radius:12px;border:1px solid rgb(222,222,222);background:#fff;padding:10px 20px;font-family:inherit;font-size:12px;line-height:20px;letter-spacing:-.01em;color:#000;outline:none;transition:border-color .15s ease}.contact-field::placeholder{color:#999}.contact-field:focus,input.contact-field:not(:placeholder-shown):valid,textarea.contact-field:not(:placeholder-shown):valid{border-color:#000}.contact-textarea{min-height:134px;resize:vertical;padding-top:12px}.contact-select-native{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M6 8l4 4 4-4' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:44px;color:#999;cursor:pointer}.contact-select-native.has-value{color:#000;border-color:#000}.contact-select-native option{color:#000}.contact-select-native option[disabled]{color:#999}.contact-submit{margin-top:14px;border:none;cursor:pointer;font-family:inherit;padding:16px 24px}.contact-form-status{font-size:12px;line-height:18px;color:#999;min-height:18px}.contact-form-status.is-success{color:#14823c}.contact-form-status.is-error{color:#c83232}button[data-contact-trigger]{font-family:inherit}
