/* fonts.css */
/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/53a90e281b5dcb1b.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/cd6ed524815ea4ca.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/712e6990c0fa77c7.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/3b1fc03727047d17.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/4671269ff78476ae.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/9eb71af0efac4985.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/4671269ff78476ae.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/9eb71af0efac4985.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/4671269ff78476ae.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/9eb71af0efac4985.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/4671269ff78476ae.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/9eb71af0efac4985.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/0dbccc38f1b76c53.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/c1a7777e4a7cb1c8.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/61eb9089f03f8a29.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/6ecca7897e5d7a7b.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/2dc1871151c57409.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/6a8efa5808ca5e37.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/0d765915e5dd3514.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/adf7264998fb8dfb.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/2dc1871151c57409.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/6a8efa5808ca5e37.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/0d765915e5dd3514.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/adf7264998fb8dfb.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* shared.css */
/* Shared visual language for the entire portfolio */
/* Balance display lines and discourage isolated final words in reading text. */
h1,h2,h3,h4,h5,h6,blockquote {
  text-wrap:balance;
}
p,li,dd,figcaption {
  text-wrap:pretty;
  orphans:3;
  widows:3;
}
@media print {
  h1,h2,h3,h4,h5,h6 { break-after:avoid; }
  figure,.project-role-card,.properly-card { break-inside:avoid; }
}
.brand{transition:opacity .25s ease,transform .25s ease}.brand:hover{opacity:.68;transform:translateY(-2px)}
.clean-wordmark{font-family:"DM Sans",sans-serif!important;font-size:30px!important;font-weight:700!important;letter-spacing:-2.8px!important;line-height:1!important}
.back,.next-project a,.about-contact a,.trailer-link{transition:opacity .25s ease,transform .25s ease}.back:hover,.next-project a:hover,.about-contact a:hover,.trailer-link:hover{opacity:.68;transform:translateX(6px)}
.project-arrow{transition:transform .3s ease}.project:hover .project-arrow{transform:translate(5px,-5px)}
.case-cover,.atone-hero,.case-image{transition:filter .4s ease}.case-cover:hover,.atone-hero:hover,.case-image:hover{filter:saturate(1.08) contrast(1.03)}
footer p{font:12px "DM Mono",monospace}footer a{transition:opacity .25s ease,transform .25s ease}footer a:hover{opacity:.7}footer a:not(.brand):hover{transform:translateY(-3px)}
@media(max-width:700px){.back:hover,.next-project a:hover,.about-contact a:hover,.trailer-link:hover{transform:none}.case-cover:hover,.atone-hero:hover,.case-image:hover{filter:none}}

/* styles.css */
body { font-kerning: normal; font-feature-settings: "kern" 1; }
:root{--ink:#17211f;--paper:#f3f0e8;--acid:#c7f550;--coral:#ff704a;--line:rgba(23,33,31,.22)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif}.grain{position:fixed;inset:0;pointer-events:none;opacity:.06;z-index:4;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E")}.nav{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 4.2vw;border-bottom:1px solid var(--line);position:relative;z-index:5}.brand{font:bold 28px/1 "DM Sans";letter-spacing:-2px;color:var(--ink);text-decoration:none}.brand span{font:12px "DM Mono";vertical-align:top;letter-spacing:0}.nav nav{display:flex;gap:30px;margin-left:120px}.nav a,footer a{color:inherit;text-decoration:none;font-size:14px}.availability{font:12px "DM Mono"!important;display:flex;gap:8px;align-items:center}.availability i{width:8px;height:8px;border-radius:50%;background:#6ca422;display:block;box-shadow:0 0 0 4px rgba(108,164,34,.13)}.section,.hero,.quote{padding-left:4.2vw;padding-right:4.2vw}.hero{min-height:calc(100vh - 86px);padding-top:clamp(55px,10vw,145px);display:flex;flex-direction:column}.eyebrow,.count,.art-label,.attribution{font:12px "DM Mono";letter-spacing:.02em}.hero-title{display:flex;justify-content:space-between;align-items:flex-end;margin-top:32px}.hero h1{font-size:clamp(53px,8.7vw,138px);line-height:.91;letter-spacing:-.0750em;margin:0;max-width:1000px;font-weight:600}.hero em,.about em,.quote em,.contact em{font-family:"Playfair Display",serif;font-weight:600;letter-spacing:-.08em}.orb-wrap{width:156px;text-align:center;font:10px "DM Mono";letter-spacing:.04em;margin:0 6vw 0 10px}.orb{width:124px;height:124px;margin:auto auto 12px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#f8ffb2 0 7%,var(--acid) 27%,#6d9b2c 50%,#1c3927 74%);box-shadow:inset -18px -16px 30px rgba(0,0,0,.25);animation:float 5s ease-in-out infinite}.hero-bottom{display:flex;justify-content:space-between;align-items:end;margin-top:auto;padding:90px 0 40px}.hero-bottom p{max-width:330px;font-size:16px;line-height:1.4;margin:0}.circle-link{height:58px;width:58px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;color:var(--ink);text-decoration:none;font-size:24px;transition:.25s}.circle-link:hover{background:var(--ink);color:var(--paper);transform:translateY(4px)}.work{padding-top:95px}.section-heading{border-top:1px solid var(--ink);padding-top:16px;display:flex;justify-content:space-between}.section-heading p{margin:0}.project{position:relative;display:block;text-decoration:none;color:var(--ink);padding:65px 0 35px;border-bottom:1px solid var(--line)}.project-art{height:clamp(280px,37vw,540px);overflow:hidden;position:relative}.art-label{position:absolute;top:18px;left:20px;z-index:1}.project-meta{display:grid;grid-template-columns:1.1fr 1fr 1fr;align-items:center;padding-top:18px}.project-meta h2,.project-meta p{font-size:20px;margin:0;letter-spacing:-.04em}.project-meta p{font-size:15px;letter-spacing:-.02em}.project-meta span{font:11px "DM Mono"}.project-arrow{position:absolute;right:4px;bottom:37px;font-size:26px}.project-coda .project-art{background:#a4b9d5}.phone{width:32%;min-width:190px;height:76%;border:7px solid #182325;border-radius:29px;background:#f7f5ec;position:absolute;bottom:-3%;left:34%;box-shadow:16px 20px 24px rgba(24,35,37,.25);overflow:hidden;transform:rotate(-6deg)}.phone-notch{background:#182325;width:45%;height:19px;border-radius:0 0 13px 13px;margin:auto}.health-ui{padding:14% 9%;font-size:clamp(10px,1.2vw,17px)}.health-ring{border:clamp(10px,1.7vw,20px) solid var(--coral);width:58%;aspect-ratio:1;border-radius:50%;margin:14% auto;display:grid;place-content:center;text-align:center;font-size:clamp(18px,3vw,43px)}.health-ring span{font:8px "DM Mono"}.health-ui small{font:9px "DM Mono"}.orange-disc{width:33%;aspect-ratio:1;border-radius:50%;background:var(--coral);position:absolute;right:16%;top:11%}.project-loom .project-art{background:#e9e4d6}.loom-window{position:absolute;width:58%;height:72%;left:20%;top:15%;background:#fcfaf5;border:1px solid #c9c5ba;box-shadow:18px 23px 0 #293539;padding:5%}.window-top{height:25px;border-bottom:1px solid #ddd8ca;display:flex;gap:5px;align-items:center}.window-top i{height:6px;width:6px;border-radius:50%;background:#b5b2aa}.window-top b{font:10px "DM Mono";margin-left:8px}.chart-bars{position:absolute;bottom:12%;left:10%;right:10%;height:45%;display:flex;gap:7%;align-items:end}.chart-bars i{width:9%;background:#b7dc56;height:var(--h)}.chart-bars i:nth-child(1){height:28%}.chart-bars i:nth-child(2){height:45%}.chart-bars i:nth-child(3){height:34%}.chart-bars i:nth-child(4){height:70%}.chart-bars i:nth-child(5){height:55%}.chart-bars i:nth-child(6){height:82%}.chart-bars i:nth-child(7){height:92%;background:#ec7959}.chart-line{position:absolute;width:69%;top:49%;left:13%;border-top:3px solid #243438;transform:rotate(-13deg)}.loom-sticker{position:absolute;right:13%;top:18%;background:var(--coral);padding:17px;border-radius:50%;font:15px "DM Mono";transform:rotate(13deg)}.project-oda .project-art{background:#e7d8ff}.oda-shape{position:absolute;background:#5641ca;border-radius:50%}.oda-shape.one{width:48%;aspect-ratio:1;right:-4%;top:-25%}.oda-shape.two{width:27%;aspect-ratio:1;left:19%;bottom:-21%;background:#ff8d4f}.oda-word{position:absolute;left:20%;top:25%;font-size:clamp(75px,14vw,220px);letter-spacing:-.12em;font-weight:700;color:#1f2851}.oda-word span{color:#ff8d4f}.oda-card{position:absolute;right:18%;bottom:15%;background:#f9f5eb;padding:24px;font-size:clamp(13px,1.8vw,25px);line-height:1.05;transform:rotate(-8deg);box-shadow:9px 10px 0 #1f2851}.about{padding-top:145px}.about> .eyebrow{border-top:1px solid var(--ink);padding-top:16px;margin:0}.about-content{display:grid;grid-template-columns:1.2fr .8fr;gap:13%;padding:100px 10% 130px 12%}.about h2,.contact h2{font-size:clamp(42px,5.5vw,82px);line-height:.98;letter-spacing:-.070em;margin:0}.about-content div p{font-size:17px;line-height:1.45;margin:0 0 21px}.text-link{display:inline-block;color:var(--ink);font:13px "DM Mono";padding-bottom:6px;border-bottom:1px solid var(--ink);margin-top:18px;text-decoration:none}.text-link span{font-size:20px;margin-left:16px}.marquee{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);white-space:nowrap;overflow:hidden;padding:21px 0;font-size:clamp(24px,3.6vw,53px);letter-spacing:-.0550em}.marquee div{width:max-content;animation:marquee 28s linear infinite}.marquee b{color:#f15e3e;margin:0 16px}.quote{background:#1e302c;color:#f3f0e8;padding-top:105px;padding-bottom:105px}.quote .eyebrow{color:#b7e74d}.quote blockquote{font-size:clamp(35px,5.1vw,76px);line-height:1.05;letter-spacing:-.0650em;max-width:1100px;margin:80px 0 65px}.attribution{margin:0}.contact{background:var(--acid);padding-top:105px;padding-bottom:105px}.contact .eyebrow{margin:0 0 70px}.contact h2{font-size:clamp(64px,10.2vw,158px)}.contact-link{display:inline-flex;gap:15px;align-items:center;color:var(--ink);font-size:clamp(18px,2.5vw,33px);letter-spacing:-.050em;margin-top:52px;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:6px}.contact-link span{font-size:30px}footer{background:#1e302c;color:#f3f0e8;padding:32px 4.2vw;display:flex;justify-content:space-between;align-items:center}footer .brand{color:#f3f0e8}footer p,footer a{font:12px "DM Mono"}footer div{display:flex;gap:18px}.toast{position:fixed;z-index:10;bottom:25px;left:50%;background:var(--ink);color:var(--paper);font:12px "DM Mono";padding:13px 18px;border-radius:30px;transform:translate(-50%,100px);opacity:0;transition:.3s}.toast.show{transform:translate(-50%,0);opacity:1}.reveal{animation:reveal .8s both}.hero-title .reveal{animation-delay:.13s}.hero-bottom.reveal{animation-delay:.25s}@keyframes reveal{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}@keyframes float{50%{transform:translateY(-12px) rotate(9deg)}}@keyframes marquee{to{transform:translateX(-50%)}}@media(max-width:700px){.nav{height:70px;padding:0 20px}.nav nav,.availability{display:none}.section,.hero,.quote{padding-left:20px;padding-right:20px}.hero{min-height:calc(100vh - 70px);padding-top:70px}.hero-title{display:block}.orb-wrap{display:none}.hero-bottom{padding:65px 0 26px}.project{padding:42px 0 23px}.project-art{height:68vw}.project-meta{grid-template-columns:1fr auto;gap:8px;padding-right:35px}.project-meta p{grid-row:2;grid-column:1/-1}.project-meta span{display:none}.project-arrow{bottom:24px}.about{padding-top:90px}.about-content{display:block;padding:65px 8% 85px}.about-content h2{margin-bottom:40px}.quote{padding-top:70px;padding-bottom:70px}.quote blockquote{margin:55px 0 45px}.contact{padding-top:70px;padding-bottom:75px}.contact .eyebrow{margin-bottom:48px}footer{padding:25px 20px}footer p{display:none}.phone{left:32%;width:39%}.oda-card{padding:15px}.project-meta h2{font-size:19px}}

/* about.css */
.back{position:absolute;left:50%;transform:translateX(-50%);font:12px "DM Mono"!important}.about-hero{padding:110px 14% 135px}.about-hero h1{font-size:clamp(65px,10vw,150px);line-height:.88;letter-spacing:-.0850em;margin:52px 0}.about-hero h1 em,.achievements em,.about-contact em{font-family:"Playfair Display",serif;font-weight:600}.about-hero>p:not(.eyebrow){font-size:clamp(18px,2.1vw,28px);line-height:1.32;max-width:760px}.experience,.skills{padding:100px 4.2vw;border-top:1px solid var(--ink)}.section-title{display:flex;justify-content:space-between}.section-title p,.section-title span{margin:0;font:12px "DM Mono"}.roles{margin:80px 10% 0 12%}.roles article{display:grid;grid-template-columns:25% 1fr;padding:32px 0;border-top:1px solid var(--line)}.years{font:12px "DM Mono";margin:4px 0}.roles h2,.roles h3{margin:0;letter-spacing:-.050em}.roles h2{font-size:clamp(24px,3vw,42px)}.roles h3{font-size:16px;font-weight:500;margin-top:5px}.roles article div>p{font-size:17px;line-height:1.45;max-width:640px;margin:24px 0 0}.skill-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:80px;border-top:1px solid var(--ink)}.skill-grid div{padding:25px 25px 0 0}.skill-grid div+div{padding-left:25px;border-left:1px solid var(--line)}.skill-grid h2{font-size:19px;letter-spacing:-.04em;margin:0 0 25px}.skill-grid p{font-size:15px;line-height:1.55;margin:0}.achievements{background:#e7d8ff;padding:100px 14%;display:grid;grid-template-columns:.7fr 1.3fr;gap:10%}.achievements p{font-size:16px;line-height:1.5}.achievements .eyebrow{margin:0;font-size:12px}.achievements h2{font-size:clamp(36px,5vw,72px);line-height:.98;letter-spacing:-.070em;margin:0 0 35px}.about-contact{padding:105px 4.2vw;background:var(--acid)}.about-contact .eyebrow{margin:0 0 65px}.about-contact h2{font-size:clamp(62px,10vw,145px);line-height:.88;letter-spacing:-.0850em;margin:0}.about-contact a{display:inline-block;color:var(--ink);font-size:clamp(18px,2.5vw,32px);text-decoration:none;border-bottom:1px solid var(--ink);margin-top:52px;padding-bottom:7px}.about-contact a span{margin-left:15px}@media(max-width:700px){.about-nav .availability{display:flex;font-size:10px!important}.about-hero{padding:68px 20px 80px}.about-hero h1{font-size:clamp(54px,15vw,75px);margin:38px 0}.about-hero>p:not(.eyebrow){font-size:17px}.experience,.skills{padding:70px 20px}.roles{margin:55px 0 0}.roles article{display:block;padding:25px 0}.roles article div{margin-top:18px}.roles article div>p{font-size:16px;margin-top:17px}.skill-grid{display:block;margin-top:48px}.skill-grid div{padding:24px 0}.skill-grid div+div{padding-left:0;border-left:0;border-top:1px solid var(--line)}.achievements{display:block;padding:70px 20px}.achievements>div{margin-top:45px}.about-contact{padding:70px 20px}.about-contact .eyebrow{margin-bottom:45px}.back{font-size:11px!important}}

/* about-links.css */
.about-hero { padding-inline:4.2vw; text-align:left; }
.about-hero > p:last-child {
  margin-left:0;
  max-width:min(680px,100%);
  text-align:left;
}
@media(max-width:700px) {
  .about-hero > p:last-child { margin-left:0; max-width:100%; }
}
.skills .skill-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(32px,4vw,64px);
  border-top:0;
  counter-reset:skill;
}
.skills .skill-grid > div {
  display:grid;
  align-content:start;
  gap:0;
  min-width:0;
  padding:28px 0 0;
  border-left:0;
  border-top:1px solid var(--line);
}
.skills .skill-grid > div::before {
  counter-increment:skill;
  content:"A " counter(skill,decimal-leading-zero) ".";
  font:11px/1.5 "DM Mono",monospace;
  letter-spacing:.08em;
}
.skills .skill-grid h2 {
  margin:22px 0 16px;
  font:700 clamp(23px,2.5vw,34px)/1.1 "DM Sans",sans-serif;
  letter-spacing:-.045em;
}
.skills .skill-grid p {
  margin:0;
  font:400 17px/1.6 "DM Sans",sans-serif;
  overflow-wrap:anywhere;
}
@media(max-width:1000px) {
  .skills .skill-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
  .skills .skill-grid { grid-template-columns:1fr; gap:32px; }
  .skills .skill-grid > div { padding:20px 0; }
}
.achievements h2 {
  font-family:"DM Sans",sans-serif;
  font-weight:400;
  font-style:normal;
  line-height:1.15;
  letter-spacing:-.02em;
  font-kerning:normal;
}
.achievements h2 em {
  font-family:inherit;
  font-weight:inherit;
  font-style:normal;
  letter-spacing:inherit;
}
.about-hero > .eyebrow { margin-left:0; text-align:left; }
@media(max-width:700px) { .about-hero { padding-inline:20px; } }
@media(max-width:700px) { .about-hero > .eyebrow { margin-left:0; } }
.achievements { padding-inline:4.2vw; display:block; }
.achievements > div { margin-top:80px; text-align:left; }
.achievements > .eyebrow { text-align:left; font:12px "DM Mono",monospace; }
@media(max-width:700px) { .achievements { padding-inline:20px; } }
.recognition-links { border-top: 1px solid var(--ink); margin-top: 42px; }
.recognition-links a, .showcase-links a { display: flex; justify-content: space-between; gap: 20px; color: var(--ink); text-decoration: none; padding: 14px 0; border-bottom: 1px solid rgba(23,33,31,.25); font-size: 17px; }
.recognition-links a span, .showcase-links a span { font: 11px "DM Mono", monospace; white-space: nowrap; }
.recognition-links a:hover { opacity: .55; }
.showcase-links a.button-medium { padding:0 0 6px; gap:16px; }
.showcase-links a.button-medium span { font:20px/1.5 "DM Mono",monospace; }
.showcase-links { display: flex; gap: 28px; margin-top: 30px; }
.showcase-links a { border-bottom: 1px solid var(--ink); font-size: 15px; }
@media (max-width: 700px) { .showcase-links { display: block; margin-top: 22px; } .showcase-links a { margin-top: 12px; } }
@media (max-width:700px) {
  .showcase-links { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; }
  .showcase-links a.button-medium {
    display:flex; width:100%; min-width:0; margin:0;
    justify-content:space-between; align-items:center; gap:20px;
    padding:8px 0 12px;
  }
  .showcase-links a.button-medium span { flex-shrink:0; }
}

/* site-chrome.css */
/* Consistent header and footer across every page. */
/* Match the footer beneath iOS safe areas and rubber-band scrolling. */
html { --page-canvas:#f3f0e8; background:var(--page-canvas); }
body { min-height:100svh; background:var(--page-canvas); }
/* Keep paper on the content, not on the canvas Safari exposes below it. */
body > main, body > header.nav { background:var(--paper,#f3f0e8); }
footer.site-footer { padding-bottom:calc(28px + env(safe-area-inset-bottom, 0px)); }
/* Do not let the fixed grain tint the footer differently from its canvas. */
footer.site-footer, .next-project { position:relative; z-index:5; background:#1e302c; }
.ui-arrow { width:1em; height:1em; display:inline-block; vertical-align:-.1em; overflow:visible; }
.project-art-full-banner > img { display:block; width:100%; height:100%; object-fit:cover; }
.animation-media { display:block; }
.loop-video { display:block; width:100%; height:auto; object-fit:contain; }
html body .next-project > a:not(.return-work) {
  display:inline-flex;
  align-items:baseline;
  gap:clamp(16px,2vw,32px);
  font-kerning:normal;
  letter-spacing:-.035em;
  line-height:1.15;
}
html body .next-project > a:not(.return-work) span {
  margin-left:0;
  letter-spacing:0;
  flex-shrink:0;
}
html body .process blockquote {
  font-family:"DM Sans",sans-serif;
  font-weight:400;
  font-style:normal;
  font-kerning:normal;
  letter-spacing:-.02em;
}
html body .marquee {
  font-kerning:normal;
  letter-spacing:-.02em;
}
html body .marquee b { letter-spacing:0; }
html body .process blockquote em {
  font-family:inherit;
  font-weight:inherit;
  font-style:normal;
  letter-spacing:inherit;
}
/* Unified page-title typography; existing sizes and colours are preserved. */
html body .case-hero h1,
html body .about-hero h1,
html body .hero h1,
html body .about-content h2,
html body .contact-heading h2 {
  font-family:"DM Sans",sans-serif;
  font-weight:700;
  font-style:normal;
  font-kerning:normal;
  letter-spacing:-.035em;
}
html body .case-hero h1 em,
html body .about-hero h1 em,
html body .hero h1 em,
html body .about-content h2 em,
html body .contact-heading h2 em {
  font-family:inherit;
  font-weight:inherit;
  font-style:normal;
  letter-spacing:inherit;
}
img { transition:opacity .45s ease; }
img.image-loading { opacity:0; }
@media(prefers-reduced-motion:reduce) { img { transition:none; } }
.meta-pills,
.case-hero .case-kicker.meta-pills > .heading-reveal-mask > .heading-reveal-text {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  column-gap:16px;
  row-gap:12px;
}
.meta-pills .meta-pill {
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  min-height:28px;
  padding:6px 12px;
  border:0;
  border-radius:0;
  background:var(--coral);
  color:var(--ink);
  font:400 10px/1.2 "DM Mono",monospace;
  letter-spacing:.01em;
}
.case-hero .case-kicker.meta-pills { margin-bottom:16px; }
.case-hero .case-kicker.meta-pills > .heading-reveal-mask { width:100%; }
.project-meta > .project-pills {
  grid-column:3;
  min-width:0;
  justify-self:end;
  justify-content:flex-end;
  padding-right:58px;
}
.project-meta .project-pills .meta-pill { display:inline-flex; }
@media(max-width:900px) {
  .case-hero .case-kicker.meta-pills,
  .case-hero .case-kicker.meta-pills > .heading-reveal-mask > .heading-reveal-text {
    flex-direction:row;
    align-items:center;
    gap:6px;
  }
}
@media(max-width:700px) {
  .project-meta > .project-pills {
    grid-column:1 / -1;
    grid-row:3;
    justify-self:start;
    flex-direction:row;
    align-items:center;
    gap:6px;
    padding-right:0;
  }
  .meta-pills .meta-pill { font-size:9px; padding:6px 8px; white-space:nowrap; }
}
header.nav .header-meta { display:flex; align-items:center; gap:24px; margin-left:auto; font:12px/1.4 "DM Mono",monospace; white-space:nowrap; }
header.nav .header-social, .case-details .project-website-link { display:inline-flex; align-items:center; min-height:44px; color:inherit; font:12px/1.4 "DM Mono",monospace; text-decoration:underline; text-underline-offset:5px; transition:opacity .2s ease; }
header.nav .header-social:hover, .case-details .project-website-link:hover { opacity:.65; }
@media(max-width:900px) {
  header.nav { flex-wrap:wrap; height:auto; gap:12px 20px; padding-block:16px; }
  header.nav .back { position:static; transform:none; margin-left:auto; }
  header.nav .header-meta { gap:18px; }
}
@media(max-width:500px) {
  header.nav .header-meta { width:100%; justify-content:space-between; margin-left:0; }
}
header.nav a.brand,
footer.site-footer a.brand {
  display: inline-block;
  font: 700 24px/1 "DM Sans", sans-serif !important;
  letter-spacing: -1.6px !important;
  white-space: nowrap;
  text-decoration: none;
}
header.nav a.brand,
footer.site-footer a.brand {
  position:relative;
  transition:transform .25s ease;
}
header.nav a.brand::after,
footer.site-footer a.brand::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-7px;
  height:2px;
  background:var(--coral,#ff704a);
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .3s cubic-bezier(.22,.8,.24,1);
}
header.nav a.brand:focus-visible,
footer.site-footer a.brand:focus-visible {
  transform:translateY(-2px);
  outline:2px solid var(--coral,#ff704a);
  outline-offset:9px;
}
header.nav a.brand:focus-visible::after,
footer.site-footer a.brand:focus-visible::after {
  transform:scaleX(1);
  transform-origin:left;
}
@media(hover:hover) {
  header.nav a.brand:hover,
  footer.site-footer a.brand:hover { transform:translateY(-2px); }
  header.nav a.brand:hover::after,
  footer.site-footer a.brand:hover::after {
    transform:scaleX(1);
    transform-origin:left;
  }
}
@media(prefers-reduced-motion:reduce) {
  header.nav a.brand, footer.site-footer a.brand,
  header.nav a.brand::after, footer.site-footer a.brand::after { transition:none; }
  header.nav a.brand:hover, footer.site-footer a.brand:hover,
  header.nav a.brand:focus-visible, footer.site-footer a.brand:focus-visible { transform:none; }
}
footer.site-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
}
.site-footer .brand { justify-self: start; }
.site-footer .footer-top {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font: 24px/1 "DM Sans", sans-serif;
  text-decoration: none;
  transition: transform .25s ease, background-color .25s ease, color .25s ease;
}
.site-footer .footer-social {
  justify-self: end;
  display: grid;
  align-items: center;
  min-height: 48px;
  font: 13px "DM Mono", monospace;
}
.site-footer .footer-top:hover { background: #f3f0e8; color: #1e302c; transform: translateY(-4px); }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
@media (max-width: 700px) {
  header.nav { flex-wrap: wrap; height: auto; min-height: 70px; gap: 12px 20px; padding-top: 16px; padding-bottom: 16px; }
  header.nav .back { position: static; transform: none; margin-left: auto; }
  header.nav .availability { margin-left: auto; }
  footer.site-footer { gap: 6px; padding: 28px 16px calc(28px + env(safe-area-inset-bottom, 0px)); grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr); }
  .site-footer .footer-top { width: 44px; height: 44px; }
  .site-footer .footer-social { font-size: 12px; }
}
/* Homepage project navigation fade-out. Project pages appear without a fade-in. */
body.page-leaving {
  opacity: 0;
  transition: opacity 220ms ease-out;
}
@media (prefers-reduced-motion: reduce) {
  body.page-leaving { opacity: 1; transition: none; }
  body:has(.case-hero) main { animation: none; }
  html { scroll-behavior: auto; }
  .site-footer a { transition: none; }
}
.case-details dl div { gap:20px; align-items:baseline; }
.case-details .project-website-link { display:inline; min-height:0; font-size:12px; line-height:1.5; }
.case-details dt { flex-shrink:0; }
.case-details dd { min-width:0; overflow-wrap:break-word; line-height:1.5; }
.project-role { padding-inline:4.2vw; }
.project-role-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin-top:60px; }
.project-role-card { border:1px solid var(--line); padding:32px; min-width:0; }
.project-role-card > span { font:11px/1.5 "DM Mono",monospace; letter-spacing:.08em; }
.project-role-card h3 { font-size:clamp(23px,2.5vw,34px); letter-spacing:-.0450em; line-height:1.1; margin:22px 0 16px; }
.project-role-card p { font-size:17px; line-height:1.6; margin:0; max-width:700px; }
@media(max-width:700px) {
 .project-role { padding-inline:20px; }
 .project-role-grid { grid-template-columns:1fr; gap:24px; margin-top:36px; }
 .project-role-card { padding:24px; }
}
/* Shared project-style closing callout, also used on About. */
.next-project { background:#1e302c; color:#f3f0e8; padding:90px 4.2vw; }
.next-project > .eyebrow { color:#b7e74d; margin:0 0 35px; }
.next-project > a { font-size:clamp(50px,8vw,120px); letter-spacing:-.08em; text-decoration:none; color:inherit; }
.next-project > a span { font-size:.55em; margin-left:20px; }
@media(max-width:700px) { .next-project { padding:65px 20px; } }
.case-hero .project-page-hero { width:100%; aspect-ratio:16 / 9; margin:0; overflow:hidden; }
.case-hero .project-page-hero img { display:block; width:100%; height:100%; object-fit:contain; }

/* buttons.css */
/* Shared calls to action. Selected-work banners deliberately excluded. */
.button-medium {
  display:inline-flex !important;
  align-items:center;
  gap:16px;
  width:fit-content;
  max-width:100%;
  font:13px/1.5 "DM Mono",monospace !important;
  letter-spacing:0;
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid currentColor;
  padding-bottom:6px;
}
.button-large {
  display:inline-flex;
  align-items:center;
  gap:15px;
  max-width:100%;
  color:inherit;
  font-size:clamp(18px,2.4vw,30px);
  letter-spacing:-.050em;
  text-decoration:none;
  border-bottom:1px solid currentColor;
  padding-bottom:6px;
  overflow-wrap:anywhere;
}
.button-medium span { font-size:20px; margin-left:0 !important; }
header.nav a.header-social.button-medium {
  min-height:0;
  text-decoration:none;
  padding-bottom:6px;
  transition:transform .25s ease, border-color .25s ease;
}
header.nav a.header-social.button-medium:hover { opacity:1; }
.button-large span { font-size:30px; margin-left:0; }
.button-medium, .button-large, .next-project a {
  transition:transform .25s ease, border-color .25s ease;
}
.button-medium span, .button-large span, .next-project a span {
  display:inline-block;
  flex-shrink:0;
  transition:transform .25s ease;
}
.next-project a { display:inline-block; max-width:100%; }
.next-project a[style] { width:fit-content; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  .button-medium:hover, .button-large:hover, .next-project a:hover {
    opacity:1;
    transform:translateX(7px);
  }
  .button-medium:hover span, .button-large:hover span, .next-project a:hover span {
    transform:translate(4px,-4px);
  }
}
.site-footer .footer-copyright {
  justify-self:end;
  text-align:right;
  font:12px/1.5 "DM Mono",monospace;
}
header.nav .header-meta { width:auto; margin-left:auto; }
@media(max-width:500px) {
  .site-footer .footer-copyright { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) {
  .button-medium, .button-large, .next-project a,
  .button-medium span, .button-large span, .next-project a span { transition:none; }
  .button-medium:hover, .button-large:hover, .next-project a:hover,
  .button-medium:hover span, .button-large:hover span, .next-project a:hover span { transform:none; opacity:1; }
}
.return-work-wrap { padding:0 4.2vw 48px; }
.return-work,.next-project .return-work { display:block; width:fit-content; margin-top:45px; color:inherit; font:13px/1.5 "DM Mono",monospace; letter-spacing:0; text-decoration:none; transition:transform .25s ease,opacity .25s ease; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) { .return-work:hover { transform:translateX(6px); opacity:.68; } }
@media(max-width:700px) { .return-work-wrap { padding-inline:20px; } }
@media(prefers-reduced-motion:reduce) { .return-work { transition:none; } }
/* Consistent trailer band across game case studies. */
section.game-trailer { background:#17211f; color:#f3f0e8; padding:72px 4.2vw; }
.game-trailer > .eyebrow { margin:0 0 32px; }
.game-trailer > .button-medium { color:inherit; margin-top:24px; }
.game-trailer-placeholder { min-height:320px; aspect-ratio:16 / 9; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:24px; text-align:center; padding:32px; border:1px dashed rgba(243,240,232,.35); }
.game-trailer-placeholder > span { font-size:48px; }
.game-trailer-placeholder h2 { font-size:clamp(28px,4vw,52px); letter-spacing:-.050em; margin:0; }
.game-trailer-placeholder p { font:12px/1.6 "DM Mono",monospace; margin:0; }
@media(max-width:700px) { section.game-trailer { padding:55px 20px; } }

/* project-wipe.css */
/* Orange to/from home; lime green between projects. */
html::after {
  content: ''; position: fixed; z-index: 2147483647;
  top: -100px; bottom: -100px; left: -50vh; right: -50vh;
  background: var(--wipe-colour, #ff704a); pointer-events: none;
  transform: translateX(110%) skewX(-12deg);
  transition: none;
}
html.project-wipe-cover::after {
  transform: translateX(0) skewX(-12deg);
  transition: transform 450ms cubic-bezier(.65,0,.35,1);
  pointer-events: auto;
}
html.project-wipe-arriving::after { transition:none; }
html.project-wipe-reveal::after {
  transform: translateX(-110%) skewX(-12deg);
  transition: transform 500ms cubic-bezier(.65,0,.35,1);
}
html.project-wipe-cover main { animation: none; }
/* Safari may expose the document beneath its translucent toolbars even while
   a fixed overlay covers the layout viewport. Paint that document as well. */
html.project-wipe-cover,
html.project-wipe-cover body { background:var(--wipe-colour,#ff704a) !important; }
html.project-wipe-covered body > * { visibility:hidden !important; }
@media (prefers-reduced-motion: reduce) {
  html::after { display: none; }
}
/* Mobile uses opacity only: never try to paint across Safari's browser bars. */
@media (max-width:900px), (hover:none) {
  html::after { display:none; }
  body { transition:opacity 180ms ease; }
  html.page-fade-out body, html.page-fade-in body { opacity:0; }
}
@media (prefers-reduced-motion:reduce) {
  body { transition:none; }
  html.page-fade-out body, html.page-fade-in body { opacity:1; }
}

/* heading-reveal.css */
:is(.case-hero h1, .about-hero h1, main h2, main p, .hero-headline, .spark-caption) > .heading-reveal-mask {
  display: block;
  overflow: clip;
  /* Leave space for italic overhangs and descenders without moving the title. */
  padding: .12em .15em;
  margin: -.12em -.15em;
}
:is(.case-hero h1, .about-hero h1, main h2, main p, .hero-headline, .spark-caption) > .heading-reveal-mask > .heading-reveal-text { display: block; }
.hero-bottom .scroll-work-cue > .heading-reveal-mask > .heading-reveal-text {
  display: flex; align-items: center; gap: 14px;
}
