@font-face{font-family:Inter;src:url('assets/fonts/Inter-Regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('assets/fonts/Inter-Medium.woff2') format('woff2');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url('assets/fonts/Inter-Bold.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
:root{--paper:#f6f7f0;--ink:#181818;--chrome:#181818;--edge:clamp(20px,1.85vw,38px);--header-height:74px;font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
html{scrollbar-gutter:stable;scroll-behavior:auto}
body{margin:0;background:var(--paper);min-width:300px}
body.on-dark{--chrome:#fff}
body,button,input,textarea{font-family:Inter,Arial,sans-serif}
button,input,textarea{font-size:inherit}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
img{display:block;max-width:100%}
[hidden]{display:none!important}
*:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.skip-link{position:fixed;z-index:100;left:16px;top:-100px;background:#fff;color:#111;padding:12px;transition:top .15s}
.skip-link:focus{top:12px}

/* The persistent masthead and Instagram link belong to every screen. */
.site-header{position:fixed;z-index:40;top:0;left:0;right:0;padding:26px var(--edge) 0;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--chrome);font-size:clamp(11px,.7vw,15px);line-height:1.1;transition:color .18s ease}
.brand{white-space:nowrap;letter-spacing:-.025em}
.brand strong{font-weight:700}
.main-nav{display:flex;align-items:center;gap:clamp(18px,2.6vw,55px)}
.main-nav a,.language-switch{white-space:nowrap}
.main-nav a:hover,.site-footer a:hover,.projects-end a:hover,.back-projects:hover{text-decoration:underline;text-underline-offset:4px}
.language-switch{appearance:none;border:0;background:transparent;padding:0;color:inherit;display:inline-flex;align-items:center;gap:.38em;font-size:inherit;font-weight:400}
.language-switch .slash{opacity:.85}
.language-switch .current{font-weight:700}
.site-footer{position:fixed;bottom:clamp(18px,2.5vh,29px);left:var(--edge);z-index:40;color:var(--chrome);font-size:clamp(10px,.63vw,13px);letter-spacing:-.015em;transition:color .18s ease}

/* In a single scroll, each 100vh layer rises over a fixed-looking earlier one. */
.sticky-panel{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.intro-cover{z-index:1;display:grid;place-items:center;background:var(--paper)}
.intro-text{width:min(950px,73vw);max-width:95%;text-align:center;transform:translateY(-2vh)}
.intro-text h1{font-size:clamp(36px,3.3vw,72px);line-height:1;letter-spacing:-.045em;margin:0 0 clamp(32px,3.8vw,75px);font-weight:700}
.intro-text p{font-size:clamp(13px,.92vw,18px);line-height:1.3;letter-spacing:-.015em;margin:0 auto .75em;max-width:860px}
.country-note{display:flex;align-items:center;justify-content:center;gap:21px;margin-top:clamp(45px,5.7vw,115px);font-size:clamp(12px,.9vw,17px);line-height:1.18;letter-spacing:-.015em;text-align:center}
.curve{font-size:1.65em;font-weight:400;line-height:1}
.intro-image{z-index:2;background:#3b2a1c;color:white}
.intro-image>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.country-note-image{position:absolute;bottom:16.2%;width:100%;left:0;margin:0;color:white;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.projects-overview{position:relative;z-index:3;background:var(--paper);isolation:isolate}
.projects-row{min-height:100vh;min-height:100svh;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:clamp(85px,14vw,310px);width:min(72vw,1420px);margin:0 auto;padding:clamp(110px,12vh,180px) 0 clamp(85px,10vh,150px)}
.project-tile{display:block;min-width:0;transition:opacity .22s ease}
.project-tile:hover{opacity:.87}
.project-tile img{width:100%;aspect-ratio:1/1;object-fit:cover}
.tile-caption{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-top:clamp(16px,1.5vw,28px);font-size:clamp(12px,.88vw,17px);line-height:1.2;letter-spacing:-.025em}
.tile-caption strong{font-weight:700;white-space:nowrap}
.tile-caption span{text-align:right}
.projects-end{min-height:24vh;display:flex;align-items:center;justify-content:center;padding:50px 20px 110px}
.projects-end a{font-size:clamp(11px,.73vw,14px);letter-spacing:.05em}
body[data-view="projects"] .intro-cover,body[data-view="projects"] .intro-image{display:none}

/* Six detail screens share one static text area and a changing image only. */
.detail-view{background:var(--paper);min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:100px var(--edge) 90px}
.detail-layout{width:min(82vw,1560px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:clamp(60px,8.7vw,205px);align-items:center}
.project-media{position:relative;aspect-ratio:.97;min-width:0;background:var(--paper)}
.project-media img{width:100%;height:100%;object-fit:cover;transition:opacity .22s ease}
.project-media img.plan{object-fit:contain}
.gallery-controls{position:absolute;bottom:16px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:4px;z-index:2}
.gallery-square{display:inline-flex;width:11px;height:11px;padding:0;border:1.4px solid #181818;background:rgba(246,247,240,.95);border-radius:0;box-shadow:0 0 0 1px rgba(246,247,240,.3)}
.gallery-square[aria-pressed="true"]{background:#111}
.gallery-square:focus-visible{outline-offset:3px}
.project-description{align-self:center;font-size:clamp(12px,.78vw,15.5px);line-height:1.39;letter-spacing:-.005em;max-width:690px}
.project-description h1{margin:0;font-size:1.12em;font-weight:700;line-height:1.2;letter-spacing:-.015em}
.project-facts{white-space:pre-line;margin:.14em 0 clamp(32px,3.6vw,74px);line-height:1.38}
.project-paragraphs p{margin:0 0 1.65em}
.project-paragraphs p:last-child{margin-bottom:0}

/* The contact sheet reproduces the updated PDF, including its send square. */
.contact-view{background:var(--paper);position:relative;min-height:100vh;min-height:100svh;padding:clamp(165px,22vh,265px) max(var(--edge),5.2vw) 110px;overflow:hidden}
.contact-layout{display:grid;grid-template-columns:minmax(230px,280px) minmax(0,600px);gap:clamp(50px,6vw,145px);align-items:start;position:relative;z-index:2}
.contact-identity{font-size:clamp(13px,.91vw,18px);line-height:1.31;letter-spacing:-.025em}
.contact-identity h1{font-size:1em;font-weight:400;margin:0 0 18px}
.contact-identity h1 strong{font-weight:700}
.contact-identity>p{margin:0}
.contact-identity address{font-style:normal;margin-top:clamp(65px,9vh,115px)}
.contact-identity address div+div{margin-top:20px}
.contact-form{font-size:clamp(12px,.9vw,17px);letter-spacing:-.03em}
.form-line{display:flex;align-items:end;gap:10px;margin-bottom:16px;min-height:17px}
.form-line label{flex:none;min-width:72px;white-space:nowrap}
.form-line input{appearance:none;min-width:0;flex:1;background:transparent;border:0;border-bottom:1px solid #282828;border-radius:0;padding:0 4px 2px;height:20px;outline:none}
.form-line input:focus{border-bottom-width:2px}
.form-message{margin-top:16px}
.form-message label{display:block;line-height:1.5}
.form-message textarea{resize:none;width:100%;display:block;margin-top:0;height:132px;min-height:90px;background:repeating-linear-gradient(to bottom,transparent 0,transparent 26px,#343434 26px,#343434 27px);background-size:100% 27px;border:0;border-radius:0;line-height:27px;padding:0 3px;outline:none;overflow:auto}
.form-message textarea:focus{background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 25px,#111 25px,#111 27px)}
.spam-field{position:absolute;left:-99999px;width:1px;height:1px;overflow:hidden}
.submit-line{display:flex;justify-content:flex-end;margin-top:39px}
.submit-line button{appearance:none;border:0;background:transparent;color:var(--ink);display:inline-flex;align-items:center;gap:11px;padding:5px 0;font-size:inherit;letter-spacing:inherit}
.submit-line button:hover{text-decoration:underline;text-underline-offset:4px}
.submit-line button[disabled]{opacity:.6;cursor:wait}
.button-square{display:inline-block;width:12px;height:12px;background:#101010}
.form-status{min-height:1.4em;text-align:right;margin:12px 0 0;font-size:.78em}
.form-status[data-kind="error"]{color:#9c2c21}
.form-status[data-kind="success"]{color:#31583a}
.form-privacy{font-size:clamp(10px,.64vw,12px);line-height:1.5;letter-spacing:0;opacity:.75;margin:15px 0 0;max-width:600px}
.form-privacy a{text-decoration:underline;text-underline-offset:2px}
.contact-monogram{pointer-events:none;position:absolute;width:clamp(170px,16.5vw,320px);right:4.8%;bottom:3%;mix-blend-mode:multiply;opacity:.9}

/* A long-form legal page follows the same quiet typographic system. */
.legal-view{background:var(--paper);min-height:100vh;padding:clamp(140px,18vh,230px) var(--edge) 130px}
.legal-inner{width:min(840px,82vw);margin:auto;font-size:clamp(13px,.9vw,17px);line-height:1.55}
.legal-inner>h1{font-size:clamp(31px,3.3vw,62px);font-weight:700;letter-spacing:-.05em;margin:0 0 15px}
.legal-notice{font-size:.85em;opacity:.7;margin-bottom:60px}
.legal-section{margin:0 0 68px}
.legal-section h2{font-size:1.1em;margin:0 0 22px;letter-spacing:-.02em}
.legal-section p{margin:0 0 18px}
.legal-section a,.back-projects{text-decoration:underline;text-underline-offset:3px}
.back-projects{display:inline-block;margin-top:25px}

@media (min-width:1500px){.project-media{max-height:75vh}.detail-layout{gap:min(8.7vw,185px)}}
@media (max-width:950px){
  .detail-layout{width:88vw;gap:5vw}
  .project-description{font-size:12px}
  .projects-row{width:82vw;gap:7vw}
  .contact-layout{gap:5vw;grid-template-columns:240px minmax(0,1fr)}
}
@media (max-width:700px){
  :root{--edge:18px}
  .site-header{padding-top:23px;font-size:11px;gap:12px}
  .main-nav{gap:15px}
  .site-footer{font-size:10px;bottom:max(14px,env(safe-area-inset-bottom))}
  .intro-text{width:86vw;transform:translateY(-3vh)}
  .intro-text h1{font-size:clamp(32px,9.5vw,52px);margin-bottom:38px}
  .intro-text p{font-size:clamp(12px,3.4vw,15px);line-height:1.43}
  .country-note{margin-top:56px;font-size:12px;gap:13px}
  .country-note-image{bottom:21%;margin-top:0}
  .intro-image>img{object-position:52% center}
  .projects-row{width:100%;min-height:0;display:grid;grid-template-columns:1fr;gap:0;padding:0}
  .project-tile{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:100px 13.5vw 90px}
  .project-tile img{width:100%;aspect-ratio:1/1}
  .tile-caption{font-size:13px;margin-top:15px}
  .projects-end{min-height:26vh;padding:40px 20px 95px}
  .detail-view{display:block;padding:clamp(110px,14vh,155px) 10vw 95px;min-height:100svh}
  .detail-layout{width:100%;display:flex;flex-direction:column;align-items:stretch;gap:45px}
  .project-media{width:100%;aspect-ratio:.96}
  .gallery-controls{bottom:12px;gap:5px}
  .gallery-square{width:12px;height:12px}
  .project-description{font-size:clamp(12px,3.1vw,15px);line-height:1.48;max-width:100%}
  .project-description h1{font-size:1.15em}
  .project-facts{margin:5px 0 31px}
  .project-paragraphs p{margin-bottom:1.4em}
  .contact-view{padding:clamp(118px,16vh,175px) 9vw 110px}
  .contact-layout{grid-template-columns:1fr;gap:55px}
  .contact-identity{font-size:14px}
  .contact-identity address{margin-top:28px}
  .contact-form{font-size:13px}
  .form-line{gap:10px;margin-bottom:20px}
  .form-line label{min-width:75px}
  .submit-line{margin-top:22px}
  .contact-monogram{opacity:.35;right:-15px;bottom:42px;width:155px}
  .form-privacy{font-size:10px;max-width:90%}
  .legal-view{padding:120px 8vw 110px}
  .legal-inner{width:100%;font-size:13px}
  .legal-section{margin-bottom:46px}
}
@media (max-width:360px){.main-nav{gap:9px}.site-header{font-size:10px}.brand{letter-spacing:-.05em}.project-tile{padding-left:10vw;padding-right:10vw}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
