/* =================================
   "Nos métiers" — WPBakery
   .nos-metiers-row + .metier-title
   ================================= */

/* Layout des colonnes */
.page-id-819 .nos-metiers-row .row {
    display: flex;
    flex-wrap: wrap;
}

.page-id-819 .nos-metiers-row section {
    padding-top: 0 !important;
}

.page-id-819 .nos-metiers-row .row > .wpb_column {
    flex: 1 1 0;
    min-width: 280px;
}

/* Wrapper interne = ancienne .serv-item-inner */
.page-id-819 .nos-metiers-row .row > .wpb_column .vc_column-inner {
    height: 100%;
}

.page-id-819 .nos-metiers-row .row > .wpb_column .wpb_wrapper {
    position: relative;
    overflow: hidden; /* pour que le bandeau ne déborde pas trop */
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: transform .28s cubic-bezier(.22,.61,.36,1);
}

/* Effet léger de translation sur la carte */
.page-id-819 .nos-metiers-row .row > .wpb_column:hover .wpb_wrapper {
    transform: translateY(-2px);
}

/* Image principale (photo) */
.page-id-819 .nos-metiers-row .wpb_single_image img {
    display:block;
    width:100%;
    height:auto;
    margin:0;
    border:0;
    border-radius:0 !important;
}

/* Logos : on cible la 2e image de la colonne (logo Sedri) */
.page-id-819 .nos-metiers-row .wpb_wrapper .wpb_single_image:last-of-type img {
    width: 220px;     /* même largeur pour tous les logos */
    height: auto;
    max-width: 100%;
    display: block;
    margin: 22px auto 0;  /* espace au-dessus du logo */
}

/* Bandeau titre (sur l'image, sans débord vers le bas) */
.page-id-819 .nos-metiers-row .metier-title {
    position: relative;               /* reste dans le flux */
    background: rgba(0,0,0,.45);      /* noir transparent */
    color:#fff;
    text-align:center;
    padding:14px 12px;

    /* Hauteur fixe : le titre peut aller sur 1 ou 2 lignes,
       le bloc reste à 70px */
    height: 70px;
    display:flex;
    align-items:center;
    justify-content:center;

    /* On remonte exactement de la même hauteur :
       le bandeau recouvre le bas de l'image, sans dépasser dessous */
    margin: -70px 0 12px;

    z-index: 2;
    transform: translateY(0);
    transition: transform .55s cubic-bezier(.25,.8,.25,1),
                background .35s ease;
    will-change: transform, background;
}

/* Texte interne du bandeau */
.page-id-819 .nos-metiers-row .metier-title p {
    margin:0;
    padding:0;
    font-weight:700;
    font-size:18px;
    letter-spacing:.4px;
    text-transform:uppercase;
    color:#fff;
    text-decoration:none;
}

/* Hover : bandeau qui remonte + fond bleu */
.page-id-819 .nos-metiers-row .row > .wpb_column:hover .metier-title {
    transform: translateY(-35%);
    background: rgba(0,47,134,.45);  /* bleu transparent */
}

/* Responsif */
@media (max-width:640px){

    /* +++ Seul ajout : espace entre les cartes + dernière sans marge +++ */
    .page-id-819 .nos-metiers-row .row > .wpb_column {
        margin-bottom: 40px;   /* espace vertical entre les wrappers */
    }
    .page-id-819 .nos-metiers-row .row > .wpb_column:last-child {
        margin-bottom: 0;
    }

    .page-id-819 .nos-metiers-row .metier-title {
        padding:12px 10px;
        height: 60px;
        margin: -60px 0 10px;
    }

    .page-id-819 .nos-metiers-row .row > .wpb_column:hover .metier-title {
        transform: translateY(-20%);
    }
}


/* =================================
   Nos métiers – pages 2367 & 2366
   Grille basée sur .services-main-holder
   ================================= */

/* Layout global de la grille */
.page-id-2367 .services-main-holder .services-holder,
.page-id-2366 .services-main-holder .services-holder {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
}

.page-id-2367 .services-main-holder .serv-item,
.page-id-2366 .services-main-holder .serv-item {
    flex: 1 1 0;
    min-width: 280px;
    text-decoration: none;
}

/* Carte interne */
.page-id-2367 .services-main-holder .serv-item-inner,
.page-id-2366 .services-main-holder .serv-item-inner {
    position: relative;
    overflow: hidden;
    background: transparent;
    transition: transform .28s cubic-bezier(.22,.61,.36,1);
}

/* Effet léger de translation au survol */
.page-id-2367 .services-main-holder .serv-item:hover .serv-item-inner,
.page-id-2366 .services-main-holder .serv-item:hover .serv-item-inner {
    transform: translateY(-2px);
}

/* Image de métier */
.page-id-2367 .services-main-holder .services-thumb,
.page-id-2366 .services-main-holder .services-thumb {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0;
}

/* Neutralisation des overlays natifs */
.page-id-2367 .services-main-holder .serv-item-inner::before,
.page-id-2367 .services-main-holder .ser-title h3::before,
.page-id-2366 .services-main-holder .serv-item-inner::before,
.page-id-2366 .services-main-holder .ser-title h3::before {
    content: none !important;
    display: none !important;
}

/* ===========================
   BANDEAU SUR L'IMAGE (TITRE)
   =========================== */

.page-id-2367 .services-main-holder .ser-title,
.page-id-2366 .services-main-holder .ser-title {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    background: rgba(0,0,0,.45);   /* noir transparent */
    padding: 14px 12px;
    text-align: center;

    transform: translateY(0);
    transition: transform .55s cubic-bezier(.25,.8,.25,1),
                background .35s ease;
    will-change: transform, background;
    z-index: 2;
}

/* Texte du bandeau */
.page-id-2367 .services-main-holder .ser-title h3,
.page-id-2366 .services-main-holder .ser-title h3 {
    margin: 0;
    padding: 0;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #fff;
}

/* Hover : bandeau qui remonte + passe en bleu */
.page-id-2367 .services-main-holder .serv-item:hover .ser-title,
.page-id-2366 .services-main-holder .serv-item:hover .ser-title {
    transform: translateY(-35%);
    background: rgba(0,47,134,.45);
}

/* ===========================
   RESPONSIVE
   =========================== */

@media (max-width: 640px) {

    .page-id-2367 .services-main-holder .services-holder,
    .page-id-2366 .services-main-holder .services-holder {
        gap: 18px;
    }

    .page-id-2367 .services-main-holder .ser-title,
    .page-id-2366 .services-main-holder .ser-title {
        padding: 12px 10px;
    }

    .page-id-2367 .services-main-holder .serv-item:hover .ser-title,
    .page-id-2366 .services-main-holder .serv-item:hover .ser-title {
        transform: translateY(-20%);
    }
}

/* ===========================
   LISTES TYPOGRAPHIE
   =========================== */

.page-id-1936 .content .text-intro-2 .wpb_wrapper ul,
.page-id-2366 .content .text-intro-2 .wpb_wrapper ul {
  font-size: 18px;
}

.page-id-2367 .serv-details ul li,
.page-id-2366 .serv-details ul li {
    font-size: 18px !important;
    line-height: 1.45;
}



/*=================
Page RSE 
=================== */
.page-id-2634 .content .wpb_wrapper .section-title {
  margin-bottom: 0;
  font-size: 30px;
}
.page-id-2634 .content .wpb_wrapper ul {
  font-size: 18px;
}

.page-id-2634 #sec2 > section {
  padding-bottom: 0;
}
 .page-id-2634 .vc_custom_1765458419012 > section, .page-id-2634 .vc_custom_1764946718690 > section {
    padding-top: 0;
 }

/* .page-id-2634 #chiffres .wpb_wrapper .inline-facts .num {
  font-size: 60px;
} */

.page-id-1936 #sec-grid-skills-4 > section, .page-id-2366 #sec-grid-skills-4 > section, .page-id-2367 #sec-grid-skills-4 > section {
    padding-top: 0;
}
#services-classe > section {
  padding: 0 !important;
}

.page-id-2634 .vc_custom_1765560585884 > section {
    padding-bottom: 0;
}