margin-bottom: 0 ;
}

#info-mission-text{
  font-size: 58px;
  padding: 24px 0 48px 0;
  line-height: 68px;
  width: 66.6%;
  display: block;
}

/* #info-large-text — supprimé, cf design-system.css */


figure {
  width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
}

.blocks {
    height: 100%;
    width: 100%;
}

img {
width: 100%;
/* margin-bottom retiré : doublait le 24px de .column-grid-column (index.css)
   → cumul de 48px entre rangées d'images. Le 24px de .column-grid-column
   suffit et s'applique déjà à tous les breakpoints. */
max-height: auto;
object-fit: cover;
}

#info-title.first-position {
  margin-top: 4px;
}

#info-title {
    font-size: 88px;
    display: block;
}



article {
  font-family: "mainFont", helvetica, sans-serif;
}

.project-title-header-year {
    font-family: 'subFont';
}

figcaption.img-caption {
    padding: 12px 0 8px 0;
    font-size: 16px;
}

.project-text {
  font-size: 30px;
  line-height: 42px;
}

section.project-prev-next {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 48px 0 24px;
    font-size: 116px;
}

#column-grid-column-full-width {
  max-height: 93vh !important;
}

section#\#column-grid-column-full-width {
    max-height: 93vh !important;
}

/* Grille 3 colonnes, gouttière 24px :
   - colonne 1/3 = 33.333% - 16px
   - span 2/3 (2 colonnes + 1 gouttière) = 66.666% - 8px
   Somme des largeurs + 24px de gouttière = 100% pile → images alignées sur la
   même grille que les rangées à 3 images. */
#column-grid-column-two-images-left > div:first-child {
  width: calc(33.3333% - 16px);
}

#column-grid-column-two-images-left > div:nth-child(2) {
  width: calc(66.6666% - 8px);
}

#column-grid-column-two-images-right > div:first-child {
  width: calc(66.6666% - 8px);
}

#column-grid-column-two-images-right > div:nth-child(2) {
  width: calc(33.3333% - 16px);
}

/* Rangées multi-images : toutes les images d'une rangée occupent la même
   hauteur. Les colonnes s'étirent (flex align-items:stretch). L'image la plus
   haute définit la hauteur (height:auto → hauteur naturelle), les autres la
   remplissent via min-height:100% + object-fit:cover (crop). Symétrique et
   sans dépendance circulaire. S'applique à toutes les rangées multi-colonnes
   de la page studio (2/3–1/3 comme 3 images). */
body.page-studio .column-grid-column:not(:only-child) .blocks img {
  height: auto;
  min-height: 100%;
  object-fit: cover;
}


.nav-home {
  font-family: "titleFont", sans-serif;
}


@media only screen and (max-width:375px) {

  #column-grid-column-mobile {
    margin-bottom: 0 !important;
  }

  .project-content {
  width: 100%;
}

  #column-grid-column-two-images-left > div:first-child {
  width: 100%;
}

  #column-grid-column-two-images-left > div:nth-child(2) {
  width: 100%;
}

#column-grid-column-two-images-right> div:first-child {
  width: 100%;
}

  #column-grid-column-two-images-right > div:nth-child(2) {
  width: 100%;
}


a.img {
--w: 1.6 !important;
    --h: 1;
}

td.td-category {
    font-size: 14px;
    width: 38%;
}

.td-info {
    font-size: 14px;
}

.project-text {
    font-size: 16px;
    line-height: 24px;
}

.project-title-header{
    font-size: 16px;
  }

  .project-title-header {
    grid-template-columns: repeat(1, 1fr);
  }

  .project-title-header {
    margin: 12px 0 6px;
  }

  tr>td {
    padding-top: 6px;
    padding-bottom: 6px;
}


table {
    margin-top: 18px;
    margin-bottom: 36px;
}


.figcaption-firstline {
    display: flex;
    grid-template-columns: repeat(3, 1fr);
    align-content: space-between;
    display: grid;
}

figcaption.img-caption {
    white-space: nowrap;
    text-align: center;
    width: 100%;
}

#info-mission-text {
    font-size: 28px;
    padding: 24px 0 48px 0;
    line-height: 36px;
    width: 100%;
  }

#info-title {
  font-size: 26px;
  margin: 0 0 4px;
}

/* #info-large-text mobile — supprimé, cf design-system.css */


}


@media only screen and (min-width:376px) and (max-width: 899px) {

  .project-content {
  width: 100%;
}

  #column-grid-column-two-images-left > div:first-child {
  width: 100%;
}

  #column-grid-column-two-images-left > div:nth-child(2) {
  width: 100%;
}

#column-grid-column-two-images-right > div:first-child {
  width: 100%;
}

  #column-grid-column-two-images-right > div:nth-child(2) {
  width: 100%;
}


a.img {
--w: 1.6 !important;
    --h: 1;
}

td.td-category {
    font-size: 14px;
    width: 38%;
}

.td-info {
    font-size: 14px;
}

.project-text {
    font-size: 16px;
    line-height: 24px;
}

.project-title-header{
    font-size: 16px;
  }

  .project-title-header {
    grid-template-columns: repeat(1, 1fr);
  }

  .project-title-header {
    margin: 12px 0 6px;
  }

  tr>td {
    padding-top: 6px;
    padding-bottom: 6px;
}


table {
    margin-top: 18px;
    margin-bottom: 36px;
}


.figcaption-firstline {
    display: flex;
    grid-template-columns: repeat(3, 1fr);
    align-content: space-between;
    display: grid;
}

figcaption.img-caption {
    white-space: nowrap;
    text-align: center;
    width: 100%;
}

#info-mission-text {
    font-size: 28px;
    padding: 24px 0 48px 0;
    line-height: 36px;
    width: 100%;
  }

  #info-title {
    font-size: 26px;
    margin: 0 0 2px;
}

/* #info-large-text — supprimé, cf design-system.css */

}


@media screen and (min-width: 900px) and (max-width: 1100px) {

  .column-grid-column {
    padding-bottom: 0;
}


  .project-content {
    width: 65.66666666%;
  }

  td.td-category {
    font-size: 18px;
    width: 36%;
}

.td-info {
    font-size: 18px;
}

.project-text {
    font-size: 24px !important;
    line-height: 32px !important;
}

.project-title-header{
    font-size: 24px;
  }


  #desktop-menu-hidden {
  display: none !important;
}

#desktop-menu-visible {
  display: flex !important;
}


#info-title {
    font-size: 66px;
    margin: 0 0 6px;
}

/* #info-large-text — supprimé, cf design-system.css */

#info-mission-text {
    font-size: 28px;
    padding: 24px 0 24px 0;
    line-height: 36px;
    width: 100%;
    display: block;
}


}


@media screen and (min-width: 1101px) and (max-width: 1440px) {

  .column-grid-column {
    padding-bottom: 0;
}

    .project-content {
    width: 65.66666666%;
  }

  td.td-category {
    font-size: 18px;
    width: 36%;
}

.td-info {
    font-size: 18px;
}

.project-text {
    font-size: 24px !important;
    line-height: 32px !important;
}

.project-title-header{
    font-size: 24px;
  }


#desktop-menu-hidden {
  display: none !important;
}

#desktop-menu-visible {
  display: flex !important;
}

#info-title {
  font-size: 88px !important;
  margin: 0 0 6px;
}

}

@media screen and (min-width: 1441px) {

  .column-grid-column {
    padding-bottom: 0;
}


  .project-content {
    width: 65.4%;
  }


#desktop-menu-hidden {
  display: none !important;
}

#desktop-menu-visible {
  display: flex !important;
}

#info-title {
  font-size: 88px !important;
  margin: 0 0 8px;
}


}



</style>