/*!
 * Bootstrap Icons v1.13.1 (https://icons.getbootstrap.com/)
 * Copyright 2019-2024 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/icons/blob/main/LICENSE)
 */

@font-face {
  font-display: block;
  font-family: "bootstrap-icons";
  src: url(/fonts/vendor/bootstrap-icons/bootstrap-icons.woff2?92ea18a81d737146ff044ddb52010366) format("woff2"),
url(/fonts/vendor/bootstrap-icons/bootstrap-icons.woff?1295669cd4e305c97f2cfc16d56614b8) format("woff");
}

.bi::before,
[class^="bi-"]::before {
  display: inline-block;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -.125em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.bi-chat-left-text::before { content: "\f252"; }
.bi-check-circle::before { content: "\f26b"; }
.bi-check2-square::before { content: "\f271"; }
.bi-chevron-down::before { content: "\f282"; }
.bi-clock-fill::before { content: "\f291"; }
.bi-cloud-download::before { content: "\f29b"; }
.bi-envelope-fill::before { content: "\f32c"; }
.bi-geo-alt::before { content: "\f3e8"; }
.bi-geo-fill::before { content: "\f3e9"; }
.bi-google::before { content: "\f3f0"; }
.bi-info-circle::before { content: "\f431"; }
.bi-keyboard::before { content: "\f451"; }
.bi-list-check::before { content: "\f473"; }
.bi-lock-fill::before { content: "\f47a"; }
.bi-megaphone::before { content: "\f484"; }
.bi-patch-check-fill::before { content: "\f4b5"; }
.bi-people-fill::before { content: "\f4cf"; }
.bi-people::before { content: "\f4d0"; }
.bi-person-badge::before { content: "\f4d3"; }
.bi-person-check-fill::before { content: "\f4d5"; }
.bi-person-circle::before { content: "\f4d7"; }
.bi-star-fill::before { content: "\f586"; }
.bi-star::before { content: "\f588"; }
.bi-telephone-fill::before { content: "\f5b4"; }
.bi-graph-up-arrow::before { content: "\f673"; }
.bi-hospital::before { content: "\f774"; }
.bi-sign-do-not-enter::before { content: "\f852"; }

@charset "UTF-8";
/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dd {
  margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role=list],
ol[role=list] {
  list-style: none;
}

/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  text-decoration: none;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img {
  max-width: 100%;
  height: auto;
  aspect-ratio: attr(width)/attr(height);
  aspect-ratio: attr(data-aspectratio, "1");
  display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

ul, li, ol {
  margin: 0;
  padding: 0;
  list-style: none;
  display: block;
}
ul::marker, li::marker, ol::marker {
  display: none !important;
}

.preload * {
  transition-property: none !important;
  transform: none !important;
  animation: none !important;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
@font-face {
  font-display: swap !important;
}
/*** font base size ***/
/*** font face ***/
/*** font size ***/
/*** line height ***/
/*** header ***/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
  margin: 1.4em 0 1.2em;
}

h5, .h5 {
  font-size: 1.6rem;
  line-height: 1.2;
}

h4, .h4 {
  font-size: 1.8rem;
}

h3, .h3 {
  font-size: 2.1rem;
  line-height: 1.1;
  font-weight: 400;
}

h2, .h2 {
  font-size: 3rem;
  line-height: 1.1;
  font-weight: 800;
}
h2 span, .h2 span {
  font-weight: 300;
}

h1, .h1 {
  font-size: 4rem;
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 700;
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fade_in-scale {
  from {
    opacity: 0;
    transform: scale(0.95) translateY(-1rem);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}
@keyframes fade_in-down {
  from {
    opacity: 0;
    transform: translateY(-50px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes slidedownAnimation {
  from {
    transform: translateY(-50px);
    opacity: 0;
  }
  to {
    transform: translateY(0px);
    opacity: 1;
  }
}
@keyframes gradiantRotation {
  0% {
    background-position: 0% 0%;
  }
  50% {
    background-position: 100% 100%;
  }
  100% {
    background-position: 0% 0%;
  }
}
@keyframes bouncing {
  0% {
    transform: translateY(0) scaleY(0.9) scaleX(1.05);
  }
  10% {
    transform: scaleY(0.98) scaleX(1.01);
  }
  100% {
    transform: translateY(-30px) scaleY(1) scaleX(1);
  }
}
@keyframes shakeAndScale {
  0% {
    transform: translate(0%, -5%) scale(1.02);
  }
  25% {
    transform: translate(0%, -5%) scale(1.02) rotate(5deg);
  }
  40% {
    transform: translate(0%, -5%) scale(1.02) rotate(-5deg);
  }
  50% {
    transform: translate(0%, -5%) scale(1.02) rotate(2deg);
  }
  60% {
    transform: translate(0%, -5%) scale(1.02) rotate(-5deg);
  }
  75% {
    transform: translate(0%, -5%) scale(1.02) rotate(5deg);
  }
  100% {
    transform: translate(0%, -5%) scale(1.02);
  }
}
#js__password__toggle {
  position: absolute;
  bottom: 7px;
  right: 9px;
  cursor: pointer;
  opacity: 0.4;
  transition: opacity 0.3s ease-in-out;
}
#js__password__toggle img {
  height: 28px;
}
#js__password__toggle:hover {
  opacity: 1;
}

input::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder {
  opacity: 0.7;
}

input::placeholder, textarea::placeholder, select::placeholder {
  opacity: 0.7;
}

*.form-control:disabled {
  background-color: #f5f5f5;
  color: #aaa;
  opacity: 1;
}

form {
  margin: 0;
  padding: 2rem;
  transition: all 0.3s ease-in-out;
  position: relative;
}
form .loading {
  position: absolute;
  background: rgba(255, 255, 255, 0.8);
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
  transition: opacity 0.3s ease-in-out;
}
form .loading div {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}
form .loading div p {
  color: #272425;
  font-size: 1.4rem;
  text-align: center;
}
@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}
form .grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 1rem 2rem;
  margin: 2rem 0;
}
form .alert {
  font-size: 1.3rem;
  font-style: italic;
  padding: 5px 18px;
  border-radius: 50vh;
  margin-top: 2px;
}
form .alert--danger {
  background: #ea7272;
  color: #fff;
}

fieldset {
  border: 1px solid #F0F2F3;
  margin: 0 0 3rem 0;
  padding: 0;
  border-radius: 0.4rem;
  overflow: hidden;
}
fieldset h3 {
  background: #272425;
  color: #fff;
  margin: 0 0 2rem 0;
  padding: 6px 15px 6px;
}
fieldset .grid {
  margin: 2rem;
}
fieldset hr {
  border-top: 1px solid #E1E4E7;
}

.form-group {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 0 1.5rem;
  margin: 0.3rem 0;
  gap: 5px;
  position: relative;
}
.form-group label {
  color: #677A88;
  font-size: 1.6rem;
  font-weight: 500;
}

.form-group--flex-row {
  display: flex;
  flex-direction: row;
  gap: 2rem;
  align-items: center;
}

.form-control {
  background: #fff;
  border: 1px solid #A4AFB8;
  font-size: 1.6rem;
  color: rgba(0, 0, 0, 0.9);
  border-radius: 4px;
  padding: 14px 20px;
  width: 100%;
}
.form-control:required {
  font-weight: 600;
}
.form-control:focus {
  outline: none;
  box-shadow: none;
  background: #E1E4E7;
}

textarea.form-control {
  line-height: 1.3;
  padding: 10px;
}

input:required:invalid:not(:-moz-placeholder-shown) {
  border: 1px solid #e55353;
  background-image: url(/assets/default/img/checked-rounded-red.png);
}

input:required:invalid:not(:placeholder-shown), input:focus:invalid, .form-control-is-invalid {
  border: 1px solid #e55353;
  background-image: url(/assets/default/img/checked-rounded-red.png);
}

input:required:invalid:not(:-moz-placeholder-shown) + small {
  color: #e55353;
}

input:required:invalid:not(:placeholder-shown) + small, input:focus:invalid + small, .form-control-is-invalid + small {
  color: #e55353;
}

input:required:valid:not(:-moz-placeholder-shown) {
  background-image: url(/assets/default/img/checked-rounded-green.png);
}

input:required:valid:not(:placeholder-shown) {
  background-image: url(/assets/default/img/checked-rounded-green.png);
}

input:required:valid:not(:-moz-placeholder-shown), input:required:invalid:not(:-moz-placeholder-shown) {
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: calc(100% - 10px);
}

input:required:valid:not(:placeholder-shown), input:required:invalid:not(:placeholder-shown), input:focus:invalid, .form-control-is-invalid {
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: calc(100% - 10px);
}

.form__actions {
  display: flex;
  gap: 2rem;
  justify-content: space-between;
}

select.form-control {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-repeat: no-repeat;
  background-position: right 20px center;
  padding: 16px 44px 16px 20px;
  color: rgba(0, 0, 0, 0.9);
}

input[name=localisation].form-control {
  background-image: url("/assets/default/img/ico-localisation.svg");
  background-repeat: no-repeat;
  background-position: right 20px center;
  background-size: 21px 21px;
  padding-right: 44px;
}

.recherche-liste__geoloc input[name=localisation].form-control {
  background-image: none;
  padding-right: 20px;
}

option:disabled {
  color: #E1E4E7;
}

form.loading {
  opacity: 0.2;
}

.invalid-feedback {
  color: red;
}

input[type=file].form-control {
  font-size: 1.4rem;
}
input[type=file].form-control:required {
  font-weight: 400;
}

textarea.form-control {
  min-height: 120px;
  width: 100%;
}
textarea.form-control:focus {
  box-shadow: none;
  outline: none;
}

label.required {
  font-weight: 700;
}

.radio-group {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.radio-group div {
  border: 1px solid #E1E4E7;
  border-radius: 4px;
  transition: all 0.3s ease-in-out;
  padding-left: 15px;
}
.radio-group div label {
  padding: 15px 0;
  min-width: 250px;
  cursor: pointer;
  display: inline-block;
}
.radio-group div:hover {
  background: #E1E4E7;
}

/*** select drop list customisée ***/
.custom-select {
  position: relative;
  width: 100%;
}
.custom-select select {
  display: none; /*hide original SELECT element: */
}

.select-selected.form-control {
  width: 100%;
}
.select-selected.form-control:focus {
  box-shadow: none;
  background: #f5f5f5;
  border-bottom: 2px solid #A27E49;
}
.select-selected.form-control:after {
  position: absolute;
  content: "";
  top: 20px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #000000 transparent transparent transparent;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.form-control.select-arrow-active:after {
  border-color: transparent transparent #000000 transparent;
  top: 12px;
}

/* style the items (options), including the selected item: */
.select-items div {
  color: #000000;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: #f8f8f8;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}

/*** check box ***/
.checkbox-group {
  display: flex;
  flex-direction: column;
  padding: 1.5rem 0 0 0;
  gap: 1rem;
}
.checkbox-group > * {
  position: relative;
  /* Aspect de la case */
  /* Aspect de la coche */
  /* Aspect non cochée */
  /* Aspect cochée */
  /* Disabled checkbox */
  /* Disabled checked */
  /* Accessibility focus */
}
.checkbox-group > * [type=checkbox]:not(:checked),
.checkbox-group > * [type=checkbox]:checked,
.checkbox-group > * [type=radio]:not(:checked),
.checkbox-group > * [type=radio]:checked {
  /* Cache la checkbox sans
     la rendre invisible aux
     lecteurs d'écran */
  position: absolute;
  left: 0;
  opacity: 0.01;
}
.checkbox-group > * [type=checkbox]:not(:checked) + label,
.checkbox-group > * [type=checkbox]:checked + label,
.checkbox-group > * [type=radio]:not(:checked) + label,
.checkbox-group > * [type=radio]:checked + label {
  position: relative; /* permet de positionner la checkbox */
  padding-left: 2.3em; /* place pour la box */
  font-size: 1.4rem;
  line-height: 1.7;
  cursor: pointer;
}
.checkbox-group > * [type=checkbox]:not(:checked) + label span.count,
.checkbox-group > * [type=checkbox]:checked + label span.count,
.checkbox-group > * [type=radio]:not(:checked) + label span.count,
.checkbox-group > * [type=radio]:checked + label span.count {
  background: #A27E49;
  border-radius: 8px;
  padding: 3px;
  margin-left: 5px;
  font-size: 10px;
  width: 16px;
  height: 16px;
  line-height: 10px;
  display: inline-block;
  text-align: center;
}
.checkbox-group > * [type=checkbox]:not(:checked) + label::before,
.checkbox-group > * [type=checkbox]:checked + label::before,
.checkbox-group > * [type=radio]:not(:checked) + label::before,
.checkbox-group > * [type=radio]:checked + label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #999;
  background: transparent;
  border-radius: 2px;
  opacity: 1;
  transition: all 0.275s;
}
.checkbox-group > * [type=checkbox]:not(:checked) + label::after,
.checkbox-group > * [type=checkbox]:checked + label::after,
.checkbox-group > * [type=radio]:not(:checked) + label::after,
.checkbox-group > * [type=radio]:checked + label::after {
  content: "✓";
  speak: never; /* Pour être sûr que le lecteur d'écran ne lira pas "fois" */
  position: absolute;
  top: 7px;
  left: 2px;
  font-size: 29px;
  font-weight: 800;
  color: #272425;
  line-height: 0;
  transition: all 0.2s; /* Petite transition */
}
.checkbox-group > * [type=checkbox]:not(:checked) + label::after,
.checkbox-group > * [type=radio]:not(:checked) + label::after {
  opacity: 0;
  transform: scale(0) rotate(45deg);
}
.checkbox-group > * [type=checkbox]:checked + label::after,
.checkbox-group > * [type=radio]:checked + label::after {
  opacity: 1;
  transform: scale(1) rotate(0);
}
.checkbox-group > * [type=checkbox]:disabled:not(:checked) + label::before,
.checkbox-group > * [type=checkbox]:disabled:checked + label::before,
.checkbox-group > * [type=radio]:disabled:not(:checked) + label::before,
.checkbox-group > * [type=radio]:disabled:checked + label::before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #e9e9e9;
}
.checkbox-group > * [type=checkbox]:disabled:checked + label::after,
.checkbox-group > * [type=radio]:disabled:checked + label::after {
  color: #777;
}
.checkbox-group > * [type=checkbox]:disabled + label,
.checkbox-group > * [type=radio]:disabled + label {
  color: #aaa;
}
.checkbox-group > * [type=checkbox]:checked:focus + label::before,
.checkbox-group > * [type=checkbox]:not(:checked):focus + label::before,
.checkbox-group > * [type=radio]:checked:focus + label::before,
.checkbox-group > * [type=radio]:not(:checked):focus + label::before {
  border: 2px solid #fff;
}

.autocomplete-box {
  position: relative;
  width: 100%;
}
.autocomplete-box ul {
  position: absolute;
  border: 1px solid #A4AFB8;
  overflow: hidden;
  background: #E1E4E7;
  width: 100%;
  border-radius: 25px;
}
.autocomplete-box ul li {
  padding: 10px;
  cursor: pointer;
}
.autocomplete-box ul li:hover {
  background: #272425;
  color: #fff;
}

/*** Login form ***/
.login__form {
  max-width: 500px;
  margin: auto;
}
.login__form .btn {
  padding: 1.6rem;
}

/**
* Jquery form builder
 */
.rendered-form .formbuilder-checkbox label {
  padding-top: 0;
}
.rendered-form .formbuilder-checkbox [type=checkbox]:not(:checked) + label::before,
.rendered-form .formbuilder-checkbox [type=checkbox]:checked + label::before {
  border: 1px solid #aaa;
}

.rendered-form.rendered-form--column {
  display: flex;
  flex-direction: column;
  width: 100%;
}

@media screen and (min-width: 800px) {
  .rendered-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
  .rendered-form > div:not(.form-group) {
    grid-column: span 2;
  }
  .rendered-form .formbuilder-textarea {
    grid-column: span 2;
  }
}
@media screen and (min-width: 1000px) {
  .rendered-form {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .rendered-form > div:not(.form-group) {
    grid-column: span 3;
  }
  .rendered-form .formbuilder-textarea {
    grid-column: span 2;
  }
}

/*** form de recherche multicritère en haut de page des listes ***/
.form__search {
  margin: 0;
  /*@media screen and (min-width: map-get($mq-breakpoints, 'md')) {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    font-size: $fs-300;
  }*/
}
.form__search label {
  font-size: 1.2rem;
  color: #677A88;
  padding-top: 0;
}
.form__search .check__label {
  color: #000000;
}
@media screen and (min-width: 800px) {
  .form__search .form-control {
    font-size: 1.4rem;
    margin-top: 8px;
  }
}
.form__search .h4 {
  cursor: pointer;
  position: relative;
  width: 100%;
  padding-left: 21px;
}
.form__search .h4:after {
  content: "";
  background: url(/assets/default/img/ico-arrow-down.svg) no-repeat;
  background-size: contain;
  width: 12px;
  height: 12px;
  position: absolute;
  left: 0;
  top: 5px;
  transition: all 0.2s ease-in-out;
}
.form__search .h4.active:after {
  transform: rotate(180deg);
}
.form__search .checkbox-group {
  background: #F0F2F3;
  transform-origin: top;
  transform: scaleY(0);
  height: 0;
  opacity: 0;
  transition: all 0.1s ease-in-out;
}
.form__search .checkbox-group.active {
  opacity: 1;
  height: auto;
  transform: scaleY(1);
}
.form__search input.form-control[type=select] {
  padding-top: 8px;
}
.form__search .select-selected.form-control:after {
  top: 51px;
}
.form__search .select-selected.form-control.select-arrow-active:after {
  top: 44px;
}
.glide {
  position: relative;
  width: 100%;
  box-sizing: border-box;
}
.glide * {
  box-sizing: inherit;
}
.glide__track {
  overflow: hidden;
}
.glide__slides {
  position: relative;
  width: 100%;
  list-style: none;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  touch-action: pan-Y;
  overflow: hidden;
  padding: 0;
  white-space: nowrap;
  display: flex;
  flex-wrap: nowrap;
  will-change: transform;
}
.glide__slide {
  width: 100%;
  height: 100%;
  flex-shrink: 0;
  white-space: normal;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}
.glide__slide a {
  -webkit-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.glide__arrows {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.glide__bullets {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.glide__arrow {
  position: absolute;
  display: block;
  top: 50%;
  z-index: 2;
  color: white;
  text-transform: uppercase;
  padding: 9px 12px;
  background-color: transparent;
  border: 2px solid rgba(255, 255, 255, 0.5);
  border-radius: 4px;
  box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);
  text-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.1);
  opacity: 1;
  cursor: pointer;
  transition: opacity 150ms ease, border 300ms ease-in-out;
  transform: translateY(-50%);
  line-height: 1;
}
.glide__arrow:focus {
  outline: none;
}
.glide__arrow:hover {
  border-color: white;
}
.glide__arrow--left {
  left: 2em;
}
.glide__arrow--right {
  right: 2em;
}
.glide__bullets {
  position: absolute;
  z-index: 2;
  bottom: 2em;
  left: 50%;
  display: inline-flex;
  list-style: none;
  transform: translateX(-50%);
}
.glide__bullet {
  background-color: rgba(255, 255, 255, 0.5);
  width: 9px;
  height: 9px;
  padding: 0;
  border-radius: 50%;
  border: 2px solid transparent;
  transition: all 300ms ease-in-out;
  cursor: pointer;
  line-height: 0;
  box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);
  margin: 0 0.25em;
}
.glide__bullet:focus {
  outline: none;
}
.glide__bullet:hover, .glide__bullet:focus {
  border: 2px solid white;
  background-color: rgba(255, 255, 255, 0.5);
}
.glide__bullet--active {
  background-color: white;
}

/*! shareon v1.6.2 */
.shareon {
  font-size: 0 !important;
}

.shareon > * {
  background-color: #ccc;
  border: none;
  border-radius: 3.33333px;
  box-sizing: content-box;
  color: #fff;
  display: inline-block;
  height: 24px;
  line-height: 1.5;
  margin: 3px;
  min-width: 16px;
  padding: 6px 10px;
  position: relative;
  transition: opacity 0.3s ease;
  vertical-align: middle;
}

.shareon > :hover {
  border: none;
  cursor: pointer;
  opacity: 0.7;
}

.shareon > :not(:empty) {
  font-size: 16px;
  text-decoration: none;
}

.shareon > :not(:empty):before {
  background-position: 0 50%;
  height: 100%;
  left: 0;
  position: relative;
  top: 0;
  width: 28px;
}

.shareon > :before {
  background-repeat: no-repeat;
  background-size: 20px 20px;
  content: "";
  display: inline-block;
  height: 20px;
  left: 8px;
  position: absolute;
  top: 8px;
  vertical-align: bottom;
  width: 20px;
}

.shareon > .facebook {
  background-color: #1877f2;
}

.shareon > .facebook:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.998 12c0-6.628-5.372-12-11.999-12C5.372 0 0 5.372 0 12c0 5.988 4.388 10.952 10.124 11.852v-8.384H7.078v-3.469h3.046V9.356c0-3.008 1.792-4.669 4.532-4.669 1.313 0 2.686.234 2.686.234v2.953H15.83c-1.49 0-1.955.925-1.955 1.874V12h3.328l-.532 3.469h-2.796v8.384c5.736-.9 10.124-5.864 10.124-11.853z'/%3E%3C/svg%3E");
}

.shareon > .linkedin {
  background-color: #2867b2;
}

.shareon > .linkedin:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.722 23.72h-4.91v-7.692c0-1.834-.038-4.194-2.559-4.194-2.56 0-2.95 1.995-2.95 4.06v7.827H8.394V7.902h4.716v2.157h.063c.659-1.244 2.261-2.556 4.655-2.556 4.974 0 5.894 3.274 5.894 7.535zM.388 7.902h4.923v15.819H.388zM2.85 5.738A2.849 2.849 0 0 1 0 2.886a2.851 2.851 0 1 1 2.85 2.852z'/%3E%3C/svg%3E");
}

.shareon > .linkedin:not(:empty):before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z'/%3E%3C/svg%3E");
}

.shareon > .messenger {
  background-color: #09f;
}

.shareon > .messenger:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 11.64C0 4.95 5.24 0 12 0s12 4.95 12 11.64-5.24 11.64-12 11.64c-1.21 0-2.38-.16-3.47-.46a.96.96 0 0 0-.64.05L5.5 23.92a.96.96 0 0 1-1.35-.85l-.07-2.14a.97.97 0 0 0-.32-.68A11.39 11.39 0 0 1 0 11.64zm8.32-2.19-3.52 5.6c-.35.53.32 1.14.82.75l3.79-2.87c.26-.2.6-.2.87 0l2.8 2.1c.84.63 2.04.4 2.6-.48l3.52-5.6c.35-.53-.32-1.13-.82-.75l-3.79 2.87c-.25.2-.6.2-.86 0l-2.8-2.1a1.8 1.8 0 0 0-2.61.48z'/%3E%3C/svg%3E");
}

.shareon > .pinterest {
  background-color: #ee0023;
}

.shareon > .pinterest:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.017 0C5.396 0 .029 5.367.029 11.987c0 5.079 3.158 9.417 7.618 11.162-.105-.949-.199-2.403.041-3.439.219-.937 1.406-5.957 1.406-5.957s-.359-.72-.359-1.781c0-1.663.967-2.911 2.168-2.911 1.024 0 1.518.769 1.518 1.688 0 1.029-.653 2.567-.992 3.992-.285 1.193.6 2.165 1.775 2.165 2.128 0 3.768-2.245 3.768-5.487 0-2.861-2.063-4.869-5.008-4.869-3.41 0-5.409 2.562-5.409 5.199 0 1.033.394 2.143.889 2.741.099.12.112.225.085.345-.09.375-.293 1.199-.334 1.363-.053.225-.172.271-.401.165-1.495-.69-2.433-2.878-2.433-4.646 0-3.776 2.748-7.252 7.92-7.252 4.158 0 7.392 2.967 7.392 6.923 0 4.135-2.607 7.462-6.233 7.462-1.214 0-2.354-.629-2.758-1.379l-.749 2.848c-.269 1.045-1.004 2.352-1.498 3.146 1.123.345 2.306.535 3.55.535 6.607 0 11.985-5.365 11.985-11.987C23.97 5.39 18.592.026 11.985.026z'/%3E%3C/svg%3E");
}

.shareon > .telegram {
  background-color: #179cde;
}

.shareon > .telegram:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.517 11.31c-.962.382-1.466.756-1.512 1.122-.088.702.924.921 2.196 1.335 1.037.337 2.433.731 3.158.747.658.014 1.393-.257 2.204-.814 5.533-3.735 8.39-5.622 8.57-5.663.126-.029.301-.065.42.04.119.106.107.306.095.36-.101.429-5.3 5.156-5.599 5.467-1.143 1.187-2.443 1.913-.437 3.235 1.735 1.144 2.746 1.873 4.534 3.045 1.142.75 2.039 1.637 3.218 1.529.543-.05 1.104-.56 1.389-2.083.673-3.598 1.996-11.392 2.302-14.604a3.585 3.585 0 0 0-.034-.8c-.027-.158-.084-.383-.29-.55-.243-.197-.619-.24-.787-.236-.764.013-1.936.42-7.579 2.767C11.39 7.03 7.44 8.73 1.517 11.31z'/%3E%3C/svg%3E");
}

.shareon > .twitter {
  background-color: #1da1f2;
}

.shareon > .twitter:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.954 4.569a10 10 0 0 1-2.825.775 4.958 4.958 0 0 0 2.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 0 0-8.384 4.482C7.691 8.094 4.066 6.13 1.64 3.161a4.822 4.822 0 0 0-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 0 1-2.228-.616v.061a4.923 4.923 0 0 0 3.946 4.827 4.996 4.996 0 0 1-2.212.085 4.937 4.937 0 0 0 4.604 3.417 9.868 9.868 0 0 1-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 0 0 7.557 2.209c9.054 0 13.999-7.496 13.999-13.986 0-.209 0-.42-.015-.63a9.936 9.936 0 0 0 2.46-2.548l-.047-.02z'/%3E%3C/svg%3E");
}

.shareon > .whatsapp {
  background-color: #25d366;
}

.shareon > .whatsapp:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51a12.8 12.8 0 0 0-.57-.01c-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413z'/%3E%3C/svg%3E");
}

.shareon {
  display: flex;
  margin: 0;
}
.shareon > * {
  height: 16px;
  padding: 4px 8px 13px;
  background: #A4AFB8 !important;
}
.shareon > *:before {
  background-size: 16px;
  width: 16px;
  height: 16px;
  top: 9px;
}
.shareon .email:before {
  background-image: url(/assets/default/img/ico-mail.svg);
}

h2.tiret__gauche, h2.tiret__bas {
  padding-left: 2rem !important;
  position: relative;
}
h2.tiret__gauche:before, h2.tiret__bas:before {
  position: absolute;
  content: "";
  width: 3px;
  height: 100%;
  background: #A27E49;
  left: 0;
  top: 0;
}

h2.tiret__bas {
  padding-left: 0 !important;
  margin-bottom: 6rem;
}
h2.tiret__bas:before {
  width: 80px;
  height: 3px;
  left: 0;
  bottom: -3rem;
  top: auto;
}

a {
  transition: all 0.2s ease-in-out;
  color: #272425;
}
a:hover {
  color: #A4AFB8;
}

small, .small {
  font-size: 1.2rem;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}

.center {
  text-align: center;
}

blockquote {
  margin: 3rem 0;
  font-size: 2.1rem;
  font-style: italic;
  padding-left: 2rem;
  position: relative;
}
blockquote:before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: #E1E4E7;
}

/*
blockquote:before {
  display: block;
  padding-left: 10px;
  content: "\300A";
  font-size: 24px;
  position: absolute;
  left: -40px;
  top: 9px;
  color: $black;

}

blockquote:after {
  display: block;
  padding-left: 10px;
  content: "\300B";
  font-size: 24px;
  position: absolute;
  right: 0px;
  Bottom: 9px;
  color: $black;

}*/

code {
  display: block;
  font-size: 1.4rem;
  background: #efefef;
  border: 1px solid #888;
  border-radius: 4px;
  padding: 1.5rem;
}

.note {
  background: rgba(255, 210, 9, 0.1);
  font-style: italic;
  font-size: 1.4rem;
  padding: 2rem;
  border-radius: 8px;
  margin: 2rem 0 4rem;
}

.flex {
  display: flex;
  gap: 1rem;
}

.flex-wrap {
  flex-wrap: wrap;
}

.justify-center {
  justify-content: center;
}

.justify-end {
  justify-content: flex-end;
}

.gap-2 {
  gap: 2rem;
}

.gap-3 {
  gap: 3rem;
}

.gap-4 {
  gap: 4rem;
}

.flex--spacebetween {
  justify-content: space-between;
}

.flex--row {
  flex-direction: row;
}

.justify-center {
  justify-content: center;
}

.justify-end {
  justify-content: flex-end;
}

.align-center {
  align-items: center;
}

 .grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(45%, 1fr));
  gap: 2rem;
}

.date {
  font-size: 1.2rem;
  margin-top: 1.6rem;
}

.pagination {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem 0.3rem;
  margin-top: 4rem;
}
.pagination li {
  padding: 8px;
  border: 1px solid #A4AFB8;
  font-size: 1.6rem;
  border-radius: 8px;
}
.pagination li:hover {
  background: #A27E49;
}
.pagination li button, .pagination li span {
  background: transparent;
  border: 0;
  cursor: pointer;
  padding-block: 1px;
  padding-inline: 6px;
  width: 26px;
}
.pagination li.active {
  background: #272425;
  color: #fff;
  font-weight: 800;
}

.shareon {
  margin: 3rem 0 3rem;
}

table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 1px;
  margin: 3rem 0;
}
table th {
  background: #272425;
  color: #fff;
  text-align: center;
  line-height: 30px;
  text-transform: uppercase;
  padding: 5px 0 0;
}
table td {
  background: #F0F2F3;
  padding: 6px !important;
  font-size: 1.4rem;
}
table tr:nth-child(even) td {
  background: #FBFBFB;
}

table {
  margin: 0;
}

.pill__theme {
  background: #F0F2F3;
  color: #677A88;
  border-radius: 50vh;
  display: inline-block;
  padding: 4px 12px;
  margin: 1.2rem 0 2rem;
  font-size: 1.2rem;
  z-index: 10;
}
.pill__theme:hover {
  background: #677A88;
  color: #fff;
}
.pill__theme:hover a {
  color: #fff;
}

.dropdown {
  position: relative;
  display: inline-block;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
  /* Dropdown Content (Hidden by Default) */
}
.dropdown .dropdown-content {
  display: none;
  position: absolute;
  background-color: #fafafa;
  border-radius: 8px;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 999999;
}
.dropdown .dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  white-space: nowrap;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

.glide__arrow {
  border: 0;
  box-shadow: none;
  text-shadow: none;
}

.glide__arrow--left {
  left: -6rem;
}

.glide__arrow--right {
  right: -6rem;
}

.glide__bullets {
  bottom: -2rem;
}

.glide__bullet {
  box-shadow: none;
  background: #E1E4E7;
}

.glide__bullet--active {
  background: #272425;
}

.active {
  background-color: #ccc;
}

.panel {
  padding: 0 18px;
  background-color: white;
  display: none;
  overflow: hidden;
}

.loading-masq > div {
  position: absolute;
  z-index: 100;
  inset: 0;
  background: rgba(255, 255, 255, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
}

.ico-info {
  display: inline-block;
  flex: 0 0 auto;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask: url("/assets/default/img/ico-info.svg") center/contain no-repeat;
  mask: url("/assets/default/img/ico-info.svg") center/contain no-repeat;
}

.adminpanel {
  position: fixed;
  z-index: 1000;
  top: 0;
  bottom: 0;
  left: 0;
  width: 20rem;
  background: rgba(0, 0, 0, 0.85);
  color: #fff;
  margin-left: -20rem;
  transition: all 0.3s ease-out;
}
.adminpanel > div {
  position: relative;
  height: 100vh;
}

.adminpanel__arrow {
  position: absolute;
  top: 30%;
  margin-left: 100%;
  background: rgba(0, 0, 0, 0.85);
  padding: 1rem;
  border-radius: 0 8px 8px 0;
  font-size: 3rem;
  font-weight: 800;
  color: #fff;
}
.adminpanel__arrow span {
  display: block;
  transition: all 0.3s ease-out;
}

.adminpanel.adminpanel--open {
  margin-left: 0;
}
.adminpanel.adminpanel--open .adminpanel__arrow span {
  transform: rotate(180deg);
}

.adminpanel__menu {
  height: 100vh;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}
.adminpanel__menu .adminpanel__vars {
  margin-top: 8rem;
}
.adminpanel__menu p {
  font-size: 1.2rem;
  margin-bottom: 2rem;
}

.widget.widget--admin {
  position: relative;
}

.admin__widget__tools {
  display: none;
  position: absolute;
  z-index: 999;
  top: 0px;
  left: -20px;
  font-size: 1.4rem;
}
.admin__widget__tools:hover .admin__widget__handler {
  display: none;
  background: #efefef !important;
  color: #fff !important;
}
.admin__widget__tools:hover .admin__widget__content {
  display: block;
}

.admin__widget__handler {
  position: absolute;
  background: #fff url(/assets/default/img/three-dots-vertical_1.svg) no-repeat center center !important;
  background-size: contain;
  border: 1px solid #aaa;
  border-radius: 3px !important;
  padding: 4px !important;
  width: 15px !important;
  height: 25px !important;
  color: #888 !important;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  z-index: 5;
}
.admin__widget__handler img {
  width: 15px;
}
.admin__widget__handler:hover {
  background: #fafafa;
  color: #fff;
}

.admin__widget__content {
  display: none;
  position: absolute !important;
  background: #fafafa !important;
  box-shadow: 4px 5px 12px -1px rgba(0, 0, 0, 0.37);
  top: -5px;
  left: -15px;
  z-index: 10;
  cursor: pointer;
  padding: 0 !important;
  border-radius: 4px !important;
  flex-direction: column;
}
.admin__widget__content h5 {
  margin: 0;
  background: #000;
  color: #fff;
  padding: 8px 15px 0px 15px;
  border-radius: 4px 4px 0 0;
}
.admin__widget__content > div {
  padding: 15px;
}
.admin__widget__content > div p {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: #888 !important;
  font-size: 1.4rem !important;
  text-transform: none !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}
.admin__widget__content > div p span {
  width: -moz-max-content;
  width: max-content;
  color: #888 !important;
  font-size: 1.4rem !important;
  font-weight: 400 !important;
  text-transform: none !important;
}
.admin__widget__content > div p:hover {
  color: #3d86d8 !important;
}
.admin__widget__content > div p:hover span {
  color: #3d86d8 !important;
}

/*!
 * Toastify js 1.11.2
 * https://github.com/apvarun/toastify-js
 * @license MIT licensed
 *
 * Copyright (C) 2018 Varun A P
 */
.toastify {
  padding: 0.5rem 20px 2rem;
  color: #fff;
  display: flex;
  flex-direction: column;
  box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);
  background: linear-gradient(135deg, #73a5ff, #5477f5);
  position: fixed;
  opacity: 0;
  transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
  border-radius: 10px;
  cursor: pointer;
  text-decoration: none;
  max-width: calc(50% - 20px);
  z-index: 2147483647;
}

.toastify.on {
  opacity: 1;
}

.toast-close {
  opacity: 0.4;
  padding: 0 5px;
}

.toastify-right {
  right: 15px;
}

.toastify-left {
  left: 15px;
}

.toastify-top {
  top: -150px;
}

.toastify-bottom {
  bottom: -150px;
}

.toastify-rounded {
  border-radius: 25px;
}

.toastify-avatar {
  width: 6rem;
  height: 6rem;
  margin: 2rem 0 1.5rem;
}
.toastify-avatar path {
  color: #fff;
}

.toastify-center {
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  max-width: fit-content;
  max-width: -moz-fit-content;
}

@media only screen and (max-width: 360px) {
  .toastify-right, .toastify-left {
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    max-width: -moz-fit-content;
    max-width: fit-content;
  }
}
.toastify {
  font-size: 2rem !important;
  max-width: 600px;
  justify-content: center;
  align-items: center;
}

.toastify-success {
  background: #2eb85c;
}

.toastify-danger {
  background: #e55353;
}

.toastify-warning {
  background: #f9b115;
}

.toastify-info {
  background: #39f;
}

:root {
  --x: 0;
  --y: 0;
  --size: 0;
}

.js_open_modal {
  cursor: pointer;
}

#overlay, .overlay {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
  opacity: 0;
  animation-delay: 0s;
  animation-duration: 0.6s;
  animation-name: fade-in;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}

#overlay.overlay__close {
  animation-name: fade-out;
}

.modal_links {
  cursor: pointer;
}

.modal {
  max-height: 90vh; /* Limite la hauteur de la modale */
  overflow-y: auto; /* Permet le scroll dans la modale */
  background: #fff;
  max-width: 90%;
  border-radius: 4px;
  opacity: 0;
  animation-delay: 0.6s;
  animation-duration: 0.6s;
  animation-name: fade_in-down;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
@media screen and (min-width: 800px) {
  .modal {
    max-width: 600px;
  }
}
@media screen and (min-width: 1000px) {
  .modal {
    min-width: 600px;
    max-width: 900px;
  }
}
@media screen and (min-width: 1200px) {
  .modal {
    min-width: 600px;
    max-width: 1200px;
  }
}

.modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 2rem;
  border-bottom: 1px solid #E1E4E7;
}
.modal__header > * {
  margin: 0;
}
.modal__header .js_close_modal {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.modal__header .js_close_modal::before, .modal__header .js_close_modal:after {
  display: none !important;
}

.modal__body {
  padding: 1rem 2rem 2rem;
}
.modal__body img {
  max-height: 70vh;
}
.modal__body h1, .modal__body h2, .modal__body h3 {
  margin-top: 0;
}
.modal__body h1, .modal__body h2, .modal__body h3, .modal__body p {
  margin-bottom: 2rem;
}
.modal__body .btn {
  margin-bottom: 0;
}

.modal__legend > * {
  margin: 0;
}

.modal__footer {
  border-top: 1px solid #E1E4E7;
  background: #FBFBFB;
  border-radius: 0 0 4px 4px;
  padding: 1rem 2rem;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 2rem;
}

#modalForm.modal {
  background: #fff;
  color: #000000;
}
#modalForm.modal .modal__body {
  padding: 1rem 4rem 4rem;
  position: relative;
}
#modalForm.modal .modal__body h1, #modalForm.modal .modal__body h2 {
  margin-top: 0;
}
#modalForm.modal .modal__body .modal__intro {
  justify-content: space-between;
  align-items: flex-start;
  display: none;
}
@media screen and (min-width: 800px) {
  #modalForm.modal .modal__body .modal__intro {
    display: flex;
  }
}
#modalForm.modal .modal__body form {
  display: flex;
  justify-content: center;
  gap: 1rem;
}
#modalForm.modal .modal__body .form-control {
  border-radius: 4px;
}
#modalForm.modal .modal__body .form-control:focus-visible {
  outline: 1px solid whitesmoke;
}
#modalForm.modal .modal__body .checkbox-group {
  /* Aspect de la coche */
}
#modalForm.modal .modal__body .checkbox-group [type=checkbox]:not(:checked) + label::before,
#modalForm.modal .modal__body .checkbox-group [type=checkbox]:checked + label::before {
  border: 0;
}
.btn {
  display: inline-block;
  position: relative;
  border: 0;
  border-radius: 100vh;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.8rem;
  padding: 1.3rem 2.5rem;
  text-align: center;
  line-height: 1.5;
  width: -moz-fit-content;
  width: fit-content;
  transition: all 0.3s ease-in-out;
  margin: 1.8rem 0;
  text-decoration: none !important;
  overflow: hidden;
  z-index: 1;
  cursor: pointer;
}
.btn:before, .btn:after {
  content: "";
  position: absolute;
  inset: 0;
  background: #272425;
  z-index: -1;
  opacity: 0;
  transform-origin: center;
  transform: scaleX(1);
  transition: all 0.3s ease-in-out;
}
.btn:after {
  opacity: 1;
  transform: scaleX(1);
  background: #A27E49;
  z-index: -2;
}
.btn:hover {
  color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.btn:hover:before {
  opacity: 1;
  transform: scaleX(1);
}

.btn--wide {
  padding: 1.6rem 9rem;
}

.btn--full {
  width: 100%;
}

.btn--no-margin {
  margin: 0;
}

.btn--actif {
  color: #fff !important;
}
.btn--actif:before {
  opacity: 1;
  transform: none;
  background: #272425;
}

.btn--default {
  background: #E1E4E7;
  color: #272425;
}
.btn--default:after {
  display: none;
}
.btn--default:hover {
  background: #272425;
  color: #fff;
}

.btn--picto {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 1rem;
}
.btn--picto span.picto > * {
  height: 17px;
}

.btn--transparent {
  background: transparent;
  color: #272425;
  border: 1px solid #272425;
}
.btn--transparent:after {
  display: none;
}

.btn--small {
  font-size: 1.4rem;
  padding: 0.5rem 1.5rem;
}

.btn--danger {
  background: #e55353;
}
.btn--danger:hover {
  background: #f2a9a9;
}

.btn--warning {
  background: #f9b115;
}
.btn--warning:hover {
  background: #fcd88a;
}

.btn--info {
  background: #39f;
}
.btn--info:hover {
  background: #80c6ff;
}

.btn--tag {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #EBEBEB;
  color: #272425;
  font-size: 1.2rem;
  width: -moz-fit-content;
  width: fit-content;
  gap: 0 0.2rem;
}
.btn--tag img {
  height: 20px;
}
.btn--tag:hover {
  background: #A27E49;
}
.btn--tag:after, .btn--tag:before {
  display: none;
}

.tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid #dedede;
  padding: 0 5px 0 5px;
  margin-bottom: 2rem;
}
.tabs .btn {
  border-radius: 0.4rem 0.4rem 0 0;
  margin-bottom: 0;
  border: 0;
}
.tabs .btn--active {
  background: #fff;
  border: 1px solid #dedede;
  border-bottom: 0;
  color: #272425;
  position: relative;
  margin-bottom: -2px;
}
.tabs .btn--active:after {
  display: none;
}
.tabs .btn--active:hover {
  background: #272425;
  color: #fff;
}

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
}
@media screen and (min-width: 800px) {
  .cards {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  }
}
@media screen and (min-width: 1000px) {
  .cards {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  }
}
@media screen and (min-width: 1200px) {
  .cards {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  }
}

.card {
  position: relative;
  display: flex !important;
  flex-direction: column;
  transition: all 0.3s ease-in-out;
  text-align: left;
  list-style: none;
  list-style-image: none;
  border-bottom: 1px solid #E1E4E7;
  max-width: 450px;
}
.card .content {
  position: relative;
  z-index: 2;
}
.card h2, .card h3 {
  font-size: 2.1rem;
  font-weight: 600;
  margin: 0rem 0 2rem;
  padding-left: 0;
}
.card h2:before, .card h2:after, .card h3:before, .card h3:after {
  display: none;
}
.card .date {
  color: #A4AFB8;
  font-size: 1.2rem;
  margin-bottom: 0;
}
.card .resume {
  color: #A4AFB8;
  font-size: 1.4rem;
  margin-bottom: 2rem;
}
.card .more {
  text-align: right;
  margin: 0;
}
.card .more .btn {
  margin: 0;
}
.card .card__illustration {
  width: 100%;
  overflow: hidden;
  position: relative;
  transition: transform 0.3s ease-in-out;
}
.card .card__illustration img {
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.3s ease-out;
  width: 100%;
  aspect-ratio: 16/9;
}

.item .icon a {
  color: #A27E49;
}

.rating {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.rating__identifiez_vous .rating__locked {
  position: relative;
  display: inline-block;
  padding: 0.4rem 1.2rem;
  border-radius: 4px;
}
.rating__identifiez_vous .rating__locked::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(4.5px);
  -webkit-backdrop-filter: blur(4.5px);
  border-radius: 4px;
}
.rating__identifiez_vous .rating__score {
  position: absolute;
  left: 1.2rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 0;
}
.rating__identifiez_vous .rating__value {
  color: #677A88;
}
.rating__identifiez_vous .rating__locked-text {
  position: relative;
  z-index: 2;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-size: 1.4rem;
  line-height: 1.1;
  color: #272425;
  white-space: nowrap;
}
.rating__label {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  color: #A27E49;
  font-size: 1.4rem;
}
.rating__score {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
}
.rating__value {
  font-size: 3rem;
  font-weight: 700;
  line-height: 1;
  color: #8EB704;
}
.rating__value--medium {
  color: #E8995B;
}
.rating__max {
  font-size: 1.6rem;
  color: #A4AFB8;
}
.rating__content {
  display: flex;
  justify-content: space-between;
}
.rating__count {
  font-size: 1.2rem;
  line-height: 1.1;
}
.rating--google .rating__label {
  font-style: normal;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  color: #A4AFB8;
  display: inline-flex;
  align-items: center;
  font-size: 1.2rem;
  gap: 0.4rem;
}
.rating--google .rating__value {
  color: #272425;
}

.star-green {
  color: #83C03A;
}

.star-gold {
  color: #F6B614;
}

.cta-banner {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: #272425;
  color: #fff;
  isolation: isolate;
}
.cta-banner__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.cta-banner__bg img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.cta-banner__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(39, 36, 37, 0.85) 0%, rgba(39, 36, 37, 0.45) 100%);
}
.cta-banner__content {
  padding: 4.8rem 3.2rem;
  max-width: 720px;
}
@media screen and (min-width: 800px) {
  .cta-banner__content {
    padding: 6.4rem 6.4rem;
  }
}
.cta-banner__title {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 2.5rem;
  line-height: 1.2;
  margin: 0 0 2.4rem;
  color: #fff;
}
.cta-banner .btn {
  margin: 0;
}

.locked-overlay {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  min-height: 240px;
}
.locked-overlay__preview {
  filter: blur(4px);
  opacity: 0.45;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  padding: 2.4rem;
  color: #677A88;
  font-size: 1.2rem;
}
.locked-overlay__panel {
  position: relative;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 1.2rem;
  padding: 3.2rem 1.6rem;
  background: #fff;
  color: #272425;
}
@media screen and (min-width: 800px) {
  .locked-overlay__panel {
    padding: 4.8rem 3.2rem;
  }
}
.locked-overlay__title {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.08rem;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 700;
  font-size: 1.4rem;
  color: #fff;
}
.locked-overlay__text {
  max-width: 620px;
  margin: 0;
  font-size: 1.6rem;
  line-height: 1.5;
  color: rgba(39, 36, 37, 0.95);
}
.locked-overlay .btn {
  margin: 0.8rem 0 0;
  background: #A27E49;
  color: #fff;
}
.locked-overlay .btn:after {
  background: #A27E49;
}
.locked-overlay .btn:hover {
  color: #fff;
  background: #272425;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.stepper {
  display: flex;
  list-style: none;
  margin: 0 0 3.2rem;
  padding: 0;
}
.stepper__item {
  position: relative;
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  text-align: center;
}
.stepper__item::before {
  content: "";
  position: absolute;
  top: 16px;
  right: 50%;
  left: -50%;
  height: 2px;
  background: #E1E4E7;
  z-index: 0;
}
.stepper__item:first-child::before {
  display: none;
}
.stepper__item.is-done, .stepper__item.is-active {
  color: #8EB704;
}
.stepper__item.is-done::before, .stepper__item.is-active::before {
  background: #8EB704;
}
.stepper__item.is-active .stepper__label {
  font-weight: 700;
}
.stepper__item.is-done .stepper__num {
  background: #8EB704;
  border-color: #8EB704;
  color: #fff;
}
.stepper__item.is-active .stepper__num {
  border-color: #8EB704;
  color: #8EB704;
}
.stepper__num {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #E1E4E7;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 700;
  font-size: 1.2rem;
  color: #A4AFB8;
}
.stepper__label {
  font-size: 1.2rem;
}

html {
  scroll-behavior: smooth;
  interpolate-size: allow-keywords;
  font-size: 54%;
}
@media screen and (min-width: 480px) {
  html {
    font-size: 54%;
  }
}
@media screen and (min-width: 640px) {
  html {
    font-size: 56%;
  }
}
@media screen and (min-width: 800px) {
  html {
    font-size: 60%;
  }
}
@media screen and (min-width: 1000px) {
  html {
    font-size: 61.5%;
  }
}
@media screen and (min-width: 1200px) {
  html {
    font-size: 62%;
  }
}
@media screen and (min-width: 1440px) {
  html {
    font-size: 65%;
  }
}

body {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-size: 1.6rem;
  line-height: 1.5;
  width: 100%;
  background: #272425;
  color: #000000;
  padding-top: 119px;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
@media screen and (min-width: 640px) {
  body {
    padding-top: 119px;
  }
}
@media screen and (min-width: 1000px) {
  body {
    padding-top: 168px;
  }
}

body.pdf {
  padding-top: 0;
  background: transparent;
}
body.pdf p {
  margin: 30px 0;
}

#loading-screen.loading-screen__close {
  animation-name: fade-out;
}

.wrapper {
  width: 100%;
}

.container {
  width: 100%;
  margin: auto;
  padding: 0 2rem;
}
@media screen and (min-width: 480px) {
  .container {
    max-width: 100%;
  }
}
@media screen and (min-width: 640px) {
  .container {
    max-width: 100%;
  }
}
@media screen and (min-width: 800px) {
  .container {
    max-width: 98%;
  }
}
@media screen and (min-width: 1000px) {
  .container {
    max-width: 98%;
  }
}
@media screen and (min-width: 1200px) {
  .container {
    max-width: 1200px;
  }
}
@media screen and (min-width: 1440px) {
  .container {
    max-width: 1440px;
  }
}

.menu-desktop {
  display: none;
}
@media screen and (min-width: 1200px) {
  .menu-desktop {
    display: block;
  }
}
.menu-desktop ul {
  display: flex;
  gap: 1rem;
  justify-content: flex-end;
  align-items: center;
  padding: 3rem 0 2.4rem 23rem;
}
.menu-desktop ul li {
  position: relative;
}
.menu-desktop ul li:last-child {
  padding-left: 2rem;
}
.menu-desktop ul li:last-child a {
  display: inline-block;
  padding: 1.2rem 2rem;
  border-radius: 50vh;
  background: #A27E49;
  color: #fff;
  font-size: 1.6rem;
}
.menu-desktop ul li:last-child a:hover, .menu-desktop ul li:last-child a:focus-visible {
  color: #fff;
  background: #272425;
}
.menu-desktop ul li a {
  color: #272425;
  font-size: 1.8rem;
  line-height: 1.2;
  font-weight: 700;
  position: relative;
  padding-left: 2rem;
  white-space: nowrap;
}
.menu-desktop ul li a:hover, .menu-desktop ul li a:focus-visible {
  color: #A27E49;
}
@media screen and (min-width: 1440px) {
  .menu-desktop ul {
    padding: 4rem 0 3rem 26rem;
  }
  .menu-desktop ul li:last-child {
    padding-left: 4rem;
  }
  .menu-desktop ul li:last-child a {
    padding: 1.2rem 2.8rem;
    font-size: 1.8rem;
  }
  .menu-desktop ul li a {
    font-size: 2.1rem;
    padding-left: 3.5rem;
  }
}

#menu-toggle {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}
@media screen and (min-width: 1200px) {
  #menu-toggle {
    display: none;
  }
}
#menu-toggle .menu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  padding: 28px 20px;
  position: relative;
  z-index: 40;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#menu-toggle .menu-icon .navicon {
  background: #A27E49;
  display: block;
  height: 3px;
  position: relative;
  transition: background 0.2s ease-out;
  width: 25px;
}
#menu-toggle .menu-icon .navicon:before, #menu-toggle .menu-icon .navicon:after {
  background: #A27E49;
  content: "";
  display: block;
  height: 100%;
  position: absolute;
  transition: all 0.2s ease-out;
  width: 100%;
}
#menu-toggle .menu-icon .navicon:before {
  top: 8px;
}
#menu-toggle .menu-icon .navicon:after {
  top: -8px;
}
#menu-toggle .menu-btn {
  display: none;
}
#menu-toggle .menu-btn:checked ~ .menu-mobile {
  transform: translateX(0);
}
#menu-toggle .menu-btn:checked ~ .menu-icon .navicon {
  background: transparent;
}
#menu-toggle .menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}
#menu-toggle .menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}
#menu-toggle .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, #menu-toggle .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  top: 0;
}
#menu-toggle .menu-mobile {
  overflow-y: auto; /* Permet le scroll dans la modale */
  position: fixed;
  font-family: "Merriweather", Georgia, serif;
  z-index: 30;
  width: 100%;
  height: 100vh;
  transform: translateX(-100%);
  top: 0;
  left: 0;
  transition: all 0.3s ease-out;
  background: #fff;
}
#menu-toggle .menu-mobile ul {
  padding: 2rem;
}
#menu-toggle .menu-mobile li {
  border-bottom: 1px solid #e0e0e0;
}
#menu-toggle .menu-mobile li:last-child {
  border-bottom: 0;
}
#menu-toggle .menu-mobile li a {
  display: block;
  color: #000000;
  font-weight: 700;
  padding: 1rem 0rem;
  font-size: 2.5rem;
}
#menu-toggle .menu-mobile li ul {
  padding: 0 0 2rem 0;
}
#menu-toggle .menu-mobile li ul li {
  border: 0;
}
#menu-toggle .menu-mobile li ul li a {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  color: #677A88;
  font-weight: 300;
  font-size: 1.8rem;
  padding: 0.5rem 0 0.5rem 2rem;
}
#menu-toggle .menu-mobile li:hover ul {
  display: block;
}
#menu-toggle .menu-mobile-footer li {
  margin-top: 0;
  padding-top: 0;
  Padding-bottom: 0;
  border-bottom: 0;
}
#menu-toggle .menu-mobile-footer li a {
  font-weight: 400;
  font-size: 1.6rem;
}
#menu-toggle .menu-mobile-footer li .select-langue {
  background: transparent;
  border: 0;
  box-shadow: none;
  outline: 0;
  color: #000000;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-size: 1.6rem;
  padding: 1rem 0;
}
#menu-toggle .adresse-mobile {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  padding: 2rem;
  font-size: 1.4rem;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 400;
  color: #A4AFB8;
}
#menu-toggle .adresse-mobile .tel {
  font-weight: bolder;
  font-size: 1.6rem;
  color: #677A88;
}
#menu-toggle .adresse-mobile .btn {
  color: #000000;
  margin-bottom: 3rem;
}
#menu-toggle .adresse-mobile .btn:hover, #menu-toggle .adresse-mobile .btn:focus {
  color: #fff;
}

.breadcrumb {
  position: relative;
  z-index: 1;
}
.breadcrumb ol {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  position: relative;
  z-index: 150;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.breadcrumb li {
  font-size: 1.2rem;
  margin-right: 5px;
  color: #677A88;
}
.breadcrumb li a {
  color: #A27E49;
}
.breadcrumb li a:hover {
  color: #272425;
}

.footer__menu {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  margin-bottom: 2rem;
}
.footer__menu a {
  font-size: 1.35rem;
  display: block;
  padding: 15px 0px 15px 0px;
  color: #878787;
}
.footer__menu a:hover {
  color: #fff;
}
@media screen and (min-width: 800px) {
  .footer__menu a {
    padding: 15px 20px 15px 0px;
  }
}
@media screen and (min-width: 800px) {
  .footer__menu {
    flex-direction: row;
  }
}

.date {
  font-size: 1.2rem;
  color: #677A88;
  margin-bottom: 1.5rem;
  opacity: 0;
}

article.article, article.actu {
  margin-bottom: 8rem;
}
article.article > *:first-child, article.actu > *:first-child {
  margin-top: 0;
}
@media screen and (min-width: 800px) {
  article.article, article.actu {
    display: flex;
    gap: 7vw;
  }
}
article.article > div, article.actu > div {
  flex: 2;
}
article.article > div:first-child, article.actu > div:first-child {
  flex: 1;
}
@media screen and (min-width: 1000px) {
  article.article > div:first-child, article.actu > div:first-child {
    flex: 0.7;
  }
}
article.article p, article.actu p {
  margin: 2rem 0;
}
article.article h1, article.actu h1 {
  font-size: 4.5rem;
  font-weight: 300;
  margin: 3rem 0;
  color: #272425;
}
article.article .light, article.actu .light {
  color: #A4AFB8;
  line-height: 1.2;
  font-size: 1.2rem;
}
article.article .article__chapo, article.article .article__texte, article.actu .article__chapo, article.actu .article__texte {
  opacity: 0;
  position: relative;
}
article.article .article__chapo > *:first-child, article.article .article__texte > *:first-child, article.actu .article__chapo > *:first-child, article.actu .article__texte > *:first-child {
  margin-top: 0;
}
article.article .article__chapo hr, article.article .article__texte hr, article.actu .article__chapo hr, article.actu .article__texte hr {
  margin-top: 4rem;
}
article.article .article__chapo h2, article.article .article__chapo h3, article.article .article__chapo h4, article.article .article__texte h2, article.article .article__texte h3, article.article .article__texte h4, article.actu .article__chapo h2, article.actu .article__chapo h3, article.actu .article__chapo h4, article.actu .article__texte h2, article.actu .article__texte h3, article.actu .article__texte h4 {
  font-weight: 800;
  padding-left: 0;
  margin-bottom: 1rem;
}
article.article .article__chapo h2, article.article .article__texte h2, article.actu .article__chapo h2, article.actu .article__texte h2 {
  font-width: 700;
  font-size: 2.5rem;
  font-weight: 500;
  margin-top: 4rem;
  /* padding-left: 2rem;
   position: relative;

   &:before {
     position: absolute;
     content: '';
     width: 2px;
     height: 100%;
     background: $accent;
     left: 0;
     top: 0;
   }*/
}
article.article .article__chapo h3, article.article .article__texte h3, article.actu .article__chapo h3, article.actu .article__texte h3 {
  font-weight: 300;
  color: #677A88;
}
article.article .article__chapo img, article.article .article__texte img, article.actu .article__chapo img, article.actu .article__texte img {
  width: 100%;
  margin: 4rem 0 3rem;
}
article.article .article__chapo ul, article.article .article__texte ul, article.actu .article__chapo ul, article.actu .article__texte ul {
  margin: 1.5rem 0;
}
article.article .article__chapo ul li, article.article .article__texte ul li, article.actu .article__chapo ul li, article.actu .article__texte ul li {
  display: list-item;
  margin-left: 3rem;
  margin-bottom: 2rem;
  padding-left: 31px;
  background: url(/assets/default/img/puce.svg) no-repeat left top 0px;
}
article.article .article__chapo ul li li, article.article .article__texte ul li li, article.actu .article__chapo ul li li, article.actu .article__texte ul li li {
  padding-left: 0;
  background: none;
  list-style: disc;
  margin: auto;
  margin-left: 1.5rem;
}
article.article .article__chapo ul li h3, article.article .article__texte ul li h3, article.actu .article__chapo ul li h3, article.actu .article__texte ul li h3 {
  margin-bottom: 1rem;
}
article.article section, article.actu section {
  margin: 6rem 0;
}
article.article .article__chapo, article.actu .article__chapo {
  font-weight: 600;
  font-family: "Merriweather", Georgia, serif;
  font-size: 2.5rem;
  line-height: 1.3;
  position: relative;
  margin-top: 0;
  margin-bottom: 6rem;
  text-align: left;
}
article.article .article__chapo:after, article.actu .article__chapo:after {
  position: absolute;
  content: "";
  bottom: -2rem;
  left: 0;
  width: 50px;
  height: 3px;
  background: #A27E49;
}
article.article .article__chapo:empty, article.actu .article__chapo:empty {
  display: none;
}
article.article .illustration, article.actu .illustration {
  padding: 0 0rem 2rem;
}
article.article .illustration a, article.actu .illustration a {
  display: flex;
  justify-content: center;
}
article.article .illustration figcaption, article.actu .illustration figcaption {
  margin-top: 0.75rem;
  font-size: 1.4rem;
  color: #A4AFB8;
}
article.article .cartouche, article.actu .cartouche {
  padding: 3rem;
  margin: 4rem 0;
  background: #E1E4E7;
}
article.article .cartouche > *:first-child, article.actu .cartouche > *:first-child {
  margin-top: 0;
}
article.article .cards, article.actu .cards {
  gap: 3rem;
  margin: 3rem 0;
}
article.article .cards .card, article.actu .cards .card {
  margin: 0 0;
  position: relative;
  border-top: 3px solid #A27E49;
}
article.article .cards .card > *:first-child, article.actu .cards .card > *:first-child {
  font-size: 1.8rem;
  font-weight: 800;
  position: absolute;
  padding: 2rem;
  background: linear-gradient(to bottom, rgba(39, 36, 37, 0.95) 0%, rgba(39, 36, 37, 0) 60%);
  width: 100%;
  color: #fff;
  height: 200px;
}
article.article .cards .card p, article.actu .cards .card p {
  font-size: 1.4rem;
}
article.article .cards .card img, article.actu .cards .card img {
  margin: 0;
  height: 250px;
  -o-object-fit: cover;
     object-fit: cover;
}
article.article .article__encadre, article.actu .article__encadre {
  background: #272425;
  padding: 4rem;
  margin-top: 3rem;
  color: #A4AFB8;
  font-size: 1.4rem;
}
article.article .article__encadre > *:first-child, article.actu .article__encadre > *:first-child {
  margin-top: 0;
  position: relative;
  padding-top: 2rem;
}
article.article .article__encadre > *:first-child:before, article.actu .article__encadre > *:first-child:before {
  position: absolute;
  content: "";
  width: 100px;
  height: 3px;
  background: #A27E49;
  left: 0;
  top: 0;
}
article.article .article__encadre h2, article.article .article__encadre h3, article.article .article__encadre h4, article.actu .article__encadre h2, article.actu .article__encadre h3, article.actu .article__encadre h4 {
  color: #fff;
  font-weight: 800;
}
article.article .article__encadre a, article.actu .article__encadre a {
  color: #fff;
  text-decoration: underline;
}
article.article .article__encadre a:hover, article.actu .article__encadre a:hover {
  color: #A27E49;
}
article.article .article__encadre .btn:after, article.actu .article__encadre .btn:after {
  background: #A27E49;
}
article.article .article__encadre .btn:before, article.actu .article__encadre .btn:before {
  background: #A4AFB8;
}
article.article .article__encadre h2, article.actu .article__encadre h2 {
  margin: 2.5rem 0 2rem;
}
article.article .article__encadre h3, article.actu .article__encadre h3 {
  font-size: 1.8rem;
}
article.article .article__encadre h3, article.article .article__encadre h4, article.actu .article__encadre h3, article.actu .article__encadre h4 {
  margin: 2rem 0 1rem;
}
article.article .article__encadre p, article.actu .article__encadre p {
  margin: 1.6rem 0;
}
article.article .article__encadre iframe, article.actu .article__encadre iframe {
  width: 100%;
  aspect-ratio: 16/9;
}
article.article .article__encadre a.btn:hover, article.actu .article__encadre a.btn:hover {
  color: #fff;
}
article.article .article__documents ul, article.actu .article__documents ul {
  margin-top: 2rem;
  border: 0;
  list-style: none;
}
article.article .article__documents ul li, article.actu .article__documents ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  padding: 2rem 0;
  border-top: 1px solid #A4AFB8;
  border-bottom: 1px solid #A4AFB8;
  background: none;
}
article.article .article__documents ul li:hover, article.actu .article__documents ul li:hover {
  background: #E1E4E7;
}
article.article .article__keywords, article.actu .article__keywords {
  margin: 4rem 0;
}
article.article .article__keywords ul, article.actu .article__keywords ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
article.article .article__keywords ul li, article.actu .article__keywords ul li {
  list-style: none;
  margin: 0;
}
article.article .article__keywords ul li:before, article.actu .article__keywords ul li:before {
  display: none;
}

.articles__slider {
  margin-bottom: 6rem;
}
@media screen and (min-width: 800px) {
  .articles__slider .glide__track {
    max-width: 85vw;
    margin: auto;
  }
}
.articles__slider li {
  border: 1px solid #272425;
  border-radius: 8px;
  padding: 2rem;
  transition: all 0.3s ease-in-out;
}
.articles__slider li:hover {
  background: #A27E49;
}
.articles__slider li:hover h3 a {
  color: #fff;
}
.articles__slider li:hover .date {
  border: 3px solid #000000;
}
.articles__slider .date {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: 800;
  text-align: center;
  width: 100px;
  height: 100px;
  position: relative;
  margin: auto;
  margin-bottom: 3rem;
  background: #272425;
  border: 3px solid #A27E49;
  border-radius: 50vh;
  padding: 17px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}
.articles__slider h3 {
  font-size: 1.6rem;
  line-height: 1.2;
}
.articles__slider .content {
  display: flex;
  flex-direction: column;
  gap: 0rem;
}
.articles__slider .content h3 {
  margin: 0;
}
@media screen and (min-width: 800px) {
  .articles__slider .content {
    flex-direction: row;
    justify-content: center;
    gap: 2rem;
  }
}
.articles__slider .glide__bullets {
  right: 0%;
  left: auto;
  bottom: -4rem;
  transform: none;
}
.articles__slider .glide__bullet {
  background: #000000;
  padding: 8px;
}
.articles__slider .glide__bullet--active {
  background: #A27E49;
}
.articles__slider .glide__arrows {
  display: none;
}
@media screen and (min-width: 800px) {
  .articles__slider .glide__arrows {
    display: block;
  }
}
.articles__slider .glide__arrow {
  border: 0;
  box-shadow: none;
  padding: 0;
  opacity: 0.4;
  top: 30%;
  transition: opacity 0.2s ease-in-out;
}
.articles__slider .glide__arrow:hover {
  opacity: 1;
}
.articles__slider .glide__arrow--left {
  left: -2.5rem;
}
.articles__slider .glide__arrow--right {
  right: -2.5rem;
}
@media screen and (min-width: 800px) {
  .articles__slider .glide__arrow {
    top: 50%;
  }
}
.conseil__mois > div {
  display: flex;
  flex-direction: column;
  margin-bottom: 6rem;
}
@media screen and (min-width: 640px) {
  .conseil__mois > div {
    flex-direction: row;
    gap: 6rem;
  }
}
.conseil__mois > div > h2 {
  margin-top: 0;
}
.conseil__mois > div > h2:before {
  display: none;
}
.conseil__mois .content > *:first-child {
  margin-top: 0;
}
.conseil__mois .content h3 {
  font-size: 3rem;
  font-weight: 800;
}
.conseil__mois .content h3 span {
  font-weight: 300;
}
.conseil__mois .btn {
  margin-top: 4rem;
  padding: 1rem 8rem;
  max-width: 100%;
}

.blogaction__wrapper {
  padding: 6rem 0 0;
}
.blogaction__wrapper .container {
  width: 100%;
  max-width: 100%;
  padding: 0;
}
.blogaction__wrapper .blog__action {
  max-width: 80%;
  margin: auto;
}
@media screen and (min-width: 480px) {
  .blogaction__wrapper .blog__action {
    max-width: none;
    display: flex;
    justify-content: space-between;
    gap: 6rem;
    padding: 0 2rem 6rem 2rem;
  }
}
@media screen and (min-width: 800px) {
  .blogaction__wrapper .blog__action {
    max-width: 90%;
  }
}
@media screen and (min-width: 1000px) {
  .blogaction__wrapper .blog__action {
    max-width: 60%;
  }
}
.blogaction__wrapper .blog__action .encadre {
  justify-self: center;
  flex: 1;
}
.blogaction__wrapper .blog__action .encadre > div {
  max-width: 450px;
  padding: 0 1rem;
  color: #A4AFB8;
  font-size: 1.4rem;
}
.blogaction__wrapper .blog__action .encadre > div h2, .blogaction__wrapper .blog__action .encadre > div h3 {
  font-weight: 800;
  color: #fff;
  margin-top: 0;
}
.blogaction__wrapper .blog__action .encadre > div p {
  margin: 1.5rem 0;
}
.blogaction__wrapper .blog__action .resume {
  justify-self: center;
  flex: 1;
}
.blogaction__wrapper .blog__action .resume > div {
  background: #A27E49;
  border-radius: 8px;
  padding: 4rem;
  font-size: 1.4rem;
  max-width: 450px;
}
.blogaction__wrapper .blog__action .resume > div .resume__titre {
  display: flex;
  gap: 1.5rem;
  align-items: flex-end;
  font-size: 2.1rem;
  line-height: 1;
  font-weight: 500;
  font-family: "Merriweather", Georgia, serif;
  margin-bottom: 2rem;
}
.blogaction__wrapper .action__link {
  background: #F0F2F3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  font-weight: 800;
  position: relative;
  padding-top: 4rem;
  padding-bottom: 6rem;
}
@media screen and (min-width: 480px) {
  .blogaction__wrapper .action__link {
    padding-top: 0;
  }
}
.blogaction__wrapper .action__link p {
  max-width: 80%;
  text-align: center;
}
@media screen and (min-width: 800px) {
  .blogaction__wrapper .action__link p {
    max-width: 500px;
  }
}
.blogaction__wrapper .action__link:before {
  content: "";
  width: 100%;
  height: 150px;
  background: #F0F2F3;
  position: absolute;
  top: -149px;
  left: 0;
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
  z-index: -1;
}

.main__wrapper.animate .date, .main__wrapper.animate .article__chapo, .main__wrapper.animate .article__texte {
  opacity: 0;
  animation-delay: 0.2s;
  animation-duration: 0.6s;
  animation-name: slidedownAnimation;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}

@media screen and (min-width: 800px) {
  article.actu {
    display: flex;
    gap: 7vw;
  }
}
article.actu > div {
  flex: 2;
}
article.actu > div:first-child {
  flex: 1;
}
@media screen and (min-width: 1000px) {
  article.actu > div:first-child {
    flex: 0.7;
  }
}

.actus__slider img {
  -o-object-fit: cover;
     object-fit: cover;
}
.actus__slider li {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
}
@media screen and (min-width: 800px) {
  .actus__slider li {
    grid-template-rows: 1fr 1fr;
  }
}
.actus__slider .date {
  text-transform: uppercase;
  font-size: 1.2rem;
  position: relative;
  margin-bottom: 3rem;
}
.actus__slider .date:after {
  position: absolute;
  content: "";
  height: 3px;
  width: 10px;
  background: #A27E49;
  bottom: -8px;
  left: 0;
}
.actus__slider h3 {
  font-size: 2.5rem;
  line-height: 1.2;
  margin-bottom: 3rem;
}
.actus__slider .illustration {
  position: relative;
}
.actus__slider .illustration img {
  width: 100%;
  height: 100%;
}
.actus__slider .content {
  background: #fff;
  padding: 3rem;
  box-shadow: -30px -15px 37px -31px rgba(0, 0, 0, 0.6);
  border-radius: 4px 4px 0 0;
}
.actus__slider .liens {
  margin-top: 3rem;
}
.actus__slider .liens .btn {
  font-size: 1.2rem;
}
.actus__slider .liens .btn:after {
  display: none;
}
.actus__slider .liens .btn:hover {
  background: transparent;
  border: 1px solid #E1E4E7;
}
.actus__slider .glide__slide {
  height: auto;
}
@media screen and (min-width: 800px) {
  .actus__slider .glide__slide {
    height: 55vh;
  }
}
.actus__slider .glide__bullets {
  left: 80%;
  bottom: 3rem;
}
.actus__slider .glide__bullet {
  background: #000000;
  padding: 8px;
}
.actus__slider .glide__bullet--active {
  background: #A27E49;
}
.actus__slider .glide__arrow {
  border: 0;
  box-shadow: none;
  padding: 0;
  opacity: 0.4;
  top: 30%;
  transition: opacity 0.2s ease-in-out;
}
.actus__slider .glide__arrow:hover {
  opacity: 1;
}
@media screen and (min-width: 800px) {
  .actus__slider li {
    display: grid;
    grid-template-columns: 4fr 1fr 2fr 1fr;
    grid-template-rows: 1fr 6fr;
  }
  .actus__slider .illustration {
    grid-column: 1/span 2;
    grid-row: 1/span 2;
    position: relative;
  }
  .actus__slider .illustration img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
  }
  .actus__slider .content {
    grid-column: 2/span 2;
    grid-row: 2/3;
    position: relative;
    z-index: 10;
    background: #fff;
    padding: 3rem;
    min-height: 500px;
  }
  .actus__slider .glide__arrow {
    top: 50%;
  }
}
@media screen and (min-width: 1200px) {
  .actus__slider .content {
    min-height: 400px;
  }
}

.actus__slider h2 {
  color: #A27E49;
  font-size: 2.5rem;
  line-height: 1.2;
  margin-bottom: 2rem;
}
.actus__slider h2 a {
  color: inherit;
  text-decoration: none;
}
.actus__slider h2 a:hover {
  text-decoration: underline;
}
.actus__slider .resume {
  font-size: 1.6rem;
  line-height: 1.6;
  margin-bottom: 2rem;
}
.actus__slider .content .btn {
  display: inline-block;
  margin-top: 1rem;
}

.module_custom_form h2.surtitre {
  margin-bottom: 2rem;
}

.liste__document > * {
  margin-top: 0;
}
.liste__document .cards--document {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  list-style: none;
}
.liste__document .cards--document .card--document {
  background: none;
  justify-content: space-between;
  padding-bottom: 2rem;
}
.liste__document .cards--document .card--document .content {
  font-size: 1.2rem;
}
.liste__document .cards--document .card--document .content .pill__theme {
  font-size: 1rem;
  margin: 0;
}

.embed-responsive {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
}

.embed-responsive::before {
  display: block;
  content: "";
}


.embed-responsive iframe,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.embed-responsive-16by9::before {
  padding-top: 56.25%;
}

.media__galerie {
  margin: 4rem 0;
}
.media__galerie audio {
  width: auto;
  min-width: 260px;
}
.media__galerie .card {
  border: 1px solid #efefef;
  align-items: center;
  padding: 2rem;
}
.media__galerie .card h3 {
  margin: 2rem 0 2rem;
}
.media__galerie .card .resume {
  font-size: 1.4rem;
  margin: 2rem 0;
}
.media__galerie .card--video {
  padding-top: 0;
  max-width: none;
}
.media__galerie .card--video h3 {
  margin: 1rem 0 0;
}

.galerie {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  margin: 5rem 0 2rem;
}
.galerie figure {
  flex: auto;
  min-width: 220px;
  height: 235px;
  position: relative;
  margin: 0 1px 1px 0;
  transition: all 0.3s ease-out;
  overflow: hidden;
}
.galerie figure img {
  vertical-align: middle;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  transition: all 0.3s ease-out;
  margin: 0 !important;
}
.galerie figure img:hover {
  filter: brightness(100%);
  transform: scale(1.05);
}
.galerie figure:hover {
  /*  box-shadow: 0px 10px 10px -10px #656565;
    margin-top:-4px;
    margin-bottom: 4px;*/
}
.galerie figure:hover figcaption {
  top: 0;
}
.galerie figure figcaption {
  position: absolute;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  top: 100%;
  color: #fff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 15px;
  transition: all 0.3s ease-out;
}
.galerie figure figcaption a {
  color: #fff;
}
.galerie figure figcaption a:hover {
  color: #fff;
}
.galerie figure:nth-child(4n+1) {
  width: 280px;
}
.galerie figure:nth-child(4n+2) {
  width: 420px;
}
.galerie figure:nth-child(4n+3) {
  width: 350px;
}
.galerie figure:nth-child(4n+4) {
  width: 310px;
}
.galerie figure:nth-child(4n+5) {
  width: 280px;
}

.faq__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(430px, 1fr));
  gap: 6rem;
}
.faq__list details summary {
  font-weight: 600;
  font-family: "Merriweather", Georgia, serif;
  color: #fff;
  padding: 3rem 3rem 10rem 3rem;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 70%);
  background-color: #272425;
  cursor: pointer;
  position: relative;
}
.faq__list details summary::marker {
  content: none;
}
.faq__list details summary:after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(/assets/default/img/question-mark.svg);
  background-blend-mode: lighten;
  background-repeat: no-repeat;
  background-position: top 2rem right 2rem;
  background-size: contain;
  opacity: 0.2;
}
.faq__list details > div {
  font-size: 1.4rem;
  padding: 3rem 3rem 8rem 8rem;
  background: #A27E49;
  margin: -8rem 3rem 0 20%;
  clip-path: polygon(0 0%, 100% 0, 100% calc(100% - 60px), 0 100%);
  z-index: 100;
  position: relative;
}
.faq__list details > div:before {
  content: "";
  position: absolute;
  background: url(/assets/default/img/tchat.svg) no-repeat center center;
  background-size: contain;
  top: 3rem;
  left: 1.5rem;
  width: 50px;
  height: 50px;
}

.template_84 {
  padding: 127px 0 0;
}
.template_84 .main__wrapper {
  background: transparent;
  position: relative;
  z-index: 10;
  margin-top: 0;
  padding: 0;
}
.template_84 .main__wrapper .main__container {
  padding: 0;
  max-width: 100%;
  width: 100%;
}
.template_84 .main__wrapper .main__container .banner {
  position: relative;
  min-height: 80vh;
  display: flex;
}
.template_84 .main__wrapper .main__container .banner:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(39, 36, 37, 0.85) 0%, rgba(39, 36, 37, 0.5) 30%, rgba(39, 36, 37, 0.3) 50%);
}
.template_84 .main__wrapper .main__container .banner img {
  position: absolute;
  z-index: 0;
  inset: 0;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  height: 100%;
  width: 100%;
}
.template_84 .main__wrapper .main__container .banner h1 {
  font-size: 3rem;
  max-width: 720px;
  position: relative;
  z-index: 10;
  color: #fff;
  margin: 0;
  padding: 6rem 4rem 18rem 0;
  text-shadow: 0px 0px 3px #272425;
}
@media screen and (min-width: 800px) {
  .template_84 .main__wrapper .main__container .banner h1 {
    padding: 8rem 8rem 25rem 0;
    font-size: 5.5rem;
  }
}
.template_84 .main__wrapper .main__container .banner h1 span {
  font-weight: 200;
}
.template_84 .main__wrapper .main__container .edito {
  position: relative;
  padding: 0 2rem 25rem 2rem;
}
@media screen and (min-width: 640px) {
  .template_84 .main__wrapper .main__container .edito {
    padding: 0 2rem 15rem 2rem;
  }
}
@media screen and (min-width: 800px) {
  .template_84 .main__wrapper .main__container .edito {
    padding: 0 2rem 0 2rem;
  }
}
.template_84 .main__wrapper .main__container .edito .texte {
  margin-top: 0;
  max-width: 450px;
  font-size: 3rem;
}
@media screen and (min-width: 800px) {
  .template_84 .main__wrapper .main__container .edito .texte {
    font-size: 4.5rem;
  }
}
.template_84 .main__wrapper .main__container .edito:before, .template_84 .main__wrapper .main__container .edito:after {
  content: "";
  position: absolute;
  top: -110px;
  left: 0;
  right: 0;
  height: 300px;
  background-color: #272425;
  transform-origin: top center;
  transform: skewY(6deg);
  z-index: 0;
}
.template_84 .main__wrapper .main__container .edito:after {
  bottom: -70px;
  top: auto;
  left: 0;
  right: 0;
  height: 300px;
  transform: skewY(-6deg);
  z-index: 0;
}
@media screen and (min-width: 800px) {
  .template_84 .main__wrapper .main__container .edito:after {
    bottom: -140px;
  }
}
.template_84 .main__wrapper .main__container .testimonial {
  position: absolute;
}
@media screen and (min-width: 800px) {
  .template_84 .main__wrapper .main__container .testimonial {
    position: inherit;
  }
}
.template_84 .main__wrapper .main__container .testimonial__content {
  background: #8EB704;
  width: 100%;
}
.template_84 .main__wrapper .main__container .testimonial__content p {
  font-size: 2.1rem;
}
@media screen and (min-width: 800px) {
  .template_84 .main__wrapper .main__container .testimonial__content p {
    font-size: 4rem;
  }
}
.template_84 .article__wrapper {
  background: #fff;
}
.template_84 .article__wrapper .glide__arrow--left {
  left: 3rem;
}
.template_84 .article__wrapper .glide__arrow--right {
  right: 3rem;
}
.template_84 .article__wrapper .glide__slide img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 80vh;
}
.template_84 .article__wrapper .thumbnails {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  margin-top: 6px;
  margin-bottom: 6rem;
}
.template_84 .article__wrapper .thumbnails > li {
  max-width: 30%;
  overflow: hidden;
}
.template_84 .article__wrapper .thumbnails > li img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 130px;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}
.template_84 .article__wrapper .thumbnails > li img:hover {
  transform: scale(1.1);
}
.template_84 .article__wrapper .article__container {
  padding: 0;
  margin: 0;
  max-width: 100%;
  width: 100%;
}
.template_84 .article__wrapper .article__texte, .template_84 .article__wrapper .article__chapo {
  opacity: 1 !important;
}
.template_84 .article__wrapper .article__chapo {
  font-weight: 500;
  padding-left: 2rem;
  border-left: 3px solid #8EB704;
  border-bottom: 0;
}
.template_84 .article__wrapper .article__chapo:after {
  display: none;
}
.template_84 .article__wrapper .article__chapo span {
  font-weight: 700;
}

.searchform {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.searchform .btn {
  margin: 0 0 0 1rem;
}

.searchform > div {
  position: relative;
}
.searchform > div input.form-control {
  width: 100%;
}
.searchform > div:first-child {
  flex: 1;
}
.searchform > div:last-child {
  flex: 0 0 54px;
}

.searchform_autocomplete_propositions {
  position: absolute;
  margin-top: -1px;
  left: 0;
  border: 1px solid #dfdfdf;
  background: #fdfdfd;
  border-radius: 0 0 3px 3px;
  width: 100%;
  filter: drop-shadow(4px 4px 3px rgba(0, 0, 0, 0.2));
  z-index: 999;
}
.searchform_autocomplete_propositions li {
  padding: 5px 15px;
  font-size: 1.4rem;
  font-weight: bold;
  cursor: pointer;
  list-style: none !important;
  margin: 0 !important;
}
.searchform_autocomplete_propositions li:hover {
  background: #272425;
  color: #fff;
}

.search__wrapper .searchform {
  display: flex;
  max-width: 800px;
  margin: auto;
}
.search__wrapper .searchform > div {
  width: 100%;
}
.search__wrapper .searchform > div input.form-control {
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  border-radius: 20px 0 0 20px;
  line-height: 4rem;
  padding: 0 2rem;
  width: 100%;
}
.search__wrapper .searchform > div input.form-control:focus-visible {
  outline: none;
}
.search__wrapper .searchform > div .searchform_autocomplete_propositions {
  text-align: left;
  left: 20px;
  width: 80%;
  background: white;
  border-color: transparent;
}
.search__wrapper .searchform > div .searchform_autocomplete_propositions li {
  color: #000000;
}
.search__wrapper .searchform .form__submit {
  flex: 0 0 54px;
  padding: 1rem;
  border-radius: 0 20px 20px 0;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  line-height: 4rem;
}
.search__wrapper .searchform .form__submit:focus-visible {
  outline: none;
}
.search__wrapper .searchform .form__submit:hover {
  background: #272425;
  border-color: #272425;
  color: #fff;
}

.search-result .search-result__nbresult {
  font-weight: 800;
  margin-bottom: 2rem;
}
.search-result .search-result__items {
  margin-bottom: 4rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
}
.search-result .search-result__items li {
  padding-top: 1rem;
  margin-top: 1rem;
  border-top: 1px solid #E1E4E7;
}
.search-result .search-result__items li a {
  font-size: 1.8rem;
  font-weight: 800;
}

.societe__infos__frame {
  position: relative;
}
.societe__infos__frame:before {
  position: absolute;
  content: "";
  width: 55vw;
  height: 100%;
  background: #A27E49;
  right: 0;
  top: 8rem;
  z-index: 0;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 80%);
}
.societe__infos__frame .societe_map {
  display: none;
}
@media screen and (min-width: 640px) {
  .societe__infos__frame .societe_map {
    display: block;
  }
}
.societe__infos__frame .societe__infos {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  gap: 0;
  background: #272425;
  padding: 0rem 0rem 2rem 0;
  color: #fff;
  clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%);
}
@media screen and (min-width: 640px) {
  .societe__infos__frame .societe__infos {
    flex-direction: row;
  }
}
.societe__infos__frame .societe__infos > div:first-child {
  padding: 3rem 3rem 3rem 3rem;
  justify-self: flex-end;
  text-align: right;
}
@media screen and (min-width: 640px) {
  .societe__infos__frame .societe__infos > div:first-child {
    padding: 3rem 3rem 3rem 10rem;
  }
}
.societe__infos__frame .societe__infos > div:first-child .mda {
  font-family: "Merriweather", Georgia, serif;
  font-weight: 800;
  font-size: 2.1rem;
  margin-bottom: 1rem;
}
.societe__infos__frame .societe__infos > div:first-child a {
  color: #A27E49;
}
.societe__infos__frame .societe__infos > div:first-child .light {
  font-size: 1.4rem;
  color: #A4AFB8;
}
.societe__infos__frame .societe__infos > div:last-child {
  justify-self: flex-end;
}
.societe__infos__frame .societe__infos > div:last-child #map {
  width: 40vw;
  height: 380px;
}

article.article #btn_contact {
  font-size: 2.1rem;
  font-family: "Merriweather", Georgia, serif;
  font-weight: 300;
}
article.article #btn_contact span {
  font-weight: 800;
  display: block;
}
article.article .societe_top_annonces {
  margin: 0 0 2rem;
  background: #F0F2F3;
  padding: 0rem;
}
@media screen and (min-width: 640px) {
  article.article .societe_top_annonces {
    margin: 0 0 6rem;
    padding: 4rem;
  }
}
article.article .societe_top_annonces h2 {
  text-align: center;
  text-transform: uppercase;
  font-weight: 400;
  letter-spacing: 0.1rem;
  margin-top: 0;
}
article.article .societe_top_annonces h2 span {
  display: block;
  font-weight: 800;
}
article.article .societe_top_annonces > div {
  padding: 2rem;
}
@media screen and (min-width: 640px) {
  article.article .societe_top_annonces > div {
    display: flex;
    gap: 2rem;
    padding: 4rem;
  }
}
article.article .societe_top_annonces > div > div {
  flex: 1;
  color: #272425;
  font-size: 2.1rem;
  font-family: "Merriweather", Georgia, serif;
  font-weight: 800;
  text-align: center;
  padding: 2rem;
  border-radius: 8px;
  border: 1px solid #E1E4E7;
  transition: all 0.3s ease-in-out;
}
article.article .societe_top_annonces > div > div span {
  font-weight: 300;
  font-size: 1.6rem;
  display: block;
}

.main__wrapper .etablissement-card {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  background: #FAFAF8;
  padding: 3.2rem;
}
@media screen and (min-width: 800px) {
  .main__wrapper .etablissement-card {
    flex-direction: row;
    align-items: flex-start;
    gap: 9.6rem;
  }
}
.main__wrapper .etablissement-card__main {
  flex: 1.4;
}
.main__wrapper .etablissement-card__nom {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 300;
  font-size: 4rem;
  margin: 0 0 0.4rem;
  color: #272425;
  font-style: normal;
  text-align: left;
}
.main__wrapper .etablissement-card__lieu {
  font-style: italic;
  font-family: "Merriweather", Georgia, serif;
  color: #A27E49;
  font-size: 1.6rem;
  margin: 0 0 1.6rem;
  text-align: left;
}
.main__wrapper .etablissement-card__media {
  position: relative;
}
.main__wrapper .etablissement-card__media img {
  width: 100%;
  aspect-ratio: 16/6;
  -o-object-position: top;
     object-position: top;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 4px;
  display: block;
}
.main__wrapper .etablissement-card__notes {
  display: flex;
  flex-direction: column;
  max-width: 300px;
}
@media screen and (min-width: 800px) {
  .main__wrapper .etablissement-card__notes {
    flex: 1;
  }
}
.main__wrapper .etablissement-card__notes .rating {
  padding: 1.6rem;
  background: #fff;
  margin-bottom: 1.6rem;
}
.main__wrapper .etablissement-card__action {
  margin-top: 1.2rem;
}
.main__wrapper .etablissement-card__action .btn {
  margin: 0;
}

.badge-qualiscope {
  position: absolute;
  right: 3.2rem;
  bottom: -4rem;
  display: inline-flex;
  flex-direction: column;
  gap: 0.4rem;
  background: #fff;
  border-radius: 4px;
  padding: 2.4rem;
  font-size: 1.6rem;
  color: #677A88;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
.badge-qualiscope__label {
  text-transform: none;
  line-height: 1.1;
  font-weight: 600;
  color: #272425;
}
.badge-qualiscope__caption {
  color: #A4AFB8;
  line-height: 1.1;
}
.badge-qualiscope img {
  max-width: 120px;
  height: auto;
}

.qualiscope-scale {
  display: inline-flex;
  gap: 5px;
  margin: 5px 0;
}
.qualiscope-scale__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 2px;
  font-weight: 700;
  color: #fff;
  font-size: 1.6rem;
  opacity: 0.45;
}
.qualiscope-scale__item--a {
  background: #00973f;
}
.qualiscope-scale__item--b {
  background: #adc90e;
}
.qualiscope-scale__item--c {
  background: #ebc854;
}
.qualiscope-scale__item--d {
  background: #ee7f00;
}
.qualiscope-scale__item.is-active {
  opacity: 1;
  outline: 2px solid rgba(39, 36, 37, 0.5);
}

.etablissement-row {
  --etab-tab-w: 5.2rem;
  --etab-panel-w: 47rem;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.6rem;
  padding: 1.6rem 0;
  border-bottom: 1px solid #E1E4E7;
}
@media screen and (min-width: 800px) {
  .etablissement-row {
    --etab-panel-w: 42rem;
  }
}
.etablissement-row:hover:not(.is-open) {
  background: #FAFAF8;
}
.etablissement-row__main {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.6rem;
  padding-right: calc(var(--etab-tab-w) + 1.2rem);
  transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}
.etablissement-row__infos h3, .etablissement-row__infos h4 {
  font-weight: 300;
  font-size: 2.5rem;
  margin: 0 0 0.4rem;
}
.etablissement-row__lieu {
  font-style: italic;
  color: #A27E49;
  text-align: left !important;
  font-family: Merriweather, serif;
  font-size: 1.4rem;
  margin: 4px 0px 0px;
  white-space: nowrap;
}
.etablissement-row__note {
  flex: 0 0 auto;
  text-align: right;
}
.etablissement-row__note > div {
  display: flex;
  gap: 5rem;
}
.etablissement-row__actions {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  height: 100%;
  width: var(--etab-panel-w);
  display: flex;
  transform: translateX(calc(100% - var(--etab-tab-w)));
  transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}
.etablissement-row__menu {
  flex: 0 0 var(--etab-tab-w);
  width: var(--etab-tab-w);
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #F0F2F3;
  color: #A4AFB8;
  font-size: 1.8rem;
  line-height: 1;
  transition: background 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), color 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.etablissement-row .popover-menu {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.2rem;
  padding: 0 2.4rem;
  background: #A27E49;
  text-align: right;
}
.etablissement-row .popover-menu a {
  color: #FAFAF8;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.1;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.etablissement-row .popover-menu a:hover {
  opacity: 0.78;
}
.etablissement-row.is-open .etablissement-row__main {
  transform: translateX(calc(-1 * (var(--etab-panel-w) - var(--etab-tab-w))));
}
.etablissement-row.is-open .etablissement-row__actions {
  transform: translateX(0);
}
.etablissement-row:hover .etablissement-row__menu, .etablissement-row.is-open .etablissement-row__menu {
  background: #A27E49;
  color: #fff;
}

.cards--societes {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.cards--societes .card--societe {
  flex-direction: row;
  align-items: flex-start;
  gap: 2rem;
  border: 0;
  border-top: 3px solid #A27E49;
}
.cards--societes .card--societe .card__illustration {
  flex: 0.5;
  padding-top: 2rem;
}
.cards--societes .card--societe .card__illustration .card__logo {
  display: flex;
  justify-content: center;
  align-items: center;
}
.cards--societes .card--societe .card__illustration .card__logo img {
  -o-object-fit: contain;
     object-fit: contain;
  max-width: 180px;
}
.cards--societes .card--societe .content {
  flex: 1;
  color: #A4AFB8;
  background: #272425;
  padding: 2rem 2rem 7rem 2rem;
  clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%);
  font-size: 1.4rem;
}
.cards--societes .card--societe .content h3 {
  font-weight: 300;
  font-size: 1.8rem;
}
.cards--societes .card--societe .content h3 a {
  color: #fff;
}
.cards--societes .card--societe .content h3 span {
  font-weight: 800;
}
.cards--societes .card--societe .content p {
  display: flex;
}
.cards--societes .card--societe .content p i {
  display: inline-block;
  margin-right: 0.5rem;
}
.cards--societes .card--societe .content p a {
  color: #fff;
}
.cards--societes .card--societe .content p a:hover {
  color: #A27E49;
}
.cards--societes .card--societe .content p:last-child a {
  font-size: 1rem;
}
.cards--societes .card--societe .content .border--top {
  border-top: 1px solid rgba(103, 122, 136, 0.8);
  margin-top: 2rem;
  padding-top: 2rem;
}

article.annonce .article__chapo {
  background: #efefef;
  padding: 2rem;
  margin-bottom: 3rem;
}
article.annonce .article__chapo > *:first-child {
  margin-top: 0;
}
article.annonce #map {
  width: 100%;
  height: 380px;
  margin-top: 3rem;
  mask-image: linear-gradient(to right, transparent 0px, black 30px, black calc(100% - 30px), transparent 100%), linear-gradient(to bottom, transparent 0px, black 30px, black calc(100% - 30px), transparent 100%);
  -webkit-mask-composite: source-in, xor;
          mask-composite: intersect;
  -webkit-mask-image: linear-gradient(to right, transparent 0px, black 30px, black calc(100% - 30px), transparent 100%), linear-gradient(to bottom, transparent 0px, black 30px, black calc(100% - 30px), transparent 100%);
  -webkit-mask-composite: source-in;
}

#map .leaflet-popup-content-wrapper {
  border-radius: 0;
  border-top: 3px solid #A27E49;
}

.leaflet-popup-content .map__annonces__titre {
  margin-bottom: 1.5rem;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
}
.leaflet-popup-content .map__annonces__titre p {
  margin: 0;
}
.leaflet-popup-content .map__annonces__titre p a {
  color: #272425 !important;
  font-family: "Merriweather", Georgia, serif;
  font-weight: 800;
  font-size: 2.1rem;
}
.leaflet-popup-content .map__annonces__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1rem;
}
.leaflet-popup-content .map__annonces__list div {
  margin-bottom: 1rem;
  padding: 1rem;
  background: #272425;
  border-top: 3px solid #A27E49;
  color: #677A88;
}
.leaflet-popup-content .map__annonces__list div p {
  margin: 0;
}
.leaflet-popup-content .map__annonces__list div .map__annonces__categories {
  color: #fff;
  font-weight: 700;
}
.leaflet-popup-content .map__annonces__list div .prix {
  font-weight: 700;
  margin: 1rem 0;
  font-size: 1.6rem;
}
.leaflet-popup-content .map__annonces__list div .picto {
  display: flex;
  gap: 1rem;
}
.leaflet-popup-content .map__annonces__list div .picto img {
  width: 15px;
  height: 15px;
}
.leaflet-popup-content .map__annonces__list div .btn {
  color: #000000;
  font-size: 1.2rem;
  margin: 1rem 0 0 0;
}
.leaflet-popup-content .map__annonces__list div .btn:hover:before {
  background: #fff;
}
.energy-rating__item {
  display: flex;
  align-items: center;
  position: relative;
  transition: transform 0.2s ease;
  opacity: 0.5;
}
.energy-rating__item:hover {
  transform: translateX(5px);
}
.energy-rating__item.active {
  transform: translateX(10px);
  background-color: transparent;
  opacity: 1;
}
.energy-rating__item--a {
  color: #00a651;
}
.energy-rating__item--b {
  color: #50b848;
}
.energy-rating__item--c {
  color: #c8d400;
}
.energy-rating__item--d {
  color: #fef200;
}
.energy-rating__item--e {
  color: #fbaf3f;
}
.energy-rating__item--f {
  color: #ee7f00;
}
.energy-rating__item--g {
  color: #e4002b;
}

.images__slider .glide__slide img {
  height: 250px;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.process__exit {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.cards--user {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}
.cards--user .card__illustration img {
  border-radius: 50vh;
  max-width: 150px;
  margin: auto;
}

.grid--user {
  grid-template-columns: 1fr 4fr;
  gap: 4rem;
}
.grid--user .card__illustration img {
  border-radius: 50vh;
  margin: auto;
}

.user--contact {
  background: #E1E4E7;
  padding: 1.5rem 3rem 3rem;
  margin: 2rem 0;
}
.user--contact > * {
  margin-top: 0;
}

.user--social {
  display: flex;
  justify-content: center;
  gap: 10px;
}
.user--social li {
  transition: all 0.3s ease-in-out;
}
.user--social li:hover {
  transform: translateY(-6px);
}

.user--share .shareon {
  justify-content: flex-end;
}

#tarteaucitronRoot #tarteaucitronAlertBig {
  background: #272425 !important;
  padding: 50px 0 !important;
}

#tarteaucitronAlertBig #tarteaucitronPrivacyUrl,
#tarteaucitronAlertBig #tarteaucitronPrivacyUrlDialog,
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert,
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert strong {
  font-size: 16px !important;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif !important;
}

span#tarteaucitronDisclaimerAlert {
  display: block !important;
  margin-bottom: 25px !important;
  text-align: center !important;
}

#tarteaucitronAlertBig #tarteaucitronPersonalize,
#tarteaucitronAlertBig #tarteaucitronPersonalize2 {
  border: 1px solid #fff !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #272425 !important;
}
#tarteaucitronAlertBig #tarteaucitronPersonalize:hover,
#tarteaucitronAlertBig #tarteaucitronPersonalize2:hover {
  background: #dedede !important;
  color: #000 !important;
  border-color: #dedede !important;
}
#tarteaucitronAlertBig .tarteaucitronDeny {
  border: 1px solid #fff !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: #dedede !important;
}
#tarteaucitronAlertBig .tarteaucitronDeny:hover {
  background: transparent !important;
  color: #fff !important;
  border-color: #dedede !important;
}
#tarteaucitronAlertBig #tarteaucitronCloseAlert {
  border: 0 !important;
  background: transparent !important;
  color: #aaa !important;
  font-size: 12px !important;
}
#tarteaucitronAlertBig #tarteaucitronCloseAlert:hover {
  background: transparent !important;
  color: #fff !important;
  border: 0;
}

header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: #272425;
  transition: all 0.3s ease-in-out;
  z-index: 200;
}
@media screen and (min-width: 1200px) {
  header {
    filter: drop-shadow(0 -10px 20px rgba(0, 0, 0, 0.4));
  }
}
header .header__logo__container .header__logo__widget {
  position: absolute;
  background: white;
  padding: 2rem;
}
header .header__logo__container .header__logo__widget img {
  width: 154px;
  height: 154px;
}
header .header__logo__container h1 {
  margin: 0;
}
header .header__preheader__container, header .header__menu__container {
  max-width: 100%;
  width: 100%;
  background: #272425;
}
header .header__preheader__container {
  display: none;
}
@media screen and (min-width: 1200px) {
  header .header__preheader__container {
    display: block;
  }
}
header .header__preheader__menu ul {
  display: flex;
  justify-content: flex-end;
}
header .header__preheader__menu ul li {
  padding: 1.5rem 2rem;
}
header .header__preheader__menu a {
  color: #B8B8B8;
  text-transform: uppercase;
  font-size: 1.4rem;
  letter-spacing: 0.15rem;
}
header .header__preheader__menu a:hover {
  color: #fff;
}
header .header__preheader__menu select.select-langue {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: #fff;
  font-size: 1.2rem;
  outline: 0;
}
header .header__preheader__menu select.select-langue option {
  background: #272425;
  color: #B8B8B8;
}
header .header__menu__container {
  background: white;
}
header nav {
  width: 100%;
  position: absolute;
  z-index: 80;
}
@media screen and (min-width: 800px) {
  header nav {
    position: static;
    align-self: flex-end;
  }
}

body:not(#accueil) header .header__logo__widget {
  padding: 1rem;
}
body:not(#accueil) header .header__logo__widget img {
  width: 77px;
  height: 77px;
}
@media screen and (min-width: 800px) {
  body:not(#accueil) header .header__logo__widget {
    padding: 1.5rem;
  }
  body:not(#accueil) header .header__logo__widget img {
    width: 108px;
    height: 108px;
  }
}
@media screen and (min-width: 1200px) {
  body:not(#accueil) header .header__logo__widget {
    padding: 2rem;
  }
  body:not(#accueil) header .header__logo__widget img {
    width: 154px;
    height: 154px;
  }
}

.scroll-down header {
  transform: translate3d(0, -30rem, 0);
}
@media screen and (min-width: 1200px) {
  .scroll-down header {
    transform: translate3d(0, -100%, 0);
  }
}

.scroll-up header {
  transform: translate3d(0, 0, 0);
}

header.animate {
  position: fixed;
}

.pdf header {
  background: transparent;
  padding: 40px;
  margin-bottom: 0px;
  position: static;
}

footer {
  color: #F0F2F3;
}
@media screen and (min-width: 800px) {
  footer {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2rem;
  }
}

.footer__utils {
  margin: 6rem 0 0 0;
}
@media screen and (max-width: 800px) {
  .footer__utils {
    margin-bottom: -13rem;
  }
}
@media screen and (min-width: 800px) {
  .footer__utils {
    width: 470px;
  }
}
.footer__utils .footer__adresse {
  transform: translateY(-130px);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  margin: 0 auto;
}
.footer__utils .footer__adresse .tel {
  display: block;
  margin-top: 1.5rem;
}
.footer__utils .footer__adresse a {
  color: #F0F2F3;
}
.footer__utils .footer__adresse .adresse {
  margin: 2rem 0 3rem;
}
.footer__utils .footer__adresse .logo {
  background: white;
  padding: 25px;
}
.footer__utils .footer__adresse .logo img {
  display: block;
  max-width: 154px;
}

.footer__nav {
  margin: 2rem 0 0 0;
}
.footer__nav .footer__links {
  padding: 3rem 0;
  color: #F0F2F3;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 3rem;
  justify-content: space-between;
}
@media screen and (min-width: 640px) {
  .footer__nav .footer__links {
    flex-direction: row;
  }
}
.footer__nav .footer__links .footer__links__box {
  max-width: 240px;
}
.footer__nav .footer__links a {
  color: #F0F2F3;
  font-size: 1.4rem;
}
.footer__nav .footer__links a:hover {
  color: #fff;
}
.footer__nav .footer__links ul {
  margin: 2rem 0;
  width: 100%;
  max-width: 240px;
}
.footer__nav .footer__links ul li {
  margin: 1rem 0;
}

.copyright a {
  display: inline;
  padding: 0;
}

.hero__wrapper {
  padding: 0;
  background: #F0F2F3;
}
.hero__wrapper > .container {
  max-width: 100%;
  padding: 0;
  position: relative;
}
.hero__wrapper .slide {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 70vh;
  padding: 4rem 0;
  position: relative;
}
@media screen and (min-width: 800px) {
  .hero__wrapper .slide {
    height: 70vh;
    padding: 0;
  }
}
.hero__wrapper .slide:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(39, 36, 37, 0.5);
  z-index: 1;
  background-size: cover;
  background-position: center;
  background-image: url("/assets/default/img/hero_home_xs.webp");
}
@media screen and (min-width: 640px) {
  .hero__wrapper .slide:before {
    background-image: url("/assets/default/img/hero_home_sm.webp");
  }
}
@media screen and (min-width: 800px) {
  .hero__wrapper .slide:before {
    background-image: url("/assets/default/img/hero_home_md.webp");
  }
}
@media screen and (min-width: 1000px) {
  .hero__wrapper .slide:before {
    background-image: url("/assets/default/img/hero_home_lg.webp");
  }
}
@media screen and (min-width: 1200px) {
  .hero__wrapper .slide:before {
    background-image: url("/assets/default/img/hero_home_xl.webp");
  }
}
@media screen and (min-width: 1440px) {
  .hero__wrapper .slide:before {
    background-image: url("/assets/default/img/hero_home.webp");
  }
}
.hero__wrapper .slide > div {
  background: rgba(255, 255, 255, 0.8);
  margin: 0 2rem;
  position: relative;
  z-index: 3;
  max-width: 66rem;
  padding: 3rem 2.4rem;
  border-radius: 1rem;
}
@media screen and (min-width: 800px) {
  .hero__wrapper .slide > div {
    margin: 15vh 0 0 40vw;
    padding: 5rem;
  }
}
.hero__wrapper .slide h1 {
  font-size: clamp(2.5rem, 8vw + 1rem, 4rem);
  line-height: 1.1;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  max-width: 600px;
  margin: 0 0 1.5rem;
  opacity: 0;
  animation-delay: 0s;
  animation-duration: 1s;
  animation-name: slidedownAnimation;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
.hero__wrapper .slide h1 span {
  color: #A27E49;
}
.hero__wrapper .slide p {
  font-size: 1.8rem;
}
.hero__wrapper .slide .btn {
  margin-bottom: 0;
}

.mobilemenu__wrapper {
  display: none;
}

.edito__wrapper {
  color: #fff;
  padding: 4rem 0 13rem;
  position: relative;
  background: linear-gradient(180deg, #BA9E67 50%, #a4864a 100%);
}
.edito__wrapper .container {
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 800px) {
  .edito__wrapper {
    padding: 2rem 0 13rem;
  }
  .edito__wrapper .container {
    padding: 0;
  }
  .edito__wrapper:before {
    top: -30px;
    height: 140px;
  }
}
.edito__wrapper:before {
  content: "";
  position: absolute;
  top: -170px;
  left: 0;
  right: 0;
  height: 300px;
  background-color: #BA9E67;
  /* use inset so the shadow is drawn inside the pseudo-element */
  box-shadow: inset 0 30px 34px rgba(39, 36, 37, 0.18);
  transform-origin: top center;
  transform: skewY(-6deg);
  z-index: 1;
}
.edito__wrapper:after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-image: url("/assets/default/img/wedoxa_background_text_white.svg");
  background-repeat: no-repeat;
  background-position: bottom right;
  background-size: contain;
  opacity: 0.05;
  z-index: 50;
  pointer-events: none;
}

.edito {
  padding: 0 2rem;
}
@media screen and (min-width: 800px) {
  .edito {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    gap: 4rem;
    padding: 0;
  }
}
.edito h2 {
  font-weight: 600;
  margin-bottom: 0;
}
@media screen and (max-width: 800px) {
  .edito h2 {
    margin-top: 0;
  }
}
.edito .chiffres {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 5rem 2rem;
  margin: 1.5rem 0 5rem;
}
.edito .chiffres > div {
  max-width: 220px;
  position: relative;
}
.edito .chiffres > div span {
  font-size: 4rem;
  font-weight: 100;
  color: #fff;
  line-height: 1;
  display: block;
  margin-bottom: 1rem;
}
.edito .chiffres > div p {
  color: #000000;
  font-weight: 600;
}
.edito .chiffres > div:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3rem;
  width: 60px;
  height: 4px;
  background: rgba(255, 255, 255, 0.2);
  display: block;
  margin: auto;
}
@media screen and (min-width: 800px) {
  .edito .chiffres {
    display: flex;
    justify-content: space-between;
    margin: 0rem 0 6rem;
  }
  .edito .chiffres > div span {
    font-size: 6rem;
  }
}

.recherche__form__wrapper, .main__wrapper {
  background: white;
}
.recherche__form__wrapper .container, .main__wrapper .container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.recherche__form__wrapper .recherche_etablissements, .main__wrapper .recherche_etablissements {
  transform: translateY(-100px);
  background: #FAFAF8;
  border-radius: 0.8rem;
  box-shadow: -814px 240px 238px 0 rgba(117, 117, 117, 0), -521px 153px 217px 0 rgba(117, 117, 117, 0.01), -293px 86px 183px 0 rgba(117, 117, 117, 0.05), -130px 38px 136px 0 rgba(117, 117, 117, 0.09), -33px 10px 75px 0 rgba(117, 117, 117, 0.1);
  display: flex;
  flex-direction: column;
  gap: 3rem;
  padding: 3rem 2rem;
  max-width: 1000px;
  margin: 0 2rem;
}
@media screen and (min-width: 800px) {
  .recherche__form__wrapper .recherche_etablissements, .main__wrapper .recherche_etablissements {
    flex-direction: row;
    gap: 6rem;
    padding: 4rem;
    margin: 0;
  }
}
.recherche__form__wrapper .recherche_etablissements > div, .main__wrapper .recherche_etablissements > div {
  flex: 0.6;
}
.recherche__form__wrapper .recherche_etablissements > form, .main__wrapper .recherche_etablissements > form {
  flex: 1;
}
.recherche__form__wrapper h2, .main__wrapper h2 {
  font-family: "Merriweather", Georgia, serif;
  color: #A27E49;
  font-size: 3.6rem;
  font-weight: 300;
  line-height: 1.2;
  font-style: italic;
  text-align: left;
  margin: 20px 0;
}
.recherche__form__wrapper p, .main__wrapper p {
  text-align: left;
}
.glide__arrow {
  top: unset;
  bottom: 4rem;
}
.glide__arrow img {
  opacity: 0.5;
}
.glide__arrow:hover img {
  opacity: 1;
}

.accompagne__wrapper {
  background: #fff;
  padding: 6rem 0 0;
}
.accompagne__wrapper .accompagne__container {
  padding-bottom: 8rem;
}
.accompagne__wrapper h2 {
  margin-top: 0;
  font-weight: 700;
  font-size: 2.5rem;
}
@media screen and (min-width: 640px) {
  .accompagne__wrapper .accompagne__widget > div:last-child {
    display: flex;
    align-items: flex-start;
    gap: 6rem;
  }
}
.accompagne__wrapper .accompagne__widget > div:last-child > div:first-child {
  max-width: 260px;
}
@media screen and (max-width: 640px) {
  .accompagne__wrapper .accompagne__widget > div:last-child > div:first-child {
    margin-bottom: 2rem;
  }
}
.accompagne__wrapper .accompagne__widget > div:last-child > div:last-child {
  flex: 1;
  min-width: 0;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider {
  position: relative;
  z-index: 3;
  /*.glide__arrow {
    top: unset;
    bottom: -7rem;
  }

  .glide__arrow--left {
    left: unset;
    right: 4rem;
  }

  .glide__arrow--right {
    right: 0;
  }*/
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .glide__slide {
  height: auto;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .glide__bullets {
  left: 0;
  bottom: -4rem;
  transform: none;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .glide__bullet--active {
  background: #A27E49;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .glide__arrow {
  top: unset;
  bottom: 4rem;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .glide__arrow--left {
  left: -14rem;
  right: unset;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .glide__arrow--right {
  right: unset;
  left: -10rem;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .slide {
  display: flex;
  flex-direction: column;
  background: linear-gradient(141.83deg, #A27E49 -27.79%, #BA9E67 100%);
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .slide > img {
  height: 210px;
  -o-object-fit: cover;
     object-fit: cover;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .slide div {
  padding: 3rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .slide div h3 {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-weight: 300;
  font-size: 3rem;
  margin-top: 0;
  color: #fff;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .slide div p {
  font-size: 1.6rem;
  font-weight: 300;
  color: #fff;
}
.accompagne__wrapper .accompagne__widget > div:last-child .accompagne__slider .slide div .btn--transparent {
  color: #fff;
  border-color: #fff;
  margin-bottom: 0;
}

.comment__wrapper {
  background: #F0F2F3;
  position: relative;
}
.comment__wrapper:before {
  content: "";
  position: absolute;
  top: -170px;
  left: 0;
  right: 0;
  height: 300px;
  background-color: #F0F2F3;
  transform-origin: top center;
  transform: skewY(-6deg);
  z-index: 0;
}

.secteur__wrapper {
  background: linear-gradient(180deg, #f0f2f3 0%, #fff 40%);
  padding: 6rem 0;
}
.secteur__wrapper h2 {
  font-weight: 700;
  font-size: 2.5rem;
  margin: 0 0 4rem 0;
  color: #A27E49;
}
.secteur__wrapper .glide__slide {
  padding-bottom: 10rem;
}
.secteur__wrapper .glide__slide .slide__content {
  box-shadow: 0 65px 41px -55px rgba(39, 36, 37, 0.5);
}
.secteur__wrapper .glide__slide .slide__content > div {
  background: #f8f8f8;
  border-radius: 1rem;
  padding: 6rem 6rem 12rem 6rem;
  position: relative;
}
.secteur__wrapper .glide__slide .slide__content > div img {
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  left: auto;
  height: 100%;
  width: 65%;
  border-radius: 0 1rem 1rem 0;
  -o-object-fit: cover;
     object-fit: cover;
  clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
}
.secteur__wrapper .glide__slide .slide__content > div > div {
  position: relative;
  z-index: 1;
}
.secteur__wrapper .glide__slide .content__secteur {
  padding: 3rem;
  background: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border-radius: 1rem;
  max-width: 600px;
}
.secteur__wrapper .glide__slide .content__secteur h3 {
  margin-top: 0;
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  color: #272425;
  font-size: 2.5rem;
}
.secteur__wrapper .glide__slide .content__secteur ul li {
  position: relative;
  margin-left: 3rem;
  display: list-item;
  margin-bottom: 1.5rem;
}
.secteur__wrapper .glide__slide .content__secteur ul li::before {
  content: "";
  position: absolute;
  left: -3rem;
  top: -2px; /* monte ou descend l’image */
  width: 24px;
  height: 24px;
  background-image: url("/assets/default/img/puce.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
.secteur__wrapper .glide__arrow {
  top: 70%;
}
.secteur__wrapper .glide__arrow--left {
  left: 50px;
}
.secteur__wrapper .glide__arrow--right {
  right: auto;
  left: 85px;
}

.engagement__wrapper {
  background: white;
  padding: 6rem 0 12rem;
}
.engagement__wrapper .engagement__container {
  padding-bottom: 8rem;
}
.engagement__wrapper h2 {
  margin: 0 0 20px 0;
  font-weight: 700;
  font-size: 2.5rem;
  text-align: right;
  color: #A27E49;
}
.engagement__wrapper p {
  text-align: right;
}
@media screen and (min-width: 640px) {
  .engagement__wrapper .engagement__widget > div:last-child {
    display: flex;
    align-items: flex-start;
    gap: 6rem;
  }
}
.engagement__wrapper .engagement__widget > div:last-child > div:first-child {
  max-width: 260px;
}
@media screen and (max-width: 640px) {
  .engagement__wrapper .engagement__widget > div:last-child > div:first-child {
    margin-bottom: 2rem;
  }
}
.engagement__wrapper .engagement__widget > div:last-child > div:last-child {
  flex: 1;
  min-width: 0;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider {
  position: relative;
  z-index: 3;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider p {
  text-align: left;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .glide__slide {
  height: auto;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .glide__arrow {
  bottom: -2rem;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .glide__bullets {
  left: 0;
  bottom: -4rem;
  transform: none;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .glide__bullet--active {
  background: #A27E49;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .glide__arrow--left {
  left: -14rem;
  right: unset;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .glide__arrow--right {
  right: unset;
  left: -10rem;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .slide {
  display: flex;
  flex-direction: column;
  background: #F0F2F3;
  padding: 4rem 2rem;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .slide > img {
  width: 100px;
  margin-left: 2rem;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .slide div {
  padding: 2rem 2rem;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .slide div h3 {
  font-size: 2.5rem;
  margin: 0 0 0.5rem;
  font-weight: 600;
}
.engagement__wrapper .engagement__widget > div:last-child .engagement__slider .slide div p {
  font-size: 1.6rem;
  font-weight: 400;
}

.edito__wrapper.animate .widget, .edito__wrapper.animate form, .recherche__form__wrapper.animate .widget, .recherche__form__wrapper.animate form, .accompagne__wrapper.animate .widget, .accompagne__wrapper.animate form, .comment__wrapper.animate .widget, .comment__wrapper.animate form, .secteur__wrapper.animate .widget, .secteur__wrapper.animate form, .engagement__wrapper.animate .widget, .engagement__wrapper.animate form {
  opacity: 0;
  animation-delay: 0.2s;
  animation-duration: 0.6s;
  animation-name: slidedownAnimation;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
.edito__wrapper.animate h2, .recherche__form__wrapper.animate h2, .accompagne__wrapper.animate h2, .comment__wrapper.animate h2, .secteur__wrapper.animate h2, .engagement__wrapper.animate h2 {
  opacity: 0;
  animation-delay: 0.6s;
  animation-duration: 0.6s;
  animation-name: slidedownAnimation;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}

/* ============================================================
   WeDoxa — « Comment ça marche ? » parallaxe sticky
   Composant autonome. Préfixe .ccm pour éviter les collisions.
   Réglages via variables CSS sur .ccm (voir --panel / --step-len).
   ============================================================ */
.ccm {
  /* Palette */
  --ccm-gold: #a27e49;
  --ccm-ink: #272425;
  --ccm-c1: #756388; /* Encadrer  */
  --ccm-c2: #ba9e67; /* Construire */
  --ccm-c3: #75afa6; /* Enquêter  */
  --ccm-c4: #df6e49; /* Analyser  */
  --ccm-c5: #638874; /* Communiquer */
  /* Réglages scroll (peuvent être surchargés par le site hôte / JS) */
  --panel: 100vh; /* hauteur du panneau épinglé (= hauteur visible du conteneur) */
  --step-len: 70vh; /* distance de scroll par étape */
  color: #111;
}

.ccm *,
.ccm *::before,
.ccm *::after {
  box-sizing: border-box;
}

/* Piste de scroll : sa hauteur définit la durée du défilement */
.ccm__scroll {
  position: relative;
  height: calc(var(--panel) + 4 * var(--step-len));
}

/* Panneau épinglé */
.ccm__stage {
  position: sticky;
  top: 0;
  height: var(--panel);
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}

/* Filigrane « We » discret en fond */
.ccm__wm {
  position: absolute;
  right: 2%;
  top: 50%;
  transform: translateY(-50%);
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: clamp(240px, 34vw, 560px);
  line-height: 1;
  color: rgba(39, 36, 37, 0.035);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  z-index: 0;
}

/* ---- En-tête ---- */
.ccm__head {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 0 24px;
  margin: 0 auto 36px;
  max-width: 980px;
}

.ccm__kicker {
  margin: 0 0 14px;
  font-weight: 700;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.32;
  color: var(--ccm-gold);
}

.ccm__intro {
  margin: 0;
  font-size: clamp(16px, 1.6vw, 22px);
  line-height: 1.5;
  color: #1a1a1a;
}

/* ---- Corps : image | liste ---- */
.ccm__body {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(24px, 5vw, 72px);
  align-items: center;
  width: min(1200px, 92%);
  margin: 0 auto;
}

/* Image gauche (empilement + fondu) */
.ccm__media {
  position: relative;
  aspect-ratio: 11/10;
  width: 100%;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 18px 40px -24px rgba(39, 36, 37, 0.5);
  background: #eceae8;
}

.ccm__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  opacity: 0;
  transform: scale(1.04);
  transition: opacity 0.6s ease, transform 1.2s ease;
}

.ccm__media img.is-active {
  opacity: 1;
  transform: scale(1);
}

/* Liste droite */
.ccm__list {
  position: relative;
  padding-left: clamp(24px, 4vw, 56px);
  /* ligne pointillée verticale */
  border-left: 2px dotted rgba(162, 126, 73, 0.55);
}

.ccm__step {
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: start;
  -moz-column-gap: 14px;
       column-gap: 14px;
  padding: 10px 0;
}

/* Badge numéroté (visible uniquement sur l'étape active) */
.ccm__badge {
  grid-row: 1;
  grid-column: 1;
  width: 44px;
  height: 44px;
  margin-top: 6px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 600;
  font-size: 22px;
  line-height: 1;
  background: var(--c);
  box-shadow: 0 0 0 8px color-mix(in srgb, var(--c) 26%, transparent);
  opacity: 0;
  transform: scale(0.6);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.ccm__step.is-active .ccm__badge {
  opacity: 1;
  transform: scale(1);
}

/* Titre d'étape */
.ccm__title {
  grid-row: 1;
  grid-column: 2;
  align-self: center;
  font-family: "Merriweather", Georgia, serif;
  font-weight: 300;
  font-style: italic;
  font-size: 32px;
  line-height: 1.2;
  color: rgba(39, 36, 37, 0.4);
  transition: color 0.4s ease, font-size 0.4s ease;
}

.ccm__step.is-active .ccm__title {
  color: var(--ccm-ink);
  font-size: 45px;
}

/* Sous-items (déroulé fluide sur l'étape active) */
.ccm__items {
  grid-row: 2;
  grid-column: 2;
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 0.45s ease, opacity 0.4s ease;
}

.ccm__step.is-active .ccm__items {
  grid-template-rows: 1fr;
  opacity: 1;
}

.ccm__items > ul {
  overflow: hidden;
  margin: 0;
  padding: 6px 0 0;
  list-style: none;
}

.ccm__items li {
  font-size: 22px;
  line-height: 1.5;
  color: #000;
}

/* Rail / scrollbar de progression à droite */
.ccm__rail {
  position: absolute;
  top: 8%;
  bottom: 8%;
  right: max(12px, 3%);
  width: 6px;
  border-radius: 40px;
  background: #f2f2f2;
  z-index: 3;
}

.ccm__thumb {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 20%;
  border-radius: 40px;
  background: #d9d9d9;
  transition: transform 0.25s ease;
}

/* ---- Responsive : empilement ---- */
@media (max-width: 860px) {
  .ccm {
    --panel: 88vh;
    --step-len: 78vh;
  }
  .ccm__body {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .ccm__media {
    max-height: 34vh;
    aspect-ratio: 16/10;
  }
  .ccm__list {
    padding-left: 20px;
  }
  .ccm__step {
    grid-template-columns: 46px 1fr;
  }
  .ccm__title {
    font-size: 26px;
  }
  .ccm__step.is-active .ccm__title {
    font-size: 32px;
  }
  .ccm__items li {
    font-size: 18px;
  }
  .ccm__rail {
    right: 6px;
  }
}
/* Accessibilité : réduit le mouvement */
@media (prefers-reduced-motion: reduce) {
  .ccm__media img,
  .ccm__badge,
  .ccm__title,
  .ccm__items,
  .ccm__thumb {
    transition-duration: 0.01ms;
  }
}
.titrepage__wrapper > .titrepage__container {
  max-width: 100%;
  padding: 0;
  position: relative;
  border-bottom: 4px solid #A27E49;
}
.titrepage__wrapper .article_titre {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(180deg, rgba(39, 36, 37, 0.85) 0%, rgba(39, 36, 37, 0.4) 30%, rgba(39, 36, 37, 0.2) 50%);
}
.titrepage__wrapper .article_titre > div {
  height: 100%;
  padding: 0 2rem 2.4rem;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: column;
}
@media screen and (min-width: 640px) {
  .titrepage__wrapper .article_titre > div {
    padding: 0 6rem;
    justify-content: center;
  }
}
.titrepage__wrapper h1 {
  color: #fff;
  margin: 0;
  max-width: 800px;
  opacity: 0;
  font-size: 4.5rem;
  text-shadow: 0px 0px 3px #272425;
  opacity: 0;
  animation-delay: 0s;
  animation-duration: 1s;
  animation-name: slidedownAnimation;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
@media screen and (max-width: 640px) {
  .titrepage__wrapper h1 {
    font-size: 3rem;
  }
}
.titrepage__wrapper .surtitre {
  color: #fff;
  margin: 0;
  max-width: 800px;
  font-weight: 400;
  opacity: 0;
  text-shadow: 0px 0px 3px #272425;
  opacity: 0;
  animation-delay: 0.5s;
  animation-duration: 1s;
  animation-name: slidedownAnimation;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
@media screen and (max-width: 640px) {
  .titrepage__wrapper .surtitre {
    font-size: 1.8rem;
  }
}
.titrepage__wrapper img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  aspect-ratio: 1.6;
  height: auto;
  width: 100%;
}
@media screen and (min-width: 640px) {
  .titrepage__wrapper img {
    height: auto;
    aspect-ratio: 1.4545454545;
  }
}
@media screen and (min-width: 800px) {
  .titrepage__wrapper img {
    aspect-ratio: 2.6666666667;
  }
}

.template_78 .titrepage__wrapper .article_titre > div, .template_79 .titrepage__wrapper .article_titre > div {
  justify-content: flex-end;
  padding-bottom: 8rem;
}

.template_79 .titrepage__wrapper img {
  aspect-ratio: unset;
  height: 75vh;
}
@media screen and (min-width: 480px) {
  .template_79 .titrepage__wrapper img {
    aspect-ratio: unset;
    height: 60vh;
  }
}
@media screen and (min-width: 640px) {
  .template_79 .titrepage__wrapper img {
    aspect-ratio: unset;
    height: 80vh;
  }
}
@media screen and (min-width: 800px) {
  .template_79 .titrepage__wrapper img {
    aspect-ratio: 16/9;
    height: auto;
  }
}
@media screen and (min-width: 1000px) {
  .template_79 .titrepage__wrapper img {
    aspect-ratio: 16/8;
    height: auto;
  }
}
@media screen and (min-width: 1200px) {
  .template_79 .titrepage__wrapper img {
    aspect-ratio: 16/6;
    height: auto;
  }
}
.template_79 .titrepage__wrapper .article_titre > div {
  position: relative;
}
.template_79 .titrepage__wrapper .article_titre > div h1, .template_79 .titrepage__wrapper .article_titre > div h2 {
  color: #272425;
}
.template_79 .titrepage__wrapper .article_titre > div img {
  width: 160px;
  height: auto;
  -o-object-fit: unset;
     object-fit: unset;
  aspect-ratio: auto;
  -o-object-position: center;
     object-position: center;
  overflow: visible;
}
@media screen and (min-width: 480px) {
  .template_79 .titrepage__wrapper .article_titre > div img {
    width: 180px;
  }
}
@media screen and (min-width: 640px) {
  .template_79 .titrepage__wrapper .article_titre > div img {
    width: 200px;
  }
}
@media screen and (min-width: 800px) {
  .template_79 .titrepage__wrapper .article_titre > div img {
    width: 260px;
  }
}
@media screen and (min-width: 1000px) {
  .template_79 .titrepage__wrapper .article_titre > div img {
    width: auto;
    -o-object-fit: unset;
       object-fit: unset;
    aspect-ratio: auto;
  }
}

.ariane__wrapper {
  background: #fff;
  padding: 26px 0;
  font-size: 1.4rem;
}

.main__wrapper {
  background: #fff;
  padding: 2rem 0 4rem;
}

.contact__wrapper {
  background: #fff;
  padding: 6rem 0;
}
.contact__wrapper .bloc__contact {
  max-width: 1000px;
  margin: 0 auto;
}
@media screen and (min-width: 800px) {
  .contact__wrapper .bloc__contact {
    display: flex;
    gap: 4rem;
    justify-content: space-around;
  }
}
.contact__wrapper .bloc__contact .rdv {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
  padding: 4rem;
  background: #A27E49;
  border-radius: 10px;
  flex: 1;
  text-align: center;
  margin-bottom: 4rem;
}
@media screen and (min-width: 800px) {
  .contact__wrapper .bloc__contact .rdv {
    max-width: 400px;
    margin-bottom: 0;
  }
}
.contact__wrapper .bloc__contact .rdv h4 {
  font-size: 2.5rem;
  max-width: 250px;
  margin: 0;
  line-height: 1.2;
}
.contact__wrapper .bloc__contact .rdv p {
  max-width: 350px;
  margin: 0;
}
.contact__wrapper .bloc__contact .rdv .btn {
  margin: 0;
}
.contact__wrapper .bloc__contact .rdv .btn:after {
  background: #fff;
}
.contact__wrapper .bloc__contact .map {
  background: #FBFBFB;
  border-radius: 10px;
  flex: 1.5;
  max-width: 600px;
  position: relative;
}
.contact__wrapper .bloc__contact .map > div {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 4rem;
  background: url(/assets/default/img/map.png);
  background-repeat: no-repeat;
  background-position: bottom right;
  background-blend-mode: darken;
  background-size: 60%;
}
@media screen and (min-width: 640px) {
  .contact__wrapper .bloc__contact .map > div {
    background-position: center right;
    background-size: contain;
  }
}
.contact__wrapper .bloc__contact .map > div h4 {
  font-size: 2.5rem;
  max-width: 250px;
  margin-bottom: 10rem;
  line-height: 1.2;
  padding-left: 2rem;
  position: relative;
  font-weight: 300;
}
@media screen and (min-width: 640px) {
  .contact__wrapper .bloc__contact .map > div h4 {
    margin: 0;
  }
}
.contact__wrapper .bloc__contact .map > div h4 span {
  font-weight: 700;
  display: block;
}
.contact__wrapper .bloc__contact .map > div h4:before {
  position: absolute;
  content: "";
  width: 2px;
  height: 100%;
  background: #A27E49;
  left: 0;
  top: 0;
}
.contact__wrapper .bloc__contact .map > div .btn {
  margin: auto;
  margin-top: 10rem;
}

.garanties__wrapper {
  background: #fff;
  padding: 6rem 6rem;
}
.garanties__wrapper .bloc__garanties {
  max-width: 1000px;
  margin: 0 auto;
}
.garanties__wrapper .bloc__garanties .logo {
  margin-bottom: 4rem;
}
@media screen and (min-width: 800px) {
  .garanties__wrapper .bloc__garanties .logo {
    display: flex;
    align-items: flex-end;
    gap: 4rem;
  }
}
.garanties__wrapper .bloc__garanties .logo img {
  margin: auto;
}
.garanties__wrapper .bloc__garanties .logo > div {
  flex: 1;
  padding: 6px 2rem;
  text-transform: uppercase;
  font-size: 1.6rem;
  letter-spacing: 0.15rem;
  background: #A27E49;
  text-align: center;
  color: #fff;
  margin-top: 2rem;
}
@media screen and (min-width: 800px) {
  .garanties__wrapper .bloc__garanties .logo > div {
    text-align: left;
    color: #000000;
    margin-top: 0;
  }
}
.garanties__wrapper .bloc__garanties .garanties {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: center;
}
@media screen and (min-width: 800px) {
  .garanties__wrapper .bloc__garanties .garanties {
    flex-direction: row;
    justify-content: space-between;
    gap: 4rem;
  }
}
.garanties__wrapper .bloc__garanties .garanties > div {
  max-width: 300px;
}
.garanties__wrapper .bloc__garanties .garanties h5 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  font-size: 2.1rem;
  font-weight: 600;
  margin-bottom: 1rem;
}
.garanties__wrapper .bloc__garanties .garanties p {
  font-size: 1.4rem;
  text-align: center;
  color: #677A88;
}
@media screen and (min-width: 800px) {
  .garanties__wrapper .bloc__garanties .garanties p {
    font-size: 1.2rem;
  }
}

.conseils__wrapper {
  padding: 6rem 0 6rem;
  color: #fff;
  position: relative;
}
.conseils__wrapper:before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 150px;
  background-color: #fff;
  clip-path: polygon(0 0, 100% 0, 0 100%);
  z-index: 0;
}
.conseils__wrapper .bloc__conseils {
  width: 80%;
  max-width: 1000px;
  margin: 0 auto;
}
.conseils__wrapper .bloc__conseils > div:last-child {
  text-align: center;
}
.conseils__wrapper .bloc__conseils > div:last-child .btn--transparent {
  border: 1px solid #fff;
  color: #fff;
  margin-top: 6rem;
}
.conseils__wrapper .bloc__conseils h2 {
  font-size: 3rem;
  font-weight: 200;
  color: #677A88;
  text-align: right;
  border-bottom: 1px solid #677A88;
  padding-bottom: 3rem;
}
.conseils__wrapper .bloc__conseils h2 span {
  color: #A27E49;
  display: block;
}
.conseils__wrapper .bloc__conseils .conseils {
  margin-top: 4rem;
}
@media screen and (min-width: 800px) {
  .conseils__wrapper .bloc__conseils .conseils {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6rem;
  }
}
.conseils__wrapper .bloc__conseils .conseils > div {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin-bottom: 4rem;
}
@media screen and (min-width: 1000px) {
  .conseils__wrapper .bloc__conseils .conseils > div {
    margin-bottom: 0;
    flex-wrap: nowrap;
  }
}
.conseils__wrapper .bloc__conseils .conseils > div > div {
  flex: 1;
}
.conseils__wrapper .bloc__conseils .conseils > div > div h3 a {
  color: #A27E49;
  font-size: 1.6rem;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  margin: 0 0 1rem 0;
}
.conseils__wrapper .bloc__conseils .conseils > div > div p {
  font-size: 1.2rem;
  color: #fff;
  min-width: 200px;
}
.conseils__wrapper .bloc__conseils .conseils > div img {
  min-width: 200px;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
}

.blogproduits__wrapper {
  background: #fff;
  padding: 4rem 0;
}
.blogproduits__wrapper .container {
  max-width: 1200px;
}
.blogproduits__wrapper .blog__produits {
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
@media screen and (min-width: 800px) {
  .blogproduits__wrapper .blog__produits {
    grid-template-columns: repeat(auto-fit, minmax(200px, 200px));
  }
}
@media screen and (min-width: 1000px) {
  .blogproduits__wrapper .blog__produits {
    grid-template-columns: repeat(auto-fit, minmax(200px, 227px));
  }
}
@media screen and (min-width: 1200px) {
  .blogproduits__wrapper .blog__produits {
    grid-template-columns: repeat(auto-fit, minmax(200px, 274px));
  }
}
.blogproduits__wrapper .blog__produits > div {
  aspect-ratio: 9/12;
  position: relative;
}
.blogproduits__wrapper .blog__produits > div .bg {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.blogproduits__wrapper .blog__produits > div .bg img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center bottom;
     object-position: center bottom;
  height: 100%;
  width: 100%;
}
.blogproduits__wrapper .blog__produits > div .content {
  padding: 2rem 4rem 2rem 2rem;
  font-family: "Merriweather", Georgia, serif;
  font-size: 2.1rem;
  font-weight: 800;
  line-height: 1.2;
  position: relative;
  z-index: 3;
  height: 100%;
  background: linear-gradient(180deg, rgba(39, 36, 37, 0.7) 0%, rgba(39, 36, 37, 0) 60%);
}
.blogproduits__wrapper .blog__produits > div .content span {
  font-weight: 400;
}
.blogproduits__wrapper .blog__produits > div .content a {
  color: #fff;
}
.blogproduits__wrapper .blog__produits > div .content:after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  background: #A27E49 url(/assets/default/img/plus.svg) no-repeat center center;
  background-position: 75% 75%;
  color: #fff;
  width: 70px;
  height: 70px;
  clip-path: polygon(100% 0%, 100% 100%, 0% 100%);
}

.surmesure__wrapper {
  background: #fff;
  padding: 4rem 0;
}
.surmesure__wrapper .container {
  border-top: 1px solid #8EB704;
}
.surmesure__wrapper .surmesure {
  text-align: center;
}
.surmesure__wrapper .surmesure h2 {
  font-size: 4rem;
}
.surmesure__wrapper .surmesure p {
  margin: 0 0 3rem;
}
.surmesure__wrapper .surmesure > div {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
  gap: 2rem;
  flex-wrap: wrap;
}
@media screen and (min-width: 800px) {
  .surmesure__wrapper .surmesure > div {
    flex-wrap: nowrap;
  }
}
.surmesure__wrapper .surmesure > div div {
  flex: 1;
  padding: 3rem;
  background: #fbffed;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  gap: 1.5rem;
  font-size: 1.8rem;
  font-weight: 500;
}
.surmesure__wrapper .surmesure > div div p {
  margin: 0;
}

.modele__wrapper > .container {
  max-width: 100%;
  width: 100%;
  padding: 0;
}
.modele__wrapper .plan {
  background: #FBFBFB;
  padding: 4rem 0;
}
.modele__wrapper .plan .container h2 {
  text-align: center;
  margin: 0 0 1rem;
}
.modele__wrapper .plan .container div {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  flex-direction: column;
}
@media screen and (min-width: 640px) {
  .modele__wrapper .plan .container div {
    flex-direction: row;
  }
}
.modele__wrapper .plan .container div .btn {
  color: #fff;
}
.modele__wrapper .plan .container div .btn:after {
  background: #8EB704;
}
.modele__wrapper .plan .container div .btn--default {
  color: #000000;
}
.modele__wrapper .plan .container div .btn--default:hover {
  color: #fff;
}
.modele__wrapper .modele__widget .container {
  padding: 0;
}
@media screen and (max-width: 1000px) {
  .modele__wrapper .modele__widget .container {
    max-width: 100%;
  }
}
.modele__wrapper .modele {
  display: flex;
  color: #677A88;
  flex-direction: column;
}
@media screen and (min-width: 800px) {
  .modele__wrapper .modele {
    flex-direction: row;
  }
}
.modele__wrapper .modele .caracteristiques__container {
  flex: 1.5;
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 480px) {
  .modele__wrapper .modele .caracteristiques__container {
    flex-direction: row;
  }
}
.modele__wrapper .modele .caracteristiques__container .caracteristiques {
  flex: 1;
  min-width: 300px;
  padding: 4rem 8rem 4rem 4rem;
}
.modele__wrapper .modele .caracteristiques__container .caracteristiques h3 {
  color: #8EB704;
  font-weight: 600;
  margin-bottom: 1.5rem;
}
.modele__wrapper .modele .caracteristiques__container .caracteristiques p {
  padding-bottom: 1.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #8EB704;
}
.modele__wrapper .modele .caracteristiques__container .caracteristiques > div {
  display: flex;
  gap: 1.5rem;
  color: #FBFBFB;
  font-size: 1.4rem;
  margin: 1rem 0;
}
.modele__wrapper .modele .caracteristiques__container .caracteristiques .dpe {
  margin-top: 2.5rem;
  border-radius: 6px;
  background: #8EB704;
  color: #fff;
  padding: 1rem 1rem 1rem 1.5rem;
  display: inline-block;
  position: relative;
}
.modele__wrapper .modele .caracteristiques__container .caracteristiques .dpe::after {
  content: "";
  position: absolute;
  right: -12px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  width: 30px;
  height: 30px;
  background: #8EB704;
  border-radius: 0 3px 0 0;
  z-index: -1;
}
.modele__wrapper .modele .caracteristiques__container .modele__image {
  position: relative;
}
.modele__wrapper .modele .caracteristiques__container .modele__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.modele__wrapper .modele .action {
  flex: 1;
  background: #fff;
  color: #000000;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  padding: 4rem 4rem 4rem 8rem;
}
@media screen and (min-width: 800px) {
  .modele__wrapper .modele .action {
    padding: 4rem 8rem 4rem 4rem;
    align-items: flex-start;
  }
}
@media screen and (min-width: 1200px) {
  .modele__wrapper .modele .action {
    padding: 4rem 4rem 4rem 12rem;
  }
}
.modele__wrapper .modele .action .btn {
  color: #fff;
  margin-top: 2rem;
}
.modele__wrapper .modele .action .btn:after {
  background: #8EB704;
}

.listeannonces__wrapper {
  background: #FBFBFB;
  padding: 4rem 0;
}
.listeannonces__wrapper h2 {
  text-align: center;
  font-size: 2.1rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.3rem;
  margin: 4rem 0 8rem;
}

.template_83 .titrepage__wrapper img, .template_36 .titrepage__wrapper img, .template_88 .titrepage__wrapper img {
  -o-object-position: center top;
     object-position: center top;
}
@media screen and (min-width: 640px) {
  .template_83 .titrepage__wrapper img, .template_36 .titrepage__wrapper img, .template_88 .titrepage__wrapper img {
    aspect-ratio: 3;
  }
}

.template_36 .titrepage__wrapper img, .template_88 .titrepage__wrapper img {
  -o-object-position: center center;
     object-position: center center;
}

@media screen and (min-width: 800px) {
  .template_36 .titrepage__wrapper img {
    aspect-ratio: auto;
    height: max(200px, 22.2222222222vw - 70px);
  }
}

.template_88 .blogproduits__wrapper {
  padding-top: 0;
}
.template_88 article.article {
  margin-bottom: 0;
}

.liste-etablissement .titrepage__wrapper img {
  aspect-ratio: auto;
  height: 200px;
}
@media screen and (min-width: 800px) {
  .liste-etablissement .titrepage__wrapper img {
    height: 300px;
  }
}

.template_96 .titrepage__container {
  border-bottom: 0;
}
.template_96 .ariane__wrapper {
  background: transparent;
}
.template_96 .ariane__container {
  position: relative;
  z-index: 2;
  margin-top: -8rem;
  padding-top: 1.6rem;
  padding-bottom: 1.6rem;
  background: #fff;
}
@media screen and (min-width: 800px) {
  .template_96 .ariane__container {
    margin-top: -20rem;
  }
}
.template_96 .main__wrapper {
  position: relative;
  z-index: 1;
  background: #fff;
}
.template_96 .main__container {
  position: relative;
  z-index: 1;
  margin-top: -8rem;
  padding-top: 3.2rem;
  background: #fff;
}
@media screen and (min-width: 800px) {
  .template_96 .main__container {
    margin-top: -20rem;
  }
}

.recherche-liste__wrapper {
  background: #fff;
  padding: 2.4rem 0 2.4rem;
}

.recherche-liste__titre {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-size: 3rem;
  color: #A27E49;
  margin: 0 0 2.4rem;
  border-bottom: 1px solid #E1E4E7;
  padding-bottom: 1.6rem;
}
.recherche-liste__titre-label {
  display: inline-flex;
  align-items: center;
  gap: 1.2rem;
}
.recherche-liste__titre-label .bi {
  color: #272425;
}
.recherche-liste__titre-chevron {
  font-size: 1.8rem;
  color: #677A88;
}
.recherche-liste__form {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  align-items: stretch;
}
@media screen and (min-width: 800px) {
  .recherche-liste__form {
    flex-direction: row;
    align-items: flex-end;
    gap: 2.4rem;
  }
}
.recherche-liste__form .form-group {
  flex: 1;
  width: 100%;
  margin: 0;
}
.recherche-liste__form .form-label {
  text-transform: uppercase;
  font-size: 1.2rem;
  letter-spacing: 0.08rem;
  color: #677A88;
  font-weight: 600;
  margin-bottom: 0.4rem;
}
.recherche-liste__form .btn {
  margin: 0;
  white-space: nowrap;
}
.recherche-liste__geoloc {
  position: relative;
}
.recherche-liste__geoloc .recherche-liste__geoloc-btn {
  position: absolute;
  right: 0.8rem;
  bottom: 0.8rem;
  background: none;
  border: 0;
  color: #A27E49;
  cursor: pointer;
  font-size: 1.8rem;
}

.resultats-compteur {
  text-align: center;
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.5rem;
  color: #A27E49;
  margin: 2.4rem 0;
}
.resultats-compteur strong {
  font-weight: 700;
}

.engages__wrapper {
  background: #fff;
  padding: 0;
}

.main__wrapper .engages__banner {
  background: #A27E49;
  color: #fff;
  border-radius: 4px 4px 0 0;
  padding: 3.2rem;
  margin: 0;
  text-align: left;
}
.main__wrapper .engages__banner h2 {
  color: #fff;
  font-size: 1.8rem;
  margin: 0 0 0.8rem;
  font-weight: 700;
  text-align: left;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-style: normal;
}
.main__wrapper .engages__banner p {
  margin: 0;
  font-size: 1.4rem;
  color: rgba(255, 255, 255, 0.9);
  text-align: left;
}

.engages__list {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.engages__note-info {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  color: #677A88;
  font-size: 1.2rem;
  margin-top: 2.4rem;
}
.engages__note-info a {
  color: #677A88;
  text-decoration: underline;
}
.engages__note-info .bi {
  color: #A27E49;
}

.autres__wrapper {
  background: #fff;
  padding: 0 0 4.8rem;
}

.autres__header {
  background: #A4AFB8;
  color: #fff;
  padding: 1.2rem 1.6rem;
  font-weight: 600;
  font-size: 1.6rem;
  border-radius: 4px 4px 0 0;
  margin-bottom: 0.8rem;
}

.cta__wrapper {
  background: #fff;
  padding: 4.8rem 0 6.4rem;
}

.fiche-etablissement .titrepage__container {
  border-bottom: 0;
}
.fiche-etablissement .main__wrapper {
  background: #FAFAF8;
  padding-top: 0;
}

.fiche-label {
  display: block;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 500;
  font-size: 1.6rem;
  letter-spacing: 0.2rem;
  text-transform: uppercase;
  color: #A27E49;
  margin: 0 0 1.6rem;
}

.fiche-header {
  padding: 2.4rem 0 0;
  background: #fff;
  box-shadow: 0 0 0 100vmax #fff;
  clip-path: inset(0 -100vmax);
}
.fiche-header__titre {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 300;
  font-size: 4rem;
  color: #272425;
  margin: 0 0 2.4rem;
}
.fiche-header__titre .bi {
  color: #A27E49;
  font-size: 2.5rem;
}

.fiche-nav {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  flex-wrap: wrap;
  gap: 4.2rem;
  background: #fff;
  padding: 1.2rem 0;
}
.fiche-nav__item {
  position: relative;
  color: #677A88;
  font-size: 1.8rem;
  text-decoration: none;
  padding-bottom: 0.8rem;
  white-space: nowrap;
}
.fiche-nav__item:hover {
  color: #272425;
}
.fiche-nav__item.is-active {
  color: #A27E49;
}
.fiche-nav__item.is-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: #A27E49;
}

.fiche-anchor {
  scroll-margin-top: 6rem;
}

.presentation {
  padding: 3.2rem 0;
}
@media screen and (min-width: 800px) {
  .presentation {
    display: grid;
    grid-template-columns: 1.4fr 0.6fr;
    gap: 4.8rem;
    align-items: stretch;
  }
}
.presentation__media {
  position: relative;
  margin-bottom: 2.4rem;
}
@media screen and (min-width: 800px) {
  .presentation__media {
    margin-bottom: 0;
  }
}
.presentation__media .presentation__visuel {
  position: relative;
}
.presentation__media img {
  width: 100%;
  aspect-ratio: 16/7;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
  border-radius: 4px;
  display: block;
}
.presentation__content {
  padding: 4rem;
  background: #fff;
}
.presentation__content p {
  color: #272425;
  font-size: 1.6rem;
  line-height: 1.5;
  margin: 0;
  text-align: justify;
}

.fiche-coordonnees {
  flex-direction: column;
  gap: 2.4rem;
  padding: 2.4rem 0 3.2rem;
}
@media screen and (min-width: 800px) {
  .fiche-coordonnees {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}
.fiche-coordonnees__list {
  list-style: none;
  padding: 0 0 0 1.6rem;
  border-left: 2px solid #E1E4E7;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  font-size: 1.6rem;
  color: #272425;
}
.fiche-coordonnees__label {
  font-weight: 700;
  margin-right: 0.4rem;
}
.fiche-coordonnees .btn {
  margin: 2rem 0;
  flex: 0 0 auto;
}

.chiffres-cles {
  padding: 3.2rem 0;
  border-radius: 4px;
  margin-bottom: 4.8rem;
}
.chiffres-cles__grid {
  display: grid;
  gap: 1.6rem;
  grid-template-columns: 1fr;
}
@media screen and (min-width: 640px) {
  .chiffres-cles__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
.chiffres-cles__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1.6rem;
  justify-content: center;
  margin-top: 3.2rem;
}
@media screen and (min-width: 800px) {
  .chiffres-cles__actions {
    justify-content: flex-end;
  }
}
.chiffres-cles__actions .btn {
  margin: 0;
  color: white;
  background-color: #A3A3A3;
}

.chiffre-card {
  background: #fff;
  border-radius: 4px;
  padding: 2.4rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
.chiffre-card__valeur {
  display: block;
  font-weight: 200;
  font-size: 5.5rem;
  line-height: 1;
  color: #A27E49;
}
.chiffre-card__label {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-weight: 600;
  font-size: 1.8rem;
  color: #272425;
  margin-top: 0.8rem;
}
.chiffre-card__icon {
  flex: 0 0 auto;
  width: 1.11em;
  height: 1.11em;
  -o-object-fit: contain;
     object-fit: contain;
}
.chiffre-card__date {
  display: block;
  font-size: 1.8rem;
}

.enquetes {
  background: #fff;
  padding: 3.2rem;
  border-radius: 4px;
  margin-bottom: 4.8rem;
}
.enquetes__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 3.2rem;
  justify-content: center;
}
.enquetes__tab {
  background: none;
  border: 0;
  cursor: pointer;
  font-family: "Merriweather", Georgia, serif;
  font-size: 1.8rem;
  padding: 1.2rem 0.8rem;
  position: relative;
}
.enquetes__tab:hover {
  color: #A27E49;
}
.enquetes__tab.is-active {
  color: #A27E49;
  background: white;
}
.enquetes__tab.is-active::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: -1px;
  height: 2px;
  background: #A27E49;
}
.enquetes__panel {
  display: none;
}
.enquetes__panel.is-active {
  display: block;
}
.enquetes__layout {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  background: #fff;
  padding: 2.4rem;
  border-radius: 4px;
}
@media screen and (min-width: 800px) {
  .enquetes__layout {
    flex-direction: row;
    gap: 4.8rem;
  }
}

.note-globale {
  flex: 0 0 auto;
  text-align: center;
}
@media screen and (min-width: 800px) {
  .note-globale {
    flex: 0 0 220px;
    text-align: left;
    border-right: 1px solid #E1E4E7;
    padding-right: 3.2rem;
  }
}
.note-globale__label {
  display: block;
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  color: #272425;
  font-size: 1.8rem;
  margin-bottom: 0.8rem;
}
.note-globale__value {
  font-family: "Merriweather", Georgia, serif;
  font-weight: 700;
  font-size: 4.5rem;
  line-height: 1;
  color: #8EB704;
}
.note-globale__max {
  font-size: 1.8rem;
  color: #A4AFB8;
  font-weight: 400;
}
.note-globale__meta {
  font-size: 1.2rem;
  color: #677A88;
  margin: 0.8rem 0;
}
.note-globale__desc {
  font-size: 1rem;
  color: #A4AFB8;
  margin: 1.2rem 0 0;
}

.badge-progress {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(142, 183, 4, 0.12);
  color: #8EB704;
  border-radius: 100vh;
  padding: 0.4rem 1.2rem;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
}

.criteres {
  flex: 1;
}
.criteres__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.2rem;
  margin-bottom: 1.6rem;
}
.criteres__header h3 {
  font-family: "Merriweather", Georgia, serif;
  font-weight: 400;
  font-size: 1.8rem;
  color: #272425;
  margin: 0;
}
.criteres__header .form-control {
  width: auto;
  padding-top: 8px;
  padding-bottom: 8px;
}
.criteres__subtitle {
  color: #A27E49;
  font-style: italic;
  font-family: "Merriweather", Georgia, serif;
  margin: 0 0 1.2rem;
}
.criteres__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.critere {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 1.2rem;
  padding: 1.2rem 0;
  border-bottom: 1px solid #E1E4E7;
}
.critere:last-child {
  border-bottom: 0;
}
.critere__label {
  font-size: 1.4rem;
  color: #272425;
}
.critere__stars {
  color: #A27E49;
  font-size: 1.4rem;
  letter-spacing: 0.1rem;
  white-space: nowrap;
}
.critere__stars .bi {
  vertical-align: middle;
}
.critere__stars .bi-star {
  color: #B8B8B8;
}
.critere__value {
  font-weight: 700;
  font-size: 1.6rem;
  color: #8EB704;
  white-space: nowrap;
}
.critere__value small {
  color: #A4AFB8;
  font-weight: 400;
}
.critere__value--medium {
  color: #E8995B;
}

.temoignages {
  margin-top: 3.2rem;
  padding: 3.2rem 0;
  margin-bottom: 4.8rem;
}
.temoignages__titre {
  font-family: "Merriweather", Georgia, serif;
  font-weight: 400;
  font-size: 2.1rem;
  color: #272425;
  margin: 0 0 1.6rem;
}
.temoignages__list {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}

.temoignage {
  background: #fff;
  border: 1px solid #E1E4E7;
  border-radius: 4px;
  padding: 1.6rem 2.4rem;
}
.temoignage__head {
  position: static;
  background: none;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.2rem;
  margin-bottom: 1.2rem;
}
.temoignage__author {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}
.temoignage__avatar {
  font-size: 2.5rem;
  color: #A4AFB8;
}
.temoignage__date {
  display: block;
  font-size: 1rem;
  color: #677A88;
}
.temoignage__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: #8EB704;
}
.temoignage__badge .bi {
  color: #8EB704;
}
.temoignage__rating {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  color: #F6B614;
  font-size: 1.4rem;
  white-space: nowrap;
}
.temoignage__rating .bi-star {
  color: #B5B5B5;
}
.temoignage__rating-value {
  font-weight: 700;
  color: #272425;
  font-size: 1.4rem;
}
.temoignage__text {
  margin: 0;
  color: #677A88;
  font-size: 1.4rem;
  line-height: 1.5;
  font-style: italic;
}
.temoignage__reply {
  margin-top: 1.6rem;
  padding: 1.6rem;
  background: #FAFAF8;
  border-left: 3px solid #A27E49;
  border-radius: 4px;
}
.temoignage__reply-head {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  margin: 0 0 0.8rem;
  font-size: 1rem;
  font-weight: 700;
  color: #A27E49;
}
.temoignage__reply-head .bi {
  color: #A27E49;
}
.temoignage__reply-text {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.5;
  color: #677A88;
  font-style: italic;
}

.cvs {
  padding: 3.2rem 0 0;
}
.cvs__intro {
  display: flex;
  gap: 1.6rem;
  align-items: flex-start;
  margin-bottom: 2.4rem;
}
.cvs__intro p {
  margin: 0;
  color: #677A88;
  font-size: 1.4rem;
  line-height: 1.5;
}
.cvs__intro-icon {
  flex: 0 0 auto;
  width: 72px;
}
@media screen and (min-width: 800px) {
  .cvs__intro-icon {
    width: 122px;
  }
}
.cvs__intro-icon img {
  display: block;
  width: 100%;
  height: auto;
}
.cvs__sep {
  border: 0;
  border-top: 1px solid #E1E4E7;
  margin: 3.2rem 0;
}
.cvs__representants h3 {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 2.1rem;
  color: #272425;
  margin: 0 0 1.2rem;
}
.cvs__representants p {
  color: #677A88;
  font-size: 1.4rem;
  line-height: 1.5;
  margin: 0 0 1.6rem;
}
.cvs__actions-titre {
  font-family: "Merriweather", Georgia, serif;
  font-weight: 400;
  font-size: 2.1rem;
  color: #272425;
  margin: 4.8rem 0 1.6rem;
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.cvs__actions-titre .bi {
  color: #A27E49;
}
.cvs__actions-titre .cvs__actions-icon {
  flex: 0 0 auto;
  width: 1.1em;
  height: 1.1em;
  -o-object-fit: contain;
     object-fit: contain;
}

.cvs-actions {
  list-style: none;
  margin: 0 0 3.2rem;
  padding: 0;
  border: 1px solid #E1E4E7;
  border-radius: 4px;
  overflow: hidden;
}
.cvs-actions__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.4rem;
  padding: 1.2rem 1.6rem;
}
.cvs-actions__row:nth-child(odd) {
  background: #FBFBFB;
}
@media screen and (min-width: 640px) {
  .cvs-actions__row {
    grid-template-columns: 140px 1fr;
    gap: 1.6rem;
    align-items: baseline;
  }
}
.cvs-actions__date {
  font-weight: 700;
  color: #A27E49;
  font-size: 1.2rem;
  white-space: nowrap;
}
.cvs-actions__label {
  color: #677A88;
  font-size: 1.4rem;
}

.identification {
  padding: 4.8rem 0;
}
.identification__card {
  background: #fff;
  max-width: 640px;
  margin: 0 auto;
  padding: 3.2rem 2.4rem;
  border-radius: 4px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}
@media screen and (min-width: 800px) {
  .identification__card {
    padding: 4.8rem 6.4rem;
  }
}
.identification__title {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 2.5rem;
  line-height: 1.2;
  color: #A27E49;
  text-align: center;
  margin: 0 0 3.2rem;
}
.identification__step {
  display: none;
}
.identification__step.is-active {
  display: block;
}
.identification .form-group {
  margin-bottom: 1.6rem;
}
.identification__group-title {
  font-weight: 700;
  color: #272425;
  font-size: 1.4rem;
  margin: 2.4rem 0 0.4rem;
}
.identification .checkbox-group + .identification__group-title {
  margin-top: 3.2rem;
}
.identification__actions {
  margin-top: 3.2rem;
}
.identification__actions .btn {
  width: 100%;
  margin: 0;
  text-align: center;
}
.identification__note {
  max-width: 640px;
  margin: 3.2rem auto 0;
  font-size: 0.8rem;
  font-style: italic;
  line-height: 1.5;
  color: #A4AFB8;
  text-align: center;
}

.input-phone {
  display: flex;
  gap: 0.8rem;
}
.input-phone__prefix {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 0 1.2rem;
  border: 1px solid #A4AFB8;
  border-radius: 4px;
  background: #F0F2F3;
  color: #677A88;
  font-size: 1.4rem;
}
.input-phone .form-control {
  flex: 1;
}

/* ==========================================================================
   Page « À propos » (maquette Figma node 488:848)
   Zones template : doxa__wrapper, organisme__wrapper, mission__wrapper,
   valeurs__wrapper, engagements__wrapper — cf. storage/app/pages/a-propos.json
   Les sections organisme / mission / valeurs partagent le bandeau doré :
   dégradé sur .organisme__wrapper (fin sur $gold), $gold uni ensuite.
   ========================================================================== */
/* --- Section 1 : hero « Qu'est-ce qu'une Doxa ? » -------------------------- */
.doxa__wrapper {
  background: #FAFAF8;
  overflow: hidden;
}

.doxa-hero {
  position: relative;
  padding: 2.4rem 0 3.2rem;
}
.doxa-hero__media img {
  display: block;
  width: 100%;
  height: auto;
}
.doxa-hero__panel {
  position: relative;
  z-index: 2;
  background: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: blur(14px);
          backdrop-filter: blur(14px);
  border: 1px solid #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  padding: 2.4rem 1.6rem;
  margin-top: -3.2rem;
}
.doxa-hero__title {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 3rem;
  line-height: 1.1;
  color: #000000;
  margin: 0 0 1.6rem;
  letter-spacing: -0.1rem;
}
.doxa-hero__text {
  font-size: 1.8rem;
  line-height: 1.5;
  margin: 0;
}
@media screen and (min-width: 800px) {
  .doxa-hero__title {
    font-size: 4rem;
  }
}
@media screen and (min-width: 1200px) {
  .doxa-hero {
    display: flex;
    align-items: center;
    min-height: 60rem;
    padding: 6.4rem 0;
  }
  .doxa-hero__media {
    position: absolute;
    z-index: 1;
    top: 4.8rem;
    right: -10rem;
    bottom: 4.8rem;
    left: 38%;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  }
  .doxa-hero__media img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .doxa-hero__panel {
    width: 58%;
    margin: 0;
    padding: 4.8rem;
  }
  .doxa-hero__title {
    font-size: 4.5rem;
  }
  .doxa-hero__text {
    font-size: 2.1rem;
  }
}

/* --- Section 2 : « Un organisme indépendant » (bandeau doré) --------------- */
.organisme__wrapper {
  position: relative;
  background: #A27E49;
  clip-path: polygon(0 3rem, 100% 0, 100% 100%, 0 100%);
  margin-top: -3rem;
}

.organisme {
  position: relative;
  padding: 6.4rem 0 4.8rem;
  color: #fff;
}
.organisme__wm {
  position: absolute;
  inset: 0;
  margin: auto;
  width: auto;
  max-width: 100%;
  max-height: 100%; /* le filigrane rentre en hauteur dans la zone utile */
  opacity: 0.06;
  pointer-events: none;
}
.organisme__media {
  position: relative;
  margin-bottom: 2.4rem;
}
.organisme__media img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
}
.organisme__label {
  position: absolute;
  right: -0.8rem;
  bottom: -2.4rem;
  width: 14rem;
}
.organisme__label img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}
.organisme__title {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 4rem;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 1.6rem;
}
.organisme__text {
  font-size: 1.8rem;
  line-height: 1.5;
  margin: 0;
}
@media screen and (min-width: 1200px) {
  .organisme {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6.4rem;
    align-items: center;
    padding: 9.6rem 0 6.4rem;
  }
  .organisme__media {
    margin-bottom: 0;
  }
  .organisme__label {
    right: -4.8rem;
    bottom: -4.8rem;
    width: 23rem;
  }
  .organisme__text {
    font-size: 2.1rem;
  }
}

/* --- Section 3 : « Notre mission » (bandeau doré, citation) ---------------- */
.mission__wrapper {
  background: #A27E49;
  overflow: hidden;
  margin-top: -1px; /* évite le liseré (fond sombre du body) au joint sous-pixel entre sections */
}

.mission {
  position: relative;
  padding: 4.8rem 0;
  text-align: right;
}
.mission__deco {
  position: absolute;
  top: 3.2rem; /* décollé du haut de section (ne doit pas toucher la section précédente) */
  right: 0;
  width: 22rem;
  height: auto;
  opacity: 0.7;
  pointer-events: none;
}
.mission__title {
  position: relative;
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 4rem;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 1.6rem;
}
.mission__quote {
  position: relative;
  font-style: italic;
  font-size: 2.5rem;
  line-height: 1.4;
  letter-spacing: -0.03rem;
  color: #272425;
  max-width: 64rem;
  margin: 0 0 0 auto;
}
.mission__quote::after {
  content: "";
  display: block;
  width: 7rem;
  height: 0.3rem;
  background: #FAFAF8;
  margin: 2.4rem 0 0 auto;
}
@media screen and (min-width: 1200px) {
  .mission {
    /* maquette : le bord droit du bloc texte tombe à ~60 % de la largeur */
    padding: 6.4rem 40% 6.4rem 0;
  }
  .mission__deco {
    width: 32rem;
  }
  .mission__quote {
    font-size: 3rem;
  }
}

/* --- Section 4 : « Nos valeurs » (slider Glide sur bandeau doré) ----------- */
.valeurs__wrapper {
  background: #A27E49;
  overflow: hidden;
  margin-top: -1px; /* idem joint mission/valeurs */
}

.valeurs {
  padding: 4.8rem 0 6.4rem;
  /* maquette : titre au-dessus, calé à gauche sur la première carte ;
     flèches sous le slider, calées à gauche ; ensemble décalé à ~10 % du bord gauche */
}
.valeurs__title {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 4rem;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 3.2rem;
}
@media screen and (min-width: 640px) {
  .valeurs {
    padding-left: 10%;
  }
}
.valeurs .valeurs__slider {
  position: relative;
  z-index: 3;
}
.valeurs .valeurs__slider .glide__slide {
  height: auto;
}
.valeurs .valeurs__slider .glide__arrows {
  display: flex;
  gap: 1.6rem;
  justify-content: flex-start;
  margin-top: 2.4rem;
}
.valeurs .valeurs__slider .glide__arrow {
  position: static;
  transform: none;
  border: none;
  box-shadow: none;
  background: transparent;
  padding: 0;
}

.valeur-card {
  height: 100%;
  background: #fff;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  padding: 2.4rem;
}
.valeur-card__title {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.5rem;
  line-height: 1.5;
  color: #272425;
  margin: 0 0 1.2rem;
}
.valeur-card__text {
  font-size: 1.6rem;
  line-height: 1.5;
  margin: 0;
}
@media screen and (min-width: 1200px) {
  .valeur-card {
    padding: 3.2rem;
    min-height: 26rem;
  }
  .valeur-card__title {
    font-size: 3rem;
  }
}

/* --- Section 5 : « Nos engagements » (rangées alternées, carte vitrée) ----- */
.engagements__wrapper {
  background: #FAFAF8;
  overflow: hidden;
  margin-top: -1px; /* idem joint valeurs/engagements */
}

.engagements {
  padding: 4.8rem 0 6.4rem;
}
.engagements__title {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 4rem;
  line-height: 1.2;
  color: #272425;
  margin: 0;
}
.engagements__title::after {
  content: "";
  display: block;
  width: 7rem;
  height: 0.3rem;
  background: #A27E49;
  margin-top: 1.2rem;
}

.engagement-row {
  position: relative;
  margin-top: 4.8rem;
}
.engagement-row__media img {
  display: block;
  width: 100%;
  height: auto;
}
.engagement-row__panel {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 1.6rem;
  background: rgba(255, 255, 255, 0.7);
  -webkit-backdrop-filter: blur(7px);
          backdrop-filter: blur(7px);
  border: 1px solid #fff;
  border-radius: 12px;
  padding: 2.4rem 1.6rem;
  margin: -3.2rem 0.8rem 0;
}
.engagement-row__title {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.5rem;
  line-height: 1.3;
  color: #000000;
  margin: 0;
}
.engagement-row__title em {
  font-style: italic;
  font-weight: 400;
}
.engagement-row__text {
  font-size: 1.8rem;
  line-height: 1.5;
  margin: 0;
}
.engagement-row__label {
  display: block;
  width: 14rem;
  background: #fff;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  justify-self: end;
}
@media screen and (min-width: 1200px) {
  .engagement-row {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    align-items: center;
    margin-top: 6.4rem;
  }
  .engagement-row__media {
    grid-column: 6/-1;
    grid-row: 1;
  }
  .engagement-row__panel {
    grid-column: 1/8;
    grid-row: 1;
    grid-template-columns: 1fr auto;
    align-items: center;
    -moz-column-gap: 3.2rem;
         column-gap: 3.2rem;
    padding: 3.2rem;
    margin: 0;
  }
  .engagement-row__title {
    grid-column: 1/-1;
    font-size: 4rem;
  }
  .engagement-row__label {
    width: 18rem;
  }
  .engagement-row--reverse {
    /* maquette : le logo (RGPD) est calé à gauche, à cheval sur la photo */
  }
  .engagement-row--reverse .engagement-row__media {
    grid-column: 1/6;
  }
  .engagement-row--reverse .engagement-row__panel {
    grid-column: 4/-1;
    padding-left: 10rem; /* laisse la place au logo qui déborde à gauche */
  }
  .engagement-row--reverse .engagement-row__label {
    position: absolute;
    left: -9rem;
    bottom: 4rem;
    justify-self: unset;
  }
}

/* ==========================================================================
   Page « Notre démarche » (maquette Figma node 947:1870)
   Zones template : demarchebanner__wrapper, methodo__wrapper, etapes__wrapper,
   saviezvous__wrapper — cf. storage/app/pages/notre-demarche.json
   Couleurs d'étape : $etape-1..5 (base/_colors.scss)
   ========================================================================== */
/* --- Bandeau titre --------------------------------------------------------- */
.demarchebanner__wrapper {
  position: relative;
  background: url("/assets/default/img/demarche_banner.webp") center/cover no-repeat;
  /* voile sombre pour le contraste du titre (partie blanche) — cf. maquette */
}
.demarchebanner__wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(73deg, rgba(39, 36, 37, 0.35) 25%, rgba(255, 255, 255, 0.2) 100%);
}

.demarche-banner {
  position: relative;
  z-index: 1;
  padding: 6.4rem 0;
}
.demarche-banner__title {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 700;
  font-size: 4rem;
  line-height: 1.1;
  color: #272425;
  margin: 0 0 1.2rem;
}
.demarche-banner__subtitle {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.1rem;
  color: #fff;
  margin: 0;
}
@media screen and (min-width: 1200px) {
  .demarche-banner {
    padding: 9.6rem 0 9.6rem;
    min-height: 30rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .demarche-banner__title {
    font-size: 4.5rem;
  }
  .demarche-banner__subtitle {
    font-size: 3rem;
  }
}

/* --- Intro « Une méthodologie en 5 étapes » + frise ------------------------ */
.methodo__wrapper {
  background: linear-gradient(180deg, #FAFAF8 0%, #fff 100%);
}

.methodo {
  padding: 4.8rem 0;
  text-align: center;
}
.methodo__title {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 600;
  font-size: 3rem;
  line-height: 1.2;
  color: #272425;
  margin: 0 0 1.6rem;
}
.methodo__intro {
  font-weight: 600;
  font-size: 1.8rem;
  line-height: 1.5;
  max-width: 116rem;
  margin: 0 auto 3.2rem;
}
@media screen and (min-width: 1200px) {
  .methodo__intro {
    font-size: 2.1rem;
  }
}

.frise {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2.4rem 1.6rem;
  text-align: left;
}
.frise__etape {
  flex: 1 1 15rem;
  min-width: 15rem;
  max-width: 21rem;
  list-style: none;
}
.frise__pin {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 9rem;
  height: 9rem;
  margin: 0 auto 1.6rem;
  border-radius: 50%;
  /* pointe de l'épingle */
}
.frise__pin::after {
  content: "";
  position: absolute;
  bottom: -1.4rem;
  left: 50%;
  transform: translateX(-50%);
  border-left: 1.1rem solid transparent;
  border-right: 1.1rem solid transparent;
  border-top: 1.8rem solid currentColor;
}
.frise__num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 6.6rem;
  height: 6.6rem;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 4rem;
  color: #272425;
}
.frise__label {
  display: block;
  padding: 0.8rem 1.6rem 0.8rem 1.2rem;
  clip-path: polygon(0 0, calc(100% - 1.4rem) 0, 100% 50%, calc(100% - 1.4rem) 100%, 0 100%);
  color: #fff;
  font-weight: 800;
  font-size: 1.6rem;
  letter-spacing: 0.1rem;
  text-transform: uppercase;
}
.frise__items {
  margin: 1.2rem 0 0;
  padding: 0 0 0 1.6rem;
}
.frise__items li {
  font-size: 1.6rem;
  line-height: 1.5;
  margin-bottom: 0.4rem;
}
.frise__etape--1 .frise__pin {
  background: #7A678E;
  color: #7A678E;
}
.frise__etape--1 .frise__label {
  background: #7A678E;
}
.frise__etape--1 .frise__items li::marker {
  color: #7A678E;
}
.frise__etape--2 .frise__pin {
  background: #AB8248;
  color: #AB8248;
}
.frise__etape--2 .frise__label {
  background: #AB8248;
}
.frise__etape--2 .frise__items li::marker {
  color: #AB8248;
}
.frise__etape--3 .frise__pin {
  background: #7AB6AD;
  color: #7AB6AD;
}
.frise__etape--3 .frise__label {
  background: #7AB6AD;
}
.frise__etape--3 .frise__items li::marker {
  color: #7AB6AD;
}
.frise__etape--4 .frise__pin {
  background: #E8734C;
  color: #E8734C;
}
.frise__etape--4 .frise__label {
  background: #E8734C;
}
.frise__etape--4 .frise__items li::marker {
  color: #E8734C;
}
.frise__etape--5 .frise__pin {
  background: #678E79;
  color: #678E79;
}
.frise__etape--5 .frise__label {
  background: #678E79;
}
.frise__etape--5 .frise__items li::marker {
  color: #678E79;
}

/* --- Les 5 étapes ---------------------------------------------------------- */
.etapes__wrapper {
  background: #fff;
  overflow-x: clip; /* les photos débordent jusqu'aux bords de la fenêtre (clip ≠ hidden : préserve le sticky) */
}

.etapes {
  padding: 3.2rem 0;
}

.etape {
  margin-bottom: 4.8rem;
  /* cartouche sous la photo — même largeur que l'image (dans __media) */
}
.etape__media {
  margin-bottom: 2.4rem;
}
.etape__media img {
  display: block;
  width: 100%;
  height: auto;
}
.etape__legende {
  background: #fff;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  padding: 1.6rem;
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-size: 1.8rem;
  line-height: 1.7;
  color: #272425;
  margin: 0;
}
.etape__head {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  border-bottom: 1px solid #A27E49;
  padding-bottom: 1.6rem;
  margin-bottom: 2.4rem;
}
.etape__icone {
  width: 6rem;
  height: 6rem;
  flex: 0 0 auto;
}
.etape__num {
  font-weight: 600;
  font-size: 1.8rem;
  letter-spacing: 0.1rem;
  text-transform: uppercase;
  margin: 0;
}
.etape__titre {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 4rem;
  line-height: 1.1;
  color: #272425;
  margin: 0;
}
.etape__accroche {
  font-weight: 600;
  font-size: 2.1rem;
  line-height: 1.4;
  letter-spacing: 0.05rem;
  text-transform: uppercase;
  margin: 0 0 1.6rem;
}
.etape__texte {
  font-size: 1.8rem;
  line-height: 1.5;
  margin: 0 0 1.6rem;
}
.etape__texte em {
  color: #A4AFB8;
}
.etape__sous-titre {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-size: 2.1rem;
  color: #A4AFB8;
  margin: 2.4rem 0 1.6rem;
}
.etape__liste {
  list-style: none;
  margin: 0 0 1.6rem 3.2rem;
  padding: 0;
}
.etape__liste li {
  position: relative;
  padding-left: 4rem;
  font-size: 1.8rem;
  line-height: 1.5;
  margin-bottom: 1.2rem;
}
.etape__liste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2rem;
  width: 2.4rem;
  height: 2.4rem;
  background: currentColor;
  -webkit-mask: url("/assets/default/img/demarche_check.svg") center/contain no-repeat;
  mask: url("/assets/default/img/demarche_check.svg") center/contain no-repeat;
}
.etape__liste li em {
  color: #A4AFB8;
}
.etape__bandeau {
  background: #FAFAF8;
  text-align: center;
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-size: 1.8rem;
  color: #272425;
  padding: 1.6rem;
  margin: 3.2rem 0 0;
}
.etape--1 .etape__num,
.etape--1 .etape__accroche {
  color: #7A678E;
}
.etape--1 .etape__liste li::before {
  color: #7A678E;
}
.etape--2 .etape__num,
.etape--2 .etape__accroche {
  color: #AB8248;
}
.etape--2 .etape__liste li::before {
  color: #AB8248;
}
.etape--3 .etape__num,
.etape--3 .etape__accroche {
  color: #7AB6AD;
}
.etape--3 .etape__liste li::before {
  color: #7AB6AD;
}
.etape--4 .etape__num,
.etape--4 .etape__accroche {
  color: #E8734C;
}
.etape--4 .etape__liste li::before {
  color: #E8734C;
}
.etape--5 .etape__num,
.etape--5 .etape__accroche {
  color: #678E79;
}
.etape--5 .etape__liste li::before {
  color: #678E79;
}
@media screen and (min-width: 1200px) {
  .etape {
    display: grid;
    grid-template-columns: 4fr 8fr;
    -moz-column-gap: 4.8rem;
         column-gap: 4.8rem;
    align-items: start;
    margin-bottom: 6.4rem;
    /* Photos collées au bord de la fenêtre (maquette) : gauche pour 1/3/5,
       droite pour 2/4. Décalage = marge de centrage du container (en px,
       la racine rem n'est pas fixe sur ce site) + son padding 2rem.
       Le léger dépassement dû à la scrollbar est absorbé par
       overflow-x: clip sur .etapes__wrapper. */
    /* étapes 2 et 4 : container sur fond crème (même couleur que le bandeau
       de l'étape 1) ; le débord de la photo compense aussi ce padding */
    /* étape 5 : en-tête + accroche + intro sur toute la largeur,
       puis photo à gauche au niveau du complément (Communication interne…) */
  }
  .etape__media {
    grid-column: 1;
    grid-row: 1;
    margin-bottom: 0;
  }
  .etape__media img {
    width: 100%;
    height: 44rem;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: left center;
       object-position: left center; /* calée sur son bord fenêtre */
  }
  .etape__body {
    grid-column: 2;
    grid-row: 1;
  }
  .etape__complement, .etape__bandeau {
    grid-column: 1/-1;
  }
  .etape__titre {
    font-size: 4.5rem;
  }
  .etape__texte {
    font-size: 2.1rem;
  }
  .etape__media {
    margin-left: calc(-1 * ((100vw - 1200px) / 2 + 2rem));
  }
  .etape--reverse {
    /* photo étroite à droite, texte large à gauche */
    grid-template-columns: 8fr 4fr;
  }
  .etape--reverse .etape__media {
    grid-column: 2;
    margin-left: 0;
    margin-right: calc(-1 * ((100vw - 1200px) / 2 + 2rem));
  }
  .etape--reverse .etape__media img {
    -o-object-position: right center;
       object-position: right center;
  }
  .etape--reverse .etape__body {
    grid-column: 1;
    grid-row: 1;
  }
  .etape--2, .etape--4 {
    background: #FAFAF8;
    padding: 3.2rem;
  }
  .etape--2 .etape__media, .etape--4 .etape__media {
    margin-right: calc(-1 * ((100vw - 1200px) / 2 + 2rem + 3.2rem));
  }
  .etape--5 .etape__body {
    grid-column: 1/-1;
    grid-row: 1;
  }
  .etape--5 .etape__media {
    grid-column: 1;
    grid-row: 2;
  }
  .etape--5 .etape__complement {
    grid-column: 2;
    grid-row: 2;
  }
  .etape--5 .etape__liste {
    margin-left: 0;
  }
}
@media screen and (min-width: 1440px) {
  .etape__media {
    margin-left: calc(-1 * (max(0px, (100vw - 1440px) / 2) + 2rem));
  }
  .etape--reverse .etape__media {
    margin-left: 0;
    margin-right: calc(-1 * (max(0px, (100vw - 1440px) / 2) + 2rem));
  }
  .etape--2 .etape__media, .etape--4 .etape__media {
    margin-right: calc(-1 * (max(0px, (100vw - 1440px) / 2) + 2rem + 3.2rem));
  }
}

/* --- Le saviez-vous ? ------------------------------------------------------ */
.saviezvous__wrapper {
  background: #fff;
}

.saviez {
  background: #FAFAF8;
  padding: 3.2rem 2.4rem;
  margin: 0 0 4.8rem;
}
.saviez__title {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 3rem;
  color: #A27E49;
  margin: 0 0 1.2rem;
}
.saviez__texte {
  font-style: italic;
  font-size: 1.8rem;
  line-height: 1.5;
  color: #272425;
  margin: 0 0 1.2rem;
}
.saviez__source {
  font-style: italic;
  font-size: 1.8rem;
}
.saviez__source a {
  color: #A4AFB8;
  text-decoration: underline;
}
@media screen and (min-width: 1200px) {
  .saviez {
    padding: 3.2rem 4.8rem;
  }
}

/* ==========================================================================
   Page « Votre rôle » (maquette Figma node 1288:1005)
   Zones template : rolebanner__wrapper (widget demarcheBanner réutilisé),
   main__wrapper (.votrerole-main → vue principale show-votreRole),
   rolegroupe1..4__wrapper (classe commune .rolegroupe__wrapper, widget roleGroupe)
   — cf. storage/app/pages/votre-role.json
   ========================================================================== */
/* Largeur du contenu des groupes sur desktop (maquette : 140 → 1300 px sur 1440).
   En px : la racine rem n'est pas fixe sur ce site, les débords pleine largeur
   se calculent donc en px. */
/* part de la photo à l'intérieur du contenu */
/* du bord du contenu au bord de la fenêtre */
/* --- Bandeau titre (markup .demarche-banner, cf. _notre-demarche.scss) ----- */
.rolebanner__wrapper {
  position: relative;
  background: url("/assets/default/img/votre_role_banner.webp") center 30%/cover no-repeat;
  /* calque de la maquette : dégradé noir 20 % → blanc 20 % en mode « Produit » (multiply) :
     le noir assombrit à gauche, le blanc ne délave plus la photo à droite → rendu plus dense */
}
.rolebanner__wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(73deg, rgba(39, 36, 37, 0.2) 25%, rgba(255, 255, 255, 0.2) 100%);
  mix-blend-mode: multiply;
}
@media screen and (min-width: 1200px) {
  .rolebanner__wrapper .demarche-banner {
    min-height: 50rem; /* 30rem sur Notre démarche (_notre-demarche.scss) */
  }
}

/* --- Intro (contenu principal) --------------------------------------------- */
/* _home.scss passe `.main__wrapper .container` en flex centré : on rend toute la largeur */
.votrerole-main {
  flex: 1 1 100%;
}

.role-intro {
  text-align: center;
  padding: 3.2rem 0 0;
}
.role-intro p {
  text-align: center; /* _home.scss force `.main__wrapper p` à gauche */
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 600;
  font-size: 2.5rem;
  line-height: 1.2;
  color: #272425;
  margin: 0;
}
@media screen and (min-width: 1200px) {
  .role-intro p {
    font-size: 4rem;
  }
}

/* --- Groupes d'acteurs ------------------------------------------------------ */
.rolegroupe__wrapper {
  display: flow-root; /* garde les marges du panneau crème dans le fond blanc */
  background: #fff;
  margin-top: -1px; /* liseré sous-pixel entre sections empilées (fond body sombre) */
  overflow-x: clip; /* les photos débordent jusqu'au bord de la fenêtre (clip ≠ hidden) */
}

/* dernier groupe : le logo du footer remonte d'environ 65px sur la section précédente */
.rolegroupe4__wrapper {
  padding-bottom: 9.6rem;
}

.role-groupe {
  display: flow-root; /* contient la photo flottante */
  padding: 3.2rem 0;
}
.role-groupe--fond {
  background: #FAFAF8;
  padding: 3.2rem 2.4rem;
  margin: 1.6rem 0;
}
.role-groupe__photo {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 487/420;
  -o-object-fit: cover;
     object-fit: cover;
  margin: 0 0 2.4rem;
}
.role-groupe__titre {
  display: flow-root; /* le trait s'arrête avant la photo flottante */
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 3rem;
  line-height: 1.2;
  color: #272425;
  border-bottom: 1px solid #A4AFB8;
  padding-bottom: 1.6rem;
  margin: 0 0 3.2rem;
}
@media screen and (min-width: 1200px) {
  .role-groupe {
    max-width: 1160px;
    margin: 0 auto;
    padding: 4.8rem 0;
    /* Photo collée au bord droit de la fenêtre ; le texte coule à côté puis
       reprend toute la largeur dessous (float). */
    /* Panneau crème : le fond déborde de 60px de chaque côté du contenu
       (maquette 1279px) sans changer la largeur du contenu → le calcul du
       débord de la photo reste le même. */
  }
  .role-groupe__photo {
    float: right;
    width: calc(347px + calc((100vw - 1160px) / 2));
    height: 42rem;
    aspect-ratio: auto;
    margin: 0 calc(-1 * calc((100vw - 1160px) / 2)) 2.4rem 60px;
  }
  .role-groupe--photo-gauche .role-groupe__photo {
    float: left;
    margin: 0 60px 2.4rem calc(-1 * calc((100vw - 1160px) / 2));
  }
  .role-groupe__titre {
    font-size: 4.5rem;
  }
  .role-groupe--fond {
    position: relative;
    isolation: isolate;
    background: none;
    padding: 6.4rem 0;
    margin: 2.4rem auto;
  }
  .role-groupe--fond::before {
    content: "";
    position: absolute;
    inset: 0 calc(-1 * min(60px, calc((100vw - 1160px) / 2)));
    background: #FAFAF8;
    z-index: -1;
  }
}

.role-acteur {
  position: relative;
  padding-left: 4.4rem;
  margin-bottom: 3.2rem;
}
.role-acteur:last-child {
  margin-bottom: 0;
}
.role-acteur__icone {
  position: absolute;
  left: 0;
  top: 0;
  width: 3rem;
  height: 3rem;
}
.role-acteur__titre {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 600;
  font-size: 1.8rem;
  line-height: 1.37;
  letter-spacing: 0.05rem;
  text-transform: uppercase;
  color: #A27E49;
  margin: 0 0 1.2rem;
}
.role-acteur__texte p {
  font-size: 1.8rem;
  line-height: 1.47;
  color: #272425;
  margin: 0 0 0.8rem;
}
.role-acteur__sous-titre {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-size: 2.1rem;
  color: #A4AFB8;
  margin: 2.4rem 0 1.2rem;
}
.role-acteur__liste {
  list-style: none;
  margin: 0 0 1.6rem;
  padding: 0;
}
.role-acteur__liste li {
  position: relative;
  padding-left: 3.6rem;
  font-size: 1.8rem;
  line-height: 1.5;
  margin-bottom: 0.8rem;
}
.role-acteur__liste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.3rem;
  width: 2.2rem;
  height: 2.2rem;
  background: #A27E49;
  -webkit-mask: url("/assets/default/img/demarche_check.svg") center/contain no-repeat;
  mask: url("/assets/default/img/demarche_check.svg") center/contain no-repeat;
}
.role-acteur__liens {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 0.8rem 4.8rem;
  margin: 1.6rem 0 0;
}
.role-acteur__lien {
  display: inline-flex;
  align-items: center;
  gap: 1.2rem;
  font-size: 1.8rem;
  line-height: 1.47;
  color: #7D7C7C;
  text-decoration: none;
  transition: color 0.2s;
}
.role-acteur__lien::before {
  content: "";
  flex: 0 0 auto;
  width: 3.2rem;
  height: 3.2rem;
  background: currentColor;
  -webkit-mask: url("/assets/default/img/votre_role_arrow.svg") center/contain no-repeat;
  mask: url("/assets/default/img/votre_role_arrow.svg") center/contain no-repeat;
}
.role-acteur__lien:hover, .role-acteur__lien:focus-visible {
  color: #A27E49;
}
@media screen and (min-width: 1200px) {
  .role-acteur {
    padding-left: 6.4rem;
    margin-bottom: 4.8rem;
    /* Photo à droite : le texte coule à côté puis s'élargit dessous.
       Photo à gauche : le bloc doit rester entier à côté (sinon l'icône et le
       retrait passent sous la photo) → contexte de formatage propre. */
    /* comme sur la maquette : seul le 1er acteur est à côté de la photo */
  }
  .role-groupe--photo-gauche .role-acteur {
    display: flow-root;
  }
  .role-acteur + .role-acteur {
    clear: both;
  }
  .role-acteur__liens {
    justify-content: flex-end;
  }
  .role-acteur__icone {
    width: 3.8rem;
    height: 3.8rem;
  }
  .role-acteur__titre {
    font-size: 2.1rem;
  }
  .role-acteur__liste {
    margin-left: 3.2rem;
  }
}

/* ==========================================================================
   Page « L'observatoire » (maquette Figma node 1351:2005)
   Page template pur. Zones template (cf. storage/app/pages/observatoire.json) :
   obsbanner__wrapper (widget demarcheBanner réutilisé), puis
   obsintro / obsdefinition / obsindicateurs / obsetude / obscta __wrapper
   (widget observatoireSection : tout le markup est dans le html du snippet).
   ========================================================================== */
/* titres et flèches du bloc « base de travail » */
/* descriptions du bloc « base de travail » */
/* du bord du contenu au bord de la fenêtre (xl) */
/* flèche ronde (asset de Votre rôle), colorée par currentColor */
/* le .container vaut 1440px en xxl : on borne le contenu à la largeur de la maquette
   (140 → 1300 px sur 1440), comme .role-groupe sur Votre rôle */
@media screen and (min-width: 1200px) {
  .obs-intro,
  .obs-synerpa,
  .obs-definition,
  .obs-indicateurs,
  .obs-etude,
  .obs-cta {
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* les titres du site ont une marge et une graisse par défaut (base/_fonts.scss) */
.obs-cta__titre, .obs-etude__titre, .obs-indicateur__titre, .obs-indicateurs__titre, .obs-definition__titre, .obs-synerpa__titre, .obs-intro__titre {
  margin: 0;
  font-weight: 300;
  letter-spacing: 0;
}

/* --- Boutons (base .btn de commons/_btn.scss) ------------------------------ */
.obs-btn {
  margin: 0;
  font-weight: 600;
}
.obs-btn--contour {
  background: transparent;
  border: 1px solid #A27E49;
  color: #A27E49;
}
.obs-btn--contour::after {
  display: none;
}
.obs-btn--contour:hover {
  color: #fff;
  border-color: #272425;
}
.obs-btn--noir::after {
  background: #272425;
}
.obs-btn--noir:hover::before {
  background: #A27E49;
}

/* --- Bandeau titre (markup .demarche-banner, cf. _notre-demarche.scss) ----- */
.obsbanner__wrapper {
  position: relative;
  background: url("/assets/default/img/observatoire_hero.webp") center 35%/cover no-repeat;
  /* calque de la maquette : dégradé noir 30 % → gris 30 % */
}
.obsbanner__wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(86deg, rgba(0, 0, 0, 0.3) 31%, rgba(102, 102, 102, 0.3) 99%);
}
.obsbanner__wrapper .demarche-banner__title {
  color: #fff;
}
@media screen and (min-width: 1200px) {
  .obsbanner__wrapper .demarche-banner {
    min-height: 42rem;
    padding-bottom: 16rem; /* la carte d'intro remonte sur la photo */
  }
}

/* --- Intro : carte « Pourquoi comparer… » + objectifs + carte Synerpa -------- */
.obsintro__wrapper {
  background: linear-gradient(180deg, #fff 0%, #FAFAF8 90%);
  margin-top: -1px;
  padding-bottom: 6.4rem;
}

.obs-intro {
  display: grid;
  gap: 4.8rem;
  padding-top: 3.2rem;
}
.obs-intro__carte {
  position: relative;
  z-index: 1;
}
.obs-intro__titre {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-size: 3rem;
  line-height: 1.12;
  color: #272425;
  margin-bottom: 3.2rem;
}
.obs-intro p {
  font-size: 1.8rem;
  line-height: 1.47;
  color: #000000;
  margin: 0 0 0.4rem;
}
.obs-intro__chapo {
  font-weight: 600;
}
.obs-intro__action {
  margin-top: 3.2rem !important;
  text-align: right;
}
@media screen and (min-width: 1200px) {
  .obs-intro {
    grid-template-columns: 753px 1fr;
    gap: 61px;
    padding-top: 0;
  }
  .obs-intro__carte {
    margin-top: -7.8rem;
    padding: 4.5rem 5.8rem 5.8rem;
    border-radius: 8px;
    background: linear-gradient(180deg, #FAFAF8 10%, #fff 100%);
  }
  .obs-intro__titre {
    font-size: 4.2rem;
    margin-bottom: 4.8rem;
  }
}

.obs-objectifs__titre {
  font-size: 2.2rem;
  font-weight: 600;
  letter-spacing: 0.044rem;
  text-transform: uppercase;
  color: #A27E49;
  margin: 0 0 2.4rem;
}
.obs-objectifs__liste {
  list-style: none;
  margin: 0;
  padding: 0;
}
.obs-objectifs__liste li {
  position: relative;
  padding-left: 4.2rem;
  margin-bottom: 3.2rem;
  font-size: 1.8rem;
  line-height: 1.46;
  color: #000000;
  text-align: left;
}
.obs-objectifs__liste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2rem;
  width: 2.8rem;
  height: 2.8rem;
  background: currentColor;
  -webkit-mask: url("/assets/default/img/votre_role_arrow.svg") center/contain no-repeat;
  mask: url("/assets/default/img/votre_role_arrow.svg") center/contain no-repeat;
  color: #7D7C7C;
}
.obs-objectifs__liste em {
  display: block;
  font-family: "Merriweather", Georgia, serif;
  font-weight: 300;
}
.obs-objectifs__liste strong {
  font-weight: 700;
}
@media screen and (min-width: 1200px) {
  .obs-objectifs {
    padding-top: 4.8rem;
    max-width: 34.5rem;
  }
}

.obs-synerpa {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-top: 6.4rem;
  border-radius: 6px;
  overflow: hidden;
  background: #f1f1f1;
  box-shadow: 0 40px 60px -40px rgba(0, 0, 0, 0.35);
}
.obs-synerpa__media {
  position: relative;
  aspect-ratio: 16/7;
}
.obs-synerpa__photo {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: left center;
     object-position: left center;
}
.obs-synerpa__logo {
  position: absolute;
  left: 4.4rem;
  bottom: 0;
  width: 22.8rem;
  padding: 1.8rem 1.8rem 1.4rem;
  background: #fff;
  border-radius: 10px 10px 0 0;
}
.obs-synerpa__corps {
  position: relative;
  padding: 3.2rem 2.4rem;
}
.obs-synerpa__titre {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 600;
  font-size: 2.7rem;
  line-height: 1.22;
  color: #000;
  margin-bottom: 1.2rem;
}
.obs-synerpa p {
  font-size: 1.8rem;
  line-height: 1.35;
  color: #000;
  margin: 0 0 2.4rem;
}
.obs-synerpa p:last-child {
  margin: 0;
}
@media screen and (min-width: 1000px) {
  .obs-synerpa {
    display: block;
    min-height: 24.8rem;
  }
  .obs-synerpa__media {
    position: absolute;
    inset: 0;
    aspect-ratio: auto;
    /* voile blanc de la maquette sur la partie droite */
  }
  .obs-synerpa__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(85deg, rgba(255, 255, 255, 0) 34%, rgba(255, 255, 255, 0.63) 82%);
  }
  .obs-synerpa__logo {
    z-index: 1;
  }
  .obs-synerpa__corps {
    margin-left: 48%;
    padding: 4.3rem 5rem 4.1rem 0;
  }
}

/* --- « Qu'est-ce que l'Observatoire WeDoxa ? » (fond or biseauté) ----------- */
.obsdefinition__wrapper {
  position: relative;
  isolation: isolate;
  background: #FAFAF8; /* visible au-dessus du biseau (le body est sombre) */
  margin-top: -1px;
  padding: 12rem 0 6.4rem;
  /* ombre intérieure de la maquette (inner shadow dy 24, flou 54, noir 25 %) :
     une bande dégradée inclinée comme le biseau (skewY de la pente du polygone) */
}
.obsdefinition__wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, #BA9E67 0%, #A27E49 100%);
  clip-path: polygon(0 6rem, 100% 0, 100% 100%, 0 100%);
}
.obsdefinition__wrapper::after {
  content: "";
  position: absolute;
  left: 0;
  top: 6rem;
  width: 100%;
  height: 8rem;
  z-index: -1;
  pointer-events: none;
  transform-origin: 0 0;
  transform: skewY(calc(-1 * atan2(6rem, 100vw)));
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.22) 0, rgba(0, 0, 0, 0.08) 40%, rgba(0, 0, 0, 0) 100%);
}
@media screen and (min-width: 1200px) {
  .obsdefinition__wrapper {
    padding: 17.5rem 0 8rem;
  }
  .obsdefinition__wrapper::before {
    clip-path: polygon(0 12rem, 100% 1rem, 100% 100%, 0 100%);
  }
  .obsdefinition__wrapper::after {
    top: 12rem;
    transform: skewY(calc(-1 * atan2(11rem, 100vw)));
  }
}

.obs-definition {
  display: grid;
  gap: 3.2rem;
  color: #fff;
}
.obs-definition__photo {
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
}
.obs-definition__titre {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-size: 3rem;
  line-height: 1.25;
  color: #fff;
  margin-bottom: 1.6rem;
}
.obs-definition__texte {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.47;
  color: #fff;
  margin: 0 0 3.2rem;
  text-align: left;
}
.obs-definition__encadre {
  border-left: 1px solid #272425;
  padding-left: 2.4rem;
}
.obs-definition__encadre p {
  font-size: 1.8rem;
  line-height: 1.47;
  color: #000;
  margin: 0 0 0.4rem;
  text-align: left;
}
.obs-definition__citation {
  grid-column: 1/-1;
  margin: 3.2rem 0 0;
  font-size: 2.1rem;
  font-weight: 600;
  line-height: 1.46;
  text-align: center;
  color: #fff;
}
@media screen and (min-width: 1200px) {
  .obs-definition {
    grid-template-columns: 347px 1fr;
    gap: 0 60px;
    /* coupe comme la maquette : « …l'Observatoire / WeDoxa ? » */
  }
  .obs-definition__photo {
    aspect-ratio: 347/430;
  }
  .obs-definition__titre {
    font-size: 4.5rem;
    max-width: 62rem;
    margin-bottom: 3.2rem;
  }
  .obs-definition__texte {
    font-size: 2rem;
    margin-bottom: 4.8rem;
  }
  .obs-definition__encadre {
    padding-left: 5rem;
  }
  .obs-definition__citation {
    margin-top: 4rem;
    font-size: 2.5rem;
  }
}

/* --- Les indicateurs suivis ------------------------------------------------ */
.obsindicateurs__wrapper {
  background: linear-gradient(180deg, #fff 0%, #FAFAF8 75%);
  margin-top: -1px;
  padding: 6.4rem 0;
}
@media screen and (min-width: 1200px) {
  .obsindicateurs__wrapper {
    padding: 7rem 0 9rem;
  }
}

.obs-indicateurs__titre {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-size: 3rem;
  line-height: 1.2;
  color: #272425;
  margin-bottom: 0.8rem;
}
.obs-indicateurs__intro {
  font-size: 1.8rem;
  line-height: 1.47;
  color: #000;
  margin: 0;
  text-align: left;
  /* trait or sous l'intro */
}
.obs-indicateurs__intro::after {
  content: "";
  display: block;
  width: 9.8rem;
  height: 3px;
  margin-top: 2.4rem;
  background: #A27E49;
}
.obs-indicateurs__grille {
  display: grid;
  gap: 3.2rem 6rem;
  margin-top: 4.8rem;
}
@media screen and (min-width: 1000px) {
  .obs-indicateurs__grille {
    grid-template-columns: 1fr 1fr;
    grid-auto-flow: column;
    grid-template-rows: repeat(3, auto);
  }
}
@media screen and (min-width: 1200px) {
  .obs-indicateurs__titre {
    font-size: 4.4rem;
  }
  .obs-indicateurs__intro {
    font-size: 1.9rem;
  }
  .obs-indicateurs__grille {
    margin-top: 5rem;
    row-gap: 3rem;
  }
}

.obs-indicateur {
  position: relative;
  padding-left: 5.2rem;
}
.obs-indicateur__icone {
  position: absolute;
  left: 0;
  top: 0.2rem;
  width: 3.2rem;
  height: 3.2rem;
}
.obs-indicateur__titre {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 2.2rem;
  line-height: 1.47;
  color: #A27E49;
}
.obs-indicateur p {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.47;
  color: #000;
  margin: 0;
  text-align: left;
}
.obs-indicateur__lien {
  font-size: 1.8rem;
  color: #7D7C7C;
  text-decoration: underline !important;
}
.obs-indicateur__lien:hover {
  color: #A27E49;
}
@media screen and (min-width: 1200px) {
  .obs-indicateur p {
    font-size: 2rem;
  }
}

/* --- Exemple d'étude : Observatoire national en EHPAD ---------------------- */
.obsetude__wrapper {
  background: #fff;
  margin-top: -1px;
  padding: 6.4rem 0;
}
@media screen and (min-width: 1200px) {
  .obsetude__wrapper {
    padding: 6.7rem 0 9rem;
  }
}

.obs-etude__surtitre {
  font-size: 1.8rem;
  font-weight: 600;
  letter-spacing: 0.6rem;
  text-transform: uppercase;
  text-align: center;
  color: #A27E49;
  margin: 0 0 1.2rem;
}
.obs-etude__titre {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-size: 3rem;
  line-height: 1.25;
  text-align: center;
  color: #272425;
  margin-bottom: 1.2rem;
}
.obs-etude__soustitre {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.47;
  text-align: center !important;
  color: #000;
  margin: 0;
}
.obs-etude__media {
  position: relative;
  margin: 3.2rem 0;
}
.obs-etude__image {
  width: 100%;
  height: 20rem;
  -o-object-fit: cover;
     object-fit: cover;
  opacity: 0.7; /* voile blanc 30 % de la maquette */
}
.obs-etude__logo {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 18rem;
  padding: 1.6rem 1.8rem;
  background: #fff;
  border-radius: 20px 0 0 0;
}
.obs-etude__pied {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}
.obs-etude__pied p {
  font-size: 1.8rem;
  line-height: 1.47;
  color: #000;
  margin: 0;
  text-align: left;
}
@media screen and (min-width: 1000px) {
  .obs-etude__pied {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 6rem;
  }
  .obs-etude__pied p {
    max-width: 71rem;
  }
}
@media screen and (min-width: 1200px) {
  .obs-etude__surtitre {
    font-size: 2.5rem;
    letter-spacing: 1rem;
  }
  .obs-etude__titre {
    font-size: 4.5rem;
  }
  .obs-etude__soustitre, .obs-etude__pied p {
    font-size: 2rem;
  }
  .obs-etude__media {
    margin: 4.4rem 0 6rem;
  }
  .obs-etude__image {
    height: 29.8rem;
  }
  .obs-etude__logo {
    width: 29.6rem;
    padding: 2.4rem 2.4rem;
  }
  .obs-etude__pied .obs-btn {
    flex: 0 0 32.3rem;
  }
}

/* --- CTA « Vous souhaitez créer un observatoire… » ------------------------- */
.obscta__wrapper {
  background: linear-gradient(180deg, #BA9E67 0%, #A27E49 100%);
  box-shadow: inset 0 24px 54px rgba(0, 0, 0, 0.25);
  margin-top: -1px;
  padding: 6.4rem 0 9.6rem; /* le logo du footer remonte sur cette section */
  overflow-x: clip; /* le panneau déborde jusqu'au bord droit */
}
@media screen and (min-width: 1200px) {
  .obscta__wrapper {
    padding: 7.5rem 0 12rem;
  }
}

.obs-cta {
  display: grid;
  gap: 4.8rem;
}
.obs-cta__titre {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-size: 3rem;
  line-height: 1.1;
  color: #fff;
}
.obs-cta__accroche {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.5rem;
  color: #272425;
  margin: 1.2rem 0 0;
}
.obs-cta__base {
  margin-top: 3.2rem;
}
.obs-cta__base-titre {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.47;
  letter-spacing: 0.04rem;
  text-transform: uppercase;
  color: #5F4C28;
  margin: 0 0 1.6rem;
}
.obs-cta__liste {
  list-style: none;
  margin: 0;
  padding: 0;
}
.obs-cta__liste li {
  position: relative;
  padding-left: 4rem;
  margin-bottom: 1.6rem;
  color: #5F4C28;
}
.obs-cta__liste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2rem;
  width: 2.6rem;
  height: 2.6rem;
  background: currentColor;
  -webkit-mask: url("/assets/default/img/votre_role_arrow.svg") center/contain no-repeat;
  mask: url("/assets/default/img/votre_role_arrow.svg") center/contain no-repeat;
}
.obs-cta__liste strong {
  display: block;
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.2rem;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0.4rem;
}
.obs-cta__liste span {
  display: block;
  font-size: 1.6rem;
  line-height: 1.2;
  color: #554015;
}
.obs-cta__panneau {
  padding: 3.2rem 2.4rem;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  box-shadow: -33px 10px 75px rgba(117, 117, 117, 0.1), -130px 38px 136px rgba(117, 117, 117, 0.09);
}
.obs-cta__panneau p {
  font-size: 2.5rem;
  line-height: 1.3;
  color: #fff;
  margin: 0 0 3.2rem;
  text-align: left;
}
@media screen and (min-width: 800px) {
  .obs-cta__base {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 4.8rem;
  }
}
@media screen and (min-width: 1200px) {
  .obs-cta {
    grid-template-columns: 1fr 34.5rem;
    gap: 0 6rem;
  }
  .obs-cta__titre {
    font-size: 4.8rem;
    max-width: 75rem;
  }
  .obs-cta__accroche {
    font-size: 3.9rem;
    margin-top: 0.8rem;
  }
  .obs-cta__base {
    margin-top: 6rem;
    grid-template-columns: 34.5rem 30rem;
    gap: 0 6rem;
  }
  .obs-cta__base-titre {
    font-size: 2rem;
    margin-bottom: 3.2rem;
  }
  .obs-cta__panneau {
    align-self: start;
    margin-top: 11rem;
    margin-right: calc(-1 * calc((100vw - 1160px) / 2));
    padding: 6rem calc(calc((100vw - 1160px) / 2) + 2rem) 5.2rem 5.7rem;
    border-radius: 8px 0 0 8px;
  }
  .obs-cta__panneau p {
    font-size: 3rem;
    margin-bottom: 4rem;
  }
  .obs-cta__panneau .obs-btn {
    display: block;
    width: 28.5rem;
  }
}

/* ==========================================================================
   Page « Cas d'usage » de l'observatoire (maquette Figma node 1355:2502)
   URL : /fr/l-observatoire/cas_usage. Page template pur. Zones template
   (cf. storage/app/pages/cas-usage.json) :
   cubanner__wrapper (widget demarcheBanner réutilisé), puis
   cuintro / cuetude / cu{participation,csat,nps,notes,cvs,maltraitance} /
   cutelechargement __wrapper (widget observatoireSection : tout le markup est
   dans le html du snippet). Les 6 zones de graphiques portent aussi
   .cugraphes__wrapper. Boutons : .obs-btn (_observatoire.scss).
   ========================================================================== */
/* libellés « Résidents / Proches aidants », dates */
/* légende sous les graphiques */
/* « Que faut-il observer ? », « L'analyse WeDoxa » */
/* le .container vaut 1440px en xxl : on borne le contenu à la maquette (1160px) */
@media screen and (min-width: 1200px) {
  .cu-intro,
  .cu-etude,
  .cu-section,
  .cu-telechargement {
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* les titres du site ont une marge et une graisse par défaut (base/_fonts.scss) */
.cu-telechargement__titre, .cu-section__titre, .cu-etude__titre, .cu-intro__titre {
  margin: 0;
  letter-spacing: 0;
}

/* --- Bandeau titre (markup .demarche-banner, cf. _notre-demarche.scss) ----- */
.cubanner__wrapper {
  position: relative;
  background: url("/assets/default/img/cas_usage_hero.webp") center 40%/cover no-repeat;
  /* voile sombre pour la lisibilité du titre blanc */
}
.cubanner__wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(86deg, rgba(0, 0, 0, 0.45) 25%, rgba(0, 0, 0, 0.1) 95%);
}
.cubanner__wrapper .demarche-banner__title {
  color: #fff;
  max-width: 111rem;
}
@media screen and (min-width: 1200px) {
  .cubanner__wrapper .demarche-banner {
    max-width: 1160px; /* aligné sur le contenu, comme la maquette */
    margin-left: auto;
    margin-right: auto;
    min-height: 50rem;
    padding-bottom: 12rem; /* la carte d'intro remonte sur la photo */
  }
  .cubanner__wrapper .demarche-banner__title {
    font-size: 4.8rem;
    line-height: 1.08;
  }
  .cubanner__wrapper .demarche-banner__subtitle {
    font-size: 3.2rem;
  }
}

/* --- Intro « Une ambition collective… » ------------------------------------ */
.cuintro__wrapper {
  background: #fff;
  margin-top: -1px;
  padding-bottom: 4.8rem;
}

.cu-intro {
  position: relative;
  z-index: 1;
  padding-top: 4.8rem;
  /* puces : disque or de 10px centré sur la 1re ligne */
}
.cu-intro__titre {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 300;
  font-size: 3rem;
  line-height: 1.12;
  color: #272425;
  margin-bottom: 2.4rem;
}
.cu-intro p {
  font-size: 1.8rem;
  line-height: 1.47;
  color: #000000;
  margin: 0 0 2.4rem;
  text-align: left;
}
.cu-intro strong {
  font-weight: 600;
}
.cu-intro p.cu-intro__chapo {
  font-weight: 600;
  margin-bottom: 4.8rem;
}
.cu-intro p.cu-intro__surtitre {
  font-weight: 600;
  line-height: 1.22;
  letter-spacing: 0.044rem;
  text-transform: uppercase;
  color: #A27E49;
  margin-bottom: 1.6rem;
  /* tiret or sous le titre (maquette : 98 x 2 px, ~20px sous le texte) */
}
.cu-intro p.cu-intro__surtitre::after {
  content: "";
  display: block;
  width: 98px;
  height: 2px;
  margin-top: 20px;
  background: #A27E49;
}
.cu-intro__colonnes {
  margin-top: 4.8rem;
}
.cu-intro__liste {
  list-style: none;
  margin: 0 0 2.4rem;
  padding-left: 0;
}
.cu-intro__liste li {
  position: relative;
  padding-left: 23px;
  font-size: 1.8rem;
  line-height: 1.47;
  color: #000000;
  margin-bottom: 1rem;
}
.cu-intro__liste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc((1.47em - 10px) / 2);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #A27E49;
}
.cu-intro p.cu-intro__encadre {
  margin: 3.2rem 0 0;
  padding: 2.4rem;
  background: #f6f6f6;
  text-align: center;
}
@media screen and (min-width: 800px) {
  .cu-intro__colonnes {
    display: grid;
    grid-template-columns: 27.8rem 1fr;
    gap: 0 8.5rem;
  }
}
@media screen and (min-width: 1200px) {
  .cu-intro {
    margin-top: -8.5rem;
    padding: 4.5rem 6.8rem 0;
    border-radius: 8px;
    background: linear-gradient(180deg, #FAFAF8 0%, #fff 12rem);
  }
  .cu-intro__titre {
    font-size: 4.2rem;
    margin-bottom: 3.2rem;
  }
  .cu-intro p {
    font-size: 1.8rem;
  }
  .cu-intro p.cu-intro__chapo {
    font-size: 2.2rem;
  }
  .cu-intro p.cu-intro__surtitre {
    font-size: 2.2rem;
  }
  .cu-intro__liste li {
    font-size: 1.8rem;
  }
  .cu-intro p.cu-intro__encadre {
    margin: 5rem -3.8rem 0;
    padding: 2.8rem 4.5rem;
  }
}

/* --- L'étude + « Bon à savoir » -------------------------------------------- */
.cuetude__wrapper {
  background: #fff;
  margin-top: -1px;
  padding: 4.8rem 0;
}
@media screen and (min-width: 1200px) {
  .cuetude__wrapper {
    padding: 6rem 0 8rem;
  }
}

.cu-etude__titre {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 300;
  font-size: 3rem;
  line-height: 1.12;
  text-align: center;
  color: #272425;
}
.cu-etude__periode {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 1.8rem;
  line-height: 1.47;
  text-align: center !important;
  color: #7d7c7c;
  margin: 1.2rem 0 4.8rem;
}
.cu-etude__corps {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
}
.cu-etude__image {
  width: 100%;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 25px 45px -30px rgba(0, 0, 0, 0.45);
}
.cu-etude__savoir p {
  font-size: 1.6rem;
  line-height: 1.47;
  color: #000000;
  margin: 0 0 0.6rem;
  text-align: left;
}
.cu-etude__savoir-titre {
  font-size: 2rem !important;
  font-weight: 600;
  line-height: 1.35 !important;
  margin-bottom: 1.2rem !important;
}
.cu-etude__lien {
  color: #A27E49;
  text-decoration: underline !important;
}
.cu-etude__lien:hover {
  color: #272425;
}
@media screen and (min-width: 1000px) {
  .cu-etude__corps {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 6rem;
  }
  .cu-etude__image {
    flex: 0 0 57.4rem;
    width: 57.4rem;
  }
  .cu-etude__savoir {
    flex: 0 0 28.8rem;
  }
}
@media screen and (min-width: 1200px) {
  .cu-etude__titre {
    font-size: 4.2rem;
  }
  .cu-etude__periode {
    font-size: 1.9rem;
  }
}

/* --- Sections de graphiques ------------------------------------------------ */
.cugraphes__wrapper {
  background: #fff;
  margin-top: -1px;
  padding: 3.2rem 0;
}
@media screen and (min-width: 1200px) {
  .cugraphes__wrapper {
    padding: 3.5rem 0;
  }
}

.cu-section {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
}
.cu-section__titre {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.5rem;
  line-height: 1.2;
  color: #272425;
}
@media screen and (min-width: 1200px) {
  .cu-section {
    gap: 3rem;
  }
  .cu-section__titre {
    font-size: 3rem;
  }
}

/* carte : graphique (cliquable pour l'agrandir) + analyse */
.cu-graph {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  padding: 2.4rem;
  border-radius: 6px;
  background: linear-gradient(180deg, #FAFAF8 0%, #fff 100%);
  /* maquette : graphique 753px à gauche, analyse 319px à droite,
     qui défile dans la hauteur de la carte */
}
.cu-graph__cible {
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.35;
  color: #7d7c7c;
  margin: 0 0 1.6rem;
  text-align: left;
}
.cu-graph__zoom {
  position: relative;
  display: block;
  border-radius: 8px;
  box-shadow: 0 25px 45px -30px rgba(0, 0, 0, 0.35);
  /* pastille loupe (maquette : rond gris #E4E4E4 40px en « produit »,
     loupe « + » noire = vecteur Figma) en bas à droite du graphique */
}
.cu-graph__zoom::after {
  content: "";
  position: absolute;
  right: 16px;
  bottom: 16px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #e4e4e4 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.4461 19.4461'%3E%3Cpath fill='black' d='M15.3501 13.9912L19.4461 18.0871L18.0871 19.4461L13.9912 15.3501C13.2384 15.9499 12.4154 16.4092 11.5222 16.7282C10.5779 17.06 9.6082 17.2258 8.61292 17.2258C7.05621 17.2258 5.60798 16.8367 4.26818 16.0583C2.96667 15.2927 1.93951 14.2592 1.18667 12.9577C0.395553 11.6179 0 10.1696 0 8.61292C0 7.05621 0.395553 5.60797 1.18667 4.26818C1.93951 2.96667 2.96667 1.93951 4.26818 1.18667C5.60798 0.395553 7.05621 0 8.61292 0C10.1696 0 11.6179 0.395553 12.9577 1.18667C14.2592 1.93951 15.2927 2.96667 16.0583 4.26818C16.8367 5.60797 17.2258 7.05621 17.2258 8.61292C17.2258 9.6082 17.06 10.5779 16.7282 11.5222C16.4092 12.4154 15.9499 13.2384 15.3501 13.9912ZM13.417 13.283C14.0167 12.6706 14.4825 11.9688 14.8142 11.1777C15.146 10.361 15.3119 9.50612 15.3119 8.61292C15.3119 7.40073 15.0056 6.27149 14.3931 5.22517C13.8062 4.21714 13.0087 3.41965 12.0007 2.83269C10.9544 2.22022 9.82512 1.91398 8.61292 1.91398C7.40073 1.91398 6.27149 2.22022 5.22517 2.83269C4.21714 3.41965 3.41965 4.21714 2.83269 5.22517C2.22022 6.27149 1.91398 7.40073 1.91398 8.61292C1.91398 9.82511 2.22022 10.9544 2.83269 12.0007C3.41965 13.0087 4.21714 13.8062 5.22517 14.3931C6.27149 15.0056 7.40073 15.3119 8.61292 15.3119C9.50612 15.3119 10.361 15.146 11.1777 14.8142C11.9688 14.4825 12.6706 14.0167 13.283 13.417L13.417 13.283ZM7.65593 7.65593V4.78496H9.56991V7.65593H12.4409V9.56991H9.56991V12.4409H7.65593V9.56991H4.78496V7.65593H7.65593Z'/%3E%3C/svg%3E") center/19px no-repeat;
  mix-blend-mode: multiply;
  transition: transform 0.2s ease;
}
.cu-graph__zoom:hover::after {
  transform: scale(1.1);
}
.cu-graph__image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
}
.cu-graph__legende {
  font-size: 1.4rem;
  font-style: italic;
  line-height: 1.47;
  color: #9f9f9f;
  margin: 1.2rem 0 0;
  text-align: left;
}
.cu-graph__analyse p {
  font-size: 1.6rem;
  line-height: 1.45;
  color: #000000;
  margin: 0 0 2.4rem;
  text-align: left;
}
.cu-graph__analyse p:last-child {
  margin-bottom: 0;
}
.cu-graph__analyse p.cu-graph__titre {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.35;
  color: #ab8248;
  margin-bottom: 0.8rem;
}
@media screen and (min-width: 1200px) {
  .cu-graph {
    flex-direction: row;
    align-items: flex-start;
    gap: 1rem;
    padding: 3.1rem 2.7rem 2.6rem 5rem;
    min-height: 53rem;
  }
  .cu-graph__visuel {
    flex: 0 0 753px; /* en px : 1rem vaut plus de 10px sur ce site */
  }
  .cu-graph__cible {
    margin-bottom: 2.6rem;
  }
  .cu-graph__analyse {
    flex: 1 1 auto;
    margin-top: 4rem;
    max-height: 41.7rem;
    overflow-y: auto;
    padding-right: 2.4rem;
    scrollbar-width: thin;
    scrollbar-color: #d9d9d9 transparent;
  }
}

/* --- Bandeau final « Télécharger l'étude complète » ------------------------ */
.cutelechargement__wrapper {
  background: #fff;
  margin-top: -1px;
  padding: 4.8rem 0 9.6rem; /* le logo du footer remonte sur cette section */
}
@media screen and (min-width: 1200px) {
  .cutelechargement__wrapper {
    padding: 6rem 0 14rem;
  }
}

.cu-telechargement {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  padding: 3.2rem 2.4rem;
  overflow: hidden;
  background: #e3e3e3;
  /* photo éclaircie de la maquette (mode « Écran », 80 %) */
}
.cu-telechargement::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url("/assets/default/img/cas_usage_bandeau.webp") center/cover no-repeat;
  mix-blend-mode: screen;
  opacity: 0.8;
}
.cu-telechargement__titre {
  font-family: "Nunito Sans", system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-size: 2.5rem;
  line-height: 1.08;
  color: #000;
}
.cu-telechargement__periode {
  font-family: "Merriweather", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 1.8rem;
  line-height: 1.47;
  color: #7d7c7c;
  margin: 1.2rem 0 0;
  text-align: left;
}
.cu-telechargement__btn {
  align-self: flex-start;
  border-radius: 50px;
}
@media screen and (min-width: 1000px) {
  .cu-telechargement {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    min-height: 20.8rem;
    padding: 4rem 5.8rem 4rem 6.6rem;
  }
  .cu-telechargement__btn {
    align-self: center;
    flex: 0 0 38.1rem;
  }
}
@media screen and (min-width: 1200px) {
  .cu-telechargement__titre {
    font-size: 3.5rem;
  }
}

article.article {
  /*---- texte classique ---*/
  /*-----Videos---*/
  /* --- Configuration Globale du composant mosaique--- */
  /*--------------------------
  * Témoignages
  --------------------------*/
  /*--------------------------
  * Banner
  --------------------------*/
  /*--------------------------
  * Hero
  --------------------------*/
}
article.article .cartouche {
  background: #272425;
  color: #fff;
  padding: 3rem 5rem;
}
article.article .card--video {
  max-width: none;
}
article.article .card--video iframe {
  aspect-ratio: 16/9;
}
article.article .mosaicBlock {
  margin: 3rem auto;
  padding: 0px;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  position: relative;
  /* --- Styles des Images --- */
  /* Le petit trait jaune sous le titre */
  /* --- Style du Bloc Jaune (Baseline) --- */
  /* --- VERSION DESKTOP (GRID) --- */
  /* Petit ajustement intermédiaire pour tablette si besoin */
  /* @media (min-width: 768px) and (max-width: 991px) {

     display: grid;
     grid-template-columns: 1fr 1fr;

     .mosaic-baseline {
       grid-column: 1 / -1;
       position: relative;
       bottom: auto;
       width: auto;
     }
   }*/
}
article.article .mosaicBlock ul li {
  margin-left: 0 !important;
}
article.article .mosaicBlock figure {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
article.article .mosaicBlock figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover; /* Important pour remplir la case sans déformer */
  display: block;
  margin: 0 !important;
  border-radius: 8px;
}
article.article .mosaicBlock .mosaic-text h2 {
  text-transform: uppercase;
  font-size: 2rem;
  position: relative;
  margin-top: 0;
}
article.article .mosaicBlock .mosaic-text h2::after {
  content: "";
  display: block;
  width: 50px;
  height: 4px;
  background-color: #fccf4d; /* Jaune de l'image */
  margin-top: 10px;
}
article.article .mosaicBlock .mosaic-baseline {
  background-color: #A27E49;
  padding: 6rem;
  font-size: 2.5rem;
  font-weight: 800;
  line-height: 1.3;
  font-family: "Merriweather", Georgia, serif;
}
@media screen and (min-width: 1000px) {
  article.article .mosaicBlock {
    display: grid;
    /* Définition de 2 colonnes égales */
    grid-template-columns: 1fr 1fr;
    /* Définition des lignes :
       - Ligne 1 : Texte (gauche) et Image 1 (droite)
       - Ligne 2 : Image 2 (gauche) et Image 3 (droite)
    */
    grid-template-rows: auto auto;
    gap: 30px;
    /* Inversion pour la position Droite */
    /* Placement explicite */
    /* Le bloc Baseline (Jaune)
       Astuce : On le positionne en absolu par rapport au conteneur principal
       pour qu'il "flotte" en bas à droite comme sur la maquette.
    */
  }
  article.article .mosaicBlock.mosaicBlock--right {
    /*On inverse aussi la baseline jaune pour l'esthétique */
  }
  article.article .mosaicBlock.mosaicBlock--right .mosaic-text {
    grid-column: 2/3; /* Passe à droite */
  }
  article.article .mosaicBlock.mosaicBlock--right .mosaic-fig-1 {
    grid-column: 1/2; /* Passe à gauche */
  }
  article.article .mosaicBlock.mosaicBlock--right .mosaic-baseline {
    right: auto;
    left: -50px;
    box-shadow: 10px 10px 30px rgba(0, 0, 0, 0.1); /* Ombre inversée */
  }
  article.article .mosaicBlock .mosaic-text {
    grid-column: 1/2;
    grid-row: 1/2;
  }
  article.article .mosaicBlock .mosaic-fig-1 {
    grid-column: 2/3;
    grid-row: 1/2;
    min-height: 300px; /* Hauteur min pour l'esthétique */
  }
  article.article .mosaicBlock .mosaic-fig-2 {
    grid-column: 1/2;
    grid-row: 2/3;
    height: 300px; /* Ajustez selon vos besoins */
  }
  article.article .mosaicBlock .mosaic-fig-3 {
    grid-column: 2/3;
    grid-row: 2/3;
    /* L'image de droite en bas semble plus grande, on peut ajuster sa hauteur */
    height: 400px;
  }
  article.article .mosaicBlock .mosaic-baseline {
    position: absolute;
    bottom: -40px;
    right: -50px;
    width: 80%;
    z-index: 10;
    box-shadow: -10px 10px 20px rgba(0, 0, 0, 0.1); /* Légère ombre pour le relief */
  }
}
article.article .testimonial > div {
  border-top: 3px solid #A27E49;
  background: #E1E4E7;
  padding: 4rem 8rem;
}
article.article .testimonial > div h3 {
  font-weight: 200;
  font-size: 2.5rem;
  text-transform: uppercase;
  color: #272425;
}
article.article .testimonial > div .testimonial--text img {
  max-width: 100px;
  margin: 0;
}
article.article .testimonial > div .testimonial--text .signature {
  font-weight: 800;
}
article.article .banner {
  position: relative;
  margin: 6rem 0;
}
article.article .banner .banner--row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  background: #A27E49;
}
@media screen and (min-width: 800px) {
  article.article .banner .banner--row {
    position: absolute;
    gap: 4rem;
    top: 0;
    left: 0;
    width: 100vw;
  }
}
article.article .banner .banner--image {
  flex: 1;
  border-radius: 0;
  -o-object-fit: cover;
     object-fit: cover;
  filter: grayscale(100%);
  mix-blend-mode: multiply;
  background-color: #A27E49;
  margin: 0 !important;
}
article.article .banner .banner--text {
  flex: 2;
  padding: 2.5rem;
}
article.article .banner .banner--text h2 {
  text-transform: uppercase;
  font-weight: 200;
  font-size: 3rem;
  margin-bottom: 3rem;
}
article.article .banner .banner--text h2 span {
  font-weight: 800;
}
@media screen and (min-width: 800px) {
  article.article .banner .banner--text h2 {
    max-width: 60%;
  }
}
@media screen and (min-width: 1200px) {
  article.article .banner .banner--text .banner--content {
    max-width: 70%;
  }
}
article.article .hero {
  position: relative;
  margin: 6rem 0;
}
article.article .hero > div {
  background: #272425;
  color: #fff;
  padding: 0 0 6rem;
}
@media screen and (min-width: 800px) {
  article.article .hero > div {
    position: absolute;
    width: 100vw;
  }
  article.article .hero > div .container {
    max-width: 1200px;
    padding: 0 0 0 10rem;
  }
}
article.article .hero > div .hero--flexbox {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
@media screen and (min-width: 800px) {
  article.article .hero > div .hero--flexbox {
    gap: 4rem;
    top: 0;
    left: 0;
  }
}
article.article .hero .hero--image {
  flex: 1;
  border-radius: 0;
  margin: 0 !important;
}
article.article .hero .hero--text {
  flex: 1;
  padding: 2.5rem;
}
article.article .hero .hero--text h2 {
  text-transform: uppercase;
  font-weight: 200;
  font-size: 3rem;
  padding-left: 0;
  margin-bottom: 6rem;
  position: relative;
}
article.article .hero .hero--text h2 span {
  font-weight: 800;
}
article.article .hero .hero--text h2:before {
  position: absolute;
  content: "";
  background: #A27E49;
  width: 80px;
  height: 3px;
  right: 0;
  bottom: -3rem;
}
article.article .hero .hero--content {
  text-align: justify;
  text-align: right;
}
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  grid-auto-rows: 6px;
  grid-auto-flow: dense;
  gap: 6px;
}
.gallery-grid img {
  width: 100%;
  display: block;
  border-radius: 8px;
  -o-object-fit: cover;
     object-fit: cover;
  cursor: pointer;
  margin: 0 !important;
}

@media (max-width: 600px) {
  .gallery-grid {
    grid-template-columns: 1fr 1fr;
  }
}
/* Lightbox identique + fade */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.85);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  z-index: 1000;
}
.lightbox img {
  max-width: 85vw;
  max-height: 85vh;
  border-radius: 6px;
  opacity: 0;
  transition: opacity 0.35s;
}
.lightbox .nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.15);
  border: none;
  color: #fff;
  font-size: 2.5rem;
  padding: 0.6rem 1rem;
  border-radius: 6px;
  cursor: pointer;
}
.lightbox .prev {
  left: 2%;
}
.lightbox .next {
  right: 2%;
}
.lightbox .close {
  position: absolute;
  top: 2%;
  right: 2%;
  background: rgba(255, 255, 255, 0.15);
  border: none;
  color: #fff;
  font-size: 2rem;
  padding: 0.4rem 0.8rem;
  border-radius: 6px;
  cursor: pointer;
}

.hidden {
  display: none;
}

.visible {
  opacity: 1 !important;
}
