@charset "UTF-8";
:root{--paper:#f6f5f1;--ink:#21221f;--muted:#6b6c66;--line:#d9d9d1;--gutter:clamp(22px,4.2vw,80px)}
*{box-sizing:border-box;letter-spacing:-.05em}html{background:var(--paper);color:var(--ink);font-family:"DM Serif Text",Georgia,serif;font-weight:400;line-height:1.08;-webkit-font-smoothing:antialiased}body{margin:0}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,video:focus-visible{outline:2px solid var(--ink);outline-offset:6px}::selection{background:#dbea70;color:#21221f}p,h1,h2,figure{margin:0}h1,h2{font-weight:400}a{transition:opacity 180ms ease}a:hover{opacity:.7}.header,main,footer{max-width:1800px;margin-inline:auto;padding-inline:var(--gutter)}.header{height:112px;display:flex;justify-content:space-between;align-items:center}.wordmark{font-size:21px;letter-spacing:-.05em}.header nav{display:flex;gap:32px;font-size:15px}.header nav a{min-height:44px;display:flex;align-items:center;position:relative}.header nav a[aria-current]:after{content:'';position:absolute;bottom:8px;height:1px;background:currentColor;left:0;right:0}.skip{position:fixed;left:20px;top:-100px;background:var(--ink);color:var(--paper);padding:14px;z-index:10}.skip:focus{top:12px}.intro{padding:48px 0 76px}.intro h1{font-size:clamp(25px,2.55vw,40px);line-height:1.107;letter-spacing:-.05em}.intro h1 span{color:var(--muted)}.section-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;font-size:12px}.section-top h2{font-size:12px}.section-top>span{color:var(--muted);font-variant-numeric:tabular-nums}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:51px 28px}.project{display:block;min-width:0}.project:hover{opacity:1}.thumbnail{overflow:hidden;background:#e8e6df;aspect-ratio:4/3}.thumbnail img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 350ms ease}.project:hover .thumbnail img{transform:scale(1.018)}.project-caption{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-top:17px}.project-caption h2{font-size:16px;letter-spacing:-.05em}.project-caption p{font-size:12px;color:var(--muted);line-height:1.35;text-align:right}.demo-label{display:block;font-size:10px;line-height:1.44;color:var(--muted);margin-top:5px}.demo-notice{font-size:12px;color:var(--muted);margin-top:72px;max-width:500px;line-height:1.53}footer{margin-top:90px;min-height:136px;display:flex;align-items:center;gap:32px;font-size:13px;position:relative}footer:before{content:'';height:1px;background:var(--line);position:absolute;top:0;left:var(--gutter);right:var(--gutter)}.footer-note{display:block;color:var(--muted);font-size:11px;margin-top:8px}.footer-links{margin-left:auto;display:flex;gap:25px;flex-wrap:wrap}.footer-links a{padding-block:14px}.copyright{margin-left:auto;color:var(--muted);font-size:11px}.footer-links:not(:empty)+.copyright{margin-left:0}.about{padding-top:58px;min-height:65vh}.eyebrow{font-size:12px;color:var(--muted);margin-bottom:26px}.about h1{font-size:clamp(40px,5.3vw,80px);line-height:0.945;letter-spacing:-.05em;max-width:970px}.about-body{display:grid;grid-template-columns:1fr 1fr;gap:7vw;margin:65px 0 80px;padding-left:25%}.about-body:has(.portrait){padding-left:0}.about-body>div{grid-column:1/-1;max-width:610px}.about-body:has(.portrait)>div{grid-column:auto}.about-body p{font-size:21px;line-height:1.35;letter-spacing:-.05em;margin-bottom:20px}.about-body .draft-note{font-size:12px;color:var(--muted);margin-top:26px;letter-spacing:-.05em}.contact-block{margin-top:48px}.contact-block h2{font-size:12px;margin-bottom:16px}.contact-block p{font-size:16px}.text-link{display:inline-block;padding:12px 0;text-decoration:underline;text-underline-offset:5px}.portrait{width:100%;height:auto}.muted{color:var(--muted)}.case-study{padding-top:32px}.back-link{display:inline-flex;min-height:44px;align-items:center;font-size:13px}.case-intro{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:end;margin:40px 0 48px}.case-intro h1{font-size:clamp(44px,5.4vw,82px);letter-spacing:-.05em;line-height:0.918}.case-intro .eyebrow{margin-bottom:16px}.case-description{max-width:520px;font-size:clamp(19px,2vw,27px);line-height:1.242;letter-spacing:-.05em}.details{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);padding-top:20px;gap:20px;margin:0 0 30px}.details dt{font-size:11px;color:var(--muted);margin-bottom:10px}.details dd{font-size:13px;line-height:1.44;margin:0}.case-disclaimer{font-size:11px;color:var(--muted);margin-bottom:25px;line-height:1.44}.case-media{display:grid;gap:28px}.media-row{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}.media-row.paired{grid-template-columns:repeat(2,minmax(0,1fr))}.media-row img,.media-row video{display:block;width:100%;height:auto;background:#e8e6df}.media-row figcaption{font-size:12px;line-height:1.44;color:var(--muted);margin-top:12px}.story{display:grid;grid-template-columns:1fr 2fr;gap:28px;padding:65px 0;max-width:980px}.story h2{font-size:13px}.story p{font-size:21px;line-height:1.395;letter-spacing:-.05em}.story ul{margin:0;padding-left:18px;line-height:1.62}.project-navigation{border-top:1px solid var(--line);margin-top:65px;padding-top:30px;display:flex;justify-content:space-between;gap:24px}.project-navigation>a{padding-block:10px;font-size:13px}.project-navigation>a:last-child{text-align:right}.project-navigation strong{display:block;font-weight:400;font-size:clamp(25px,3vw,44px);letter-spacing:-.05em;margin-top:13px}.project-navigation strong span{margin-left:20px}.project-navigation>a>span{color:var(--muted)}
@media(min-width:1800px){.intro{padding-top:60px;padding-bottom:90px}}@media(max-width:1000px){.project-caption{display:block}.project-caption p{text-align:left;margin-top:5px}.about-body{padding-left:15%;grid-template-columns:1fr}.about-body:has(.portrait){grid-template-columns:1fr 1fr}.details{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.header{height:88px}.wordmark{font-size:19px}.header nav{gap:23px;font-size:14px}.intro{padding-top:35px;padding-bottom:49px}.intro h1{font-size:27px;letter-spacing:-.05em;line-height:1.125;max-width:490px}.intro h1 span{display:inline-block;margin-top:5px}.section-top{padding-bottom:14px}.project-grid{grid-template-columns:1fr;gap:34px}.project-caption{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:13px}.project-caption h2{font-size:15px}.project-caption p{font-size:11px;margin-top:0}.demo-notice{margin-top:48px}footer{margin-top:56px;padding-top:28px;padding-bottom:28px;align-items:flex-start;flex-wrap:wrap;gap:18px;min-height:120px}.footer-links{width:100%;order:3;margin:0;gap:18px}.copyright{margin-left:auto}.footer-links:not(:empty)+.copyright{margin-left:auto}.about{padding-top:36px}.about h1{font-size:48px}.about-body,.about-body:has(.portrait){padding-left:0;display:block;margin-top:38px}.about-body p{font-size:19px}.portrait{margin-top:40px}.case-study{padding-top:15px}.case-intro{grid-template-columns:1fr;margin:25px 0 30px;gap:26px}.case-intro h1{font-size:50px}.case-description{font-size:21px}.details{gap:20px 14px}.case-media,.media-row{gap:16px}.media-row.paired{grid-template-columns:1fr}.story{grid-template-columns:1fr;padding:38px 0;gap:16px}.story p{font-size:19px}.project-navigation{margin-top:36px}.project-navigation strong{font-size:27px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}.project:hover .thumbnail img{transform:none}}

/* A one-time, text-only entrance on each page load. No layout movement. */
@keyframes text-enter {
  from { opacity: 0; transform: translateY(var(--text-enter-distance, -100px)); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: no-preference) {
  :where(.wordmark, .header nav, .intro h1, .section-top,
    .project-caption, .demo-label, .demo-notice, .about > .eyebrow,
    .about > h1, .about-body > div > p, .contact-block,
    .back-link, .case-intro > div, .case-description, .details > div,
    .case-disclaimer, figcaption, .story > h2, .story > p, .story > ul,
    .project-navigation > a, footer > span, .footer-links) {
    animation: text-enter 850ms cubic-bezier(.22, 1, .36, 1) backwards;
    animation-delay: 180ms;
  }
  .wordmark, .header nav { animation-delay: 0ms; }
  .intro h1, .about > .eyebrow, .back-link { animation-delay: 60ms; }
  .about > h1, .case-intro > div, .case-description { animation-delay: 120ms; }
  .about-body > div > p:nth-child(2), .contact-block,
  .project-caption, .demo-label { animation-delay: 240ms; }
  /* Keyboard users can interact immediately, even during the entrance. */
  :focus-visible, :focus-within, .project:focus-visible .project-caption,
  .project:focus-visible .demo-label { animation: none; }
}

/* Editorial homepage. The opening section remains in normal document flow. */
.home-page{--text-enter-distance:-24px}
.editorial-intro{min-height:calc(100svh - 112px);display:grid;place-items:center;padding:48px 0;text-align:center}
.editorial-intro h1{font-size:clamp(48px,6.4vw,96px);line-height:1.02;max-width:1100px;width:100%;text-wrap:balance}
.editorial-intro h1>span{display:block}
.editorial-sequence{padding-top:clamp(40px,7vw,120px);padding-bottom:32px}
.editorial-project{position:relative;margin-bottom:clamp(100px,16vw,260px);isolation:isolate}
.editorial-project--left{width:56%;margin-left:3%}
.editorial-project--right{width:44%;margin-left:auto;margin-right:3%}
.editorial-project--feature{width:82%;margin-inline:auto;margin-bottom:clamp(140px,19vw,300px)}
.editorial-link{display:block;scroll-margin:32px}
.editorial-link:hover{opacity:1}
/* Future supplied annotation images can sit within this isolated composition. */
.composition{position:relative;transform:translateY(var(--drift,0px))}
.editorial-media img{display:block;width:100%;height:auto}
.editorial-caption{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:22px;line-height:1.35}
.editorial-caption h2{font-size:18px}
.editorial-caption p{font-size:12px;color:var(--muted);text-align:right}
.editorial-link:hover h2{text-decoration:underline;text-underline-offset:4px}
.editorial-notice{max-width:430px;font-size:12px;line-height:1.5;color:var(--muted)}
.home-page footer{margin-top:64px}
.home-page footer>span,.home-page .footer-links{animation:none}
@media(prefers-reduced-motion:no-preference){.editorial-intro h1{animation:text-enter 850ms cubic-bezier(.22,1,.36,1) 60ms backwards}}
@media(min-width:701px) and (max-width:1100px){
 .editorial-project--left{width:65%;margin-left:0}
 .editorial-project--right{width:57%;margin-right:0}
 .editorial-project--feature{width:90%}
 .editorial-caption{display:block}
 .editorial-caption p{text-align:left;margin-top:5px}
}
@media(max-width:700px){
 .editorial-intro{min-height:calc(100svh - 88px);padding:40px 0}
 .editorial-intro h1{font-size:clamp(39px,8.5vw,59px);line-height:1.05}
 .editorial-sequence{padding-top:32px}
 .editorial-project{margin-bottom:96px}
 .editorial-project--left{width:94%;margin-left:0}
 .editorial-project--right{width:90%;margin-left:auto;margin-right:0}
 .editorial-project--feature{width:100%;margin-bottom:112px}
 .editorial-caption{display:block;margin-top:16px}
 .editorial-caption h2{font-size:17px}
 .editorial-caption p{text-align:left;margin-top:5px}
 .composition{transform:none}
}
@media(prefers-reduced-motion:reduce){.composition{transform:none!important}}

/* Local review: fixed background introduction and overlapping side captions. */
.home-page .header{position:relative;z-index:3}
.home-page main{padding-top:calc(100svh - 112px)}
.editorial-intro{position:fixed;inset:112px 0 0;min-height:0;padding:40px var(--gutter);z-index:0;pointer-events:none;filter:blur(var(--intro-blur,0px));opacity:var(--intro-opacity,1)}
.editorial-sequence{position:relative;z-index:1}
.editorial-project--left{width:82%;margin-left:3%}
.editorial-project--right{width:74%;margin-left:auto;margin-right:0}
.editorial-project--feature{width:96%;margin-inline:auto}
.editorial-project .composition{width:72%}
.editorial-project--feature .composition{width:80%}
.editorial-caption{position:absolute;left:66%;top:38%;width:34%;display:block;margin:0;z-index:2}
.editorial-project--feature .editorial-caption{left:74%;width:26%;top:52%}
.editorial-caption h2{font-size:clamp(36px,4.5vw,68px);line-height:1.02;background:var(--paper);padding:.08em .16em;width:fit-content}
.editorial-caption p{font-size:13px;line-height:1.45;text-align:left;margin:12px 0 0 12px;background:var(--paper);padding:6px 8px;width:fit-content}
.editorial-notice{background:var(--paper);padding:12px}
.home-page footer{position:relative;z-index:2;background:var(--paper)}
@media(min-width:701px) and (max-width:1100px){
 .editorial-project--left{width:90%;margin-left:0}
 .editorial-project--right{width:86%}
 .editorial-project--feature{width:100%}
 .editorial-caption h2{font-size:clamp(32px,4.5vw,50px)}
}
@media(max-width:700px){
 .home-page main{padding-top:calc(100svh - 88px)}
 .editorial-intro{inset:88px 0 0;padding:40px 22px}
 .editorial-project--left{width:94%}
 .editorial-project--right{width:90%}
 .editorial-project--feature{width:100%}
 .editorial-project .composition{width:100%}
 .editorial-project .editorial-caption{position:relative;left:auto;top:auto;width:86%;margin:-26px 0 0 auto}
 .editorial-caption h2{font-size:36px}
 .editorial-caption p{font-size:12px;margin-top:6px}
}
@media(prefers-reduced-motion:reduce){.editorial-intro{filter:none!important;opacity:1!important}}

/* Local annotation refinements. */
.intro-copy{width:100%;max-width:1100px}
.intro-role{font-size:clamp(16px,1.65vw,22px);line-height:1.4;color:#74756f;max-width:720px;margin:28px auto 0;letter-spacing:-.025em}
.intro-role u{text-decoration-thickness:1px;text-underline-offset:3px}
.intro-linkedin{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;font-size:14px;color:#74756f;pointer-events:auto;text-decoration:underline;text-underline-offset:4px}
.editorial-intro:focus-within{filter:none;opacity:1}
.editorial-caption h2,.editorial-caption p{background:transparent}
@media(prefers-reduced-motion:no-preference){.intro-role,.intro-linkedin{animation:text-enter 850ms cubic-bezier(.22,1,.36,1) 120ms backwards}}
@media(max-width:700px){.intro-role{margin-top:22px;max-width:320px;font-size:16px}.intro-linkedin{font-size:13px}}

/* Supplied handwritten identity; preserve the header home link. */
.wordmark{display:flex;align-items:center;flex-shrink:0;min-height:44px}
.wordmark img{display:block;width:150px;height:auto;filter:brightness(0);transition:filter 180ms ease}
.wordmark:hover{opacity:1}
.wordmark:hover img,.wordmark:focus-visible img{filter:brightness(0) saturate(100%) invert(18%) sepia(98%) saturate(5850%) hue-rotate(354deg) brightness(96%) contrast(120%)}
@media(prefers-reduced-motion:reduce){.wordmark img{transition:none}}
@media(max-width:700px){.wordmark img{width:112px}}