@font-face {
    font-family: 'Phoreus Cherokee';
    src: url('../fonts/PhoreusCherokee-Regular.otf') format('opentype');
    font-weight: 400; /* Normal */
}

@font-face {
    font-family: 'Phoreus Cherokee';
    src: url('../fonts/PhoreusCherokee-Light.otf') format('opentype');
    font-weight: 300; /* Light */
}

@font-face {
    font-family: 'Phoreus Cherokee';
    src: url('../fonts/PhoreusCherokee-Semibold.otf') format('opentype');
    font-weight: 600; /* Semibold */
}

@font-face {
    font-family: 'Phoreus Cherokee';
    src: url('../fonts/PhoreusCherokee-Bold.otf') format('opentype');
    font-weight: 700; /* Bold */
}

:root{
    --theme-color: #FFBF00;
    --title-color: #0A0C00;
    --body-color: #0A0C00;
    --link-secondary-color : #666666;
    --title-font: "Phoreus Cherokee", sans-serif;
    --body-font: "Open Sans", sans-serif;
    --icon-font: "Font Awesome 5 Free";
    --white-color: #ffffff;
    --main-container: 1296px;
    --container-gutters: 24px;
    --blue-dark-color: #005A8D;
    --blue-light-color: #1DCDFE;
    --green-light-color: #21D0B3;
    --beige-color: #f0eee9;
}

html, body {
    scroll-behavior: smooth !important;
}
*, :after, :before {
    box-sizing: border-box;
}

#toolbar-administration.toolbar li{
    font-size: small !important;
}

.lien{
    color: var(--link-secondary-color);
}
.lien::after{
    font-family: var(--icon-font);    
    font-weight: 900;
    content: "\f105";
    padding-left: 0.5rem;    
    color: #666;
}
.lien:hover {
    color: #333;
}
@keyframes stickyAni {
    0% {
        transform: translate3d(0, -40px, 0) scaleY(0.8);
        opacity: 0.7;
    }
    100% {
        transform: translate3d(0, 0, 0) scaleY(1);
        opacity: 1;
    }
}
/*
article.lateral section.active h2 a:hover:after {        
    color: #666;
}
article.lateral section.active h2 a:after {
    font-family: var(--icon-font);    
    font-weight: 900;
    content: "\f00d";
    padding-left: 0.5rem;    
    color: #aaa;
}
*/
/*test*/
span.techno {
    font-family: var(--title-font);
    font-size: 1.25rem;
    color: var(--link-secondary-color);
    font-weight: 600;
    line-height: 1.5rem;
    display: block;
    text-align: center;
}
article.lateral section.active h2 a:after {
    font-family: var(--icon-font);
    font-weight: 600;
    content: "\f00d";
    padding-left: 1rem;
    color: #efefef;
    font-size: 1.25rem;
    background-color: #005a8d;
    border-radius: 2rem;
    height: 3rem;
    display: block;
    width: 3rem;
    line-height: 3rem;
    position: absolute;
    top: 15px;
    right: 0;
}
article.lateral section.active {
    cursor: default;
}
.lateral .contenu-accordeon {
    display: none;
}
article.lateral section.active .contenu-accordeon {
    display: block;
}
/* Style de base */
body {
    font-family: var(--body-font);
    margin: 0;
    padding: 0;
    background-color: #ffffff;
    /*background-color: #f4f4f9;*/
    font-size: 16px;
    font-weight: 400;
    color: #0a0c00;
    line-height: 26px;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}
a {
    text-decoration: none;
    color: var(--link-secondary-color);
    outline: 0;
    transition: all ease 0.4s;
}
img:not([draggable]), embed, object, video {
    max-width: 100%;
    height: auto;
}
img {
    border: none;
    max-width: 100%;
}
.fond-bleu-fonce{
    background-color: var(--blue-dark-color);
}
.fond-bleu-clair{
    background-color: var(--blue-light-color);
}
.fond-vert-clair{
    background-color: var(--green-light-color);
}
.fond-beige{
    background-color: var(--beige-color);
}
.fond-gradient-bleu-fonce {
    background: linear-gradient(90deg, var(--blue-dark-color) 0%, var(--blue-light-color) 100%);
}
.fond-gradient-bleu-clair {
    background: linear-gradient(90deg, var(--blue-light-color) 0%, var(--green-light-color) 100%);
}
.fond-gradient-vert-clair {
    background: linear-gradient(90deg, var(--green-light-color) 0%, var(--blue-dark-color) 100%);
}
.container {
    width: 100%;
    max-width: 1440px;
    /*padding-right: 0.75rem;
    padding-left: 0.75rem;*/
    margin-right: auto;
    margin-left: auto;
    /*overflow: hidden;*/
}
.to-top {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  border: none;
  background: #ffbf00;
  cursor: pointer;
  display: none; /* caché par défaut */
  align-items: center;
  justify-content: center;
  z-index: 999;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.to-top:before {
    background-image: url(../images/icone_fleche_haut_blanc.svg);
    background-size: 160%;
    display: block;
    width: 18px;
    content: "";
    background-repeat: no-repeat;
    height: 18px;
    background-position: center;
    margin: 0 auto;
}
.to-top:hover {
  transform: scale(1.12);
}
.nav-header {
    /*position: absolute;*/
    top: 0;
    left: 0;
    right: 0;
    z-index: 41;
}
.sticky-wrapper {
    transition: 0.4s ease-in-out;
    /*padding: 0px 36px;*/
}
.sticky-wrapper.header-sticky {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    background-color: var(--white-color);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
    animation: stickyAni 0.6s ease-in-out;
    z-index: 3;
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin-top: 0;
    margin-right: 0.75rem;
    margin-left: 0.75rem;
}
.row>* {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
    margin-top: 0;
}
.col-auto {
    width: auto;
    flex: 0 0 auto;
}
.header-logo {
padding-top: 15px;
padding-bottom: 15px;
}
.header-logo a img, .mobile-logo a img {    
    width: 160px;
}
.header-button {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-left: 3rem;
}
.header-button .btn {
    padding: 0.5rem 1.25rem;
}
button {
    transition: all ease 0.4s;
}
.btn {
position: relative;
z-index: 2;
vertical-align: middle;
display: inline-block;
border: none;
text-align: center;
background-color: var(--theme-color);
color: var(--white-color);
font-family: var(--body-font);
font-size: 1rem;
font-weight: 400;
padding: 0.75rem 1.25rem;
border-radius: 0;
overflow: hidden;

border-radius: 0.25rem;
}
.btn:focus, .btn:hover, .btn.active {
color: var(--white-color);
outline: none;
box-shadow: none;
}


.link-effect {
position: relative;
overflow: hidden;
display: block;
height: 1.5rem;
line-height: 1.5rem;
}
.link-effect .effect-1 {
display: block;
height: 100%;
position: relative;
top: 0%;
transition: 0.3s;
}
.btn:hover .effect-1 {
top: -100%;
}
.link-effect:hover .effect-1 {
top: -100%;
}


.main-menu ul {
margin: 0;
padding: 0;
}
.main-menu > ul {
display: flex;
align-items: center;
margin: 0 -20px !important;
}
.main-menu ul li:first-child {
margin-left: 0 !important;
}
.main-menu ul li {
list-style-type: none;
display: inline-block;
position: relative;
}
.main-menu > ul > li {
margin: 0;
}
.main-menu > ul > li > a {
padding: 2rem 1.25rem;
}
.main-menu a {
display: block;
position: relative;
font-weight: 600;
font-family: var(--title-font);
font-size: 1.25rem;
color: var(--link-secondary-color);
text-transform: uppercase;
}
.bloc-contenu {
    color: var(--link-secondary-color);
}
.bloc-contenu .titre {
font-family: var(--title-font);
font-size: 20px;
color: var(--link-secondary-color);
font-weight: 600;
line-height: 24px;
padding-bottom: 0.5rem;
text-transform: uppercase;
}
.bloc-contenu .contenu {
    font-family: var(--body-font);
    font-size: 1rem;
    color: var(--link-secondary-color);
    font-weight: 400;
    line-height: 1.5rem;
}
#hero .container {
    padding: 2rem 0 4rem 0;
}
.hero-wrapper {
position: relative;
z-index: 2;
overflow: hidden;
}
.hero-title {
font-family: var(--title-font);
font-size: 3.5rem;
color: var(--link-secondary-color);
text-transform: uppercase;
font-weight: 600;
line-height: 3.5rem;
}
.hero-text{
font-size: 1rem;
font-weight: 400;
color: var(--link-secondary-color);
}
.hero-container{
display: flex;
flex-direction: row;
align-items: center;
gap: 3%;
}
.hero-style {
width: 60%;
}
.hero-image {
width: 40%;
}
.hero-style p {
    font-size : 1.2rem;
}
/*main {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 2rem;
    justify-content: center;
    min-height: 100rem;
}*/
footer {
    padding: 4rem 1rem 1rem 1rem;
    background-color: #f0eee9;    
    position: relative;
}
.footer-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.footer-informations {
    width: 50%;
}
footer .liste-liens {
    display: flex;
    width: 50%;
    gap: 25%;
    font-family: var(--title-font);
    font-size: 1.25rem;
    color: var(--link-secondary-color);
    font-weight: 600;
    line-height: 1.5rem;
    margin-bottom: 0rem;
    justify-content: flex-end;
}
footer .liste-liens > * {
    display: flex;
    flex-direction: column;
}
footer .liste-liens > * > a {
    min-height: 2rem;
}
footer a img {
    width: 160px;
}

.footer-bottom {
    display: flex;
    border-top: 1px solid var(--link-secondary-color);
    padding-top: 3rem;
    margin-top: 3rem;
       margin-bottom: 2rem;
}
.footer-bottom * {
    font-family: var(--body-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: var(--link-secondary-color);
}
.footer-bottom .liste-liens {
    width: 100%;
    gap: 3rem;
    text-decoration: underline;
}


.d-inline-block {
    display: inline-block;
}
.d-block {
    display: block;
}
.d-none {
    display: none !important;
}
.align-items-center {
    -webkit-box-align: center !important;
    -webkit-align-items: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}
.justify-content-between {
    -webkit-box-pack: justify !important;
    -webkit-justify-content: space-between !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}
.bloc-bulle {
    width: 25%;
}
.bulles .bulle-titre {
    width: 65%;
}
.bulles .bulles-contenu {
    display: flex;
    gap: 3rem;
    padding: 3rem 0;
}
.hero-image {
    width: 50%;
}
.hero-image img {
    opacity: 0;
    transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}
.hero-image img.apparait {
    opacity: 1;
}
.hero-image .bulles-haut img {
    transform: translateY(-30px);
}
.hero-image .bulles-bas img {
    transform: translateY(30px) scaleY(-1);
}
.hero-image .bulles-bas img.bulle-6 {
    transform: translateY(30px) scaleY(-1) scaleX(1);
}
.hero-image .bulles-bas img.apparait,
.hero-image .bulles-haut img.apparait {
    transform: translateY(0);
}

.hero-image .bulles-haut img.bulle-4.apparait {
    transform: scaleX(-1);
}
.hero-image .bulles-bas img.bulle-6.apparait {
    transform: translateY(0) scaleY(-1) scaleX(-1);
}
.hero-image .bulles-bas img.bulle-5.apparait,
.hero-image .bulles-bas img.bulle-7.apparait,
.hero-image .bulles-bas img.bulle-8.apparait {
    transform: scaleY(-1);
}

.bulles-haut, .bulles-bas {
    height: 21rem;
    display: block;
    position: relative;
}
.bulles-bas img{
    transform: scale(-1);
}
img.bulle-1 {
    width: 24rem;
    position: absolute;
    bottom: 0;
    left: 19rem;
}
img.bulle-2 {
    width: 11rem;
    position: absolute;
    bottom: 0;
    left: 14rem;
}
img.bulle-3 {
    width: 16rem;
    position: absolute;
    left: 33rem;
    bottom: 0;
}
img.bulle-4 {
    position: absolute;
    transform: scaleX(-1);
    left: 0;
    bottom: 0;
    width: 13rem;
}
img.bulle-5 {
    position: absolute;
    left: 25rem;
    transform: scaleY(-1);
    width: 14rem;
    z-index: 2;
    top: -2px;
}
img.bulle-6 {
    width: 7rem;
    position: absolute;
    left: 8rem;
    top: -1px;
}
img.bulle-7 {
    position: absolute;
    left: 31rem;
    transform: scaleY(-1);
    width: 18rem;
    z-index: 1;
    top: -1px;
}
img.bulle-8 {
    position: absolute;
    left: 17rem;
    transform: scaleY(-1);
    width: 22rem;
    top: -1px;
}

.service-titre {
    width: 40%;
}
.secteurs-titre {
    width: 40%;
    margin-right: 3rem;
    min-height: 30rem;
    opacity: 1;
    transition: all 0.3s ease;
    /*transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);*/

}
.secteurs-titre.hide {
    width: 0;
    margin: 0;
    transition: width 0.3s ease;
    opacity: 0 !important;
    height: 0;
}
/*
.secteurs-titre p, .secteurs-titre h2
{
    min-width: 24rem;
    min-width: 24rem;
}*/
.contenu-split > * {
    width: calc(50% - 1.5rem);
}
.contenu-split {
    display: flex;
    column-gap: 2rem;
    flex-wrap: wrap;
    row-gap: 0.5rem;
    padding-bottom: 1rem;
}
.section  li>a {
    text-decoration: underline;
}
.section.services {
    gap: 2rem;
}
.services-liste {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    grid-column-gap: 2rem;
}
.service {
    display: flex;
    width: calc(50% - 1rem);
    grid-column-gap: 2rem;
    /*grid-template-columns: 5rem 19rem;*/
    min-height: 9rem;
    margin-bottom: 1.5rem;
}
.service > img {
    height: fit-content;
}
img.service-icon {
    height: fit-content;
}
.service h3 {
    margin: 0;
    line-height: 1.25rem;
}
.section {
    display: flex;
    padding: 6rem 1.5rem;

}
.section.column {
    flex-direction: column;
}
.section.center{
    justify-content: center;
}
.section.small{
    padding: 4rem 1.5rem;
}
.section.x-small{
    padding: 2rem 1.5rem;
}
.section.no-space{
    padding: 0 1.5rem;
}
.section.large{
    padding: 6rem 1.5rem;
}
.node-7 .section.large{
    padding: 6rem 1.5rem;
}
.cta {
    text-align: center;
}
.cta h2{
    margin-bottom: 1rem;
    margin-top: 1rem;
}
.cta .sous-barre{
    display: inline-block;
}

h2 {
    font-family: var(--title-font);
    font-size: 2.5rem;
    color: var(--link-secondary-color);
    font-weight: 600;
    line-height: 2.5rem;
}
h3 {
    font-family: var(--title-font);
    font-size: 1.15rem;
    color: var(--link-secondary-color);
    font-weight: 600;
    line-height: 1.5rem;
    text-transform: uppercase;
}
h4 {
    font-family: var(--title-font);
    font-size: 1.25rem;
    color: var(--link-secondary-color);
    font-weight: 600;
    line-height: 1.5rem;
    margin-bottom: 0rem;
}
p,li {
    font-family: var(--body-font);
    font-size: 1rem;
    color: var(--link-secondary-color);
    font-weight: 400;
    line-height: 1.5rem;
}
.fond-bulle-1 {
    background-image: url(../images/bulles3.png);
    background-color: #FFF;
    background-position: -35% bottom;
    background-repeat: no-repeat;
    background-size: 60%;
}

.fond-bulles-blanc {
    background-image: url(../images/bulles-blanc.svg);
    background-color: #F0EEE9;
    background-position: 125% 107%;
    background-repeat: no-repeat;
    background-size: 60%;
}
.fond-bulles-gris {
    background-image: url(../images/bulles-gris.png);
    background-color: #fff;
    background-position: -35% bottom;
    background-repeat: no-repeat;
    background-size: 55%;
}
.fond-bulles-gris-inverse {
    background-image: url(../images/bulles-gris.svg);
    background-color: #fff;
    background-position: 125% 101%;
    background-repeat: no-repeat;
    background-size: 60%;
}
.fond-bulles-bleu {
    position: relative;
    background-color: #005A8D;
}
.fond-bulles-vert {
    position: relative;
    background-color: #21D0B3;
}
.fond-bulles-beige {
    position: relative;
    background-color: var(--beige-color);
}
.fond-bulles-beige::before {
    opacity: 1 !important;
    background-position: 100% bottom !important;
    background-size: 40% !important;
}
.fond-bulles-beige::before,
.fond-bulles-vert::before,
.fond-bulles-bleu::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/bulles-transparentes.png);
    background-position: 110% bottom;
    background-repeat: no-repeat;
    background-size: 50%;
    opacity: 0.2;
    z-index: 1;
}
li.is-active-trail > a {
    color: #ffbf00;
}
a.btn.grey.is-active-trail {
    color: #ffbf00;
    border-color: #ffbf00;
}
.fond-bulles-bleu *, 
.fond-bulles-vert *, 
.fond-image-bureau * {
    color: #FFF;
}
.fond-bulles-vert .sous-barre,
.fond-bulles-bleu .sous-barre{
    background-color: #fff;
}
.fond-bulles-vert .btn,
.fond-bulles-bleu .btn {
    background-color: transparent;
    border: 1px solid;
}
.fond-image-bureau {
    background-image: url(../images/photo-bureau.jpg);
    background-size: cover;
    background-position: center;
}
.fond-image {
    background-size: cover;
    background-position: center;
}
.fond-image-bureau .btn {
    background-color: transparent;
    border: 1px solid #FFF;
}

.no-padding-bottom {
    padding-bottom:2.5rem;
}
.sous-barre {
    background-color: #ffbf00;
    height: 0.625rem;
    width: 2.375rem;
    border-radius: 0.25rem;
}

.image-texte.gauche .bloc {
    padding: 0 0rem 0 4rem;
}
.image-texte.droite .bloc {
    padding: 0 4rem 0 0;
}

.accordeon{
    padding-left: 1rem;
    border-left: 2px solid transparent;
}
.accordeon-titre {
    cursor: pointer;
    transition: background 0.3s ease;
    position: relative;
}
/*
.accordeon-titre:hover {
    background: #e2e2e2;
}
*/
.accordeon-contenu {
    display: none;
}
.accordeon.active .accordeon-contenu {
    display: block;
}

.accordeon:not(.active) .accordeon-titre::after {
    font-family: var(--icon-font);
    font-weight: 900;
    content: "\f054";
    color: #ffbf00;
    position: absolute;
    left: -25px;
}
/*
.accordeon.active .accordeon-titre::after {
    font-family: var(--icon-font);
    font-weight: 900;
    content: "\f077";
    color: #666;
    position: absolute;
    right: 0;
}
*/
.accordeon.active {
    border-color: #FFBF00;
}
.cas-client .field_secteur_activite {
    display: flex;
    justify-content: center;
}
.cas-client .paragraph .section.fond-image .container {
    position: relative;
}
.cas-client .paragraph .section.fond-image {
    justify-content: center;
    padding: 4rem 0;
    /*height: 680px;*/
    height: 580px;
    position: relative;
    margin: 0 0 2rem 0;
}
.cas-client #gallerie {
    margin: 6rem 0;
}
.cas-client .mise-en-scene {
    position: absolute;
    left: 0;
}
.cas-client .section {
    padding: 2rem 1.5rem 4rem 1.5rem;
}
.cas-client .habillage {
    background-image: url(../images/bulles-blanc.png);
    height: 288px;
    width: 428px;
    background-repeat: no-repeat;
    position: absolute;
    right: 0;
    bottom: -21px;
}
.cas-client .section .bloc .bloc-contenu,
.cas-client .section .bloc .bloc-titre {
    width: 100%;
}
.technologies {
    display: flex;
    justify-content: space-evenly;
    width: 100%;
    flex-wrap: wrap;
}
.technologies div{
    padding : 10px;
}
.cas-client .mise-en-scene img {
    width: 70%;
}
.cas-client-intro {
    width: 100%;
}
.cas-client-titre {
    display: flex;
    justify-content: center;
    text-align: center;
}
.cas-client-titre h2 {
text-transform: uppercase;
}
.cas-client  .field_secteur_activite .secteur-activite {
    background-color: var(--theme-color);
    color: var(--white-color);
    font-family: var(--title-font);
    font-size: 1rem;
    font-weight: 400;
    padding: 0.25rem 0.75rem;
    margin: 0 0.5rem;
}
.cas-client .paragraph .bloc {
    display: flex;
    gap: 4rem;
    padding: 0;
    align-items: flex-start;
}
.cas-client .paragraph .bloc h2, .cas-client .paragraph .bloc p:first-child {
    margin-top: 0;
}
.cas-clients,
.chiffres {
    display: block;
    width: 100%;
}

.cas-clients-titre,
.chiffres-titre {
    display: flex;
    justify-content: space-between;
    margin-bottom: 2rem;
}
.chiffres-contenu {
    display: flex;
    justify-content: space-between; /* Espacement égal entre les div */
    align-items: stretch; /* Assure que les hauteurs sont cohérentes */
    gap: 2rem;
}
.bloc-chiffre {
    flex: 1; /* Chaque div prend un tiers de l'espace disponible */
    padding: 2rem;
    border-radius: 0.5rem;
  }

  .bloc-chiffre .chiffre {
      font-family: var(--title-font);
      font-size: 96px;
      line-height: normal;
      color: var(--white-color);
  }

  .bloc-chiffre .texte {
      font-family: var(--title-font);
      font-size: 18px;
      line-height: normal;
      text-transform: uppercase;
      color: var(--white-color);
  }

  a.btn.grey {
    background-color: transparent;
    color: #666;
    border: 1px solid #666;
}
  a.btn.blanc {
    background-color: transparent;
    color: #fff;
    border: 1px solid #fff;
}
    .etiquette {
        background-color: #FFBF00;
        font-family: var(--title-font);
        font-size: 1rem;
        line-height: 2rem;
        display: inline-block;
        padding: 0.25rem 0.75rem;
        color: #FFF;
    }
    .cas-clients-contenu{
        display: block;
        position:relative;
        margin: 2rem 0;
    }
    .cas-clients-contenu #grid-container-cas-clients .bloc-contenu > *,
    .cas-clients-contenu .bloc-contenu {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        width: 390px;
    }
    .cas-clients-contenu img.image {
        width: 390px;
        height: 500px;
        object-fit: cover;
        border-radius: 0.5rem;
    }
    .cas-clients-filter {
        margin: 2rem 0;
        position: relative;
        z-index: 2;
    }
    .expertise-filter {
        margin: 2rem 0;
        position: relative;
        z-index: 2;
    }
    .derniers-cas-client-titre,
    .autre-cas-client .bloc-titre {
        display: block;
        position: relative;
        font-weight: 600;
        font-family: var(--title-font);
        font-size: 1.25rem;
        color: var(--link-secondary-color);
        text-transform: uppercase;
    }
    .section.autre-cas-client {
        position: relative;
        justify-content: center;
        padding: 0;
    }
    .section.autre-cas-client {
        width: 80%;
        margin: 0 auto;
    }

    .autre-cas-client-action{
        width: 90% !important;
    }

    .cas-client .paragraph .section.autre-cas-client.fond-image {
        margin: 0 0 6rem 0;
    }
    .cas-client .paragraph .section.autre-cas-client .mise-en-scene {
        top: 3rem;
    }
    .section.autre-cas-client .btn {
        margin: 0rem 1rem 3rem 0;
    }
    .section.autre-cas-client .bloc {
            padding: 6rem 0 3rem 0;
    }
    .autre-cas-client-titre {
        display: flex;
        justify-content: center;
        margin-top: 1rem;
        margin-bottom: 2rem;
        text-transform: uppercase;
    }
    .autre-cas-client-titre .sous-barre {
        margin: 0 auto;
    }

     .autre-cas-client-titre h2{
        font-size: 2.25rem;
     }

    .autre-cas-client .fond-image {
        position: relative;
        width: 100%;
        max-height: 580px;
        overflow: hidden;
    }
    .autre-cas-client .fond-image img {
        width: 100%;
        height: auto;
        object-fit: cover;
        max-height: 580px;
        display: block;
    }
article.lateral {
    display: block;
    margin: 0 auto;
    overflow: auto;
    border-radius: 0.5rem;
    position: absolute;
    z-index: 1;
}


article.lateral section
{
    position: relative;
    display: block;
    float: left;
    width: 4.5rem;
    height: 30rem;
    margin: 0.15rem;
    color: #666;
    background-color: #F0EEE9;
    overflow: hidden;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
}
article.vertical section {
    width: 30rem;
    height: 4.5rem;
    margin: 0.15rem;
    color: #666;
    background-color: #F0EEE9;
    overflow: hidden;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
}
article.lateral section:hover,
article.vertical section.hover-effect,
article.lateral section:hover,
article.vertical section.hover-effect {
    background: linear-gradient(0deg, #1DCDFE 5.07%, #34F5C6 85.56%);
    transition: all 0.3s ease;

}
article.lateral section h2
{
    position: absolute;
    z-index: 1;
    width: 30rem;
    height: 4.5rem;
    top: 30rem;
    left: 0;
    text-indent: 1rem;
    padding: 0;
    margin: 0;
    color: #ddd;
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
}
article.lateral section.active h2 a {
    width: calc(100% - 4rem);
}
article.lateral section.active h2 a:hover:after {
    background-color: #FFF;
    color: #005a8d;
}

article.lateral .logos {
    display: flex;
    column-gap: 4rem;
    flex-wrap: wrap;
    justify-content: flex-start;
    row-gap: 1rem;
}
.logos img {
    max-height: 60px;
    width: auto;
}

article.vertical section h2 a,
article.lateral section h2 a
{
    display: block;
    width: 100%;
    line-height: 4.5rem;
    text-decoration: none;
    color: #666;
    outline: 0 none;
    text-transform: uppercase;
    font-size: 1.25rem;
    position: absolute;
}
article.lateral section p {
    display: none;
    min-width: 24rem;
}
article.vertical section.active h2 a,
article.lateral section.active h2 a {
    color:#005a8d;
    left: 4rem;
}
article.lateral section:target p, article.lateral section.active p {
    display: block;
}
article.lateral section:target, article.lateral section.active
{
    width: 40rem;
    padding: 0 1rem;
    color: #333;
    /*background-color: #f0eee9;*/
    background: linear-gradient(0deg, #1DCDFE 5.07%, #34F5C6 85.56%);
    transition: all 0.3s ease;
    position: relative;
    z-index: 2;
}
article.lateral section:target h2, article.lateral section.active h2
{
	position: static;
	font-size: 1.3em;
	text-indent: 0;
	color: #333;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
    width: 100%;
}
article.vertical section,
article.lateral section/*,
article.lateral section h2*/
{
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

article.lateral section img.icon {
    position: absolute;
    top: 18px;
    /*left: 1.2rem;*/
    left: 16px;
    width: 42px;
}

.image-texte.gauche {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
}
.image-texte img {
    border-radius: 0.5rem;
}
.image-texte > * {
    width: 50%;
  }
.image-texte.droite {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
}

.expertise-liste {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    width:1290px;
}
.expertise.double {
    /*width: calc(50% - 4rem);*/
    /*width: 620px;*/
    width: 635px;
    height:485px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
}

.expertise {
    display: flex;
    background-color: #FFF;
    flex-wrap: wrap;
    /*width: 25%;*/
    width: 310px;
    height:485px;
    justify-content: center;
    box-sizing: border-box;
    align-items: flex-start;
    min-width: 310px;
    min-height: 440px;
    align-content: flex-start;
}
.expertise-contenu h3 {
    text-align: center;
}
.expertise.double .expertise-image, 
.expertise.double .expertise-contenu {
    width: 50%;
    object-fit: cover;
}
.expertise.double .expertise-contenu {
    /*background: linear-gradient(0deg, #1DCDFE 5.07%, #34F5C6 85.56%);*/
    /*background-color: #666666*/
}
.expertise.double .expertise-contenu * {
        /*color: #fff !important;*/
}
.expertise-contenu {
    padding: 0rem 1rem 1rem 1rem;
}
.expertise-contenu p {
    line-height: 1.25rem;
            font-size: 0.9rem;
}
.expertise-icon {
    padding: 1rem 1rem 0rem 1rem;
}
article.lateral section.init {
    margin-right: 2.5rem;    
}

.menu-toggle {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
}

/* Burger Squeeze */ 
.mobile-menu-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 999999;
    width: 0;
    width: 100%;
    height: 100%;
    transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
    opacity: 0;
    visibility: hidden;
  }
  .mobile-menu-wrapper .mobile-logo {
    padding: 35px 0px 35px;
    display: block;
    text-align: start;
    background-color: var(--white-color);
  }
  .mobile-menu-wrapper .mobile-logo svg {
    max-width: 185px;
  }
  .mobile-menu-wrapper .menu-toggle {
    font-size: 2rem;
    position: absolute;
    right: 20px;
    top: 23px;
    padding: 0;
    line-height: 1;
    width: 50px;
    height: 50px;
    line-height: 48px;
    z-index: 1;
    color: var(--theme-color);
    background-color: transparent;    
  }
  .mobile-menu-wrapper .menu-toggle:hover {
    transform: rotate(90deg);
  }
  .mobile-menu-wrapper .mobile-menu-area {
    width: 100%;
    max-width: 310px;
    background-color: var(--white-color);
    height: 100%;
    position: relative;
    left: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-100%);
    transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
    z-index: 1;
    padding: 0 20px;
  }
  .mobile-menu-wrapper.body-visible {
    opacity: 1;
    visibility: visible;
    transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
  }
  .mobile-menu-wrapper.body-visible .mobile-menu-area {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
    transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
  }
  .mobile-menu-wrapper .sidebar-wrap {
    margin-bottom: 23px;
  }
  .mobile-menu-wrapper .sidebar-wrap h6 {
    font-size: 14px;
    font-weight: 600;
    color: var(--title-color);
    margin-bottom: 0;
    line-height: 24px;
  }
  .mobile-menu-wrapper .sidebar-wrap a {
    font-family: var(--body-font);
    font-size: 1rem;
    color: var(--link-secondary-color);
    font-weight: 400;
    line-height: 1.5rem;
  }
  .mobile-menu-wrapper .sidebar-wrap a:hover {
    color: var(--title-color);
  }
  
  .mobile-menu {
    overflow-y: scroll;
    max-height: calc(100vh - 200px);
    padding-bottom: 25px;
    margin-bottom: 40px;
    text-align: left;
    border-bottom: 2px solid var(--title-color);
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .mobile-menu::-webkit-scrollbar {
    display: none;
  }
  .mobile-menu ul {
    margin: 0;
    padding: 5px 0 20px 0;
  }
  .mobile-menu ul li {
    list-style-type: none;
  }
  .mobile-menu ul li a {
    display: block;
    position: relative;
    padding: 1.25rem 0;
    height: 3rem;
    line-height: 1.5rem;
    font-weight: 600;
    font-family: var(--title-font);
    font-size: 1.25rem;
    color: var(--link-secondary-color);
    text-transform: uppercase;
  }
  .mobile-menu ul li.active a {
    font-weight: 600;
  }
  .mobile-menu ul li.active-class > a {
    color: var(--title-color);
  }
  .mobile-menu ul li.active-class > a:before {
    background: var(--theme-color);
    border-color: var(--theme-color);
  }
  .mobile-menu ul li ul li {
    padding-left: 20px;
  }
  .mobile-menu ul li ul li a {
    font-weight: 400;
    font-family: var(--body-font);
    letter-spacing: normal;
    text-transform: capitalize;
    font-size: 16px;
    padding: 6px 0;
  }
  .mobile-menu ul li ul li a .mean-expand-class:before {
    font-size: 14px;
  }
  .mobile-menu ul li ul li:last-child {
    border-bottom: none;
  }
  .mobile-menu ul .submenu-item-has-children > a .mean-expand-class {
    position: absolute;
    right: 0;
    top: 50%;
    font-weight: 400;
    font-size: 20px;
    width: 100%;
    height: 25px;
    line-height: 25px;
    margin-top: -12.5px;
    display: inline-block;
    text-align: end;
    background-color: transparent;
    color: var(--title-color);
    border-radius: 50%;
  }
  .mobile-menu ul .submenu-item-has-children > a .mean-expand-class:before {
    content: "\f107";
    font-family: var(--icon-font);
    font-weight: 700;
  }
  .mobile-menu ul .submenu-item-has-children.active-class > a .mean-expand-class:before {
    content: "\f106";
  }
  .mobile-menu > ul > li:last-child {
    border-bottom: none;
  }
  
  @media (max-width: 400px) {
    .mobile-menu-wrapper .mobile-menu-area {
      width: 100%;
      max-width: 270px;
    }
  }
  
.social-btn.style3 {
    gap: 20px;
}
.social-btn {
    display: flex;
    gap: 10px;
}
.social-btn.style3 a {
    background: transparent;
    width: auto;
    height: auto;
    line-height: normal;
    border-radius: 0;
    color: var(--theme-color);
    border: 0;
    font-size: 3rem;
}
.social-btn.style3 a .link-effect {
    height: 3rem;
    line-height: 3rem;
}

.sidebar-btn {
    background: transparent;
    position: relative;
    height: 60px;
    width: 60px;
    border-radius: 50%;
    text-align: center;
    line-height: 54px;
    padding: 0;
  }
  .sidebar-btn .line {
    display: block;
    height: 3px;
    width: 30px;
    background: var(--theme-color);
    margin: auto;
    transition: 0.4s;
  }
  .sidebar-btn .line:not(:last-child) {
    margin-bottom: 5px;
  }
  .sidebar-btn:hover .line:nth-child(2) {
    width: 10px;
  }



.menu-mobile {
display: none;
}
.accordeon-secteurs {
    display: none;
}
.accordeon-secteurs .accordeon {
    padding: 0;
    border-left: 0;
    margin: 0.5rem 0rem;
    border-radius: 0.5rem;
    border: 1px solid #FFF;
}
.accordeon-secteurs .accordeon.active,
.accordeon-secteurs .accordeon:hover .accordeon-titre {
    background: linear-gradient(90deg, #1DCDFE 5.07%, #34F5C6 85.56%);
}
.accordeon-secteurs .accordeon.active .accordeon-titre{
    background-color: transparent;
}
.lateral .accordeon-secteurs .accordeon-contenu {
    padding: 1rem;
}

.accordeon-secteurs .accordeon-secteurs .accordeon-contenu {
    padding: 0rem 1rem 1rem 1rem; 
}

.accordeon-secteurs .accordeon-titre {
    color: #666;
    background-color: #F0EEE9;
    height: 4.5rem;
    border-radius: 0.5rem;
    position: relative;
    display: flex;
    padding-left: 1rem;
}
.accordeon-secteurs .accordeon-titre h3 {
    line-height: 2.15rem;
}

.accordeon-secteurs .active .accordeon-titre h3 {
    color:#005a8d;
}

.accordeon-secteurs .accordeon-titre img.icon {
    position: absolute;
    right: 1rem;
    top: 1rem;
    max-width : 36px;
}
.accordeon .accordeon-titre::after {
    content: '' !important;
}


.owl-carousel .owl-nav button.owl-prev:before {
    background-image: url(../images/icone_fleche_gauche.svg);
    background-size: 100%;
    display: block;
    width: 18px;
    content: "";
    background-repeat: no-repeat;
    height: 18px;
    background-position: center;
    margin: 0 auto;
}
.owl-carousel .owl-nav button.owl-next:before {
    background-image: url(../images/icone_fleche_droite.svg);
    background-size: 100%;
    display: block;
    width: 18px;
    content: "";
    background-repeat: no-repeat;
    height: 18px;
    background-position: center;
    margin: 0 auto;
}
.owl-carousel .owl-nav button.owl-prev:hover, .owl-carousel .owl-nav button.owl-next:hover {
    background-color: #ffbf00 !important;
}
.owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next {
    background-color: #FFF !important;
    border-radius: 3rem;
    width: 3rem;
    height: 3rem;
}
.owl-carousel .owl-nav button span {
    display: none;
}
.owl-theme .owl-nav {
    display: flex;
    justify-content: flex-end;
}
.owl-theme .owl-dots {
    display: flex;
    justify-content: flex-start;
}

.portraits,
.nous-connaitre,
.notre-expertise {
    width: 100%;
}
.portrait-titre,
.nous-connaitre-titre,
.expertise-titre {
    display: flex;
    justify-content: center;
    margin-bottom: 2rem;
    text-align: center;
}
.portraits h2,
.nous-connaitre h2,
.expertise-titre h2 {
    text-transform: uppercase;
}
.portraits .sous-barre,
.nous-connaitre .sous-barre,
.expertise-titre .sous-barre {
    margin: 0 auto;
}
.temoignages.partenaires{
    display: flex;
}
.temoignages.partenaires .temoignages-titre {
    min-width: 270px;
}
.temoignages.partenaires .temoignages-logos {
    width: calc(100% - 270px);
    padding: 1rem;
}
.temoignages{
    width: 100%;
}
.temoignages-titre {
    display: flex;
    justify-content: center;
    margin-bottom: 2rem;
    margin-right: 1rem;
    margin-left: 1rem;
}
.temoignages-titre .sous-barre{
    margin: 0 auto;
}
.temoignages-logos {
    padding: 4rem 0;
}
.temoignages-logos .logos {
    width: 180px;
    height: 100px;
    display: flex;
    align-items:center;
    justify-content: center;
}
.temoignages-phrases .owl-item,
.temoignages-logos .owl-item {
    display: flex;
    justify-content: center;
}
.temoignages-logos .image {
    /*max-width: 140px;*/
    max-height: 100px;
    width: fit-content !important;
}
.temoignages-phrases .image {
    max-width: 140px;
    max-height: 100px;
    width: fit-content !important;
}
.temoignages-phrases {
    padding: 4rem 0;
}
.temoignages-phrases .bloc-contenu {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    max-width: 540px;
    background-color: #F0EEE9;
    border-radius: 1.25rem;
    padding: 2rem;
    width: 100%;
    /*min-height: 400px;*/
}
.temoignages-phrases .profil {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-size: cover;
    background-position-x: center;
    background-position-y: top;
}
.temoignages-phrases .nom {
    text-align: center;
    line-height: 1.4rem;
}
.temoignages-phrases .bloc-contenu .titre {
    margin: 3rem 0 2rem 0;
    text-align: center;
}
.temoignages-logos.owl-carousel .owl-dots,
.temoignages-phrases.owl-carousel .owl-dots {
    justify-content: center;
}
.temoignages-logos.owl-carousel .owl-nav,
.temoignages-phrases.owl-carousel .owl-nav {
    width: 100%;
    display: block;
    margin-top: 3rem;
}
.temoignages-logos.owl-carousel button.owl-prev,
.temoignages-phrases.owl-carousel button.owl-prev {
    float: left;
    background-color: #f0eee9  !important;
}
.temoignages-logos.owl-carousel button.owl-next,
.temoignages-phrases.owl-carousel button.owl-next {
    float: right;
    background-color: #f0eee9  !important;
}


ul.anydesk{
    overflow-x:hidden;
    white-space:nowrap; 
     width: 80%;
        margin: 50px auto;
    padding:0px;
    }
    
    .anydesk {
    display: flex;
        padding: 0 20px;
        max-width: 80%;
        margin: auto;
        flex-wrap: wrap;
        justify-content:center;
    }
    .anydesk a{
       border: 3px solid #474747;
        border-radius: 25px;
        display: inline-block;
        width: 140px;
        height: 150px;
        text-align: center;
    color : var(--link-secondary-color);
    }

    .anydesk a img{
        margin : 0px 10px;
    }

    .anydesk div{
    padding: 10px;
    width: 160px;
    float: left;
    }
    
    .anydesk a:hover{
    color : #FFBF00 !important;
    border: 3px solid #FFBF00 !important;
    }
    
    .anydesk .windows:hover a img {
        content: url('/themes/custom/themis/images/windows-logo-jaune.svg');
    }
    
    .anydesk .mac:hover a img {
        content: url('/themes/custom/themis/images/mac-logo-jaune.svg');
    }
    
    .anydesk .android:hover a img {
        content: url('/themes/custom/themis/images/android-logo-jaune.svg');
    }

    .anydesk .ios:hover a img {
        content: url('/themes/custom/themis/images/ios-logo-jaune.svg');
    }

    #liensanssurveillance {
        cursor: pointer;
    }
    #liensanssurveillance:hover {
        color: var(--theme-color);
    }
/*
    .lien-cas-client {
    display: block;
    text-decoration: none;
    color: inherit;
    border: 1px solid transparent;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    border-radius: 8px;
    overflow: hidden;
}
    .lien-cas-client:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    border-color: #ddd;
    cursor: pointer;
}
    */
.lien-cas-client {
    overflow: hidden;
}
.lien-cas-client .image {
    display: block;
    transition: transform 0.3s ease;
    overflow: hidden;
    margin-bottom: 1.5rem;
}
.lien-cas-client .etiquette {
    margin-bottom: 1.5rem;
    margin-right: 1rem;
}
.lien-cas-client:hover .image {
    transform: scale(1.03);
}


a.lien-cas-client {
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    gap: 1rem;
    padding: 0.5rem;
    border-radius: 0.5rem;    
    height: 100%;
}
a.lien-cas-client,
a.lien-cas-client *,
a.lien-cas-client .lien::after {
    -webkit-transition: color .3s ease-in-out, background-color .3s ease-in-out;
    transition: color .3s ease-in-out, background-color .3s ease-in-out;
}
a.lien-cas-client:hover {
   /* background-color: #fafaf8;   */
}
a.lien-cas-client:hover > span,
a.lien-cas-client:hover .lien::after {
    color: #ffbf00;
}
    
    .cbp-filter-item {
        background-color: #F0EEE9;
        color: #666666;
        cursor: pointer;
        font: 400 1rem / 2rem var(--title-font);
        padding: 0.25rem 0.75rem;
        position: relative;
        overflow: visible;
        margin: 0 3px 10px 3px;
        text-transform: uppercase;
        display: inline-block;
        -webkit-transition: color .3s ease-in-out, background-color .3s ease-in-out;
        transition: color .3s ease-in-out, background-color .3s ease-in-out;
        border-radius: 4px;
        z-index: 99;
    }
    .cbp-filter-item:hover {
        color: #333;
        background-color: #f7f6f4;
    }
    .cbp-filter-item.cbp-filter-item-active {
        background-color: #666;
        color: #fff;
    }
    .cbp-filter-item.cbp-filter-item-active:hover {
        background-color: #999;
        color: #fff;
    }


.expertise img.expertise-icon  {
    width: auto;
}
.expertise-recherche .cbp-search-input {
    height: 36px;
    padding: 0 32px 0 12px;
    margin: 0;
    border-radius: 4px;
    border: 1px solid #fff;
    font: 400 1rem / 2rem var(--body-font);
    width: 100%;
}
.expertise-recherche .cbp-search {
        width: 240px;
    margin-bottom: 30px;
}
.expertise-recherche {
    display: flex;
    justify-content: center;
}

.liste-jobs {
    width: 100%;
}
.bloc-job {
    display: flex;
    justify-content: space-between;
    padding: 2rem;
    border-radius: 0.5rem;
    margin: 2rem;
}
.bloc-job .info {
    display: flex;
    flex-direction: column;
    padding: 0 1rem;
}
.bloc-job .titre{
    font-weight: 600;
    font-family: var(--title-font);
    font-size: 1.25rem;
    color: var(--link-secondary-color);
    text-transform: uppercase;
}
.bloc-job .experience{
    font-family: var(--body-font);
    font-size: 1rem;
    color: var(--link-secondary-color);
}
.bloc-job .info-supp {
    display: flex;
    font-family: var(--body-font);
    font-size: 1rem;
    color: var(--link-secondary-color);
}
.bloc-job .contrat:before {
content: url('/themes/custom/themis/images/icon_time-five.svg');
margin-right: 0.5rem;
}
.bloc-job .localisation:before {
content: url('/themes/custom/themis/images/icon_location.svg');
margin-right: 0.5rem;
}
.bloc-job .localisation, .bloc-job .contrat {
    display: flex;
    align-items: center;
}
.bloc-job .info-supp > * {
    padding-right: 1rem;
}
.bloc-job  .info > * {
    padding: 0.5rem 0rem;
}
.job-carousel {
    font-family: var(--title-font);
    background: #fff;
    padding: 1em;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
  }
  
  .carousel-header {
    font-weight: normal;
    font-size: 2rem;
    color: #666;
    display: flex;
    align-items: center;
    margin-right: 0.5rem;
    height: 3rem;
  }
  
  .carousel-wrapper {
    height: 3rem;
    overflow: hidden;
    position: relative;
    mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
  }
  
  .carousel-list {
    list-style: none;
    margin: 0;
    padding: 0;
    opacity: 0;
    transform: translateY(0);
  }
  
  .carousel-list.loaded {
    opacity: 1;
    transition: transform 0.6s ease-in-out, opacity 0.3s ease-in;
  }
  
  .carousel-list li {
    font-family: var(--title-font);
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 2rem;    
    font-weight: 600;
  }
  
.secondary-blue {
    color: rgb(85, 195, 233);
}
.secondary-orange {
    color: rgb(255, 152, 104);
}
.secondary-green {
    color: rgb(186, 222, 148);
}
.secondary-violet {
    color: rgb(172, 172, 255);
}

.job-titre {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.job-titre > * {
    width: 50%;
}
h3.job {
    font-size: 1.5rem;
    font-weight: 300;
}
#grille-portrait .cbp-item p {
        line-height: 1rem;
            margin: 1rem 0;
}
#grille-portrait .cbp-item a {
    text-align: center;
    margin-bottom: 2rem;
}
#grid-container-cas-clients .cbp-item {
    height: 800px;
}

.notre-expertise .cbp-item {
    min-height: 420px;
}
.expertise img.expertise-icon {
    height: 80px;
}

/* The flip box container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-box {
  background-color: transparent;
  width: 292px;
  height: 292px;
  border: 0px solid #f1f1f1;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-box-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-box:hover .flip-box-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-box-front, .flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-box-front {
  background-color: #bbb;
  color: black;
}

/* Style the back side */
.flip-box-back {
  background-color: dodgerblue;
  color: white;
  transform: rotateY(180deg);
}

.linkedin .bloc-contenu {
    margin-top: 3Rem;
}

.cbp-lightbox img {
    max-width : 500px;
    border: 1px solid var(--beige-color) !important;
}

.edit-link-1 {
    font-size: 1.5em;
    position: fixed;
    top: 100px;
    right: 20px;
}

.edit-link-2 {
    font-size: 1.5em;
    position: fixed;
    top: 100px;
    right: 50px;
}

.edit-link-expertise {
    font-size: 1.5em;
    float: right;
    margin-top: -73px;
}

.lateral .logos-accordeon{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
    padding: 0 1rem;
}

.lateral .logos-accordeon img{
    width:auto;
    max-width : 180px;
    max-height: 60px;
    display: block; /* évite les marges indésirables */
    margin: 10px auto;
}
.lateral .liens-accordeon {
    display: flex;
    justify-content: center;
    padding: 1rem;
}

.accordeon-secteurs .logos-accordeon{
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    align-items: center;
    padding: 0 1rem;
}

.accordeon-secteurs .logos-accordeon img{
    width:auto;
    max-width : 180px;
    max-height: 60px;
    display: block; /* évite les marges indésirables */
    margin: 10px auto;
}
.accordeon-secteurs .liens-accordeon {
    display: flex;
    justify-content: center;
    padding: 1rem;
}

a.btn.blanc:hover {
    background-color: #FFF;
    color: #005a8d;
}

/* Bandeau cookies*/
button.agree-button.eu-cookie-compliance-secondary-button, button.eu-cookie-compliance-save-preferences-button ,button.agree-button.eu-cookie-compliance-default-button  {
    /*font: bold 16px/26px 'Open Sans';*/
    background: #FFF;
    color: #0f0f0f;
    padding: 4px 15px;
    margin-right: 1rem;
    border-radius: 4px;
}

button.decline-button.eu-cookie-compliance-default-button {
    background: transparent;
    color: #FFF;
    border: none;
    border-radius: 0;
    box-shadow: none;
    text-shadow: none;
   /* font: bold 14px/26px 'Open Sans';*/
    text-decoration: underline;
}


.eu-cookie-compliance-message h2{
    /*font: bold 14px/26px 'Open Sans';*/
    padding-top: 5px;
}

.eu-cookie-compliance-message p {
    /*font: normal 13px/26px 'Open Sans';*/
}
.eu-cookie-compliance-more-button {
    /*font: normal 12px/26px 'Open Sans';*/
}


/* Webform */
.webform-options-display-buttons label.webform-options-display-buttons-label,  .webform-file-button {
    font: 400 1rem / 2rem var(--body-font);
    border: 1px solid #666666;
    border-radius: 4px;
    color: #666;
    padding: 0.25rem 1rem;
    width: max-content;
    cursor: pointer;
    transition: color .3s ease-in-out, background-color .3s ease-in-out;
    -webkit-transition: color .3s ease-in-out, background-color .3s ease-in-out;
        
}
.webform-options-display-buttons input:checked + label.webform-options-display-buttons-label,  .webform-file-button{
    color: #FFF !important;
    background-color: var(--theme-color);
    border-color: var(--theme-color);
}
.webform-options-display-buttons .webform-options-display-buttons-wrapper {
    flex: none;
}
.webform-options-display-buttons label.webform-options-display-buttons-label:hover,  .webform-file-button:hover {
    background-color: var(--theme-color);
    border-color: var(--theme-color) !important;
    color: #FFF !important;
}
.webform-options-display-buttons input:checked:focus + label.webform-options-display-buttons-label,  .webform-file-button {
    box-shadow: 0 0 0;
}

.webform-file-button {
    display: table-cell;
}

.webform-options-display-buttons .form-item {
    display: flex;
}
.formulaire {
    max-width: 980px; margin: 0 auto;
}
.js-form-item {
    font-family: var(--body-font);
    font-weight: normal;
    color: var(--link-secondary-color);
}
.js-form-item label {
    font-weight: normal;
    color: var(--link-secondary-color);
    line-height: 2rem;
}
div#edit-rgpd--description {
    font-size: 0.85rem;
    line-height: 1.15rem;
}
.js-form-type-checkbox {
    margin: 3rem 0;
}
.webform-flexbox {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin: 3rem 0;
    justify-content: space-between;
}
.webform-flex--container {
    margin: 0;
        width: 100%
}
.webform-flex--container > .form-item {
    margin: 0.5rem 0;
}
.webform-options-display-buttons {
    justify-content: center;
    gap: 0.5rem;
}
.webform-flexbox .webform-flex--1 {
    flex: 0 0 calc(50% - 1rem);
    display: flex;
    align-items: center;
    font: 600 16px / 2 var(--body-font);
    color: var(--link-secondary-color);
}
.webform-flexbox input.form-text,
.webform-flexbox input.form-email,
.webform-flexbox input.form-tel {
    background-color: #EFEDE8;
    border: none;
    min-height: 2.5rem;
    font-family: var(--body-font);
    font-size: 0.9rem;
    color: var(--link-secondary-color);
    padding: 0.75rem;
        width: 100%;
}
.js-form-type-textarea .form-textarea{
    background-color: #EFEDE8;
    border: none;
    width: 100%;
    padding: 0.75rem;
    font-family: var(--body-font);
    font-size: 0.9rem;
    color: var(--link-secondary-color);
}
.webform-required {
    display: none;
}
.form-type-webform-terms-of-service a {
    text-decoration: underline;
}
#edit-cv, #edit-curriculum-vitae,[id^=edit-cv--].webform-document-file, [id^=edit-curriculum-vitae--].webform-document-file{
    margin-left: 50px;
    font-style: italic;
}

#edit-actions-submit, [id^=edit-cv-remove-button], [id^=edit-curriculum-vitae-remove-button]{
    position: relative;
    z-index: 2;
    vertical-align: middle;
    display: inline-block;
    border: none;
    text-align: center;
    background-color: var(--theme-color);
    color: var(--white-color);
    font-family: var(--body-font);
    font-size: 1rem;
    font-weight: 400;
    padding: 0.75rem 1.25rem;
    border-radius: 0;
    overflow: hidden;
    border-radius: 0.25rem;
    cursor: pointer;
}

[id^=edit-cv-remove-button], [id^=edit-curriculum-vitae-remove-button]{
    margin-left: 20px;
}

input#edit-cv-upload, input#edit-curriculum-vitae-upload {
    position: relative;
    z-index: 2;
    vertical-align: middle;
    display: inline-block;
    border: none;
    text-align: center;
    background-color: var(--beige-color);
    color: var(--link-secondary-color);
    font-family: var(--body-font);
    font-size: 1rem;
    font-weight: 400;
    padding: 0.75rem 1.25rem;
    border-radius: 0;
    overflow: hidden;
    border-radius: 0.25rem;
    cursor: pointer;
}
.form-type-webform-terms-of-service.js-form-type-webform-terms-of-service.js-form-item.form-item.js-form-type-checkbox.form-item-terms-of-service.js-form-item-terms-of-service {
    margin: 3rem 0rem 1rem 0rem;
}
label.js-form-required.form-required::after {
    content: "*";
    color: #ffbf00;
    margin-left: 0.25rem;
}
@media (max-width: 768px) {
  .webform-flexbox .webform-flex--1 {
    flex-basis: 100%;
  }
  .section.large {
    padding: 1.5rem;
    }
    .contact-wrap {
    padding: 0 !important;
    }
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible {
  outline: none; /* on remplace par un ring */
  box-shadow: 0 0 0 3px var(--theme-color);
  border-radius: .4rem; /* optionnel, pour suivre les coins */
}
.webform-confirmation__message {
    font-family: var(--title-font);
    font-size: 2.5rem;
    color: var(--link-secondary-color);
    font-weight: 600;
    line-height: 3.5rem;
}


.contact-wrap{
  max-width: 980px;
  margin: 48px auto;
  padding: 0 24px;
}

/* ====== Cartes contact ====== */
.contact-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
}

.contact-card .icon{
  display: inline-flex;
  width: 48px; height: 48px;
  align-items: center; justify-content: center;
  margin-bottom: 10px;
}
.contact-card h2 {
    line-height: 0;
    font-size: 2rem;
}
.contact-card h3 {
    margin: 0 0 6px;
    font-weight: normal;
    font-family: var(--body-font);
}

.contact-card .caption{
  margin: 0;
  font-size: 14px;
}

.contact-card .value{
  margin: 6px 0 0;
  font-size: 16px;
}
.contact-card a {text-decoration: underline;}
.contact-card a:hover{  color: #ffbf00; }

.link-line{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 0;
}

.inline-link{
  text-decoration: none;
  position: relative;
}
.inline-link:hover{ text-decoration: underline; }
.chev{ font-size: 18px; line-height: 1; }

/* ====== Carte / image ====== */
.map-card{
  margin: 36px 0;
}
.map-card img{
  width: 100%;
  display: block;
  object-fit: cover;
}

/* ====== Consignes ====== */
.directions{
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  gap: 18px;
}

.direction{
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 14px;
    align-items: center;
}

.step-icon {
  width:48px; height:48px;
  display:inline-flex; align-items:center; justify-content:center;
}
.svg-icon { width:48px; height:48px; display:block; }

.direction p{
  margin: 10px 0 0;
  line-height: 1.6;
}

/* ====== Responsive ====== */
@media (max-width: 900px){
  .contact-grid{ grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px){
  .contact-grid{ grid-template-columns: 1fr; }
  .map-card{ margin: 28px 0; }
}

[data-quickedit-entity-id="paragraph/149"] .section.large,
[data-quickedit-entity-id="paragraph/168"] .section.large {
    padding: 1.5rem;
    justify-content: center;
}
.section.large.formulaire > div{width: 100%;}

.grecaptcha-badge {
    width: 70px !important;
    overflow: hidden !important;
    transition: all 0.3s 
ease !important;
    left: 4px !important;
}

[role="alert"] {
   color: red;
    background-color: #f8d7da;
    /* color: #721c24; */
    border: 1px solid #f5c6cb;
    padding: 15px;
    margin: 10px 0;
    border-radius: 5px;
    /* font-size: 1.2rem; */
    /* font-weight: bold; */
    /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
}