/* ============================================================
   REFONTE 2026 — Design tokens Servagroupe
   Charte conservée : verts, rouge accent, Montserrat.
   Variables globales réutilisables (agence, home, header, footer).
   ============================================================ */
:root{
    --sg-green-900:#073426;
    --sg-green-800:#084835;
    --sg-green-600:#0c6c4f;
    --sg-green-500:#229377;
    --sg-mint-400:#38b99f;
    --sg-red:#9a1920;
    --sg-red-700:#7d141a;
    --sg-ink:#26352f;
    --sg-paper:#f8faf9;
    --sg-line:#e3ebe8;
    --sg-radius-sm:10px;
    --sg-radius:16px;
    --sg-radius-lg:22px;
    --sg-shadow-sm:0 4px 14px rgba(8,72,53,.06);
    --sg-shadow:0 14px 34px rgba(8,72,53,.10);
    --sg-shadow-lg:0 22px 50px rgba(8,72,53,.14);
    --sg-ease:cubic-bezier(.22,.61,.36,1);
}

/**
 * LOADER
 */

.loader{
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    background: #fff;
    left: 0;
    z-index: 99999;
}

.cs-loader {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.cs-loader-inner {
  transform: translateY(-50%);
  top: 50%;
  position: absolute;
  width: calc(100%);
  color: #38b99f;
  padding: 0 100px;
  text-align: center;
}

.cs-loader-inner label {
  font-size: 20px;
  opacity: 0;
  display:inline-block;
}

@keyframes lol {
  0% {
    opacity: 0;
    transform: translateX(-300px);
  }
  33% {
    opacity: 1;
    transform: translateX(0px);
  }
  66% {
    opacity: 1;
    transform: translateX(0px);
  }
  100% {
    opacity: 0;
    transform: translateX(300px);
  }
}

@-webkit-keyframes lol {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-300px);
  }
  33% {
    opacity: 1;
    -webkit-transform: translateX(0px);
  }
  66% {
    opacity: 1;
    -webkit-transform: translateX(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(300px);
  }
}

.cs-loader-inner label:nth-child(6) {
  -webkit-animation: lol 3s infinite ease-in-out;
  animation: lol 3s infinite ease-in-out;
}

.cs-loader-inner label:nth-child(5) {
  -webkit-animation: lol 3s 100ms infinite ease-in-out;
  animation: lol 3s 100ms infinite ease-in-out;
}

.cs-loader-inner label:nth-child(4) {
  -webkit-animation: lol 3s 200ms infinite ease-in-out;
  animation: lol 3s 200ms infinite ease-in-out;
}

.cs-loader-inner label:nth-child(3) {
  -webkit-animation: lol 3s 300ms infinite ease-in-out;
  animation: lol 3s 300ms infinite ease-in-out;
}

.cs-loader-inner label:nth-child(2) {
  -webkit-animation: lol 3s 400ms infinite ease-in-out;
  animation: lol 3s 400ms infinite ease-in-out;
}

.cs-loader-inner label:nth-child(1) {
  -webkit-animation: lol 3s 500ms infinite ease-in-out;
  animation: lol 3s 500ms infinite ease-in-out;
}


body.single-offre_emploi #content #inner-content #main .bloc_infos_offre .bloc_map{
    background: none;
}

/* Offers Archive */

.post-type-archive-offre_emploi #inner-content{
    max-width: 100%;
}

.post-type-archive-offre_emploi #main .wpbf-container{
    max-width: 1300px;
}

.post-type-archive-offre_emploi .wpbf-padding-medium{
    padding-top: 30px;
}

.post-type-archive-offre_emploi .alternate{
    background: #f8f8f8;
    padding: 60px 0;
    margin-bottom: 60px;
}

.post-type-archive-offre_emploi h2 {
    font-size: 1.875rem;
    margin-bottom: 30px !important;
}

.post-type-archive-offre_emploi .bloc-search{
    background: #FFFFFF;
    box-shadow: 0 9px 33px rgba(0,0,0,0.1);
    width: 100%;
    padding: 43px 25px;
    position: relative;
}

.post-type-archive-offre_emploi #anim_ox_offre{
    position: absolute;
    right: 130px;
    top:-100px;
}

/* Pagination */

.pagination{
    margin-top: 30px;
}

.pagination .next,
.pagination .prev{
     display: none;   
}

/* Offer Item */

body .offer-item,
body .agence-item{
    background: #fff;
    box-shadow: 0 7px 21px rgba(0,0,0,0.1);
    position: relative;
    /*margin-right:15px;*/
    margin: 18px 0 1.25rem 0;
}

body .offer-item {
	padding: 30px 50px 30px 20px;	
}

body .agence-item{
	padding: 30px 20px;
}

.home #content #offre_emploi .offer-item {
	padding: 40px;	
}

body .offer-item h3,
body .elementor-shortcode .agence-item h3{
    font-size: 1rem;
    font-weight: 700;
    text-transform: initial;
	margin-bottom: .625rem;
}

body .offer-item h3 a,
body .elementor-shortcode .agence-item h3 a{
    color:#084835;
}

body .offer-item p{
	font-size: .875rem;
    margin: 0;
}

body .agence-item p{	
    display: flex;
    align-items: baseline;
	font-size: .8125rem;
    margin-bottom: .375rem;
}

body .agence-item p span.icomoon{	
    margin-right: 10px;
}

body .offer-item p.date_offre{
	display: flex;
    align-items: center;
	margin-top: .75rem;
}

body .offer-item p.date_offre span.offer-calendar{
	line-height: 1;
    margin-right: 10px;
	margin-bottom: 3px;
}

.offer-item .offer-calendar:before{
    content: "\68";
    font-family: "icomoon";
    font-size: 1.25rem;
    font-weight: 400;
    position: relative;
    top:2px;
}

.offer-link,
.offer-link:hover{
    display: block;
    width: 30px;
    height: 100%;
    line-height: 100%;
    background: #9a1920;
    color: #fff;
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
}

.offer-item:hover .offer-link{
    width: 60px;
    right: 0;
    transition: all ease 0.2s;
    background: #0c6c4f;
}

.offer-item:focus .offer-link{
    width: 60px;
    right: 0;
    transition: all ease 0.2s;
    background: #229377;
}

.offer-item:hover .offer-link:before{
    left: 50%;
	transform: translate(-50%,-50%);
}

.offer-item:hover h3 a{
	transition: all ease 0.2s;
}

.offer-item:hover h3 a{
	color:#38b99f;
}

.offer-item:focus h3 a{
    color:#229377;    
}

.offer-link:before{
    content: "\6e";
    font-family: 'icomoon';
    font-size: .875rem;
    font-weight: 400 !important;
    text-transform: lowercase !important;
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transition: all ease 0.2s;
}

.offer-flash{
    background: #38b99f;
    color: #fff;
    width:36px;
    height: 36px;
    border-radius: 100%;
    text-align: center;
    line-height: 36px;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%,-50%);
}

.offer-flash:before{
    content: "\61";
    font-family: "icomoon";
    font-size: 1.4375rem;
}

.offer-link-overlay{
    display: block;
    width: 100%;
    height: 100%;
    background: transparent;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.meme_categorie,
.meme_secteur {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
}

.meme_categorie {
	border-bottom: 1px solid #9a1920;
	margin-bottom: 40px;
	padding-bottom: 40px;
}

.meme_categorie .subTitle,
.meme_secteur .subTitle{
    color: #9a1920;
    width: 100%;
    font-weight: bold;
    font-size:1.25rem;
    text-transform: uppercase;
    margin-bottom: 1.5625rem;
}

.meme_categorie hr{
    background: #9a1920;
    height: 3px;
    border: 0;
    clear: both;
	display: none;
}

.meme_categorie .offer-item,
.meme_secteur .offer-item{
    width: 32%;
	margin-right: 2%;
}

.meme_categorie .offer-item:nth-child(3n+1),
.meme_categorie .offer-item:last-child,
.meme_secteur .offer-item:nth-child(3n+1),
.meme_secteur .offer-item:last-child{
	margin-right: 0;
}

/* Select 2 */
.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-container--default .select2-search--dropdown .select2-search__field:focus{
    border: 1px solid #dedee5 !important;
    font-size: 0.75rem;
}

.select2-container--default .select2-results__option--selected {
    background-color: #e1e1e1;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
    background-color: #38b99f;
}

.select2-container--open .select2-dropdown--below{
    box-shadow: 0px 0px 24px 0px rgba(0,0,0,.15);    
    border:0;
}

.select2-container--default .select2-selection .select2-selection__placeholder{
    color: #fff;
}

/* Search offers form */
#search-offers-form{
    display: flex;     
}
#search-offers-form input[type="text"],
#search-offers-form input[type="text"]:focus{
    width: 100%;
    flex: 1;
	flex-grow: 1;
    color: #fff !important;
    border: 0 !important;
    background: #38b99f;
    font-size: 17px; 
    font-weight: normal !important;
    line-height: 25px;
}

#search-offers-form input[type="text"],
#search-offers-form > .select2-container{
	margin-right: 10px;
}

#search-offers-form [type="text"]::-webkit-input-placeholder { color:#fff !important; opacity: 1; font-weight: normal; font-size: 17px}
#search-offers-form [type="text"]::-moz-placeholder { color:#fff !important;  opacity: 1; font-weight: normal; font-size: 17px}
#search-offers-form [type="text"]:-ms-input-placeholder { color:#fff !important;  opacity: 1; font-weight: normal; font-size: 17px}
#search-offers-form [type="text"]:-moz-placeholder { color:#fff !important; opacity: 1;  font-weight: normal; font-size: 17px}

#search-offers-form > .select2-container{
    flex: 1;
	flex-grow: 1;
    width: 100% !important;
	padding: 0 16px;
    background: #38b99f;
    border-radius: 3px;
}

#search-offers-form .select2-container--default .select2-selection,
#search-offers-form .select2-container--default .select2-selection .select2-selection__arrow,
#search-offers-form .select2-container--default .select2-selection__clear{
    background: transparent;
	border: 0;
    height: 50px;
}

#search-offers-form .select2-container--default .select2-selection .select2-selection__arrow{
    top:0;
    width: 50px;
}

#search-offers-form .select2-container--default .select2-selection__clear{
    position: absolute;
    top: 0;
    right: 50px;
    width: 20px;
    margin: 0;
}

#search-offers-form .select2-container--default .select2-selection__clear span{
    color: #fff;
	font-size: 1.875rem;
    line-height: 50px;
    height: 100%;
}

#search-offers-form .select2-container--default .select2-selection .select2-selection__arrow b{
    border-color:#fff transparent transparent transparent;
    border-width: 7px 6px 0 6px;
    margin-top: -3px;
}

#search-offers-form .select2-container--default .select2-selection .select2-selection__rendered{
    color: #fff;
    border: 0;
    background: #38b99f;
    line-height: 50px;
    padding: 0;
    font-size: 17px;
    border-radius: 3px;    
}

#search-offers-form button[type="submit"]{
    width: 50px;
    height:50px;
    border-radius: 100%;
    line-height: 50px;
    text-align: center;
    color: #fff;
    background: #38b99f;
    cursor: pointer;
    transition: all ease 0.2s;
}

#search-offers-form button[type="submit"]:hover{
    background: #9a1920;
}

#search-offers-form button[type="submit"] span{
    font-family:"icomoon";
    color: #fff;
    transition: all ease 0.2s;
}

#search-offers-form button[type="submit"] span.btn_txt{
	display: none;
}

#search-offers-form button[type="submit"]:hover span{
   font-size: 20px;
}

body.home #content #home_recherche .bloc_recherche{
    height: auto; 
}

body.home #search-offers-form > .select2-container{
    flex: 1;
    max-width: 100%;
}


/* Sticky Menu */

#header .wpbf-navigation.wpbf-navigation-active{
    background: #0c6c4f;
}

#header .wpbf-navigation.wpbf-navigation-active #menu-menu-principal{
    display: none;
} 

#header .wpbf-navigation.wpbf-navigation-active .menu_secondaire{
    margin-left: 80px;
}

#header .wpbf-navigation.wpbf-navigation-active .wpbf-logo{
    width: 60px;
    position: absolute;
    top: 7px;
}


/* Top Header */

#header #pre-header{
    background: #f5f5f7 !important
}

#header .wpbf-navigation.wpbf-navigation-active .wpbf-logo img{
    width: 100%;
}

#header .wpbf-navigation.wpbf-navigation-active > .wpbf-menu-right{
    padding: 0;
    position: relative;
}

/* Scrollbar */

::-webkit-scrollbar {
    width: 7px;
}
 
/* Track */
::-webkit-scrollbar-track {
   
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    background: #38b99f; 
}
::-webkit-scrollbar-thumb:window-inactive {
	
}

/* Cookies Banner */

#cookieBanner{
    background: rgba(7,52,38,.8);
    font-size: 13px;
    text-align: center;
    z-index: 2500;
}

#cookieBanner .wpbf-container{
    max-width: 1320px;
	padding:0;
}

#cookieBanner #cookieBannerActions {
    min-width: 345px;
}

body #cookieBanner .btn{
    line-height: 1rem;
    text-transform: uppercase;
}

body #cookieBanner #cookieBannerValidation{
    background: #38b99f;
    border:1px solid #38b99f;
    color: #fff;
	font-size: .875rem;
}

body #cookieBanner #cookieBannerValidation:hover{
    background: #229377;
    border:1px solid #229377;
}

body #cookieBanner #cookieBannerValidation:focus{
    background: #0c6c4f;
    border:1px solid #0c6c4f;
}

body #cookieBanner #cookieBannerMore{
    background: transparent;
   	border:1px solid #fff;
    color: #FFFFFF;
	font-size: .875rem;
}

body #cookieBanner #cookieBannerMore:hover{
    background: #fff;
   	border:1px solid #fff;
    color: #073426;
}

body #cookieBanner #cookieBannerMore:focus{
    background: rgba(255,255,255,0.85);
   	border:1px solid rgba(255,255,255,0.85);
    color: #073426;
}

body #cookieBanner p{
	text-align: left;
    margin: 0;
	padding:15px 0;
}

body #cookieBanner a:hover{
	color:#229377;
}

body #cookieBanner a:focus{
	color:#0c6c4f;
}

#cookieConfigurationBox .btn{
    text-transform: uppercase;
    background: #0c6c4f;
}

.radio-container input:checked ~ .checkmark, .checkbox-container input:checked ~ .checkmark{
    background: #9a1920
}

/* Footer */

body .scrolltop{
    bottom: 16px;
    right: 16px;
    z-index: 1500;
}

/* Flash Jobs */

#header #pre-header .bloc_menu_top_left .textwidget{
    display: flex;
}

#header #pre-header .bloc_menu_top_left a{
    display: block;
    height: 42px;
    line-height: 42px;
}


/* Flash Job — menu déroulant des dernières offres */
#header #pre-header .flash_job_wrap{
    position: relative;
}

#header #pre-header .bloc_menu_top_left .flash_job{
    cursor: pointer;
    user-select: none;
}

#header #pre-header .flash_job_menu{
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 999;
    width: 320px;
    max-width: 86vw;
    padding: 14px 16px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 18px 40px rgba(0,0,0,.18);
    color: #1d1d1b;
    text-align: left;
}

#header #pre-header .flash_job_menu[hidden]{
    display: none;
}

#header #pre-header .flash_job_menu::before{
    content: "";
    position: absolute;
    top: -7px;
    left: 22px;
    width: 14px;
    height: 14px;
    background: #fff;
    transform: rotate(45deg);
    box-shadow: -3px -3px 8px rgba(0,0,0,.06);
}

#header #pre-header .flash_job_menu__title{
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #9a1920;
}

#header #pre-header .flash_job_menu ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

#header #pre-header .flash_job_menu li{
    border-top: 1px solid #eef1f0;
}

#header #pre-header .flash_job_menu li:first-child{
    border-top: 0;
}

#header #pre-header .bloc_menu_top_left .flash_job_menu li a{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    height: auto;
    padding: 9px 0;
    line-height: 1.3;
    color: #084835;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: color .15s ease;
}

#header #pre-header .bloc_menu_top_left .flash_job_menu li a:hover{
    color: #9a1920;
}

#header #pre-header .flash_job_menu__job{
    flex: 1 1 auto;
}

#header #pre-header .flash_job_menu__date{
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 500;
    color: #7a8a85;
    white-space: nowrap;
}

#header #pre-header .bloc_menu_top_left .flash_job_menu__all{
    display: inline-block;
    height: auto;
    margin-top: 10px;
    line-height: 1.3;
    font-size: 12px;
    font-weight: 700;
    color: #9a1920;
    text-decoration: none;
}

#header #pre-header .bloc_menu_top_left .flash_job_menu__all:hover{
    text-decoration: underline;
}

#header #pre-header .flash_job_menu__empty{
    margin: 0;
    font-size: 13px;
    color: #555;
}

/* Menu Secondaire */
#header .wpbf-navigation .menu_secondaire #menu-menu-secondaire li:last-child{
    border-right: 0
}

/* Home Flash Jobs */

body.home #content #offre_emploi .bloc_offre_emploi .bloc_job_offre{
    width: 50%;
}

body.home #content #offre_emploi .bloc_offre_emploi .bloc_job_offre p.date_offre{
    display: flex;
    align-items: center;
    line-height: 1;
    margin-top: .5rem;
}

body.home #content #offre_emploi .bloc_offre_emploi .bloc_job_offre span{
    display: inline-block;
}

body.home #content #offre_emploi .bloc_offre_emploi .bloc_job_offre span.offer-calendar{
	margin-right: 10px;
    line-height: 1;
}

body.home #content #offre_emploi .offer-flash:before{
    color: #fff !important;
}

body.home #content #offre_emploi .offer-link{
    display: none;
}

body.home #content #offre_emploi .offer-item{
    width: 100%;
    position: absolute;
    top:-140px;
    transition: all ease 0.6s;
    visibility: hidden;
    opacity: 0;
}

body.home #content #offre_emploi .offer-item.active{
    top:0;
    visibility: visible;
    opacity: 1;
}

body.home #content #offre_emploi .bloc_offre_emploi .bloc_job_offre .elementor-widget-shortcode{
    min-height: 160px;
    position: relative;
    
}

.slideshow-container {
    max-width: 1000px;
    margin: auto;
}

.prev, .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    margin-top: -30px;
    padding: 16px;
    color: white;
    font-weight: bold;
    font-size: 18px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    left:-43px;
    right: auto;
}

.prev:hover, .next:hover {
    color:rgba(255,255,255,0.85);
}

.prev:focus, .next:focus {
    color:rgba(255,255,255,0.75);
}

.next {
    right: -40px;
    border-radius: 3px 0 0 3px;
    left:auto;
}

.prev:before,
.next:before{
    content: "\6e";
    font-family: 'icomoon';
    font-size: .875rem;
    font-weight: 400 !important;
    display: inline-block
}

.prev:before{
     transform: rotate(180deg);
}

/**
 * CONTACT AGENCES
 */

#content #inner-content .elementor-top-section#contact-agences{
    margin-bottom: 0;
}

body #agences-list{
    display: flex;
    flex-flow: row wrap;
    height: 100%;
    max-height: 500px;
    width: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
}

body #agences-list:after{
    content: '';
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    height:50px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+58&0+0,1+58 */
    background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 58%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 58%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 58%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

body .agence-item{
    width: 45.5%;
    float: left;
    font-size: 12px;   
}

body .agence-item:nth-child(2n-1){
    margin: 10px 1.5% 10px 3%;
}

body .agence-item:nth-child(2n){
   margin: 10px 3% 10px 1.5%;
}

body .agence-item .agence-link{
    margin-top: .625rem;
	margin-bottom: 0;
}

body .agence-item .agence-link a{
    color: #9a1920;
}

body .agence-item .agence-picture,
body .agence-item .agence-picture img{
    width: 100%;
    height:auto;
    background: #f5f5f7;
    border-radius: 100%;
    overflow: hidden;
}

body .agence-item .wpbf-container{
    display: flex;
    padding: 0;
}

body .agence-item .wpbf-container .wpbf-3-4{
    padding-left: 15px;
}

body .agence-item,
body .agence-item a,
body .agence-item p,
body .agence-item .icomoon{
    transition: all 0.3s ease-in-out;
}

body .agence-item:hover,
body .agence-item.active{
    background: #38b99f;
    color: #fff;
}

body .agence-item:hover a,
body .agence-item:hover p,
body .agence-item:hover .icomoon, 
body .elementor-shortcode .agence-item:hover h3 a,
body .agence-item.active a,
body .agence-item.active p,
body .agence-item.active .icomoon,
body .elementor-shortcode .agence-item.active h3 a {
    color: #fff;
}

.wpbf-contact h2{
    margin-bottom: 2rem !important
}

/**
 * AGENCE
 */

#content #inner-content #main .agences-open-hours li::before{
    content: '';
}

#content #inner-content #main .agences-open-hours li{
    padding: 0;
}

#content #inner-content #main .agences-open-hours li .dayName{
     font-weight: 600;   
}

#content #inner-content #main .agences-open-hours li .hours:after{
    content: '/';
    padding: 0 10px;
    font-weight: 600;   
}

#content #inner-content #main .agences-open-hours li .hours:last-child:after{
    content:'';
}

.open-hours.tooltip{
    position: static;
    background: #38b99f;
    padding: 15px;
    border-radius: 3px;
    color: #fff;
    z-index: 10;
    width: 100%;
    display: none; 
    margin: 10px 0 15px;
}

.open-hours.tooltip span{
    color: #fff;
    font-size: 13px;
}

/**
 * AGENCE SINGLE V2
 */

body .agency-single-page #inner-content{
    max-width: 1320px;
    width: 100%;
}

body.single-agences_servagroupe #content #inner-content.wpbf-container{
    padding-bottom: 34px;
}

body .agency-single-v2{
    clear: both;
    display: block;
    flex: 0 0 100%;
    float: none;
    width: 100%;
    max-width: 100%;
}

body.single-agences_servagroupe #content #inner-content #main.agency-single-v2{
    align-items: initial !important;
    display: block !important;
    flex-flow: initial !important;
    justify-content: initial !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 1320px !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
    width: 100% !important;
}

body.single-agences_servagroupe .agency-single-page .wpbf-main-grid{
    display: block;
    margin-left: 0;
    width: 100%;
}

body.single-agences_servagroupe .agency-single-page .wpbf-main-grid::before,
body.single-agences_servagroupe .agency-single-page .wpbf-main-grid::after{
    clear: both;
    content: "";
    display: table;
}

body.single-agences_servagroupe .agency-single-page{
    overflow-x: clip;
}

body .agency-single-v2 h1,
body .agency-single-v2 h2,
body .agency-single-v2 h3{
    color: #084835;
    line-height: 1.18;
    margin-top: 0;
}

body .agency-single-v2 h1{
    font-size: 2.45rem;
    margin-bottom: .75rem;
}

body .agency-single-v2 h2{
    font-size: 1.45rem;
    margin-bottom: .75rem;
}

body .agency-single-v2 h3{
    font-size: 1.1rem;
    margin-bottom: .625rem;
}

body .agency-single-v2 p{
    line-height: 1.65;
}

body .agency-eyebrow{
    color: #9a1920;
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: .5rem;
    text-transform: uppercase;
}

body .agency-initial-block{
    align-items: stretch;
    display: flex;
    justify-content: space-between;
    margin-bottom: 58px;
    width: 100%;
}

body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_coordonees_agence{
    width: 44%;
}

body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_image{
    width: 56%;
}

body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit{
    width: 46%;
}

body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit.info_agence_marge{
    margin-right: 8%;
}

body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit .info_agence{
    width: 100%;
    margin-bottom: .35rem !important;
}

body.single-agences_servagroupe #content #inner-content #main .agency-contact-note{
    color: rgba(0, 0, 0, .62);
    font-size: .8125rem;
    line-height: 1.55;
    margin: .15rem 0 .45rem 35px;
}

body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit--address{
    margin-bottom: .25rem;
    margin-right: 0;
    width: 100%;
}

body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit--email{
    margin-top: .25rem;
    width: 100%;
}

body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit--email .email a{
    white-space: nowrap;
}

body.single-agences_servagroupe #content #inner-content #main .line_inner_agence.generaliste .agency-contact-unit{
    margin-right: 0;
    width: 100%;
}

body.single-agences_servagroupe #content #inner-content #main .agency-inline-cta{
    color: #9a1920;
    display: inline-flex;
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.35;
    margin-left: 35px;
    text-decoration: none;
}

body.single-agences_servagroupe #content #inner-content #main .agency-inline-cta:hover{
    color: #084835;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-list{
    display: grid;
    gap: 20px;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-row{
    border-bottom: 1px solid rgba(12, 108, 79, .12);
    padding-bottom: 18px;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-row:last-child{
    border-bottom: 0;
    padding-bottom: 0;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-icon{
    display: none;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-content strong{
    color: #9a1920;
    display: block;
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: .35rem;
    text-transform: uppercase;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-content p{
    color: rgba(0,0,0,.76);
    font-size: .9375rem;
    line-height: 1.55;
    margin: 0;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-row--email .agency-hero-contact-content p a{
    display: inline-block;
    font-size: .875rem;
    max-width: 100%;
    white-space: nowrap;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-content a:not(.agency-inline-cta){
    color: rgba(0,0,0,.76);
    text-decoration: none;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-content .agency-inline-cta{
    margin-left: 0;
    margin-top: .45rem;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours{
    display: grid;
    gap: 5px;
    font-size: .875rem;
    list-style: none;
    margin: .5rem 0 0;
    padding: 0;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours li{
    display: grid;
    gap: 10px;
    grid-template-columns: 84px minmax(0, 1fr);
    padding-left: 0;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours li::before{
    content: none;
    display: none;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours__day{
    color: #084835;
    font-weight: 700;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours__slots{
    color: rgba(0,0,0,.76);
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    line-height: 1.45;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours__separator{
    color: #9a1920;
    font-weight: 700;
    padding: 0 4px;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-grid{
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-grid .agency-hero-contact-row{
    border-bottom: 0;
    padding-bottom: 0;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-content .agency-contact-note{
    color: rgba(0,0,0,.58);
    font-size: .8125rem;
    line-height: 1.55;
    margin-top: .45rem;
}

body.single-agences_servagroupe #content #inner-content #main .line_inner_agence.professionnel{
    background: #fff;
    border: 1px solid rgba(12, 108, 79, .12);
    margin-top: 24px;
    padding: 18px;
}

body.single-agences_servagroupe #content #inner-content #main .line_inner_agence.professionnel p.h4{
    margin-top: 0;
}

body.single-agences_servagroupe #content #inner-content #main .line_inner_agence.professionnel .info_agence{
    display: grid;
    gap: 4px;
    margin-bottom: .75rem !important;
    width: 100%;
}

body.single-agences_servagroupe #content #inner-content #main .line_inner_agence.professionnel .info_agence strong{
    color: #9a1920;
    font-size: .75rem;
    text-transform: uppercase;
}

body.single-agences_servagroupe #content #inner-content #main .line_inner_agence.professionnel .info_agence a{
    color: rgba(0,0,0,.76);
    text-decoration: none;
}

body .agency-specialty-strip{
    background: #9a1920;
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(154,25,32,.16);
    color: #fff;
    margin: -34px 0 58px;
    overflow: hidden;
}

body .agency-specialty-strip__inner{
    align-items: center;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 18px 22px;
}

body .agency-specialty-strip h2{
    color: #fff !important;
    font-size: 1.125rem;
    font-weight: 700 !important;
    line-height: 1.25;
    margin: 0 !important;
}

body.single-agences_servagroupe #content #inner-content #main .agency-specialty-strip__title,
body.single-agences_servagroupe #content #inner-content #main .agency-specialty-strip__title strong{
    color: #fff !important;
    display: block;
    font-weight: 700 !important;
}

body .agency-specialty-strip p{
    color: rgba(255,255,255,.88);
    font-size: .9rem;
    line-height: 1.55;
    margin: .35rem 0 0;
    max-width: 760px;
}

body .agency-specialty-strip__actions{
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

body .agency-specialty-strip__actions a{
    align-items: center;
    background: #fff;
    border-radius: 8px;
    color: #9a1920;
    display: flex;
    justify-content: center;
    min-width: 154px;
    padding: 10px 14px;
    text-align: center;
    text-decoration: none;
}

body .agency-specialty-strip__actions a:hover{
    background: #084835;
    color: #fff;
}

body .agency-specialty-strip__actions strong{
    color: inherit;
    font-size: .875rem;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

body.single-agences_servagroupe #content #inner-content #main .bloc_image{
    overflow: hidden;
}

body.single-agences_servagroupe #content #inner-content #main .bloc_image img{
    transition: opacity .28s ease, transform .28s ease;
}

body.single-agences_servagroupe #content #inner-content #main .bloc_image:hover img{
    opacity: .92;
    transform: scale(1.035);
}

body .agency-hero{
    align-items: start;
    background: #f5f7f5;
    display: grid;
    gap: 28px;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
    margin: 0 0 46px;
    padding: 34px;
}

body .agency-hero__content{
    min-width: 0;
}

body .agency-hero__actions{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

body .agency-btn{
    align-items: center;
    background: #fff;
    border: 1px solid #d8e3df;
    color: #084835;
    display: inline-flex;
    font-size: .9375rem;
    font-weight: 700;
    justify-content: center;
    min-height: 46px;
    padding: 12px 18px;
    text-decoration: none;
    transition: background .2s ease, border-color .2s ease, color .2s ease;
}

body .agency-btn:hover{
    border-color: #38b99f;
    color: #084835;
}

body .agency-btn--primary{
    background: #38b99f;
    border-color: #38b99f;
    color: #fff;
}

body .agency-btn--primary:hover{
    background: #084835;
    border-color: #084835;
    color: #fff;
}

body .agency-btn--ghost{
    background: transparent;
    border-color: #9a1920;
    color: #9a1920;
}

body .agency-btn--ghost:hover{
    background: #9a1920;
    border-color: #9a1920;
    color: #fff;
}

body .agency-hero__media{
    background: #fff;
    min-height: 100%;
    overflow: hidden;
}

body .agency-hero__media img{
    display: block;
    height: 100%;
    min-height: 440px;
    object-fit: cover;
    width: 100%;
}

body .agency-hero__details{
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 26px;
}

body .agency-contact-card,
body .agency-support-card,
body .agency-empty-state,
body .agency-nearby-card{
    background: #fff;
    border: 1px solid #e3ebe8;
    box-shadow: 0 7px 21px rgba(0,0,0,0.06);
    padding: 24px;
}

body .agency-hero__details .agency-contact-card:last-child:nth-child(odd){
    grid-column: 1 / -1;
}

body .agency-contact-line{
    border-bottom: 1px solid #edf2f0;
    display: grid;
    gap: 8px;
    grid-template-columns: 105px minmax(0, 1fr);
    margin: 0;
    padding: 11px 0;
}

body .agency-contact-line strong{
    color: #084835;
    font-weight: 700;
}

body .agency-contact-line a,
body .agency-contact-line span{
    color: #26352f;
    overflow-wrap: anywhere;
}

body .agency-text-link{
    color: #9a1920;
    display: inline-flex;
    font-weight: 700;
    margin-top: 16px;
    text-decoration: none;
}

body .agency-text-link:hover{
    color: #084835;
}

body .agency-hours{
    list-style: none;
    margin: 0;
    padding: 0;
}

body .agency-hours li{
    border-bottom: 1px solid #edf2f0;
    display: grid;
    gap: 8px;
    grid-template-columns: 95px minmax(0, 1fr);
    padding: 9px 0;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hours li{
    padding-left: 0;
}

body.single-agences_servagroupe #content #inner-content #main .agency-hours li::before{
    content: none;
    display: none;
}

body .agency-hours__day{
    color: #084835;
    font-weight: 700;
}

body .agency-hours__separator{
    color: #9a1920;
    font-weight: 700;
    padding: 0 8px;
}

body .agency-map-section{
    margin: 60px 0;
}

body .agency-map-heading{
    align-items: flex-end;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    margin-bottom: 20px;
}

body .agency-map-heading h2{
    font-size: 1.45rem;
    margin-bottom: .45rem !important;
}

body .agency-map-heading p:last-child{
    margin-bottom: 0;
}

body .agency-map-section .agency-map{
    height: 360px;
}

body .agency-section{
    margin: 60px 0;
}

body .agency-about,
body .agency-offers,
body .agency-faq{
    background: #f8faf9;
    padding: 38px;
}

body .agency-section__heading{
    max-width: 760px;
}

body .agency-section__heading .agency-eyebrow{
    margin-bottom: .65rem;
}

body .agency-section__heading h2{
    margin-bottom: .55rem !important;
}

body .agency-section__heading p{
    line-height: 1.7;
    margin-bottom: 0;
    margin-top: 0;
}

body.single-agences_servagroupe #content #inner-content #main .agency-section__heading h2{
    margin-bottom: .55rem !important;
}

body.single-agences_servagroupe #content #inner-content #main .agency-section__heading p{
    margin-top: 0;
}

body .agency-offers__grid,
body .agency-support__grid,
body .agency-nearby__grid{
    display: grid;
    gap: 22px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 28px;
}

body .agency-nearby__grid{
    margin-top: 22px;
}

body.single-agences_servagroupe #content #inner-content #main .agency-nearby__grid{
    margin-top: 22px;
}

body .agency-offers__grid .offer-item{
    height: 100%;
    margin: 0;
}

body .agency-offer-count{
    color: #0c6c4f;
    font-size: .9375rem;
    font-weight: 700;
    margin-top: 1rem !important;
}

body .agency-support-card{
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body .agency-support-card:hover,
body .agency-nearby-card:hover{
    border-color: #38b99f;
    box-shadow: 0 10px 26px rgba(0,0,0,0.09);
    transform: translateY(-2px);
}

body .agency-support-card__icon{
    align-items: center;
    background: #0c6c4f;
    color: #fff;
    display: inline-flex;
    height: 36px;
    justify-content: center;
    line-height: 1;
    margin-bottom: 16px;
    width: 36px;
}

body .agency-support-card p{
    line-height: 1.68;
    margin-bottom: 0;
}

body .agency-nearby-card{
    color: #26352f;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    padding: 0;
    text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body .agency-nearby-card__media{
    aspect-ratio: 16 / 10;
    background: linear-gradient(135deg, #0c6c4f 0%, #084835 100%);
    display: block;
    overflow: hidden;
    position: relative;
}

body .agency-nearby-card__media .agency-nearby-card__img,
body .agency-nearby-card__media img{
    display: block;
    height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
    width: 100%;
}

body .agency-nearby-card:hover .agency-nearby-card__media img{
    transform: scale(1.04);
}

body .agency-nearby-card__media-fallback{
    align-items: center;
    color: rgba(255,255,255,.9);
    display: flex;
    font-weight: 700;
    height: 100%;
    justify-content: center;
    padding: 14px;
    text-align: center;
}

body .agency-nearby-card__body{
    display: grid;
    gap: 7px;
    padding: 18px 20px 20px;
}

body .agency-nearby-card strong{
    color: #084835;
}

body .agency-nearby-card em{
    color: #9a1920;
    font-size: .8125rem;
    font-style: normal;
    font-weight: 700;
}

body .agency-faq__items{
    border-top: 1px solid #e0e9e5;
    margin-top: 24px;
}

body .agency-faq details{
    border-bottom: 1px solid #e0e9e5;
    padding: 18px 0;
}

body .agency-faq summary{
    color: #084835;
    cursor: pointer;
    font-weight: 700;
}

body .agency-faq details p{
    color: #26352f;
    margin: 12px 0 0;
    max-width: 820px;
}

body .agency-mobile-actions{
    display: none;
}

body .agency-before-footer-note{
    color: rgba(0,0,0,.72);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.65;
    margin: 24px auto 0;
    max-width: 760px;
    text-align: center;
}

body .agency-before-footer-note a{
    color: #9a1920;
    font-weight: 700;
    text-decoration: none;
}

body .agency-before-footer-note a:hover{
    color: #084835;
}

/* Overlap réservé au vrai desktop (≥1141px, au-dessus du breakpoint du menu).
   En dessous, le hero s'empile (voir @media max-width:1140px) pour éviter un
   côte-à-côte trop étroit et déséquilibré en tablette. */
@media (min-width: 1141px){
    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_coordonees_agence{
        margin: 24px 0;
    }

    /* Effet de superposition : la carte de coordonnées glisse légèrement sous la
       photo (qui passe au premier plan) au lieu de deux blocs collés côte à côte.
       Les largeurs (48% + 56%) somment à 104% et la marge négative de -4% sur la
       photo crée le chevauchement tout en remplissant exactement la largeur. */
    body .agency-initial-block{
        justify-content: flex-start;
        position: relative;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_coordonees_agence{
        width: 48%;
        position: relative;
        z-index: 1;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_image{
        width: 56%;
        margin-left: -4%;
        position: relative;
        z-index: 2;
    }
}

/* Tablette / petit écran (≤1140px, là où le menu passe en burger) : on empile
   la carte et la photo en pleine largeur — plus de côte-à-côte déséquilibré. */
@media (max-width: 1140px){
    body .agency-initial-block{
        display: block;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_coordonees_agence,
    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_image{
        width: 100%;
        margin-left: 0;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_image{
        margin-top: 22px;
    }
}

@media (min-width: 1200px){
    body.single-agences_servagroupe #content #inner-content #main.agency-single-v2 .agency-initial-block{
        margin-left: -24px;
        margin-right: -24px;
        width: calc(100% + 48px);
    }
}

@media (min-width: 1440px){
    body.single-agences_servagroupe #content #inner-content #main.agency-single-v2 .agency-initial-block{
        margin-left: -40px;
        margin-right: -40px;
        width: calc(100% + 80px);
    }
}

@media (min-width: 1680px){
    body.single-agences_servagroupe #content #inner-content #main.agency-single-v2 .agency-initial-block{
        margin-left: -56px;
        margin-right: -56px;
        width: calc(100% + 112px);
    }
}

@media (max-width: 1024px){
    body .agency-hero,
    body .agency-initial-block,
    body .agency-hero__details,
    body .agency-offers__grid,
    body .agency-support__grid,
    body .agency-nearby__grid{
        grid-template-columns: 1fr;
    }

    body .agency-initial-block{
        display: block;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_coordonees_agence,
    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_image{
        width: 100%;
    }

    body .agency-specialty-strip{
        margin: -26px 0 46px;
    }

    body .agency-specialty-strip__inner{
        align-items: start;
        grid-template-columns: 1fr;
    }

    body .agency-specialty-strip__actions{
        justify-content: flex-start;
    }

    body .agency-hero{
        padding: 30px;
    }

    body .agency-hero__media,
    body .agency-hero__media img{
        min-height: 300px;
    }

    body .agency-map-heading{
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 640px){
    body.single-agences_servagroupe{
        padding-bottom: 72px;
    }

    body .agency-single-v2 h1{
        font-size: 2rem;
    }

    body .agency-single-v2 h2{
        font-size: 1.45rem;
    }

    body .agency-hero{
        gap: 22px;
        padding: 24px 18px;
    }

    body .agency-hero__media,
    body .agency-hero__media img{
        min-height: 220px;
    }

    body .agency-hero__actions,
    body .agency-btn{
        width: 100%;
    }

    body .agency-contact-card,
    body .agency-support-card,
    body .agency-empty-state{
        padding: 18px;
    }

    body .agency-about,
    body .agency-offers,
    body .agency-faq{
        padding: 26px 18px;
    }

    body .agency-map-heading{
        gap: 14px;
    }

    body .agency-map-section .agency-map{
        height: 300px;
    }

    body .agency-contact-line,
    body .agency-hours li{
        grid-template-columns: 1fr;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit,
    body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit.info_agence_marge{
        margin-right: 0;
        width: 100%;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-contact-unit--email .email a{
        white-space: normal;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-contact-note{
        margin-left: 0;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-inline-cta{
        margin-left: 0;
    }

    body .agency-specialty-strip{
        margin: -18px 0 38px;
    }

    body .agency-specialty-strip__inner{
        gap: 14px;
        padding: 16px;
    }

    body .agency-specialty-strip h2{
        font-size: 1.025rem;
    }

    body .agency-specialty-strip p{
        font-size: .85rem;
        line-height: 1.5;
    }

    body .agency-specialty-strip__actions{
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    body .agency-specialty-strip__actions a{
        min-width: 0;
        width: 100%;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-list{
        gap: 18px;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-row{
        padding-bottom: 16px;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-grid,
    body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours li{
        grid-template-columns: 1fr;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-hero-contact-row--email .agency-hero-contact-content p a{
        font-size: .8125rem;
        white-space: nowrap;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours{
        gap: 7px;
    }

    body.single-agences_servagroupe #content #inner-content #main .agency-hero-hours__slots{
        gap: 2px;
    }

    body .agency-before-footer-note{
        margin: 20px auto 0;
        padding: 0 18px;
    }

    body.single-agences_servagroupe #content #inner-content.wpbf-container{
        padding-bottom: 24px;
    }

    body .agency-mobile-actions{
        background: #fff;
        border-top: 1px solid #e3ebe8;
        bottom: 0;
        box-shadow: 0 -8px 24px rgba(0,0,0,.12);
        display: grid;
        gap: 1px;
        grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
        left: 0;
        position: fixed;
        right: 0;
        z-index: 2200;
    }

    body .agency-mobile-actions a{
        align-items: center;
        background: #0c6c4f;
        color: #fff;
        display: flex;
        font-size: .875rem;
        font-weight: 700;
        justify-content: center;
        min-height: 58px;
        text-decoration: none;
    }

    body .agency-mobile-actions a:nth-child(2){
        background: #9a1920;
    }

    /* La barre d'actions mobile fixe (z-index 2200) recouvrait le bouton
       « retour en haut » (bottom 16px / z-index 1500), le rendant invisible et
       non cliquable sur les pages agence. On le remonte au-dessus de la barre. */
    body.single-agences_servagroupe .scrolltop{
        bottom: 74px;
        z-index: 2300;
    }
}

/* ============================================================
   REFONTE 2026 — Couche de modernisation page agence
   Scopée aux classes .agency-* / hero. ADN conservé.
   Objectif : profondeur, douceur, mouvement (moins rigide).
   ============================================================ */

/* Hero — colonne info en carte élevée */
body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_coordonees_agence{
    background: linear-gradient(180deg,#ffffff 0%, var(--sg-paper) 100%);
    border: 1px solid var(--sg-line);
    border-radius: var(--sg-radius-lg);
    box-shadow: var(--sg-shadow);
    padding: 34px 34px 30px;
}

/* Zone de sécurité à droite (desktop) : le contenu de la carte doit s'arrêter
   AVANT la partie recouverte par la photo (overlap de -4%), sinon des mots comme
   « demande » passent sous l'image. Placé ici, APRÈS le padding de base, pour ne
   pas être écrasé par le raccourci `padding`. */
@media (min-width: 1141px){
    body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_coordonees_agence{
        padding-right: 7%;
    }
}

/* Hero — photo arrondie */
body.single-agences_servagroupe #content #inner-content #main .agency-initial-block .bloc_image{
    border-radius: var(--sg-radius-lg);
    box-shadow: var(--sg-shadow);
    display: flex;
}

body.single-agences_servagroupe #content #inner-content #main .bloc_image img{
    border-radius: var(--sg-radius-lg);
    height: 100%;
    object-fit: cover;
    width: 100%;
}

/* Hero — panneau de marque quand aucune photo n'est renseignée */
body .bloc_image__fallback{
    align-items: flex-end;
    background:
        radial-gradient(120% 90% at 85% 12%, rgba(56,185,159,.55) 0%, rgba(56,185,159,0) 55%),
        linear-gradient(150deg, var(--sg-green-600) 0%, var(--sg-green-800) 60%, var(--sg-green-900) 100%);
    border-radius: var(--sg-radius-lg);
    display: flex;
    min-height: 320px;
    overflow: hidden;
    padding: 34px;
    position: relative;
    width: 100%;
}

body .bloc_image__fallback::before{
    background-image: radial-gradient(rgba(255,255,255,.22) 2px, transparent 2px);
    background-size: 22px 22px;
    content: "";
    height: 150px;
    opacity: .6;
    position: absolute;
    right: 26px;
    top: 26px;
    width: 150px;
}

body .bloc_image__fallback::after{
    border-left: 26px solid transparent;
    border-right: 26px solid transparent;
    border-top: 38px solid var(--sg-mint-400);
    bottom: 30px;
    content: "";
    opacity: .9;
    position: absolute;
    right: 40px;
}

body .bloc_image__mark{
    color: #fff;
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.12;
    position: relative;
    text-shadow: 0 2px 18px rgba(0,0,0,.18);
}

body .bloc_image__mark::after{
    background: var(--sg-mint-400);
    content: "";
    display: block;
    height: 4px;
    margin-top: 14px;
    width: 54px;
}

/* Eyebrow raffiné — barre menthe + tracking (moins scolaire) */
body .agency-eyebrow{
    align-items: center;
    display: inline-flex;
    gap: 10px;
    letter-spacing: .08em;
}

body .agency-eyebrow::before{
    background: var(--sg-mint-400);
    border-radius: 2px;
    content: "";
    display: inline-block;
    height: 3px;
    width: 22px;
}

/* Cartes — arrondi + ombre douce + survol qui soulève */
body .agency-contact-card,
body .agency-support-card,
body .agency-empty-state,
body .agency-nearby-card{
    border: 1px solid var(--sg-line);
    border-radius: var(--sg-radius);
    box-shadow: var(--sg-shadow-sm);
    transition: border-color .25s var(--sg-ease), box-shadow .25s var(--sg-ease), transform .25s var(--sg-ease);
}

body .agency-support-card:hover,
body .agency-nearby-card:hover{
    border-color: var(--sg-mint-400);
    box-shadow: var(--sg-shadow-lg);
    transform: translateY(-4px);
}

/* Icône de carte — pastille arrondie dégradée */
body .agency-support-card__icon{
    background: linear-gradient(135deg, var(--sg-mint-400) 0%, var(--sg-green-600) 100%);
    border-radius: 12px;
    box-shadow: 0 8px 18px rgba(12,108,79,.28);
    height: 44px;
    width: 44px;
}

/* Panneaux de section — grand arrondi + fond plus doux */
body .agency-about,
body .agency-offers,
body .agency-faq{
    background: linear-gradient(180deg,#ffffff 0%, var(--sg-paper) 100%);
    border: 1px solid rgba(12,108,79,.08);
    border-radius: var(--sg-radius-lg);
    box-shadow: var(--sg-shadow-sm);
}

/* Section « En quelques mots » : sans cadre de fond (panneau retiré). */
body .agency-about{
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
}

/* Boutons en pilule + dégradé sur le primaire */
body .agency-btn{
    border-radius: 999px;
    transition: background .22s var(--sg-ease), border-color .22s var(--sg-ease), color .22s var(--sg-ease), transform .22s var(--sg-ease), box-shadow .22s var(--sg-ease);
}

body .agency-btn--primary{
    background: linear-gradient(135deg, var(--sg-mint-400) 0%, var(--sg-green-600) 100%);
    box-shadow: 0 10px 22px rgba(12,108,79,.24);
}

body .agency-btn:hover{
    transform: translateY(-2px);
}

body .agency-specialty-strip__actions a{
    border-radius: 999px;
}

/* Bandeau pôle spécialisé — arrondi + léger dégradé */
body .agency-specialty-strip{
    background: linear-gradient(135deg, var(--sg-red) 0%, var(--sg-red-700) 100%);
    border-radius: var(--sg-radius);
}

/* Cartes offres dans la page agence — arrondi + survol */
body .agency-offers__grid .offer-item{
    border-radius: var(--sg-radius);
    overflow: hidden;
    transition: box-shadow .25s var(--sg-ease), transform .25s var(--sg-ease);
}

body .agency-offers__grid .offer-item:hover{
    box-shadow: var(--sg-shadow-lg);
    transform: translateY(-4px);
}

/* FAQ — survol du résumé */
body .agency-faq summary{
    transition: color .2s var(--sg-ease);
}

body .agency-faq summary:hover{
    color: var(--sg-mint-400);
}

/* Carte Google — arrondi (et son éventuel message d'erreur) */
body .agency-map-section .agency-map{
    border-radius: var(--sg-radius-lg);
    box-shadow: var(--sg-shadow-sm);
    overflow: hidden;
}

/* Mouvement d'entrée discret — progressif, sans JS, respect reduced-motion */
@media (prefers-reduced-motion: no-preference){
    @supports (animation-timeline: view()){
        body .agency-section,
        body .agency-specialty-strip,
        body .agency-map-section{
            animation: sgFadeUp linear both;
            animation-timeline: view();
            animation-range: entry 0% cover 20%;
        }

        @keyframes sgFadeUp{
            from{ opacity: 0; transform: translateY(26px); }
            to{ opacity: 1; transform: translateY(0); }
        }
    }
}

/* — Bouton retour haut de page — */
body .scrolltop{
    border-radius: 999px;
    box-shadow: var(--sg-shadow);
    transition: transform .2s var(--sg-ease), box-shadow .2s var(--sg-ease);
}

body .scrolltop:hover{
    box-shadow: var(--sg-shadow-lg);
    transform: translateY(-2px);
}
