/* Arial Font Weights */
@font-face {
  font-family: 'Arial';
  src: url('../fonts/ArialRegular.woff2') format('woff2'),
       url('../fonts/ArialRegular.woff') format('woff');
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Arial';
  src: url('../fonts/ArialItalic.woff2') format('woff2'),
       url('../fonts/ArialItalic.woff') format('woff');
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: 'Arial';
  src: url('../fonts/ArialBold.woff2') format('woff2'),
       url('../fonts/ArialBold.woff') format('woff');
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Arial';
  src: url('../fonts/ArialBoldItalic.woff2') format('woff2'),
       url('../fonts/ArialBoldItalic.woff') format('woff');
  font-weight: 700;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: 'Arial';
  src: url('../fonts/ArialBlack.woff2') format('woff2'),
       url('../fonts/ArialBlack.woff') format('woff');
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}

:root {
  /*
    Pour des raisons de compatibilité, les couleurs doivent
    être définies au format RGB. En étant définies au format
    héxadécimal, le calcul des couleurs pour le pointeur sur
    les liens plante et n'affiche rien
   */
  --rose: #ff00cf;
  --vert: #32FE6A;
  --violet: #8B00E4;
  --bleu: #2C51FE;
  --jaune: #E5FC55;
  --bordeaux: #690032;
  --thover: 0.8;
  --rose-hover: rgba(255, 111, 254, var(--thover));
  --vert-hover: rgba(50, 254, 106, var(--thover));
  --violet-hover: rgba(139, 0, 228, var(--thover));
  --bleu-hover: rgba(44, 81, 254, var(--thover));
  --jaune-hover: rgba(229, 252, 85, var(--thover));
  --bordeaux-hover: rgba(105, 0, 50, var(--thover));
  --ts: 0px 3px 6px #001A48;
  --t: all 0.25s ease-in-out;
  --bs: 0px 3px 12px 3px rgba(0,0,0,0.16);
  --icon-size: 24px;
  --texte: #000;
  --color-current-page: #000;
  --color-hover-current-page: #fff;
  --three-cols-centered-layout: 46% 39% 15%;
}
html {
  height: 100%;
  font-size: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  line-height: 1.4;
}
html, body {
  position: relative;
  font-family: "Arial", sans-serif;
  color: var(--texte);
  font-size: 49px;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.02em;
  margin: 0;
  padding: 0;  
  height: 100%;
  width: 100vw;
}

body {
  overflow-x: hidden;
}

body * {
  box-sizing: border-box;
}

/*
 * Fonts
*/

h1, h2, h3 {
  position: relative;
  font-weight: 900;
  font-family: "Arial", sans-serif;
  letter-spacing: -0.04em;
}

/* H1: Arial Black (150pt maquette = 3x corps) / interligne 1.45 / crénage -50 */
h1, h2 {
  font-size: 7.8vw;
  line-height: 1;
  margin: 0 0 0.35em;
}

/* H3: Arial Black (45pt maquette = 0.9x corps) / crénage -50 */
h3 {
  font-size: 45px;
  font-weight: 900;
  margin: 30px 0 0;
}


/* Corps de texte bold: Arial Bold / crénage -25 */
p strong,
strong {
  font-weight: 700;
  letter-spacing: -0.02em;
}

/* Corps de texte italique: Arial Italic / crénage -25 */
p em,
em {
  font-style: italic;
  letter-spacing: -0.02em;
}

/* Lien sous paragraphes: Arial Bold Italic (55pt maquette = 1.1x corps) */
.paragraph-link p,
.paragraph-link a{
  font-weight: 700;
  font-style: italic;
  font-size: 20px;
  letter-spacing: -0.02em;
}

/* Footer: Arial Regular / Bold (25pt maquette = 0.5x corps) / interligne 1.3 */
.region-footer,
.region-footer p,
.region-footer a {
  font-size: 25px;
}

.region-footer strong {
  font-weight: 700;
}

/* Corps texte "Stratégie & conseil" et "Transdisciplinaire" (30pt maquette = 0.6x corps) / interligne 1.35 / crénage -25 */
.strategy-section,
.transdisciplinary-section {
  font-family: "Arial", sans-serif;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 400;
  letter-spacing: -0.02em;
}

/* Surchages couleur selon page */
.path-frontpage {--color-current-page: var(--vert); --color-hover-current-page: var(--vert-hover) }
.path-projets, .page-node-type-projet {--color-current-page: var(--violet); --color-hover-current-page: var(--violet-hover) }
.path-lagence {--color-current-page: var(--rose); --color-hover-current-page: var(--rose-hover) }
.path-valeurs {--color-current-page: var(--bleu); --color-hover-current-page: var(--bleu-hover) }
.path-contact {--color-current-page: var(--bordeaux); --color-hover-current-page: var(--bordeaux-hover) }
.path-extenso, body[class*="path-extenso"] {--color-current-page: var(--jaune); --color-hover-current-page: var(--jaune-hover); --texte: white; background: black;}


/*Swipper*/
.js-hover-images-trigger {
  cursor: pointer;
  position: relative;
  display: inline;
  text-decoration: underline;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.16em;
  transition: var(--t);
  font-style: italic; 
}

.js-hover-images-trigger.is-hovered {
  
  color: var(--vert);
}

.hover-images-popover {
  position: fixed;
  z-index: 1000;
  width: 520px;
  height: 240px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px);
  transition:
    opacity 180ms ease,
    transform 180ms ease,
    visibility 180ms ease;
}

.hover-images-popover.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.hover-images-swiper {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.hover-images-swiper .swiper-wrapper {
  align-items: center;
}

.hover-images-swiper .swiper-slide {
  width: 140px;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

.hover-images-swiper .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
  transition: transform 0.35s ease;
}

/* Image centrale */
.hover-images-swiper .swiper-slide-active {
  z-index: 5;
  transform: scale(1.18);
}

.hover-images-swiper .swiper-slide-active img {
  width: 180px;
  height: 180px;
  transform: rotate(0deg);
}

/* Petite image à gauche */
.hover-images-swiper .swiper-slide-prev {
  z-index: 3;
  transform: translateX(18px) scale(0.82);
}

.hover-images-swiper .swiper-slide-prev img {
  transform: rotate(-12deg);
  opacity: 0.92;
}

/* Petite image à droite */
.hover-images-swiper .swiper-slide-next {
  z-index: 3;
  transform: translateX(-18px) scale(0.82);
}

.hover-images-swiper .swiper-slide-next img {
  transform: rotate(12deg);
  opacity: 0.92;
}

/* Slides plus loin derrière */
.hover-images-swiper .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev):not(.swiper-slide-next) {
  opacity: 0;
  transform: scale(0.6);
  pointer-events: none;
}

@media (max-width: 700px) {
  .hover-images-popover {
    width: 360px;
    height: 190px;
  }

  .hover-images-swiper .swiper-slide {
    width: 100px;
    height: 100px;
  }

  .hover-images-swiper .swiper-slide-active img {
    width: 130px;
    height: 130px;
  }
}



/**
 * Generic
 */
a {color: var(--color-current-page);text-decoration: none;transition: var(--t);border: 0;}
a:hover, a:active, a:focus {text-decoration: none;}
a[href^="mailto:"], a[href^="http"] { color: var(--texte); }
p {margin-top: 0;}
button {transition: var(--t);}
.button {display: inline-block; cursor: pointer; line-height: 1; border-radius: 7px; background: #56b8ff; color: white; padding: 0.5em 0.75em; border: 0; position: relative; transition: var(--t); font-weight: 700; font-size: 0.9em;}
.button:hover {background: #484848; color: white;}
img {display: block;max-width: 100%; height: auto;}
.container {max-width: 1920px; margin: 0 auto; padding: 0 15px;}
.layout-sidebar-first {width: 20%; float: left;}
.layout-content {width: 100%; float: left;}
.has-sidebar-first .layout-content {width:80%;}
.has-sidebar-first.has-sidebar-second .layout-content {width:60%;}

svg {display: inline-block; height: auto; max-width: 100%;}






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

}

/* Style du rond qui suit la souris */
.hover-dot {
  position: fixed;
  top: 0;
  left: 0;
  width: 14px;
  height: 14px;
  background-color: var(--color-hover-current-page);
  border-radius: 50%;
  pointer-events: none; /* Évite d'interférer avec les clics */
  z-index: 999; /* Assure que le rond est au-dessus des autres éléments */
  display: none;
  /*transform: translate(-75%, -60%); !* Centre le rond sur la souris *!*/
  transition: background-color 0.3s ease;
}

/* Logo */
.site-logo svg {
  width: 84px;
  height: auto;
  margin-top: 20px;
  margin-left: 1.5rem;
  fill: var(--texte);
  transition: var(--t);
}

.site-logo svg:hover {
	fill: var(--color-current-page);
}

/* Bloc top large */
.region.region-top-large {
  display: flex;
  justify-content: space-between;
      margin-bottom: 20px; 
}

/* Bloc navigation principal */
#block-custom-navigationprincipale > ul {
  display: flex;
  flex-direction: row;
  gap: 30px;
  list-style-type: none;
  margin-block-start: 0;
  margin-block-end: 0;
  padding-inline-start: 0;
  padding-top: 15px;
  padding-right: 2rem;
  font-size: 30px;
  
}

#block-custom-navigationprincipale > ul > li {
  position: relative;
  list-style: none;
}

#block-custom-navigationprincipale > ul > li > a {
  cursor: default;
  border-radius: 21px;
  border-color: var(--texte);
  border-width: 1px;
  border-style: solid;
  padding: 5px 10px;
  color: var(--texte);
}

#block-custom-navigationprincipale > ul > li > a:hover, #block-custom-navigationprincipale > ul > li.menu-item--active-trail > a, .page-node-type-projet a[data-drupal-link-system-path="projets"] {
	background: var(--texte);
	color: white!important;
}


/* Lien actif */
#block-custom-navigationprincipale > ul > li > a.is-active {
  background: var(--texte);
  color: #fff;
}

/*
 * Style de l'Index (page /projets)
*/

.paragraph--type--contenu-index {
  display: grid;
  grid-template-columns: 2fr 2.5fr 0.5fr;
  gap: 10px;

  margin-bottom: 30px;
  position: relative;
  padding-bottom: 20px;
}

.paragraph--type--contenu-index::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: var(--texte);
}

/*
 * Styles du footer
 */

/* Footer: general */
footer > div {
  /*max-width: 90vw !important;*/
}

.region-footer {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	justify-content: space-between;
	border-top: 1px solid var(--texte);
	padding: 10px 0 30px;
}

.region-footer > div {
	width: 400px;
	max-width: 100%;
}
#block-custom-pieddepagecol2 p {margin: 0;}
.region-footer ul.menu {list-style: none; padding: 0; margin: 0;}

.region-footer .menu-item > * {display: inline-block; width: 100%; border-bottom: 1px solid var(--texte); color: var(--texte);}
.region-footer ul.menu > .menu-item:first-child {font-weight: 700;}
.region-footer ul.menu > .menu-item:last-child > * {border: 0;}


/* Footer: column 1 */

/* Paragraphe Icone et Lien */
.paragraph--type--icone-et-lien {
  height: var(--icon-size);
  width: var(--icon-size);
}
.paragraph--type--icone-et-lien * {
  height: 100%;
}
.paragraph--type--icone-et-lien > a {
  display: flow;
}
.paragraph--type--icone-et-lien img {
  object-fit: fill;
  border: solid 1px var(--texte);
  border-radius: 5px;
  padding: 3px;
}

/* Liste Paragraphe Icone et Lien */
.field--name-field-icone-lien {
  display: flex;
  flex-direction: row;
  gap: 5px;
}

/* Footer: column 2 */

/* Footer: column 3 */

/*.block-custom-pieddepagecol3::before {*/
/*  content: "";*/
/*  display: block;*/
/*  width: 100%;*/
/*  height: 1px;*/
/*  background-color: var(--texte);*/
/*  margin-top: 10px;*/
/*}*/

/* Visual dividers, used as toggles on some paragraphs */
.visual-separator-before::before,
.visual-separator-after::after,
.field--name-field-titre-liste-flechee::after {
  content: "";
  display: block;
  height: 1px;
  background-color: var(--texte);
}

/* Wrapper n cols */
.wrapper-two-columns > .field--name-field-contenu-wrapper-ncol {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 50px;
  padding-bottom: 20px;
  padding-top: 10px;
}

.wrapper-three-columns > .field--name-field-contenu-wrapper-ncol {
  display: grid;
  grid-template-columns: var(--three-cols-centered-layout);
  padding-bottom: 20px;
  padding-top: 10px;
}

/* Mur texte large */
.field--name-field-mur-texte-large-lignes > div:not(:first-child):before {
  content: "";
  display: block;
  height: 1px;
  background-color: var(--texte);
}

/* Formulaire inscription nl */

.form-item-adresse-mail-inscription-nl {
  flex: 1;
  height: auto;
}

#edit-adresse-mail-inscription-nl {
  border: none;
  outline: none;
  width: 100%;
  height: 100%;
  font-size: 32px;
}

.webform-inscription-nl-submit-button {
  background: none;
  color: var(--texte);
  cursor: default;
  transition: none;
}

.webform-inscription-nl-submit-button:hover {
  background: none;
  color: var(--texte);
}

/* Texte et image */
.paragraph--type--texte-et-image-lateraux {
  display: flex;
  align-items: flex-end;
}

.paragraph--type--texte-et-image-lateraux img {
  width: 12vw;
}

/* Wrapper générique */
.paragraph--type--wrapper-generique {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-content: flex-start;
}

.paragraph--type--wrapper-generique > * {
  flex-shrink: 0;
}

.node__content > .paragraph {margin-bottom: 2rem;}
.node__content > .paragraph > div > p:last-child {margin-bottom: 0;}


nav.tabs > ul.tabs {display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; gap: 20px;}

.bef-exposed-form .bef-links ul, .detail-projets-top-left ul {list-style: none; display: flex; flex-wrap: wrap; gap: 15px; font-size: 30px; padding: 0; margin: 0;}
.bef-exposed-form .bef-links ul a, .detail-projets-top-left ul li {color: var(--texte); display: inline-block; padding: 5px 10px; border-radius: 50px; border: 1px solid var(--texte);}
.bef-exposed-form .bef-links ul a:hover {color: white; background: var(--texte);}
.paragraph--type--bloc-2-colonnes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 45px;
}
.paragraph--type--bloc-2-colonnes > div {width: calc(50% - 23px);}
.paragraph--type--ligne-liste-flechee p::before {
    content: "→";
    margin-right: 8px;
}


/* Liste flechee avec titre */

.paragraph--type--liste-flechee-avec-titre {
  flex: 0 0 auto;
  width: max-content;
  min-width: 80px;
}

.field--name-field-titre-liste-flechee {padding-bottom: 5px;}

.paragraph-id-73 a::before {
  content: "→";
  margin-right: 8px;
  background: white;
  text-decoration: none;
}

/** Lien complet **/
.paragraph-id-73 a {
  color: var(--texte);
  font-weight: 700;
  font-size: 50px;
  background: white;
  position: relative;
}

.paragraph-id-73 .left_column a:hover {
  background: var(--color-current-page);
}

.paragraph-id-73 .left_column a:hover:before {
	background: white;
}

/** Lien souligne **/
.lien-fleche--souligne div > p > a {
  color: var(--texte);
  transition: none;
}

.paragraph-id-73 .right_column a:after {
  content: "";
  width: calc(100% - 50px);
  left: 50px;
  bottom: -3px;
  height: 2px;
  background: white;
  position: absolute;
}

.paragraph-id-73 .right_column a:hover:after {
	background: var(--color-current-page);
}


/*Slider accueil*/
.view-liste-projets {
  position: relative;
  overflow: hidden;
}

.view-liste-projets .view-content.liste-projets-swiper {
  overflow: visible;
  width: 100%;
  padding: clamp(4rem, 8vw, 8rem) 0 clamp(2.5rem, 5vw, 5rem);
}

.view-liste-projets .swiper-wrapper {
  align-items: flex-start;
}

.view-liste-projets .swiper-slide {
  --pyramid-y: 0px;
  --pyramid-scale: 1;
  --pyramid-opacity: 1;

  height: auto;
  opacity: var(--pyramid-opacity);
  transform: translateY(var(--pyramid-y)) scale(var(--pyramid-scale));
  transform-origin: center top;
  transition:
    transform 0.7s ease,
    opacity 0.7s ease;
  will-change: transform, opacity;
}

.view-liste-projets .swiper-slide-active {
  z-index: 100;
}

.view-liste-projets .views-row,
.view-liste-projets .views-field,
.view-liste-projets .field-content,
.view-liste-projets .swiper-slide a,
.view-liste-projets .swiper-slide picture {
  display: block;
  width: 100%;
  box-sizing: border-box;
}

.view-liste-projets .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  backface-visibility: hidden;
}

/* Sécurité : si une ligne vide passe malgré tout, on la masque. */
.view-liste-projets .swiper-slide:empty {
  display: none;
}

@media (max-width: 1023px) {
  .view-liste-projets .view-content.liste-projets-swiper {
    padding-top: 4rem;
  }
}

@media (max-width: 639px) {
  .view-liste-projets .view-content.liste-projets-swiper {
    padding: 3rem 0;
  }

  .view-liste-projets .swiper-slide {
    transform: translateY(0) scale(1);
  }
}


/*Suite css*/

a.site-logo {
    position: relative;
    z-index: 2;
}
@media (min-width: 900px) {
	.paragraph-id-74 .align-right {margin-left: 169px;}
}

.socials-links {margin: 5px 0; padding: 0; display: flex; list-style: none; gap: 5px;}
.socials-links svg {fill: var(--texte); transition: var(--t);}
.socials-links a:hover svg {fill: var(--color-current-page);}


/*Page projets*/
.view-copie-de-liste-projets.view-display-id-page_1 > .view-content {display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 2em;}
.view-copie-de-liste-projets.view-display-id-page_1 > .view-content > div {width: calc(25% - 8px);}
.view-copie-de-liste-projets.view-display-id-page_1 > .views-field-field-image-vignette img {width: 100%;}

/* Conteneur de la carte */
.flipcard {
  position: relative;
  display: grid;
  width: 100%;
  aspect-ratio: 1 / 1;
  perspective: 1000px;
}

/* Les deux faces se superposent */
.flipcard-front,
.flipcard-back {
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  transform-style: preserve-3d;

  /*
   * Transition par défaut = retour à l'état initial.
   * Donc quand on quitte le hover, le retour est plus lent.
   */
  transition:
    transform 1.25s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 1.25s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Face avant */
.flipcard-front {
  position: relative;
  z-index: 2;
  transform: rotateY(0deg);
}

/* Face arrière */
.flipcard-back {
  position: relative;
  z-index: 1;
  transform: rotateY(-180deg);
}

/* Images propres */
.flipcard img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Le lien prend toute la face arrière */
.flipcard-back a {
  color: inherit;
  text-decoration: none;
  position: relative;
}

/* Titre au dos */
.flipcard-back .title-projet-lk {
  padding: 12px;
  position: absolute;
  bottom: 0;
  left: 0; 
  width: 100%;
  height: 100%;
  background: rgba(193, 148, 255, 0.8);
    display: flex;
    flex-direction: column;
    justify-content: flex-end; 
	line-height: 1;
}

/*
 * Hover / focus :
 * transition plus rapide à l'affichage du dos.
 */
.flipcard:hover .flipcard-front,
.flipcard:focus-within .flipcard-front {
  transform: rotateY(180deg);
  transition-duration: 0.75s;
}

.flipcard:hover .flipcard-back,
.flipcard:focus-within .flipcard-back {
  z-index: 3;
  transform: rotateY(0deg);
  transition-duration: 0.75s;
}

/* Optionnel : petit effet de relief */
.flipcard:hover,
.flipcard:focus-within {
  z-index: 10;
}
.path-projets h1, .path-projets h2 {margin: 0.25em 0;}
.view-copie-de-liste-projets.view-display-id-page_1 .view-filters {margin-bottom: 0.75em;}
table.views-table {width: 100%;}
.view-id-copie_de_liste_projets.view-display-id-block_1 .view-filters {display: none;}
table.views-table {
  border-collapse: collapse;
  border-spacing: 0;
}
table.views-table tr td {border-bottom: 1px solid var(--texte); max-width: 40%;}
 
.view-id-copie_de_liste_projets.view-display-id-block_1 {margin-bottom: 1.5em;}

.titre-detail-projet {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
	border-bottom: 1px solid var(--texte);
	padding-top: 20px;
	padding-bottom: 20px;
	margin-bottom: 40px;
}
.titre-detail-projet h1 {
	margin: 0;
}

.titre-detail-projet-left {
	width: calc(100% - 250px);
}
.titre-detail-projet-right {
    max-width: 250px;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    text-align: right;
}
.titre-detail-projet-right a {color: var(--texte);}
.titre-detail-projet-right a:hover {color: var(--color-current-page);}
.detail-projets-top {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
	justify-content: space-between;
	margin-bottom: 40px;
}
.detail-projets-top > div {
	width:  calc(50% - 20px);
}
.detail-projets-top-right {font-size: 35px;}
.projets-images-internes ul {margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap;}
.projets-images-internes ul > li {width: 50%;} 
.projets-images-internes ul img, .projets-grandes-image img {width: 100%;}
#block-custom-views-block-detail-projet-block-1 {margin-bottom: 40px;}

.region-content ul.flippy {
    margin-bottom: 2em;
}
.region-content ul.flippy a {color: var(--texte);}
.region-content ul.flippy a:hover {color: var(--color-current-page);}
.field--name-field-collaborateurs {
    display: flex;
    flex-wrap: wrap;
	margin: 0 -35px;
}
.field--name-field-collaborateurs > div {width: 33.333%; border-right: 1px solid var(--color-current-page); padding: 0 35px 40px;}
.field--name-field-collaborateurs > div:nth-child(-n+3) .paragraph--type--collaborateur {border-bottom: 1px solid var(--color-current-page); height: 100%; padding-bottom: 30px;}
.field--name-field-collaborateurs > div:nth-child(3n-6) {border-right: 0;}
.paragraph--type--collaborateur {
    display: flex;
    flex-wrap: wrap;
}
.collaborateur-portrait {width: 43%;}
.collaborateur-portrait img {width: 100%;}
.collaborateur-infos {width: 57%; padding: 0 10px 0 30px; font-size: 27px;}
.content-descr-collab {
    color: var(--color-current-page);
    font-size: 15px;
    line-height: 1.2;
	display: none;
}
.field--name-field-fonction {
    font-style: italic;
    line-height: 1;
}
.show-descr-collab {cursor: pointer; color: var(--color-current-page);}


/*L agence*/
.paragraph-id-83 h2 {margin: 0.25em 0;}
.node__content > .paragraph-id-83 {margin-bottom: 0;}
.paragraph-id-84 {font-size: 30px;}
.paragraph-id-84 h3 {font-size: 45px; text-transform: uppercase; margin-top: 0;}
.rose {color: var(--rose);}
.vert {color: var(--vert);}
.survol-agitateur {transition: var(--t); position: relative;}
.survol-agitateur:hover {color: var(--color-current-page);}
.survol-agitateur:before {content: ""; position: absolute; left: -32px; top: 56%; width: 40px; height: 105px; background: url(../images/ag-left.svg) no-repeat center; background-size: 100%; opacity: 0; transition: var(--t);}
.survol-agitateur:after {content: ""; position: absolute; right: -40px; top: 20; width: 76px; height: 90px; background: url(../images/ag-right.svg) no-repeat center; background-size: 100%; opacity: 0; transition: var(--t);}
.survol-agitateur:hover:before, .survol-agitateur:hover:after {opacity: 1;}
.paragraph-id-86 h3 {font-size: 4.5vw; text-transform: uppercase; margin-top: 0;} 
svg g.svg-zone-clickable:focus,
svg g.svg-zone-clickable:focus-visible,
svg g[tabindex]:focus,
svg g[tabindex]:focus-visible {
  outline: none;
}
.svg-zone-active circle {fill: var(--texte)!important;}
.svg-zone-active text + text, .svg-zone-active #ARTS {fill: var(--texte)!important;}
.paragraph--type--schema-illustre {text-align: center;}
.field--name-field-textes-de-l-animation {display: none;}
.paragraph-id-94 h2 + h3, .paragraph-id-95 h3 {font-size: 4.8vw; line-height: 1;
    margin: 0 0 0.35em;}

.paragraph-id-94 h4 {text-transform: uppercase; margin-bottom: 0; font-weight: 900;}

.field--name-field-themes-et-textes-au-survol {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.field--name-field-themes-et-textes-au-survol > div {
	width: calc(50% - 5px);
	position: relative;
	text-align: center;
    border-radius: 30px;
    border: 1px solid var(--texte);
    padding: 35px 35px;
	font-size: 35px;
	min-height: 250px;
    display: flex;
    justify-content: center;
    flex-direction: column;	
}
.field--name-field-themes-et-textes-au-survol > div p {
	margin: 0;
}
.field--name-field-themes-et-textes-au-survol > div:first-child {background: #e5fc55;}
.field--name-field-themes-et-textes-au-survol > div:nth-child(2) {background: #ff6ffe;}
.field--name-field-themes-et-textes-au-survol > div:nth-child(3) {background: #2c51fe; color: white;}
.field--name-field-themes-et-textes-au-survol > div:nth-child(4) {background: #32fe6a;}
.field--name-field-theme {
    position: absolute;
    z-index: 2;
    background: white;
    left: 0;
    top: 0;
    border-radius: 30px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    font-weight: 700;
    font-size: 3.5vw;
	opacity: 1;
	transition: var(--t);
	color: var(--texte);
}
.field--name-field-themes-et-textes-au-survol > div:hover .field--name-field-theme {opacity: 0;}
.node__content > .paragraph-95 {margin-bottom: 0;}

/*Contact*/
.node--type-contact { 
    font-size: 32px;
}
.contact_top, .contact_bottom {
    display: flex;
	flex-wrap: wrap;
    border-top: 1px solid var(--texte);
    padding-top: 30px;
	gap: 20px;
}

.contact_top > div, .contact_bottom > div {width: calc(33.333% - 14px);}
#edit-nl-wrap {
    display: flex;
    border-bottom: 1px solid var(--texte);
}
.contact_bottom {margin-bottom: 2em;}
.field--name-field-menu ul.menu {
	padding: 0; 
	list-style: none;
	margin: 0 0 2em;
}
.field--name-field-menu ul.menu > li > * {display: inline-block;
    width: 100%;
    border-bottom: 1px solid var(--texte);
    color: var(--texte);
	padding: 6px;
}
.field--name-field-menu ul.menu > li:last-child > * {border: 0;}
.field--name-field-coordonnees a {color: inherit;} 
.field--name-field-coordonnees a:hover {color: var(--color-current-page);}
.field--name-field-menu ul.menu > li:first-child > * {font-weight: 700;}
.field--name-field-menu ul.menu > li > a:hover {color: var(--color-current-page);}

/*extenso*/
.anchor {position: relative; top: -20px;}
body[class*="path-extenso"] #block-custom-navigationprincipale > ul > li > a {color: var(--color-current-page); border-color: var(--color-current-page);}
body[class*="path-extenso"] #block-custom-navigationprincipale > ul > li > a.is-active, body[class*="path-extenso"] #block-custom-navigationprincipale > ul > li > a:hover {
    background: var(--color-current-page);
    color: black!important;
}
.bloc-extenso-content h2 {
    font-size: 2.75vw;
    margin-bottom: 0;
}
.field--name-field-liens-extenso {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.field--name-field-liens-extenso > div {width: calc(25% - 8px); transition: var(--t); background: white; color: black;}
.field--name-field-liens-extenso .field--name-field-description {
    font-size: 28px;
    font-weight: 700;
	transition: var(--t);
	opacity: 0;
}
.field--name-field-liens-extenso > div:hover {background: var(--color-current-page);}
.field--name-field-liens-extenso > div:hover .field--name-field-description {opacity: 1;}
.paragraph--type--bloc-extenso {
    height: 100%;
}
.paragraph--type--bloc-extenso a {
    height: 100%;
    display: block;
	color: inherit;
}
.bloc-extenso-content {
    height: 100%;
    justify-content: space-between;
    display: flex;
    flex-direction: column;
	padding: 15px;
}


.view-extenso .views-row {
	font-size: 35px;
}

.view-extenso .views-row .views-field-title {
	text-transform: uppercase;
	font-weight: 900;
}
.view-extenso .view-content.extenso-masonry {
  --extenso-gap: 24px;
  position: relative;
}

.view-extenso .view-content.extenso-masonry .views-row {
  box-sizing: border-box;
  will-change: transform;
  transition: transform 0.2s ease, width 0.2s ease;
}

.view-extenso .view-content.extenso-masonry .views-field-field-image-vignette img {
  display: block;
  width: 100%;
  height: auto;
}

.view-extenso .view-content.extenso-masonry .views-field-title {
  margin-top: 8px;
}

.view-extenso .view-content.extenso-masonry .views-field-field-resume {
  margin-top: 4px;
}

.view-extenso h1 em {font-weight: 400;}