:root{--paper:#fff;--ink:#111}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:white;color:var(--ink);font:16px Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px dashed;outline-offset:5px}button:hover,a:hover{text-decoration:line-through}.skip{position:absolute;top:-80px;background:white;padding:15px;z-index:40}.skip:focus{top:5px}header{display:flex;align-items:center;justify-content:space-between;padding:20px 2%;gap:20px}.wordmark{font-size:30px;font-weight:900;letter-spacing:-2px;text-decoration:none}nav{display:flex;gap:25px;font:14px 'Courier New',monospace}nav a{text-decoration:none}.hero{min-height:610px;padding:12px 2% 100px;position:relative}.hero h1{font-size:clamp(45px,6.7vw,106px);line-height:1.02;letter-spacing:-.055em;font-weight:900;margin:0;max-width:1200px}.intro{font-size:clamp(20px,2.2vw,32px);line-height:1.15;letter-spacing:-.04em;font-weight:bold;max-width:800px;margin:26px 0 0}.hero-bottom{display:flex;gap:25px;justify-content:space-between;align-items:center;margin-top:75px;max-width:780px;font:14px 'Courier New',monospace}.text-link{text-underline-offset:5px}.brush-hint{font-size:13px}.hero-note{position:absolute;right:3%;bottom:65px;font:20px 'Courier New',monospace;transform:rotate(9deg);line-height:1.2}.section{padding:50px 3% 110px}.section-top{display:flex;justify-content:space-between;align-items:center;border-top:1px solid;padding-top:16px}.section-top h2{font-size:16px;text-transform:uppercase;font-weight:normal;margin:0;font-family:'Courier New',monospace}.section-top h2 span{margin-left:15px;font-size:13px}.section-top p{font:13px 'Courier New',monospace;margin:0}.filters{display:flex;gap:20px;margin:22px 0 65px;flex-wrap:wrap}.filters button{font:14px 'Courier New',monospace;border:0;padding:0 0 4px;background:none;border-bottom:1px solid transparent}.filters .active{border-color:var(--ink)}.projects{display:grid;grid-template-columns:repeat(12,1fr);column-gap:4%;row-gap:110px;align-items:start}.project{padding:0;border:0;background:none;text-align:left;color:inherit;width:100%;display:block;grid-column:span 6}.project[hidden]{display:none}.project:nth-child(4n+1){grid-column:1/span 7}.project:nth-child(4n+2){grid-column:9/span 4;margin-top:170px;transform:rotate(2deg)}.project:nth-child(4n+3){grid-column:2/span 4;transform:rotate(-2deg)}.project:nth-child(4n+4){grid-column:7/span 6;margin-top:150px}.project-image{position:relative;aspect-ratio:16/11;overflow:hidden;background:#fff}.project-image img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:transform .45s,filter .45s}.project:hover{text-decoration:none}.project:hover img,.project:focus-visible img{transform:scale(1.04);filter:grayscale(0)}.project:nth-child(7) .project-image,.project:nth-child(8) .project-image{aspect-ratio:4/5}.project-meta{display:flex;align-items:baseline;justify-content:space-between;gap:15px;padding-top:12px}.project-meta h3{font-size:clamp(22px,2vw,30px);letter-spacing:-1px;line-height:1.1;margin:0;font-weight:900}.project-meta span,.project p{font:13px 'Courier New',monospace}.project p{margin:8px 0 0}.view-label{position:absolute;right:0;bottom:0;padding:9px 12px;background:white;font:12px 'Courier New',monospace;opacity:0;transition:opacity .2s}.project:hover .view-label,.project:focus-visible .view-label{opacity:1}.verativo-cover{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;background:#fff;border:2px solid}.verativo-cover strong{font-size:clamp(42px,5vw,80px);letter-spacing:-.07em}.verativo-cover span{font:13px 'Courier New',monospace;text-transform:uppercase}.about{background:#111;color:white;display:grid;grid-template-columns:1fr 2fr;gap:40px}.about-label{font:14px 'Courier New',monospace}.about h2{font-size:clamp(44px,5vw,78px);line-height:1.03;letter-spacing:-.055em;margin:0 0 30px;font-weight:900}.about p{max-width:720px;font-size:19px;line-height:1.5;color:#ddd}.disciplines{display:flex;flex-wrap:wrap;gap:15px;font:14px 'Courier New',monospace;margin-top:30px}.disciplines span{border-bottom:1px solid #777;padding-bottom:5px}.about-foot{font:22px 'Courier New',monospace;grid-column:1;grid-row:2;margin-top:-150px;transform:rotate(-7deg)}.contact{padding-top:100px;padding-bottom:130px}.contact>span{font:14px 'Courier New',monospace}.contact h2{font-size:clamp(46px,7.7vw,120px);line-height:1.01;letter-spacing:-.055em;margin:30px 0 50px;font-weight:900}.contact-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px}.contact-bottom p{font:16px/1.5 'Courier New',monospace}.pill{display:inline-block;font:14px 'Courier New',monospace;padding:13px 0;text-underline-offset:5px}.dark{font-size:20px;font-weight:bold}footer{border-top:1px solid;margin:0 3%;padding:20px 0 90px;display:flex;gap:25px;justify-content:space-between;font:13px 'Courier New',monospace}footer div{display:flex;gap:20px}dialog{width:min(1100px,95vw);max-height:94dvh;border:1px solid;padding:30px 4%;background:#fff;color:#111}dialog::backdrop{background:#000b}.close{position:sticky;top:0;float:right;padding:8px 12px;border:1px solid;background:white;z-index:2;font:14px 'Courier New',monospace}.detail-title{font-size:clamp(38px,6vw,78px);font-weight:900;letter-spacing:-.06em;line-height:1.03;margin:45px 0 15px}.detail-subtitle{font:14px 'Courier New',monospace}.detail-copy{max-width:740px;font-size:18px;line-height:1.6;margin:30px 0}.detail-gallery{display:grid;gap:20px;margin:35px 0}.detail-gallery img{width:100%;height:auto;display:block}.detail-verativo{padding:60px 10px;text-align:center;font-size:clamp(45px,9vw,110px);font-weight:900;letter-spacing:-.06em;border:1px solid}body.modal-open{overflow:hidden}#paint{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:20}.paint-tools{position:fixed;left:20px;bottom:18px;display:flex;align-items:center;gap:18px;padding:10px 14px;background:white;border:1px solid;z-index:30;font:13px 'Courier New',monospace}.paint-tools button{background:none;border:0;border-bottom:1px solid;padding:3px 0;font-size:13px}.paint-tools button[aria-pressed=false]{text-decoration:line-through}
@media(max-width:850px){.hero{min-height:540px}.hero h1{font-size:8vw}.hero-note{font-size:14px;bottom:40px}.hero-bottom{max-width:75%;flex-wrap:wrap}.projects{row-gap:65px;column-gap:5%}.project:nth-child(4n+2){grid-column:8/span 5;margin-top:100px}.project:nth-child(4n+3){grid-column:1/span 5}.project:nth-child(4n+4){grid-column:7/span 6;margin-top:80px}.about{grid-template-columns:1fr;gap:30px}.about-foot{grid-row:auto;grid-column:auto;margin:0}.about p{font-size:17px}.section-top p{display:none}.contact-bottom{align-items:start;flex-direction:column;gap:15px}.paint-status{display:none}.view-label{opacity:1}}
@media(max-width:520px){header{padding:17px 4%}.wordmark{font-size:24px}nav{font-size:13px;gap:16px}.hero{padding:24px 4% 65px;min-height:490px}.hero h1{font-size:10.5vw;line-height:1.04}.intro{font-size:21px;margin-top:25px;letter-spacing:-.04em}.intro br{display:none}.hero-bottom{margin-top:50px;max-width:100%;gap:25px}.hero-note{right:6%;bottom:18px;font-size:12px}.section{padding:40px 4% 70px}.filters{margin-bottom:40px;gap:16px}.filters button{font-size:13px}.projects{grid-template-columns:1fr;row-gap:45px}.project:nth-child(n){grid-column:1;margin-top:0;transform:none}.project:nth-child(2n){width:88%;justify-self:end}.project:nth-child(3n){width:90%}.project-meta h3{font-size:25px}.about{padding-top:60px}.about h2{font-size:44px}.contact{padding-top:60px;padding-bottom:90px}.contact h2{font-size:12vw}footer{flex-direction:column;gap:20px;padding-bottom:110px}.paint-tools{left:4%;bottom:14px;padding:9px 12px;gap:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media(min-width:851px){.hero{min-height:520px;padding-bottom:55px}.hero-bottom{margin-top:45px}.work{padding-top:20px}.filters{margin-bottom:40px}}

@media(hover:none){.project-image img{filter:grayscale(0)}}
.filter-count{font:13px 'Courier New',monospace;margin:0 0 30px}.projects.is-filtered .project:nth-child(n){grid-column:span 6;margin-top:0;transform:none}.filters{margin-bottom:25px}@media(max-width:520px){.projects.is-filtered .project:nth-child(n){grid-column:1;width:100%}}

/* Loose collage: intrinsic covers, varied widths, and small paper-like tilts. */
.projects{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:6%;row-gap:45px;align-items:start}
.projects .project:nth-child(n),.projects.is-filtered .project:nth-child(n){grid-column:auto;width:88%;margin-top:0;justify-self:start;transform:rotate(-2deg)}
.projects .project:nth-child(4n+2),.projects.is-filtered .project:nth-child(4n+2){width:94%;margin-top:85px;justify-self:end;transform:rotate(2deg)}
.projects .project:nth-child(4n+3),.projects.is-filtered .project:nth-child(4n+3){width:76%;margin-left:8%;transform:rotate(3deg)}
.projects .project:nth-child(4n+4),.projects.is-filtered .project:nth-child(4n+4){width:84%;margin-top:70px;justify-self:end;transform:rotate(-3deg)}
.projects .project:nth-child(n) .project-image{aspect-ratio:auto;overflow:visible;background:transparent}
.projects .project-image img{display:block;width:auto;height:auto;max-width:100%;max-height:560px;object-fit:contain;transform:none}
.project:hover img,.project:focus-visible img{transform:none}
.projects .verativo-cover{min-height:260px}
@media(max-width:520px){.projects{grid-template-columns:1fr;row-gap:38px}.projects .project:nth-child(n),.projects.is-filtered .project:nth-child(n){grid-column:1;margin-top:0;margin-left:0;width:92%;transform:rotate(-1.5deg)}.projects .project:nth-child(2n),.projects.is-filtered .project:nth-child(2n){width:84%;justify-self:end;transform:rotate(2deg)}}

/* Center the complete artwork inside balanced Polaroid borders. */
.projects .project:nth-child(n){padding:12px 12px 22px;background:#fff;border:1px solid #e8e8e8;box-shadow:0 5px 16px #00000012}
.projects .project:nth-child(n) .project-image{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:4/5;overflow:visible;background:#fff}
.projects .project-image img{display:block;width:100%;height:100%;max-width:100%;max-height:none;margin:0;object-fit:contain;object-position:center}
.projects .project-meta{padding-top:16px}
.projects .project p{margin-bottom:0}
.projects .verativo-cover{width:100%;height:100%;min-height:0}
@media(max-width:520px){.projects .project:nth-child(n){padding:10px 10px 20px}}

/* Let each Polaroid follow the artwork's proportions, with equal borders. */
.projects .project:nth-child(n){padding:14px}
.projects .project:nth-child(n) .project-image{display:block;aspect-ratio:auto;height:auto}
.projects .project-image img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.projects .project-meta{padding-top:14px}
.projects .verativo-cover{height:auto;min-height:260px}
@media(max-width:520px){.projects .project:nth-child(n){padding:14px}}

/* Balance each pair vertically without losing the collage tilts. */
.projects{align-items:center;row-gap:65px}
.projects .project:nth-child(n),.projects.is-filtered .project:nth-child(n){align-self:center;margin-top:0;margin-bottom:0}
@media(max-width:520px){.projects{row-gap:42px}}

.cw-case{margin-top:30px}.cw-case figure{margin:0}.cw-case img{display:block;width:100%;height:auto}.cw-hero figcaption,.cw-note{font:12px/1.5 'Courier New',monospace;color:#555;margin:12px 0 28px}.cw-panel{padding:48px 42px;margin:0 0 18px;background:#f7f5fb}.cw-label{display:block;font:12px/1.5 'Courier New',monospace;letter-spacing:.08em;text-transform:uppercase;margin-bottom:24px}.cw-case h3{font-size:clamp(30px,4.5vw,58px);letter-spacing:-.05em;line-height:1.05;margin:0 0 24px}.cw-case p{font-size:17px;line-height:1.65;max-width:700px;margin:0 0 20px}.cw-overview{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;background:#d4bfff}.cw-overview dl{margin:0}.cw-overview dt{font:12px 'Courier New',monospace;margin-bottom:8px;text-transform:uppercase}.cw-overview dd{margin:0 0 22px;font-size:16px;line-height:1.5}.cw-concept{background:linear-gradient(120deg,#212121,#2b244b);color:white}.cw-principles{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}.cw-principles span{padding:10px 14px;border:1px solid #ffffff60;font:12px 'Courier New',monospace}.cw-identity{background:#fff;border:1px solid #ddd}.cw-two-col{display:grid;grid-template-columns:1fr 1fr;gap:30px}.cw-color{background:#f4f4f4}.cw-swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:30px}.cw-swatch{display:block;aspect-ratio:1}.cw-swatches small{display:block;font:11px 'Courier New',monospace;margin-top:10px}.cw-neutrals{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:25px}.cw-neutrals span{padding:28px 12px;border:1px solid #ddd;font:11px 'Courier New',monospace}.cw-type{background:#212121;color:white}.cw-type-row{display:grid;grid-template-columns:100px 1fr;gap:25px;padding:24px 0;border-top:1px solid #ffffff40}.cw-type-row>span{font:12px 'Courier New',monospace}.cw-type-row strong{font-size:clamp(24px,3vw,38px);letter-spacing:-.04em}.cw-type-row p{font-size:14px;color:#ddd;margin:10px 0 0}.cw-type .cw-note{font-size:12px;color:#ccc;margin-top:20px}.cw-application{background:linear-gradient(115deg,#d4bfff,#e5f7ff)}.cw-guide{padding:38px 0 0}.cw-guide img{margin-top:30px;border:1px solid #eee}
@media(max-width:650px){.cw-panel{padding:30px 22px}.cw-overview,.cw-two-col{grid-template-columns:1fr;gap:20px}.cw-swatches{grid-template-columns:repeat(3,1fr)}.cw-type-row{grid-template-columns:65px 1fr;gap:15px}.cw-neutrals{grid-template-columns:1fr}.cw-case p{font-size:16px}}

.cw-device-scene{padding:55px 30px 35px;background:radial-gradient(ellipse at 70% 20%,#45ffcb44,transparent 60%),linear-gradient(125deg,#eae0ff,#f7e0ec);margin-bottom:22px!important}.cw-laptop{width:94%;margin:auto;perspective:1200px}.cw-laptop-screen{padding:10px 10px 14px;background:#212121;border-radius:16px 16px 4px 4px;box-shadow:0 20px 36px #38215b30}.cw-browser-bar{display:flex;align-items:center;gap:4px;background:#f3f3f3;padding:7px;border-radius:5px 5px 0 0}.cw-browser-bar i{height:5px;width:5px;border-radius:50%;background:#aaa}.cw-browser-bar span{margin:auto;font:8px 'Courier New',monospace;color:#555}.cw-laptop-base{height:17px;margin:0 -5%;background:linear-gradient(#d7d7df,#96969e);border-radius:2px 2px 50% 50%;box-shadow:0 18px 24px #30214330}.cw-device-scene figcaption{font:12px 'Courier New',monospace;margin-top:35px;color:#555;text-align:center}.cw-excerpt{display:block;width:100%;height:auto;background:white}.cw-moodboard{margin-top:32px!important}.cw-moodboard figcaption{font:11px 'Courier New',monospace;margin-top:12px;color:#ddd}.cw-logo-study{margin-top:20px}.cw-specimens{margin-top:30px}.cw-brand-mockups{background:#f0ebf8}.cw-card-scene{display:flex;align-items:center;justify-content:center;gap:0;min-height:290px;padding:35px 0}.cw-print-card{width:48%;aspect-ratio:1.65;box-shadow:0 16px 25px #38284b22;position:relative;display:flex;align-items:center;justify-content:center}.cw-card-front{background:white;transform:rotate(-7deg);z-index:1}.cw-card-front svg{width:28%;height:75%;background:white}.cw-card-back{background:linear-gradient(135deg,#d4bfff,#f13d8644,#32fdfa77);transform:rotate(8deg);padding:20px;flex-direction:column;align-items:start;gap:14px}.cw-card-back>span{font-size:clamp(12px,2.4vw,28px);font-weight:900;line-height:1.05;letter-spacing:-.04em}.cw-card-back small{font:10px 'Courier New',monospace}@media(max-width:650px){.cw-device-scene{padding:35px 12px 25px}.cw-laptop-screen{padding:6px;border-radius:10px 10px 3px 3px}.cw-card-scene{min-height:200px}.cw-card-back{padding:12px}.cw-card-back small{font-size:8px}}

.cw-animation-focus{margin-bottom:30px;padding:28px 0 0}.cw-animation-focus h3{font-size:clamp(45px,7vw,85px)}.cw-chess-stage{position:relative;width:100%;aspect-ratio:2.06;background:white;margin:30px 0 20px}.cw-chess-stage img,.cw-chess-stage canvas{width:100%;height:100%;display:block;object-fit:contain}.cw-chess-stage [hidden]{display:none}.cw-animation-controls{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:0 0 45px}.cw-animation-controls button{border:1px solid #212121;background:#212121;color:white;padding:12px 18px;font:13px 'Courier New',monospace}.cw-animation-controls span{font:12px/1.5 'Courier New',monospace;color:#555}.cw-animation-controls button:disabled{opacity:.6;cursor:wait}@media(max-width:650px){.cw-chess-stage{aspect-ratio:1.5}}

.about>div:first-child{grid-column:2}.about .about-foot{grid-column:1}@media(max-width:850px){.about>div:first-child,.about .about-foot{grid-column:1}}

/* A photographic cutout holds the lower edge of the About section. */
.about{position:relative;overflow:visible;grid-template-columns:1fr;padding-bottom:190px}
.about>.about-copy:first-child{grid-column:1;max-width:780px;width:76%}
.about .about-foot{grid-column:1;grid-row:auto;margin:10px 0 0;transform:rotate(-5deg)}
.about .about-portrait{position:absolute;right:3%;bottom:0;width:20%;padding:0;border:0;background:transparent;transform:translateY(14%);z-index:2;line-height:0;cursor:pointer;isolation:isolate}
.about-portrait img{display:block;width:100%;height:auto;pointer-events:none}
.about-portrait .portrait-facing{position:absolute;inset:0;opacity:0;transition:opacity .18s ease}
.about-portrait .portrait-away{transition:opacity .18s ease}
.about-portrait:hover .portrait-facing,.about-portrait:focus-visible .portrait-facing,.about-portrait.is-looking .portrait-facing{opacity:1}
.about-portrait:hover .portrait-away,.about-portrait:focus-visible .portrait-away,.about-portrait.is-looking .portrait-away{opacity:0}
.about-portrait:focus-visible{outline:2px dashed white;outline-offset:8px}
@media(max-width:850px){.about{padding-bottom:210px}.about>.about-copy:first-child{width:100%;max-width:700px}.about .about-portrait{width:25%;min-width:155px}}
@media(max-width:520px){.about{padding-bottom:240px}.about .about-portrait{width:36%;min-width:150px;right:4%}.about .about-foot{font-size:18px;max-width:45%;margin-top:25px}}
@media(prefers-reduced-motion:reduce){.about-portrait img{transition:none}}

/* Double the portrait while retaining its hand-to-edge alignment. */
.about .about-portrait{width:40%}
@media(min-width:851px){.about>.about-copy:first-child{max-width:55%;width:55%}.about{padding-bottom:240px}}
@media(max-width:850px){.about .about-portrait{width:50%;min-width:0}.about{padding-bottom:300px}}
@media(max-width:520px){.about .about-portrait{width:72%;min-width:0}.about{padding-bottom:340px}.about .about-foot{margin-bottom:80px}}

/* The section edge masks the torso; only the resting hand extends below it. */
.about-portrait img{clip-path:polygon(0 0,100% 0,100% 86%,18% 86%,18% 100%,0 100%)}

@media(min-width:1200px){.about>.about-copy:first-child{width:64%;max-width:1120px}.about .about-copy p{max-width:100%}}

.about-portrait img{clip-path:polygon(0 0,100% 0,100% 86%,23% 86%,22% 89%,20% 92%,17% 96%,13% 99%,8% 98%,0 98%)}
.about-portrait:focus-visible{outline:none}
.about-portrait:focus-visible img{filter:grayscale(1) drop-shadow(0 0 2px #ffffff80)}

/* Preserve the draped resting sleeve as well as the hand below the edge. */
.about-portrait img{clip-path:polygon(0 0,100% 0,100% 86%,44% 86%,43% 91%,40% 95%,27% 96%,20% 96%,16% 99%,8% 99%,0 99%)}

.about-portrait .portrait-away{clip-path:polygon(0 0,100% 0,100% 86%,38% 86%,38% 93%,33% 96%,20% 96%,16% 99%,8% 99%,0 99%)}
.about-portrait .portrait-facing{clip-path:polygon(0 0,100% 0,100% 86%,40.5% 86%,40.5% 91%,36% 95%,27% 96%,20% 96%,16% 99%,8% 99%,0 99%)}

/* Match the resting finger height between the two original poses. */
.about-portrait .portrait-away{transform:translateY(-1.6%);clip-path:polygon(0 0,100% 0,100% 87.6%,38% 87.6%,38% 94.6%,33% 97.6%,20% 97.6%,16% 100%,8% 100%,0 100%)}

/* Keep both About portrait poses in black and white. */
.about-portrait img{filter:grayscale(1)}
