/* VEM CK — VERSION 9.17 — Joomla 4 / corrections finales */
html { min-height: 100%; }
body { margin:0; padding:0; color:#333; background:#fff; font-family:Montserrat, Arial, Helvetica, sans-serif; font-size:16px; line-height:1.5; }
*, *:before, *:after { box-sizing:border-box; }
img { max-width:100%; height:auto; border:0; }
a { text-decoration:none; }
.clearfix:before,.clearfix:after { content:" "; display:table; }
.clearfix:after { clear:both; }

.vem-container { width:100%; max-width:var(--vem-max-width,1170px); margin:0 auto; padding-left:15px; padding-right:15px; }

/* Header: mirrors the current 3/9 Helix row (logo / navigationMenu). */
#vem-header { background:#fff; width:100%; z-index:1000; }
.vem-sticky-header { position:sticky; top:0; }
.vem-header-inner { display:flex; align-items:center; min-height:142px; }
.vem-logo { flex:0 0 25%; max-width:25%; padding-right:15px; }
.vem-logo img { display:block; max-height:132px; width:auto; }
.vem-navigation { flex:0 0 75%; max-width:75%; display:flex; align-items:center; justify-content:flex-end; min-width:0; }
.vem-navigation > * { width:100%; }

/* Breadcrumb / related tags row. */
.vem-breadcrumb-row { background:#fff; }
.vem-breadcrumb-row .vem-container {
  padding-top:0;
  padding-bottom:0;
  border-top:1px solid #f7c03f;
}

/* VEM 9.13 — diaporama autonome : seul le fond photographique est animé. */
.vem-home-slider {
  width:100%;
  height:470px;
  min-height:470px;
  margin:0;
  padding:0;
  overflow:hidden;
}

.vem-native-slider,
.vem-native-slides {
  position:relative;
  width:100%;
  height:470px;
  overflow:hidden;
  background:#fff;
}

.vem-native-slide {
  position:absolute;
  inset:0;
  z-index:1;
  display:block;
  width:100%;
  max-width:none;
  height:470px;
  object-fit:cover;
  object-position:center center;
  opacity:0;
  transition:opacity 1.5s ease-in-out;
}

.vem-native-slide.is-active {
  z-index:2;
  opacity:1;
}

.vem-native-overlay {
  position:absolute;
  z-index:10;
  left:50%;
  top:50%;
  width:min(966px, calc(100% - 40px));
  margin:0;
  padding:22px 24px 14px;
  color:#fff;
  background:rgba(123,135,46,.60);
  font-family:Montserrat,Arial,Helvetica,sans-serif;
  font-style:normal;
  font-weight:400;
  text-align:center;
  transform:translate(-50%,-50%);
}

.vem-native-title {
  margin:0;
  padding:0;
  color:#fff;
  font-size:clamp(34px,3.5vw,70px);
  font-weight:400;
  line-height:1.08;
}

.vem-native-overlay p {
  margin:18px 0 0;
  padding:0;
  color:#fff;
  font-size:clamp(17px,1.5vw,30px);
  font-weight:400;
  line-height:1.16;
  text-align:center;
}

.vem-native-overlay a,
.vem-native-overlay a:visited {
  display:inline-block;
  margin-top:16px;
  padding:2px 15px 3px;
  border:1px solid #fff;
  color:#fff;
  background:transparent;
  font-size:22px;
  line-height:26px;
  text-decoration:none;
}

.vem-native-overlay a:hover,
.vem-native-overlay a:focus {
  border-color:#f7c03f;
  color:#f7c03f;
}

@media (max-width:767px) {
  .vem-home-slider,
  .vem-native-slider,
  .vem-native-slides,
  .vem-native-slide {
    height:360px;
    min-height:360px;
  }

  .vem-native-overlay {
    width:calc(100% - 24px);
    padding:16px 14px 12px;
  }

  .vem-native-title {
    font-size:clamp(25px,7vw,34px);
    line-height:1.12;
  }

  .vem-native-overlay p {
    margin-top:12px;
    font-size:14px;
    line-height:1.38;
  }

  .vem-native-overlay a,
  .vem-native-overlay a:visited {
    margin-top:11px;
    padding:3px 12px 4px;
    font-size:16px;
    line-height:22px;
  }

  .vem-desktop-break {
    display:none;
  }
}

/* ======================================
   VEM v9.12 — Slider CK : photos en fondu, texte entièrement fixe
   ====================================== */

/* Le module sort de toute largeur de contenu imposée par Page Builder CK. */
.vem-home-slider,
.vem-home-slider .rowck,
.vem-home-slider .rowck > .inner,
.vem-home-slider .blockck,
.vem-home-slider .blockck > .inner,
.vem-home-slider .innercontent,
.vem-home-slider .cktype[data-type="slider"] {
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

.vem-home-slider .pbck_slider {
  position:relative !important;
  left:50% !important;
  width:100vw !important;
  max-width:none !important;
  height:470px !important;
  margin:0 0 0 -50vw !important;
  overflow:hidden !important;
}

.vem-home-slider .pbck_slides,
.vem-home-slider .pbck_wrap,
.vem-home-slider .pbck_wrapinner,
.vem-home-slider .pbck_slide,
.vem-home-slider .pbck_slide_img {
  height:470px !important;
  min-height:470px !important;
}

.vem-home-slider .pbck_wrapinner {
  position:relative !important;
  width:100% !important;
  margin-left:0 !important;
  transform:none !important;
  transition:none !important;
}

.vem-home-slider .pbck_slide {
  position:absolute !important;
  inset:0 !important;
  float:none !important;
  width:100% !important;
  opacity:0 !important;
  visibility:visible !important;
  transition:opacity 1.5s ease-in-out !important;
}

.vem-home-slider .pbck_slide.current {
  opacity:1 !important;
  z-index:2 !important;
}

.vem-home-slider .pbck_slide_img {
  width:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  object-position:center center !important;
}

/* Les légendes liées aux images sont remplacées par une légende unique. */
.vem-home-slider .pbck_slide_caption {
  display:none !important;
}

.vem-home-slider .vem-static-slider-caption {
  position:absolute !important;
  z-index:20 !important;
  left:50% !important;
  top:50% !important;
  bottom:auto !important;
  display:block !important;
  width:min(966px, calc(100% - 40px)) !important;
  margin:0 !important;
  padding:22px 24px 14px !important;
  color:#fff !important;
  background:rgba(123,135,46,.60) !important;
  font-family:Montserrat,Arial,Helvetica,sans-serif !important;
  font-style:normal !important;
  text-align:center !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translate(-50%,-50%) !important;
  transition:none !important;
}

.vem-home-slider .vem-static-slider-caption .pbck_slide_title,
.vem-home-slider .vem-static-slider-caption .pbck_slide_desc {
  display:block !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  color:#fff !important;
  background:transparent !important;
  font-family:Montserrat,Arial,Helvetica,sans-serif !important;
  font-style:normal !important;
  font-weight:400 !important;
  text-align:center !important;
  opacity:1 !important;
}

.vem-home-slider .vem-static-slider-caption .pbck_slide_title {
  font-size:clamp(34px,3.5vw,70px) !important;
  line-height:1.08 !important;
}

.vem-home-slider .vem-static-slider-caption .pbck_slide_desc {
  font-size:clamp(17px,1.5vw,30px) !important;
  line-height:1.16 !important;
}

.vem-home-slider .vem-static-slider-caption > br {
  display:none !important;
}

.vem-home-slider .vem-static-slider-caption .vem-slider-intro {
  margin:18px 0 0 !important;
  color:#fff !important;
  font:inherit !important;
  text-align:center !important;
}

.vem-home-slider .vem-static-slider-caption .vem-slider-more {
  margin:16px 0 0 !important;
  text-align:center !important;
}

.vem-home-slider .vem-static-slider-caption .vem-slider-more a,
.vem-home-slider .vem-static-slider-caption .vem-slider-more a:visited {
  display:inline-block !important;
  padding:2px 15px 3px !important;
  border:1px solid #fff !important;
  color:#fff !important;
  background:transparent !important;
  font-size:22px !important;
  line-height:26px !important;
  text-decoration:none !important;
}

.vem-home-slider .pbck_slider_controls,
.vem-home-slider .pbck_slider_thumbs,
.vem-home-slider .pbck_slider_thumbs_control {
  display:none !important;
}

@media (max-width:767px) {
  .vem-home-slider,
  .vem-home-slider .pbck_slider,
  .vem-home-slider .pbck_slides,
  .vem-home-slider .pbck_wrap,
  .vem-home-slider .pbck_wrapinner,
  .vem-home-slider .pbck_slide,
  .vem-home-slider .pbck_slide_img {
    height:360px !important;
    min-height:360px !important;
  }

  .vem-home-slider .vem-static-slider-caption {
    width:calc(100% - 24px) !important;
    padding:16px 14px 12px !important;
  }

  .vem-home-slider .vem-static-slider-caption .pbck_slide_title {
    font-size:clamp(25px,7vw,34px) !important;
    line-height:1.12 !important;
  }

  .vem-home-slider .vem-static-slider-caption .pbck_slide_desc {
    font-size:14px !important;
    line-height:1.38 !important;
  }

  .vem-home-slider .vem-static-slider-caption .vem-slider-more a,
  .vem-home-slider .vem-static-slider-caption .vem-slider-more a:visited {
    font-size:16px !important;
    line-height:22px !important;
  }
}

/* Fil d'Ariane : présentation compacte de l'ancien site. */
#vem-breadcrumb ul.breadcrumb {
  background:transparent;
  margin:0;
  padding:8px 15px 6px;
  font-size:14px;
  line-height:22px;
}
#vem-breadcrumb .breadcrumb a { color:#07683a; }
#vem-breadcrumb .breadcrumb .active,
#vem-breadcrumb .breadcrumb > li:last-child { color:#888; }
#vem-breadcrumb .breadcrumb .divider {
  color:#999;
  margin:0 8px;
  font-size:0;
}
#vem-breadcrumb .breadcrumb .divider img { display:none; }
#vem-breadcrumb .breadcrumb .divider::after {
  content:"/";
  font-size:14px;
}

/* Main content: normal Joomla pages are centered; homepage is rebuilt directly in this template. */
#vem-main { width:100%; margin:0; padding:0; overflow:visible; }
#vem-main:after { content:""; display:block; clear:both; }
.vem-main-contained > .vem-main-inner { width:100%; max-width:var(--vem-max-width,1170px); margin:0 auto; padding-left:15px; padding-right:15px; }


/* Current Footer sup Helix row: 3/9, green background. */
.vem-footer-sup { background:#07683a; width:100%; }
.vem-footer-sup-inner { display:flex; align-items:stretch; padding-top:0; padding-bottom:0; }
.vem-footer-logo-col { flex:0 0 25%; max-width:25%; min-width:0; }
.vem-footer-content-col { flex:0 0 75%; max-width:75%; min-width:0; }

.vem-footer { background:#fff; width:100%; }

/* Never impose Template Creator's old 1000px wrapper. The outer main wrapper controls page width. */
#vem-wrapper, #vem-main { max-width:none; }
.vem-main-contained .item-page, .vem-main-contained .blog { max-width:none; }

/* Joomla message reset */
#system-message-container { width:100%; max-width:var(--vem-max-width,1170px); margin:0 auto; }

@media (max-width: 991px) {
  .vem-header-inner { min-height:auto; padding-top:10px; padding-bottom:10px; flex-wrap:wrap; }
  .vem-logo { flex:0 0 35%; max-width:35%; }
  .vem-navigation { flex:0 0 65%; max-width:65%; }
  .vem-logo img { max-height:100px; }
  .vem-footer-logo-col { flex:0 0 30%; max-width:30%; }
  .vem-footer-content-col { flex:0 0 70%; max-width:70%; }
}

@media (max-width: 767px) {
  .vem-sticky-header { position:relative; }
  .vem-header-inner { display:block; }
  .vem-logo, .vem-navigation { max-width:100%; width:100%; }
  .vem-logo { padding-right:0; text-align:center; }
  .vem-logo img { margin:0 auto 10px; max-height:90px; }
  .vem-navigation { display:block; }
  .vem-footer-sup-inner { display:block; }
  .vem-footer-logo-col, .vem-footer-content-col { width:100%; max-width:100%; }
}

/* -------------------------------------------------------
   VEM homepage rebuilt from SP Page Builder export (v0.3)
   ------------------------------------------------------- */
.vem-main-home { width:100%; max-width:none; margin:0; padding:0; overflow:hidden; }
.vem-home-content { width:100%; max-width:1170px; margin:0 auto; padding-left:15px; padding-right:15px; }
.vem-home-slider { width:100%; margin:0; padding:0; overflow:hidden; }
.vem-home-slider > div, .vem-home-slider .moduletable { margin:0; padding:0; }
.vem-home-slider img { width:100%; max-width:none; }

.vem-home-keynumbers { background:#fff; margin:0; padding:0; }
.vem-home-keynumbers-inner { padding-top:40px; padding-bottom:20px; }
.vem-home-heading { margin:0; color:#07683a; font-family:Montserrat,Arial,Helvetica,sans-serif; font-size:53px; line-height:1.12; font-weight:600; }
.vem-home-numbers-module { margin-top:50px; margin-bottom:-10px; }

.vem-home-figure { width:100%; margin:0; padding:0; background:#f7c03f; border-top:1px solid #f7c03f; border-bottom:1px solid #f7c03f; }
.vem-home-figure-module { width:100%; margin:0; padding:0; }
.vem-home-figure-module > div, .vem-home-figure-module .moduletable { margin:0; }

.vem-home-data-link { background:#f7c03f; padding:20px 0 7px; }
.vem-home-link-grid { display:grid; grid-template-columns:25% 50% 25%; align-items:center; }
.vem-home-link-grid p { margin:0; padding:10px 0; text-align:center; }
.vem-home-link-grid a { display:block; color:#07683a; font-family:Montserrat,Arial,Helvetica,sans-serif; font-size:20px; line-height:1.4; border:1px solid #07683a; padding:10px 15px; background:transparent; }
.vem-home-link-grid a:hover { color:#f7c03f; background:#07683a; }

.vem-home-news { background:#fff; padding:36px 0 30px; }
.vem-home-news .vem-home-heading { margin-bottom:20px; }
.vem-home-news-module { margin-top:20px; }
.vem-home-news-link { margin-top:0; }

/* Avoid title/component remnants from the Joomla menu item chosen as homepage. */
.vem-is-home #vem-breadcrumb { display:none; }

@media (max-width: 991px) {
  .vem-home-heading { font-size:42px; }
  .vem-home-link-grid { grid-template-columns:15% 70% 15%; }
}
@media (max-width: 767px) {
  .vem-home-keynumbers-inner { padding-top:25px; }
  .vem-home-heading { font-size:34px; }
  .vem-home-numbers-module { margin-top:25px; margin-bottom:0; }
  .vem-home-link-grid { display:block; }
  .vem-home-link-grid > div { display:none; }
  .vem-home-link-grid p { padding:10px 0; }
  .vem-home-news { padding-top:25px; }
}

/* =======================================================
   VEM — titres des pages, rythme vertical et liens (v5)
   ======================================================= */

/* Certaines pages « tableaux de bord » placent leur titre dans
   le premier h2 de l'article au lieu d'utiliser un h1/page-header. */
#vem-main .item-page > h2:first-of-type,
#vem-main article.item-page > h2:first-of-type,
#vem-main .item-page .item-content > h2:first-of-type,
#vem-main .item-page .article-content > h2:first-of-type {
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    font-weight: 600 !important;
    margin: 38px 0 10px !important;
    padding: 0 !important;
}

/* Intertitres réels : légèrement moins forts que le titre de page. */
#vem-main .item-page > h2:not(:first-of-type),
#vem-main .item-page .item-content > h2:not(:first-of-type),
#vem-main .item-page .article-content > h2:not(:first-of-type) {
    color: #07683a !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    margin: 26px 0 12px !important;
    padding: 0 !important;
}

#vem-main .item-page h3,
#vem-main .item-page .item-content h3,
#vem-main .item-page .article-content h3 {
    color: #07683a;
    font-size: 20px;
    line-height: 1.35;
    font-weight: 500;
    margin: 22px 0 10px;
}

/* Rythme des paragraphes, notamment sous les visuels des tableaux de bord. */
#vem-main .item-page > p,
#vem-main .item-page .item-content > p,
#vem-main .item-page .article-content > p {
    margin: 0 0 16px;
    padding: 0;
}

/* Tous les véritables hyperliens du contenu reprennent le vert VEM,
   y compris après visite. Le footer et le menu principal sont hors #vem-main. */
#vem-main a:not(.buttonck),
#vem-main a:not(.buttonck):visited {
    color: #07683a !important;
}

#vem-main a:not(.buttonck):hover,
#vem-main a:not(.buttonck):focus {
    color: #b78308 !important;
}

/* Les en-têtes d'accordéons sont des commandes sur fond coloré :
   ils conservent la couleur prévue par leur module. */
#vem-main .accordion-heading a,
#vem-main .accordion-toggle,
#vem-main [class*="accordeon"] a,
#vem-main [class*="accordion"] a,
#vem-main [class*="accordeon"] a:visited,
#vem-main [class*="accordion"] a:visited {
    color: inherit !important;
}

@media (max-width: 767px) {
    #vem-main .item-page > h2:first-of-type,
    #vem-main article.item-page > h2:first-of-type,
    #vem-main .item-page .item-content > h2:first-of-type,
    #vem-main .item-page .article-content > h2:first-of-type {
        font-size: 27px !important;
        margin-top: 25px !important;
    }
}
/* VEM — espacement des sous-menus comme sur le site d’origine */
#vem-navigation .maximenuck2 li.maximenuck > a.maximenuck,
#vem-navigation .maximenuck2 li.maximenuck > span.separator {
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 24px;
}

/* =======================================================
   VEM — passerelle visuelle Floox/Helix vers le template CK
   Valeurs utiles reprises de l'ancien template, sans ses
   dépendances ni ses milliers de règles de framework.
   ======================================================= */

/* Typographie générale de l'ancien site */
body {
    line-height: 28px;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body,
button,
input,
select,
textarea {
    font-family: Montserrat, Arial, Helvetica, sans-serif;
}

/* Le bandeau Floox mesurait 140 px. Le contenu du header
   était placé environ 15 px plus à droite que sur le clone. */
.vem-header-inner {
    min-height: 140px;
    position: relative;
    left: 15px;
}

.vem-logo img {
    max-height: 140px;
}

/* Reproduit le centrage vertical constaté sur le site public. */
.vem-navigation {
    transform: translateY(-20px);
}

/* Menu principal : valeurs typographiques de référence.
   Pas de capitales forcées, car Maximenu conserve les libellés
   tels qu'ils apparaissent actuellement sur le site. */
#vem-navigation > div > ul > li > a,
#vem-navigation > div > ul > li > span,
#vem-navigation ul.maximenuck > li.maximenuck.level1 > a.maximenuck,
#vem-navigation ul.maximenuck > li.maximenuck.level1 > span.separator {
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 400;
}

/* Sous-menus : couleurs et graisse de l'ancien Floox. */
#vem-navigation .maximenuck2 {
    background: #fff;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .20);
}

#vem-navigation .maximenuck2 li.maximenuck > a.maximenuck,
#vem-navigation .maximenuck2 li.maximenuck > span.separator {
    color: #141414;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 300;
}

/* Accueil : respiration observée entre le slider, le titre
   et le module des chiffres clés sur le site d'origine. */
.vem-home-keynumbers-inner {
    padding-top: 90px;
}

.vem-home-numbers-module {
    margin-top: 100px;
}

/* Les quatre indicateurs constituent une famille propre :
   vert VEM et graisse soutenue, distincte du corps d'article. */
.vem-home-numbers-module,
.vem-home-numbers-module p,
.vem-home-numbers-module span,
.vem-home-numbers-module strong {
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-weight: 700 !important;
}

/* Titres principaux */
.vem-home-heading,
.vem-main-contained h1 {
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 53px;
    line-height: 1.12;
    font-weight: 600;
}

/* Articles Joomla : valeurs utiles de l'ancien template */
.vem-main-contained .item-page,
.vem-main-contained .item-page p,
.vem-main-contained article.item-page {
    color: #666d70;
    font-size: 18px;
    line-height: 28px;
}

.vem-main-contained article.item {
    margin-bottom: 30px;
}

.vem-main-contained article.item h2,
.vem-main-contained article.item h2 a {
    color: #3c3d41;
    font-size: 36px;
    line-height: 1.25;
    letter-spacing: -1px;
    font-weight: 400;
}

/* Titre d'une page ou d'un article : vert et plus soutenu
   que les titres des listes d'actualités. */
.vem-main-contained .item-page > h1,
.vem-main-contained article.item-page .page-header h1,
.vem-main-contained article.item-page .page-header h2,
.vem-main-contained article.item-page .entry-header h1,
.vem-main-contained article.item-page .entry-header h2 {
    color: #07683a;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 36px;
    line-height: 1.2;
    letter-spacing: -1px;
    font-weight: 600;
    margin-top: 30px;
    margin-bottom: 25px;
}

/* Intertitres de niveau 2 à l'intérieur d'un article.
   Ils ne doivent pas reprendre la forte graisse du titre de page. */
.vem-main-contained .item-page > h2,
.vem-main-contained .item-page .item-content h2,
.vem-main-contained .item-page .article-content h2,
.vem-main-contained .item-page [class*="pagebuilderck"] h2 {
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    font-weight: 400 !important;
}

.vem-main-contained article.item p {
    margin-bottom: 32px;
}

/* Texte des boites explicatives des figures : il est plus
   petit et plus compact que le texte courant des articles. */
.vem-home-figure-module,
.vem-home-figure-module p,
.vem-home-figure-module li {
    color: #141414;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 22px;
}

.vem-home-figure-module h2,
.vem-home-figure-module h3,
.vem-home-figure-module h4 {
    color: #141414;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 24px;
    line-height: 1.25;
    font-weight: 500;
}

/* =======================================================
   Ajustements accueil Page Builder CK / Tabs CK
   ======================================================= */

/* Le constructeur peut appliquer une graisse locale : les
   titres de section doivent garder le rendu franc du site. */
#vem-main .vem-home-heading,
#vem-main h1.vem-home-heading,
#vem-main h2.vem-home-heading,
#vem-main .vem-home-keynumbers > .vem-home-content > h1,
#vem-main .vem-home-keynumbers > .vem-home-content > h2,
#vem-main .vem-home-news > .vem-home-content > h1,
#vem-main .vem-home-news > .vem-home-content > h2 {
    color: #07683a !important;
    font-size: 53px !important;
    line-height: 1.12 !important;
    font-weight: 700 !important;
    letter-spacing: -1px;
}

/* Titres et sous-titres des cartes d'actualités. */
#vem-main .vem-home-news-module h2,
#vem-main .vem-home-news-module h3,
#vem-main .vem-home-news-module h4,
#vem-main .vem-home-news-module h2 a,
#vem-main .vem-home-news-module h3 a,
#vem-main .vem-home-news-module h4 a {
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 24px !important;
    line-height: 1.2 !important;
    font-weight: 500 !important;
}

/* Textes des boites d'analyse sous les graphiques. Tabs CK
   dispose de sélecteurs plus précis que le template : les
   !important sont donc nécessaires ici. */
#vem-main .tab-content,
#vem-main .tab-content p,
#vem-main .tab-content li,
#vem-main .tab-pane,
#vem-main .tab-pane p,
#vem-main .tab-pane li,
#vem-main [class*="tabck"] p,
#vem-main [class*="tabsck"] p {
    color: #141414 !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 14px !important;
    line-height: 22px !important;
    font-weight: 400 !important;
}

/* Boutons encadrés de l'accueil. Le ciblage par destination
   fonctionne même si Page Builder CK change ses classes. */
#vem-main a[href$="/fil-d-actualites"],
#vem-main a[href="fil-d-actualites"],
#vem-main a[href$="/chiffres-cles"],
#vem-main a[href="chiffres-cles"] {
    box-sizing: border-box;
    display: block !important;
    width: 515px;
    max-width: calc(100% - 30px);
    margin: 22px auto !important;
    padding: 10px 20px !important;
    border: 1px solid #07683a !important;
    background: transparent !important;
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 20px !important;
    line-height: 28px !important;
    font-weight: 400 !important;
    text-align: center;
}

#vem-main a[href$="/fil-d-actualites"]:hover,
#vem-main a[href="fil-d-actualites"]:hover,
#vem-main a[href$="/chiffres-cles"]:hover,
#vem-main a[href="chiffres-cles"]:hover {
    background: #07683a !important;
    color: #f7c03f !important;
}

/* Variante de classes Page Builder CK pour les quatre boites
   de chiffres clés : leur texte reste vert et soutenu. */
#vem-main .vem-home-numbers-module *,
#vem-main [class*="keynumber"] *,
#vem-main [class*="chiffre-cle"] *,
#vem-main [class*="chiffres-cle"] * {
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-weight: 700 !important;
}

/* =======================================================
   Fil d'actualites — vue blog Joomla
   ======================================================= */

/* Espace entre le titre de page et le premier article. */
.vem-main-contained .blog .items-leading,
.vem-main-contained .blog .items-row:first-of-type {
    margin-top: 38px;
}

/* Chaque ligne doit prendre la hauteur de son image et garder
   une respiration avant l'article suivant. */
.vem-main-contained .blog .items-row {
    clear: both;
    overflow: hidden;
    margin-bottom: 20px !important;
}

.vem-main-contained .blog article.item,
.vem-main-contained .blog .item {
    margin-bottom: 20px !important;
}

/* Titre de chaque actualite : couvre le balisage Joomla
   standard et les anciennes classes utilisees par Floox. */
.vem-main-contained .blog .item-title,
.vem-main-contained .blog .item-title a,
.vem-main-contained .blog .page-header h2,
.vem-main-contained .blog .page-header h2 a,
.vem-main-contained .blog .entry-header h2,
.vem-main-contained .blog .entry-header h2 a,
.vem-main-contained .blog article.item h2,
.vem-main-contained .blog article.item h2 a {
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 28px !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    font-weight: 600 !important;
    margin-top: 0;
    margin-bottom: 12px;
}

/* Resume de l'article : meme Montserrat que le site public,
   mais sans la teinte grise heritee des anciennes boites. */
.vem-main-contained .blog article.item,
.vem-main-contained .blog article.item p,
.vem-main-contained .blog .item,
.vem-main-contained .blog .item p {
    color: #141414;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 18px;
    line-height: 28px;
    font-weight: 400;
}

.vem-main-contained .blog .readmore {
    margin-top: 14px;
    margin-bottom: 0;
}

.vem-main-contained .blog .readmore a {
    color: #07683a !important;
    font-size: 14px;
    line-height: 20px;
}

@media (max-width: 767px) {
    .vem-main-contained .blog .items-leading,
    .vem-main-contained .blog .items-row:first-of-type {
        margin-top: 25px;
    }

    .vem-main-contained .blog .item-title,
    .vem-main-contained .blog .item-title a,
    .vem-main-contained .blog .page-header h2,
    .vem-main-contained .blog .page-header h2 a,
    .vem-main-contained .blog .entry-header h2,
    .vem-main-contained .blog .entry-header h2 a,
    .vem-main-contained .blog article.item h2,
    .vem-main-contained .blog article.item h2 a {
        font-size: 24px !important;
    }
}

/* Les corrections de placement du bureau ne doivent pas
   perturber le menu empilé sur tablette et mobile. */
@media (max-width: 991px) {
    .vem-header-inner {
        left: 0;
    }

    .vem-navigation {
        transform: none;
    }

    .vem-home-keynumbers-inner {
        padding-top: 55px;
    }

    .vem-home-numbers-module {
        margin-top: 55px;
    }
}

@media (max-width: 767px) {
    .vem-home-keynumbers-inner {
        padding-top: 35px;
    }

    .vem-home-numbers-module {
        margin-top: 30px;
    }

    .vem-home-heading,
    .vem-main-contained h1 {
        font-size: 34px;
    }

    .vem-main-contained article.item h2,
    .vem-main-contained article.item-page .page-header h2,
    .vem-main-contained article.item-page .entry-header h2 {
        font-size: 30px;
    }
}

/* VEM v5 — priorité finale pour les pages tableaux de bord et les liens. */
#vem-main .item-page > h2:first-of-type,
#vem-main article.item-page > h2:first-of-type,
#vem-main .item-page .item-content > h2:first-of-type,
#vem-main .item-page .article-content > h2:first-of-type {
    color:#07683a !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:30px !important;
    line-height:1.2 !important;
    letter-spacing:0 !important;
    font-weight:600 !important;
    margin:38px 0 10px !important;
    padding:0 !important;
}

#vem-main .item-page > h2:not(:first-of-type),
#vem-main .item-page .item-content > h2:not(:first-of-type),
#vem-main .item-page .article-content > h2:not(:first-of-type) {
    color:#07683a !important;
    font-size:24px !important;
    line-height:1.3 !important;
    font-weight:500 !important;
    margin:26px 0 12px !important;
    padding:0 !important;
}

#vem-main a,
#vem-main a:visited { color:#07683a !important; }
#vem-main a:hover,
#vem-main a:focus { color:#b78308 !important; }

#vem-main .accordion-heading a,
#vem-main .accordion-toggle,
#vem-main [class*="accordeon"] a,
#vem-main [class*="accordion"] a,
#vem-main [class*="accordeon"] a:visited,
#vem-main [class*="accordion"] a:visited { color:inherit !important; }

@media (max-width:767px) {
    #vem-main .item-page > h2:first-of-type,
    #vem-main article.item-page > h2:first-of-type,
    #vem-main .item-page .item-content > h2:first-of-type,
    #vem-main .item-page .article-content > h2:first-of-type {
        font-size:27px !important;
        margin-top:25px !important;
    }
}

/* ======================================
   VEM v8.4 — textes des listes Actualités
   et Le saviez-vous
   ====================================== */

/* Justification des résumés News Show SP2, sans modifier les titres
   ni les liens « Lire la suite ». */
#vem-main .nssp2 p.ns2-introtext {
    text-align:justify !important;
    text-justify:inter-word;
}

/* ======================================
   VEM v8.3 — header et fil d'Ariane
   ====================================== */

/* Le header d'origine n'a aucun filet coloré. */
#vem-header,
#vem-header .vem-header-inner,
.vem-is-home #vem-header,
.vem-is-home #vem-header .vem-header-inner {
    border-top:0 !important;
    border-right:0 !important;
    border-bottom:0 !important;
    border-left:0 !important;
}

/* Au repos, le header reste parfaitement plat : ni ombre ni filet. */
#vem-header.vem-sticky-header {
    box-shadow:0 3px 8px rgba(0,0,0,0) !important;
    transition:box-shadow .28s ease !important;
}

/* L'ombre apparaît progressivement dès que la page commence à défiler. */
body.vem-header-scrolled #vem-header.vem-sticky-header {
    box-shadow:0 3px 8px rgba(0,0,0,.13) !important;
}

/* Sur l'accueil, neutralise aussi tout filet provenant du conteneur
   de navigation, d'un pseudo-élément ou de la jonction avec le slider. */
body.vem-is-home #vem-header::before,
body.vem-is-home #vem-header::after,
body.vem-is-home #vem-header .vem-header-inner::before,
body.vem-is-home #vem-header .vem-header-inner::after {
    border:0 !important;
    box-shadow:none !important;
    background:none !important;
}

body.vem-is-home #vem-header .vem-navigation,
body.vem-is-home #vem-header .vem-navigation > *,
body.vem-is-home #vem-header .vem-navigation .moduletable,
body.vem-is-home #vem-main.vem-main-home,
body.vem-is-home #vem-main .vem-home-slider,
body.vem-is-home #vem-main .vem-home-slider > * {
    border-top:0 !important;
    border-bottom:0 !important;
}

/* Aucun filet de fil d'Ariane sur la page d'accueil. */
.vem-is-home #vem-breadcrumb,
.vem-is-home #vem-breadcrumb .vem-container {
    display:none !important;
    border:0 !important;
}

/* Sur les pages internes, le filet appartient uniquement au fil d'Ariane. */
body:not(.vem-is-home) #vem-breadcrumb {
    border:0 !important;
    box-shadow:none !important;
}

body:not(.vem-is-home) #vem-breadcrumb > .vem-container {
    border-top:1px solid #f7c03f !important;
    border-right:0 !important;
    border-bottom:0 !important;
    border-left:0 !important;
}

/* Sur le clone, l'accueil utilise l'alias « home-fr » sans recevoir la
   classe vem-is-home. Son fil d'Ariane vide créait le filet orange et
   l'espace blanc entre le header et le slider. */
body.vem-page-home-fr #vem-breadcrumb,
body.vem-page-home-fr #vem-breadcrumb > .vem-container {
    display:none !important;
    border:0 !important;
    box-shadow:none !important;
    margin:0 !important;
    padding:0 !important;
    height:0 !important;
    min-height:0 !important;
}

body.vem-page-home-fr #vem-header,
body.vem-page-home-fr #vem-header .vem-header-inner,
body.vem-page-home-fr #vem-main,
body.vem-page-home-fr #vem-main > :first-child {
    border-top:0 !important;
    border-bottom:0 !important;
}

/* Annule également l'espacement réservé aux pages internes : le premier
   contenu de l'accueil vient ainsi directement sous le header. */
body.vem-page-home-fr #vem-main .vem-main-inner {
    padding-top:0 !important;
}

/* =======================================================
   VEM v6 — tableaux de bord et onglets de l'accueil
   ======================================================= */

/* Les tableaux de bord sont d'anciens contenus dont le titre est
   un h2 libre, sans conteneur .item-page constant. */
body.vem-dashboard-page #vem-main h2:first-of-type {
    color:#07683a !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:30px !important;
    line-height:1.2 !important;
    letter-spacing:0 !important;
    font-weight:600 !important;
    margin:38px 0 10px !important;
    padding:0 !important;
}

/* Onglet actif : libellé blanc sur fond vert, sans variante orange
   au survol. L'onglet inactif reste vert sur fond blanc. */
#vem-main .nav-tabs > li.active > a,
#vem-main .nav-tabs > li.active > a:visited,
#vem-main .nav-tabs > li.active > a:hover,
#vem-main .nav-tabs > li.active > a:focus,
#vem-main [class*="tabck"] .active > a,
#vem-main [class*="tabck"] .active > a:visited,
#vem-main [class*="tabck"] .active > a:hover,
#vem-main [class*="tabck"] .active > a:focus,
#vem-main [class*="tabsck"] .active > a,
#vem-main [class*="tabsck"] .active > a:visited,
#vem-main [class*="tabsck"] .active > a:hover,
#vem-main [class*="tabsck"] .active > a:focus {
    color:#fff !important;
}

#vem-main .nav-tabs > li:not(.active) > a,
#vem-main .nav-tabs > li:not(.active) > a:hover,
#vem-main .nav-tabs > li:not(.active) > a:focus,
#vem-main [class*="tabck"] li:not(.active) > a:hover,
#vem-main [class*="tabsck"] li:not(.active) > a:hover {
    color:#07683a !important;
}

/* Colonne Explications de la figure d'accueil. */
#vem-main .vem-home-figure-module h1,
#vem-main .vem-home-figure-module h2,
#vem-main .vem-home-figure-module h3,
#vem-main .vem-home-figure-module h4,
#vem-main .vem-home-figure-module h5,
#vem-main .vem-home-figure-module h6,
#vem-main .vem-home-figure-module h1 *,
#vem-main .vem-home-figure-module h2 *,
#vem-main .vem-home-figure-module h3 *,
#vem-main .vem-home-figure-module h4 * {
    color:#141414 !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:24px !important;
    line-height:1.25 !important;
    font-weight:600 !important;
}

#vem-main .vem-home-figure-module h1 + p,
#vem-main .vem-home-figure-module h2 + p,
#vem-main .vem-home-figure-module h3 + p,
#vem-main .vem-home-figure-module h4 + p,
#vem-main .vem-home-figure-module [style*="#ff0000"],
#vem-main .vem-home-figure-module [style*="#FF0000"],
#vem-main .vem-home-figure-module [style*="color: red"],
#vem-main .vem-home-figure-module [style*="color:red"] {
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:14px !important;
    line-height:20px !important;
    font-weight:400 !important;
}

@media (max-width:767px) {
    body.vem-dashboard-page #vem-main h2:first-of-type {
        font-size:27px !important;
        margin-top:25px !important;
    }
}

/* =======================================================
   VEM v7 — sélecteurs vérifiés dans le HTML CK / iFAQ
   ======================================================= */

/* Rythme vertical du cartouche d'introduction des tableaux de bord. */
body.vem-dashboard-page #row_ID1605603582675,
#vem-main #row_ID1605603582675:has(#ID1620145694449) {
    margin-top:50px !important;
}

body.vem-dashboard-page #ID1620145694449 h2,
#vem-main #ID1620145694449 h2 {
    color:#07683a !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:30px !important;
    line-height:36px !important;
    font-weight:600 !important;
    letter-spacing:0 !important;
    margin:0 0 10px !important;
    padding:0 !important;
}

#vem-main #ID1621704943626 {
    margin:0 0 14px !important;
}

#vem-main #ID1620141472315 {
    margin:0 0 18px !important;
}

#vem-main #ID1620141472315 p:first-child {
    margin:0 0 12px !important;
    padding:0 !important;
    font-size:16px !important;
    line-height:22px !important;
    color:#141414 !important;
}

#vem-main #ID1620141472315 p + p {
    margin:0 !important;
    padding:0 0 0 28px !important;
    font-size:16px !important;
    line-height:24px !important;
    color:#141414 !important;
}

#vem-main #ID1605603582736 {
    box-sizing:border-box;
    margin:0 !important;
    padding:14px 8px 10px !important;
    background:#eeeeee;
}

#vem-main #ID1605603582736 p {
    margin:0 !important;
    padding:0 !important;
    color:#141414 !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:14.67px !important;
    line-height:22px !important;
    font-weight:400 !important;
}

body.vem-dashboard-page #row_ID1620140634610,
#vem-main #row_ID1620140634610:has(.ifaq-container) {
    margin-top:38px !important;
}

/* Bandeaux iFAQ : texte blanc et hauteur identique au site Floox. */
#vem-main .ifaq-collapsible > a,
#vem-main .ifaq-collapsible > a:visited,
#vem-main .ifaq-collapsible > a:hover,
#vem-main .ifaq-collapsible > a:focus,
#vem-main .ifaq-collapsible > a .ifaq-item-header,
#vem-main .ifaq-collapsible > a:hover .ifaq-item-header,
#vem-main .ifaq-collapsible > a:focus .ifaq-item-header {
    color:#fff !important;
}

#vem-main .ifaq-collapsible > a {
    display:block;
}

#vem-main .ifaq-item-header {
    min-height:42px;
    margin:0 !important;
    padding-top:8px !important;
    padding-bottom:8px !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:18px !important;
    line-height:26px !important;
    font-weight:400 !important;
    letter-spacing:0 !important;
}

/* iFAQ 3.10.1 réapplique le thème Colorful orange/rouge après sa mise à jour.
   Sur les seules pages Tableaux de bord, restaure les trois couleurs VEM.
   Les numéros iFAQ sont stables dans le HTML et évitent toute incidence sur
   le Guide méthodologique, la FAQ et le Glossaire. */
body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-1 {
    background-color:#008000 !important;
    background-image:linear-gradient(to bottom,#009400 0%,#007600 100%) !important;
    border-color:#ffffff !important;
}

body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-2 {
    background-color:#117d87 !important;
    background-image:linear-gradient(to bottom,#168b96 0%,#0b7079 100%) !important;
    border-color:#ffffff !important;
}

body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-3 {
    background-color:#7fbe00 !important;
    background-image:linear-gradient(to bottom,#8dcc00 0%,#70ae00 100%) !important;
    border-color:#ffffff !important;
}

/* Respiration sous le dernier bandeau des tableaux de bord. */
body.vem-dashboard-page #vem-main .ifaq-container {
    margin-bottom:30px !important;
}

body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-1 > a,
body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-2 > a,
body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-3 > a,
body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-1 .ifaq-item-header,
body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-2 .ifaq-item-header,
body.vem-dashboard-page #vem-main .ifaq-container .ifaq-collapsible.ifaq-number-3 .ifaq-item-header {
    color:#ffffff !important;
}

/* Tabs CK emploie ui-tabs-active, et non la classe active générique. */
#vem-main .tabsck .ui-tabs-nav > li > a.itemtitleck,
#vem-main .tabsck .ui-tabs-nav > li > a.ui-tabs-anchor {
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:14px !important;
    line-height:20px !important;
    font-weight:400 !important;
    letter-spacing:0 !important;
    white-space:nowrap;
}

#vem-main .tabsck .ui-tabs-nav > li.ui-tabs-active > a.ui-tabs-anchor,
#vem-main .tabsck .ui-tabs-nav > li.ui-state-active > a.ui-tabs-anchor,
#vem-main .tabsck .ui-tabs-nav > li.ui-tabs-active > a.ui-tabs-anchor:visited,
#vem-main .tabsck .ui-tabs-nav > li.ui-tabs-active > a.ui-tabs-anchor:hover,
#vem-main .tabsck .ui-tabs-nav > li.ui-tabs-active > a.ui-tabs-anchor:focus {
    color:#fff !important;
}

#vem-main .tabsck .ui-tabs-nav > li:not(.ui-tabs-active) > a.ui-tabs-anchor,
#vem-main .tabsck .ui-tabs-nav > li:not(.ui-tabs-active) > a.ui-tabs-anchor:visited,
#vem-main .tabsck .ui-tabs-nav > li:not(.ui-tabs-active) > a.ui-tabs-anchor:hover,
#vem-main .tabsck .ui-tabs-nav > li:not(.ui-tabs-active) > a.ui-tabs-anchor:focus {
    color:#07683a !important;
}

/* Titre et texte défilant du bloc Explications. */
#vem-main #ID1576509723970 .moduletable > h3 {
    color:#141414 !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:24px !important;
    line-height:30px !important;
    font-weight:600 !important;
    margin:0 0 8px !important;
    padding:0 !important;
}

#vem-main #ID1576509723970 .tContainer,
#vem-main #ID1576509723970 .tContainer p {
    color:#141414 !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:14px !important;
    line-height:22px !important;
    font-weight:400 !important;
}

#vem-main #ID1576509723970 .tContainer p > span:first-child,
#vem-main #ID1576509723970 .tContainer p > span:first-child em {
    color:#ff0000 !important;
    font-size:14px !important;
    line-height:20px !important;
    font-weight:400 !important;
}

@media (max-width:767px) {
    body.vem-dashboard-page #row_ID1605603582675,
    #vem-main #row_ID1605603582675:has(#ID1620145694449) {
        margin-top:25px !important;
    }

    body.vem-dashboard-page #ID1620145694449 h2,
    #vem-main #ID1620145694449 h2 {
        font-size:27px !important;
        line-height:33px !important;
    }
}
/* ======================================
   VEM v8 — News Show SP2
   Pages Actualités et Le saviez-vous
   ====================================== */

#vem-main .nssp2 {
    width: 100% !important;
    max-width: 1100px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

#vem-main .nssp2 .ns2-row {
    display: block !important;
    width: 100% !important;
    padding: 0 0 20px !important;
    margin: 0 !important;
}

#vem-main .nssp2 .ns2-row-inner,
#vem-main .nssp2 .ns2-column,
#vem-main .nssp2 .ns2-inner {
    width: 100% !important;
}

#vem-main .nssp2 .ns2-inner {
    color: #141414 !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
}

#vem-main .nssp2 .ns2-image {
    width: 400px !important;
    max-width: 40% !important;
    height: auto !important;
}

#vem-main .nssp2 h4.ns2-title {
    margin: 0 0 8px !important;
    padding: 0 !important;
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 29px !important;
    line-height: 35px !important;
    font-weight: 500 !important;
}

#vem-main .nssp2 h4.ns2-title a,
#vem-main .nssp2 h4.ns2-title a:hover,
#vem-main .nssp2 h4.ns2-title a:focus {
    color: #07683a !important;
    font-family: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
}

#vem-main .nssp2 p.ns2-introtext {
    margin: 0 0 18px !important;
    padding: 0 !important;
    color: #141414 !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 18px !important;
    line-height: 29px !important;
    font-weight: 400 !important;
}

#vem-main .nssp2 .ns2-links {
    margin: 0 !important;
    padding: 0 !important;
}

#vem-main .nssp2 a.ns2-readmore,
#vem-main .nssp2 a.ns2-readmore span {
    color: #07683a !important;
    font-family: Montserrat, Arial, Helvetica, sans-serif !important;
    font-size: 12px !important;
    line-height: 18px !important;
    font-weight: 400 !important;
}

@media (max-width: 767px) {
    #vem-main .nssp2 {
        max-width: 100% !important;
    }

    #vem-main .nssp2 .ns2-column > div {
        padding-right: 0 !important;
    }

    #vem-main .nssp2 .ns2-image {
        float: none !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 18px !important;
    }

    #vem-main .nssp2 h4.ns2-title {
        font-size: 24px !important;
        line-height: 30px !important;
    }

    #vem-main .nssp2 p.ns2-introtext {
        font-size: 16px !important;
        line-height: 25px !important;
    }
}

/* ======================================
   VEM v8.1 — graisse et espacements News Show SP2
   ====================================== */

/* Titres d'articles plus soutenus, comme sur le site d'origine. */
#vem-main .nssp2 h4.ns2-title,
#vem-main .nssp2 h4.ns2-title a,
#vem-main .nssp2 h4.ns2-title a:hover,
#vem-main .nssp2 h4.ns2-title a:focus {
    font-weight:600 !important;
}

/* Espace entre le fil d'Ariane et le titre de la page. */
#vem-main .vem-main-inner:has(.nssp2),
.vem-main-inner:has(.nssp2) {
    padding-top:25px !important;
}

/* Espace entre le titre de page et la liste News Show SP2. */
#vem-main #row_ID1771186228141 {
    margin-top:32px !important;
}

/* ======================================
   VEM v8.2 — rythme commun des pages internes
   ====================================== */

/* Ajoute l'espace manquant sous le fil d'Ariane sur les pages
   ordinaires, sans déplacer les tableaux de bord déjà réglés. */
body:not(.vem-dashboard-page) .vem-main-contained > .vem-main-inner:not(:has(#ID1620145694449)) {
    padding-top:25px !important;
}

/* Titres principaux Joomla et titres placés dans le contenu. */
body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page > h1:first-of-type,
body:not(.vem-dashboard-page) #vem-main.vem-main-contained article.item-page > h1:first-of-type,
body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page .page-header:first-child h1,
body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page .page-header:first-child h2,
body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page .entry-header:first-child h1,
body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page .entry-header:first-child h2,
body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page [class*="pagebuilderck"] h1:first-of-type {
    margin-bottom:45px !important;
}

/* Sur les listes News Show SP2, la marge du titre et celle du module
   se rejoignent : cette valeur fixe le même écart que sur le site. */
#vem-main #row_ID1771186228141 {
    margin-top:0 !important;
}

body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page:has(.nssp2) h1:first-of-type,
body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page:has(.nssp2) .page-header:first-child,
body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page:has(.nssp2) .entry-header:first-child {
    margin-bottom:40px !important;
}

/* ======================================
   VEM v8.5 — titres des articles individuels
   Actualités et Le saviez-vous
   ====================================== */

/* Dans ces articles Page Builder CK, le visuel et le texte forment une
   rangée à deux colonnes ; le titre est le premier h2 du bloc à 60 %. */
#vem-main .item-page .pagebuilderck .rowck[data-nb="2"] .blockck[data-width="60"] .cktext > h2:first-child,
#vem-main .item-page .pagebuilderck .rowck[data-nb="2"] .blockck[data-real-width="59%"] .cktext > h2:first-child {
    color:#07683a !important;
    font-family:Montserrat,Arial,Helvetica,sans-serif !important;
    font-size:30px !important;
    line-height:1.2 !important;
    letter-spacing:0 !important;
    font-weight:600 !important;
    margin:0 0 14px !important;
    padding:0 !important;
}

@media (max-width:767px) {
    body:not(.vem-dashboard-page) .vem-main-contained > .vem-main-inner:not(:has(#ID1620145694449)) {
        padding-top:18px !important;
    }

    body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page > h1:first-of-type,
    body:not(.vem-dashboard-page) #vem-main.vem-main-contained article.item-page > h1:first-of-type,
    body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page .page-header:first-child,
    body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page .entry-header:first-child,
    body:not(.vem-dashboard-page) #vem-main.vem-main-contained .item-page [class*="pagebuilderck"] h1:first-of-type {
        margin-bottom:28px !important;
    }

    #vem-main .item-page .pagebuilderck .rowck[data-nb="2"] .blockck[data-width="60"] .cktext > h2:first-child,
    #vem-main .item-page .pagebuilderck .rowck[data-nb="2"] .blockck[data-real-width="59%"] .cktext > h2:first-child {
        font-size:25px !important;
        line-height:1.25 !important;
        margin-bottom:12px !important;
    }
}
/* ======================================
   VEM v8.9 — articles individuels Actualités / Le saviez-vous
   25 px réels entre le grand titre de page et le contenu.
   Les articles migrés sont enveloppés dans une classe dynamique pbckid…
   (et non dans .pagebuilderck) : on cible donc directement cette enveloppe.
   ====================================== */
#vem-main .item-page [class^="pbckid"] > .rowck:first-child,
#vem-main .item-page [class*=" pbckid"] > .rowck:first-child {
    margin-bottom: 25px !important;
}

/* ======================================
   VEM v9.0 — Guide méthodologique uniquement
   Le bandeau iFAQ de cette page conserve son fond clair, avec un
   intitulé gris de graisse normale. Les tableaux de bord sont exclus
   grâce aux classes de page ajoutées par le template.
   ====================================== */
body.vem-page-guide-methodologique-vem #vem-main .ifaq-collapsible > a,
body.vem-page-guide-methodologique-vem #vem-main .ifaq-collapsible > a:visited,
body.vem-page-guide-methodologique-vem #vem-main .ifaq-collapsible > a:hover,
body.vem-page-guide-methodologique-vem #vem-main .ifaq-collapsible > a:focus,
body.vem-page-guide-methodologique-vem #vem-main .ifaq-item-header,
body.vem-page-guide-methodologique-vem #vem-main .ifaq-collapsible > a .ifaq-item-header,
body.vem-page-guide-methodologique #vem-main .ifaq-collapsible > a,
body.vem-page-guide-methodologique #vem-main .ifaq-collapsible > a:visited,
body.vem-page-guide-methodologique #vem-main .ifaq-collapsible > a:hover,
body.vem-page-guide-methodologique #vem-main .ifaq-collapsible > a:focus,
body.vem-page-guide-methodologique #vem-main .ifaq-item-header,
body.vem-page-guide-methodologique #vem-main .ifaq-collapsible > a .ifaq-item-header {
  color:#666d70 !important;
  font-weight:400 !important;
}

/* ======================================
   VEM v9.1 — Foire aux questions uniquement
   Même traitement que le Guide méthodologique : intitulés gris et
   de graisse normale, à l'état fermé comme à l'état ouvert.
   ====================================== */
body.vem-page-faq #vem-main .ifaq-collapsible > a,
body.vem-page-faq #vem-main .ifaq-collapsible > a:visited,
body.vem-page-faq #vem-main .ifaq-collapsible > a:hover,
body.vem-page-faq #vem-main .ifaq-collapsible > a:focus,
body.vem-page-faq #vem-main .ifaq-item-header,
body.vem-page-faq #vem-main .ifaq-collapsible > a .ifaq-item-header,
body.vem-page-faq-2 #vem-main .ifaq-collapsible > a,
body.vem-page-faq-2 #vem-main .ifaq-collapsible > a:visited,
body.vem-page-faq-2 #vem-main .ifaq-collapsible > a:hover,
body.vem-page-faq-2 #vem-main .ifaq-collapsible > a:focus,
body.vem-page-faq-2 #vem-main .ifaq-item-header,
body.vem-page-faq-2 #vem-main .ifaq-collapsible > a .ifaq-item-header {
  color:#666d70 !important;
  font-weight:400 !important;
}

/* ======================================
   VEM v9.2 — Glossaire uniquement
   Intitulés iFAQ gris et de graisse normale, à l'état fermé comme
   à l'état ouvert. Aucun effet sur les tableaux de bord.
   ====================================== */
body.vem-page-glossaire #vem-main .ifaq-collapsible > a,
body.vem-page-glossaire #vem-main .ifaq-collapsible > a:visited,
body.vem-page-glossaire #vem-main .ifaq-collapsible > a:hover,
body.vem-page-glossaire #vem-main .ifaq-collapsible > a:focus,
body.vem-page-glossaire #vem-main .ifaq-item-header,
body.vem-page-glossaire #vem-main .ifaq-collapsible > a .ifaq-item-header {
  color:#666d70 !important;
  font-weight:400 !important;
}

/* ======================================
   VEM v9.6 — boutons Page Builder CK
   Les liens ordinaires restent régis par la palette du template,
   mais les boutons .buttonck conservent désormais les couleurs
   définies directement dans Page Builder CK (normal et survol).
   ====================================== */

/* ======================================
   VEM v9.7 — états actifs des ancres Filières d'usage
   Le texte et l'icône du seul bouton actif sont forcés en blanc.
   Au survol, la couleur verte configurée dans Page Builder CK est
   rétablie explicitement. Les boutons inactifs ne sont pas ciblés.
   ====================================== */
#row_ID1573517081509 > .inner > .blockck:nth-child(1) a.buttonck,
#row_ID1573517081509 > .inner > .blockck:nth-child(1) a.buttonck *,
#row_ID1572965115578 > .inner > .blockck:nth-child(2) a.buttonck,
#row_ID1572965115578 > .inner > .blockck:nth-child(2) a.buttonck *,
#row_ID1572965127877 > .inner > .blockck:nth-child(3) a.buttonck,
#row_ID1572965127877 > .inner > .blockck:nth-child(3) a.buttonck * {
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

#row_ID1573517081509 > .inner > .blockck:nth-child(1) a.buttonck:hover,
#row_ID1573517081509 > .inner > .blockck:nth-child(1) a.buttonck:hover *,
#row_ID1572965115578 > .inner > .blockck:nth-child(2) a.buttonck:hover,
#row_ID1572965115578 > .inner > .blockck:nth-child(2) a.buttonck:hover *,
#row_ID1572965127877 > .inner > .blockck:nth-child(3) a.buttonck:hover,
#row_ID1572965127877 > .inner > .blockck:nth-child(3) a.buttonck:hover * {
  color:#07683a !important;
  -webkit-text-fill-color:#07683a !important;
}

/* ======================================
   VEM v9.9 — rythme de tous les intertitres Filières d'usage
   Le dernier titre (« Origine des volumes de bois employés ») ne
   possède pas d'ancre. On reconnaît donc tous les intertitres par
   leur style Page Builder CK à 20 pt. La marge négative éventuelle
   du bloc qui suit est neutralisée afin d'obtenir 25 px réels.
   ====================================== */
#vem-main .item-page:has(a#oeuvre) .rowck:has(.cktext > p[style*="font-size: 20pt"]) > .inner {
  margin-bottom:25px !important;
}

#vem-main .item-page:has(a#oeuvre) .rowck:has(.cktext > p[style*="font-size: 20pt"]) + .rowck {
  margin-top:0 !important;
}

/* ======================================
   VEM v9.10 — rythme des intertitres Valeur ajoutée et emploi
   Même espacement que sur la page Filières d'usage : 25 px réels
   sous chaque intertitre Page Builder CK à 20 pt. La marge négative
   éventuelle de la rangée suivante est neutralisée.
   ====================================== */
body.vem-page-valeur-ajoutee-et-emploi #vem-main .rowck:has(.cktext > p[style*="font-size: 20pt"]) > .inner,
body.vem-page-valeur-ajoutee-emploi #vem-main .rowck:has(.cktext > p[style*="font-size: 20pt"]) > .inner {
  margin-bottom:25px !important;
}

body.vem-page-valeur-ajoutee-et-emploi #vem-main .rowck:has(.cktext > p[style*="font-size: 20pt"]) + .rowck,
body.vem-page-valeur-ajoutee-emploi #vem-main .rowck:has(.cktext > p[style*="font-size: 20pt"]) + .rowck {
  margin-top:0 !important;
}

/* ======================================
   VEM v9.11 — Slider Page Builder CK de l'accueil
   Module 302 : pleine largeur, fondu, légende centrale et responsive.
   Ces règles sont limitées à .vem-home-slider et n'affectent aucun
   autre Slider CK présent dans le site.
   ====================================== */

/* Neutralise les largeurs, gouttières et marges du module Page Builder CK. */
body.vem-is-home #vem-main .vem-home-slider,
body.vem-is-home #vem-main .vem-home-slider > div,
body.vem-is-home #vem-main .vem-home-slider .moduletable,
body.vem-is-home #vem-main .vem-home-slider .pagebuilderck,
body.vem-is-home #vem-main .vem-home-slider .pagebuilderck > .rowck,
body.vem-is-home #vem-main .vem-home-slider .pagebuilderck > .rowck > .inner,
body.vem-is-home #vem-main .vem-home-slider .pagebuilderck > .rowck > .inner > .blockck,
body.vem-is-home #vem-main .vem-home-slider .pagebuilderck > .rowck > .inner > .blockck > .inner,
body.vem-is-home #vem-main .vem-home-slider .pagebuilderck .innercontent,
body.vem-is-home #vem-main .vem-home-slider .cktype[data-type="slider"],
body.vem-is-home #vem-main .vem-home-slider .pbck_slider {
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}

body.vem-is-home #vem-main .vem-home-slider {
  height:470px;
  min-height:470px;
  overflow:hidden;
  background:#fff;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slides,
body.vem-is-home #vem-main .vem-home-slider .pbck_wrap,
body.vem-is-home #vem-main .vem-home-slider .pbck_wrapinner {
  width:100% !important;
  height:470px !important;
  min-height:470px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}

/* Le JavaScript continue de désigner la vue courante, tandis que le CSS
   remplace le déplacement horizontal par un fondu progressif. */
body.vem-is-home #vem-main .vem-home-slider .pbck_wrapinner {
  position:relative !important;
  transform:none !important;
  transition:none !important;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slide {
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  float:none !important;
  width:100% !important;
  height:470px !important;
  margin:0 !important;
  padding:0 !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:1;
  transition:opacity 1.5s ease-in-out, visibility 0s linear 1.5s !important;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slide.current {
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  z-index:2;
  transition:opacity 1.5s ease-in-out, visibility 0s linear 0s !important;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slide_img {
  display:block !important;
  width:100% !important;
  max-width:none !important;
  height:470px !important;
  margin:0 !important;
  object-fit:cover !important;
  object-position:center center;
}

/* Le cartouche reprend le vert translucide et la composition du site. */
body.vem-is-home #vem-main .vem-home-slider .pbck_slide_caption {
  position:absolute !important;
  left:50% !important;
  right:auto !important;
  top:50% !important;
  bottom:auto !important;
  width:min(966px, calc(100% - 40px));
  margin:0 !important;
  padding:22px 24px 14px !important;
  color:#fff !important;
  background:rgba(123,135,46,.60) !important;
  font-family:Montserrat,Arial,Helvetica,sans-serif !important;
  font-style:normal !important;
  line-height:normal !important;
  text-align:center !important;
  transform:translate(-50%,-50%) !important;
  z-index:3;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slide.current .pbck_slide_caption {
  opacity:1 !important;
  transition:opacity .8s ease .2s !important;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slide_title,
body.vem-is-home #vem-main .vem-home-slider .pbck_slide_desc {
  display:block !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  color:#fff !important;
  background:transparent !important;
  font-family:Montserrat,Arial,Helvetica,sans-serif !important;
  font-style:normal !important;
  font-weight:400 !important;
  text-align:center !important;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slide_title {
  font-size:clamp(34px,3.5vw,70px) !important;
  line-height:1.08 !important;
  letter-spacing:0 !important;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slide_desc {
  font-size:clamp(17px,1.5vw,30px) !important;
  line-height:1.16 !important;
}

body.vem-is-home #vem-main .vem-home-slider .pbck_slide_caption > br {
  display:none !important;
}

body.vem-is-home #vem-main .vem-home-slider .vem-slider-intro {
  margin:18px 0 0 !important;
  color:#fff !important;
  font:inherit !important;
  line-height:inherit !important;
  text-align:center !important;
}

body.vem-is-home #vem-main .vem-home-slider .vem-slider-more {
  margin:16px 0 0 !important;
  text-align:center !important;
}

body.vem-is-home #vem-main .vem-home-slider .vem-slider-more a,
body.vem-is-home #vem-main .vem-home-slider .vem-slider-more a:visited {
  display:inline-block;
  padding:2px 15px 3px;
  border:1px solid #fff;
  color:#fff !important;
  background:transparent;
  font-size:22px;
  line-height:26px;
  font-weight:400;
  text-decoration:none;
  transition:color .2s ease, border-color .2s ease;
}

body.vem-is-home #vem-main .vem-home-slider .vem-slider-more a:hover,
body.vem-is-home #vem-main .vem-home-slider .vem-slider-more a:focus {
  color:#f7c03f !important;
  border-color:#f7c03f;
}

/* Le diaporama d'origine n'affichait ni flèches ni miniatures. */
body.vem-is-home #vem-main .vem-home-slider .pbck_slider_controls,
body.vem-is-home #vem-main .vem-home-slider .pbck_slider_thumbs,
body.vem-is-home #vem-main .vem-home-slider .pbck_slider_thumbs_control {
  display:none !important;
}

@media (max-width:767px) {
  body.vem-is-home #vem-main .vem-home-slider,
  body.vem-is-home #vem-main .vem-home-slider .pbck_slides,
  body.vem-is-home #vem-main .vem-home-slider .pbck_wrap,
  body.vem-is-home #vem-main .vem-home-slider .pbck_wrapinner,
  body.vem-is-home #vem-main .vem-home-slider .pbck_slide,
  body.vem-is-home #vem-main .vem-home-slider .pbck_slide_img {
    height:360px !important;
    min-height:360px !important;
  }

  body.vem-is-home #vem-main .vem-home-slider .pbck_slide_caption {
    display:block !important;
    width:calc(100% - 24px);
    padding:16px 14px 12px !important;
  }

  body.vem-is-home #vem-main .vem-home-slider .pbck_slide_title {
    font-size:clamp(25px,7vw,34px) !important;
    line-height:1.12 !important;
  }

  body.vem-is-home #vem-main .vem-home-slider .pbck_slide_desc {
    font-size:14px !important;
    line-height:1.38 !important;
  }

  body.vem-is-home #vem-main .vem-home-slider .vem-slider-intro {
    margin-top:12px !important;
  }

  body.vem-is-home #vem-main .vem-home-slider .vem-slider-more {
    margin-top:11px !important;
  }

  body.vem-is-home #vem-main .vem-home-slider .vem-slider-more a,
  body.vem-is-home #vem-main .vem-home-slider .vem-slider-more a:visited {
    padding:3px 12px 4px;
    font-size:16px;
    line-height:22px;
  }
}

/* ================================================================
   VEM 0.4 - Articles Joomla natifs : fils et selection d'accueil
   ================================================================ */
.vem-native-feed {
  width: 100%;
}

.vem-feed-item {
  display: grid;
  grid-template-columns: minmax(280px, 40%) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
  margin: 0 0 38px;
}

.vem-feed-image {
  display: block;
}

.vem-feed-image img {
  display: block;
  width: 100%;
  height: auto;
}

.vem-feed-title {
  margin: 0 0 10px;
  color: #07683a;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 25px;
  font-weight: 600;
  line-height: 1.18;
}

.vem-feed-title a,
.vem-home-card-title a {
  color: #07683a;
  text-decoration: none;
}

.vem-feed-title a:hover,
.vem-home-card-title a:hover {
  color: #07683a;
  text-decoration: underline;
}

.vem-feed-intro,
.vem-home-card-intro {
  color: #666d70;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.65;
  text-align: justify;
}

.vem-feed-intro > :first-child,
.vem-home-card-intro > :first-child {
  margin-top: 0;
}

.vem-feed-readmore {
  display: inline-block;
  margin-top: 8px;
  color: #668b72;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 13px;
}

.vem-home-featured {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  width: 100%;
}

.vem-home-card-image {
  display: block;
  margin-bottom: 20px;
}

.vem-home-card-image img {
  display: block;
  width: 100%;
  height: 285px;
  object-fit: contain;
  object-position: center;
}

.vem-home-card-title {
  margin: 0 0 14px;
  color: #07683a;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 19px;
  font-weight: 500;
  line-height: 1.35;
}

@media (max-width: 767px) {
  .vem-feed-item,
  .vem-home-featured {
    grid-template-columns: 1fr;
  }

  .vem-feed-item {
    gap: 18px;
    margin-bottom: 34px;
  }

  .vem-home-featured {
    gap: 38px;
  }

  .vem-home-card-image img {
    height: auto;
    max-height: none;
  }
}

/* VEM-FB — correctifs iFAQ Joomla 4 — v3 */

/* 1. Masquer le nom de catégorie affiché au-dessus des accordéons
   (TDB, FAQ et Glossaire) */
.ifaq .ifaq-faqtitle {
    display: none !important;
}

/* 2. Le fond noir vient du conteneur de l'élément iFAQ ouvert */
.ifaq .ifaq-container-open {
    background-color: #ffffff !important;
    background-image: none !important;
}

/* 3. Forcer également tout le panneau ouvert et ses enveloppes en blanc */
.ifaq .ifaq-container-open .ifaq-panel,
.ifaq .ifaq-container-open .ifaq-content,
.ifaq .ifaq-container-open .paneopen,
.ifaq .ifaq-container-open .pagebuilderck {
    background-color: #ffffff !important;
    background-image: none !important;
}

/* Ne pas toucher à la barre/titre cliquable vert */

/* VEM-FB — fil d'Ariane Joomla 4 horizontal */

/* Joomla 4 utilise une liste <ol>. L'ancien template Joomla 3
   ne lui applique plus la mise en ligne attendue. */
.mod-breadcrumbs__wrapper .mod-breadcrumbs.breadcrumb {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    list-style: none !important;
    margin: 0 !important;
}

/* Chaque élément reste sur la même ligne */
.mod-breadcrumbs__wrapper .mod-breadcrumbs__here,
.mod-breadcrumbs__wrapper .mod-breadcrumbs__item {
    display: inline-flex !important;
    float: none !important;
    width: auto !important;
    align-items: center !important;
    margin: 0 !important;
}

/* Séparateurs du fil d'Ariane */
.mod-breadcrumbs__wrapper .breadcrumb-item + .breadcrumb-item::before {
    content: "/" !important;
    display: inline-block !important;
    padding: 0 0.5rem !important;
    float: none !important;
}