*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#faf9f6;color:#20201e;font:16px/1.5 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #444;outline-offset:6px}header,main,footer{max-width:1500px;margin:auto;padding:0 5vw}header{display:flex;justify-content:space-between;align-items:start;padding-top:40px;padding-bottom:40px}.name{font-size:20px;letter-spacing:-.6px}.role{font-size:12px;color:#6d6b65;margin-top:3px}nav{display:flex;gap:28px;font-size:14px}nav a:hover{text-decoration:underline;text-underline-offset:5px}.intro{padding:64px 0 56px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:1.8px;color:#6d6b65}h1{font-size:clamp(40px,5.8vw,82px);line-height:1.06;letter-spacing:-.055em;font-weight:400;margin:18px 0 24px}.intro p{color:#6d6b65;max-width:470px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:55px 26px}.tile img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#e9e6e0;transition:filter .25s}.tile:hover img{filter:brightness(.92)}.caption{display:flex;justify-content:space-between;gap:20px;margin-top:15px}.caption strong{font-size:16px;font-weight:400}.caption span{font-size:12px;color:#77756f}.tile:last-child{grid-column:1/-1;max-width:900px;width:100%}footer{margin-top:100px;padding-top:30px;padding-bottom:36px;border-top:1px solid #dedbd4;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#6d6b65}.project-head{padding:55px 0 40px;max-width:950px}.project-head h1{font-size:clamp(40px,5.4vw,74px)}.copy{font-size:18px;line-height:1.7;max-width:720px;margin:32px 0 0}.copy strong{font-weight:400}.copy p:empty{display:none}.media{margin:20px 0 65px}.media iframe{width:100%;aspect-ratio:16/9;border:0;background:#181818;display:block}.media figcaption{font-size:13px;margin-top:12px;color:#6d6b65}.brand-image{display:block;max-width:700px;width:100%;max-height:340px;object-fit:contain;margin:40px auto 65px}.next{padding:40px 0;border-top:1px solid #dedbd4;display:flex;justify-content:space-between;font-size:22px}.back{font-size:13px;color:#6d6b65}.about{max-width:760px;padding-top:60px}.about p{font-size:22px;line-height:1.6}@media(max-width:650px){header{padding-top:25px}nav{gap:16px}.role{font-size:11px}.intro{padding-top:35px}.grid{grid-template-columns:1fr;gap:35px}.tile:last-child{grid-column:auto}.caption{display:block}.caption span{display:block;margin-top:3px}.project-head{padding-top:28px}.copy{font-size:16px}.media{margin-bottom:35px}footer{margin-top:65px;flex-wrap:wrap}.next{font-size:18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.tile img{transition:none}}
/* Gallery project reveal */
.grid{padding-top:28px}
.thumbnail{position:relative;overflow:hidden;isolation:isolate}
.thumbnail .pixel-layer{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;opacity:0;transition:opacity .18s ease;pointer-events:none}
.thumbnail::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.48);opacity:0;transition:opacity .18s ease;pointer-events:none}
.hover-title{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;padding:28px;text-align:center;color:#fff;font-size:clamp(26px,3.5vw,54px);line-height:1.08;letter-spacing:-.04em;opacity:0;transition:opacity .18s ease;pointer-events:none}
.tile:hover img{filter:none}
.tile:focus-visible .pixel-layer,.tile:focus-visible .hover-title,.tile:focus-visible .thumbnail::after{opacity:1}
@media(hover:hover) and (pointer:fine){.tile:hover .pixel-layer,.tile:hover .hover-title,.tile:hover .thumbnail::after{opacity:1}}
@media(prefers-reduced-motion:reduce){.thumbnail .pixel-layer,.thumbnail::after,.hover-title{transition:none}}
/* Complete portfolio */
.tile:last-child{grid-column:auto;max-width:none}.project-content{max-width:1100px;margin:auto}.project-copy{max-width:740px;margin:32px auto 50px;font-size:18px;line-height:1.7}.project-copy a{text-decoration:underline;text-underline-offset:3px}.project-copy p:empty{display:none}.project-image{margin:35px 0 55px}.project-image img{display:block;width:100%;height:auto;max-height:950px;object-fit:contain}.project-content .media{margin-left:0;margin-right:0}.section-heading{font-size:22px;font-weight:400;line-height:1.3;margin:38px auto 20px;max-width:740px}.portrait{max-width:440px;margin-left:auto!important;margin-right:auto!important}.about-full{max-width:1000px;margin:50px auto}.about-full .project-copy{max-width:740px}.about-full .project-image{max-width:650px;margin:30px auto 60px}.about-full h1,.about-full h2{font-weight:400;letter-spacing:-.03em}.about-full h1{font-size:48px}.about-full h2{font-size:28px;margin-top:50px}@media(max-width:650px){.project-copy{font-size:16px;margin:25px 0 36px}.project-image{margin:25px 0 35px}.about-full{margin-top:25px}.hover-title{font-size:30px}}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url('assets/instrument-serif-regular.ttf') format('truetype')}
.hover-title{font-family:'Instrument Serif',Georgia,serif;font-weight:400}
/* Consistent project introductions */
.project-head{padding:45px 0 0;margin-bottom:36px;max-width:1100px}
.project-head h1{margin:24px 0 0;text-transform:uppercase}
.project-description{max-width:740px;margin-top:24px;font-size:18px;line-height:1.7}
.project-description p{margin:0 0 16px}
.project-description p:last-child{margin-bottom:0}
.project-content>.project-copy:first-child,.project-content>.project-image:first-child,.project-content>.media:first-child,main>.project-head+figure.media{margin-top:0}
@media(max-width:650px){.project-head{padding-top:28px;margin-bottom:28px}.project-description{font-size:16px;margin-top:20px}}
/* Campaigns within grouped client projects */
.campaign-section{max-width:1100px;margin:64px auto 0;padding-top:32px;border-top:1px solid #dedbd4;scroll-margin-top:28px}
.campaign-heading{font-size:clamp(24px,3vw,36px);line-height:1.2;letter-spacing:-.03em;font-weight:400;margin:0 0 28px}
.campaign-description{max-width:740px;font-size:18px;line-height:1.7;margin:0 0 32px}.campaign-description p{margin:0 0 16px}
.campaign-section>.media,.campaign-section>.project-image{margin-left:0;margin-right:0}.campaign-section>.media:last-child,.campaign-section>.project-image:last-child{margin-bottom:0}
@media(max-width:650px){.campaign-section{margin-top:44px;padding-top:24px}.campaign-description{font-size:16px}}
.campaign-image-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:32px 0}.campaign-image-grid .project-image{margin:0}.campaign-image-grid img{width:100%;height:auto;object-fit:contain}@media(max-width:650px){.campaign-image-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.campaign-image-grid .project-image:last-child{grid-column:1/-1;max-width:70%;margin:auto}}
/* Writer’s mark identity */
.writer-identity{display:block;flex-shrink:0;max-width:100%;color:inherit;text-decoration:none}
.identity-name{display:block;font-family:Arial,Helvetica,sans-serif;font-size:24px;font-weight:500;line-height:1;letter-spacing:-.065em;white-space:nowrap}
.identity-cursor{display:inline-block;width:.4em;height:.065em;background:currentColor;margin-left:.15em;vertical-align:-.06em}
.identity-role{display:flex;align-items:center;gap:0;margin-top:8px;font-family:'Courier New',monospace;font-size:11px;line-height:1.5;letter-spacing:-.035em}
.identity-role::before{content:'/';font-size:16px;margin-right:8px}
@media(max-width:520px){.identity-name{font-size:23px}.identity-role{display:block;position:relative;padding-left:13px;font-size:10px;margin-top:8px}.identity-role::before{position:absolute;left:0;top:0;margin:0}.identity-role>span{display:block}.identity-role>span+span{font-size:0}.identity-role>span+span::after{content:'Writer';font-size:10px}header nav{gap:18px}}
.quesalupa-image-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:1000px;margin:36px auto 55px}.quesalupa-image-grid .project-image{margin:0}.quesalupa-image-grid img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}@media(max-width:480px){.quesalupa-image-grid{gap:12px;margin:25px 0 35px}}
