@font-face{font-family:Geist;src:url(/commun/fonts/geist-sans-latin-300-normal.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:Geist;src:url(/commun/fonts/geist-sans-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:Geist;src:url(/commun/fonts/geist-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Geist;src:url(/commun/fonts/geist-sans-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Geist;src:url(/commun/fonts/geist-sans-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(/commun/fonts/geist-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--encre:#130c12;--velours:#2b1824;--porcelaine:#f4eee8;--brume:#b9a9b1;--rose:#f2b5b0;--filet:rgba(244,238,232,.14);--bord:rgba(244,238,232,.24);
  --out:cubic-bezier(.23,1,.32,1);--io:cubic-bezier(.65,0,.35,1);--gout:max(48px,env(safe-area-inset-left,0px));--pf-duree:650ms}
@media (max-width:599.98px){:root{--gout:max(20px,env(safe-area-inset-left,0px))}}
.mono{font-family:"Geist Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.02em;font-weight:400}
.sr,.pf-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sl{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .45s var(--io);padding-bottom:2px}
@media (hover:hover) and (pointer:fine){a:hover .sl{background-size:100% 1px}}
a:focus-visible .sl{background-size:100% 1px}

/* Page « Tous les projets » (Nuit de velours) : une galerie régulière de 25 projets, puis une conclusion éditoriale. */
body.nuit{margin:0;background:var(--encre);background-image:radial-gradient(70% 40% at 85% 0%,rgba(84,44,68,.55),transparent 70%),radial-gradient(120% 60% at 50% 20%,#1d1119 0%,var(--encre) 70%);background-repeat:no-repeat;color:var(--porcelaine);font-family:Geist,system-ui,sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh}
.nuit a{color:inherit;text-decoration:none}
.nuit button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.nuit ul{list-style:none;margin:0;padding:0}
.evitement{position:absolute;left:16px;top:-60px;z-index:20;background:var(--porcelaine);color:var(--encre)!important;padding:10px 16px;border-radius:999px}
.evitement:focus{top:12px}
/* en-tête : en place en haut de page ; dès qu'on descend, il se range (masqué) et revient à la moindre remontée,
   sous forme de deux pastilles de la même matière que celles des études (verre sombre, filet clair, rayon plein).
   Collant (sticky) : aucune hauteur ne change, donc aucun saut de mise en page. */
.top{--pf-y:-22px;position:sticky;top:0;z-index:40;display:flex;justify-content:space-between;align-items:center;padding:34px var(--gout);pointer-events:none;transition:transform .5s var(--out)}
.top>*{pointer-events:auto}
.marque{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;margin-left:-16px;border-radius:999px;font-weight:500;font-size:15px;letter-spacing:-.01em;white-space:nowrap}
.top nav{display:flex;gap:2px;padding:0 4px;margin-right:-4px;border-radius:999px}.top nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:999px;font-weight:500;font-size:15px;transition:color .3s ease,background-color .3s ease}
.marque,.top nav{transition:background-color .4s ease,box-shadow .4s ease,transform .5s var(--out);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4)}
html.pf-flotte .top{transform:translateY(var(--pf-y))}
html.pf-flotte .marque,html.pf-flotte .top nav{background:rgba(26,16,23,.8);box-shadow:inset 0 0 0 1px rgba(244,238,232,.13),0 10px 30px -18px rgba(0,0,0,.7)}
html.pf-flotte .marque{transform:translateX(16px)}html.pf-flotte .top nav{transform:translateX(4px)}
html.pf-cache .top{transform:translateY(calc(-100% - 12px))}
@media (hover:hover) and (pointer:fine){.top nav a:not([aria-current]):hover{background:rgba(244,238,232,.08)}.marque:hover{color:var(--rose)}}
.top nav a[aria-current]{color:var(--rose)}
@media (prefers-reduced-motion:reduce){.top,.marque,.top nav{transition:opacity .2s ease,background-color .2s ease}html.pf-cache .top{transform:none;opacity:0;pointer-events:none}html.pf-cache .top>*{pointer-events:none}html.pf-flotte .top{transform:translateY(var(--pf-y))}}
@media (prefers-reduced-transparency:reduce){html.pf-flotte .marque,html.pf-flotte .top nav,.top::before{background:#1a1017;-webkit-backdrop-filter:none;backdrop-filter:none}}
.top a:focus-visible,.pied a:focus-visible{outline:2px solid var(--rose);outline-offset:3px;border-radius:4px}
.intro{display:grid;grid-template-columns:1fr 1fr;align-items:end;padding:88px var(--gout) 44px;gap:48px}
.intro h1{margin:0;font-weight:800;font-size:clamp(64px,8vw,112px);line-height:.9;letter-spacing:-.055em}
.i-d{justify-self:end;max-width:30ch}
.intro p{margin:0;font-size:19px;line-height:1.45;color:var(--brume)}
.une{display:inline-flex;align-items:center;gap:12px;min-height:44px;margin-top:18px;font-weight:500;font-size:18px;letter-spacing:-.01em;color:var(--rose)!important}
.une .sl{background-size:100% 1px;background-image:linear-gradient(rgba(242,181,176,.5),rgba(242,181,176,.5))}
.une .pf-court{display:none}
@media (max-width:399.98px){.une .pf-long{display:none}.une .pf-court{display:inline}}
.une svg{width:18px;height:18px;flex:none;transition:transform .45s var(--out)}
@media (hover:hover) and (pointer:fine){.une:hover svg{transform:translateX(5px)}.une:hover .sl{background-image:linear-gradient(var(--rose),var(--rose))}}
.une:focus-visible{outline:2px solid var(--rose);outline-offset:4px;border-radius:4px}
/* filtres : sommaire typographique ; le choix actif est porté par un filet unique qui glisse d'une discipline à l'autre */
.filtres{position:relative;display:flex;flex-wrap:wrap;column-gap:clamp(22px,2.6vw,36px);margin:0 var(--gout);border-bottom:1px solid var(--filet)}
.filtres button{position:relative;display:inline-flex;align-items:baseline;height:56px;padding:14px 0 0;font-size:18px;font-weight:500;letter-spacing:-.015em;color:rgba(244,238,232,.5);transition:color .35s ease}
.filtres .c{margin-left:4px;font-size:11px;line-height:1;transform:translateY(-.75em);color:rgba(244,238,232,.4);font-variant-numeric:tabular-nums;transition:color .35s ease}
.filtres button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:rgba(244,238,232,.35);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--io)}
@media (hover:hover) and (pointer:fine){.filtres button:not([aria-pressed=true]):hover{color:rgba(244,238,232,.86)}.filtres button:not([aria-pressed=true]):hover::after{transform:scaleX(1);transform-origin:left}}
.filtres button[aria-pressed=true]{color:var(--porcelaine)}
.filtres button[aria-pressed=true] .c{color:var(--rose)}
.filtres .ind{position:absolute;left:0;top:0;width:100px;height:2px;background:var(--porcelaine);transform-origin:0 0;pointer-events:none;transition:transform .55s var(--io)}
.filtres:not(.pret) .ind{transition:none}
.filtres button:focus-visible{outline:2px solid var(--rose);outline-offset:4px;border-radius:2px}
/* changement de sélection : la grille s'efface, puis les cartes retenues reviennent une à une */
.g3{transition:opacity .16s ease}.g3.sort{opacity:0}
.g3.entre>li:not([hidden]){animation:pf-carte .5s var(--out) backwards;animation-delay:calc(min(var(--i,0),8) * 40ms)}
@keyframes pf-carte{from{opacity:0;transform:translateY(12px)}}
.bloc{padding:56px var(--gout) 0}
.bloc h2{margin:0 0 32px;font-weight:500;font-size:32px;letter-spacing:-.025em;display:flex;align-items:baseline;gap:14px}
.bloc h2 .mono{color:var(--brume)}
.carte{display:block;cursor:pointer}
.cadre{display:block;overflow:hidden;background:#1d1119}
.cadre img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;transition:transform .9s var(--out)}
@media (hover:hover) and (pointer:fine){.carte:hover .cadre img{transform:scale(1.035)}.carte:hover .leg .h{background-size:100% 1px}}
.carte:focus-visible{outline:none}.carte:focus-visible .cadre{outline:2px solid var(--rose);outline-offset:6px}
.carte:focus-visible .leg .h{background-size:100% 1px}
.leg{display:block;margin-top:16px}
.leg .h{display:inline;font-weight:500;font-size:20px;letter-spacing:-.015em;background:linear-gradient(var(--rose),var(--rose)) 0 100%/0 1px no-repeat;transition:background-size .45s var(--io);padding-bottom:2px}
.leg .k{display:block;margin-top:6px;font-size:15px;color:var(--brume)}
.g3{container-type:inline-size;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:64px 24px}
/* conclusion : hors de la grille, calée sur la 2e colonne de la galerie, après une vraie respiration */
.conclusion{padding:184px var(--gout) 0}
.cz{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;border-top:1px solid var(--filet);padding-top:40px}
.cz h2{grid-column:2/4;margin:0;font-weight:300;font-size:clamp(40px,4.2vw,60px);line-height:1.04;letter-spacing:-.035em;max-width:none;text-wrap:balance}
.cz h2 span{display:block}
.ecrire{grid-column:2/4;justify-self:start;display:inline-flex;align-items:center;gap:12px;min-height:44px;margin-top:36px;font-weight:500;font-size:20px;letter-spacing:-.01em;color:var(--rose)!important}
.ecrire svg{width:20px;height:20px;flex:none;transition:transform .45s var(--out)}
@media (hover:hover) and (pointer:fine){.ecrire:hover svg{transform:translateX(5px)}}
.ecrire:focus-visible{outline:2px solid var(--rose);outline-offset:4px;border-radius:4px}
.signe{font-size:15px;color:var(--brume)}
.pied{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin:160px var(--gout) 0;padding:0 0 40px}
.pied nav{display:flex;gap:28px;font-size:15px;color:var(--brume)}.pied nav a{min-height:44px;display:inline-flex;align-items:center}
@media (hover:hover) and (pointer:fine){.pied nav a:hover{color:var(--porcelaine)}}
@media (max-width:899.98px){
  .intro{grid-template-columns:1fr;gap:16px}.i-d{justify-self:start;max-width:36ch}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .conclusion{padding-top:144px}.cz{grid-template-columns:repeat(2,minmax(0,1fr))}.cz h2,.ecrire{grid-column:2/3}.cz h2{font-size:40px}
}
/* mobile : rangées vignette + texte */
@media (max-width:599.98px){
  .top{--pf-y:-6px;padding:18px var(--gout)}.top nav a{padding:0 9px}.marque{padding:0 12px;margin-left:-12px}
  /* mobile : une seule pastille pleine largeur au lieu de deux qui se touchent */
  .top::before{content:"";position:absolute;inset:18px calc(var(--gout) - 10px);z-index:-1;border-radius:999px;background:rgba(26,16,23,.8);box-shadow:inset 0 0 0 1px rgba(244,238,232,.13),0 10px 30px -18px rgba(0,0,0,.7);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);opacity:0;transition:opacity .4s ease;pointer-events:none}
  .top{isolation:isolate}html.pf-flotte .top::before{opacity:1}
  html.pf-flotte .marque,html.pf-flotte .top nav{background:none;box-shadow:none;transform:none;-webkit-backdrop-filter:none;backdrop-filter:none}
  .intro{padding:44px var(--gout) 28px}.intro p{font-size:17px}.une{margin-top:12px;font-size:17px}
  /* filtres : une seule rangée qui défile, au lieu de 3 ou 4 rangées de pastilles */
  .filtres{flex-wrap:nowrap;overflow-x:auto;column-gap:22px;margin:0;padding:0 var(--gout);scroll-padding-inline:var(--gout);scrollbar-width:none;border-bottom:0;box-shadow:inset 0 -1px 0 var(--filet);-webkit-overflow-scrolling:touch}
  .filtres::-webkit-scrollbar{display:none}
  .filtres::after{content:"";flex:none;width:1px}
  .filtres button{flex:none;height:52px;font-size:17px}
  .filtres button::after{bottom:0}
  .bloc{padding-top:48px}.bloc h2{font-size:26px;margin-bottom:22px}
  .g3{display:flex;flex-direction:column;gap:20px}
  .g3 .carte{display:grid;grid-template-columns:40% minmax(0,1fr);gap:14px;align-items:center}
  .conclusion{padding-top:112px}.cz{display:block;padding-top:28px}.cz h2{font-size:34px}.ecrire{margin-top:24px;font-size:18px}
  .g3 .leg{margin:0}.g3 .leg .h{display:block;font-size:17px;line-height:1.25;text-wrap:balance;background-position:0 1.2em}.g3 .k{font-size:15px;line-height:1.4;margin-top:4px}.g3 .an{display:block}.g3 .vg{display:none}
  .pied{flex-direction:column;align-items:flex-start;gap:20px;margin-top:96px}
}
@media (max-width:379.98px){.top nav a{padding:0 7px;font-size:14px}.marque{font-size:14px}}
@media (prefers-reduced-motion:reduce){.cadre img,.leg .h,.filtres button,.filtres .ind,.ecrire svg,.sl{transition-duration:.01ms}.g3.entre>li:not([hidden]){animation:pf-fondu-entree .2s ease backwards}}
.g3>li{scroll-margin-top:14vh}
.cadre.sombre{position:relative}.cadre.sombre::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(240,224,234,.13);pointer-events:none}
