/* Monochrome portfolio direction */
:root{color-scheme:light;--bg:#fafafa;--panel:#f0f0f0;--ink:#111;--muted:#6c6c6c;--line:#dedede;--accent:#111;--wrap:min(1280px,calc(100% - 112px));--sans:Arial,Helvetica,sans-serif;--display:Arial,Helvetica,sans-serif}
html{scroll-padding-top:90px}body{background:#fafafa;color:#111;font-family:var(--sans)}a{color:inherit}:focus-visible{outline:2px solid #555;outline-offset:5px}
.site-header{position:fixed;top:0;left:0;right:0;height:76px;background:rgba(250,250,250,.88);border-bottom:1px solid rgba(0,0,0,.07);backdrop-filter:blur(16px);padding:0 max(56px,calc((100vw - 1280px)/2));z-index:30}
.wordmark{color:#111}.wordmark-dot{color:#777}.wordmark-name{color:#444}.primary-nav a{color:#555;font-size:12px}.primary-nav a:hover,.primary-nav a[aria-current=page]{color:#000}.primary-nav .resume-link{color:#111;padding:0;border:0}.skip-link{background:#111;color:#fff}
.home-page{background:#fafafa}.home-page .intro-section{min-height:100svh;padding:120px 56px 155px;display:grid;place-items:center;position:relative}.intro-text{text-align:center;max-width:940px}.intro-text p{color:#707070;font-size:17px;margin:0 0 28px}.intro-text h1{font-size:clamp(42px,5.35vw,76px);line-height:1.08;letter-spacing:-.057em;font-weight:600;margin:0;color:#111;background:linear-gradient(110deg,#111 0%,#111 40%,#777 49%,#111 58%,#111 100%);background-size:280% 100%;background-position:100% 0;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:glimmer 9s ease-in-out infinite}
@keyframes glimmer{0%,22%{background-position:100% 0}58%,100%{background-position:0 0}}
.scroll-prompt{position:absolute;bottom:60px;left:50%;transform:translateX(-50%);display:block;width:44px;height:64px}.scroll-prompt span{display:block;width:1px;height:32px;margin:0 auto;background:#999;transform-origin:top;animation:breathe 2.8s ease-in-out infinite}@keyframes breathe{0%,100%{transform:scaleY(.55);opacity:.45}50%{transform:scaleY(1.5);opacity:.85}}
.work-section{padding:48px 0 130px}.work-heading{border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#777;font-size:10px;letter-spacing:.13em;padding:22px 0 66px}.work-heading p{margin:0}.work-list{display:grid;gap:150px}.work-item{scroll-margin-top:120px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:8%;align-items:center;min-width:0}.work-item:nth-child(even){grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}.work-item:nth-child(even) .work-copy{order:2}.work-copy{max-width:400px}.work-number{font-size:10px;letter-spacing:.13em;color:#777}.work-copy h2{font-size:clamp(34px,4vw,58px);line-height:1.04;letter-spacing:-.055em;font-weight:500;margin:22px 0}.work-copy p{font-size:15px;line-height:1.7;color:#686868}.work-link{display:inline-flex;align-items:center;gap:25px;margin-top:20px;font-size:12px;border-bottom:1px solid #888;padding-bottom:6px}.work-link:hover{border-color:#111}.work-visual{display:block;position:relative;background:#ededed;overflow:hidden;aspect-ratio:1.4}.work-visual img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) invert(1);transition:transform .7s cubic-bezier(.2,.7,.2,1)}.work-visual:hover img{transform:scale(1.035)}.work-caption{position:absolute;right:18px;bottom:13px;color:#6a6a6a;font-size:10px;letter-spacing:.08em}
.home-about{border-top:1px solid var(--line);padding:110px 0 140px;display:grid;grid-template-columns:1fr 2fr;gap:50px;scroll-margin-top:80px}.about-label{font-size:10px;letter-spacing:.14em;color:#777}.about-label span{display:block;margin-top:10px;color:#aaa}.about-content{display:grid;grid-template-columns:minmax(190px,.62fr) minmax(0,1.38fr);gap:clamp(28px,5vw,72px);align-items:start}.about-portrait{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 48%;border:1px solid #555;padding:5px;background:#fff}.about-copy h2{font-size:clamp(38px,5vw,72px);line-height:1.05;font-weight:500;letter-spacing:-.055em;margin:0 0 35px}.about-copy p{font-size:16px;line-height:1.8;color:#666;max-width:620px;margin:0 0 28px}.about-copy>a,.contact-inner>a{font-size:13px;display:inline-block;border-bottom:1px solid #999;padding-bottom:7px}.about-copy>a span,.contact-inner>a span{margin-left:25px}
.home-contact{border-top:1px solid var(--line);padding:140px 0;min-height:430px;display:grid;place-items:center;text-align:center;scroll-margin-top:80px}.contact-inner>p{font-size:10px;letter-spacing:.14em;color:#777}.contact-inner h2{font-size:clamp(42px,6vw,76px);letter-spacing:-.06em;line-height:1.04;font-weight:500;margin:22px 0 36px}.home-footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#777;font-size:11px;padding:24px 0 32px}
.section-rail{position:fixed;right:20px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-end;gap:7px;z-index:25}.section-rail a{width:36px;height:15px;display:flex;align-items:center;justify-content:flex-end}.section-rail a::after{content:"";width:12px;height:1px;background:#aaa;transition:width .2s,background .2s,height .2s}.section-rail a:hover::after,.section-rail a:focus-visible::after{width:21px;background:#333;height:2px}.section-rail a[aria-current="location"]::after{width:24px;background:#111;height:2px}
.js-motion .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}.js-motion .reveal.is-visible{opacity:1;transform:none}
body:not(.home-page) .site-footer{background:#f4f4f4;color:#111}body:not(.home-page) .footer-main h2{color:#111}body:not(.home-page) .contact-placeholders strong{color:#555}body:not(.home-page) .footer-meta{color:#777;border-color:#ddd}body:not(.home-page) .detail-hero{padding-top:130px}body:not(.home-page) .detail-body{background:#f5f5f5}body:not(.home-page) .detail-entry{border-color:#ddd}body:not(.home-page) .detail-entry h2,body:not(.home-page) .project-pagination strong{color:#111}body:not(.home-page) .detail-entry p,body:not(.home-page) .detail-aside,body:not(.home-page) .detail-summary{color:#666}body:not(.home-page) .detail-aside dt,body:not(.home-page) .eyebrow{color:#777}body:not(.home-page) .detail-cover{background:#eee;border-color:#ddd}body:not(.home-page) .detail-cover img{filter:grayscale(1) invert(1)}body:not(.home-page) .project-pagination{border-color:#ddd}body:not(.home-page) .project-pagination a>span,body:not(.home-page) .text-link span{color:#555}body:not(.home-page) .text-link{color:#111;border-color:#999}body:not(.home-page) .back-link{color:#666}body:not(.home-page) .photo-page{padding-top:125px}body:not(.home-page) .photo-empty-state{background:#f4f4f4;color:#666;border-color:#ddd}body:not(.home-page) .photo-card{background:#f4f4f4;border-color:#ddd}body:not(.home-page) .photo-card figcaption{color:#666}
.contact-page-main{min-height:calc(100svh - 100px);padding-top:180px;padding-bottom:100px}.contact-page-main .contact-kicker{font-size:11px;letter-spacing:.12em;color:#777;text-transform:uppercase}.contact-page-main h1{font-size:clamp(50px,8vw,110px);font-weight:500;line-height:1;letter-spacing:-.065em;margin:35px 0}.contact-page-main .contact-intro{font-size:16px;color:#666;line-height:1.7;max-width:520px}.contact-list{margin-top:80px;max-width:700px;border-top:1px solid #ddd}.contact-list p{margin:0;padding:19px 0;border-bottom:1px solid #ddd;display:flex;justify-content:space-between;gap:30px}.contact-list span{color:#777}.contact-list a{text-decoration:underline;text-underline-offset:4px}
@media(min-width:701px){html:has(.home-page){scrollbar-width:none}html:has(.home-page)::-webkit-scrollbar{width:0;height:0}}
@media(max-width:700px){:root{--wrap:calc(100% - 48px)}.site-header{height:68px;padding:0 24px}.wordmark-name{font-size:9px}.menu-toggle{border:0;background:none;color:#111}.menu-toggle span{background:#111}.primary-nav{background:#fafafa;border-color:#ddd}.primary-nav.is-open{display:flex}.primary-nav a{color:#111}.home-page .intro-section{padding:105px 30px 130px;min-height:100svh}.intro-text p{font-size:15px;margin-bottom:24px}.intro-text h1{font-size:clamp(39px,10vw,58px);line-height:1.08}.scroll-prompt{bottom:45px}.work-section{padding:30px 0 85px}.work-heading{padding:18px 0 40px}.work-list{gap:80px}.work-item,.work-item:nth-child(even){display:flex;flex-direction:column-reverse;align-items:stretch;gap:24px}.work-item:nth-child(even) .work-copy{order:0}.work-copy h2{font-size:36px;margin:14px 0}.work-copy p{font-size:14px}.work-visual{aspect-ratio:1.25}.home-about{grid-template-columns:1fr;gap:25px;padding:80px 0}.about-content{grid-template-columns:minmax(110px,.7fr) minmax(0,1.3fr);gap:20px;align-items:start}.about-portrait{padding:3px}.about-copy h2{font-size:clamp(30px,7vw,43px);margin-bottom:20px}.about-copy p{font-size:14px;line-height:1.7}.home-contact{min-height:360px;padding:100px 0}.section-rail{right:3px;gap:3px}.section-rail a{width:24px;height:14px}.section-rail a::after{width:8px}.section-rail a[aria-current="location"]::after{width:16px}body:not(.home-page) .detail-body{background:transparent}.contact-page-main{padding-top:140px}.contact-list p{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.intro-text h1,.scroll-prompt span{animation:none}.intro-text h1{background:none;-webkit-text-fill-color:currentColor}.js-motion .reveal{opacity:1;transform:none;transition:none}}

/* Keep inherited detail components consistent with the light theme. */
.about-portrait{border-width:1.2px}
@media(min-width:1100px){.home-about{grid-template-columns:.55fr 2.45fr;gap:44px}.about-content{grid-template-columns:232px minmax(0,620px);justify-content:space-between;gap:68px}}
.home-page #projects::before{display:none}
body:not(.home-page) .detail-aside dd{color:#555}
body:not(.home-page) .button-dark{background:#171717;color:#fff}
body:not(.home-page) .button-dark:hover{background:#444}

/* Reveal the fixed contact panel as the preceding content scrolls away. */
.contact-reveal{position:relative;height:min(570px,calc(100svh - 76px));min-height:390px;clip-path:inset(0);background:#151515;scroll-margin-top:76px}
.contact-reveal-panel{position:fixed;bottom:0;left:0;width:100%;height:min(570px,calc(100svh - 76px));min-height:390px;background:#151515;color:#f7f7f7}
.contact-reveal-content{height:100%;padding:clamp(48px,7vw,100px) 0 30px;display:grid;grid-template-columns:2fr 1fr;gap:40px;align-content:space-between}
.contact-reveal-heading>p,.contact-reveal-links>p{margin:0 0 25px;color:#a9a9a9;font-size:10px;letter-spacing:.14em}
.contact-reveal-heading h2{font-size:clamp(42px,6.3vw,86px);line-height:1.02;letter-spacing:-.06em;font-weight:500;margin:0 0 32px}
.contact-page-link{display:inline-block;border-bottom:1px solid #969696;padding-bottom:7px;font-size:13px}.contact-page-link span{margin-left:25px}
.contact-reveal-links{align-self:center;display:flex;flex-direction:column;gap:14px;font-size:13px}.contact-reveal-links>p{margin-bottom:5px}.contact-reveal-links a{width:max-content;border-bottom:1px solid #888;padding-bottom:5px}.contact-reveal-links span{color:#a9a9a9}
.contact-reveal-bottom{grid-column:1 / -1;border-top:1px solid #555;padding-top:22px;display:flex;justify-content:space-between;color:#aaa;font-size:11px}
.section-rail.on-dark a::after{background:#888}.section-rail.on-dark a:hover::after,.section-rail.on-dark a:focus-visible::after,.section-rail.on-dark a[aria-current="location"]::after{background:#fff}
@media(max-width:700px){.contact-reveal,.contact-reveal-panel{height:min(660px,calc(100svh - 68px));min-height:500px}.contact-reveal-content{padding:45px 0 24px;grid-template-columns:1fr;gap:20px}.contact-reveal-heading h2{font-size:clamp(43px,11vw,64px);margin:0 0 22px}.contact-reveal-links{align-self:start;gap:10px}.contact-reveal-bottom{grid-column:1}}
@media(max-height:570px){.contact-reveal,.contact-reveal-panel{height:auto;min-height:0}.contact-reveal{clip-path:none}.contact-reveal-panel{position:relative}.contact-reveal-content{min-height:430px}}


/* Photography has its own dark canvas while sharing the site navigation. */
body.photography-page{background:#090909;color:#f4f4f4}
body.photography-page .site-header{background:rgba(9,9,9,.92);border-color:#ffffff18}
body.photography-page .wordmark,body.photography-page .wordmark-name,body.photography-page .primary-nav a,body.photography-page .primary-nav .resume-link{color:#e9e9e9}
body.photography-page .wordmark-dot{color:#a9a9a9}
body.photography-page .primary-nav a:hover,body.photography-page .primary-nav a[aria-current=page]{color:#fff}
body.photography-page .photo-page-heading h1{color:#f4f4f4}
body.photography-page .photo-empty-state{background:#141414;color:#bdbdbd;border-color:#292929}
body.photography-page .photo-card{background:#141414;border-color:#292929}
body.photography-page .photo-card figcaption{color:#ccc}
body.photography-page .site-footer{background:#111;color:#f4f4f4}
body.photography-page .footer-main h2{color:#f4f4f4}
body.photography-page .contact-placeholders span{color:#aaa}
body.photography-page .contact-placeholders strong{color:#ddd;overflow-wrap:anywhere}
body.photography-page .footer-meta{border-color:#333;color:#aaa}
.contact-placeholders strong,.contact-list a{overflow-wrap:anywhere}
@media(max-width:700px){body.photography-page .menu-toggle span{background:#eee}body.photography-page .primary-nav{background:#121212;border-color:#333}}

@media(max-width:700px){body:not(.home-page) .contact-placeholders{grid-template-columns:1fr;gap:16px}body:not(.home-page) .contact-placeholders span{font-size:10px}body:not(.home-page) .contact-placeholders strong{font-size:12px}}
/* Preserve the report photograph on the swerve homepage card. */
.work-visual img[src^="/projects/differential-swerve/images/"]{filter:none;object-fit:contain;object-position:center;background:#e9e9e9}.work-item[data-section="Differential Swerve"] .work-caption{background:#ffffffeb;padding:5px 7px;color:#444}

/* The interactive introduction stays behind the copy and inside this section. */
.home-page .intro-section{isolation:isolate;overflow:hidden}
.intro-field{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;z-index:0}
.intro-text{position:relative;z-index:1}
.scroll-prompt{z-index:1}
@media(prefers-reduced-motion:reduce){.intro-field{display:none}}

/* Render the tennis placeholder in its original neutral tones at every size. */
.work-visual img[src="/assets/tennis-work-in-progress.svg"],body:not(.home-page) .detail-cover img[src="/assets/tennis-work-in-progress.svg"]{filter:none;object-fit:contain;background:#eee}

/* Bring the supplied CAD model forward while keeping its original background. */
.work-visual img[src="/projects/robotic-hand/robotic-hand-render.png"]{filter:none;object-fit:cover;object-position:50% 53%;transform:scale(2.05);background:#2e333e}
.work-visual:hover img[src="/projects/robotic-hand/robotic-hand-render.png"]{transform:scale(2.13)}
body:not(.home-page) .detail-cover img[src="/projects/robotic-hand/robotic-hand-render.png"]{filter:none;object-fit:cover;object-position:50% 53%;transform:scale(1.7);background:#2e333e}

/* Justified photography rows follow the images' natural aspect ratios. */
body.photography-page .photo-page{max-width:1320px;padding-bottom:108px}
body.photography-page .photo-page-heading{padding:74px 0 34px}
body.photography-page .photo-page-heading h1{font-size:clamp(52px,7vw,88px);letter-spacing:-.055em}
body.photography-page .photo-page-intro{margin:14px 0 0;color:#aaa;font-size:14px;line-height:1.6}
body.photography-page .photography-grid{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px;isolation:isolate}
body.photography-page .photo-empty-state{width:100%}
body.photography-page .photo-card{flex:none;position:relative;margin:0;border:0;background:#222;z-index:0;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,filter .35s}
body.photography-page .photo-card button{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;text-align:left}
body.photography-page .photo-card img{height:100%;aspect-ratio:auto;object-fit:cover;filter:grayscale(1);opacity:.94;transform-origin:var(--photo-position,50% 50%);transform:scale(var(--photo-zoom,1));transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .3s}
body.photography-page .photo-card-label{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;align-items:end;gap:12px;padding:45px 16px 15px;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff;opacity:0;transform:translateY(7px);transition:opacity .25s,transform .25s}
body.photography-page .photo-card-label strong{font:500 16px/1.15 var(--display)}
body.photography-page .photo-card-label small{font:9px/1.3 var(--mono);white-space:nowrap}
body.photography-page .photo-card:hover,body.photography-page .photo-card:focus-within{z-index:3;transform:scale(1.035);box-shadow:0 20px 44px #000b}
body.photography-page .photo-card:hover img,body.photography-page .photo-card:focus-within img{transform:scale(calc(var(--photo-zoom,1) * 1.025));opacity:1}
body.photography-page .photo-card:hover .photo-card-label,body.photography-page .photo-card:focus-within .photo-card-label{opacity:1;transform:none}
body.photography-page .photo-card button:focus-visible{outline:2px solid #fff;outline-offset:-2px}
body.photography-page .photography-grid:has(.photo-card:hover) .photo-card:not(:hover){filter:brightness(.78)}
body.photography-page .photo-lightbox{width:min(1050px,calc(100% - 28px));max-height:94vh;background:#151515;border:1px solid #3a3a3a;padding:18px;color:#f4f4f4}
body.photography-page .photo-lightbox img{max-height:calc(94vh - 125px);filter:grayscale(1)}
body.photography-page .photo-lightbox-info{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:16px 5px 2px}
body.photography-page .photo-lightbox-title{font:500 20px/1.2 var(--display);margin:0 0 4px}
body.photography-page .photo-lightbox-description{font:12px/1.5 var(--body);color:#bdbdbd;margin:0}
body.photography-page .photo-lightbox-source{color:#bbb;font:10px var(--mono);white-space:nowrap;border-bottom:1px solid #666;padding-bottom:3px}
body.photography-page .photo-lightbox-source[hidden]{display:none}
@media(max-width:800px){body.photography-page .photo-card-label{opacity:1;transform:none;padding:40px 12px 11px}}
@media(max-width:480px){body.photography-page .photo-page-heading{padding:56px 0 27px}body.photography-page .photography-grid{gap:5px}body.photography-page .photo-card-label strong{font-size:13px}body.photography-page .photo-card-label small{display:none}body.photography-page .photo-lightbox-info{display:block}body.photography-page .photo-lightbox-source{display:inline-block;margin-top:12px}}
@media(prefers-reduced-motion:reduce){body.photography-page .photo-card,body.photography-page .photo-card img,body.photography-page .photo-card-label{transition:none}}