@charset "UTF-8";
/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
:root {
  --s-banner-bg-color: var(--color-light);
  --s-banner-padding-y: var(--spacer-9);
  /* =============================================================================
    BUTTONS OVERRIDES
    ============================================================================= */
  /* default */
  --c-button-font-size: 1.2rem;
  --c-button-letter-spacing: normal;
  --c-button-padding-block: 8px;
  --c-button-padding-inline: 16px;
  --c-button-bg-color: var(--color-primary);
  --c-button-hover-bg-color: var(--color-primary-dark);
  --c-button-primary-bg-color: var(--color-primary-light);
  /* =============================================================================
    PAGER OVERRIDES
    ============================================================================= */
  --c-pager-font-size: 1.8rem;
  --c-pager-item-width: auto;
  --c-pager-item-height: auto;
  --c-pager-link-color: var(--color-secondary);
  --c-pager-icon-font-size: 1rem;
  /* =============================================================================
    BREADCRUMB OVERRIDES
    ============================================================================= */
  --c-breadcrumb-color: #6B797F;
  --c-breadcrumb-border-color: #6B797F;
  --c-breadcrumb-separator-color: var(--color-secondary);
  --c-breadcrumb-hover-color: var(--color-secondary);
  --c-breadcrumb-separator: ">";
  /* =============================================================================
    FIGURE OVERRIDES
    ============================================================================= */
  --c-figure-y-spacing: 10px;
  --c-figure-bg-color: transparent;
  --c-figure-border-radius: 0;
  /* caption */
  --c-figure-caption-font-size: .9rem;
  --c-figure-caption-font-weight: 400;
  --c-figure-caption-line-height: 1.4;
  --c-figure-caption-color: var(--color-gray-3-1);
  /* =============================================================================
    Paragraph
    ============================================================================= */
  --paragraph-mb: 30px;
  /* =============================================================================
    TABLE OVERRIDES
    ============================================================================= */
  --c-table-border-color: var(--color-gray-4-1);
  --c-table-cell-border-color: var(--color-gray-4-1);
  /* =============================================================================
    QUOTE OVERRIDES
    ============================================================================= */
  --c-quote-font-size: 1.8rem;
  --c-quote-font-size-mobile: 1.5rem;
  --c-quote-author-size: 1.5rem;
  --c-quote-color: var(--color-dark);
  --c-quote-icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 1000 772'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230081a3; %7D %3C/style%3E%3C/defs%3E%3C!-- Generator: Adobe Illustrator 28.7.1, SVG Export Plug-In . SVG Version: 1.2.0 Build 142) --%3E%3Cg%3E%3Cg id='Calque_1'%3E%3Cg id='Groupe_1059'%3E%3Cg id='Groupe_1058'%3E%3Cpath id='Tracé_1846' class='cls-1' d='M996,767h-388.3l-2-5.3c-40.2-104.3-60.7-215.2-60.6-327-.7-57.9,7.9-115.6,25.3-170.9,16.3-50.5,42.2-97.3,76.2-138,33.9-40.5,77.4-71.9,126.5-91.4,55.5-21.1,114.5-31.4,173.8-30.3h8.2v203.6h-8.2c-41.6,0-71.8,13.6-92.4,41.7-20.8,28.4-31.4,72.2-31.4,130.2v18.2h172.8v369.2ZM619,750.6h360.6v-336.4h-172.8v-34.6c0-61.5,11.6-108.6,34.5-139.9,22.2-30.2,54.9-46.4,97.5-48.2V20.5c-54.5-.2-108.6,9.6-159.5,29.1-46.6,18.5-87.9,48.4-120.1,86.8-32.7,39.1-57.5,84.1-73.2,132.6-16.9,53.6-25.1,109.6-24.5,165.8-.1,107.9,19.3,214.9,57.5,315.8M458.3,767H70.1l-2-5.3C27.2,657.5,5.9,546.7,5.1,434.7c-.6-58,8-115.7,25.6-170.9,16.6-50.5,42.8-97.4,77.1-138,34.3-40.5,78.1-71.8,127.4-91.4,55.6-21.1,114.7-31.4,174.1-30.3h8.2v203.6h-8.2c-83.3,0-123.8,56.2-123.8,171.8v18.2h172.8v369.3ZM81.4,750.6h360.6v-336.4h-172.8v-34.6c0-61.5,11.6-108.6,34.5-139.9,22.1-30.2,54.9-46.4,97.4-48.2V20.5c-54.6-.2-108.7,9.6-159.7,29.1-46.8,18.6-88.4,48.4-121,86.8-33,39-58.2,84-74.1,132.6-17.1,53.6-25.4,109.5-24.8,165.7.7,108,21,215,59.9,315.8'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  /* =============================================================================
    ACCORDION OVERRIDES
    ============================================================================= */
  /* heading - button */
  --c-accordion-btn-font-family: var(--font-family-body);
  --c-accordion-btn-font-size: 1.4rem;
  --c-accordion-btn-color: var(--color-light);
  --c-accordion-btn-bgd: var(--color-primary);
  --c-accordion-btn-icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 1000 1248'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D %3C/style%3E%3C/defs%3E%3C!-- Generator: Adobe Illustrator 28.7.1, SVG Export Plug-In . SVG Version: 1.2.0 Build 142) --%3E%3Cg%3E%3Cg id='Calque_1'%3E%3Cpath id='Polygone_23' class='cls-1' d='M996.5,624L3.5,1244.6V3.4l993,620.6Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --c-accordion-btn-icon-close: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg height='16' viewBox='0 0 16 16' width='16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon fill='%23ffffff' fill-rule='evenodd' points='2 9 2 7 14 7 14 9'/%3E%3C/svg%3E");
  --c-accordion-btn-padding-y: 10px;
  --c-accordion-btn-padding-x: 14px 10px;
  /* body - panel content */
  --c-accordion-panel-font-family: inherit;
  --c-accordion-panel-font-size: 1.7rem;
  --c-accordion-panel-color: var(--color-dark);
  --c-accordion-panel-bgd: var(--color-gray-5-1);
  --c-accordion-panel-border-color: var(--color-primary);
  --c-accordion-panel-padding-y: 13px;
  --c-accordion-panel-padding-x: 13px;
  /* =============================================================================
    TOOLTIP OVERRIDES
    ============================================================================= */
  --c-tooltip-btn-bgd-color: var(--color-primary);
  /* =============================================================================
    FORM OVERRIDES
    ============================================================================= */
  --c-form-check-size: 20px;
  --c-form-checked-inner-size: 12px;
  --c-form-select-icon: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 12.641L9.9948 18.5L16 12.641M10.0052 18.5V1.5' stroke='%23576CD4' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}
@media (min-width: 792px) {
  :root {
    --c-button-font-size: 1.6rem;
    --c-button-padding-block: 10px;
    --c-button-padding-inline: 20px;
  }
}
@media (min-width: 792px) {
  :root {
    --c-figure-y-spacing: 14px;
  }
}
@media (min-width: 792px) {
  :root {
    --c-figure-caption-font-size: 1.2rem;
  }
}
@media (min-width: 792px) {
  :root {
    --paragraph-mb: 50px;
  }
}
@media (min-width: 792px) {
  :root {
    --c-accordion-btn-font-size: 1.7rem;
    --c-accordion-btn-padding-y: 8px;
    --c-accordion-btn-padding-x: 21px 10px;
    --c-accordion-panel-padding-y: 30px;
    --c-accordion-panel-padding-x: 20px 30px;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-navigation {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 10;
  overflow-x: hidden;
  overflow-y: auto;
}
.c-navigation.is-visible {
  display: block;
  opacity: 1;
}
.c-navigation__close {
  position: absolute;
  right: 0;
  top: 0;
  flex-direction: column;
  margin: 1.8rem 9rem 1rem 1rem;
  color: var(--color-light);
  border: none;
  background: none;
  font-weight: 700;
  padding: 0;
}
.c-navigation__close:hover {
  border: none;
}
.c-navigation__close:focus-visible {
  outline-offset: 2px;
  outline: 2px dashed var(--color-light);
  transition: outline-offset 0.15s ease-in-out;
}
@media (max-width: 791px) {
  .c-navigation__close {
    margin: 1rem;
  }
}
.c-navigation__close .o-icon {
  font-size: 4.1rem;
  color: inherit;
}
@media (max-width: 791px) {
  .c-navigation__close .o-icon {
    font-size: 3rem;
  }
}
.c-navigation__close-text {
  margin-top: 0.5rem;
  display: block;
  font-size: 1.7rem;
  color: inherit;
}
@media (max-width: 791px) {
  .c-navigation__close-text {
    font-size: 1.2rem;
  }
}
.c-navigation__list {
  color: var(--color-light);
  list-style: none;
}
.c-navigation > .c-navigation__list {
  display: flex;
  gap: 3rem;
  flex-direction: column;
  padding-top: 11rem;
  padding-left: 16rem;
  margin-top: 0;
  text-transform: uppercase;
}
@media (max-width: 1023px) and (min-width: 792px) {
  .c-navigation > .c-navigation__list {
    gap: 2rem;
  }
}
@media (max-width: 791px) {
  .c-navigation > .c-navigation__list {
    padding-top: 24vh;
    padding-right: 5%;
    padding-left: 5%;
    gap: 1.5rem;
  }
}
@media (min-width: 1024px) and (max-width: 1418px) {
  .c-navigation > .c-navigation__list {
    padding-block: 11rem;
    padding-inline: 16rem;
  }
}
.c-navigation__list--level-2 {
  display: flex;
  flex-wrap: wrap;
  column-gap: 3.5rem;
  margin-left: 2.5rem;
}
@media (max-width: 791px) {
  .c-navigation__list--level-2 {
    gap: 1.5rem;
    margin-left: 0;
    padding-top: 1.7rem;
    padding-left: 9%;
    flex-direction: column;
    align-content: flex-start;
  }
}
.c-navigation__item--level-2 {
  flex: 0 0 40rem;
  padding-top: 3rem;
  padding-bottom: 4.5rem;
}
@media (max-width: 1023px) and (min-width: 792px) {
  .c-navigation__item--level-2 {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
@media (max-width: 791px) {
  .c-navigation__item--level-2 {
    padding: 0;
    flex: 0 0 1.3rem;
  }
}
.c-navigation__list--level-3 {
  display: flex;
  flex-direction: column;
}
@media (max-width: 791px) {
  .c-navigation__list--level-3 {
    margin-top: 1rem;
    gap: 2rem;
    padding-left: 3rem;
  }
}
@media (min-width: 792px) {
  .c-navigation__list--level-3 {
    gap: 4rem;
    margin-top: 5rem;
  }
}
.c-navigation__item .o-icon--arrow-circle {
  display: inline-block;
  border-radius: 100%;
  font-size: 4rem;
  background-color: var(--color-primary-light);
  margin-right: 2.5rem;
  transition: transform 0.3s ease;
  color: var(--color-light);
}
@media (max-width: 791px) {
  .c-navigation__item .o-icon--arrow-circle {
    font-size: 2.7rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    align-self: center;
    position: absolute;
    left: 1.5rem;
    top: 0.7rem;
  }
}
.c-navigation__item__faire-une-demande {
  position: relative;
  padding-top: 3rem;
}
.c-navigation__item__faire-une-demande:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 19rem;
  height: 0.1rem;
  background-color: #9EBCCE;
  opacity: 0.5;
}
@media (max-width: 791px) {
  .c-navigation__item__faire-une-demande:before {
    width: 70%;
    max-width: 36rem;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media (max-width: 791px) {
  .c-navigation__item__faire-une-demande {
    padding-top: 2rem;
    margin-top: 1rem;
  }
}
.c-navigation__item__faire-une-demande .c-button {
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  font-size: 2.7rem;
  text-transform: none;
  line-height: 2.7rem;
  font-family: "Poppins", sans-serif;
  position: relative;
  padding: 0.7rem 2.4rem 0.7rem 2rem;
  background-color: transparent;
  border: 0.1rem solid rgba(158, 188, 206, 0.5098039216);
  border-radius: 0.8rem;
}
@media (min-width: 792px) and (max-width: 1418px) {
  .c-navigation__item__faire-une-demande .c-button {
    font-size: 2.1rem;
  }
}
@media (max-width: 791px) {
  .c-navigation__item__faire-une-demande .c-button {
    font-size: 1.6rem;
    display: flex;
    width: 100%;
    text-align: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }
}
.c-navigation__item__faire-une-demande .c-button:focus-visible {
  outline-offset: 2px;
  outline: 2px dashed var(--color-light);
  transition: outline-offset 0.15s ease-in-out;
}
.c-navigation__item__faire-une-demande .o-icon--arrow-circle {
  background-color: var(--color-light);
  color: var(--color-primary-light);
  margin-right: 1.4rem;
}
.c-navigation__link {
  color: var(--color-light);
  font-family: "Exo_2", sans-serif;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  width: fit-content;
  background-color: transparent;
}
.c-navigation__link[aria-expanded=true] .o-icon--arrow-circle {
  transform: rotate(-90deg);
}
.c-navigation__link:hover {
  text-decoration: none;
}
.c-navigation__link:focus-visible {
  outline-offset: 2px;
  outline: 2px dashed var(--color-light);
  transition: outline-offset 0.15s ease-in-out;
}
.c-navigation__link--level-1 {
  border-radius: 0.8rem;
  border: 0.1rem solid rgba(158, 188, 206, 0.5098039216);
  padding: 0.5rem 1.5rem;
  font-size: 3.5rem;
  font-weight: 600;
  letter-spacing: 0;
  transition: all 0.3s ease;
  display: block;
}
.c-navigation__link--level-1:hover {
  text-decoration: none;
  color: var(--color-primary);
}
@media (min-width: 1024px) and (max-width: 1418px) {
  .c-navigation__link--level-1 {
    font-size: 2.1rem;
    display: flex;
    align-items: center;
  }
}
@media (max-width: 791px) {
  .c-navigation__link--level-1 {
    padding: 0.6rem 5rem 0.6rem 5rem;
    display: block;
    width: 100%;
    text-align: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    font-size: 2.1rem;
  }
}
.c-navigation__link--level-3, .c-navigation__link--level-2 {
  position: relative;
  display: block;
  border: none;
  font-size: 2.5rem;
  line-height: 2.8rem;
  text-align: left;
  transition: all 0.3s ease;
}
.c-navigation__link--level-3:after, .c-navigation__link--level-2:after {
  content: "";
  display: block;
  position: absolute;
  bottom: -1.5rem;
  left: 0;
  width: 6rem;
  height: 0.1rem;
  background-color: var(--color-primary);
  transition: all 0.3s ease;
}
.c-navigation__link--level-3:hover, .c-navigation__link--level-2:hover {
  color: var(--color-primary);
}
.c-navigation__link--level-3:hover:after, .c-navigation__link--level-2:hover:after {
  width: 100%;
}
@media (min-width: 792px) and (max-width: 1418px) {
  .c-navigation__link--level-3, .c-navigation__link--level-2 {
    font-size: 1.6rem;
  }
}
@media (max-width: 791px) {
  .c-navigation__link--level-3, .c-navigation__link--level-2 {
    font-size: 1.6rem;
    text-transform: none;
    display: block;
    width: 100%;
    text-align: left;
  }
  .c-navigation__link--level-3:after, .c-navigation__link--level-2:after {
    display: none;
  }
}
.c-navigation__link--level-3 {
  font-size: 1.5rem;
}
@media (min-width: 1418px) {
  .c-navigation__link--level-3 {
    font-size: 2.3rem;
  }
}
.c-navigation__submenu {
  display: none;
}
@media (min-width: 792px) {
  .c-navigation__submenu {
    z-index: unset;
  }
}
.c-navigation .c-button--mobile {
  padding-left: 5rem;
}
.c-navigation .c-button--mobile .o-icon {
  transform: rotate(90deg);
  margin: 0;
  font-size: 2rem;
  background-color: var(--color-black);
}

.c-burger-menu {
  margin-right: 0;
  margin-left: 5rem;
  display: flex;
  flex-direction: column;
  background: transparent;
  border: none;
  row-gap: 2px;
}
@media (max-width: 791px) {
  .c-burger-menu {
    margin-right: 2rem;
    margin-left: 1rem;
  }
}
.c-burger-menu:focus-visible {
  outline-offset: 2px;
  outline: 2px solid var(--color-light);
  transition: outline-offset 0.15s ease-in-out;
}
.c-burger-menu__text {
  font-size: 2.2rem;
  font-weight: 600;
  color: var(--color-light);
  line-height: 1;
  padding-top: 0.5rem;
}
@media (max-width: 791px) {
  .c-burger-menu__text {
    font-size: 1.4rem;
  }
}
.c-burger-menu__icon {
  width: auto;
  color: var(--color-light);
  font-size: 3.2rem;
  text-align: left;
  transition: font-size 0.8s ease;
}
@media (max-width: 791px) {
  .c-burger-menu__icon {
    font-size: 2.9rem;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-accordion {
  row-gap: 15px;
}
.c-accordion__button::after {
  transition: none;
  transform: rotate(90deg);
}
.c-accordion__button[aria-expanded=true]::after {
  background-image: var(--c-accordion-btn-icon-close);
  background-size: auto 30px;
  transform: none;
}
.c-accordion__button:focus-visible {
  outline: 2px solid var(--color-default);
  outline-offset: -2px;
}
.c-accordion__content {
  background: var(--c-accordion-panel-bgd);
  border-width: 0 0 1px 0;
  max-height: inherit;
}
.c-accordion__content[aria-hidden=true] > * {
  display: none;
}
.c-accordion--no-bgd .c-accordion__content {
  padding-inline: 0;
  background: none;
  border: 0;
}
@media (min-width: 792px) {
  .c-accordion__content {
    border-width: 0 0 2px 0;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-banner__info a {
  color: inherit;
  text-decoration: none;
}
.c-banner__text {
  display: flex;
  place-content: center;
}
.c-banner__title {
  max-width: 92rem;
  color: var(--color-secondary);
  font-weight: 700;
  text-align: center;
  letter-spacing: 0;
  margin-bottom: var(--spacer-8);
  position: relative;
  margin-left: auto;
  margin-right: auto;
}
.c-banner__title::after {
  content: "\e811";
  font-family: var(--font-family-icons);
  font-size: 0.6rem;
  color: var(--color-primary);
  position: absolute;
  bottom: -2.8rem;
  left: 50%;
  transform: translateX(-50%);
}
@media (max-width: 791px) {
  .c-banner__title {
    margin-bottom: 30px;
    font-size: 3rem;
  }
  .c-banner__title::after {
    bottom: -1.8rem;
  }
}
.c-banner__description {
  color: var(--color-secondary);
  font-weight: 700;
  font-size: 1.8rem;
  margin-bottom: var(--spacer-5);
}
.c-banner__description p {
  margin-bottom: 0;
}
.c-banner__intro {
  color: var(--color-secondary);
  font-weight: 700;
  font-size: 1.4rem;
}
@media (min-width: 792px) {
  .c-banner__intro {
    font-size: 1.8rem;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-block {
  padding: 24px 16px 24px 28px;
}
@media (min-width: 792px) {
  .c-block {
    padding: 32px 24px 32px 44px;
  }
}
.c-block__body {
  color: var(--color-dark);
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
@media (min-width: 792px) {
  .c-block__body {
    row-gap: var(--spacer-4);
  }
}
.c-block__body p {
  margin-bottom: 0;
}
.c-block__text {
  line-height: 1.375;
}
.c-block__text--italic {
  font-style: italic;
}
.c-block__link {
  text-decoration: none;
  color: var(--color-secondary);
  line-height: 1.5625;
}
.c-block__link:hover, .c-block__link:focus {
  text-decoration: none;
  color: var(--o-link-hover-color);
}
.c-block__link-text {
  text-decoration: underline;
  word-break: break-word;
}
.c-block__link--phone a, .c-block__link--phone:hover, .c-block__link--phone:focus {
  color: var(--color-secondary);
}
.c-block__footer {
  margin-top: var(--spacer-5);
}
.c-block h2 {
  color: var(--color-secondary);
  font-family: var(--font-family-body);
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 12px;
}
@media (min-width: 792px) {
  .c-block h2 {
    font-size: 3rem;
  }
}

.c-block--key-figure h2 {
  padding-bottom: var(--spacer-3);
  border-bottom: 1px solid var(--color-information);
}
.c-block--key-figure .c-key-figure__list {
  padding-bottom: var(--spacer-5);
  border-bottom: 1px solid var(--color-information);
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-breadcrumb {
  padding: var(--spacer-4) 0;
}
@media (max-width: 791px) {
  .c-breadcrumb__list {
    display: flex;
  }
}
.c-breadcrumb__item {
  font-size: 1.2rem;
  display: flex;
  place-content: center;
  place-items: center;
}
.c-breadcrumb__item:last-child {
  font-weight: 500;
  color: var(--color-secondary);
}
.c-breadcrumb__item:last-child .c-breadcrumb__link {
  text-decoration: none;
}
.c-breadcrumb__link {
  font-weight: 500;
  border: none;
  text-decoration: underline;
  padding: 0;
}
.c-breadcrumb__link--home {
  text-decoration: none;
  font-size: 1.5rem;
}
.c-breadcrumb__separator {
  font-size: 1.5rem;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-button {
  border-radius: 0;
}
.c-button.c-back-to-top {
  border-radius: 100%;
}
.c-button.c-back-to-top .o-icon {
  transform: rotate(-90deg);
}
.c-button--primary {
  color: var(--color-light);
  background-color: var(--color-primary);
  display: block;
  margin: 0 auto 40px;
  width: fit-content;
  border-radius: 0;
  padding: 0 27px;
}
.c-button--primary:hover {
  background-color: var(--c-button-hover-bg-color);
}
.c-button--secondary {
  background: var(--color-secondary);
  border: 0;
  color: var(--color-light);
}
.c-button--secondary:hover, .c-button--secondary:focus {
  background: var(--color-secondary-dark);
}
.c-button--icon-right {
  display: inline-flex;
  gap: 1.5rem;
  min-height: 4rem;
  font-size: 1.2rem;
  line-height: 2rem;
}
@media (min-width: 792px) {
  .c-button--icon-right {
    font-size: 1.5rem;
    line-height: 1.4;
  }
}
.c-button--icon-right .o-icon {
  color: var(--color-dark);
  font-size: 1.4rem;
  transition: transform 0.3s ease;
}
@media (min-width: 792px) {
  .c-button--icon-right .o-icon {
    font-size: 1.4rem;
  }
}
.c-button--icon-right:focus-within .o-icon, .c-button--icon-right:focus .o-icon, .c-button--icon-right:hover .o-icon {
  transform: translateX(4px);
}
.c-button[target=_blank] .c-button__inner::after {
  font-family: var(--font-family-icons);
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e815";
  display: inline-flex;
  margin-left: 4px;
}

.paragraph--type--cta-button {
  text-align: center;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-card__list {
  display: flex;
  column-gap: 5rem;
  justify-content: space-between;
  padding: 0;
  margin-bottom: 5rem;
}
@media (max-width: 1023px) {
  .c-card__list {
    gap: 4rem;
    flex-wrap: wrap;
    justify-content: center;
  }
}
@media (max-width: 791px) {
  .c-card__list {
    gap: 2.8rem;
  }
}

@media (max-width: 1023px) and (min-width: 792px) {
  .accueil-actualites-wrapper .container {
    max-width: 668px;
  }
  .accueil-actualites-wrapper .c-card__list {
    justify-content: flex-start;
  }
}

.c-card {
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  padding: 1.6rem;
  transition: all 0.3s ease;
}
@media (max-width: 791px) {
  .c-card {
    padding: 1.2rem;
  }
}
.c-card:hover, .c-card:focus-within {
  box-shadow: 0 0.5rem 0.8rem rgba(0, 0, 0, 0.32);
}
.c-card:hover .c-card__link, .c-card:focus-within .c-card__link {
  color: inherit;
}
.c-card__title {
  font-family: var(--font-family-body);
  font-size: 1.4rem;
  letter-spacing: 0;
  color: var(--color-secondary);
  font-weight: 700;
  line-height: 1.2;
}
@media (min-width: 793px) {
  .c-card__title {
    font-size: 2.2rem;
  }
}
.c-card__date {
  font-size: 1.1rem;
  color: var(--color-gray-3-1);
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0;
  margin-bottom: 0;
}
@media (min-width: 792px) {
  .c-card__date {
    font-size: 1.5rem;
  }
}
.c-card__image {
  border-radius: 0;
}
.c-card .c-card__icon-bottom {
  color: var(--color-secondary);
  font-size: 2rem;
  place-self: end;
}
@media (min-width: 792px) {
  .c-card .c-card__icon-bottom {
    font-size: 2.7rem;
  }
}
.c-card--vertical {
  max-width: 43.7rem;
  gap: 16px;
}
.c-card--vertical .c-card__body {
  flex: 1;
}
.c-card--vertical .c-card__media {
  position: relative;
}
.c-card--vertical:has(.c-card__image) .o-tags {
  position: absolute;
  bottom: 1.5rem;
  left: 2.2rem;
  right: 2.2rem;
}
@media (max-width: 1023px) {
  .c-card--vertical:has(.c-card__image) .o-tags {
    left: 1.2rem;
    right: 1.2rem;
  }
}
.c-card--horizontal:hover, .c-card--horizontal:focus-within {
  background: none;
}
.c-card--horizontal:hover .o-tags__item:not(.o-tags__item--outline), .c-card--horizontal:focus-within .o-tags__item:not(.o-tags__item--outline) {
  background-color: var(--color-primary);
  color: var(--color-light);
}
.c-card--horizontal .c-card__body {
  padding-right: 6.4rem;
}
@media (min-width: 792px) {
  .c-card--horizontal .c-card__body {
    justify-content: center;
  }
}
@media (min-width: 792px) {
  .c-card--horizontal .c-card__media {
    width: 24.68%;
  }
}
.c-card--horizontal .c-card__icon-bottom {
  position: absolute;
  bottom: 2.7rem;
  right: 4.4rem;
}
@media (max-width: 791px) {
  .c-card--horizontal .c-card__body {
    padding-right: 6.4rem;
  }
  .c-card--horizontal .c-card__icon-bottom {
    bottom: 1.2rem;
    right: 1.2rem;
  }
}
.c-card--zoom .c-card__media {
  border-radius: 0;
}

.c-card--actu-home.c-card {
  text-decoration: none;
  display: flex;
  max-width: 45rem;
  width: calc((100% - 10rem) / 3);
  aspect-ratio: 1;
  flex-direction: column-reverse;
  padding: 32px;
}
@media (max-width: 1023px) and (min-width: 792px) {
  .c-card--actu-home.c-card {
    width: calc(50% - 2rem);
    height: auto;
    aspect-ratio: 1;
    padding: 24px;
  }
}
@media (max-width: 791px) {
  .c-card--actu-home.c-card {
    width: calc(50% - 1.4rem);
    aspect-ratio: 15/25;
    padding: 16px;
  }
}
.c-card--actu-home.c-card:before {
  content: "";
  background-color: transparent;
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.69) 64%, rgb(0, 0, 0) 100%);
  background-position-x: 0;
  background-position-y: 0;
  background-repeat: no-repeat;
  background-origin: padding-box;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
}
.c-card--actu-home.c-card .c-card__title {
  position: static;
  font-family: var(--font-family-body);
  font-size: 22px;
  font-weight: 600;
  color: var(--c-card-title-color);
  margin: 0 4rem 0 0;
  z-index: 2;
}
@media (max-width: 1023px) {
  .c-card--actu-home.c-card .c-card__title {
    margin-right: 2rem;
    margin-bottom: 2.8rem;
    font-weight: 700;
    line-height: 1.7rem;
    font-size: 1.4rem;
  }
}
@media (max-width: 791px) {
  .c-card--actu-home.c-card .c-card__title {
    margin-right: 0;
  }
}
.c-card--actu-home.c-card .c-card__link {
  color: inherit;
  text-decoration: none;
  word-wrap: break-word;
  hyphens: auto;
}
.c-card--actu-home.c-card .c-card__link .o-icon--plus-circle {
  font-size: 4.7rem;
  display: inline-block;
  color: var(--color-light);
  background-color: var(--color-primary);
  border-radius: 100%;
  position: absolute;
  right: 2rem;
  bottom: 2.5rem;
  transition: transform 0.3s ease;
}
@media (max-width: 1023px) {
  .c-card--actu-home.c-card .c-card__link .o-icon--plus-circle {
    font-size: 3.7rem;
  }
}
@media (max-width: 791px) {
  .c-card--actu-home.c-card .c-card__link .o-icon--plus-circle {
    font-size: 2.5rem;
    right: 0.7rem;
    bottom: 1.2rem;
  }
}
.c-card--actu-home.c-card .c-card__link:hover {
  text-decoration: none;
}
.c-card--actu-home.c-card .c-card__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
@media (max-width: 1449px) and (min-width: 792px) {
  .c-card--actu-home.c-card .c-card__image {
    aspect-ratio: 1;
  }
}
.c-card--actu-home.c-card:focus:before, .c-card--actu-home.c-card:focus-within:before, .c-card--actu-home.c-card:hover:before {
  background: var(--color-primary);
  opacity: 0.85;
}
.c-card--actu-home.c-card:focus .c-card__link .o-icon--plus-circle, .c-card--actu-home.c-card:focus-within .c-card__link .o-icon--plus-circle, .c-card--actu-home.c-card:hover .c-card__link .o-icon--plus-circle {
  transform: scale(1.1);
  background-color: var(--color-light);
  color: var(--color-primary);
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-figure {
  position: relative;
}
.c-figure__legend {
  font-style: italic;
  color: var(--color-gray-3-1);
}
.c-figure__copyright {
  position: absolute;
  right: 0;
  background: var(--color-dark);
  color: var(--color-light);
  padding: 4px 8px;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-footer {
  margin-block-start: 30px;
}
@media (min-width: 1024px) {
  .c-footer {
    margin-block-start: 50px;
  }
}
.c-footer__top {
  background: var(--color-primary);
  color: var(--color-light);
  padding: 1.5rem 0;
}
.c-footer__top .row {
  align-items: center;
}
@media (max-width: 1023px) {
  .c-footer__top .row {
    flex-direction: column;
    gap: 1.6rem;
  }
}
.c-footer__top .first-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}
@media (max-width: 1023px) {
  .c-footer__top .first-column {
    order: 2;
    align-items: center;
  }
}
.c-footer__top .first-column .o-link {
  padding: 0 1.6rem 0 1rem;
  height: 4.7rem;
  font-family: var(--font-family-body), sans-serif;
  font-weight: 600;
  font-size: 1.4rem;
  color: var(--color-light);
  border-radius: 32px;
  border: 3px solid var(--color-light);
  align-items: center;
  gap: 1rem;
  transition: all 0.3s ease;
}
@media (max-width: 1023px) {
  .c-footer__top .first-column .o-link {
    font-size: 1.3rem;
    height: 4rem;
  }
}
.c-footer__top .first-column .o-link__icon {
  width: 35px;
  display: inline-flex;
  place-content: end;
  place-items: center;
  transition: all 0.3s ease;
}
.c-footer__top .first-column .o-link__icon:after {
  content: "";
  display: inline-block;
  width: 0.1rem;
  height: 30px;
  background-color: var(--color-light);
  margin-left: 0.6rem;
  margin-right: 0.2rem;
}
.c-footer__top .first-column .o-link--dept .o-link__icon {
  font-size: 3.2rem;
}
.c-footer__top .first-column .o-link--sub .o-link__icon {
  font-size: 1.6rem;
}
.c-footer__top .first-column .o-link:hover, .c-footer__top .first-column .o-link:focus, .c-footer__top .first-column .o-link:active {
  background-color: var(--color-light);
  box-shadow: none;
  color: var(--color-primary);
}
.c-footer__top .first-column .o-link:hover .o-link__icon, .c-footer__top .first-column .o-link:focus .o-link__icon, .c-footer__top .first-column .o-link:active .o-link__icon {
  color: var(--color-primary);
}
.c-footer__top .first-column .o-link:hover .o-link__icon:after, .c-footer__top .first-column .o-link:focus .o-link__icon:after, .c-footer__top .first-column .o-link:active .o-link__icon:after {
  background-color: var(--color-primary);
}
.c-footer__top .second-column {
  flex: 1 1 190px;
  max-width: 300px;
}
@media (max-width: 1023px) {
  .c-footer__top .second-column {
    order: 1;
    width: 100%;
    text-align: center;
  }
  .c-footer__top .second-column img {
    width: 100%;
    max-width: 16rem;
  }
}
.c-footer__top .third-column {
  text-align: right;
  line-height: 22px;
  font-size: 1.5rem;
  color: var(--color-light);
  font-family: var(--font-family-body), sans-serif;
  letter-spacing: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
@media (max-width: 1023px) {
  .c-footer__top .third-column {
    order: 3;
  }
}
@media (max-width: 1023px) {
  .c-footer__top .third-column {
    font-size: 1.1rem;
  }
}
.c-footer__top .third-column .title-footer-conseil {
  color: inherit;
  font-weight: bold;
  font-size: inherit;
  margin-bottom: 0.4rem;
  font-family: var(--font-family-body), sans-serif;
}
@media (max-width: 1023px) {
  .c-footer__top .third-column .title-footer-conseil {
    display: block;
    font-size: 1.2rem;
    width: 100%;
    text-align: center;
  }
}
.c-footer__top .third-column .addresse,
.c-footer__top .third-column .phone,
.c-footer__top .third-column .email {
  color: var(--color-light);
  display: block;
  text-align: right;
  font-style: normal;
}
.c-footer__top .third-column .addresse .o-icon,
.c-footer__top .third-column .phone .o-icon,
.c-footer__top .third-column .email .o-icon {
  font-size: 1.2em;
  display: inline-block;
  vertical-align: top;
  margin-right: 0.5em;
}
@media (max-width: 1023px) {
  .c-footer__top .third-column .addresse .o-icon,
  .c-footer__top .third-column .phone .o-icon,
  .c-footer__top .third-column .email .o-icon {
    font-size: 1em;
    vertical-align: middle;
  }
}
@media (max-width: 1023px) {
  .c-footer__top .third-column .addresse,
  .c-footer__top .third-column .phone,
  .c-footer__top .third-column .email {
    text-align: center;
    width: 100%;
    margin: 0 auto;
  }
}
.c-footer__top .third-column .addresse {
  max-width: 27rem;
}
@media (max-width: 791px) {
  .c-footer__top .third-column .addresse {
    max-width: 18rem;
  }
}
.c-footer__top .third-column .addresse .o-icon {
  margin-right: 0.1em;
}
.c-footer__top .third-column .phone {
  margin-bottom: 0;
}
.c-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  list-style: none;
  gap: var(--spacer-4);
  flex: 1;
  padding: 1.6rem calc(32px / 2);
  margin: 0 auto;
}
@media (min-width: 1024px) {
  .c-footer__bottom {
    max-width: 1172px;
  }
}
@media (min-width: 1759px) {
  .c-footer__bottom {
    max-width: 1450px;
  }
}
.c-footer__bottom .o-link {
  padding-bottom: 0;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  font-size: 2rem;
  line-height: 3rem;
  font-family: "Poppins", sans-serif;
  text-transform: uppercase;
  text-decoration: underline;
  border-bottom: none;
  background: var(--color-light);
  color: var(--color-secondary);
}
@media (max-width: 791px) {
  .c-footer__bottom .o-link {
    font-size: 1.2rem;
    line-height: 1.7rem;
  }
}
@media (max-width: 791px) {
  .c-footer__bottom {
    --middle-disteance: 8%;
    position: relative;
    justify-content: space-between;
    column-gap: var(--middle-disteance);
    row-gap: var(--spacer-6);
  }
  .c-footer__bottom-item {
    flex: 1 0 calc(50% - var(--middle-disteance));
    align-items: center;
    max-width: calc(50% - var(--middle-disteance));
  }
  .c-footer__bottom-item:nth-child(odd) {
    text-align: right;
  }
  .c-footer__bottom-item:nth-child(even) {
    text-align: left;
  }
  .c-footer__bottom:after {
    content: "";
    position: absolute;
    top: var(--spacer-6);
    left: 50%;
    width: 1px;
    height: calc(100% - var(--spacer-6) * 2);
    transform: translateX(-1px);
    background-color: var(--color-secondary);
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.u-hidden {
  display: none;
}
@media (min-width: 575px) {
  .u-hidden\@xs {
    display: none;
  }
}
@media (min-width: 792px) {
  .u-hidden\@sm {
    display: none;
  }
}
@media (min-width: 1024px) {
  .u-hidden\@md {
    display: none;
  }
}
@media (min-width: 1280px) {
  .u-hidden\@lg {
    display: none;
  }
}

@media (max-width: 574px) {
  .u-visible\@xs {
    display: none;
  }
}
@media (max-width: 791px) {
  .u-visible\@sm {
    display: none;
  }
}
@media (max-width: 1023px) {
  .u-visible\@md {
    display: none;
  }
}
@media (max-width: 1279px) {
  .u-visible\@lg {
    display: none;
  }
}

.u-hidden-important {
  display: none !important;
}
@media (min-width: 575px) {
  .u-hidden-important\@xs {
    display: none !important;
  }
}
@media (min-width: 792px) {
  .u-hidden-important\@sm {
    display: none !important;
  }
}
@media (min-width: 1024px) {
  .u-hidden-important\@md {
    display: none !important;
  }
}
@media (min-width: 1280px) {
  .u-hidden-important\@lg {
    display: none !important;
  }
}

.u-visuallyhidden:not(:focus):not(:active) {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
}
@media (max-width: 574px) {
  .u-visuallyhidden\@xs:not(:focus):not(:active) {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    white-space: nowrap;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
  }
}
@media (max-width: 791px) {
  .u-visuallyhidden\@sm:not(:focus):not(:active) {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    white-space: nowrap;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
  }
}
@media (max-width: 1023px) {
  .u-visuallyhidden\@md:not(:focus):not(:active) {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    white-space: nowrap;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
  }
}
@media (max-width: 1279px) {
  .u-visuallyhidden\@lg:not(:focus):not(:active) {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    white-space: nowrap;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
  }
}

.u-flex {
  display: flex;
}
@media (min-width: 1024px) {
  .u-flex\@md {
    display: flex;
  }
}
@media (max-width: 1023px) {
  .u-flex\@md- {
    display: flex;
  }
}

.u-flex-column {
  flex-direction: column;
}
@media (min-width: 1024px) {
  .u-flex-column\@md {
    flex-direction: column;
  }
}
@media (max-width: 1023px) {
  .u-flex-column\@md- {
    flex-direction: column;
  }
}

.u-flex-column-reverse {
  flex-direction: column-reverse;
}
@media (min-width: 1024px) {
  .u-flex-column-reverse\@md {
    flex-direction: column-reverse;
  }
}
@media (max-width: 1023px) {
  .u-flex-column-reverse\@md- {
    flex-direction: column-reverse;
  }
}

.u-flex-row {
  flex-direction: row;
}
@media (min-width: 1024px) {
  .u-flex-row\@md {
    flex-direction: row;
  }
}
@media (max-width: 1023px) {
  .u-flex-row\@md- {
    flex-direction: row;
  }
}

.u-flex-row-reverse {
  flex-direction: row-reverse;
}
@media (min-width: 1024px) {
  .u-flex-row-reverse\@md {
    flex-direction: row-reverse;
  }
}
@media (max-width: 1023px) {
  .u-flex-row-reverse\@md- {
    flex-direction: row-reverse;
  }
}

.u-justify-center {
  justify-content: center;
}
@media (min-width: 1024px) {
  .u-justify-center\@md {
    justify-content: center;
  }
}
@media (max-width: 1023px) {
  .u-justify-center\@md- {
    justify-content: center;
  }
}

.u-justify-end {
  justify-content: flex-end;
}
@media (min-width: 1024px) {
  .u-justify-end\@md {
    justify-content: flex-end;
  }
}
@media (max-width: 1023px) {
  .u-justify-end\@md- {
    justify-content: flex-end;
  }
}

.u-align-center {
  align-items: center;
}
@media (min-width: 1024px) {
  .u-align-center\@md {
    align-items: center;
  }
}
@media (max-width: 1023px) {
  .u-align-center\@md- {
    align-items: center;
  }
}

.u-align-end {
  align-items: flex-end;
}
@media (min-width: 1024px) {
  .u-align-end\@md {
    align-items: flex-end;
  }
}
@media (max-width: 1023px) {
  .u-align-end\@md- {
    align-items: flex-end;
  }
}

.u-space-between {
  justify-content: space-between;
}
@media (min-width: 1024px) {
  .u-space-between\@md {
    justify-content: space-between;
  }
}
@media (max-width: 1023px) {
  .u-space-between\@md- {
    justify-content: space-between;
  }
}

.splide--home .splide {
  margin-bottom: 5rem;
}
.splide--home .splide__list {
  aspect-ratio: 1920/620;
}
@media (max-width: 791px) {
  .splide--home .splide__list {
    aspect-ratio: 360/325;
  }
}
.splide--home .splide__arrow {
  background-color: transparent;
  opacity: 1;
  width: 6rem;
  height: 6rem;
}
.splide--home .splide__arrow svg {
  fill: #fff;
  height: 12rem;
  width: 12rem;
}
@media (max-width: 1023px) {
  .splide--home .splide__arrow svg {
    height: 8rem;
    width: 8rem;
  }
}
@media (max-width: 791px) {
  .splide--home .splide__arrow svg {
    height: 2rem;
    width: 2rem;
  }
}
@media (max-width: 791px) {
  .splide--home .splide__arrow {
    width: auto;
    height: auto;
    top: 32.5%;
  }
}
.splide--home .splide__slide {
  padding-right: 8rem;
  padding-left: 8rem;
}
@media (max-width: 791px) {
  .splide--home .splide__slide {
    padding-inline: 0;
  }
}
.splide--home .splide__slide .container {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  aspect-ratio: 360/325;
}
@media (max-width: 791px) {
  .splide--home .splide__slide .container {
    justify-content: flex-end;
    padding-inline: 0;
  }
}
.splide--home .splide__slide:before {
  content: "";
  background-color: transparent;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.69) 40%, rgb(0, 0, 0) 100%);
  background-size: 60% 100%;
  background-position: top right;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-clip: padding-box;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
}
@media (max-width: 1023px) and (min-width: 792px) {
  .splide--home .splide__slide:before {
    background-size: 80% 100%;
  }
}
@media (max-width: 791px) {
  .splide--home .splide__slide:before {
    background: transparent linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 50%, #000 100%) 0% 0% no-repeat padding-box;
    background-size: 100%;
  }
}
.splide--home .splide__slide-content {
  width: 100%;
  max-width: 70rem;
  color: var(--color-light);
  z-index: 2;
  text-align: right;
}
@media (max-width: 1023px) {
  .splide--home .splide__slide-content {
    width: 100%;
    padding-right: 2rem;
    padding-left: 2rem;
  }
}
@media (max-width: 791px) {
  .splide--home .splide__slide-content {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
  }
}
.splide--home .splide__slide-title {
  color: inherit;
  font-style: normal;
  font-variant: normal;
  font-weight: bold;
  font-size: 5.4rem;
  line-height: 5.8rem;
  font-family: var(--font-family-heading), sans-serif;
}
@media (max-width: 1023px) {
  .splide--home .splide__slide-title {
    font-size: 4.2rem;
    line-height: 4.6rem;
  }
}
@media (max-width: 791px) {
  .splide--home .splide__slide-title {
    font-size: 2.2rem;
    line-height: 2.4rem;
    text-align: center;
    margin: 0 3.2rem 2.4rem;
  }
}
.splide--home .splide__slide-title:after {
  content: "";
  display: block;
  width: 4rem;
  height: 7px;
  border-radius: 7px;
  background-color: var(--color-primary-light);
  margin-top: 1rem;
  margin-left: auto;
}
@media (max-width: 1023px) {
  .splide--home .splide__slide-title:after {
    display: none;
  }
}
.splide--home .splide__slide-title-link {
  text-decoration: none;
  color: inherit;
}
.splide--home .splide__slide-txt {
  font-style: normal;
  font-variant: normal;
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 1.9rem;
  font-family: var(--font-family-body), sans-serif;
}
@media (max-width: 1023px) {
  .splide--home .splide__slide-txt {
    padding-inline: 3.2rem;
    text-align: left;
    margin-bottom: 2.4rem;
    font-size: 1.2rem;
  }
}
.splide--home .splide__slide-btn {
  position: relative;
}
@media (max-width: 1023px) {
  .splide--home .splide__slide-btn {
    position: absolute;
    right: 20px;
    bottom: 20px;
  }
}
@media (max-width: 791px) {
  .splide--home .splide__slide-btn {
    right: 14px;
    top: 48%;
    bottom: 0;
  }
}
.splide--home .splide__slide-btn .o-icon--plus-circle {
  font-size: 47px;
  display: inline-block;
  color: var(--color-light);
  background-color: var(--color-primary);
  border-radius: 100%;
  transition: transform 0.3s ease;
}
@media (max-width: 1023px) {
  .splide--home .splide__slide-btn .o-icon--plus-circle {
    font-size: 37px;
  }
}
@media (max-width: 791px) {
  .splide--home .splide__slide-btn .o-icon--plus-circle {
    font-size: 25px;
  }
}
.splide--home .splide__slide-btn:focus .o-icon--plus-circle, .splide--home .splide__slide-btn:focus-within .o-icon--plus-circle, .splide--home .splide__slide-btn:hover .o-icon--plus-circle {
  transform: scale(1.1);
  background-color: var(--color-light);
  color: var(--color-primary);
}
.splide--home .splide__slide-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
.splide--home .splide__toggle {
  border: none;
  background-color: transparent;
  height: fit-content;
  width: fit-content;
  padding: 0;
}
.splide--home .splide__toggle__pause, .splide--home .splide__toggle__play {
  color: var(--color-gray-3-1);
  font-size: 1.9rem;
}
@media (max-width: 791px) {
  .splide--home .splide__toggle__pause, .splide--home .splide__toggle__play {
    font-size: 1.2rem;
  }
}
.splide--home .splide__pagination {
  width: fit-content;
  background: var(--color-light) 0 0 no-repeat;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
  border-radius: 21px;
  height: 3.2rem;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 50%);
  column-gap: 0.8rem;
}
.splide--home .splide__pagination li {
  display: flex;
  height: 100%;
  align-items: center;
}
@media (max-width: 791px) {
  .splide--home .splide__pagination {
    height: 1.8rem;
    column-gap: 0.6rem;
    box-shadow: none;
  }
}
.splide--home .splide__pagination__page {
  background: var(--color-gray-3-1) 0 0 no-repeat;
  width: 1.3rem;
  height: 1.3rem;
}
@media (max-width: 791px) {
  .splide--home .splide__pagination__page {
    width: 0.7rem;
    height: 0.7rem;
  }
}
.splide--home .splide__pagination__page.is-active {
  background: var(--color-primary-light) 0 0 no-repeat;
  transform: scale(1.3);
}

.c-diaporama {
  position: relative;
}
@media (min-width: 792px) {
  .c-diaporama {
    padding: 0 6rem;
  }
}
.c-diaporama .c-lightbox {
  border: 0;
  padding: 0;
  background-color: transparent;
  background-image: none;
}
.c-diaporama .c-lightbox:focus-visible {
  outline: 1px solid;
}
.c-diaporama .c-figure__image {
  aspect-ratio: var(--c-figure-aspect-ratio);
}
.c-diaporama .splide__arrows {
  position: static;
}
.c-diaporama .splide__arrows path {
  stroke: none;
}
.c-diaporama .splide__arrow {
  position: absolute;
  background-color: var(--color-primary);
  width: 4.4rem;
  height: 4.4rem;
  color: var(--color-light);
  opacity: 1;
  top: calc(50% - 2rem);
  transform: translateY(-50%);
}
.c-diaporama .splide__arrow svg {
  fill: var(--color-light);
}
.c-diaporama .splide__arrow--next {
  right: 0;
  left: auto;
}

.glightbox-container .gbtn:focus-visible {
  border: 1px solid var(--color-light);
  outline: none;
}

.splide.is-focus-in .splide__toggle:focus,
.splide.is-focus-in .splide__pagination__page:focus {
  outline: 2px solid var(--color-default);
}
.splide.is-focus-in .splide__arrow:focus {
  outline: 2px solid var(--color-light);
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-header {
  position: sticky;
  top: 5.3rem;
  z-index: 5;
}

.c-main-header {
  --callisto-header-height: 110px;
  position: sticky;
  height: var(--callisto-header-height);
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  background-color: var(--color-primary);
  transition: height 0.8s ease;
  top: 0;
  z-index: 10;
}
@media (max-width: 1449px) and (min-width: 1024px) {
  .c-main-header {
    --callisto-header-height: 120px;
  }
}
@media (min-width: 1450px) {
  .c-main-header {
    --callisto-header-height: 165px;
  }
}
@media (max-width: 1023px) {
  .c-main-header {
    justify-content: space-between;
  }
}
@media (min-width: 1024px) {
  .c-main-header {
    overflow: hidden;
  }
}
.c-main-header > .container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  column-gap: 0;
  padding-right: 20px;
  padding-left: 20px;
  max-width: 1450px;
}
@media (max-width: 1861px) {
  .c-main-header > .container {
    margin-left: 0;
    padding-right: 80px;
    margin-right: 0;
    justify-content: space-between;
  }
}
@media (max-width: 1023px) {
  .c-main-header > .container {
    padding-right: 40px;
  }
}
@media (max-width: 791px) {
  .c-main-header > .container {
    padding-right: 0;
    padding-left: 0;
    flex-flow: row nowrap;
  }
}
.c-main-header .block-header-wrapper {
  display: flex;
  align-items: stretch;
  flex-direction: row;
  justify-content: flex-start;
  margin: 0;
  padding: 0;
  flex: 0 1 auto;
}
@media (max-width: 1023px) {
  .c-main-header .block-header-wrapper {
    flex: 1 1 auto;
  }
}
@media (min-width: 1024px) {
  .c-main-header .block-header-wrapper {
    width: 29.1rem;
    justify-content: flex-end;
  }
}
.c-main-header .logo-haute-garonne {
  display: block;
  position: relative;
  height: 10rem;
  width: 7.8rem;
  max-width: unset;
  margin: 0;
  z-index: 2;
  transition: height 0.8s ease;
}
@media (max-width: 1449px) and (min-width: 1024px) {
  .c-main-header .logo-haute-garonne {
    height: auto;
    width: 6rem;
  }
}
@media (max-width: 1023px) {
  .c-main-header .logo-haute-garonne {
    height: 4rem;
    width: auto;
  }
}
.c-main-header .o-logo-link {
  overflow: hidden;
  position: absolute;
  text-decoration: none;
  color: var(--color-light);
  top: 0;
  left: 0;
  height: 100%;
  padding-top: 2rem;
  padding-left: 3.5rem;
  z-index: 1;
  transition: all 0.8s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.c-main-header .o-logo-link:focus-visible {
  outline-offset: -2px;
  outline: 2px solid var(--color-default);
}
@media (max-width: 1661px) and (min-width: 1024px) {
  .c-main-header .o-logo-link {
    padding-top: 13px;
    position: relative;
    flex: 0 0 auto;
  }
}
@media (max-width: 1023px) {
  .c-main-header .o-logo-link {
    padding-left: 1rem;
    padding-top: 0.7rem;
    padding-right: 2.8rem;
    position: relative;
  }
}
.c-main-header .o-logo-link .o-icon {
  transition: all 0.8s ease;
}
@media (min-width: 1024px) {
  .c-main-header .o-logo-link .o-icon {
    margin-left: 15px;
    margin-top: -5px;
  }
}
@media (max-width: 1023px) {
  .c-main-header .o-logo-link .o-icon {
    font-size: 1rem;
  }
}
.c-main-header .o-logo-link__text {
  position: relative;
  display: block;
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.6rem;
  width: 14rem;
  padding-top: 1rem;
  z-index: 2;
}
@media (max-width: 791px) {
  .c-main-header .o-logo-link__text {
    display: none;
  }
}
.c-main-header .svg-header-polygon {
  position: absolute;
  top: 0;
  left: 0;
  width: 20rem;
  color: var(--color-light);
  transition: all 0.8s ease;
}
@media (max-width: 1449px) {
  .c-main-header .svg-header-polygon {
    width: 17rem;
  }
}
@media (max-width: 1023px) {
  .c-main-header .svg-header-polygon {
    width: 7rem;
  }
}
@media (max-width: 791px) {
  .c-main-header .svg-header-polygon {
    left: -0.2rem;
  }
}
.c-main-header .logo-platform {
  display: block;
  height: 16.3rem;
  width: auto;
  padding-top: 1.4rem;
  padding-bottom: 1.4rem;
  transition: height 0.8s ease-in-out;
}
@media (max-width: 1661px) {
  .c-main-header .logo-platform {
    height: 6.2rem;
    width: auto;
    padding: 0;
    margin: 0 auto;
  }
}

.c-main-header.sticky {
  --callisto-header-height-sticky: 95px;
  height: var(--callisto-header-height-sticky);
}
@media (min-width: 1303px) {
  .c-main-header.sticky {
    --callisto-header-height-sticky: 85px;
  }
}
.c-main-header.sticky .logo-haute-garonne {
  height: 3rem;
  width: auto;
}
.c-main-header.sticky .logo-platform {
  height: 5.5rem;
}
.user-logged-in .c-main-header.sticky {
  top: var(--gin-toolbar-y-offset);
}
@media (max-width: 1023px) {
  .c-main-header.sticky .c-burger-menu__icon {
    font-size: 2rem;
  }
  .c-main-header.sticky .o-logo-link:before {
    bottom: 6.8rem;
  }
}
@media (min-width: 1024px) {
  .c-main-header.sticky .o-logo-link {
    padding-top: 0.5rem;
  }
  .c-main-header.sticky .o-logo-link__text {
    font-size: 1.2rem;
    max-width: 11rem;
  }
  .c-main-header.sticky .o-logo-link .o-icon {
    font-size: 1rem;
    margin: 0 0 0 1rem;
  }
  .c-main-header.sticky .svg-header-polygon {
    width: 14.5rem;
  }
  .c-main-header.sticky .logo-haute-garonne {
    width: 5.1rem;
    height: auto;
  }
}
@media (min-width: 1660px) {
  .c-main-header.sticky .logo-platform {
    height: 8rem;
  }
}
@media (max-width: 1661px) and (min-width: 1024px) {
  .c-main-header.sticky .logo-platform {
    height: 6.2rem;
  }
}
@media (max-width: 1023px) {
  .c-main-header.sticky .svg-header-polygon {
    width: 6rem;
  }
}

#block-cd31-accessibilite {
  display: none;
}

@media (min-width: 1024px) {
  .c-search {
    flex: 1 1 auto;
    margin-left: 3.6rem;
  }
}
.c-search__form {
  flex: 1 1 auto;
  max-width: 77rem;
}
.c-search__form .input-group {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  position: relative;
}
.c-search__form .c-form__item {
  border-radius: 2.9rem;
}
@media (max-width: 1023px) {
  .c-search__form .c-form__item {
    --c-form-item-height: 4.4rem;
    padding-left: 2rem;
  }
}
.c-search__form .c-form__item.form-autocomplete {
  background-position: calc(100% - 7rem) center;
}
.c-search__form .c-form__item.form-autocomplete:focus-visible {
  outline: 2px solid var(--color-default);
}
.c-search__form .btn {
  position: absolute;
  right: 1rem;
  background-color: transparent;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  margin: 0;
  cursor: pointer;
  border-left: 0.1rem solid var(--color-secondary);
  padding: 0 1rem 0 1.6rem;
  height: 3.4rem;
  color: var(--color-secondary);
  font-size: 2.5rem;
}
@media (max-width: 1023px) {
  .c-search__form .btn {
    font-size: 1.7rem;
    height: 2.4rem;
  }
}
.c-search__form .btn:focus-visible {
  outline: 2px solid var(--color-dark);
}
.c-search__bloc {
  width: 100vw;
  background: var(--color-light);
  left: 0;
  top: var(--header-height);
  position: absolute;
  z-index: 2;
  border-bottom: 2px solid var(--color-primary);
  padding: 12px 24px 24px;
  text-align: right;
}
.c-search__close {
  border: 0;
  background: 0;
  padding: 0;
  margin: 0 0 2rem;
  display: inline-flex;
  justify-content: flex-end;
  column-gap: var(--spacer-2);
  place-items: center;
  color: var(--o-link-color);
}
.c-search__close:focus-visible {
  outline-offset: 1px;
  outline: 2px solid var(--color-dark);
  transition: outline-offset 0.15s ease-in-out;
}

.c-search-toggle {
  display: none;
}
.c-search-toggle .o-icon.o-icon--close {
  display: none;
}
.c-search-toggle .o-icon.o-icon--search {
  display: block;
  color: var(--color-secondary);
}
@media (max-width: 1023px) {
  .c-search-toggle {
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: absolute;
    left: 0;
    bottom: 0.4rem;
    width: 4rem;
    height: 4rem;
    z-index: 4;
    cursor: pointer;
    border: none;
    background: var(--color-light);
    padding: 10px;
    border-radius: 0 8px 8px 0;
    font-size: 1.9rem;
  }
  .c-search-toggle:focus-visible {
    outline: 1px solid currentColor;
    outline-offset: 2px;
    transition: outline-offset 0.15s ease-in-out;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-key-figure__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.c-key-figure__text {
  margin-bottom: 0;
  display: flex;
  align-items: center;
  column-gap: 4px;
  color: var(--color-dark);
  line-height: 1.375;
}
@media (min-width: 1418px) {
  .c-key-figure__text {
    column-gap: var(--spacer-4);
  }
}
.c-key-figure__number {
  font-size: 3rem;
  flex: 0 0 50%;
  color: var(--color-primary);
  font-weight: 700;
}
@media (min-width: 1418px) {
  .c-key-figure__number {
    font-size: 5rem;
    text-align: right;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.o-link--no-decoration {
  text-decoration: none;
}
.o-link--no-decoration:hover {
  text-decoration: none;
}
.o-link--more {
  padding: 0;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--color-secondary);
  border-bottom: 1px solid var(--color-secondary);
  line-height: 2;
}
.o-link--more .o-icon {
  position: static;
  color: var(--color-secondary);
  font-size: 1.25em;
}
.o-link--more__text {
  text-decoration: none;
  flex: 1;
}
.o-link:not(.c-ressources__link)[target=_blank]::after {
  font-family: var(--font-family-icons);
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e815";
  display: inline-flex;
  margin-left: -4px;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-navigation {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 10;
  overflow-x: hidden;
  overflow-y: auto;
}
.c-navigation.is-visible {
  display: block;
  opacity: 1;
}
.c-navigation__close {
  position: absolute;
  right: 0;
  top: 0;
  flex-direction: column;
  margin: 1.8rem 9rem 1rem 1rem;
  color: var(--color-light);
  border: none;
  background: none;
  font-weight: 700;
  padding: 0;
}
.c-navigation__close:hover {
  border: none;
}
.c-navigation__close:focus-visible {
  outline-offset: 2px;
  outline: 2px dashed var(--color-light);
  transition: outline-offset 0.15s ease-in-out;
}
@media (max-width: 791px) {
  .c-navigation__close {
    margin: 1rem;
  }
}
.c-navigation__close .o-icon {
  font-size: 4.1rem;
  color: inherit;
}
@media (max-width: 791px) {
  .c-navigation__close .o-icon {
    font-size: 3rem;
  }
}
.c-navigation__close-text {
  margin-top: 0.5rem;
  display: block;
  font-size: 1.7rem;
  color: inherit;
}
@media (max-width: 791px) {
  .c-navigation__close-text {
    font-size: 1.2rem;
  }
}
.c-navigation__list {
  color: var(--color-light);
  list-style: none;
}
.c-navigation > .c-navigation__list {
  display: flex;
  gap: 3rem;
  flex-direction: column;
  padding-top: 11rem;
  padding-left: 16rem;
  margin-top: 0;
  text-transform: uppercase;
}
@media (max-width: 1023px) and (min-width: 792px) {
  .c-navigation > .c-navigation__list {
    gap: 2rem;
  }
}
@media (max-width: 791px) {
  .c-navigation > .c-navigation__list {
    padding-top: 24vh;
    padding-right: 5%;
    padding-left: 5%;
    gap: 1.5rem;
  }
}
@media (min-width: 1024px) and (max-width: 1418px) {
  .c-navigation > .c-navigation__list {
    padding-block: 11rem;
    padding-inline: 16rem;
  }
}
.c-navigation__list--level-2 {
  display: flex;
  flex-wrap: wrap;
  column-gap: 3.5rem;
  margin-left: 2.5rem;
}
@media (max-width: 791px) {
  .c-navigation__list--level-2 {
    gap: 1.5rem;
    margin-left: 0;
    padding-top: 1.7rem;
    padding-left: 9%;
    flex-direction: column;
    align-content: flex-start;
  }
}
.c-navigation__item--level-2 {
  flex: 0 0 40rem;
  padding-top: 3rem;
  padding-bottom: 4.5rem;
}
@media (max-width: 1023px) and (min-width: 792px) {
  .c-navigation__item--level-2 {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
@media (max-width: 791px) {
  .c-navigation__item--level-2 {
    padding: 0;
    flex: 0 0 1.3rem;
  }
}
.c-navigation__list--level-3 {
  display: flex;
  flex-direction: column;
}
@media (max-width: 791px) {
  .c-navigation__list--level-3 {
    margin-top: 1rem;
    gap: 2rem;
    padding-left: 3rem;
  }
}
@media (min-width: 792px) {
  .c-navigation__list--level-3 {
    gap: 4rem;
    margin-top: 5rem;
  }
}
.c-navigation__item .o-icon--arrow-circle {
  display: inline-block;
  border-radius: 100%;
  font-size: 4rem;
  background-color: var(--color-primary-light);
  margin-right: 2.5rem;
  transition: transform 0.3s ease;
  color: var(--color-light);
}
@media (max-width: 791px) {
  .c-navigation__item .o-icon--arrow-circle {
    font-size: 2.7rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    align-self: center;
    position: absolute;
    left: 1.5rem;
    top: 0.7rem;
  }
}
.c-navigation__item__faire-une-demande {
  position: relative;
  padding-top: 3rem;
}
.c-navigation__item__faire-une-demande:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 19rem;
  height: 0.1rem;
  background-color: #9EBCCE;
  opacity: 0.5;
}
@media (max-width: 791px) {
  .c-navigation__item__faire-une-demande:before {
    width: 70%;
    max-width: 36rem;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media (max-width: 791px) {
  .c-navigation__item__faire-une-demande {
    padding-top: 2rem;
    margin-top: 1rem;
  }
}
.c-navigation__item__faire-une-demande .c-button {
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  font-size: 2.7rem;
  text-transform: none;
  line-height: 2.7rem;
  font-family: "Poppins", sans-serif;
  position: relative;
  padding: 0.7rem 2.4rem 0.7rem 2rem;
  background-color: transparent;
  border: 0.1rem solid rgba(158, 188, 206, 0.5098039216);
  border-radius: 0.8rem;
}
@media (min-width: 792px) and (max-width: 1418px) {
  .c-navigation__item__faire-une-demande .c-button {
    font-size: 2.1rem;
  }
}
@media (max-width: 791px) {
  .c-navigation__item__faire-une-demande .c-button {
    font-size: 1.6rem;
    display: flex;
    width: 100%;
    text-align: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }
}
.c-navigation__item__faire-une-demande .c-button:focus-visible {
  outline-offset: 2px;
  outline: 2px dashed var(--color-light);
  transition: outline-offset 0.15s ease-in-out;
}
.c-navigation__item__faire-une-demande .o-icon--arrow-circle {
  background-color: var(--color-light);
  color: var(--color-primary-light);
  margin-right: 1.4rem;
}
.c-navigation__link {
  color: var(--color-light);
  font-family: "Exo_2", sans-serif;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  width: fit-content;
  background-color: transparent;
}
.c-navigation__link[aria-expanded=true] .o-icon--arrow-circle {
  transform: rotate(-90deg);
}
.c-navigation__link:hover {
  text-decoration: none;
}
.c-navigation__link:focus-visible {
  outline-offset: 2px;
  outline: 2px dashed var(--color-light);
  transition: outline-offset 0.15s ease-in-out;
}
.c-navigation__link--level-1 {
  border-radius: 0.8rem;
  border: 0.1rem solid rgba(158, 188, 206, 0.5098039216);
  padding: 0.5rem 1.5rem;
  font-size: 3.5rem;
  font-weight: 600;
  letter-spacing: 0;
  transition: all 0.3s ease;
  display: block;
}
.c-navigation__link--level-1:hover {
  text-decoration: none;
  color: var(--color-primary);
}
@media (min-width: 1024px) and (max-width: 1418px) {
  .c-navigation__link--level-1 {
    font-size: 2.1rem;
    display: flex;
    align-items: center;
  }
}
@media (max-width: 791px) {
  .c-navigation__link--level-1 {
    padding: 0.6rem 5rem 0.6rem 5rem;
    display: block;
    width: 100%;
    text-align: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    font-size: 2.1rem;
  }
}
.c-navigation__link--level-3, .c-navigation__link--level-2 {
  position: relative;
  display: block;
  border: none;
  font-size: 2.5rem;
  line-height: 2.8rem;
  text-align: left;
  transition: all 0.3s ease;
}
.c-navigation__link--level-3:after, .c-navigation__link--level-2:after {
  content: "";
  display: block;
  position: absolute;
  bottom: -1.5rem;
  left: 0;
  width: 6rem;
  height: 0.1rem;
  background-color: var(--color-primary);
  transition: all 0.3s ease;
}
.c-navigation__link--level-3:hover, .c-navigation__link--level-2:hover {
  color: var(--color-primary);
}
.c-navigation__link--level-3:hover:after, .c-navigation__link--level-2:hover:after {
  width: 100%;
}
@media (min-width: 792px) and (max-width: 1418px) {
  .c-navigation__link--level-3, .c-navigation__link--level-2 {
    font-size: 1.6rem;
  }
}
@media (max-width: 791px) {
  .c-navigation__link--level-3, .c-navigation__link--level-2 {
    font-size: 1.6rem;
    text-transform: none;
    display: block;
    width: 100%;
    text-align: left;
  }
  .c-navigation__link--level-3:after, .c-navigation__link--level-2:after {
    display: none;
  }
}
.c-navigation__link--level-3 {
  font-size: 1.5rem;
}
@media (min-width: 1418px) {
  .c-navigation__link--level-3 {
    font-size: 2.3rem;
  }
}
.c-navigation__submenu {
  display: none;
}
@media (min-width: 792px) {
  .c-navigation__submenu {
    z-index: unset;
  }
}
.c-navigation .c-button--mobile {
  padding-left: 5rem;
}
.c-navigation .c-button--mobile .o-icon {
  transform: rotate(90deg);
  margin: 0;
  font-size: 2rem;
  background-color: var(--color-black);
}

.c-burger-menu {
  margin-right: 0;
  margin-left: 5rem;
  display: flex;
  flex-direction: column;
  background: transparent;
  border: none;
  row-gap: 2px;
}
@media (max-width: 791px) {
  .c-burger-menu {
    margin-right: 2rem;
    margin-left: 1rem;
  }
}
.c-burger-menu:focus-visible {
  outline-offset: 2px;
  outline: 2px solid var(--color-light);
  transition: outline-offset 0.15s ease-in-out;
}
.c-burger-menu__text {
  font-size: 2.2rem;
  font-weight: 600;
  color: var(--color-light);
  line-height: 1;
  padding-top: 0.5rem;
}
@media (max-width: 791px) {
  .c-burger-menu__text {
    font-size: 1.4rem;
  }
}
.c-burger-menu__icon {
  width: auto;
  color: var(--color-light);
  font-size: 3.2rem;
  text-align: left;
  transition: font-size 0.8s ease;
}
@media (max-width: 791px) {
  .c-burger-menu__icon {
    font-size: 2.9rem;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-pager__link {
  font-weight: 600;
  letter-spacing: 0;
  border: none;
  border-bottom: solid 1px transparent;
  border-radius: 0;
}
.c-pager__link .o-icon {
  font-size: var(--c-pager-icon-font-size);
  transform: rotate(90deg);
}
@media (max-width: 791px) {
  .c-pager {
    font-size: 1.2rem;
  }
}

a.c-pager__link:hover, a.c-pager__link:focus, a.c-pager__link[aria-current=page] {
  color: var(--color-secondary);
  background-color: transparent;
  border-bottom-color: var(--color-secondary);
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-quote {
  max-width: 100vw;
  margin-inline: -16px;
  padding-block: 16px;
  padding-inline: 119px 16px;
  background: var(--color-gray-5-1);
}
.c-quote::before {
  height: 77px;
  width: 77px;
  left: 24px;
  top: 12.5px;
}
.c-quote__item p {
  margin: 0;
  font-style: italic;
}
.c-quote__author {
  font-size: var(--c-quote-author-size);
}
@media (min-width: 792px) {
  .c-quote {
    padding-block: 33.5px 30.5px;
    padding-inline: 160px 50px;
    margin-inline: 0;
  }
  .c-quote::before {
    height: 79.5px;
    width: 103px;
    left: 20px;
  }
  .c-quote::after {
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    background: var(--color-gray-5-1);
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
  }
  .has-aside .c-quote::after, .paragraph--zone-left .c-quote::after {
    right: 100%;
    left: inherit;
    transform: none;
  }
  .paragraph--zone-right .c-quote::after {
    transform: none;
  }
  .has-aside .paragraph--zone-right .c-quote::after {
    width: 100%;
    left: 0;
  }
  .paragraph--zone-center .c-quote::after {
    display: none;
  }
}
@media (max-width: 792px) {
  .c-quote__author {
    font-size: 1.3rem;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.paragraph .c-ressources {
  padding: 0;
}
.c-ressources__item {
  position: relative;
  list-style: none;
}
.c-ressources__link {
  min-width: inherit;
  width: 100%;
}
.c-ressources__link .o-link--more__text {
  flex: initial;
}
.c-ressources__link:hover .o-icon, .c-ressources__link:focus .o-icon {
  color: var(--o-link-hover-color);
}

.c-ressources--bordered .c-ressources__wrapper {
  background-color: var(--color-light);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1607843137);
  padding: 12px 24px 16px 16px;
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-decoration: none;
  position: relative;
}
@media (min-width: 792px) {
  .c-ressources--bordered .c-ressources__wrapper {
    flex-flow: row wrap;
    align-items: flex-end;
  }
}
.c-ressources--bordered .c-ressources__wrapper .o-link--more__text {
  flex: 1;
}
.c-ressources--bordered .c-ressources__wrapper:hover, .c-ressources--bordered .c-ressources__wrapper:focus {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2509803922);
  text-decoration: none;
}
.c-ressources--bordered .c-ressources__inner {
  display: flex;
  flex-direction: column;
  gap: var(--spacer-3) var(--spacer-4);
  flex: 1;
}
.c-ressources--bordered .c-ressources__inner .o-icon {
  width: 3rem;
}
@media (min-width: 792px) {
  .c-ressources--bordered .c-ressources__inner {
    flex-direction: row;
  }
  .c-ressources--bordered .c-ressources__inner .o-icon {
    width: 4.2rem;
  }
}
.c-ressources--bordered .c-ressources__details {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.c-ressources--bordered .c-ressources__name {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.3125;
  color: var(--color-dark);
}
@media (min-width: 792px) {
  .c-ressources--bordered .c-ressources__name {
    font-size: 1.6rem;
  }
}
.c-ressources--bordered .c-ressources__info {
  font-size: 1.1rem;
  color: var(--color-gray-3-1);
  font-style: italic;
}
@media (min-width: 792px) {
  .c-ressources--bordered .c-ressources__info {
    font-size: 1.5rem;
  }
}
.c-ressources--bordered .c-ressources__link {
  position: static;
  width: auto;
}
.c-ressources--bordered .c-ressources__link.link-relative {
  position: relative;
}
@media (min-width: 792px) {
  .c-ressources--bordered .c-ressources__link {
    min-width: 16rem;
  }
}
.c-ressources--bordered .c-ressources__actions {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}

.c-card--ressources {
  box-shadow: none;
  padding: 0;
  transition: none;
  display: flex;
  flex-direction: column;
  row-gap: var(--spacer-3);
}
@media (min-width: 792px) {
  .c-card--ressources {
    flex-flow: row wrap;
    align-items: center;
  }
}
.c-card--ressources:hover, .c-card--ressources:focus-within {
  box-shadow: none;
}
.c-card--ressources .c-card__body {
  font-size: 1.4rem;
  color: var(--color-dark);
}
@media (min-width: 792px) {
  .c-card--ressources .c-card__body {
    font-size: 1.6rem;
    width: 60%;
  }
}
.c-card--ressources .c-card__media {
  flex: 1;
}
.c-card--ressources .c-card__title {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--color-dark);
  margin-bottom: 0;
}
@media (min-width: 792px) {
  .c-card--ressources .c-card__title {
    font-size: 1.6rem;
  }
}
@media (min-width: 792px) {
  .c-card--ressources:has(.c-card__body) .c-ressources__wrapper {
    max-width: 20rem;
    margin: 0 auto;
  }
}
.c-card--ressources:has(.c-card__body) .c-ressources__inner {
  flex-direction: column;
  word-break: break-word;
}

.c-skip-links {
  z-index: 11;
}
.c-skip-links__link.o-link:focus-visible {
  outline: 1px dashed currentColor;
  outline-offset: 2px;
  transition: outline-offset 0.15s ease-in-out;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.o-tags {
  gap: 10px;
}
.o-tags__item {
  background: var(--color-primary);
  padding-block: 3px;
  padding-inline: 12px;
  text-transform: none;
  line-height: 1.5;
  letter-spacing: 0;
  font-size: 0.8rem;
  font-weight: 400;
}
.o-tags__item a {
  color: var(--color-light);
  text-decoration: none;
}
@media (min-width: 792px) {
  .o-tags__item {
    font-size: 1.3rem;
  }
}
.o-tags .is-link:hover, .o-tags .is-link:focus {
  background-color: var(--color-secondary) !important;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom {
  padding: 16px var(--spacer-8);
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-direction: column;
  box-sizing: border-box;
  background: var(--c-tac-bg-color);
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronDisclaimerAlert {
  display: block;
  font-size: 1.2rem;
  line-height: 1.42;
  font-family: var(--font-family-body) !important;
  padding-left: 0;
  padding-right: 0;
  text-align: center;
  color: var(--c-tac-text-color);
}
@media (min-width: 792px) {
  #tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronDisclaimerAlert {
    margin-bottom: 0;
    flex: 1;
    font-size: 1.4rem;
  }
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronDisclaimerAlert a {
  font-weight: 700;
  color: var(--color-secondary);
  text-decoration: underline;
  font-family: var(--font-family-body) !important;
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronDisclaimerAlert a:hover, #tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronDisclaimerAlert a:focus {
  text-decoration: none;
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronDisclaimerAlert b {
  color: var(--c-tac-text-color);
  font-family: var(--font-family-body) !important;
  font-weight: 700;
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseCross {
  display: none;
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom[style*="display: none"] {
  display: none !important;
}

#tarteaucitronRoot .tarteaucitronIconBottomRight {
  left: 0;
  right: auto;
}
#tarteaucitronRoot #tarteaucitronManager:focus-visible {
  outline: 2px solid var(--color-default) !important;
  outline-offset: -2px;
}

.tarteaucitronButtons {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--spacer-3);
  place-content: center;
}

#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom .tarteaucitronCTAButton,
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert,
#tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton {
  display: inline-flex;
  place-items: center;
  place-content: center;
  padding-block: 2px;
  padding-inline: 10px;
  font-size: 1rem !important;
  color: var(--color-light);
  font-family: var(--font-family-body) !important;
  border-radius: 4px;
  border: 0;
  background-color: var(--color-secondary);
  outline: 0;
  outline-offset: 2px !important;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease;
  margin: 0;
  width: auto;
  line-height: 1.5;
  text-transform: uppercase;
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom .tarteaucitronCTAButton:hover, #tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom .tarteaucitronCTAButton:focus,
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert:hover,
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert:focus,
#tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton:hover,
#tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton:focus {
  background-color: var(--color-secondary-dark);
  text-decoration: none;
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom .tarteaucitronCTAButton:focus-visible,
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert:focus-visible,
#tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton:focus-visible {
  outline: 2px solid var(--color-dark);
  outline-offset: 0;
  transition: outline-offset 0.15s ease-in-out;
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom .tarteaucitronCTAButton:active,
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert:active,
#tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton:active {
  text-decoration: none;
}
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom .tarteaucitronCTAButton .tarteaucitronCross,
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom .tarteaucitronCTAButton .tarteaucitronCheck,
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert .tarteaucitronCross,
#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert .tarteaucitronCheck,
#tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton .tarteaucitronCross,
#tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton .tarteaucitronCheck {
  display: none;
}

#tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert:hover, #tarteaucitronRoot #tarteaucitronAlertBig.tarteaucitronAlertBigBottom #tarteaucitronCloseAlert:focus {
  color: var(--c-tac-bg-color);
  background-size: 100% 100%;
}

#tarteaucitron #tarteaucitronServices {
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--color-secondary) var(--color-gray-1);
  scroll-behavior: smooth;
  scroll-padding: 0;
  background: var(--c-tac-bg-color);
  box-shadow: none;
  border-radius: 0;
  padding-right: 16px;
  margin-left: 16px;
  margin-right: 6px;
  margin-top: 40px !important;
}
#tarteaucitron #tarteaucitronServices::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}
#tarteaucitron #tarteaucitronServices::-webkit-scrollbar-thumb {
  background: var(--color-secondary);
}
#tarteaucitron #tarteaucitronServices::-webkit-scrollbar-track {
  background: var(--color-gray-1);
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices {
    margin-left: 0;
    margin-right: 0;
    margin-top: 21px !important;
    padding-right: 25px;
  }
}
#tarteaucitron #tarteaucitronServices::before {
  content: "";
  position: absolute;
  left: -64px;
  top: -32px;
  right: -32px;
  bottom: -32px;
  background-color: var(--c-tac-bg-color);
  z-index: -1;
}
@media (max-width: 791px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronBorder {
    margin-bottom: 16px;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronBorder,
#tarteaucitron #tarteaucitronServices .tarteaucitronBorder > ul > li,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine,
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle button,
#tarteaucitron #tarteaucitronServices #tarteaucitronSave {
  background-color: transparent !important;
  border: 0;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronH1 {
  font-family: var(--font-family-body);
  font-size: 3rem;
  line-height: 120%;
  margin: 0 0 16px;
  text-align: left;
  color: var(--c-tac-text-color);
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronH1 {
    font-size: 2.8rem;
    line-height: 131%;
  }
}
#tarteaucitron #tarteaucitronServices #tarteaucitronInfo {
  background-color: transparent;
  border: none;
  width: 100%;
  margin: 0 0 8px !important;
  max-width: 100% !important;
  text-align: left !important;
  padding: 0 !important;
  font-size: 1.2rem !important;
  line-height: 150%;
  font-family: var(--font-family-body-light);
  display: block !important;
  position: relative;
  color: var(--c-tac-text-color);
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices #tarteaucitronInfo {
    margin: 0 0 32px !important;
    font-size: 1.4rem !important;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine {
  padding: 0;
  border: 0 !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronH2 {
  margin: 0;
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronH2 {
    margin-top: 12px;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronBorder > ul > li {
  border-top: 1px solid var(--color-gray-3-1);
}
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle .heading {
  display: inline-block;
  font-weight: 700;
  text-align: left;
  width: auto;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle button,
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle .heading {
  font-size: 1.6rem !important;
  line-height: 150%;
  font-family: var(--font-family-body-bold);
  color: var(--c-tac-text-color) !important;
  padding: 0 !important;
  margin: 16px 0 8px !important;
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronTitle button,
  #tarteaucitron #tarteaucitronServices .tarteaucitronTitle .heading {
    font-size: 1.8rem !important;
    margin: 32px 0 8px !important;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle button .tarteaucitronPlus,
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle .heading .tarteaucitronPlus {
  display: none;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle + [id^=tarteaucitronDetails] {
  background-color: var(--color-gray-3-1) !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronH3 {
  font-size: 1.2rem !important;
  line-height: 150%;
  font-family: var(--font-family-body-light);
  font-weight: 700;
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronH3 {
    font-size: 1.4rem !important;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronReadmoreInfo,
#tarteaucitron #tarteaucitronServices .tarteaucitronReadmoreOfficial,
#tarteaucitron #tarteaucitronServices .tarteaucitronReadmoreSeparator {
  font-size: 1.2rem !important;
  line-height: 150%;
  font-family: var(--font-family-body);
  color: var(--c-tac-text-color) !important;
  font-weight: 400;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronReadmoreInfo,
#tarteaucitron #tarteaucitronServices .tarteaucitronReadmoreOfficial {
  text-decoration: underline;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine.tarteaucitronLine .tarteaucitronAsk,
#tarteaucitron #tarteaucitronServices .tarteaucitronBorder .tarteaucitronLine .tarteaucitronAsk {
  display: flex !important;
  align-items: center;
  margin: 8px 0 0 !important;
  gap: 12px;
  width: 100%;
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine.tarteaucitronLine .tarteaucitronAsk,
  #tarteaucitron #tarteaucitronServices .tarteaucitronBorder .tarteaucitronLine .tarteaucitronAsk {
    width: auto;
    margin: 0 !important;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine {
  padding: 0 !important;
  margin-bottom: 16px !important;
}
@media (max-width: 791px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronLine {
    width: 100%;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronListCookies:empty {
  display: none;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronName {
  margin: 0 !important;
  padding: 0 !important;
}
@media (max-width: 791px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronName {
    width: 100% !important;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny {
  display: inline-flex !important;
  width: auto !important;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border-radius: 32px;
  background: var(--color-secondary) !important;
  color: #EBF1F4;
  font-family: var(--font-family-body-bold);
  font-size: 1.4rem !important;
  font-weight: 400;
  line-height: 150%;
  opacity: 1 !important;
  margin: 0 !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow:hover, #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow:focus,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny:hover,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny:focus {
  background: var(--c-button-hover-bg-color) !important;
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow,
  #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny {
    font-size: 1.4rem !important;
    padding: 5px 10px;
  }
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow.tarteaucitronDeny,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny.tarteaucitronDeny {
  background: var(--color-fail) !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow.tarteaucitronDeny:hover, #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow.tarteaucitronDeny:focus,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny.tarteaucitronDeny:hover,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny.tarteaucitronDeny:focus {
  background-color: var(--color-warning) !important;
  border-color: var(--color-warning);
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow.tarteaucitronDeny[disabled=""],
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny.tarteaucitronDeny[disabled=""] {
  background: var(--color-warning) !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow[disabled=""],
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny[disabled=""] {
  background: var(--c-button-hover-bg-color) !important;
  cursor: default;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronAllow[disabled=""] .tarteaucitronCheck::before,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk.tarteaucitronAsk .tarteaucitronDeny[disabled=""] .tarteaucitronCheck::before {
  content: "" !important;
  background-color: var(--color-white);
  border-radius: 100%;
  width: 10px;
  height: 10px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#tarteaucitron #tarteaucitronServices .tarteaucitronCheck,
#tarteaucitron #tarteaucitronServices .tarteaucitronCross {
  background-color: transparent;
  border-radius: 100%;
  width: 20px;
  height: 20px;
  display: block;
  border: 1px solid white;
  position: relative;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronCheck::before,
#tarteaucitron #tarteaucitronServices .tarteaucitronCross::before {
  content: none !important;
}
#tarteaucitron #tarteaucitronServices [aria-pressed=true] .tarteaucitronCheck::before,
#tarteaucitron #tarteaucitronServices [aria-pressed=true] .tarteaucitronCross::before {
  content: "" !important;
  background-color: var(--color-white);
  border-radius: 100%;
  width: 10px;
  height: 10px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#tarteaucitron #tarteaucitronServices #tarteaucitronSave {
  padding: 0 0 16px;
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices #tarteaucitronSave {
    padding: 0;
  }
}
#tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton {
  margin: 8px auto 16px;
  box-sizing: border-box;
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronServices #tarteaucitronSaveButton {
    margin: 16px auto;
  }
}

#tarteaucitron #tarteaucitronClosePanel {
  top: 5px;
  right: 16px !important;
  background-color: transparent !important;
  display: inline-block !important;
  text-align: right !important;
  font-size: 0 !important;
}
@media (min-width: 792px) {
  #tarteaucitron #tarteaucitronClosePanel {
    top: -15px;
    right: 0 !important;
  }
}
#tarteaucitron #tarteaucitronClosePanel::before {
  font-size: 16px;
  font-family: var(--font-family-icons);
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e803";
  color: var(--c-tac-text-color);
}

#tarteaucitronRoot a:focus-visible,
#tarteaucitronRoot button:focus-visible {
  outline: 1px solid var(--color-white) !important;
  outline-offset: 2px;
}

@media (max-width: 791px) {
  html body #tarteaucitronRoot #tarteaucitron .tarteaucitronBorder ul li.tarteaucitronLine {
    padding: 0 !important;
  }
}
html body #tarteaucitronRoot #tarteaucitron .tarteaucitronLine .tarteaucitronName > * {
  color: var(--c-tac-text-color) !important;
  width: auto !important;
}
@media (max-width: 791px) {
  html body #tarteaucitronRoot #tarteaucitron .tarteaucitronLine .tarteaucitronName {
    margin-bottom: 0 !important;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-video__caption {
  display: flex;
  row-gap: 8px;
  column-gap: var(--spacer-4);
  flex-direction: column;
  line-height: 1.5;
  flex: 1;
}
@media (min-width: 792px) {
  .c-video__caption {
    place-items: center;
  }
}
.c-video__caption-group {
  row-gap: 8px;
}
@media (max-width: 791px) {
  .c-video__caption-group {
    place-items: flex-start;
  }
}
@media (min-width: 792px) {
  .c-video__caption {
    flex-direction: row;
  }
}
.c-video__play-btn {
  z-index: 1;
}
.c-video__play-btn:focus-visible {
  outline: 2px solid var(--color-default);
  outline-offset: -2px;
}
.c-video__play-icon {
  width: var(--c-video-button-icon-size);
  height: var(--c-video-button-icon-size);
  background: var(--c-video-button-bg-color);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.c-video iframe {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: auto;
  margin: 0 auto;
  aspect-ratio: var(--c-video-media-aspect-ratio);
  border: 0;
}
.c-video__media--inactive iframe {
  display: none;
}
.c-video .tac_activate {
  background: rgba(51, 51, 51, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  aspect-ratio: var(--c-video-media-aspect-ratio);
  border: 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}
.c-video .tac_float {
  font-size: 1.4rem;
}
@media (min-width: 792px) {
  .c-video .tac_float {
    font-size: 1.6rem;
  }
}
.c-video .thumbnail {
  display: none;
}
.c-video :has(.tac_activate) .thumbnail {
  display: block;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-widget {
  position: relative;
}
.c-widget > div {
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  border: 0;
  border-radius: var(--c-video-media-border-radius);
  overflow: hidden;
  aspect-ratio: var(--c-video-media-aspect-ratio);
  width: 100% !important;
  height: 100% !important;
}
.c-widget .tac_activate {
  background: rgba(51, 51, 51, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  aspect-ratio: var(--c-video-media-aspect-ratio);
  border: 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  border-radius: var(--c-video-media-border-radius);
}
.c-widget .tac_float {
  font-size: 1.4rem;
}
@media (min-width: 792px) {
  .c-widget .tac_float {
    font-size: 1.6rem;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.paragraph--zone-25 {
  grid-column: 1/4;
}
.paragraph--zone-25.paragraph--zone-center-left {
  grid-column: 4/7;
}
.paragraph--zone-25.paragraph--zone-center-right {
  grid-column: 7/10;
}
.paragraph--zone-25.paragraph--zone-right {
  grid-column: 10/13;
}
.paragraph--zone-33 {
  grid-column: 1/5;
}
.paragraph--zone-33.paragraph--zone-center {
  grid-column: 5/9;
}
.paragraph--zone-33.paragraph--zone-right {
  grid-column: 9/13;
}
.paragraph--zone-50 {
  grid-column: 1/7;
}
.paragraph--zone-50.paragraph--zone-right {
  grid-column: 7/13;
}
.paragraph--zone-66 {
  grid-column: 1/9;
}
.paragraph--zone-66.paragraph--zone-right {
  grid-column: 5/13;
}
.paragraph--zone-75 {
  grid-column: 1/10;
}
.paragraph--zone-75.paragraph--zone-right {
  grid-column: 4/13;
}
.paragraph--zone-100 {
  grid-column: 1/13;
}
@media (max-width: 791px) {
  .paragraph[class*=paragraph--zone-] {
    grid-column: 1/13;
  }
}
.paragraph[class*=paragraph--zone-] [class*=c-figure--image-] {
  width: 100%;
  max-width: inherit !important;
}

.shariff {
  color: var(--color-gray-3-1);
}
.shariff .button-style-standard {
  flex-direction: column;
  row-gap: 4px;
}
.shariff .shariff-button {
  min-width: auto !important;
  width: auto !important;
  margin: 0 !important;
  height: auto;
  line-height: 0;
  /*
  * L'icone ne rend pas bien en FO, conserver l'icone de font awesome
  */
  /*.fa-print {
    background: none;
    color: var(--color-gray-3-1);
    &::before {
      font-family: var(--font-family-icons);
      content: map.get($icons, 'print');
    }
  }*/
}
.shariff .shariff-button:focus-within {
  overflow: visible;
}
.shariff .shariff-button a {
  height: auto;
  display: inline-flex;
  align-items: center;
  background: none !important;
  padding: 0;
  color: inherit;
  font-size: 8px;
}
.shariff .shariff-button .fab,
.shariff .shariff-button .fas {
  width: 12px;
  height: 12px;
  background: var(--color-gray-3-1);
  border-radius: 3px;
  color: var(--color-light);
  font-size: 7px;
  line-height: 12px;
}
@media (min-width: 792px) {
  .shariff .shariff-button .fab,
  .shariff .shariff-button .fas {
    width: 16px;
    height: 16px;
    font-size: 10px;
    line-height: 16px;
  }
}
.shariff .shariff-button .share_text {
  font-size: inherit;
  font-family: var(--font-family-body);
  line-height: 1.4;
  text-indent: 0 !important;
}
@media (min-width: 792px) {
  .shariff .button-style-standard {
    flex-direction: row;
    flex-wrap: nowrap;
    column-gap: 20px;
  }
  .shariff .shariff-button a {
    font-size: 12px;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
/* ===================================================================
 * FORMS
 * ================================================================= */
/*
 *  Placeholder :
 *  A utiliser sur une champ input, ex: "c-form__item"
 *  => $color:          couleur du texte
 *  => $fontWeight:     poids de la police
 */
/*
 *   Checkbox :
 *   => $checkboxMarginTop:         alignement de la case avec le libellé
 *   => $checkboxSize:              largeur et hauteur de la case
 *   => $checkboxBorderColor:       couleur de bordure de la case
 *   => $checkboxBgColor:           couleur de fond de la case
 *   => $checkboxInnerSize:         largeur et hauteur de la coche
 *   => $checkboxInnerBorderColor:  couleur de bordure de la case coché
 *   => $checkboxInnerBgColor:      couleur de fond de la case coché
 *   => $checkboxDisabledColor:     couleur de désactivé de la case
 */
/*
 *   Radio button :
 *   => $radioMarginTop:        alignement du bouton radio avec le libellé
 *   => $radioSize:             largeur et hauteur du bouton radio
 *   => $radioBorderColor:      couleur de bordure du bouton radio
 *   => $radioBgColor:          couleur de fond du bouton radio
 *   => $radioInnerSize:        largeur et hauteur de la coche
 *   => $radioInnerBorderColor: couleur de bordure du bouton radio coché
 *   => $radioInnerBgColor:     couleur de fond du bouton radio coché
 *   => $radioDisabledColor:    couleur de désactivé du bouton radio
 */
/*
 *   Custom select :
 *   => $arrow:   nom du fichier image
 *   => $taille:  width du background en pixels permettant de calculer le padding-right
 *   => $right:   espacement de l'image par rapport au bord droit
 */
.container-fluid {
  padding-right: calc(32px / 2);
  padding-left: calc(32px / 2);
  width: 100%;
}
.container-fluid :where(.container) {
  padding: 0;
}

.container {
  margin-left: auto;
  margin-right: auto;
  padding-right: calc(32px / 2);
  padding-left: calc(32px / 2);
  width: 100%;
}
@media (min-width: 1024px) {
  .container {
    max-width: 1116px;
  }
}
@media (min-width: 1459px) {
  .container {
    max-width: 1172px;
  }
}
@media (min-width: 1759px) {
  .container {
    max-width: 1450px;
  }
}
.container :where(.container) {
  padding: 0;
}

.container-grid {
  display: grid;
  grid-template-columns: 1fr repeat(12, minmax(21.3333333333px, 74.6666666667px)) 1fr;
  gap: 0 32px;
  width: 100%;
}
.container-grid > * {
  display: block;
  grid-column: 3/13;
}
.container-grid .full-bleed {
  grid-column: 1/15;
  width: 100%;
}
.container-grid :where(.container) {
  padding: 0;
}
@media (max-width: 1023px) {
  .container-grid {
    display: flex;
    flex-direction: column;
  }
  .container-grid > :not(.full-bleed) {
    padding-inline: calc(32px / 2);
  }
}

.has-column-left .container-grid__left {
  grid-row: 1/100;
  grid-column: 3/6;
}
.has-column-left > * {
  display: block;
  grid-column: 6/13;
}

.has-column-right .container-grid__right {
  grid-row: 1/100;
  grid-column: 10/13;
}
.has-column-right > * {
  display: block;
  grid-column: 3/10;
}

.layout-container {
  overflow-x: unset;
}

body {
  overflow-x: hidden;
  /*//from 1418px to 1023 : main is 80% of the page
  @media (min-width: $tablet) and (max-width: $desktop-x - $grid-gutter-width) {
    &:not(.path-frontpage) main {
      width: 80%;
      margin: 0 auto;
    }

    &.path-frontpage main .container {
      width: 80%;
      margin: 0 auto;
    }
  }*/
}

div[data-drupal-messages] .messages__wrapper {
  margin: 15px 0;
}

p {
  margin-bottom: var(--spacer-4);
  line-height: 1.4;
}

.c-figure__caption-group {
  line-height: var(--c-figure-caption-line-height);
}
.c-figure__legend {
  display: inline-block;
}

.s-home {
  margin-top: 0;
}
.s-home > .container-fluid {
  margin-right: 0;
  margin-left: 0;
  padding-right: 0;
  padding-left: 0;
}

.accueil-general-wrapper {
  margin-bottom: 17px;
}
@media (min-width: 792px) {
  .accueil-general-wrapper {
    margin-bottom: 30px;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
/* VIEWS */
.view-container {
  padding-block: var(--spacer-6);
}
.view-container .c-pager {
  margin-top: var(--spacer-8);
  margin-bottom: var(--spacer-8);
  display: flex;
}
.view-content--grid {
  gap: var(--spacer-8);
}
.view-content--grid .c-card {
  height: 100%;
}
@media (min-width: 792px) {
  .view-actualites .view-content--grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .view-actualites .view-content--grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.view-content--grid img {
  border-radius: 0;
}
.view-recherche .view-filters {
  margin-bottom: var(--spacer-7);
}
.view-recherche .views-exposed-form {
  width: fit-content;
}
.view-recherche .views-exposed-form > .c-form__label:first-of-type,
.view-recherche .views-exposed-form > .c-form__item:first-of-type {
  display: none;
}
.view-recherche .item-list ul {
  padding-left: 0;
  list-style-type: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (min-width: 792px) {
  .view-recherche .item-list ul {
    gap: 24px;
  }
}
.view-recherche .c-card {
  padding-block: 0;
  flex-flow: row;
  gap: var(--spacer-2);
  justify-content: start;
  box-shadow: none;
  padding: 0;
}
.view-recherche .c-card:hover, .view-recherche .c-card:focus-within {
  background-color: transparent;
  color: inherit;
}
.view-recherche .c-card:hover .c-card__link, .view-recherche .c-card:focus-within .c-card__link {
  color: inherit;
}
.view-recherche .c-card:hover > .o-icon, .view-recherche .c-card:focus-within > .o-icon {
  transform: translateX(2px);
}
.view-recherche .c-card > .o-icon {
  padding-top: 0.1rem;
  color: var(--color-primary);
  transition: transform 0.3s ease;
}
@media (min-width: 792px) {
  .view-recherche .c-card > .o-icon {
    padding-top: 0.5rem;
  }
}
.view-recherche .c-card .c-card__header {
  order: 0;
  margin-bottom: 0;
  font-size: 1rem;
  color: var(--color-secondary);
  text-decoration: underline;
}
@media (min-width: 792px) {
  .view-recherche .c-card .c-card__header {
    font-size: 1.5rem;
  }
}
.view-recherche .c-card .c-card__title {
  display: flex;
  color: var(--color-primary);
  font-family: var(--font-family-body);
  font-size: 1.4rem;
  font-weight: 600;
  letter-spacing: 0;
}
@media (min-width: 792px) {
  .view-recherche .c-card .c-card__title {
    font-size: 2rem;
  }
}
.view-recherche .c-card .c-card__body {
  gap: 0;
}
.view-recherche .c-card .c-card__description {
  font-size: 1rem;
  color: #6B797F;
}
@media (min-width: 792px) {
  .view-recherche .c-card .c-card__description {
    font-size: 1.5rem;
  }
}
.view-recherche .o-tags__item--outline {
  border: none;
  color: var(--color-secondary);
  padding: 0;
  text-decoration: underline;
  text-transform: none;
  font-weight: 500;
  letter-spacing: 0;
  font-size: 1rem;
}
@media (min-width: 792px) {
  .view-recherche .o-tags__item--outline {
    font-size: 1.5rem;
  }
}

.views-infinite-scroll-content-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--spacer-8);
}

.node--view-mode-full > .row {
  place-content: center;
}
@media (min-width: 1024px) and (max-width: 1418px) {
  .node--view-mode-full > .row:not(.has-aside) > [class*=col-] {
    max-width: 100%;
    width: 95.2rem;
  }
}
.node--view-mode-full > .has-aside {
  place-content: space-between;
  row-gap: 30px;
}
@media (min-width: 1024px) {
  .node--view-mode-full > .has-aside {
    flex-flow: nowrap;
  }
}

.node__wrapper {
  display: block;
  max-width: 920px;
  margin: auto;
}
.has-aside .node__wrapper {
  margin-left: 0;
}
@media (max-width: 791px) {
  .node__content {
    display: flex;
    flex-direction: column;
    word-wrap: break-word;
    hyphens: auto;
  }
}
.node__aside {
  max-width: 430px;
  margin: auto;
  display: flex;
  flex-direction: column;
  row-gap: var(--paragraph-mb);
}
@media (min-width: 1024px) {
  .node__aside {
    margin-right: 0;
  }
}
@media (min-width: 1024px) {
  .node__aside-wrapper {
    width: 430px;
    box-sizing: content-box;
  }
}
.node--type-page-editoriale {
  padding-block: 0;
}
.node--type-actualite .node__content {
  margin-bottom: var(--paragraph-mb);
}

.s-banner--node {
  padding: 7px 0;
  flex-direction: revert;
  place-content: space-between;
  place-items: flex-start;
}
.s-banner--node .s-breadcrumb {
  margin: 0;
}
.s-banner--node .c-breadcrumb {
  padding: 0;
}
@media (min-width: 792px) {
  .s-banner--node {
    padding-top: 20px;
  }
}

.node__heading {
  margin: 0 auto 13px;
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
@media (min-width: 792px) {
  .node__heading {
    margin-bottom: 18px;
    row-gap: 7px;
  }
}

.node__title {
  margin: 0;
  font-size: 28px;
  line-height: 32px;
}
@media (min-width: 792px) {
  .node__title {
    font-size: 50px;
    line-height: 60px;
  }
}

@media (min-width: 792px) {
  .node__tags .o-tags__item {
    font-size: 1.7rem;
    line-height: 1.1;
  }
}

.node__dates {
  position: relative;
  padding-bottom: 10px;
  display: flex;
  column-gap: 3px;
  place-items: center;
  color: var(--color-gray-3-1);
  font-size: 11px;
  line-height: 18px;
}
.node__dates::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  width: 25px;
  display: block;
  background: var(--color-secondary);
  border-radius: 4px;
}
.node__dates .o-icon {
  font-size: 10px;
}
@media (min-width: 792px) {
  .node__dates {
    padding-bottom: 21px;
    column-gap: 11px;
    font-size: 15px;
  }
  .node__dates::after {
    height: 7px;
    width: 38px;
  }
  .node__dates .o-icon {
    font-size: 17px;
  }
}

.node__image {
  margin-bottom: 15px;
  text-align: left;
}
.node__image img {
  border-radius: var(--c-figure-border-radius);
}
.node__image .c-figure__caption-group {
  line-height: var(--c-figure-caption-line-height);
}
.node__image .c-figure__legend {
  display: inline-block;
}
@media (min-width: 792px) {
  .node__image {
    margin-bottom: 18px;
  }
}

.node__intro {
  margin-bottom: var(--paragraph-mb);
  color: var(--color-secondary);
  font-size: 14px;
  line-height: 20;
  font-weight: 700;
}
@media (min-width: 792px) {
  .node__intro {
    font-size: 18px;
    line-height: 25px;
  }
}

.s-sitemap {
  padding: 0;
}
.s-sitemap h2,
.s-sitemap h3 {
  display: flex;
  align-items: center;
  margin: 0;
  font-size: inherit;
  line-height: normal;
}
.s-sitemap__list--level-2, .s-sitemap__list--level-3 {
  margin-block: 16px;
  padding-left: 16px;
}
.s-sitemap__item--level-1 {
  margin-bottom: 16px;
}
.s-sitemap__link {
  color: var(--color-default);
}
.s-sitemap__link--level-1 {
  margin-bottom: 0;
  padding: 0;
  border: 0;
}
.s-sitemap__link--level-2 {
  margin-bottom: 0;
  padding: 0;
  border: 0;
  font-weight: 600;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-table, .paragraph table {
  width: 100%;
  border-bottom: 2px solid var(--c-table-border-color);
}
.c-table th, .paragraph table th, .c-table td, .paragraph table td {
  padding: 16px;
}
.c-table thead th, .paragraph table thead th {
  background: var(--c-table-header-bgd-color);
  color: var(--c-table-header-color);
  font-weight: 700;
  text-align: left;
  vertical-align: bottom;
}
.c-table--centered {
  text-align: center;
}
.c-table--centered thead th {
  text-align: center;
}
.c-table--bordered thead th, .paragraph table thead th {
  border-top: 0;
  border-bottom: 0;
}
.c-table--bordered thead th:first-child, .paragraph table thead th:first-child {
  border-left: 0;
}
.c-table--bordered thead th:last-child, .paragraph table thead th:last-child {
  border-right: 0;
}
.c-table--bordered th, .paragraph table th, .c-table--bordered td, .paragraph table td {
  border: 2px solid var(--c-table-border-color);
}
.c-table--striped tbody tr:nth-child(even) > * {
  background: var(--c-table-strip-color);
}
.c-table--striped.c-table--bordered th, .paragraph table.c-table--striped th, .c-table--striped.c-table--bordered td, .paragraph table.c-table--striped td {
  border-color: var(--c-table-cell-border-color);
}
.c-table--striped.c-table--bordered tbody tr:last-child > *, .paragraph table.c-table--striped tbody tr:last-child > * {
  border-bottom-color: var(--c-table-border-color);
}
.c-table--striped-col tbody td:nth-child(even) {
  background: var(--c-table-strip-color);
}
.c-table--striped-col.c-table--bordered th, .paragraph table.c-table--striped-col th, .c-table--striped-col.c-table--bordered td, .paragraph table.c-table--striped-col td {
  border-color: var(--c-table-cell-border-color);
}
.c-table--striped-col.c-table--bordered tbody tr:last-child > *, .paragraph table.c-table--striped-col tbody tr:last-child > * {
  border-bottom-color: var(--c-table-border-color);
}
.c-table--equal-width {
  table-layout: fixed;
}

@media (max-width: 1024px) {
  .table-responsive {
    overflow-x: auto;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: #CDCDCD #F0F0F0;
    scroll-behavior: smooth;
    scroll-padding: 0;
  }
  .table-responsive::-webkit-scrollbar {
    width: 9px;
    height: 9px;
  }
  .table-responsive::-webkit-scrollbar-thumb {
    background: #CDCDCD;
  }
  .table-responsive::-webkit-scrollbar-track {
    background: #F0F0F0;
  }
  .table-responsive .c-table, .table-responsive .paragraph table, .paragraph .table-responsive table {
    width: calc(100% - 1px);
  }
  .table-responsive td {
    min-width: 200px;
  }
  .c-table--equal-width {
    table-layout: auto;
  }
}
.paragraph {
  color: var(--color-dark);
}
.paragraph a:not(.c-button):not(.c-ressources__link):not(.o-link--no-decoration) {
  color: var(--color-secondary);
}
.paragraph a:not(.c-button):not(.c-ressources__link):not(.o-link--no-decoration)[target=_blank]::after {
  font-family: var(--font-family-icons);
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e815";
  display: inline-flex;
  margin-left: 4px;
}
.paragraph ul, .paragraph ol {
  margin-bottom: var(--spacer-4);
  margin-top: 0;
  padding: 0 0 0 0.8em;
}
.paragraph ul li::marker, .paragraph ol li::marker {
  font-size: 0.75em;
}
.paragraph table {
  border: 0;
}
.paragraph table:not(:last-child) {
  margin-bottom: var(--spacer-4);
}
.paragraph table th, .paragraph table td {
  border-width: 1px;
}
.paragraph table th {
  border-color: var(--color-gray-5-1);
}
.paragraph table thead th:last-child {
  border-right: 1px solid var(--c-table-header-bgd-color);
}
.paragraph table td {
  vertical-align: top;
}
.paragraph table td :last-child {
  margin: 0;
}
.paragraph hr {
  margin-block: var(--spacer-5);
}
.paragraph .align-left {
  margin-top: 0;
  margin-left: 0;
  margin-right: var(--spacer-4);
  margin-bottom: var(--spacer-4);
}
.paragraph .align-right {
  margin-top: 0;
  margin-right: 0;
  margin-left: var(--spacer-4);
  margin-bottom: var(--spacer-4);
  text-align: right;
}
.paragraph .align-center {
  text-align: center;
}
.paragraph .align-center img {
  margin: 0 auto;
}
.paragraph .align-center figcaption {
  text-align: center;
}
@media (max-width: 1024px) {
  .paragraph .align-left,
  .paragraph .align-right {
    max-width: none;
    text-align: left;
  }
}

.node__content h2, .node__content h3, .node__content h4, .node__content h5, .node__content h6 {
  font-family: var(--font-family-body);
  font-weight: 700;
}
.node__content h2 {
  position: relative;
  padding-bottom: 15px;
  color: var(--color-primary);
  font-size: 2rem;
  line-height: 2.8rem;
}
.node__content h2::after {
  content: "";
  height: 4px;
  width: 25px;
  position: absolute;
  left: 0;
  bottom: 0;
  border-radius: 4px;
  background: currentColor;
}
@media (min-width: 792px) {
  .node__content h2 {
    font-size: 3rem;
    line-height: 4rem;
  }
  .node__content h2::after {
    height: 7px;
    width: 38px;
  }
}
.node__content h3 {
  font-size: 1.6rem;
  line-height: 2.5rem;
}
@media (min-width: 792px) {
  .node__content h3 {
    font-size: 2.2rem;
    line-height: 1;
  }
}
.node__content h4, .node__content h5, .node__content h6 {
  font-size: 1.4rem;
  line-height: 1.2;
}
@media (min-width: 792px) {
  .node__content h4, .node__content h5, .node__content h6 {
    font-size: 1.8rem;
    line-height: 1;
  }
}

.paragraph[class*="--type--titre-"] {
  margin-bottom: var(--paragraph-mb);
}
.paragraph[class*="--type--titre-"] > :last-child {
  margin: 0;
}

.paragraph--type--texte-encadre {
  padding: 16px;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
  background: var(--color-gray-5-1);
}
.paragraph--type--texte-encadre h2 {
  margin: 0;
  color: var(--color-secondary);
}
.paragraph--type--texte-encadre .field--name-field-rich-text {
  font-weight: 700;
}
.paragraph--type--texte-encadre .field--name-field-rich-text > :last-child {
  margin-bottom: 0;
}
.paragraph--type--texte-encadre .c-button {
  width: fit-content;
}
@media (min-width: 792px) {
  .paragraph--type--texte-encadre {
    padding: 30px;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-table, .paragraph table {
  width: 100%;
  border-bottom: 2px solid var(--c-table-border-color);
}
.c-table th, .paragraph table th, .c-table td, .paragraph table td {
  padding: 16px;
}
.c-table thead th, .paragraph table thead th {
  background: var(--c-table-header-bgd-color);
  color: var(--c-table-header-color);
  font-weight: 700;
  text-align: left;
  vertical-align: bottom;
}
.c-table--centered {
  text-align: center;
}
.c-table--centered thead th {
  text-align: center;
}
.c-table--bordered thead th, .paragraph table thead th {
  border-top: 0;
  border-bottom: 0;
}
.c-table--bordered thead th:first-child, .paragraph table thead th:first-child {
  border-left: 0;
}
.c-table--bordered thead th:last-child, .paragraph table thead th:last-child {
  border-right: 0;
}
.c-table--bordered th, .paragraph table th, .c-table--bordered td, .paragraph table td {
  border: 2px solid var(--c-table-border-color);
}
.c-table--striped tbody tr:nth-child(even) > * {
  background: var(--c-table-strip-color);
}
.c-table--striped.c-table--bordered th, .paragraph table.c-table--striped th, .c-table--striped.c-table--bordered td, .paragraph table.c-table--striped td {
  border-color: var(--c-table-cell-border-color);
}
.c-table--striped.c-table--bordered tbody tr:last-child > *, .paragraph table.c-table--striped tbody tr:last-child > * {
  border-bottom-color: var(--c-table-border-color);
}
.c-table--striped-col tbody td:nth-child(even) {
  background: var(--c-table-strip-color);
}
.c-table--striped-col.c-table--bordered th, .paragraph table.c-table--striped-col th, .c-table--striped-col.c-table--bordered td, .paragraph table.c-table--striped-col td {
  border-color: var(--c-table-cell-border-color);
}
.c-table--striped-col.c-table--bordered tbody tr:last-child > *, .paragraph table.c-table--striped-col tbody tr:last-child > * {
  border-bottom-color: var(--c-table-border-color);
}
.c-table--equal-width {
  table-layout: fixed;
}

@media (max-width: 1024px) {
  .table-responsive {
    overflow-x: auto;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: #CDCDCD #F0F0F0;
    scroll-behavior: smooth;
    scroll-padding: 0;
  }
  .table-responsive::-webkit-scrollbar {
    width: 9px;
    height: 9px;
  }
  .table-responsive::-webkit-scrollbar-thumb {
    background: #CDCDCD;
  }
  .table-responsive::-webkit-scrollbar-track {
    background: #F0F0F0;
  }
  .table-responsive .c-table, .table-responsive .paragraph table, .paragraph .table-responsive table {
    width: calc(100% - 1px);
  }
  .table-responsive td {
    min-width: 200px;
  }
  .c-table--equal-width {
    table-layout: auto;
  }
}
.c-form__legend {
  font-size: 1.6rem;
  line-height: 2.5rem;
}
@media (min-width: 792px) {
  .c-form__legend {
    font-size: 2.2rem;
    line-height: 1;
  }
}
.c-form__alert--information {
  border-radius: 0;
}
.c-form__item:focus {
  font-weight: 400;
}
.c-form__item:focus::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  opacity: 1; /* Firefox */
  color: var(--c-form-color);
  font-weight: 400;
}

.form-managed-file {
  display: flex;
  flex-direction: column;
  row-gap: var(--spacer-4);
  align-items: flex-start;
}
.form-managed-file .c-ressources__wrapper {
  width: 100%;
}

.webform-submission-form {
  max-width: 1450px;
  margin-left: auto;
  margin-right: auto;
}
.webform-submission-form .c-form__legend {
  font-size: 1.6rem;
  line-height: 2.5rem;
}
@media (min-width: 792px) {
  .webform-submission-form .c-form__legend {
    font-size: 2.2rem;
    line-height: 1;
  }
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.view-container--ressources {
  display: flex;
  flex-direction: column;
}
.view-container--ressources__list {
  display: flex;
  flex-direction: column;
  row-gap: var(--paragraph-mb);
}

.c-list-ressources {
  row-gap: var(--paragraph-mb);
}
.c-list-ressources__item,
.c-list-ressources .c-accordion__content {
  display: flex;
  flex-direction: column;
  row-gap: var(--paragraph-mb);
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.c-block--related {
  padding-inline: 23px;
}
.c-block--related .c-block__title {
  padding-left: 21px;
}
.c-block--related .views-row + .views-row {
  margin-top: 25px;
}
.c-block--related .c-block__footer {
  text-align: center;
}

.c-card--news {
  padding: 15px 47px 15px 11px;
  flex-direction: row-reverse;
  column-gap: 16px;
  background: var(--color-light);
  box-shadow: none;
}
.c-card--news::before {
  position: absolute;
  inset: 0;
  background: var(--color-primary);
  opacity: 0.85;
}
.c-card--news .c-card__title {
  max-width: 100%;
}
.c-card--news .c-card__media {
  min-width: 100px;
  max-width: 100px;
}
.c-card--news .c-card__image {
  border-radius: 0;
}
.c-card--news .c-card__body {
  flex: 1;
  place-content: center;
  overflow: hidden;
}
.c-card--news .c-card__link {
  color: var(--color-dark);
  font-size: 1.4rem;
  line-height: 1.7rem;
  display: block;
  word-wrap: break-word;
  hyphens: auto;
}
.c-card--news .c-card__link:hover, .c-card--news .c-card__link:focus {
  color: var(--color-light);
  outline: none;
}
.c-card--news .c-card__icon {
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: inline-flex;
  place-content: center;
  place-items: center;
  position: absolute;
  bottom: 10px;
  right: 10px;
  background-color: var(--color-primary);
  color: var(--color-light);
  font-size: 2.7rem;
  transition: transform 0.3s ease;
}
.c-card--news:hover, .c-card--news:focus-within {
  box-shadow: none;
}
.c-card--news:hover::before, .c-card--news:focus-within::before {
  content: "";
}
.c-card--news:hover .c-card__icon, .c-card--news:focus-within .c-card__icon {
  background-color: var(--color-light);
  color: var(--color-primary);
  transform: scale(1.1);
}
.c-card--news:hover .c-card__title, .c-card--news:focus-within .c-card__title {
  position: static;
  z-index: 2;
}
@media (min-width: 1418px) {
  .c-card--news {
    padding: 20px 60px 20px 14px;
    column-gap: 21px;
  }
  .c-card--news .c-card__link {
    font-size: 1.8rem;
    line-height: 2.3rem;
  }
  .c-card--news .c-card__media {
    min-width: 135px;
    max-width: 135px;
  }
  .c-card--news .c-card__icon {
    height: 40px;
    width: 40px;
    bottom: 14px;
    right: 14px;
    font-size: 3.8rem;
  }
}

.view-projets .views-infinite-scroll-content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
@media (min-width: 792px) {
  .c-accordion--support-offer .view-content {
    display: grid;
    flex-flow: row wrap;
    column-gap: 42px;
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .c-accordion--support-offer .view-content {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.c-accordion--support-offer .c-accordion__content[aria-hidden=false] {
  max-height: inherit;
}
.c-accordion--support-offer .c-card {
  height: 100%;
}

/*
 *   IMAGE DECLARATION
 *   => @a : image file name
 *   => @b : background color, repeat...
 *   Example :
 *       .backgroundImage('bullet.png', no-repeat 0 0 #fff);
 */
/**
 * GRADIENT
 */
/**
 * CLEARFIX
 */
/**
 * SVG
 */
/**
 * Génération des colonnes
 */
/**
 * Génère une classe utilitaire avec ses suffixes responsive (issue de 1_settings/breakpoints)
 * @mixin
 * @param {string} $className - Le nom de la classe
 * @param {string} $property - La propriété CSS (exemple: "text-align")
 * @param {string} $property - La valeur de la propriété CSS entière (exemple: "right")
 *
 * @example
 * .u-text-right {
       text-align: right;

        &\@xs {
            @media (min-width: $smallmobile) {
                text-align: right;
            }
        }
        [...]
    }
 */
/**
 * Taille d'un element en cercle
 */
/**
 * 3 tailles de box shadow par défaut (large, medium & small)
 */
/**
 * Scrollbar style
 */
/**
 * Font icon
 */
/**
 * Assistive technology only (sr-only)
 */
/*
 * Calcul la taille d'une colonne dans un contexte CSS Gap
 * Permet d'avoir la taille exact d'une colonne séparée par la gouttière spécifiée.
 * @param  {$nbCols}   int      Nombre de colonnes
 * @param  {$gutter}   int      Gouttière (En px)
 */
.ui-widget.ui-widget-content {
  font-family: var(--font-family-body);
  font-size: 1.4rem;
  max-width: calc(100vw - 48px);
}
@media (min-width: 1024px) {
  .ui-widget.ui-widget-content {
    max-width: 77rem;
  }
}
.ui-widget.ui-widget-content .search-api-autocomplete-suggestion {
  padding: 6px 12px;
}
.ui-widget.ui-widget-content .ui-state-active,
.ui-widget.ui-widget-content .ui-state-focus {
  border: 0;
  margin: 0;
  color: var(--color-white);
}
.ui-widget.ui-widget-content .ui-state-active .ui-menu-item-wrapper,
.ui-widget.ui-widget-content .ui-state-focus .ui-menu-item-wrapper {
  color: var(--color-white);
}
.ui-widget.ui-widget-content .ui-state-active .search-api-autocomplete-suggestion,
.ui-widget.ui-widget-content .ui-state-focus .search-api-autocomplete-suggestion {
  background: var(--color-primary) !important;
}

.c-home--big-cta {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  aspect-ratio: 1450/243;
  max-height: 243px;
  height: 100%;
}
.c-home--big-cta__title {
  text-align: left;
  font-family: var(--font-family-body);
  font-weight: 700;
  font-size: 55px;
  line-height: 1;
  letter-spacing: 0;
  color: #FFFFFF;
  text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3607843137);
  max-width: 50%;
  padding: 10px 10px 10px 30px;
  margin: 0;
  display: flex;
  align-items: center;
}
@media (max-width: 1449px) {
  .c-home--big-cta__title {
    font-size: 48px;
  }
}
@media (max-width: 1023px) {
  .c-home--big-cta__title {
    font-size: 40px;
    max-width: 65%;
  }
}
@media (max-width: 791px) {
  .c-home--big-cta__title {
    font-size: 18px;
    padding-left: 10px;
  }
}
.c-home--big-cta__img {
  width: 100%;
  z-index: -1;
  position: absolute;
  height: 100%;
  object-fit: cover;
}
.c-home--big-cta__link {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  margin-right: 30px;
  color: transparent;
}
.c-home--big-cta__link .o-icon {
  font-size: 7.1rem;
  color: var(--color-light);
  transition: transform 0.3s ease;
}
@media (max-width: 1023px) {
  .c-home--big-cta__link .o-icon {
    font-size: 31px;
  }
}
@media (max-width: 791px) {
  .c-home--big-cta__link {
    margin-right: 10px;
  }
  .c-home--big-cta__link .o-icon {
    font-size: 16px;
  }
}

@media (max-width: 1023px) and (min-width: 792px) {
  .vitrine-projet-wrapper .container {
    max-width: 668px;
  }
}

img {
  border-radius: 0;
}

/*# sourceMappingURL=theme.css.map */