.intro{align-items:start;gap:max(12px, calc(var(--u) * 24));padding:max(16px, calc(var(--u) * 67)) var(--gutter) max(20px, calc(var(--u) * 55));grid-template-columns:1277fr 1183fr;display:grid}.intro-title{font-family:var(--font-clash), var(--font-pretendard), sans-serif;font-size:max(40px, calc(var(--u) * 118));letter-spacing:-.02em;margin:0;font-weight:600;line-height:1}.intro-text{padding-top:max(0px, calc(var(--u) * 6))}.intro-statement{font-size:max(18px, calc(var(--u) * 46));letter-spacing:-.03em;text-wrap:balance;margin:0;font-weight:650;line-height:1.25}.intro-role{margin:max(6px, calc(var(--u) * 12)) 0 0;font-size:max(14px, calc(var(--u) * 36));letter-spacing:-.03em;color:var(--ink);font-weight:400;line-height:1.3}@media not (min-width:720px){.intro{grid-template-columns:1fr;padding-top:36px}}.goo-defs{position:absolute}.works{padding-inline:var(--gutter);padding-bottom:max(24px, calc(var(--u) * 40));container:works/inline-size}.work-list{gap:max(8px, calc(var(--u) * 16));--fu:var(--u);margin:0;padding:0;list-style:none;display:grid}.work-row{--r:max(22px, calc(var(--u) * 56));animation:.9s cubic-bezier(.16,1,.3,1) both row-in;animation-delay:calc(.12s + var(--i,0) * 70ms);display:flex}html[data-works-enter] .work-row{animation:none}.work-row:first-child{--neon:#c8ff00}.work-row:nth-child(2){--neon:#ff4fb8}.work-row:nth-child(3){--neon:#18e3ff}.work-row:nth-child(4){--neon:#ff7a1a}.work-row:nth-child(5){--neon:#a57cff}.work-row:hover .work-link,.work-link:focus-visible{background:var(--neon)}.work-preview{display:none}@media (hover:hover){@container works (min-width:1000px){.work-preview{border-radius:var(--r);opacity:0;background:#e9ebef;flex:0 0 0;min-width:0;margin-left:0;transition:flex-basis .45s cubic-bezier(.22,1,.36,1),margin-left .45s cubic-bezier(.22,1,.36,1),opacity .3s;display:block;position:relative;overflow:hidden}.work-preview video{width:max(190px, calc(var(--u) * 380));object-fit:cover;object-position:top left;height:100%;display:block;position:absolute;inset:0 auto 0 0}.work-row:hover .work-preview{flex-basis:max(190px, calc(var(--u) * 380));margin-left:max(8px, calc(var(--u) * 16));opacity:1}.work-row:has(.work-preview) .work-fig{transition:opacity .2s}.work-row:has(.work-preview):hover .work-fig{opacity:0}}}@keyframes row-in{0%{opacity:0;translate:0 14px}}.work-link{--pill-f:max(12px, calc(var(--u) * 27));--col-num:calc(var(--u) * 170);--col-name:calc(var(--u) * 720);--col-role:max(calc(var(--u) * 420), calc(var(--pill-f) * 9.8 + max(8px, calc(var(--u) * 18)) * 6 + max(6px, calc(var(--u) * 10)) * 2));--col-cap:max(calc(var(--u) * 326), calc(var(--pill-f) * 9.4 + max(14px, calc(var(--u) * 30)) * 2 + 5px + max(32px, calc(var(--u) * 70))));--col-gap:max(12px, calc(var(--u) * 24));--link-pad:calc(var(--u) * 44);grid-template-columns:var(--col-num) var(--col-name) var(--col-role) minmax(0, 1fr) var(--col-cap);align-items:center;column-gap:var(--col-gap);min-width:0;min-height:calc(var(--u) * 220);padding:calc(var(--u) * 28) var(--link-pad);border-radius:var(--r);background:#f6f7fa;flex:auto;grid-template-areas:"num name role fig cap";transition:background-color .35s cubic-bezier(.22,1,.36,1);display:grid}.work-num{font-family:var(--font-num), sans-serif;font-size:max(26px, calc(var(--u) * 80));letter-spacing:-.06em;font-variant-numeric:tabular-nums;white-space:nowrap;grid-area:num;font-weight:800;line-height:.9}.work-name{font-size:max(18px, calc(var(--u) * 54));letter-spacing:-.035em;grid-area:name;margin:0;font-weight:720;line-height:1.15}.work-role{padding:max(6px, calc(var(--u) * 12)) max(6px, calc(var(--u) * 10));background:var(--paper);font-size:max(12px, calc(var(--u) * 27));letter-spacing:-.02em;white-space:nowrap;border-radius:999px;grid-area:role;justify-self:start;align-items:center;margin:0;line-height:1;display:inline-flex;box-shadow:inset 0 0 0 1px #14141414}.work-role>span{padding-inline:max(8px, calc(var(--u) * 18))}.work-role>span+span{border-left:1px solid #14141424}.work-fig{grid-area:fig;justify-self:center}@container works (min-width:1000px){.work-fig{min-width:0;overflow:hidden}.work-fig .lens{width:min(calc(var(--fu) * var(--w)), calc(100cqw - var(--link-pad) * 2 - var(--col-num) - var(--col-name) - var(--col-role) - var(--col-cap) - var(--col-gap) * 4))}}.work-cap{font-size:max(12px, calc(var(--u) * 27));grid-area:cap;justify-self:end;margin:0;line-height:1;display:grid}.cap-row{grid-area:1/1;align-items:center;gap:5px;display:flex}.cap-bg{filter:url(#goo-filter);pointer-events:none}.cap-fg{z-index:1;position:relative}.cap-pill,.cap-arrow{height:max(32px, calc(var(--u) * 70));border-radius:999px;justify-content:center;align-items:center;display:inline-flex}.cap-pill{padding-inline:max(14px, calc(var(--u) * 30));white-space:nowrap}.cap-arrow{width:max(32px, calc(var(--u) * 70))}.cap-bg .cap-pill,.cap-bg .cap-arrow{background:var(--ink);color:#0000;outline:4px solid var(--ink)}.cap-fg .cap-pill,.cap-fg .cap-arrow{color:#f2f2f0;box-shadow:inset 0 0 0 1px #ffffff21}.cap-arrow svg{width:38%;height:38%}@container works not (min-width:1000px){.work-list{--fu:min(calc(100cqi / 560), 1px)}.work-link{grid-template-columns:auto 1fr auto;grid-template-areas:"num name cap""num role role""fig fig fig";gap:8px 12px;min-height:0;padding:18px}.work-num{font-size:28px}.work-name{font-size:19px}.work-role{padding:5px 4px;font-size:12px}.work-role>span{padding-inline:8px}.work-fig{justify-content:center;justify-self:stretch;margin-top:14px;padding-block:6px;display:flex}.work-cap{place-self:start end;margin-top:0;font-size:12px}}@media (prefers-reduced-motion:reduce){.work-row{animation:none}}.hl-word{cursor:default;white-space:nowrap;-webkit-tap-highlight-color:transparent}.hl-pill{vertical-align:.01em;background:var(--ink);isolation:isolate;border-radius:999px;width:0;height:.76em;display:inline-block;position:relative;overflow:hidden}.hl-obj{pointer-events:none;display:block;position:absolute;bottom:.03em;left:50%;translate:-50%}.hl-frame{-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;inset:0}.hl-frame[data-frame="0"]{position:relative}.hl-obj-bulb{aspect-ratio:135/200;height:.7em}.hl-obj-laptop{aspect-ratio:200/153;width:.94em;bottom:.02em}@container works not (min-width:560px){.work-cap .cap-pill{display:none}}
