*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#080808;color:#f5f5f4;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;width:100%}::selection{background:#e6e6e6;color:#111}.topbar{height:94px;padding:0 3.2vw;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:4}.logo{font-size:28px;letter-spacing:-1.4px;font-weight:800}.topbar nav{display:flex;gap:35px;align-items:center}.topbar nav a{font-size:17px;font-weight:700;letter-spacing:-.35px;opacity:.65;transition:opacity .2s}.topbar nav a:hover,.topbar nav a.active{opacity:1}.page{padding:0 3.2vw}.page-intro{margin:74px 0 64px}.page-intro h1,.simple h1{font-size:clamp(88px,14vw,224px);font-weight:800;letter-spacing:-.085em;line-height:.87;margin:0 0 42px -9px}.dot{color:#f5f5f4}.page-intro p{font-size:clamp(17px,2vw,27px);line-height:1.3;letter-spacing:-.5px;max-width:740px;margin:0}.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;row-gap:74px}.work-card{display:block;min-width:0}.work-img{aspect-ratio:1.35;overflow:hidden;background:#151515;position:relative}.work-img img{height:100%;object-fit:cover;transition:transform .6s ease,opacity .3s ease}.work-card:hover img{transform:scale(1.035);opacity:.82}.card-view{position:absolute;right:18px;bottom:18px;background:#fafafa;color:#090909;padding:12px 14px;font-size:12px;font-weight:800;opacity:0;transform:translateY(8px);transition:.25s}.work-card:hover .card-view{opacity:1;transform:none}.work-caption{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding-top:17px}.work-caption h2{font-size:clamp(23px,2.25vw,34px);font-weight:800;line-height:1.03;letter-spacing:-1.3px;margin:0}.work-caption span{font-size:13px;line-height:1.3;text-align:right;color:#aaa}.site-footer{margin:140px 3.2vw 0;padding:25px 0 35px;display:flex;gap:15px;justify-content:space-between;border-top:1px solid #444;font-size:12px;font-weight:700;letter-spacing:.025em}.site-footer a{text-decoration:underline;text-underline-offset:4px}.detail{padding-top:60px}.project-title{margin-bottom:42px}.back{display:inline-block;font-weight:800;font-size:12px;margin-bottom:44px}.project-title h1{font-size:clamp(58px,9.5vw,152px);font-weight:800;line-height:.93;letter-spacing:-.077em;max-width:1400px;margin:0 0 32px -5px}.project-title p{font-size:clamp(19px,2.05vw,30px);line-height:1.22;max-width:840px;margin:0;color:#d7d7d7}.project-lead{margin:0}.project-lead img{width:100%;max-height:880px;object-fit:cover}.project-description{display:grid;grid-template-columns:1fr 1.55fr;gap:7vw;padding:100px 0 118px}.project-facts{display:grid;align-content:start;gap:22px}.project-facts div{display:grid;grid-template-columns:110px 1fr;gap:14px}.project-facts small{font-size:11px;font-weight:800;color:#9e9e9e}.project-facts span{font-size:15px;line-height:1.35}.project-story h2{font-size:clamp(30px,3vw,48px);font-weight:800;letter-spacing:-1.8px;margin:0 0 25px}.project-story p{font-size:clamp(17px,1.65vw,23px);line-height:1.46;color:#ddd;margin:0}.project-story h3{margin:40px 0 12px;font-size:13px;text-transform:uppercase}.project-story .scope{font-size:17px}.project-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}.gallery-shot{margin:0;min-width:0}.gallery-shot.wide{grid-column:1/-1}.gallery-shot img{max-height:990px;object-fit:contain;background:#161616}.gallery-shot figcaption{font-size:11px;letter-spacing:.02em;color:#888;margin:12px 0 24px;text-transform:uppercase}.publications{margin:120px 0 100px;max-width:850px}.publications h2{font-size:32px;letter-spacing:-1px}.publications a{display:flex;justify-content:space-between;padding:18px 0;font-size:18px;border-bottom:1px solid #555}.next-project{padding:45px 0 80px;border-top:1px solid #555}.next-project>span{display:block;font-size:12px;font-weight:800;margin-bottom:20px}.next-project a{font-size:clamp(44px,6vw,95px);font-weight:800;letter-spacing:-.06em}.simple{min-height:calc(100vh - 230px);padding-top:90px}.about-columns{display:grid;grid-template-columns:1fr 1fr;gap:11vw;margin:70px 0 120px}.large-copy{font-size:clamp(32px,4vw,61px);letter-spacing:-.055em;line-height:1.05;font-weight:800;margin:0}.prose p{font-size:19px;line-height:1.5;color:#d7d7d7}.prose h2{font-size:24px;margin-top:60px}.info-line{padding:18px 0;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #555;font-size:15px}.contact>p{font-size:24px}.big-email{display:block;font-size:clamp(34px,5.7vw,94px);font-weight:800;letter-spacing:-.062em;word-break:break-word;margin:90px 0 20px}.contact .smallprint{font-size:15px;color:#aaa}@media(max-width:750px){.topbar{height:76px;padding:0 20px}.logo{font-size:22px}.topbar nav{gap:18px}.topbar nav a{font-size:14px}.page{padding:0 20px}.page-intro{margin:70px 0 45px}.page-intro h1,.simple h1{font-size:clamp(76px,19vw,130px);margin-left:-4px}.work-grid{grid-template-columns:1fr;row-gap:47px}.work-img{aspect-ratio:1.3}.work-caption{display:block}.work-caption span{display:block;text-align:left;margin-top:9px}.site-footer{margin:85px 20px 0;flex-wrap:wrap;font-size:10px}.detail{padding-top:35px}.project-title h1{font-size:clamp(56px,12vw,90px)}.project-title p{font-size:20px}.project-description{display:block;padding:65px 0}.project-facts{margin-bottom:58px}.project-gallery{gap:9px}.gallery-shot.half,.gallery-shot.wide{grid-column:1/-1}.gallery-shot figcaption{margin:10px 0 14px}.about-columns{display:block}.large-copy{margin:0 0 75px}.contact{padding-top:65px}.big-email{margin:70px 0}}

/* V3 — editorial motion & direct image exploration */
#reading-progress{position:fixed;left:0;top:0;height:2px;background:#f5f5f4;width:0;z-index:50;transition:width .08s linear}
.topbar{position:sticky;top:0;background:rgba(8,8,8,.91);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);z-index:15;border-bottom:1px solid rgba(255,255,255,.07)}
.topbar nav a{position:relative;padding:9px 0}.topbar nav a::after{content:'';position:absolute;bottom:3px;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .28s}.topbar nav a:hover::after,.topbar nav a.active::after{transform:scaleX(1)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.25,1);transition-delay:var(--stagger,0ms)}.reveal.visible{opacity:1;transform:none}
.work-img::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.20),transparent 45%);pointer-events:none;opacity:.7}
.work-card{cursor:pointer}.work-card:focus-visible,.back:focus-visible,.zoom-target:focus-visible,.lb-close:focus-visible,.lb-prev:focus-visible,.lb-next:focus-visible{outline:2px solid #fff;outline-offset:5px}
.work-index{position:absolute;top:20px;left:20px;padding:7px 9px;font-size:12px;font-weight:700;color:white;background:rgba(0,0,0,.45);z-index:1}
.card-view{z-index:2;right:50%;bottom:50%;transform:translate(50%,50%) scale(.92);background:#fff;color:#111;border-radius:100px;min-width:111px;height:111px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;font-size:12px;letter-spacing:.03em;box-shadow:0 5px 25px rgba(0,0,0,.15)}.card-view span{font-size:22px;margin-top:4px}
.work-card:hover .card-view,.work-card:focus-visible .card-view{opacity:1;transform:translate(50%,50%) scale(1)}.work-card:hover .work-img img{transform:scale(1.045);opacity:.72}
.work-caption h2{transition:opacity .3s}.work-card:hover .work-caption h2{opacity:.75}
.zoom-target{position:relative;display:block;width:100%;padding:0;background:#141414;border:0;color:#fff;cursor:zoom-in;overflow:hidden;text-align:left}.zoom-target img{transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .6s}.zoom-target:hover img{transform:scale(1.018);filter:brightness(.85)}.zoom-hint{position:absolute;bottom:23px;right:23px;background:#f6f6f3;color:#111;padding:11px 14px;font-size:11px;letter-spacing:.06em;font-weight:800;opacity:0;transform:translateY(7px);transition:.3s}.zoom-target:hover .zoom-hint,.zoom-target:focus-visible .zoom-hint{opacity:1;transform:none}
.project-lead{margin:0}.project-lead .zoom-target img{width:100%;max-height:880px;object-fit:cover}.gallery-shot figcaption{display:flex;gap:15px;justify-content:space-between}.gallery-shot figcaption span{color:#555}
body.modal-open{overflow:hidden}.lightbox{position:fixed;inset:0;z-index:1000;background:rgba(5,5,5,.98);color:white;display:grid;grid-template-columns:75px minmax(0,1fr) 75px;grid-template-rows:76px minmax(0,1fr);padding:0 22px 26px;animation:lb-in .25s ease}.lb-top{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #383838;gap:30px}.lb-project{font-size:14px;font-weight:800}.lightbox button{background:transparent;border:0;color:inherit;cursor:pointer;font:inherit}.lb-close{font-size:12px;font-weight:800;letter-spacing:.06em;padding:12px 0}.lb-prev,.lb-next{font-size:31px;align-self:center;justify-self:center;width:55px;height:70px;transition:transform .2s}.lb-prev:hover{transform:translateX(-6px)}.lb-next:hover{transform:translateX(6px)}.lb-media{min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px}.lb-media img{max-width:100%;height:auto;max-height:calc(100vh - 168px);width:auto;object-fit:contain}.lb-counter{font-size:12px;letter-spacing:.15em;color:#aaa}@keyframes lb-in{from{opacity:0}to{opacity:1}}
@media(hover:none){.card-view{display:none}.zoom-hint{opacity:1;transform:none;padding:8px 10px;font-size:10px}.work-card:hover .work-img img{transform:none;opacity:1}}
@media(max-width:750px){.topbar{height:70px}.card-view{min-width:77px;height:77px}.lightbox{padding:0 6px 16px;grid-template-columns:40px minmax(0,1fr) 40px;grid-template-rows:65px minmax(0,1fr)}.lb-prev,.lb-next{width:38px;font-size:24px}.lb-project{font-size:11px}.gallery-shot figcaption span{font-size:9px}.zoom-hint{right:10px;bottom:10px}.work-index{top:10px;left:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}.reveal{opacity:1;transform:none}}

/* V4 — Swiss editorial typographic system, carefully scaled */
/* Suisse Intl resolves from local installation; see FONT_SETUP.txt for public web deployment. */
:root{--font-swiss:"Suisse Intl","SuisseIntl","Helvetica Neue",Helvetica,Arial,sans-serif;--page-gap:clamp(18px,2.25vw,38px)}
body{font-family:var(--font-swiss);font-weight:400;letter-spacing:-.012em;background:#070707;color:#f3f3f0}
.topbar{height:65px;padding:0 var(--page-gap);background:rgba(7,7,7,.96)}
.logo{font-family:var(--font-swiss);font-size:13px;line-height:1;font-weight:600;letter-spacing:-.014em}
.topbar nav{gap:clamp(19px,2.1vw,35px)}
.topbar nav a{font-family:var(--font-swiss);font-size:13px;font-weight:400;letter-spacing:-.008em;opacity:.78}
.topbar nav a.active{opacity:1}.topbar nav a::after{bottom:5px}
.page{padding-inline:var(--page-gap)}
.page-intro{margin:clamp(50px,6.7vw,105px) 0 clamp(38px,4.1vw,68px)}
.page-intro h1,.simple h1{font-size:clamp(46px,5.2vw,79px);font-weight:500;letter-spacing:-.052em;line-height:.99;margin:0 0 23px -2px}
.page-intro p{font-size:clamp(14px,1.12vw,17px);line-height:1.5;letter-spacing:-.008em;max-width:520px;color:#b7b7b5}
.work-grid{column-gap:clamp(10px,1.3vw,22px);row-gap:clamp(37px,4vw,70px)}
.work-img{aspect-ratio:1.44}
.work-img img,.work-img video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .45s ease,filter .6s}
.work-img .card-video{background:#0a0a0a}
.work-card:hover .work-img video{transform:scale(1.045);opacity:.72}

.work-caption{padding-top:13px;align-items:start}
.work-caption h2{font-size:clamp(17px,1.56vw,23px);font-weight:500;letter-spacing:-.035em;line-height:1.19}
.work-caption span{font-size:12px;letter-spacing:0;color:#9b9b9a}
.work-index{font-size:11px;font-weight:500;padding:5px 7px;top:13px;left:13px}
.card-view{min-width:84px;height:84px;font-weight:500;font-size:11px;letter-spacing:.02em}
.card-view span{font-size:19px}
.detail{padding-top:clamp(30px,5vw,72px)}
.project-title{margin-bottom:32px}
.back{font-size:11px;font-weight:500;letter-spacing:.02em;margin-bottom:clamp(33px,4vw,62px)}
.project-title h1{font-size:clamp(40px,4.9vw,79px);font-weight:500;letter-spacing:-.055em;line-height:1.03;margin:0 0 22px -2px;max-width:1160px}
.project-title p{font-size:clamp(16px,1.5vw,22px);line-height:1.38;letter-spacing:-.018em;max-width:730px}
.project-lead .zoom-target img{max-height:760px}
.project-description{padding:clamp(55px,7.2vw,106px) 0 clamp(68px,8vw,120px)}
.project-facts small{font-size:11px;font-weight:500;letter-spacing:.01em}
.project-facts span{font-size:13px}
.project-story h2{font-size:clamp(23px,2.4vw,36px);font-weight:500;letter-spacing:-.04em;margin-bottom:22px}
.project-story p{font-size:clamp(15px,1.18vw,18px);line-height:1.55;letter-spacing:-.008em}
.project-story h3{font-size:11px;font-weight:500}.project-story .scope{font-size:15px}
.gallery-shot figcaption{font-size:10px;letter-spacing:.025em;font-weight:400}
.publications h2{font-size:24px;font-weight:500;letter-spacing:-.035em}
.publications a{font-size:15px}
.next-project>span{font-size:11px;font-weight:500}.next-project a{font-size:clamp(29px,4.5vw,65px);font-weight:500;letter-spacing:-.05em}
.simple{padding-top:clamp(60px,7vw,100px)}
.simple h1{margin-bottom:20px}
.large-copy{font-size:clamp(24px,2.85vw,43px);font-weight:500;letter-spacing:-.045em;line-height:1.18}
.prose p{font-size:16px;line-height:1.6}.prose h2{font-size:20px;font-weight:500}
.contact>p{font-size:16px}
.big-email{font-size:clamp(26px,4vw,59px);font-weight:500;letter-spacing:-.05em}
.site-footer{margin-inline:var(--page-gap);font-size:11px;font-weight:400}
.lb-project,.lb-close{font-size:12px;font-weight:500}.zoom-hint{font-size:10px;font-weight:500}
@media(max-width:750px){
 .topbar{height:59px;padding:0 18px}.logo{font-size:12px}.topbar nav{gap:18px}.topbar nav a{font-size:12px}
 .page{padding-inline:18px}.page-intro{margin:57px 0 40px}.page-intro h1,.simple h1{font-size:clamp(45px,12vw,62px);margin-left:0;margin-bottom:17px}
 .page-intro p{font-size:14px}.work-grid{row-gap:38px}.work-caption{padding-top:11px}.work-caption h2{font-size:19px}
 .work-caption span{font-size:12px;margin-top:6px}.work-index{top:10px;left:10px}
 .detail{padding-top:26px}.back{margin-bottom:35px}.project-title h1{font-size:clamp(39px,9.7vw,61px)}.project-title p{font-size:16px}
 .project-description{padding:53px 0 67px}.project-facts{margin-bottom:42px}.project-story h2{font-size:26px}
 .large-copy{font-size:30px}.big-email{font-size:clamp(25px,7vw,42px)}
 .site-footer{margin:75px 18px 0}
}


.project-section{margin-top:3.5rem}.project-section-header{margin:0 0 1.25rem;display:flex;flex-direction:column;gap:.45rem}.project-section-header h2{font-size:clamp(1.5rem,2vw,2rem);margin:0}.project-section-header p{margin:0;max-width:70ch;color:rgba(255,255,255,.72);line-height:1.6}.project-section .project-gallery{margin-top:0}
/* V12: concise project overview and horizontally wrapped scope labels */
.project-description{grid-template-columns:minmax(260px,.78fr) minmax(0,1.5fr);gap:clamp(24px,5vw,88px)}
.project-facts{gap:17px}.project-facts div{grid-template-columns:90px 1fr;gap:12px}
.project-story h3{margin:25px 0 12px;font-size:11px;font-weight:500;color:#aaa}
.scope-tags{display:flex;flex-wrap:wrap;align-items:center;gap:9px 11px}
.scope-tags span{font-size:12px;font-weight:400;padding:9px 12px;border:1px solid #5a5a5a;border-radius:2px;line-height:1.2}
@media(max-width:750px){.project-description{display:block}.scope-tags span{font-size:11px;padding:8px 10px}}

/* Manno case study: preserve native image dimensions and use curated 2-column editorial gallery. */
.detail-editorial .project-lead { background:#161616; display:flex; justify-content:center; }
.detail-editorial .project-lead .zoom-target { background:#161616; max-height:770px; }
.detail-editorial .project-lead .zoom-target img { width:100%;height:auto;max-height:770px;object-fit:contain; object-position:center; }
.detail-editorial .project-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;}
.detail-editorial .gallery-shot{min-width:0;}
.detail-editorial .gallery-shot .zoom-target{background:#151515;}
.detail-editorial .gallery-shot img { width:100%;height:auto;max-height:none;object-fit:contain;object-position:center; }
.detail-editorial .gallery-shot.wide{grid-column:1/-1;}
.detail-editorial .gallery-shot.wide img{max-height:880px;width:100%;object-fit:contain;}
.detail-editorial .gallery-shot.portrait{grid-column:span 1;}
@media(max-width:750px){
 .detail-editorial .project-gallery{gap:10px;}
 .detail-editorial .gallery-shot.half{grid-column:1/-1;}
 .detail-editorial .project-lead .zoom-target img{max-height:560px;}
}

/* V14: Manno logo card on a clear white ground, never cropped */
.work-card.manno-work-card .work-img{background:#fff!important;display:flex;align-items:center;justify-content:center}
.work-card.manno-work-card .work-img>img{width:68%!important;height:60%!important;max-width:68%;max-height:60%;object-fit:contain!important;object-position:center!important;filter:none!important;opacity:1!important}
.work-card.manno-work-card:hover .work-img>img{transform:scale(1.025)!important}
/* Beymen editorial: contain brand-presentation plates; image gallery remains full-width responsive */
.detail-editorial .gallery-shot img{object-fit:contain}
@media(max-width:700px){.work-card.manno-work-card .work-img>img{width:73%!important;max-width:73%}}


/* V15: cropped full-width hero banners for selected project pages */
.project-lead.hero-crop .zoom-target{aspect-ratio:var(--lead-aspect,1.95);max-height:none!important}
.project-lead.hero-crop .zoom-target img{width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;object-position:var(--lead-pos,center)!important}
.detail-editorial .project-lead.hero-crop{background:#111;display:block}
.detail-editorial .project-lead.hero-crop .zoom-target{background:#111;max-height:none!important}
.detail-editorial .project-lead.hero-crop .zoom-target img{width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;object-position:var(--lead-pos,center)!important}
@media(max-width:900px){.project-lead.hero-crop .zoom-target{aspect-ratio:1.5}}
@media(max-width:700px){.project-lead.hero-crop .zoom-target{aspect-ratio:1.25}}
