/* Atelier Choiseul — feuille de style du site 2026
   Feuille unique blanche, grille éditoriale deux colonnes,
   la photographie porte toute la couleur (référence « Resident »). */

@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/inter-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/inter-latin-500-normal.woff2") format("woff2")}

:root{
  --encre:#000000; --papier:#ffffff; --graphite:#979797; --charbon:#333333;
  --sans:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --util:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --t-caption:12px; --t-sm:14px; --t-body:19px; --t-h:23px; --t-display:27px;
  --marge:42px; --gouttiere:24px; --section:64px;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{background:var(--papier);color:var(--encre);font-family:var(--sans);font-weight:400;
  font-size:var(--t-body);line-height:1.4;letter-spacing:-0.03em;-webkit-font-smoothing:antialiased}
img{display:block;width:100%;max-width:100%;height:auto;border-radius:0}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-weight:400;text-wrap:balance;hyphens:none}
ul{list-style:none}

.feuille{max-width:1440px;margin:0 auto;padding-left:max(var(--marge),env(safe-area-inset-left,0px));padding-right:max(var(--marge),env(safe-area-inset-right,0px))}
.grille{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gouttiere)}
.grille > *{min-width:0}

/* Navigation */
.nav{position:sticky;top:0;z-index:5;background:var(--papier)}
.nav .feuille{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-block:18px}
.nav ul{display:flex;flex-wrap:wrap;align-items:center;gap:6px 21px}
.nav a{font-size:var(--t-sm);border-bottom:1px solid transparent;padding-bottom:1px}
.nav a:hover,.nav a[aria-current]{border-bottom-color:var(--encre)}
.nav a.nom{border:0;padding:0;margin-right:21px;display:block}
.nav .nom img{height:44px;width:auto;display:block}
.visuellement-cache{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nav .secondaire{font-family:var(--util);font-size:var(--t-caption);letter-spacing:0;display:flex;gap:18px;white-space:nowrap}
.nav .secondaire a{font-size:var(--t-caption)}

/* Ouverture de page */
.ouverture{padding-top:28px}
.ouverture .grille{align-items:end;padding-bottom:21px}
.accroche{font-size:var(--t-sm);line-height:1.3;max-width:34ch}
.accroche .gris{color:var(--graphite)}
.marque{font-size:var(--t-display);line-height:1;letter-spacing:-0.037em}
.titre-page{font-size:var(--t-display);line-height:1.1;letter-spacing:-0.037em;max-width:22em}

/* Photographies */
.planche{display:grid;grid-template-columns:7fr 5fr;gap:var(--gouttiere);align-items:start}
.planche figure:first-child img{aspect-ratio:4/3;object-fit:cover}
.planche figure:last-child img{aspect-ratio:20/21;object-fit:cover}
.pleine img{aspect-ratio:16/9;object-fit:cover}
.bandeau img{aspect-ratio:2.36/1;object-fit:cover}
.photo-equipe img{aspect-ratio:auto}
.diptyque{display:grid;grid-template-columns:1fr 1fr;gap:var(--gouttiere)}
.diptyque img{aspect-ratio:4/3;object-fit:cover}
.diptyque.portrait img{aspect-ratio:3/4}
.galerie{display:grid;grid-template-columns:1fr 1fr;gap:42px var(--gouttiere)}
.galerie figure:only-child,.galerie figure.large{grid-column:1 / -1}
.galerie img{aspect-ratio:16/9;object-fit:cover}
.galerie .nature img{aspect-ratio:auto}
.galerie.carre img{aspect-ratio:1/1}
.legende{font-size:var(--t-sm);line-height:1.3;padding-top:12px;display:flex;justify-content:space-between;gap:18px}
.legende span:last-child{color:var(--graphite);white-space:nowrap}

/* Carrousel de l'accueil : défilement horizontal natif, la diapositive suivante dépasse à droite */
.carrousel{position:relative}
.scene{display:grid;grid-template-columns:minmax(0,1fr) 64px;align-items:center}
.piste{display:grid;grid-auto-flow:column;grid-auto-columns:100%;gap:var(--gouttiere);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain}
.piste::-webkit-scrollbar{display:none}
.piste:focus-visible{outline:1px solid var(--encre);outline-offset:3px}
.diapo{scroll-snap-align:start;min-width:0}
.diapo img{aspect-ratio:16/10;object-fit:cover}
.carrousel .commandes{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding-top:21px;border-top:1px solid var(--encre);margin-top:21px;font-size:var(--t-sm)}
.compteur{font-variant-numeric:tabular-nums}
.carrousel .boutons{display:flex;gap:21px}
.carrousel button{font:inherit;font-size:var(--t-sm);letter-spacing:-0.03em;background:none;border:0;border-bottom:1px solid var(--encre);padding:0 3px 1px;color:var(--encre);cursor:pointer}
.carrousel button:hover{border-bottom-width:2px;padding-bottom:0}
.carrousel .fleche{border:0;padding:0;justify-self:end;width:28px;height:72px;margin-top:-34px;color:var(--encre);display:block}
.carrousel .fleche svg{width:100%;height:100%;display:block;overflow:visible;transition:transform .25s ease}
.carrousel .fleche:hover{border:0;padding:0}
.carrousel .fleche:hover svg{transform:translateX(4px)}
.carrousel .fleche:hover polyline{stroke-width:1.5}
@media (prefers-reduced-motion:reduce){.carrousel .fleche svg{transition:none}}
@media (prefers-reduced-motion:reduce){.piste{scroll-behavior:auto}}

/* Sections */
section{padding-top:var(--section)}
.entete{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gouttiere);align-items:baseline;padding-bottom:28px}
.entete > *{min-width:0}
.entete h2{font-size:var(--t-display);line-height:1;letter-spacing:-0.037em}
.entete p{font-size:var(--t-sm);line-height:1.3;max-width:52ch}
.lien,.entete a{font-size:var(--t-sm);border-bottom:1px solid var(--encre);padding:0 3px 1px;justify-self:start;display:inline-block}
.lien:hover{border-bottom-width:2px;padding-bottom:0}

.texte p{font-size:var(--t-body);line-height:1.4;max-width:34em}
.texte p + p{margin-top:19px}
.texte-sm p{font-size:var(--t-sm);line-height:1.4;max-width:52ch}
.texte-sm p + p{margin-top:12px}

/* Fiches projet (vignettes) */
.projets{display:grid;grid-template-columns:repeat(3,1fr);gap:42px var(--gouttiere)}
.projet img{aspect-ratio:4/3;object-fit:cover}
.projet h3{font-size:var(--t-sm);line-height:1.3;padding-top:12px}
.projet p{font-size:var(--t-sm);line-height:1.3;color:var(--graphite)}
.projet:hover h3{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* Portfolio Architecture / Urbanisme : voile blanc léger, levé au survol (appareils à souris uniquement) */
@media (hover:hover){
  #liste .projet img{opacity:.72;transition:opacity .35s ease}
  #liste .projet:hover img,#liste .projet:focus-visible img{opacity:1}
}
@media (hover:hover) and (prefers-reduced-motion:reduce){#liste .projet img{transition:none}}

/* Filtres */
.filtres{display:flex;flex-wrap:wrap;gap:6px 21px;padding-bottom:28px}
.filtres button{font:inherit;font-size:var(--t-sm);letter-spacing:-0.03em;background:none;border:0;border-bottom:1px solid transparent;padding:0 0 1px;color:var(--encre);cursor:pointer}
.filtres button:hover,.filtres button[aria-pressed="true"]{border-bottom-color:var(--encre)}
.filtres .compte{color:var(--graphite);margin-left:4px}

/* Listes à filets */
.filets li{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gouttiere);align-items:baseline;padding-block:15px;border-bottom:1px solid var(--encre)}
.filets li:first-child{border-top:1px solid var(--encre)}
.filets li > *{min-width:0}
.chiffres b{font-weight:400;font-size:var(--t-display);line-height:1;letter-spacing:-0.037em;font-variant-numeric:tabular-nums}
.chiffres span{font-size:var(--t-sm);line-height:1.3}
.etudes li{padding-block:10px;font-size:var(--t-sm);line-height:1.3}
.etudes li span:last-child{color:var(--graphite)}
.etudes a:hover span:first-child{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.etudes a{display:contents}

/* Fiche technique */
.fiche{font-size:var(--t-sm);line-height:1.3}
.fiche div{display:grid;grid-template-columns:2fr 3fr;column-gap:var(--gouttiere);padding-block:10px;border-bottom:1px solid var(--encre)}
.fiche div:first-child{border-top:1px solid var(--encre)}
.fiche dt{color:var(--graphite)}
.fiche dd{min-width:0}

.suite{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 21px;font-size:var(--t-sm)}

/* Équipe */
.personnes li{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gouttiere);padding-block:21px;border-bottom:1px solid var(--encre)}
.personnes li:first-child{border-top:1px solid var(--encre)}
.personnes li > *{min-width:0}
.personnes h3{font-size:var(--t-h);line-height:1.2;letter-spacing:-0.03em}
.personnes .role{font-size:var(--t-sm);line-height:1.3;color:var(--graphite);padding-top:5px}
.personnes p.bio{font-size:var(--t-body);line-height:1.4;max-width:34em}
.noms li{display:flex;justify-content:space-between;gap:18px;padding-block:10px;border-bottom:1px solid var(--encre);font-size:var(--t-sm);line-height:1.3}
.noms li:first-child{border-top:1px solid var(--encre)}
.noms li span:last-child{color:var(--graphite)}
.duo{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gouttiere);align-items:end}
.duo > *{min-width:0}
.duo figure img{aspect-ratio:1/1;object-fit:cover}

/* Trombinoscope */
.trombi{display:grid;grid-template-columns:repeat(4,1fr);gap:35px var(--gouttiere)}
.trombi img{aspect-ratio:1/1;object-fit:cover}
.trombi.petit{grid-template-columns:repeat(auto-fill,180px)}
.trombi h3{font-size:var(--t-sm);line-height:1.3;padding-top:12px}
.trombi p{font-size:var(--t-sm);line-height:1.3;color:var(--graphite)}
.personnes .identite{display:grid;grid-template-columns:minmax(0,180px) 1fr;gap:var(--gouttiere);align-items:start}
.personnes .identite figure:empty{display:none}
.personnes .identite img{aspect-ratio:1/1;object-fit:cover}

/* Contact */
.adresse{font-style:normal;font-size:var(--t-h);line-height:1.2;letter-spacing:-0.03em}
.adresse + .texte-sm{margin-top:21px}
.courriel{border-bottom:1px solid var(--encre)}
.courriel .arobase{white-space:pre}
form.formulaire{display:flex;flex-direction:column;gap:10px;max-width:560px}
.formulaire label{font-size:var(--t-sm);line-height:1.3;padding-top:8px}
.formulaire input,.formulaire textarea{font:inherit;font-size:var(--t-sm);letter-spacing:-0.03em;padding:10px 12px;border:1px solid var(--encre);border-radius:0;background:var(--papier);color:var(--encre);width:100%}
.formulaire textarea{min-height:160px;resize:vertical}
.formulaire ::placeholder{color:var(--graphite)}
.formulaire input:focus,.formulaire textarea:focus{outline:none}
.formulaire button{font:inherit;font-size:var(--t-sm);background:none;border:0;border-bottom:1px solid var(--encre);padding:0 3px 1px;align-self:flex-start;cursor:pointer;color:var(--encre);margin-top:10px}
.formulaire .note{font-size:var(--t-caption);font-family:var(--util);letter-spacing:0;color:var(--graphite)}

/* Pied */
footer{padding-top:83px}
footer .feuille{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 21px;padding-block:21px;font-family:var(--util);font-size:var(--t-caption);letter-spacing:0;line-height:1.2}
footer nav{display:flex;flex-wrap:wrap;gap:6px 18px}
footer a:hover{text-decoration:underline}

a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:1px solid var(--encre);outline-offset:3px}

@media (max-width:900px){
  .projets,.trombi{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  :root{--marge:16px;--section:48px;--t-body:18px}
  .grille,.entete,.planche,.diptyque,.galerie,.duo,.filets li,.personnes li,.fiche div{grid-template-columns:1fr}
  .ouverture .grille{row-gap:14px}
  .ouverture .grille > :last-child{order:-1}
  .entete{row-gap:10px}
  .projets{grid-template-columns:1fr;gap:35px}
  .scene{grid-template-columns:minmax(0,1fr) 36px}
  .personnes .identite{grid-template-columns:120px 1fr}
  .trombi.petit{grid-template-columns:repeat(2,minmax(0,160px))}
  .nav .feuille{flex-direction:column;align-items:flex-start;gap:10px}
  .planche,.diptyque,.galerie{row-gap:28px}
  .planche figure img,.planche figure:last-child img,.planche figure:first-child img,.bandeau img{aspect-ratio:4/3}
  .diptyque.portrait img{aspect-ratio:4/5}
  .filets li,.personnes li{row-gap:6px}
  .fiche div{row-gap:2px}
  .grille{row-gap:28px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* ------------------------------------------------------------------
   Adaptations WordPress (balisage des blocs). Tout ce qui précède
   reprend à l'identique assets/css/styles.css de la maquette.
   ------------------------------------------------------------------ */
.partie-site{display:contents}
.wp-site-blocks{padding:0}
:where(.wp-site-blocks) > *,.contenu > *,.is-layout-flow > *,.is-layout-constrained > *{margin-block-start:0;margin-block-end:0}
/* Les sections pleine largeur échappent à la largeur de contenu de WordPress ;
   les zones .feuille gardent la leur (1440 px, centrées), comme l'en-tête. */
.contenu > :not(.feuille){max-width:none!important;margin-left:0!important;margin-right:0!important}
.contenu > .feuille{max-width:1440px!important;margin-left:auto!important;margin-right:auto!important}
.contenu ul.wp-block-list,.contenu ol.wp-block-list{padding:0;list-style:none}
figure.wp-block-image,.wp-block-image{margin:0}
.wp-block-image a{display:block}
.wp-block-image img{vertical-align:top}
/* Légendes saisies dans l'éditeur : un texte en italique est rejeté à droite, en gris (comme .legende) */
.wp-element-caption,.wp-block-image figcaption{font-size:var(--t-sm);line-height:1.3;padding-top:12px;margin:0;display:flex;justify-content:space-between;gap:18px;text-align:left;color:inherit}
.wp-element-caption em{font-style:normal;color:var(--graphite);white-space:nowrap}
section.court{padding-top:28px}
.galerie .nature img[style*="--ratio"]{aspect-ratio:var(--ratio)}
/* Éditeur : espace entre les paragraphes d'un projet */
.is-root-container > p + p{margin-block-start:19px}
.edit-post-visual-editor__post-title-wrapper,.editor-visual-editor__post-title-wrapper,.post-type-post .is-root-container,.post-type-ac_membre .is-root-container{padding-left:var(--marge);padding-right:var(--marge)}
p.plus{padding-top:28px}
p.plus-grand{padding-top:42px}
.diptyque ~ .etudes{margin-top:64px}
/* Chiffres clés saisis comme une liste : nombre en gras, puis le libellé */
.chiffres li{font-size:var(--t-sm);line-height:1.3}
.chiffres strong{font-weight:400;font-size:var(--t-display);line-height:1;letter-spacing:-0.037em;font-variant-numeric:tabular-nums}
/* Lignes titre / texte (mentions légales) composées avec des groupes */
.lignes > *{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gouttiere);padding-block:21px;border-bottom:1px solid var(--encre)}
.lignes > :first-child{border-top:1px solid var(--encre)}
.lignes > * > *{min-width:0}
.lignes h3{font-size:var(--t-h);line-height:1.2;letter-spacing:-0.03em}
@media (max-width:640px){.lignes > *{grid-template-columns:1fr;row-gap:6px}}
/* Menu mobile : sous 900 px, logo à gauche, trois traits fins à droite ; le menu se déplie sous le logo */
.nav .burger{display:none}
@media (max-width:900px){
  .nav .feuille{position:relative;flex-direction:column;align-items:stretch;gap:0}
  .nav .burger{display:flex;align-items:center;justify-content:center;position:absolute;top:18px;right:max(var(--marge),env(safe-area-inset-right,0px));
    width:44px;height:44px;margin-right:-8px;padding:0;background:none;border:0;color:var(--encre);cursor:pointer}
  .nav .burger svg{width:28px;height:20px;overflow:visible}
  .nav .burger line{stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke}
  .nav .burger .i-fermer,.nav.ouvert .burger .i-ouvrir{display:none}
  .nav.ouvert .burger .i-fermer{display:block}
  .nav ul{flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:0}
  .nav ul > li:first-child{align-self:flex-start}
  .nav a.nom{margin-right:0}
  .nav ul > li:nth-child(2){margin-top:21px}
  .nav ul > li + li a{display:block;font-size:var(--t-h);line-height:1.2;letter-spacing:-0.03em;padding:12px 0 11px;border-bottom:1px solid var(--encre)}
  .nav ul > li:nth-child(2) a{border-top:1px solid var(--encre)}
  .nav ul > li + li a[aria-current]{font-weight:500}
  .nav .secondaire{flex-wrap:wrap;padding:14px 0 7px}
  .js .nav:not(.ouvert) ul > li + li,.js .nav:not(.ouvert) .secondaire{display:none}
  .nav.ouvert{max-height:100vh;overflow-y:auto}
}

/* Liste des résultats (index) */
.wp-block-post-template.noms{padding:0;list-style:none}
.wp-block-post-template.noms li{padding-block:10px;border-bottom:1px solid var(--encre)}
.wp-block-post-template.noms h3{font-size:var(--t-sm)}
