@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500&display=swap');
:root{--ink:#181817;--muted:#74746e;--paper:#f4f4f1;--line:#d5d5cf;--pad:clamp(20px,4vw,64px)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-weight:300}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.site-header{position:fixed;z-index:20;inset:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;padding:25px var(--pad);background:linear-gradient(var(--paper) 70%,transparent)}.brand{display:flex;flex-direction:column;line-height:1.05;letter-spacing:.06em}.brand strong{font-weight:500;font-size:15px}.brand span{font-size:11px;margin-top:5px;color:var(--muted)}nav{display:flex;gap:clamp(18px,3vw,50px);align-items:center;font-size:11px;letter-spacing:.11em}nav a{position:relative}nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-5px;border-bottom:1px solid;transition:.3s}nav a:hover:after{right:0}.language{display:flex;gap:5px}.language button{border:0;background:none;padding:0;cursor:pointer;color:#aaa}.language button.active{color:var(--ink)}.language i{font-style:normal;color:#bbb}.menu{display:none;background:none;border:0;font-size:11px;letter-spacing:.1em}.intro{min-height:100svh;padding:180px var(--pad) 60px;display:grid;align-content:center}.eyebrow,.section-label{font-size:10px;letter-spacing:.18em;color:var(--muted)}h1{font-size:clamp(58px,10vw,155px);font-weight:300;letter-spacing:-.055em;line-height:.76;margin:55px 0}.intro h1 em{font:inherit}.intro-meta{align-self:end;margin-left:auto;width:min(420px,100%);display:flex;justify-content:space-between;gap:30px;font-size:12px;line-height:1.55}.intro-meta p{margin:0;max-width:270px}.intro-meta a{font-size:10px;letter-spacing:.1em;white-space:nowrap}.projects{padding:70px var(--pad) 140px}.section-heading{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:13px;margin-bottom:60px;font-size:10px;letter-spacing:.14em}.section-heading h2{font:inherit;margin:0}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:70px 24px}.project-card{cursor:pointer}.project-image{overflow:hidden;background:#e6e6e1;aspect-ratio:4/3}.project-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}.project-card:hover img{transform:scale(1.018)}.project-info{display:grid;grid-template-columns:28px 1fr;gap:8px;padding-top:12px}.project-info span{font-size:10px;color:var(--muted)}.project-info h3{font-size:13px;font-weight:400;margin:0}.project-info p{grid-column:2;font-size:10px;color:var(--muted);margin:2px 0 0}.about,.contact{padding:130px var(--pad);border-top:1px solid var(--line);display:grid;grid-template-columns:20% 80%}.about h2,.contact h2{font-size:clamp(34px,5vw,76px);font-weight:300;line-height:1.08;letter-spacing:-.04em;max-width:1000px;margin:0 0 85px}.about-profile{display:grid;grid-template-columns:minmax(240px,34%) 1fr;gap:7%;align-items:start}.about-profile img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center top}.about-copy{display:grid;grid-template-columns:1.2fr 1fr;gap:10%;font-size:14px;line-height:1.7}.about-copy p{margin:0;white-space:pre-line}.career{margin-top:100px}.career>.section-label{padding-bottom:13px;border-bottom:1px solid var(--line)}.career-row{display:grid;grid-template-columns:18% 28% 1fr;gap:20px;border-bottom:1px solid var(--line);padding:20px 0;font-size:12px;line-height:1.5}.career-row strong{font-weight:400}.career-row span:last-child{color:var(--muted)}.contact{min-height:75vh}.contact a{display:table;font-size:clamp(20px,3vw,44px);border-bottom:1px solid}.contact .instagram{font-size:11px;letter-spacing:.12em;margin-top:28px}footer{padding:25px var(--pad);border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:9px;letter-spacing:.13em}dialog{padding:0;border:0;width:100%;max-width:none;height:100%;max-height:none;background:var(--paper);color:var(--ink)}dialog::backdrop{background:var(--paper)}.dialog-close{position:fixed;z-index:4;top:25px;right:var(--pad);border:0;background:rgba(244,244,241,.88);padding:8px 0;font-size:10px;letter-spacing:.12em;cursor:pointer}.detail{padding:100px var(--pad)}.detail-head{min-height:45vh;display:grid;align-content:end;grid-template-columns:2fr 1fr;gap:40px;padding-bottom:50px}.detail h2{font-size:clamp(42px,7vw,105px);line-height:.9;letter-spacing:-.05em;font-weight:300;margin:0}.detail-meta{align-self:end;font-size:12px;line-height:1.75;color:var(--muted)}.detail-hero{width:100%;max-height:85vh;object-fit:cover}.detail-copy{display:grid;grid-template-columns:1fr 2fr;gap:40px;padding:100px 0;max-width:1100px}.detail-copy p{margin:0;font-size:clamp(15px,1.45vw,21px);line-height:1.65}.detail-gallery{display:grid;grid-template-columns:1fr 1fr;gap:24px}.detail-gallery img{width:100%;height:auto;display:block;background:#e8e8e4}.detail-gallery img:nth-child(3n){grid-column:1/-1}.detail-nav{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:100px;padding-top:18px;font-size:10px;letter-spacing:.12em}.detail-nav button{border:0;background:none;cursor:pointer}
@media(max-width:980px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.site-header{padding-top:20px}.menu{display:block}nav{position:fixed;inset:65px 0 auto;background:var(--paper);padding:30px var(--pad) 45px;display:none;flex-direction:column;align-items:flex-start;font-size:13px}nav.open{display:flex}.intro{padding-top:130px}.intro-meta{flex-direction:column}.project-grid{grid-template-columns:1fr;gap:55px}.about,.contact{grid-template-columns:1fr;gap:55px;padding-top:90px;padding-bottom:90px}.about h2,.contact h2{margin-bottom:55px}.about-profile,.about-copy{grid-template-columns:1fr;gap:35px}.about-profile img{max-width:420px}.career-row{grid-template-columns:1fr}.detail{padding:90px 20px}.detail-head{grid-template-columns:1fr;min-height:35vh}.detail-gallery{grid-template-columns:1fr}.detail-gallery img:nth-child(n){grid-column:auto}.detail-copy{grid-template-columns:1fr;padding:60px 0}.contact{min-height:60vh}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.project-image img{transition:none}}
.project-info p{line-height:1.55}.project-info p span{display:block}
.about-closing{font-size:clamp(34px,5vw,76px);line-height:1.05;letter-spacing:-.04em;margin:120px 0 0;max-width:900px}
.detail figure{margin:0}.detail>figure>img{width:100%;max-height:85vh;object-fit:cover}.detail-gallery figure:nth-child(3n){grid-column:1/-1}.detail-gallery figure img{width:100%;height:auto;display:block}.detail figcaption{display:grid;gap:3px;padding:12px 0 28px;font-size:11px;line-height:1.45}.detail figcaption span:last-child{color:var(--muted)}
.detail-gallery.stadthaus-bonn figure:nth-child(-n+2) img{width:100%;aspect-ratio:1/1;object-fit:cover}.detail-gallery.stadthaus-bonn figure:nth-child(3) img{width:100%;aspect-ratio:auto;object-fit:contain}
.brand span{font-size:6.8px;letter-spacing:.13em;white-space:nowrap;color:#8d8d87}

/* Fluid responsive layout */
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(55px,6vw,95px) clamp(18px,2vw,34px)}
@media(min-width:1500px){.project-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.site-header{padding-top:32px}.intro{padding-top:210px}.projects,.about,.contact{padding-top:150px;padding-bottom:170px}}
@media(max-width:900px){.about,.contact{grid-template-columns:1fr;gap:55px}.about-profile{grid-template-columns:minmax(220px,40%) 1fr}.career-row{grid-template-columns:22% 32% 1fr}}
@media(max-width:640px){:root{--pad:18px}.site-header{padding:18px var(--pad);background:var(--paper)}.brand strong{font-size:13px}.brand span{font-size:9px}.menu{display:block}nav{position:fixed;z-index:19;inset:58px 0 auto;background:var(--paper);padding:26px var(--pad) 38px;display:none;flex-direction:column;align-items:flex-start;gap:25px;font-size:13px;border-bottom:1px solid var(--line)}nav.open{display:flex}.intro{min-height:92svh;padding:115px var(--pad) 45px}.eyebrow{font-size:9px}h1{font-size:clamp(39px,13.5vw,58px);line-height:.88;margin:42px 0;overflow-wrap:anywhere}.intro-meta{margin-left:0;flex-direction:column;gap:25px;width:100%}.projects{padding:55px var(--pad) 95px}.section-heading{margin-bottom:38px}.project-grid{grid-template-columns:1fr;gap:52px}.project-image{aspect-ratio:4/3}.project-info{grid-template-columns:24px 1fr}.about,.contact{grid-template-columns:1fr;gap:45px;padding:80px var(--pad) 85px}.about h2,.contact h2{font-size:clamp(34px,11vw,52px);margin-bottom:50px}.about-profile,.about-copy{grid-template-columns:1fr;gap:30px}.about-profile img{max-width:none}.career{margin-top:70px}.career-row{grid-template-columns:1fr;gap:5px;padding:17px 0}.contact{min-height:auto}.contact a{font-size:clamp(18px,5.8vw,28px);overflow-wrap:anywhere}.detail{padding:76px 18px 50px}.dialog-close{top:17px;right:18px}.detail-head{grid-template-columns:1fr;min-height:34vh;gap:28px;padding-bottom:30px}.detail h2{font-size:clamp(38px,12vw,58px);line-height:.95}.detail-hero{height:auto;max-height:none}.detail-copy{grid-template-columns:1fr;gap:22px;padding:55px 0}.detail-gallery{grid-template-columns:1fr;gap:34px}.detail-gallery figure:nth-child(n),.detail-gallery img:nth-child(n){grid-column:auto}.detail-gallery.stadthaus-bonn figure:nth-child(-n+2) img{aspect-ratio:4/3}.detail-nav{gap:25px;align-items:flex-start}.detail-nav button{max-width:46%;text-align:left}footer{gap:20px}}
@media(max-width:640px){.brand span{font-size:6.1px;letter-spacing:.1em}}

/* Quiet architectural hero film assembled from portfolio images */
.intro{position:relative;isolation:isolate;overflow:hidden}.intro>*:not(.hero-film){position:relative;z-index:2}.hero-film{position:absolute;z-index:-1;inset:0;background:#ddd}.hero-film:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(244,244,241,.84) 0%,rgba(244,244,241,.58) 48%,rgba(244,244,241,.28) 100%)}.hero-film span{position:absolute;inset:-4%;background-position:center;background-size:cover;opacity:0;animation:heroFilm 30s infinite ease-in-out}.hero-film span:nth-child(2){animation-delay:6s}.hero-film span:nth-child(3){animation-delay:12s}.hero-film span:nth-child(4){animation-delay:18s}.hero-film span:nth-child(5){animation-delay:24s}@keyframes heroFilm{0%{opacity:0;transform:scale(1.04)}5%{opacity:1}18%{opacity:1}23%{opacity:0;transform:scale(1.11)}100%{opacity:0;transform:scale(1.11)}}
@media(max-width:640px){.hero-film:after{background:linear-gradient(180deg,rgba(244,244,241,.78),rgba(244,244,241,.42) 55%,rgba(244,244,241,.72))}.hero-film span{background-position:center}}
@media(prefers-reduced-motion:reduce){.hero-film span{animation:none}.hero-film span:first-child{opacity:1}}
.about-copy{display:block;max-width:720px;font-size:clamp(14px,1.2vw,17px);line-height:1.75}.about-copy p{margin:0}
.project-info{display:block;padding-top:13px}.project-info .project-caption{display:block;margin:0;max-width:100%;font-size:12px;font-weight:400;line-height:1.5;color:#000}
.brand{width:auto;align-items:flex-start}.brand strong,.brand span{display:block;width:auto;white-space:nowrap;text-align:left;text-align-last:auto}.brand strong{font-size:14px;font-weight:500;letter-spacing:.16em}.brand span{font-size:7.5px;font-weight:400;letter-spacing:.14em;margin-top:6px;color:#969690}
@media(max-width:640px){.brand{width:auto}.brand strong{font-size:13px;letter-spacing:.14em}.brand span{font-size:7px;letter-spacing:.12em}}
.intro .eyebrow{font-size:12px}
@media(max-width:640px){.intro .eyebrow{font-size:12px}}

/* Unified three-size typography system */
:root{--type-small:12px;--type-body:16px;--type-large:clamp(46px,7vw,108px)}
body{font-size:var(--type-body)}
.brand strong,nav,.menu,.eyebrow,.section-label,.intro-meta,.intro-meta a,.section-heading,.project-info .project-caption,.career-row,.contact .instagram,footer,.dialog-close,.detail-meta,.detail figcaption,.detail-nav{font-size:var(--type-small)}
.about-copy,.detail-copy p{font-size:var(--type-body)}
h1,.about h2,.contact h2,.detail h2{font-size:var(--type-large)}
.contact>a,.contact div>a:not(.instagram){font-size:var(--type-body)}
@media(max-width:640px){:root{--type-small:11px;--type-body:15px;--type-large:clamp(40px,11vw,56px)}.brand strong,.intro .eyebrow,.project-info .project-caption,.about-copy,.detail-copy p,.contact a{font-size:inherit}.brand strong,.intro .eyebrow,.project-info .project-caption{font-size:var(--type-small)}.about-copy,.detail-copy p,.contact div>a:not(.instagram){font-size:var(--type-body)}h1,.about h2,.contact h2,.detail h2{font-size:var(--type-large)}}

/* One dark-grey text colour throughout */
:root{--ink:#343432;--muted:#343432}.project-info .project-caption,.brand strong,.brand span,body,button,a{color:#343432}
body,body *{color:#343432!important}
.contact .phone{margin-top:14px}

/* Kita gallery: site plan, paired floor plans, final interior */
.detail-gallery.kita-hanerau-hademarschen{align-items:start}
.detail-gallery.kita-hanerau-hademarschen>figure:nth-child(n){grid-column:auto;width:100%}
.detail-gallery.kita-hanerau-hademarschen>figure:first-child,.detail-gallery.kita-hanerau-hademarschen>figure:last-child{grid-column:1/-1}
.detail-gallery.kita-hanerau-hademarschen>figure:first-child{max-width:none;justify-self:stretch}
.detail:has(.detail-gallery.kita-hanerau-hademarschen) figcaption{padding:12px 0 0}

/* Consistent soft colour treatment across portfolio project imagery */
.project-image img,.detail-hero,.detail figure img,.hero-film span{filter:saturate(.72) contrast(.88) brightness(1.06)}
/* Arabic reading direction and typography */
html[lang="ar"] body{font-family:Tahoma,Arial,sans-serif}
html[lang="ar"] h1,html[lang="ar"] h2{line-height:1.45;letter-spacing:0}
html[lang="ar"] nav,html[lang="ar"] .eyebrow,html[lang="ar"] .section-label,html[lang="ar"] .section-heading,html[lang="ar"] .dialog-close,html[lang="ar"] .detail-nav,html[lang="ar"] footer{letter-spacing:0}
html[lang="ar"] .about-copy,html[lang="ar"] .detail-copy p{line-height:1.95}
html[dir="rtl"] .intro-meta{margin-left:0;margin-right:auto}
html[dir="rtl"] .dialog-close{right:auto;left:var(--pad)}
html[dir="rtl"] .detail-nav button{text-align:right}
html[dir="rtl"] .hero-film:after{background:linear-gradient(270deg,rgba(244,244,241,.84) 0%,rgba(244,244,241,.58) 48%,rgba(244,244,241,.28) 100%)}
html[dir="rtl"] .brand,html[dir="rtl"] footer>span,html[dir="rtl"] .section-heading>span{direction:ltr;unicode-bidi:isolate}
.language button[lang="ar"]{letter-spacing:0;font-family:Tahoma,Arial,sans-serif}
@media(max-width:640px){html[dir="rtl"] .intro-meta{margin-right:0}html[dir="rtl"] .hero-film:after{background:linear-gradient(180deg,rgba(244,244,241,.78),rgba(244,244,241,.42) 55%,rgba(244,244,241,.72))}}

/* Single interior visual fills the existing gallery width */
.detail-gallery.volksbank>figure{grid-column:1/-1}

.detail-gallery.schule-berlin>figure{grid-column:1/-1}

/* Preserve complete title images on project detail pages */
.detail-hero,.detail>figure>img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
/* Portfolio experience as two quiet, legible statistics */
.intro-meta{width:min(480px,100%);flex-direction:column;gap:28px}
.intro-stats{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:0;width:100%}
.intro-stats>div{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:16px}
.intro-stats dd{order:-1;margin:0;font-size:clamp(42px,5vw,68px);font-weight:300;line-height:1.05;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.intro-stats dt{font-size:var(--type-small);line-height:1.5}
html[lang="ar"] .intro-stats dd{letter-spacing:0}
@media(max-width:640px){.intro-stats{gap:20px}.intro-meta{gap:24px}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Inline experience sentence with larger animated numbers */
.intro-meta .intro-stats{display:block;max-width:none;width:100%;margin:0;font-size:var(--type-small);line-height:2.3}
.intro-stats .stat-number{display:inline-block;font-size:clamp(28px,3vw,40px);line-height:1;vertical-align:baseline;font-weight:300;font-variant-numeric:tabular-nums;letter-spacing:-.03em;min-width:2ch;text-align:center}
html[lang="ar"] .intro-stats .stat-number{letter-spacing:0}

/* Slightly larger experience sentence */
.intro-meta .intro-stats{font-size:var(--type-body)}

/* Freiburg: equal frames for concept and ground-floor plan. */
.detail-gallery.office-scope>figure:nth-child(-n+2) img{width:100%;aspect-ratio:1881/1420;object-fit:cover;object-position:center}


.project-pictograms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2vw,24px);margin-top:40px;align-items:start}.project-pictograms figure{min-width:0;margin:0}.project-pictograms figure img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:white;filter:none}.project-pictograms figcaption{font-size:clamp(9px,1vw,12px);overflow-wrap:anywhere}

.project-pictograms{margin:0 0 40px}

.detail-gallery.schule-berlin img[src='assets/schule-berlin-lageplan.png']{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 18%}


.detail-gallery.city-forum>figure{grid-column:1/-1}


.detail-gallery.event-house>figure:last-child{grid-column:1/-1}


.project-caption .project-award{font-weight:600}

.project-card[data-id='venice'] .project-image{background:#fff}.project-card[data-id='venice'] .project-image img{object-fit:contain}.project-card[data-id='venice']:hover img{transform:none}


.project-card[data-id='adidas'] .project-image{background:#fff}.project-card[data-id='adidas'] .project-image img{object-fit:contain;filter:none}.project-card[data-id='adidas']:hover img{transform:none}

.detail-gallery.adidas>figure img{width:100%;aspect-ratio:1501/1048;object-fit:cover;object-position:center}


.detail-gallery.buecherei-deining>figure{grid-column:1/-1}.detail:has(.detail-gallery.buecherei-deining) .detail-copy:has(p:empty){display:none}.detail:has(.detail-gallery.buecherei-deining) .detail-gallery{margin-top:32px}.detail:has(.detail-gallery.buecherei-deining) img{filter:none}

.detail-gallery.buecherei-deining{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}.detail-gallery.buecherei-deining>figure:first-child{grid-column:1/-1}.detail-gallery.buecherei-deining>figure:nth-child(n+2){grid-column:auto}.detail-gallery.buecherei-deining>figure:nth-child(n+2) img{display:block;width:100%;aspect-ratio:2193/3186;object-fit:cover;object-position:center;background:transparent}

/* Project details use the same typographic scale as the project overview. */
.detail .detail-head{min-height:0;align-content:start;align-items:start;padding-bottom:32px;gap:24px}
.detail h2{font-size:var(--type-small);font-weight:400;line-height:1.5;letter-spacing:normal}
.detail .detail-meta{font-size:var(--type-small);line-height:1.5;align-self:start}
.detail .detail-copy p{font-size:var(--type-small);line-height:1.7}
.detail-meta .project-award{font-weight:600}

/* Full-width project heading above the image. */
.detail .detail-head{grid-template-columns:minmax(0,1fr);gap:20px;padding-bottom:40px}
.detail h2{width:100%;max-width:none;font-size:var(--type-large);font-weight:300;line-height:1.05;letter-spacing:-.04em;overflow-wrap:break-word}
.detail .detail-copy p{font-size:var(--type-body);line-height:1.7}

.detail .detail-head{grid-template-columns:minmax(0,1fr);gap:14px}.detail .detail-head h2{font-size:clamp(28px,3.4vw,52px);font-weight:300;line-height:1.2;letter-spacing:-.025em}.detail .detail-head .detail-meta{font-size:var(--type-small);font-weight:400;line-height:1.5}

.detail .detail-head .detail-meta:has(bdi){font-size:clamp(15px,1.5vw,20px);line-height:1.5}

.detail .detail-head .detail-meta:has(bdi){font-size:clamp(21px,2.4vw,37px);font-weight:300;line-height:1.2;letter-spacing:-.025em;color:#74746e}

/* Keep office credits gray despite the global text color override. */
.detail .detail-head .detail-meta:has(bdi), .detail .detail-head .detail-meta bdi{color:#74746e!important}

/* Mannheim site plan: crop the blank strip on the right. */
.detail-gallery.medizin-mannheim img[src="assets/medizin-mannheim-lageplan.jpg"]{width:100%;height:auto;aspect-ratio:1840/2605;object-fit:cover;object-position:left center}

/* Mannheim: equal-sized sketch and site-plan frames. */
.detail-gallery.medizin-mannheim>figure:nth-child(-n+2) img{display:block;width:100%;height:auto;aspect-ratio:1840/2605;object-fit:cover}

.detail:has(.detail-gallery.rettungswache-burscheid) .detail-copy{display:none}
.detail-gallery.rettungswache-burscheid{align-items:start;margin-top:32px}

/* Match the cleaned site plan to the muted floor-plan palette. */
.detail-gallery.rettungswache-burscheid img[src='assets/burscheid-lageplan-bereinigt.png']{filter:saturate(.35) contrast(.78) brightness(1.10)}

/* Senden: show the wide architectural drawings at full width. */
.detail:has(.detail-gallery.mensa-senden) .detail-copy{display:none}
.detail-gallery.mensa-senden{margin-top:32px}
.detail-gallery.mensa-senden>figure{grid-column:1/-1}

/* Keep the interior full-width when appending the model photograph. */
.detail-gallery.kita-hanerau-hademarschen>figure:nth-child(4){grid-column:1/-1}

/* Ludwigsburg: full-width overview, paired perspectives, model and section. */
.detail:has(.detail-gallery.ww-ludwigsburg) .detail-copy{display:none}
.detail-gallery.ww-ludwigsburg{margin-top:32px;align-items:start}
.detail-gallery.ww-ludwigsburg>figure:nth-child(n){grid-column:1/-1}
@media(min-width:641px){.detail-gallery.ww-ludwigsburg>figure:nth-child(2),.detail-gallery.ww-ludwigsburg>figure:nth-child(3){grid-column:auto}}
.project-card[data-id='ww-ludwigsburg'] .project-image img{object-position:center 70%}

/* Emphasize awards beneath competition images. */
.detail figcaption .project-award{font-weight:700}

/* Contributions: every project uses the same two-column image grid. */
.detail-gallery.competitions{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.detail-gallery.competitions>figure:nth-child(n){grid-column:auto;min-width:0}
.detail-gallery.competitions>figure img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.detail:has(.detail-gallery.competitions) .detail-copy{padding:20px 0 40px}

/* Center the new sports hall within its shared image frame. */
.detail-gallery.competitions img[src='assets/mitarbeit-5.jpg']{object-position:20% 50%}

/* Berlin school: requested 75 percent saturation with the portfolio tonal treatment. */
.detail-gallery.competitions img[src='assets/mitarbeit-gymnasium-berlin-neu.png']{filter:saturate(.75) contrast(.88) brightness(1.06)}

/* Four-image covers share the standard project-card frame. */
.project-image.project-collage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:0}
.project-image.project-collage img{width:100%;height:100%;min-width:0;min-height:0;object-fit:cover}
.project-collage img[src="assets/mitarbeit-gymnasium-berlin-neu.png"]{filter:saturate(.75) contrast(.88) brightness(1.06)}

/* Project label uses the same typography as its description. */
.detail .detail-copy > .section-label{font-family:inherit;font-size:var(--type-body);font-weight:300;line-height:1.7;letter-spacing:normal;text-transform:none}
html[lang="ar"] .detail .detail-copy > .section-label{line-height:1.95}

/* Role text matches the office credit size at every screen width. */
.detail .detail-role{font-size:clamp(21px,2.4vw,37px)}

.detail .detail-role,.detail .detail-role bdi{color:#74746e!important}

/* Image previews for previous and next projects. */
.detail-nav .project-nav-card{display:flex;flex-direction:column;gap:14px;width:min(40%,420px);max-width:46%;padding:0;text-align:start}
.project-nav-card .project-image{display:block;width:100%;aspect-ratio:4/3}
.project-nav-card .project-image.project-collage{display:grid}
.project-nav-label{display:block;line-height:1.5}
.project-nav-card:hover img{transform:scale(1.018)}
.project-nav-card:focus-visible{outline:2px solid currentColor;outline-offset:6px}
@media(max-width:640px){.detail-nav .project-nav-card{width:46%;gap:10px}}

/* Show the entire Venice pavilion with white space around it. */
.project-image img[src="assets/p20_003_1655x773.jpg"],.detail-gallery.competitions>figure img[src="assets/p20_003_1655x773.jpg"]{object-fit:contain;object-position:center;background:#fff;filter:none;transform:none}

.collage-tile{position:relative;display:block;min-width:0;min-height:0;overflow:hidden}
.collage-award{position:absolute;inset-inline-start:8px;bottom:8px;padding:3px 7px;background:rgba(244,244,241,.92);font-size:var(--type-small);font-weight:600;line-height:1.5;letter-spacing:normal}

/* Separate the role credit from the final project image. */
.detail > .detail-role{margin-top:48px}
@media(max-width:640px){.detail > .detail-role{margin-top:32px}}

/* Trim the narrow white top edge from the floor-plan sheet. */
.burscheid-plan-crop{width:100%;aspect-ratio:2473/3761;overflow:hidden}
.detail-gallery .burscheid-plan-crop img{display:block;width:100%;height:100%;object-fit:cover;object-position:center bottom}

/* Matching site-plan and model frames, site plan first. */
.detail-gallery.event-house>figure:nth-child(-n+2){grid-column:auto;min-width:0}
.detail-gallery.event-house>figure:nth-child(-n+2) img{display:block;width:100%;height:auto;aspect-ratio:1645/1175;object-fit:cover;object-position:center}




.detail figcaption .caption-with-credit{display:flex;justify-content:space-between;align-items:baseline;gap:16px;width:100%}
.detail figcaption .caption-with-credit .image-credit{margin-left:auto;text-align:right}

/* AVAT: equally sized concept and interior images. */
.detail-gallery.avat{align-items:start}
.detail-gallery.avat>figure:nth-child(n){grid-column:auto;min-width:0}
.detail-gallery.avat>figure img{display:block;width:100%;height:auto;aspect-ratio:1907/950;object-fit:cover}
.detail-gallery.avat img[src="assets/p11_002_1590x992.jpg"]{object-position:center 65%}

/* Campus Founders: elevation on a separate full-width row. */
.detail-gallery.coworking>figure:nth-child(2){grid-column:1/-1}

/* Award labels on individual project covers, matching the collages. */
.project-card .project-image{position:relative}
.project-cover-award{z-index:1;pointer-events:none}



/* Smaller office credits and roles across project views. */
.project-info .project-caption .office-credit{font-size:10px;line-height:1.5}
.detail .detail-head .detail-meta:has(.office-credit),.detail .detail-role{font-size:clamp(13px,1.2vw,17px);line-height:1.5;letter-spacing:normal}
.detail figcaption .collection-office-role{font-size:10px;line-height:1.5}

/* Office credits match project titles in size, with muted colour. */
.project-info .project-caption .office-credit{font-size:inherit;color:#74746e;line-height:inherit}
.detail .detail-head .detail-meta:has(.office-credit){font-size:clamp(28px,3.4vw,52px);font-weight:300;line-height:1.2;letter-spacing:-.025em;color:#74746e}
.detail figcaption .collection-office-role{font-size:inherit;color:#74746e}

/* Clearly subordinate office attribution to project title and award. */
.project-info .project-caption .office-credit,
.project-info .project-caption .office-credit bdi,
.detail .detail-head .detail-meta:has(.office-credit),
.detail .detail-head .detail-meta .office-credit,
.detail .detail-head .detail-meta .office-credit bdi,
.detail figcaption .collection-office-role{color:#999993!important}

/* Detail office attribution matches the project description text size. */
.detail .detail-head .detail-meta:has(.office-credit){font-size:var(--type-body);line-height:1.7;letter-spacing:normal;font-weight:300}

/* Project roles match the corresponding project title size. */
.detail .detail-role{font-size:clamp(28px,3.4vw,52px);line-height:1.2;letter-spacing:-.025em;font-weight:300}

/* Roles use exactly the project description typography size. */
.detail .detail-role,.detail figcaption .collection-role{font-size:var(--type-body);line-height:1.7;letter-spacing:normal;font-weight:300}

/* Four remaining homepage background images. */
.hero-film span{animation-duration:24s}
@keyframes heroFilm{0%{opacity:0;transform:scale(1.04)}6%{opacity:1}24%{opacity:1}30%{opacity:0;transform:scale(1.11)}100%{opacity:0;transform:scale(1.11)}}

/* Freiburg: interior visualization on its own full-width final row. */
.detail-gallery.office-scope>figure:last-child{grid-column:1/-1}

/* Collection roles match office attribution font size. */
.detail figcaption .collection-office-role.collection-role{font-size:inherit}

/* Emphasize project names and awards within collections. */
.detail-gallery.competitions figcaption>span:first-child{font-size:var(--type-body);line-height:1.5}

/* Award badges in previous/next project previews. */
.project-nav-card .project-image{position:relative}

/* Award badge on the main image inside each project. */
.detail-cover{position:relative}
.detail-cover>img{display:block;width:100%;max-height:85vh;object-fit:cover}
@media(max-width:640px){.detail-cover>img{max-height:none;height:auto}}

/* Deining: site plan and model side by side at equal height. */
.detail-gallery.buecherei-deining{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.detail-gallery.buecherei-deining>figure:nth-child(n){grid-column:auto;min-width:0}
.detail-gallery.buecherei-deining>figure:nth-child(n) img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;object-position:center;background:#fff}
@media(max-width:640px){.detail-gallery.buecherei-deining{grid-template-columns:1fr}}

/* Equal natural image heights, proportional widths, no padding or cropping. */
.detail-gallery.buecherei-deining{grid-template-columns:minmax(0,1.64313222fr) minmax(0,1.33333333fr)}
.detail-gallery.buecherei-deining>figure:nth-child(n) img{height:auto;aspect-ratio:auto;background:transparent}
@media(max-width:640px){.detail-gallery.buecherei-deining{grid-template-columns:1fr}}

/* Slightly larger site plan, preserving its complete image. */
@media(min-width:641px){.detail-gallery.buecherei-deining{grid-template-columns:minmax(0,1.9fr) minmax(0,1.33333333fr)}}

/* Deining: equal image heights using original image proportions. */
@media(min-width:641px){.detail-gallery.buecherei-deining{grid-template-columns:minmax(0,1.6431322208fr) minmax(0,1.3333333333fr)}}

/* Compact project previews below the main overview. */
#overview-project-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px 18px}
#overview-project-nav .project-nav-card{width:100%;max-width:none;min-width:0;gap:8px}
#overview-project-nav .project-nav-label{font-size:11px;line-height:1.45}
#overview-project-nav .collage-award{font-size:9px;padding:2px 4px;inset-inline-start:4px;bottom:4px}
@media(max-width:1000px){#overview-project-nav{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:640px){#overview-project-nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 10px}#overview-project-nav .project-nav-label{font-size:10px}}

/* One row of four project previews with paging arrows. */
#overview-project-nav{display:grid;grid-template-columns:36px minmax(0,1fr) 36px;gap:16px;align-items:start}
.overview-project-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;min-width:0}
#overview-project-nav .overview-arrow{width:36px;max-width:none;min-height:44px;padding:4px;font-size:26px;cursor:pointer}
@media(max-width:640px){#overview-project-nav{grid-template-columns:24px minmax(0,1fr) 24px;gap:6px}.overview-project-row{gap:8px}#overview-project-nav .overview-arrow{width:24px;font-size:20px}}

/* Compact overview carousel: images without captions. */
#overview-project-nav .project-nav-label{display:none}

/* Frame the preview row symmetrically and lead directly into About. */
#overview-project-nav{border-bottom:1px solid var(--line);padding-top:18px;padding-bottom:18px}
#projects{padding-bottom:0}
#about{border-top:0;padding-top:32px}

/* About label aligned with its main headline. */
#about .about-content{grid-column:2}
#about .about-label{margin:0 0 16px}
@media(max-width:900px){#about .about-content{grid-column:1}}

/* More space between the preview divider and About. */
#about{padding-top:100px}
@media(max-width:640px){#about{padding-top:72px}}

/* Intro service statement */
.intro-support{font-size:var(--type-body);line-height:1.6;margin:0 0 32px;max-width:100%;}
.intro h1{overflow-wrap:anywhere;}

/* Comfortable spacing between intro title lines */
.intro h1{line-height:1.12;}

.intro-support{font-size:26px;}
@media(max-width:640px){.intro-support{font-size:22px;}}

/* Bring the supporting sentence closer to the title */
.intro h1{margin-bottom:28px;}

/* Match experience sentence to the supporting headline */
.intro-meta .intro-stats{font-size:26px;line-height:1.6;}
.intro-stats .stat-number{font-size:inherit;}
@media(max-width:640px){.intro-meta .intro-stats{font-size:22px;}}

/* Emphasize the experience totals */
.intro-stats .stat-number{font-size:52px;}
@media(max-width:640px){.intro-stats .stat-number{font-size:44px;}}

/* Two experience lines in a wider, right-aligned block */
.intro-meta{width:max-content;max-width:100%;}
.intro-stats .stats-line{display:block;}
@media(min-width:901px){.intro-stats .stats-line{white-space:nowrap;}}

/* Lift the title group and leave more space before the experience totals */
.intro h1{margin-top:15px;}
.intro-support{margin-bottom:72px;}
@media(max-width:640px){.intro h1{margin-top:12px;}.intro-support{margin-bottom:62px;}}

/* Lower the experience block without moving the title */
.intro-meta{position:relative;top:28px;}