@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/inter-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/inter-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2')}
/* Layout: Ciguë-style catalogue — logo + nav on one line, filter row, grid of square photo thumbnails with centred captions; minium-red marker highlight as the single accent */
:root{
  --bg:#ffffff;
  --fg:#111111;
  --muted:#77736f;
  --line:#e4e1dd;
  --mark:#b9d97a;        /* vert tilleul */
  --mark-fg:#111111;
  --thumb:#efedea;
  --logo:#35363b;        /* gris anthracite de la charte */
  --f-sans:"Inter","Helvetica Neue",Helvetica,Arial,sans-serif; /* au plus près de Suisse Int’l utilisée par Ciguë */
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --gutter:clamp(16px,2.4vw,32px);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#121211;--fg:#f1efec;--muted:#9a958f;--line:#2b2a28;--mark:#a9cc62;--mark-fg:#111111;--thumb:#1d1c1b;--logo:#f1efec;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#121211;--fg:#f1efec;--muted:#9a958f;--line:#2b2a28;--mark:#a9cc62;--mark-fg:#111111;--thumb:#1d1c1b;--logo:#f1efec;color-scheme:dark}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font-family:var(--f-sans);font-size:15px;line-height:1.45;padding-inline:var(--gutter);padding-block:0 64px}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--mark);outline-offset:2px}
.mark{background:var(--mark);color:var(--mark-fg)}

/* header */
header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px 32px;padding-block:22px 18px;position:sticky;top:env(safe-area-inset-top,0px);background:var(--bg);z-index:10}
.logo{display:block;color:var(--logo)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.logo-svg{display:block;width:clamp(151px,18.14vw,232px);height:auto}
.is-proj .logo-svg{width:clamp(151px,18.14vw,232px)}
.logo small{color:var(--muted);display:block;font-size:12px;letter-spacing:.16em;font-weight:400;color:var(--muted);margin-top:0;white-space:nowrap;line-height:1}
.navwrap{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.lang{display:flex;gap:10px;font-size:12px;text-transform:lowercase}
.lang a{padding:0 2px;text-transform:lowercase}.lang a:hover{background:var(--mark);color:var(--mark-fg)}
.lang .on{text-decoration:underline;text-underline-offset:3px}
nav.main{display:flex;gap:22px;font-size:13px;text-transform:uppercase;letter-spacing:.06em}
nav.main a{padding:1px 3px}
nav.main a[aria-current="page"],nav.main a:hover,nav.main button:hover{background:var(--mark);color:var(--mark-fg)}
nav.main button{text-transform:uppercase;letter-spacing:.06em;padding:1px 3px}

/* filters */
.filters{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 26px;border-top:1px solid var(--fg);padding-block:10px;font-size:13px;position:relative}
.filters .lbl{text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.dd{position:relative}
.dd>button::after{content:" ▾";font-size:10px}
.dd>button[aria-expanded="true"]{background:var(--mark);color:var(--mark-fg)}
.dd-panel{position:absolute;left:0;top:calc(100% + 8px);background:var(--bg);border:1px solid var(--fg);padding:10px 14px;min-width:220px;max-height:60vh;overflow:auto;z-index:20;display:flex;flex-direction:column;gap:3px}
.dd-panel button{text-align:left;padding:1px 3px}
.dd-panel button:hover,.dd-panel button.on{background:var(--mark);color:var(--mark-fg)}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.chip{background:var(--mark);color:var(--mark-fg);padding:1px 6px;font-size:12px}
.count{font-family:var(--f-mono);font-size:12px;color:var(--muted)}

/* grid */
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:44px 24px;padding-block:28px}
@media (max-width:1100px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.grid{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column;gap:12px;text-align:center}
.thumb{position:relative;aspect-ratio:1/1;max-width:100%;background:var(--thumb);overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.card:hover .thumb img{transform:scale(1.03)}
.thumb.nophoto{display:flex;align-items:center;justify-content:center;border:1px solid var(--line)}
.thumb.nophoto span{font-family:var(--f-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.card .t{font-size:15px;font-weight:500;line-height:1.2}
.card .t span{padding:0 3px}
.card:hover .t span{background:var(--mark);color:var(--mark-fg)}
.card .s{font-size:13px;color:var(--muted);margin-top:2px}
.empty{padding:60px 0;color:var(--muted)}

/* index A–Z */
.az{columns:4 220px;column-gap:32px;padding-block:28px}
.az section{break-inside:avoid;margin-bottom:20px}
.az h3{font-size:28px;font-weight:500;margin:0 0 6px;letter-spacing:-.02em}
.az .row{display:block;font-size:14px;line-height:1.55}
.az .row button{text-align:left;padding:0 3px}
.az .row button:hover{background:var(--mark);color:var(--mark-fg)}
.az .row.p{font-weight:600}
.az .row .n{font-family:var(--f-mono);font-size:11px;color:var(--muted);margin-left:4px}
.letters{display:flex;flex-wrap:wrap;gap:2px 10px;font-size:13px;padding-block:14px 0}
.letters a{padding:0 3px}.letters a:hover{background:var(--mark);color:var(--mark-fg)}

/* project page */
.back{display:inline-block;font-size:13px;text-transform:uppercase;letter-spacing:.06em;margin-top:18px;padding:1px 3px}
.back:hover{background:var(--mark);color:var(--mark-fg)}
.proj{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:32px 48px;padding-block:28px}
@media (max-width:820px){.proj{grid-template-columns:1fr}}
.proj h1{font-size:clamp(34px,5vw,64px);font-weight:500;letter-spacing:-.03em;line-height:.95;margin:0;text-wrap:balance}
.proj .sub{font-size:13px;text-transform:uppercase;letter-spacing:.06em;margin-top:14px}
.proj .txt{max-width:60ch;margin-top:18px}
.fiche{display:grid;grid-template-columns:fit-content(42%) minmax(0,1fr);gap:6px 18px;margin-top:26px;font-size:13px;border-top:1px solid var(--line);padding-top:14px}
.fiche dt{font-family:var(--f-mono);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding-top:2px}
.fiche dd{margin:0;overflow-wrap:anywhere}.fiche dt{overflow-wrap:anywhere}
.srcl a.ext{border-bottom:1px solid var(--fg);padding:0 1px;font-size:13px}.srcl a.ext::after{content:" ↗"}.srcl a.ext:hover{background:var(--mark);color:var(--mark-fg)}
.fiche a.ext{border-bottom:1px solid var(--fg);padding:0 1px}
.fiche a.ext::after{content:" ↗";font-size:.85em}
.fiche a.ext:hover{background:var(--mark);color:var(--mark-fg);border-color:transparent}
.tags{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:20px;font-size:12px}
.tags button{padding:0 3px;border-bottom:1px solid var(--line)}
.tags button:hover{background:var(--mark);color:var(--mark-fg);border-color:transparent}
.gallery{display:flex;flex-direction:column;gap:16px}
.gallery img{width:100%;height:auto;display:block;background:var(--thumb)}
.credit{font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.pn{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--fg);padding-top:10px;font-size:13px;grid-column:1/-1}
.pn a{padding:1px 3px}.pn a:hover{background:var(--mark);color:var(--mark-fg)}

/* atelier */
.studio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding-block:28px}
@media (max-width:820px){.studio{grid-template-columns:1fr}}
.studio h2{font-size:13px;text-transform:uppercase;letter-spacing:.06em;font-weight:500;margin:0 0 12px;border-top:1px solid var(--fg);padding-top:10px}
.studio p{margin:0 0 12px;max-width:52ch}
.studio .lead{font-size:clamp(20px,2.2vw,26px);line-height:1.25;letter-spacing:-.01em}
.mono{font-family:var(--f-mono);font-size:12px}
.copy{border-bottom:1px solid var(--line);padding:0 2px}
.copy:hover{background:var(--mark);color:var(--mark-fg)}

/* search overlay */
.overlay{position:fixed;inset:0;background:var(--bg);z-index:50;overflow:auto;padding-inline:var(--gutter);padding-block:calc(22px + env(safe-area-inset-top,0px)) 40px}
.overlay .top{display:flex;justify-content:space-between;align-items:center;gap:16px}
.overlay input{font:inherit;font-size:clamp(28px,4vw,48px);letter-spacing:-.02em;border:0;border-bottom:1px solid var(--fg);background:transparent;color:var(--fg);width:100%;padding:6px 0;outline:none}
.overlay .close{font-size:13px;text-transform:uppercase;letter-spacing:.06em;padding:1px 3px}
.overlay .close:hover{background:var(--mark);color:var(--mark-fg)}
.results{display:flex;flex-direction:column;gap:4px;margin-top:22px;font-size:17px}
.results button{text-align:left;padding:0 3px}
.results button:hover{background:var(--mark);color:var(--mark-fg)}
.results .k{font-family:var(--f-mono);font-size:11px;color:var(--muted);margin-left:6px;text-transform:uppercase}

footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;border-top:1px solid var(--fg);padding-top:10px;font-size:12px;color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
footer a.ig,a.ig{color:inherit;text-decoration:none;border-bottom:1px solid currentColor}a.ig:hover{background:var(--mark);color:var(--mark-fg)}
.wordmark{display:block;font-size:clamp(34px,4.2vw,52px);font-weight:500;letter-spacing:-.035em;line-height:.9}
.legal{max-width:760px}.legal h2{font-size:15px;text-transform:uppercase;letter-spacing:.05em;margin:28px 0 8px}.legal p{font-size:15px;line-height:1.55}footer a.flegal{color:inherit}
.studio .lk{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;font-size:14px}
.studio .lk a.ext{color:inherit;border-bottom:1px solid currentColor;text-decoration:none}

.lang a{color:inherit;text-decoration:none}
.legal{max-width:760px}.legal h2{font-size:15px;text-transform:uppercase;letter-spacing:.05em;margin:28px 0 8px}.legal p,.legal li{font-size:15px;line-height:1.55}
footer a{color:inherit}