:root{--background:#fff;--text:#000;--muted:#686868;--accent:#3765f6;--gutter:clamp(24px,2.5vw,64px);--gap:clamp(24px,2.5vw,56px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--background);color:var(--text);font-family:Figtree,Arial,sans-serif;font-weight:500;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:3px}.skip-link{position:fixed;top:8px;left:8px;z-index:10;transform:translateY(-160%);background:white;padding:12px}.skip-link:focus{transform:none}.header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;padding:28px var(--gutter)}.wordmark{font:25px/1 SPvixel,monospace;white-space:nowrap;width:fit-content;padding:10px 0}.navigation{display:flex;background:#f3f3f3;border-radius:50px;padding:5px;gap:3px}.navigation a{padding:12px 19px;border-radius:30px;font-size:15px;transition:background .18s}.navigation a:hover{background:#e6e6e6}.contact-button{justify-self:end;background:var(--accent);color:#fff;border-radius:50px;padding:16px 23px;display:flex;gap:28px;align-items:center;font-size:15px}.contact-button:hover{background:#2854e4}.intro{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);padding:72px var(--gutter) 84px;align-items:end}.portrait{width:80px;height:80px;object-fit:cover;object-position:50% 35%;border-radius:50%;display:block;margin-bottom:28px}h1,.section-title{margin:0;font-size:clamp(30px,3.15vw,76px);font-weight:600;letter-spacing:-.045em;line-height:1.14}h1>span{display:block}h1 .hello{margin-bottom:8px}h1 em{font-family:SPvixel,monospace;font-style:normal;font-weight:400;letter-spacing:-.045em;color:var(--accent);white-space:nowrap}.intro-copy{max-width:650px;padding:0 0 3px 5%;scroll-margin-top:60px}.intro-copy p{font-size:clamp(17px,1.45vw,26px);line-height:1.52;letter-spacing:-.018em;margin:0}.work{padding:0 var(--gutter)}.projects{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--gap);row-gap:64px}.project{min-width:0}.project-image{position:relative;aspect-ratio:1.55;overflow:hidden;border-radius:12px;background:#f0f0f0}.project-image img{width:100%;height:100%;display:block;object-fit:cover}.project-info{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-top:21px}h2{font-size:clamp(24px,2vw,38px);font-weight:600;line-height:1.15;letter-spacing:-.035em;margin:0}.client{margin:7px 0 0;color:var(--muted);font-size:16px;line-height:1.4}.year{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}.tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:16px 0 0}.tags li{font-size:12px;line-height:1.2;border:1px solid #b3b3b3;border-radius:30px;padding:6px 11px}.confidential .project-image img{filter:brightness(.72)}.locked{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;color:#fff;font-size:17px}.confidential .project-image{user-select:none}footer{margin:90px var(--gutter) 0;padding:27px 0 30px;border-top:1px solid #dedede;display:flex;gap:28px;align-items:center;flex-wrap:wrap;font-size:14px}footer a{padding:8px 0}footer a:hover{text-decoration:underline;text-underline-offset:4px}.footer-note{margin-left:auto;color:var(--muted);font-size:12px}
@media(min-width:1800px){.intro{padding-top:100px;padding-bottom:110px}.portrait{width:96px;height:96px}.intro-copy{max-width:800px}.projects{row-gap:80px}}
@media(max-width:1050px) and (min-width:741px){.header{gap:14px}.wordmark{font-size:20px}.navigation a{padding:12px 11px;font-size:14px}.contact-button{padding:14px 17px;gap:12px}.intro{padding-top:55px;padding-bottom:60px}.intro-copy{padding-left:0}.intro-copy p{font-size:16px}h1,.section-title{font-size:clamp(25px,3.15vw,36px)}}
@media(max-width:740px){:root{--gutter:20px;--gap:24px}.header{grid-template-columns:1fr auto;padding-top:20px;gap:24px 12px}.wordmark{font-size:22px}.contact-button{padding:13px 16px;font-size:13px;gap:12px}.navigation{grid-column:1/-1;grid-row:2;justify-self:center;max-width:100%;gap:0}.navigation a{font-size:14px;padding:11px 20px}.intro{grid-template-columns:1fr;padding-top:37px;padding-bottom:48px;gap:26px}.portrait{width:64px;height:64px;margin-bottom:24px}h1,.section-title{font-size:clamp(28px,6.6vw,48px);line-height:1.18;letter-spacing:-.04em}.intro-copy{padding:0;max-width:560px}.intro-copy p{font-size:17px;line-height:1.55}.projects{grid-template-columns:minmax(0,1fr);row-gap:40px}.project-image{aspect-ratio:1.3;border-radius:9px}.project-info{margin-top:17px}h2{font-size:27px}.client{font-size:15px}.tags{margin-top:13px}.tags li{font-size:11px}.locked{font-size:15px}footer{margin-top:55px;gap:12px 28px;align-items:flex-start;flex-direction:column}.footer-note{margin-left:0;margin-top:10px}}
@media(max-width:360px){.navigation a{padding:11px 15px}.wordmark{font-size:19px}.contact-button{gap:7px;padding:12px}.intro-copy p{font-size:16px}h1,.section-title{font-size:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media(max-width:360px){.navigation{width:100%;justify-content:space-between}.navigation a{padding:11px 10px;font-size:13px}}
/* Refined header and a viewport-sized, quiet introduction. */
:root{--header-height:80px}
.header{padding:20px var(--gutter);gap:20px}
.wordmark{font-family:SPvixel,Figtree,sans-serif;font-size:15px;font-weight:400;line-height:1.2;padding:12px 0}
.navigation{padding:3px;gap:2px}
.navigation a{font-size:13px;padding:10px 16px;line-height:18px}
.contact-button{font-size:13px;line-height:18px;padding:12px 18px;gap:18px}
.intro{min-height:calc(100vh - var(--header-height));min-height:calc(100svh - var(--header-height));padding:72px var(--gutter) 96px;align-content:center;align-items:end}
.portrait{width:144px;height:144px;object-position:50% 30%;margin-bottom:38px}
h1 em{font-family:SPvixel,Figtree,sans-serif}
.intro-copy{max-width:520px;padding:0 0 4px 0;justify-self:center;width:100%}
.intro-copy p{font-size:clamp(15px,1.13vw,19px);line-height:1.65;letter-spacing:-.01em}
h2{font-size:clamp(20px,1.55vw,28px);font-weight:500;letter-spacing:-.025em}
.client{font-size:14px;margin-top:6px}.project-info{margin-top:18px}
.project.reveal-pending{opacity:0;transform:translateY(16px)}
.project.reveal-ready{transition:opacity .7s ease,transform .7s cubic-bezier(.2,.65,.3,1)}
.project.reveal-visible{opacity:1;transform:none}
@media(min-width:1800px){.intro{padding-top:90px;padding-bottom:110px}.portrait{width:160px;height:160px}.intro-copy{max-width:610px}}
@media(max-width:1050px) and (min-width:741px){.header{gap:12px}.wordmark{font-size:14px}.navigation a{padding:10px 12px}.contact-button{padding:12px 15px;gap:12px}.portrait{width:128px;height:128px}.intro-copy{padding-left:20px}.intro-copy p{font-size:15px}}
@media(max-width:740px){:root{--header-height:124px}.header{padding:16px var(--gutter);gap:12px}.wordmark{font-size:14px}.contact-button{padding:10px 14px;font-size:12px;gap:12px}.navigation{padding:3px}.navigation a{font-size:12px;padding:10px 17px}.intro{padding:48px var(--gutter) 64px;gap:32px;align-items:start}.portrait{width:112px;height:112px;margin-bottom:28px}.intro-copy{padding:0;max-width:560px;justify-self:start}.intro-copy p{font-size:15px;line-height:1.65}h2{font-size:22px;font-weight:500}.client{font-size:14px}}
@media(max-width:360px){.wordmark{font-size:13px}.navigation a{padding:10px 12px;font-size:12px}.contact-button{font-size:12px;padding:10px 12px;gap:8px}.intro-copy p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.project.reveal-pending{opacity:1;transform:none}.project.reveal-ready{transition:none}}

/* Keep navigation available without changing the introduction geometry. */
.header{position:sticky;top:0;z-index:20;background:#fff}
html{scroll-padding-top:calc(var(--header-height) + 24px)}
.skip-link{z-index:30}
.project:focus-within{opacity:1!important;transform:none!important}

/* Motion language: quick entrance, pixel wave, quiet interactive details. */
.header{background:#fff}
.wordmark .typed-letter{display:inline-block;white-space:pre}
h1 em{display:inline-block}
.pixel-letter{display:inline-block;transition:transform .22s cubic-bezier(.2,.8,.2,1),color .22s;white-space:pre}
.project.reveal-ready{transition:opacity .8s ease;transform:none}
.project.reveal-pending{transform:none}
.project.reveal-ready .project-image{transition:transform .9s cubic-bezier(.16,1,.3,1)}
.project.reveal-pending .project-image{transform:translateY(var(--reveal-offset,36px)) scale(.98)}
.project.reveal-ready .project-info,.project.reveal-ready .tags{transition:opacity .7s ease .1s,transform .8s cubic-bezier(.16,1,.3,1) .08s}
.project.reveal-pending .project-info,.project.reveal-pending .tags{opacity:0;transform:translateY(16px)}
.project.reveal-visible .project-image,.project.reveal-visible .project-info,.project.reveal-visible .tags{transform:none;opacity:1}
.navigation a{position:relative;transition:background .25s,color .25s,transform .25s}
.navigation a:hover,.navigation a:focus-visible{background:rgba(255,255,255,.8);color:var(--text);transform:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.035)}
.contact-button{position:relative;overflow:hidden;isolation:isolate;transition:background .25s,box-shadow .25s}
.contact-button::before{content:'';position:absolute;z-index:-1;left:var(--mx,50%);top:var(--my,50%);width:180px;height:180px;border-radius:50%;background:#193fc4;transform:translate(-50%,-50%) scale(0);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.contact-button:hover::before,.contact-button:focus-visible::before{transform:translate(-50%,-50%) scale(1)}
footer a{position:relative;text-decoration:none!important}
footer a::after{content:'';position:absolute;left:0;right:0;bottom:3px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s ease}
footer a:hover::after,footer a:focus-visible::after{transform:scaleX(1);transform-origin:left}
.tags li{transition:background .25s,color .25s,border-color .25s,transform .25s;cursor:default}
@media(hover:hover) and (pointer:fine){.tags li:hover{background:#171b25;color:#fff;border-color:#171b25;transform:translateY(-3px)}.project:not(.confidential) .project-image img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}.project:not(.confidential) .project-image:hover img{transform:scale(1.018)}}
@media(prefers-reduced-motion:reduce){.pixel-letter,.project.reveal-ready .project-image,.project.reveal-ready .project-info,.project.reveal-ready .tags{transition:none!important;transform:none!important;opacity:1!important}.navigation a:hover,.tags li:hover,.project .project-image:hover img{transform:none!important}}

/* Full-width work and an editorial two-column biography. */
.navigation{padding:5px;border-radius:999px;gap:2px}
.navigation a{border-radius:999px}
.projects{grid-template-columns:minmax(0,1fr);row-gap:clamp(56px,6vw,112px)}
.project-image{aspect-ratio:16/9;border-radius:2px}
.content-section{--section-top-space:clamp(100px,10vw,192px);padding:var(--section-top-space) var(--gutter) 0}
.section-title{margin:0 0 clamp(40px,4vw,72px)}
.pixel-accent{display:inline-block;font-family:SPvixel,Figtree,sans-serif;font-style:normal;font-weight:400;letter-spacing:-.045em;color:var(--accent);white-space:nowrap}
.about-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap)}
.about-copy p{max-width:65ch;font-size:clamp(16px,1.25vw,21px);line-height:1.65;letter-spacing:-.01em;margin:0}
.career-table{border-collapse:collapse;width:100%;table-layout:fixed;text-align:left;font-size:clamp(14px,1.13vw,19px);line-height:1.4}
.career-table th,.career-table td{padding:14px 0;vertical-align:top;border-bottom:1px solid #e5e5e5;font-weight:500}
.career-table thead th{color:var(--muted);font-size:12px;padding:0 0 15px}
.career-table th:first-child{width:58%;padding-right:32px}
.career-table th:nth-child(2){width:18%}
.career-table th:last-child,.career-table td:last-child{text-align:right;white-space:nowrap}
.career-table tbody th span{display:block;color:var(--muted);font-size:.9em;margin-top:4px}
.career-table tbody tr:last-child>*{border-bottom:0}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.motion-block.reveal-ready{transition:opacity .8s ease,transform .9s cubic-bezier(.16,1,.3,1)}
.motion-block.reveal-pending{opacity:0;transform:translateY(var(--reveal-offset,28px))}
.motion-block.reveal-visible{opacity:1;transform:none}
@media(max-width:740px){
.project-image{aspect-ratio:1.3}
.content-section{--section-top-space:96px;padding-top:var(--section-top-space)}
.section-title{margin-bottom:28px}
.about-copy{grid-template-columns:minmax(0,1fr);gap:24px}
.about-copy p{font-size:16px;line-height:1.65}
.career-table{font-size:15px;display:block}
.career-table colgroup{display:none}
.career-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.career-table tbody,.career-table tr{display:block}
.career-table tbody tr{display:grid;grid-template-columns:1fr auto;gap:8px 12px;padding:14px 0;border-bottom:1px solid #e5e5e5}
.career-table tbody tr:last-child{border:0}
.career-table tbody th:first-child{grid-column:1/-1;width:auto;padding:0;border:0}
.career-table tbody td{padding:0;border:0;color:var(--muted);font-size:12px}
.career-table tbody th span{font-size:14px;margin-top:3px}
}
@media(prefers-reduced-motion:reduce){.motion-block.reveal-pending{opacity:1;transform:none}.motion-block.reveal-ready{transition:none}}

/* Tighter rhythm for the compact career overview. */
.experience .section-title{margin-bottom:28px}

/* Shared reading size and aligned text columns across the landing page. */
:root{--body-size:16px;--label-size:13px;--body-leading:1.65}
body{font-size:var(--body-size)}
.intro,.about-copy{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--gap)}
.intro-copy{max-width:none;width:100%;padding:0;justify-self:stretch}
.intro-copy p,.about-copy p{max-width:none;font-size:var(--body-size);line-height:var(--body-leading);letter-spacing:-.01em;margin:0}
.client,.year,.locked,footer,.footer-note,.career-table,.career-table tbody th span,.career-table tbody td{font-size:var(--body-size)}
.navigation a,.contact-button,.tags li{font-size:var(--label-size)}
@media(max-width:740px){.intro,.about-copy{grid-template-columns:minmax(0,1fr)}}

/* Approach: a compact, image-led composition and a quiet reference layer. */
:root{--accent-green:#70fc8f;--card-surface:#f3f3f3}
.approach-grid{display:grid;grid-template-columns:1.05fr 1fr 1fr;gap:16px;align-items:stretch}
.approach-card{background:var(--card-surface);border-radius:18px;padding:30px;min-width:0;overflow:hidden}
.approach-card h3{font-size:clamp(24px,2.1vw,34px);line-height:1.12;letter-spacing:-.035em;font-weight:600;margin:0 0 18px}
.approach-card p{font-size:var(--body-size);line-height:1.55;margin:0}
.approach-card .card-kicker{font-size:var(--label-size);font-weight:500;line-height:1.4;letter-spacing:0;margin:0 0 24px;color:#525252}
.approach-motto{grid-row:span 2;padding:0;display:flex;flex-direction:column}
.approach-portrait{display:block;width:100%;height:clamp(230px,23vw,340px);object-fit:cover;object-position:50% 30%;filter:grayscale(1)}
.card-copy{padding:30px}
.approach-ownership{display:flex;flex-direction:column;justify-content:space-between}
.approach-ownership h3{margin-top:8px}
.approach-recognition{display:flex;flex-direction:column}
.award-logos{display:flex;flex:1;flex-direction:column;gap:28px;align-items:center;justify-content:center;padding:0 8px 6px}
.award-logos img{display:block;width:auto;max-width:100%;height:76px;object-fit:contain}
.award-logos img:first-child{height:100px}
.approach-collaboration{grid-column:2/4;background:var(--accent-green);display:flex;align-items:flex-end;gap:36px;justify-content:space-between}
.approach-collaboration>div{max-width:44ch}
.approach-collaboration .card-kicker{color:#253d2a}
.arcaiv-mark{width:clamp(110px,12vw,180px);height:auto;object-fit:contain;flex-shrink:0;margin-bottom:5px}
.capabilities{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap);margin-top:56px}
.capability-block h3{font-size:var(--body-size);font-weight:600;margin:0 0 22px}
.skill-list{margin:0;display:grid;gap:15px}
.skill-list>div{display:grid;grid-template-columns:minmax(135px,.8fr) minmax(0,1.8fr);gap:20px}
.skill-list dt,.skill-list dd{font-size:var(--body-size);line-height:1.5;margin:0;font-weight:500}
.skill-list dd{color:var(--muted)}
.clients{padding-top:clamp(80px,8vw,140px);overflow:hidden}
.client-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}
.client-heading h2{font-size:var(--body-size);font-weight:600;letter-spacing:0}
.client-context{font-size:var(--label-size);color:var(--muted);margin:8px 0 30px;line-height:1.5}
.marquee-toggle{font:500 var(--label-size)/1.4 Figtree,Arial,sans-serif;color:var(--muted);background:none;border:0;padding:10px 0;min-width:56px;text-align:right;cursor:pointer}
.marquee-toggle:hover{color:#000}
.marquee-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.client-marquee{overflow:hidden;margin:0 calc(-1 * var(--gutter));padding:18px 0 8px}
.client-track{display:flex;width:max-content}
.client-group{list-style:none;display:flex;align-items:center;justify-content:space-around;flex-shrink:0;gap:clamp(40px,5vw,100px);min-width:100vw;margin:0;padding:0 clamp(40px,5vw,100px) 0 0}
.client-logo{width:180px;height:76px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.client-logo img{object-fit:contain;max-width:100%;filter:grayscale(1) brightness(0);display:block}
.bundeswehr-logo{gap:10px}
.client-marquee:not(.is-ready) .client-track{width:100%}
.client-marquee:not(.is-ready) .client-group{min-width:0;width:100%;flex-wrap:wrap;gap:28px;padding:0 var(--gutter)}
@media(max-width:1100px) and (min-width:741px){.approach-card{padding:24px}.approach-motto{padding:0}.card-copy{padding:24px}.approach-collaboration{align-items:flex-start;flex-direction:column;gap:24px}.skill-list>div{grid-template-columns:1fr;gap:3px}}
@media(max-width:740px){
.approach-grid{grid-template-columns:minmax(0,1fr);gap:14px}
.approach-card{padding:26px;border-radius:14px}
.approach-motto{grid-row:auto;padding:0}
.approach-portrait{height:300px;object-position:50% 25%}
.card-copy{padding:26px}
.approach-card h3{font-size:28px}
.approach-card .card-kicker{margin-bottom:18px}
.approach-collaboration{grid-column:auto;flex-direction:column;align-items:flex-start;gap:28px}
.arcaiv-mark{width:150px}
.award-logos{flex-direction:row;gap:28px;padding:10px 0}
.award-logos img,.award-logos img:first-child{width:calc(50% - 14px);height:auto;max-height:95px}
.capabilities{grid-template-columns:minmax(0,1fr);gap:36px;margin-top:36px}
.capability-block h3{margin-bottom:18px}
.skill-list{gap:12px}.skill-list>div{grid-template-columns:1fr;gap:2px}
.client-heading{align-items:baseline}.client-heading h2{max-width:25ch;line-height:1.4}
.client-context{max-width:30ch}
}
@media(prefers-reduced-motion:reduce){
.client-marquee.is-ready .client-track{animation:none;transform:none;width:100%}
.client-marquee .client-group{min-width:0;width:100%;flex-wrap:wrap;gap:28px;padding:0 var(--gutter)}
.client-marquee .client-group[aria-hidden="true"]{display:none}
.clients .marquee-toggle{display:none}
}


/* Refined bento composition: inset photograph, aligned marks and fewer labels. */
.project-image{border-radius:12px}
.approach-motto{padding:16px}
.approach-portrait{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 55%;border-radius:10px}
.card-copy{padding:28px 14px 14px}
.approach-ownership{justify-content:center;gap:24px}
.approach-ownership h3{margin:0}
.approach-recognition{justify-content:space-between;gap:24px}
.award-logos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center;justify-items:center;flex:0 0 auto;padding:0}
.award-logos img,.award-logos img:first-child{display:block;width:100%;height:112px;max-height:none;object-fit:contain}
.approach-collaboration{display:grid;grid-template-columns:minmax(120px,.7fr) minmax(0,1.3fr);gap:36px;align-items:center}
.approach-collaboration>div{max-width:none}
.arcaiv-mark{width:100%;max-width:230px;height:auto;margin:0;justify-self:center}
.capabilities{margin-top:64px;gap:clamp(36px,5vw,80px)}
.capability-block h3{margin-bottom:28px}
.skills-summary{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:20px 28px;font-size:var(--body-size);line-height:1.5}
.software-summary{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:24px 32px}
.software-summary dt{font-size:var(--label-size);color:var(--muted);line-height:1.5;margin:0 0 6px}
.software-summary dd{font-size:var(--body-size);line-height:1.5;margin:0}
.client-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:20px}
.client-footer p{font-size:var(--label-size);color:var(--muted);margin:0}
.client-marquee.is-ready .client-track{will-change:transform}
@media(max-width:1100px) and (min-width:741px){.approach-collaboration{grid-template-columns:minmax(0,1fr);gap:24px}.arcaiv-mark{justify-self:start;max-width:160px}.award-logos{grid-template-columns:1fr;gap:20px}.award-logos img,.award-logos img:first-child{width:160px;max-width:100%;height:95px}}
@media(max-width:740px){
.project-image{border-radius:9px}
.approach-motto{padding:14px}
.approach-portrait{height:auto;border-radius:9px}
.card-copy{padding:24px 12px 12px}
.approach-collaboration{display:flex;flex-direction:column;align-items:flex-start;gap:30px}
.arcaiv-mark{width:180px}
.award-logos{grid-template-columns:1fr 1fr;gap:24px}
.award-logos img,.award-logos img:first-child{width:100%;height:100px}
.capabilities{gap:40px;margin-top:44px}
.capability-block h3{margin-bottom:22px}
.skills-summary{gap:16px 24px}
.software-summary{gap:22px 24px}
}
@media(max-width:360px){.skills-summary,.software-summary{grid-template-columns:minmax(0,1fr);gap:16px}}

/* Align bento headings and give the capabilities the same section rhythm. */
.approach-ownership{justify-content:space-between}
.capabilities{margin-top:clamp(100px,10vw,192px)}
.project-resq .project-image img{object-position:10% 50%}
@media(max-width:740px){
.capabilities{margin-top:96px}
.project-resq .project-image img{object-position:28% 50%}
.project-linewatch .project-image{aspect-ratio:6602/3449}
}

/* The introduction types in, then a small personal greeting arrives. */
.portrait-greeting{display:flex;align-items:center;gap:24px;width:fit-content;max-width:100%;margin-bottom:38px}
.portrait-greeting .portrait{margin:0;flex-shrink:0}
.greeting-bubble{position:relative;display:inline-block;padding:14px 22px;border-radius:23px 23px 23px 7px;background:#f1f1f3;font-size:19px;line-height:1.25;font-weight:500;letter-spacing:-.02em;white-space:nowrap;transform-origin:0 85%}
.greeting-bubble::before{content:"";position:absolute;left:-9px;bottom:0;width:18px;height:19px;background:#f1f1f3;border-bottom-right-radius:15px}
.greeting-bubble::after{content:"";position:absolute;left:-11px;bottom:3px;width:11px;height:20px;background:#fff;border-bottom-right-radius:12px}
.claim-word{display:inline-block;white-space:nowrap}
@media(max-width:740px){.portrait-greeting{gap:22px;margin-bottom:28px}.greeting-bubble{font-size:17px;padding:13px 20px}}
@media(prefers-reduced-motion:reduce){.claim-letter,.greeting-bubble{opacity:1!important;transform:none!important}}

/* Stable hit area; the message gently follows the pointer without moving layout. */
.greeting-anchor{display:inline-block;flex-shrink:0}
.greeting-bubble{transform:translate(var(--greeting-x,0px),var(--greeting-y,0px)) rotate(var(--greeting-angle,0deg));transition:transform .45s cubic-bezier(.2,.8,.2,1)}

/* Spacious project views, within the same document as the landing page. */
#landing-view[hidden],.case-view[hidden]{display:none!important}
.project-entry{display:block;color:inherit}
.project-entry:focus-visible{outline-offset:8px;border-radius:12px}
.case-view{padding:0 var(--gutter);--case-inset:clamp(0px,4.5vw,100px);--case-space:clamp(112px,11vw,200px)}
.case-header{padding:clamp(48px,5vw,96px) var(--case-inset) clamp(96px,9vw,168px)}
.case-intro-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(64px,9vw,160px);align-items:start;margin-top:clamp(64px,6vw,112px)}
.case-title{margin:0 0 40px}
.case-title:focus{outline:none}
.case-title>.case-title-text{display:inline}
.case-title-dot{font:400 1em/1 SPvixel,Figtree,sans-serif;color:var(--accent);font-style:normal}
.case-title-letter{display:inline}
.case-description{margin:0;max-width:35ch;font-size:var(--body-size);line-height:var(--body-leading)}
.case-meta{display:grid;grid-template-columns:1fr;gap:36px;margin:0;padding-top:6px}
.case-meta>div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:24px;align-items:baseline}
.case-meta dt{font-size:var(--label-size);color:var(--muted);line-height:1.65}
.case-meta dd{margin:0;font-size:var(--body-size);line-height:var(--body-leading)}
.case-meta dd span{display:block;color:var(--muted);margin-top:6px}
.case-hero{margin:0;overflow:hidden;border-radius:12px}
.case-hero img{display:block;width:100%;height:auto}
.case-block{margin:var(--case-space) 0}
.case-editorial{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(64px,9vw,160px);padding:0 var(--case-inset)}
.case-editorial h2{font-size:22px;line-height:1.25;font-weight:500;letter-spacing:-.025em;margin:0 0 28px}
.case-editorial p{font-size:var(--body-size);line-height:var(--body-leading);margin:0;max-width:47ch}
.case-bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(24px,2.5vw,40px);grid-auto-rows:clamp(360px,34vw,640px)}
.case-tile{border-radius:16px;overflow:hidden;min-width:0;margin:0;background:#f3f3f3}
.case-tile img{display:block;width:100%;height:100%;object-fit:cover}
.case-access{grid-column:span 8}.case-access img{object-position:65% 55%}
.case-statement{grid-column:span 4;display:flex;align-items:center;padding:clamp(32px,3.6vw,64px)}
.case-statement p{margin:0;font-size:clamp(26px,2.5vw,44px);font-weight:600;line-height:1.2;letter-spacing:-.035em}
.case-statement em{font:400 1em/1.2 SPvixel,Figtree,sans-serif;color:var(--accent);font-style:normal}
.case-signal{grid-column:span 4}.case-signal img{object-position:50% 58%}
.case-storage{grid-column:span 8}.case-storage img{object-position:50% 52%}
.case-learning{align-items:start}
.case-learning h2{max-width:18ch;font-size:clamp(28px,2.4vw,42px);line-height:1.2;margin:0;letter-spacing:-.035em}
.case-learning p{padding-top:4px}
body.is-project-view footer{margin-top:64px}
html.is-routing{scroll-behavior:auto!important}
@media(max-width:1100px) and (min-width:741px){
.case-view{--case-inset:20px}.case-intro-grid,.case-editorial{gap:56px}
.case-meta>div{grid-template-columns:1fr;gap:8px}.case-meta{gap:28px}
.case-bento{grid-auto-rows:360px;gap:24px}.case-access,.case-statement,.case-signal,.case-storage{grid-column:span 6}
.case-statement{padding:32px}.case-statement p{font-size:28px}
}
@media(max-width:740px){
.case-view{--case-inset:0px;--case-space:88px}
.case-header{padding:40px 0 72px}.case-intro-grid{grid-template-columns:1fr;gap:48px;margin-top:48px}
.case-title{margin:0 0 28px}.case-description{max-width:35ch}
.case-meta{gap:28px;padding:0}.case-meta>div{grid-template-columns:1fr;gap:8px}
.case-hero{border-radius:9px}.case-editorial{grid-template-columns:1fr;gap:48px}
.case-editorial h2{font-size:22px;margin-bottom:20px}
.case-bento{grid-template-columns:minmax(0,1fr);grid-auto-rows:auto;gap:24px}
.case-tile{grid-column:auto;border-radius:12px}.case-tile img{height:auto;object-fit:contain}
.case-statement{min-height:240px;padding:36px}.case-statement p{font-size:30px}
.case-learning{gap:28px}.case-learning h2{font-size:28px;max-width:18ch;margin:0}.case-learning p{padding:0}
}

/* RESQ: shared alignments, subordinate metadata, a visual continuation. */
.case-view{--case-heading-size:clamp(28px,2.4vw,42px);--case-inset:0px}
.case-header{padding:clamp(72px,8vw,144px) 0 clamp(72px,7vw,128px)}
.case-title{margin:0 0 clamp(36px,4vw,64px)}
.case-intro-grid{margin:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);align-items:start}
.case-description{max-width:39ch}
.case-meta{grid-template-columns:1.2fr 1.1fr .9fr;gap:24px;padding:0;margin:0}
.case-meta>div{display:block}
.case-meta dt{font-size:13px;line-height:1.5;margin:0 0 10px;color:var(--muted)}
.case-meta dd{font-size:13px;line-height:1.6;color:#333}
.case-meta dd span{margin-top:5px;color:var(--muted)}
.case-editorial{gap:var(--gap)}
.case-editorial h2,.case-learning h2{font-size:var(--case-heading-size);font-weight:500;line-height:1.2;letter-spacing:-.035em;margin:0 0 28px;max-width:20ch}
.case-learning h2{margin-bottom:0}
.case-editorial p{max-width:49ch}
.case-learning p{padding-top:4px}
.case-next{margin-top:var(--case-space);display:grid;grid-template-columns:2fr 3fr;min-height:280px;padding:16px;background:#f3f3f3;border-radius:16px;overflow:hidden;align-items:stretch}
.case-next-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(32px,4vw,72px);gap:28px}
.case-next h2{font-size:var(--case-heading-size);line-height:1.2;font-weight:500;letter-spacing:-.035em}
.case-next-label{margin:0;font:400 clamp(18px,1.5vw,24px)/1.4 SPvixel,Figtree,sans-serif;letter-spacing:0;color:var(--accent);text-decoration:none}
.case-next-image{overflow:hidden;border-radius:10px;display:flex;align-items:center;background:#e5eaed}
.case-next img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.case-next-cta{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 22px;border:1px solid #b3b3b3;border-radius:999px;font-size:13px;line-height:20px;text-decoration:none;transition:background .25s,border-color .25s}
.case-next-cta:focus-visible{outline:2px solid var(--accent);outline-offset:5px;border-radius:999px}
.project-linewatch{scroll-margin-top:calc(var(--header-height) + 24px)}
@media(hover:hover) and (pointer:fine){.case-next-cta:hover{background:#fff;border-color:#777}}
@media(min-width:741px) and (max-width:1100px){
.case-meta{grid-template-columns:1fr;gap:16px}.case-meta>div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px}.case-meta dt{margin:0}.case-meta dd span{margin-top:2px}
}
@media(max-width:740px){
.case-view{--case-heading-size:28px}
.case-header{padding:56px 0 64px}.case-title{margin-bottom:28px}.case-intro-grid{grid-template-columns:1fr;gap:36px}
.case-meta{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.case-meta>div{display:block}.case-meta dt{margin-bottom:8px}
.case-editorial{gap:48px}.case-editorial h2{margin-bottom:24px}.case-learning{gap:24px}.case-learning h2{margin-bottom:0}
.case-next{grid-template-columns:1fr;min-height:0;padding:12px;border-radius:16px}.case-next-copy{padding:28px 20px;gap:20px}.case-next-image{grid-row:1;border-radius:8px;aspect-ratio:6602/3449}.case-next img{height:auto;object-fit:contain}
}
@media(prefers-reduced-motion:reduce){.case-next img{transition:none}.case-next:hover img{transform:none}}

/* RESQ v21: editorial story, image annotations and a concise process. */
.case-view{--case-display-size:clamp(30px,3.15vw,76px)}
.case-title{font-family:Figtree,Arial,sans-serif;font-size:var(--case-display-size);font-weight:600;line-height:1.14;letter-spacing:-.045em;margin:0 0 16px}
.case-claim{margin:0 0 clamp(48px,5vw,88px);font:400 var(--case-display-size)/1.2 SPvixel,Figtree,sans-serif;color:var(--accent);letter-spacing:-.035em;max-width:100%}
.case-typed-word{display:inline-block;white-space:nowrap}
.case-narrative{display:grid;gap:clamp(72px,7vw,128px)}
.case-narrative .case-editorial{align-items:start}
.case-narrative h2{margin:0}
.case-narrative p{padding-top:4px}
.case-hero,.case-tile,.case-process-image{position:relative}
.image-note{position:absolute;top:20px;right:20px;z-index:1;max-width:calc(100% - 40px);padding:8px 14px;border:1px solid rgba(255,255,255,.7);border-radius:999px;background:rgba(255,255,255,.94);color:#171b25;font:500 13px/1.4 Figtree,Arial,sans-serif;letter-spacing:0}
.case-bento .image-note{left:20px;right:auto}
.case-process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);align-items:stretch}
.case-process-card{min-width:0;background:var(--card-surface);border-radius:18px;padding:16px;display:flex;flex-direction:column}
.case-process-image{margin:0;overflow:hidden;border-radius:10px;aspect-ratio:4/3;background:#303030}
.case-process-image img{display:block;width:100%;height:100%;object-fit:contain}
.process-cad{background:#303030}.process-model img{object-fit:cover}
.case-process-copy{padding:28px 14px 14px}
.case-process-copy h3{font-size:clamp(24px,2.1vw,34px);font-weight:600;line-height:1.12;letter-spacing:-.035em;margin:0 0 22px;max-width:18ch;min-height:2.24em}
.case-process-copy p{font-size:var(--body-size);line-height:1.55;margin:0}
.case-process-image .image-note{top:12px;right:12px;max-width:calc(100% - 24px)}
.case-learning h2{font-family:SPvixel,Figtree,sans-serif;font-weight:400;color:var(--accent);letter-spacing:-.035em;line-height:1.25;max-width:21ch}
.case-reflection{margin:0;min-width:0}
.case-reflection blockquote{margin:0}
.case-reflection blockquote p{margin:0;max-width:54ch;font-size:var(--body-size);line-height:var(--body-leading)}
.case-reflection figcaption{margin-top:28px;font-size:13px;line-height:1.6}
.case-reflection figcaption span{display:block}.case-reflection figcaption span+span{color:var(--muted);margin-top:4px}
.case-next h2{font-family:Figtree,Arial,sans-serif;font-size:var(--case-display-size);font-weight:600;line-height:1.14;letter-spacing:-.045em;margin:0}
@media(min-width:741px) and (max-width:1050px){.case-view{--case-display-size:clamp(25px,3.15vw,36px)}}
@media(min-width:901px) and (max-width:1150px){.case-process-grid{gap:20px}.case-process-card{padding:12px}.case-process-copy{padding:24px 8px 12px}.case-process-copy h3{font-size:24px}.case-process-image{aspect-ratio:1/1}}
@media(max-width:900px){.case-process-grid{grid-template-columns:1fr;gap:28px}.case-process-copy h3{min-height:0;max-width:none}.case-process-image{aspect-ratio:16/10}.case-process-image img{object-fit:contain}.process-model{background:#ddd}}
@media(max-width:740px){
.case-view{--case-display-size:clamp(28px,6.6vw,48px)}
.case-title{line-height:1.18;letter-spacing:-.04em;margin-bottom:14px}.case-claim{margin-bottom:40px;line-height:1.25}
.case-narrative{gap:64px}.case-narrative .case-editorial{gap:24px}.case-narrative p{padding:0}
.image-note{top:12px;right:12px;max-width:calc(100% - 24px);font-size:12px;padding:7px 12px}.case-bento .image-note{left:12px;right:auto}
.case-process-card{padding:14px}.case-process-copy{padding:26px 12px 14px}.case-process-copy h3{font-size:28px;margin-bottom:18px}
.case-reflection blockquote p{padding:0}.case-next h2{line-height:1.18;letter-spacing:-.04em}
}
@media(max-width:360px){.case-view{--case-display-size:26px}}
@media(prefers-reduced-motion:reduce){.case-title-letter{opacity:1!important}}

/* Consistent image notes and the same responsive pixel feedback as the landing page. */
.image-note{left:20px;right:auto}
.case-process-image.process-ideation img{object-fit:cover;object-position:50% 50%}
.case-learning h2{max-width:none;white-space:nowrap}
@media(min-width:741px) and (max-width:1100px){.case-learning{grid-template-columns:1fr;gap:36px}.case-reflection{max-width:650px}}
@media(max-width:740px){.image-note{left:12px;right:auto}.case-learning h2{white-space:normal}}

/* Typing spans must remain transformable for the pixel wave. */
.case-typed-word{position:relative}
.case-claim .pixel-letter,#resq-learning .pixel-letter{display:inline-block}

/* One heading scale throughout the case; the opening title and claim retain theirs. */
.case-view h2,.case-view h3,.case-view .case-statement p{font-size:var(--case-heading-size)}
.case-view h2 .pixel-accent,.case-view .case-statement em{font-size:1em}
.case-process-card{background:transparent}

/* All project headings share the reference heading's Medium weight, except RESQ. */
.case-view h2,.case-view h3,.case-view .case-statement p,.case-view .case-claim{font-weight:500}
.case-view h2 .pixel-accent,.case-view .case-statement em{font-weight:inherit}

/* Compact Linewatch case, using the approved RESQ typography and spacing. */
.case-learning .pixel-letter{display:inline-block}
.linewatch-dial,.linewatch-cad{grid-column:span 5}
.linewatch-movement,.linewatch-collection{grid-column:span 7}
.linewatch-studies{grid-column:1/-1;aspect-ratio:5399/2948}
.linewatch-bento{grid-template-rows:clamp(320px,34vw,640px) clamp(300px,30vw,560px) auto;grid-auto-rows:auto}
.linewatch-dial img{object-position:50% 50%}
.linewatch-cad img,.linewatch-collection img,.linewatch-studies img{object-fit:contain}
@media(max-width:740px){.linewatch-bento{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:auto}.linewatch-bento .case-tile{grid-column:auto;aspect-ratio:auto}.linewatch-bento .case-tile img{height:auto;object-fit:contain}}

/* Enlarge the three-watch composition while retaining the complete products. */
.linewatch-collection img{transform:scale(1.35);transform-origin:center}

/* Veil Drone: shared hero-case structure with a wide view of the support system. */
.veil-bento{grid-template-rows:clamp(360px,34vw,640px) auto;grid-auto-rows:auto}
.veil-mount{grid-column:span 8}.veil-mount img{object-fit:contain}
.veil-transport{grid-column:1/-1;aspect-ratio:1983/793}.veil-transport img{object-fit:contain}
.veil-process-components{background:#f3f3f3}.veil-process-components img{object-fit:cover;object-position:center;transform:scale(1.04)}
.veil-process-printing img{object-fit:cover;object-position:50% 40%}
.veil-process-exhibition img{object-fit:cover;object-position:50% 38%}
@media(min-width:741px) and (max-width:1100px){.veil-mount{grid-column:span 6}}
@media(max-width:740px){.veil-bento{grid-template-rows:none}.veil-mount,.veil-transport{grid-column:auto}.veil-transport{aspect-ratio:auto}}

/* Native image proportions keep both design views and drawings complete. */
.clock-bento{grid-template-columns:1.2532637076fr 1.3333902064fr;grid-template-rows:auto;grid-auto-rows:auto;align-items:start}
.clock-form,.clock-sketches{grid-column:auto}
.clock-form{aspect-ratio:1920/1532}.clock-sketches{aspect-ratio:7815/5861}
.clock-form img,.clock-sketches img{object-fit:contain;object-position:center}
.clock-context,.clock-colours{grid-column:1/-1}
.clock-context{aspect-ratio:2.3}.clock-context img{object-fit:cover;object-position:50% 20%}
.clock-colours{aspect-ratio:2048/768}.clock-colours img{object-fit:contain}
@media(max-width:740px){.clock-bento{grid-template-columns:1fr}.clock-form,.clock-sketches,.clock-context,.clock-colours{grid-column:auto;aspect-ratio:auto}.clock-bento .case-tile img{height:auto;object-fit:contain}}

/* A single portfolio download invitation closes the landing page. */
.portfolio-card{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(40px,5vw,88px);align-items:center;min-height:360px;padding:clamp(40px,5vw,88px);border-radius:20px;background:#f3f3f3}
.portfolio-card .section-title{margin:0;max-width:20ch}
.portfolio-copy{display:flex;flex-direction:column;align-items:flex-start;gap:32px}
.portfolio-copy p{margin:0;max-width:43ch;font-size:var(--body-size);line-height:var(--body-leading)}
.portfolio-download{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;border:1px solid #999;border-radius:999px;font-size:14px;line-height:22px;text-decoration:none;transition:background .25s,border-color .25s}
.portfolio-download:focus-visible{border-radius:999px;outline:2px solid var(--accent);outline-offset:5px}
@media(hover:hover) and (pointer:fine){.portfolio-download:hover{background:#fff;border-color:#171b25}}
@media(max-width:900px){.portfolio-card{grid-template-columns:1fr;gap:32px;min-height:0;padding:40px}.portfolio-copy p{max-width:50ch}}
@media(max-width:740px){.portfolio-card{padding:36px 24px;border-radius:16px}.portfolio-copy{gap:28px}.portfolio-download{padding:12px 20px}}
@media(prefers-reduced-motion:reduce){.portfolio-download{transition:none}}

/* Anchor to the section heading, accounting for the section’s generous top spacing. */
#about,#approach{scroll-margin-top:calc(-1 * var(--section-top-space))}

/* Legal links shared by landing and project views. */
.footer-legal{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center}
.footer-legal a{display:inline-flex;align-items:center;min-height:44px;color:var(--muted)}
/* The legal page uses the same type, spacing and navigation as the portfolio. */
.legal-main{padding:clamp(64px,8vw,140px) var(--gutter) 0}
.legal-title{margin:0 0 clamp(56px,7vw,112px)}
.legal-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap);padding:48px 0 64px;border-top:1px solid #e7e7e7;scroll-margin-top:0}
.legal-section>h2{font-size:clamp(28px,2.3vw,44px);font-weight:500}
.legal-copy{min-width:0;max-width:72ch;font-size:var(--body-size);line-height:1.65;overflow-wrap:anywhere}
.legal-copy h3{font-size:1em;font-weight:600;line-height:1.4;margin:32px 0 10px}
.legal-copy h3:first-child{margin-top:0}.legal-copy p{margin:0 0 20px}.legal-copy address{font-style:normal;margin:0 0 20px}
.legal-copy a{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.legal-date{color:var(--muted);font-size:14px}
.legal-page .wordmark{opacity:1}
@media(max-width:740px){.legal-main{padding-top:56px}.legal-section{grid-template-columns:1fr;gap:28px;padding:32px 0 48px}.footer-legal{gap:8px 24px}.legal-title{overflow-wrap:anywhere;font-size:clamp(28px,7.5vw,44px)}}