@import url('https://fonts.googleapis.com/css2?family=Zalando+Sans:wght@200..900&display=swap');
:root{color-scheme:dark;--bg:#0a0a0a;--panel:#101010;--ink:#f2f0ed;--muted:#aaa8a5;--line:#ffffff24}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Zalando Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
.project-shell a,.project-closing a{color:inherit;text-decoration:none}
.project-shell a:focus-visible,.project-closing a:focus-visible{outline:2px solid #fff;outline-offset:5px}
.project-shell{width:min(calc(100% - clamp(36px,6vw,112px)),1600px);margin-inline:auto}
.eyebrow,.projects-list__top,.project-card__number,.project-card__type,.case-topline,.case-meta dt,.case-section h2,.case-gallery figcaption,.project-next span,.project-closing__eyebrow{font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase}
.eyebrow{display:flex;align-items:center;gap:13px;color:var(--muted)}
.eyebrow::before{content:'';width:26px;height:1px;background:#f2f0ed}
.project-button{display:inline-flex;align-items:center;justify-content:space-between;gap:42px;min-height:49px;padding:13px 17px;border:1px solid rgba(255,255,255,.7);font-size:11px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;transition:background .25s,color .25s}
.project-button:hover{background:#f2f0ed;color:#0a0a0a}
.project-button span{font-size:18px;line-height:1}
.projects-hero.project-shell{width:100%;max-width:none;display:grid;grid-template-columns:1fr 1fr;min-height:100svh;border-bottom:1px solid var(--line)}
.projects-hero__copy-wrap{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:120px clamp(30px,7.3vw,140px) 80px clamp(36px,8vw,150px)}
.projects-hero h1{max-width:10ch;margin:34px 0 22px;font-size:clamp(48px,5.2vw,86px);font-weight:400;line-height:.98;letter-spacing:-.055em}
.projects-hero__copy{max-width:36ch;margin:0 0 35px;color:var(--muted);font-size:clamp(14px,1.1vw,17px);line-height:1.6}
.projects-hero__image{min-height:100%;border-left:1px solid var(--line);overflow:hidden;background:#161616}
.projects-hero__image img{width:100%;height:100%;object-fit:cover}
.projects-list{padding-block:clamp(64px,7vw,116px) clamp(88px,10vw,160px)}
.projects-list__top{display:flex;justify-content:space-between;gap:20px;padding-bottom:22px;color:var(--muted)}
.project-card{display:grid;grid-template-columns:1.12fr .88fr;min-height:clamp(420px,45vw,650px);border-top:1px solid var(--line);overflow:hidden}
.project-card:last-child{border-bottom:1px solid var(--line)}
.project-card__image{height:100%;min-height:420px;overflow:hidden;background:#181818}
.project-card__image img{width:100%;height:100%;object-fit:cover;filter:saturate(.85);transition:transform .65s ease,filter .65s ease}
.project-card:hover .project-card__image img{transform:scale(1.035);filter:saturate(1)}
.project-card__body{display:flex;flex-direction:column;padding:clamp(30px,4.5vw,74px);background:var(--panel)}
.project-card__number{color:var(--muted)}
.project-card__bottom{margin-top:auto}
.project-card__type{color:var(--muted)}
.project-card h2{max-width:12ch;margin:18px 0 20px;font-size:clamp(40px,3.8vw,66px);font-weight:400;line-height:1;letter-spacing:-.05em}
.project-card p{max-width:36ch;margin:0;color:var(--muted);font-size:14px;line-height:1.6}
.project-card__link{display:inline-flex;align-items:center;gap:35px;margin-top:39px;padding-bottom:9px;border-bottom:1px solid #ffffff75;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.project-card__link span{font-size:19px;line-height:1;transition:transform .25s}
.project-card:hover .project-card__link span{transform:translate(4px,-4px)}
.project-card:nth-of-type(even) .project-card__image{order:2}
.project-card:nth-of-type(even) .project-card__body{order:1}
main.project-shell{padding-top:100px}
.case-topline{display:flex;justify-content:space-between;gap:20px;padding:28px 0 22px;border-bottom:1px solid var(--line);color:var(--muted)}
.case-topline a:hover{color:#fff}
.case-layout{display:grid;grid-template-columns:minmax(330px,42fr) minmax(0,58fr);gap:clamp(28px,4vw,72px);align-items:start;padding-bottom:clamp(88px,10vw,150px)}
.case-intro{position:sticky;top:104px;padding:clamp(34px,4vw,68px) 0 32px}
.case-intro h1{max-width:10ch;margin:24px 0 23px;font-size:clamp(43px,4.2vw,72px);font-weight:400;line-height:1;letter-spacing:-.052em}
.case-intro__lead{max-width:40ch;margin:0 0 27px;color:#ddd9d5;font-size:clamp(15px,1.18vw,18px);line-height:1.5}
.case-meta{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0;padding:15px 0 21px;border-top:1px solid var(--line)}
.case-meta dt,.case-section h2{color:#8e8d8a}
.case-meta dd{margin:8px 0 0;font-size:13px;line-height:1.4}
.case-section{padding-top:16px;border-top:1px solid var(--line)}
.case-section h2{margin:0 0 10px}
.case-section p{max-width:49ch;margin:0 0 16px;color:var(--muted);font-size:13px;line-height:1.55}
.case-intro__cta{display:inline-flex;align-items:center;gap:26px;margin-top:10px;padding:12px 0;border-bottom:1px solid #ffffff8c;font-size:11px;font-weight:500;letter-spacing:.13em;text-transform:uppercase}
.case-intro__cta span{font-size:17px}
.case-gallery{display:grid;gap:clamp(24px,3vw,44px);padding-top:clamp(38px,5vw,80px)}
.case-gallery figure{margin:0;background:#181818}
.case-gallery img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.case-gallery figure:nth-child(2) img{aspect-ratio:3/4}
.case-gallery figure:nth-child(3) img{aspect-ratio:16/10}
.case-gallery figcaption{display:flex;justify-content:space-between;gap:20px;padding:13px 0 0;color:#898885}
.case-gallery__note{margin:0;color:#82817e;font-size:11px;letter-spacing:.04em}
.project-next{display:flex;justify-content:space-between;align-items:end;gap:30px;padding:57px 0 87px;border-top:1px solid var(--line)}
.project-next span{display:block;margin-bottom:13px;color:var(--muted)}
.project-next a{display:inline-block;font-size:clamp(32px,4vw,64px);font-weight:400;line-height:1.05;letter-spacing:-.05em}
.project-next a:last-child{font-size:11px;font-weight:500;letter-spacing:.13em;text-transform:uppercase}
.project-next a:hover{color:#c8c4bf}
@media(max-width:900px){.projects-hero.project-shell{grid-template-columns:1fr;min-height:0}.projects-hero__copy-wrap{min-height:56svh;padding:135px 6vw 80px}.projects-hero__image{height:50svh;min-height:380px;border-left:0;border-top:1px solid var(--line)}.case-layout{grid-template-columns:1fr}.case-intro{position:static;padding-bottom:0}.case-gallery{padding-top:10px}.case-intro h1{max-width:none}.project-card{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.project-shell{width:calc(100% - 36px)}.projects-hero__copy-wrap{min-height:560px;padding:130px 22px 65px}.projects-hero h1{font-size:clamp(48px,13vw,72px)}.projects-hero__image{height:56svh;min-height:280px}.projects-list{padding-top:66px}.project-card{display:flex;flex-direction:column}.project-card__image,.project-card:nth-of-type(even) .project-card__image{order:0;height:65vw;min-height:260px}.project-card__body,.project-card:nth-of-type(even) .project-card__body{order:1;min-height:320px}.project-card h2{font-size:clamp(40px,11vw,58px)}main.project-shell{padding-top:83px}.case-topline{font-size:10px}.case-intro{padding-top:42px}.case-intro h1{font-size:clamp(45px,12vw,64px)}.case-meta{grid-template-columns:1fr 1fr}.project-next{align-items:start;flex-direction:column}.project-closing__bottom{flex-direction:column;text-align:center;align-items:center;line-height:1.6}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.project-card__image img,.project-card__link span{transition:none}}

/* Projects follow the service-page grid and About's editorial hierarchy. */
.project-shell{width:min(calc(100% - clamp(48px,8vw,128px)),1600px)}
.eyebrow{font-size:10px;font-weight:400;line-height:1.6;letter-spacing:.18em}
.eyebrow::before{display:none}
.projects-hero.project-shell{min-height:100svh;grid-template-columns:1fr 1fr}
.projects-hero__copy-wrap{padding:130px clamp(24px,3.5vw,42px) 85px}
.projects-hero h1{max-width:26ch;margin:14px 0 20px;font-size:clamp(1.8rem,3.2vw,3rem);font-weight:500;line-height:1.08;letter-spacing:-.03em}
.projects-hero__copy{font-size:clamp(13px,.95vw,15px);line-height:1.55;color:#c9c9c9;max-width:38ch;margin-bottom:32px}
.projects-hero__image{display:flex;flex-direction:column;justify-content:center;gap:16px;margin:0;padding:120px clamp(24px,3.5vw,42px) 70px;min-width:0;min-height:0;background:transparent}
.projects-hero__image img{height:62svh;min-height:300px;max-height:680px;object-fit:cover}
.projects-hero__image figcaption{display:flex;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#969593;line-height:1.6}
.project-button{border-radius:6px;font-size:10px;font-weight:700;gap:36px;min-height:48px;padding:0 18px;letter-spacing:.13em;border-color:#ffffff80}
.projects-list__top{display:grid;grid-template-columns:minmax(140px,.42fr) minmax(0,1.58fr);gap:clamp(28px,5vw,100px);padding-bottom:64px}
.projects-list__top>span{padding-top:12px;font-size:10px}
.projects-list__top h2{margin:0;color:#f2f0ed;font-size:clamp(30px,3.25vw,58px);font-weight:450;line-height:1.04;letter-spacing:-.045em;text-transform:none}
.projects-list__top p{margin:24px 0 0;font-size:14px;line-height:1.7;letter-spacing:0;text-transform:none}
.project-card{grid-template-columns:minmax(0,1.58fr) minmax(0,1fr);min-height:0;padding:42px 0;gap:clamp(28px,5vw,80px);overflow:visible}
.project-card__image{height:auto;min-height:0;aspect-ratio:4/3}
.project-card__image img{filter:none}
.project-card__body{padding:10px 0;background:transparent}
.project-card__bottom{margin-block:auto;padding-top:42px}
.project-card__number,.project-card__type{font-size:10px;font-weight:400;color:#969593}
.project-card h2{font-size:clamp(28px,2.7vw,45px);line-height:1.06;letter-spacing:-.035em;font-weight:450}
.project-card p{font-size:14px;line-height:1.7}
.project-card__link{font-size:10px;font-weight:500;letter-spacing:.13em;margin-top:28px}
.project-card:nth-of-type(even) .project-card__image,.project-card:nth-of-type(even) .project-card__body{order:initial}
.case-intro{padding-top:38px;top:84px}
.case-intro h1{font-size:clamp(30px,3.1vw,60px);line-height:1.12;letter-spacing:-.045em;font-weight:400;margin:22px 0}
.case-intro__lead{font-size:clamp(13px,1.05vw,16px);line-height:1.65;color:#aaa8a5}
.case-gallery{padding-top:38px}
.case-section h2,.case-meta dt{font-size:10px;font-weight:400}
.case-intro__cta{border:1px solid #ffffff80;border-radius:6px;padding:15px 18px;font-size:10px;font-weight:700;gap:36px}
.case-intro__cta:hover{background:#fff;color:#111}
.project-next>div>a{font-size:clamp(28px,3.25vw,58px);font-weight:450;letter-spacing:-.045em;text-transform:none}
.pw6-final-cta a{color:inherit;text-decoration:none}
.pw6-final-cta .pw-btn:hover{color:#111}
@media(max-width:900px){
 .projects-hero.project-shell{grid-template-columns:1fr;min-height:0}
 .projects-hero__copy-wrap{min-height:0;padding:150px 24px 65px}
 .projects-hero__image{height:auto;padding:30px 24px 42px;border-left:0;min-height:0}
 .projects-hero__image img{height:52svh;min-height:280px}
 .project-card{grid-template-columns:1.2fr 1fr;gap:30px}
 .project-card__bottom{padding-top:24px}
 .case-intro{position:static}
}
@media(max-width:680px){
 .project-shell{width:calc(100% - 48px)}
 .projects-hero h1{font-size:clamp(28px,7.5vw,36px)}
 .projects-list__top{grid-template-columns:1fr;gap:24px;padding-bottom:38px}
 .projects-list__top h2{font-size:clamp(27px,7vw,36px)}
 .project-card{display:flex;gap:24px;padding:28px 0 40px}
 .project-card__image,.project-card:nth-of-type(even) .project-card__image{width:100%;height:auto;min-height:0;aspect-ratio:4/3;order:0}
 .project-card__body,.project-card:nth-of-type(even) .project-card__body{min-height:0;order:1;padding:0}
 .project-card__bottom{padding-top:20px}
 .project-card h2{font-size:29px;margin:12px 0 16px}
 .case-intro h1{font-size:clamp(28px,7.5vw,36px)}
 .case-topline{font-size:9px;letter-spacing:.12em}
 .case-gallery figcaption{font-size:9px;letter-spacing:.08em}
 .pw6-final-cta{padding-inline:24px}
 .pw6-final-cta__inner{width:100%}
 .pw6-final-cta__info{flex-direction:column;gap:30px}
 .pw6-final-cta__button{font-size:11px;padding-inline:18px;gap:20px;min-height:54px}
}