.gd-acf-label {
      font-weight: 400 !important;
    }
  /* plus d'override desktop ici */
/* ====== GD – Tableau ACF (style “fiche projet”) ====== */
.gd-acf-wrap {
  background: #fff;
}

.gd-acf-table {
  width: 100%;
  border-collapse: collapse; /* pas de doubles bordures */
  table-layout: fixed;
  background: #fff;
  font-size: 1rem;
}

/* Lignes: uniquement en bas */
.gd-acf-table th,
.gd-acf-table td {
  border: none;
  border-bottom: 1px solid var(--e-global-color-text, #000);
  padding: .2rem 0; /* espacement vertical */
  vertical-align: top;
}

/* Colonne labels (gauche) */
.gd-acf-label {
  width: 32%;
  padding-right: 1rem;
  text-align: left;
  font-weight: 400;
  color: var(--e-global-color-accent); /* bronze / accent Elementor */
  white-space: nowrap;
}

/* Colonne valeurs (droite) */
.gd-acf-value {
  width: 68%;
  color: var(--e-global-color-text, #000); /* texte en noir */
  word-break: break-word;
  padding: .2rem 0;
}

/* Nettoyage typographique des valeurs longues */
.gd-acf-value p { margin: 0; }
.gd-acf-value p + p { margin-top: .5rem; }

.gd-acf-table,
.gd-acf-table tr,
.gd-acf-table th,
.gd-acf-table td {
  background: #fff !important;
}

/* Responsive */
@media (max-width: 767px) {
  .gd-acf-label { width: 38%; }
  .gd-acf-value { width: 62%; }
}

/* ===== GD – Flexible "Médias" ===== */
.gd-medias {
  --gd-cols: 2;           /* fallback si inline style absent */
  --gd-gap: 20px;
  display: grid;
  grid-template-columns: repeat(var(--gd-cols), minmax(0, 1fr));
  gap: var(--gd-gap);
  padding: 0 20px;        /* marge horizontale pour tout le contenu */
}

/* Mobile: 1 colonne */
@media (max-width: 767px) {
  .gd-medias {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

/* Items */
.gd-medias .gd-item { /* reset éventuels */
  background: transparent;
}

/* Images */

/* Responsive : tableau infos projet sur 1 colonne en tablette (Elementor) */
@media (max-width: 1024px) {
  .gd-acf-table tr {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .gd-acf-label,
  .gd-acf-value {
    width: 100% !important;
    padding-right: 0;
    text-align: left;
    white-space: normal;
  }
  .gd-acf-label {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    font-weight: 600;
  }
  .gd-acf-label {
    border-bottom: none !important;
  }
  .gd-acf-value {
    border-bottom: 1px solid var(--e-global-color-text, #000) !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}
.gd-medias .gd-item--image .gd-img {
  width: 100%;
  height: auto;
  display: block;
}

/* Texte */
.gd-medias .gd-item--texte .gd-text {
  /* Ajuste la typo selon ta grille globale */
}

/* Style pour l'exposant des siècles (e en exposant) avec contrôle précis */
.ordinal,
.gd-text .ordinal,
.gd-item--texte .ordinal,
p .ordinal {
  font-size: 0.8em !important;
  position: relative !important;
  top: -0.4em !important;
  line-height: 0 !important;
  display: inline-block !important;
}

/* Optionnel: harmoniser les marges internes du texte */
.gd-medias .gd-item--texte .gd-text > *:first-child { margin-top: 0; }
.gd-medias .gd-item--texte .gd-text > *:last-child { margin-bottom: 0; }

/* Si tu veux imiter des “cartouches” sans fond: laisser blanc partout */
.gd-medias, .gd-medias * {
  background: transparent !important;
}
.gd-medias .gd-item--texte,
.gd-medias .gd-item--citation {    /* on ajoute aussi infos ici si tu veux l’aligner comme les autres */
  align-self: center;
}
.gd-medias .gd-item--infos {    /* on ajoute aussi infos ici si tu veux l’aligner comme les autres */
  align-self: top;
}
.elementor .gd-medias {
  display: grid !important;
  grid-template-columns: repeat(var(--gd-cols, 2), minmax(0, 1fr)) !important;
  gap: var(--gd-gap, 20px) !important;
}
@media (max-width: 767px) {
  .elementor .gd-medias { grid-template-columns: 1fr !important; gap: 20px !important; }
}


/* Appliquer un fond blanc uniquement aux SVG ouverts dans la lightbox Elementor */
.elementor-lightbox img[src$=".svg"] {
  background: #fff;
  padding: 10px; /* optionnel : petit mat blanc autour */
  border-radius: 4px; /* optionnel : coins arrondis */
}

/* Centrer le bloc infos (horizontal + vertical) dans la grille */
.gd-medias .gd-item--infos{
  place-self: start;      /* alignement gauche + haut */
  align-self: start;
  justify-self: start;
  width: 100%;
  text-align: left;
}

/* Texte : bloc aligné à gauche, contenu centré verticalement */
.gd-medias .gd-item--texte {
  align-self: start;           /* garde le bloc à gauche */
  display: flex;
  flex-direction: column;
  justify-content: center;     /* centre verticalement le contenu */
  flex: 1 1 auto;              /* permet au bloc texte d'occuper l'espace disponible */
  text-align: left;
  box-sizing: border-box;
  padding: 0.5rem 0;           /* ajustable */
}

/* S'assurer que le conteneur texte prend toute la largeur de la colonne */
.gd-medias .gd-item--texte .gd-text {
  width: 100%;
  margin: 0;
}

/* Le bloc image reste collé en bas du .gd-item */
.gd-medias .gd-item--image {
  margin-top: auto;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

/* Optionnel : si tu veux un contenu plus étroit et vraiment centré */
.gd-medias .gd-item--infos .gd-acf-wrap, .gd-medias .gd-item--texte .gd-text {
  max-width: 640px;            /* ajuste à ton goût (480/560/720…) */
  margin: 0;              /* centre horizontalement le contenu interne */
}
/* Cartes "plans" : aligner l'image sur le bas de la cellule, légende alignée à gauche */
.gd-medias .gd-item--plan {
  display: flex;
  flex-direction: column;
  justify-content: flex-end; /* colle l'image au bas de la cellule */
  align-items: flex-start;   /* force image + légende à gauche (corrige l'alignement à droite) */
}
.gd-medias .gd-item--plan .gd-caption {
  align-self: stretch;       /* prendre toute la largeur disponible */
  text-align: left !important;
  color: var(--e-global-color-text, #000);
  font-style: normal;
  margin-top: .5rem;
}

/* Sécurité : les images plans restent fluides */
.gd-medias .gd-item--plan .gd-img{
  display: block;
  width: 100%;
  height: auto;
}

/* Forcer les items à occuper la colonne et pousser les images en bas */
.gd-medias .gd-item {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  /* min-height: 160px; optionnel : ajuste selon ton design */
}

/* Le bloc image est poussé vers le bas du .gd-item */
.gd-medias .gd-item--image {
  margin-top: auto;          /* pousse ce bloc vers le bas */
  display: flex;
  justify-content: flex-end;;   /* centre horizontalement l'image si souhaité */
  align-items: flex-end;     /* aligne le contenu interne sur le bas */
}

/* sécurité : l'image reste fluide */
.gd-medias .gd-item--image .gd-img{
  display: block;
  width: 100%;
  height: auto;
}

/* Ajustement mobile */
@media (max-width: 767px) {
  .gd-medias .gd-item { min-height: 120px; }
}

/* Étire toujours le fond à 100% de largeur, hauteur auto, ancré bas-gauche */
.bg-100w,
.bg-100w > .elementor-background-overlay,
.bg-100w > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-size: 100% auto !important;      /* ← clé */
  background-repeat: no-repeat !important;
  background-position: left bottom !important; /* aligne bas-gauche */
}

/* Assure que le conteneur-lien occupe bien tout l'espace */
.bg-100w.e-con { 
  display: block;
  width: 100%;
  height: 100%;
}

/* Title: aligner à gauche et marge spécifiée */
.gd-item--title {
  justify-self: start; /* assure l'item au début de la grille */
}
.gd-item--title .gd-title {
  text-align: left !important;
  margin: 0 !important; /* valeur voulue */
}

/* Hero image : pleine largeur de la page avec marges de 20px */
.gd-hero {
  position: relative;
  width: calc(100vw - 40px);
  margin-left: calc(-50vw + 50% + 20px);
  height: calc(100vh - var(--site-header-height, 0px) - 150px);
  min-height: 50vh;
  overflow: hidden;
  margin-top: 0;
  margin-bottom: 20px;
  margin-right: 20px;
  padding: 0;
  top: 0;
}

/* Mode parallax : garde la pleine largeur avec marges de 20px */
.gd-hero--parallax {
  width: calc(100vw - 40px); /* Largeur avec marges */
  margin-left: calc(-50vw + 50% + 20px); /* Marge gauche de 20px */
  margin-right: 20px; /* Marge droite de 20px */
}

.gd-hero a {
  display: block;
  width: 100%;
  height: 100%;
}

.gd-hero .gd-hero__img {
  width: 100% !important;
  min-width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

/* Mobile : maintenir le comportement responsive */
@media (max-width: 767px) {
  .gd-hero {
    height: 60vh;
    min-height: 40vh;
  }
}

/* Mode parallax : image adaptative pour le défilement */
.gd-hero--parallax {
  overflow: hidden; /* Empêche l'image de sortir du cadre */
}

.gd-hero--parallax .gd-hero__img {
  width: 100% !important; /* Largeur complète forcée */
  min-width: 100%; /* Force la largeur minimale */
  height: auto; /* Hauteur automatique pour garder le ratio */
  min-height: 100%; /* Minimum pour couvrir le conteneur */
  object-fit: cover; /* Maintenir le ratio avec couverture complète */
  object-position: top center; /* Position de départ en haut */
  transform: translateY(0px); /* Sera animé par JS */
  will-change: transform;
}

/* Mode proportions : image maximale visible, centrée, sans coupure */
.gd-hero--proportions {
  height: auto;
  min-height: 50vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px; /* Marge sur tous les côtés comme le bloc medias */
  text-align: center;
  box-sizing: border-box;
}

.gd-hero--proportions .gd-hero__img {
  width: 100%; /* Prend toute la largeur disponible */
  height: auto; /* Hauteur proportionnelle */
  max-height: calc(100vh - var(--site-header-height, 0px) - 100px); /* Hauteur max écran */
  object-fit: contain; /* Image complète sans coupure */
  object-position: center center;
  display: block;
  margin: 0 auto;
}

/* Protection des images contre le clic droit */
.gd-hero__img, 
.gd-img {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
  pointer-events: auto; /* Garde les clics pour la lightbox */
}

/* Variables CSS pour le hero */
:root {
  --site-header-height: 0px; /* Calculé par JS */
}

/* Bouton retour haut (single realisation + projet) */
.gd-backtotop-wrap {
  display: flex;
  justify-content: center;
  margin: 28px 0 44px;
}

.gd-backtotop {
  width: 44px;
  height: 44px;
  border: 1px solid #8c7965;
  border-radius: 50%;
  background: #fff;
  color: #8c7965;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform .18s ease, background-color .18s ease, color .18s ease;
}

.gd-backtotop:hover,
.gd-backtotop:focus-visible {
  background: #8c7965;
  color: #fff;
  transform: translateY(-2px);
}

.gd-backtotop .e-font-icon-svg {
  width: 23.33px;
  height: 13.79px;
  fill: currentColor;
  transform: translateY(-2px);
}

@media (max-width: 767px) {
  .gd-backtotop-wrap {
    margin: 22px 0 34px;
  }
}