@charset "UTF-8";/* ==========================================================================
   Hepareg - responsive.css
   Ajustements tablette / mobile.
   NB : ce fichier est charge AVANT hepareg.css et template.css (ordre T4).
   Les selecteurs sont donc prefixes par "html body" pour l'emporter
   a specificite egale, et !important est conserve quand l'original l'utilise.
   ========================================================================== */


/* --------------------------------------------------------------------------
   Tablette et moins (< 992px)
   -------------------------------------------------------------------------- */
@media (max-width: 991.98px) {

    /* Header / footer : marges laterales desktop (100px) */
    html body .t4-header-inner {padding-left: 20px; padding-right: 20px;}
    html body:not(.hepa-hp) .t4-footer.hepa-footer-section .module-inner {padding: 60px 30px !important;}

    /* Fonds fixes : non supportes sur iOS, zones vides sur mobile */
    html body .axe-objectif-ctn,
    html body .axe-telecommande-ctn,
    html body .axe-publications-ctn {background-attachment: scroll;}

    /* Modale des axes (padding 240px) */
    html body .hepa-axes-boots-modal .modal-dialog {padding: 0 20px !important;}
    html body .hepa-t4-popup img {max-width: 100% !important; height: auto;}

    html body .hepa-axes-encadre {margin: 30px 20px 40px 20px; padding: 35px;}
    html body .axes-aplat-ctn.axe-axes-ctn .hepa-axes-item {margin: 0 15px;}

    /* Cartes equipes (accueil + page Equipes) : liste d'infos en largeur auto */
    html body .hepa-project-cat-pg .axes-listinfo-mod,
    html body .hepa-art-cat-hp-mod .axes-listinfo-mod {width: auto; left: 0; right: 0; padding-right: 0; padding-left: 0;}
    html body .hepa-project-cat-pg .items-intro {margin-left: 0; margin-right: 0;}
}


/* --------------------------------------------------------------------------
   Mobile (< 768px)
   -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {

    /* Filet de securite contre le scroll horizontal (clip ne casse pas sticky) */
    html, html body {overflow-x: clip;}
    html body .t4-main-body {overflow-wrap: break-word;}

    /* ---- Typographie ---- */
    html body h1, html body .h1 {font-size: 28px;}
    html body h2, html body .h2 {font-size: 26px;}
    html body h3, html body .h3 {font-size: 22px;}
    html body h4, html body .h4 {font-size: 19px;}
    html body .hepa-42, html body .hepa-48, html body .hepa-56,
    html body .hepa-64, html body .hepa-72 {font-size: 30px;}
    html body .hepa-36 {font-size: 26px;}
    html body .hepa-32 {font-size: 24px;}
    html body .hepa-28 {font-size: 22px;}
    html body .hepa-mea {font-size: 17px; padding: 20px; margin: 25px 0;}

    /* ---- Espacements utilitaires trop grands ---- */
    html body .hepa-pt-240, html body .hepa-ptb-240 {padding-top: 80px !important;}
    html body .hepa-pb-240, html body .hepa-ptb-240 {padding-bottom: 80px !important;}
    html body .hepa-pt-120, html body .hepa-ptb-120 {padding-top: 60px !important;}
    html body .hepa-pb-120, html body .hepa-ptb-120 {padding-bottom: 60px !important;}
    html body .hepa-mt-240, html body .hepa-mtb-240 {margin-top: 80px !important;}
    html body .hepa-mb-240, html body .hepa-mtb-240 {margin-bottom: 80px !important;}
    html body .hepa-mt-120, html body .hepa-mtb-120 {margin-top: 60px !important;}
    html body .hepa-mb-120, html body .hepa-mtb-120 {margin-bottom: 60px !important;}

    /* ---- Header ---- */
    html body .navbar-brand img.logo-img {max-height: 64px;}
    html body .t4-topbar-right .mod-languages {margin-left: 15px;}

    /* ---- Accueil : hero sous le header ---- */
    html body .acm-hero.style-1 {padding-top: 130px;}

    /* ---- Accueil : cartes equipes ---- */
    html body .hepa-art-cat-hp-mod .mod-article-list .article-content {padding: 25px !important;}
    html body .hepa-art-cat-hp-mod .axes-listinfo-mod {bottom: 20px;}
    html body .hepa-art-cat-hp-mod .top-articles-info {text-align: left;}
    html body .hepa-art-cat-hp-mod .owl-carousel .owl-item .intro-image img,
    html body .hepa-project-cat-pg .hepa-proj-item .item-image img {min-height: 480px; object-fit: cover;}
    html body .hepa-art-cat-hp-mod .axes-geoloc-item,
    html body .hepa-art-cat-hp-mod .axes-geoloc-adress,
    html body .hepa-project-cat-pg .axes-geoloc-item,
    html body .hepa-project-cat-pg .axes-geoloc-adress {font-size: 13px; line-height: 1.15rem;}
    html body .hepa-art-cat-hp-mod .article-content .axes-title-mod h3 {font-size: 15px;}

    /* ---- Footer ---- */
    html body .hepa-footer-link,
    html body .hepa-rgpd-link {flex-wrap: wrap; gap: 10px 20px;}
    html body .hepa-footer-link a,
    html body .hepa-rgpd-link a {margin-right: 0;}
    html body .hepa-footer-link {margin-top: 30px;}
    html body .hepa-logo-foot {max-width: 240px;}
    html body .hepa-footer-section .module-inner {padding-bottom: 130px !important;}
    html body .t4-section.t4-copyright .mod-footer {text-align: center;}
    html body .t4-section.t4-copyright {font-size: 12px;}

    /* ---- Pages equipes (axes) : debordements de la grille ---- */
    html body .t4-main-body > .row.com-content-article,
    html body .axe-telecommande-ctn.row,
    html body .axe-publications-ctn {margin-left: 0; margin-right: 0;}
    html body .axe-publications-ctn {padding: 30px 15px;}

    /* Telecommande : bandeau compact defilant horizontalement */
    html body .axe-telecommande-ctn-inner.container {
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 22px;
        padding: 10px 15px;
        overflow-x: auto;
        white-space: nowrap;
        font-size: 15px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    html body .axe-telecommande-ctn-inner.container::-webkit-scrollbar {display: none;}
    html body .axe-telecommande-item {flex: 0 0 auto; display: flex; align-items: center; max-height: none;}
    html body .item-tel-axes:before, html body .item-tel-expert:before,
    html body .item-tel-publi:before, html body .item-tel-team:before,
    html body .item-tel-partners:before {width: 24px; height: 24px; background-size: contain; vertical-align: middle;}

    /* Textes : justification -> alignement a gauche */
    html body .hepa-project-pg {font-size: 16px;}
    html body .hepa-project-pg .axe-longdesc,
    html body .hepa-project-pg .axe-objectif-item,
    html body .hepa-project-pg .hepa-axe-body,
    html body .hepa-project-pg .axe-axes-item-inner,
    html body .hepa-project-pg .hepa-axes-encadre,
    html body .hepa-project-pg .eb-container .eb-content {text-align: left; hyphens: auto;}
    html body .axe-objectif-item {column-count: 1;}
    html body .axe-objectif-inner {padding: 40px 0;}
    html body .axe-longdesc {margin-bottom: 60px;}

    html body .hepa-title-tools {margin-bottom: 40px;}
    html body .hepa-title-tools span {display: block; margin: 0 0 8px 0;}

    html body .hepa-4 .item-page .page-header h1,
    html body .hepa-4 .item-page .page-header h2 {font-size: 26px;}
    html body .hepa-4 .h2.axes-subh3-title {font-size: 22px;}

    /* Blocs axes / sous-axes */
    html body .axe-axes-ctn {padding-top: 40px;}
    html body .axe-axes-item,
    html body .col-md-3 .axe-axes-item {padding: 25px 20px 60px 20px;}
    html body .axe-axes-item:after,
    html body .col-md-3 .axe-axes-item:after {right: 25px; bottom: 15px;}
    html body .hepa-axe-body img,
    html body .hepa-axe-body .hepa-ctn-img img,
    html body .hepa-3 .hepa-axe-body .hepa-ctn-img img {max-width: 100%; margin-top: 30px;}
    html body .hepa-axes-encadre {margin: 25px 0; padding: 25px;}
    html body .axes-aplat-ctn.axe-axes-ctn .hepa-axes-item {margin: 0;}
    html body .hepa-sous-axes-ctn {padding-top: 80px;}
    html body .hepa-sous-axe-content {padding: 15px; border-width: 3px;}

    html body .hepa-team-intro-bloc h4 {min-height: 0;}
    html body .hepa-team-intro-bloc img {height: 200px;}

    html body .axe-equipe-item-ctn {margin-bottom: 30px;}
    html body .axe-partners-ctn.container-fluid {width: 100%;}
    html body .axe-partners-img {margin-bottom: 20px; padding: 10px;}

    /* ---- Page categorie Equipes ---- */
    html body .t4-main-body .hepa-project-cat-pg {padding-left: 15px; padding-right: 15px;}
    html body .hepa-project-cat-pg .hepa-proj-item .item-content {padding: 25px !important;}
    html body .hepa-project-cat-pg .axes-listinfo-mod {bottom: 20px;}
    html body .hepa-project-cat-pg .hepa-proj-item .page-header h2 {font-size: 18px; line-height: 1.3 !important; margin: 12px 0;}
    html body .hepa-project-cat-pg .hepa-proj-item .item-image img {min-height: 520px;}

    /* ---- Publications ---- */
    html body .hepa-mod-publi-item-inner,
    html body .hepa-publi-item-inner {padding: 0 10px;}
    html body .hepa-publi-item, html body .hepa-mod-publi-item {padding: 20px 0;}
    html body .hepa-publi-cat-pg .page-header.item-title {padding: 20px; font-size: 24px;}
    html body .publi-catpg-ctn .page-header h2 {font-size: 26px !important;}
    html body .hepa-publi-doi, html body .hepa-mod-publi-doi {overflow-wrap: anywhere;}

    /* ---- Actualites ---- */
    html body .view-category.hepa-actus-pg .items-intro .item-content {padding: 20px;}
    html body .hepa-actus-ctn .articles-readmore {margin-top: 20px;}

    /* ---- Pages A propos / mentions / plateformes / contact ---- */
    html body .box-color-purple {padding: 25px;}
    html body .hepa-legal-ctn .box-color-purple {margin-top: 30px; padding-bottom: 60px;}
    html body .hepa-plat-item-inner {padding: 20px;}
    html body .contactform-ctn .contact-information {padding: 20px;}

    /* ---- Titres longs : cesure propre au lieu d'une coupure en plein mot ---- */
    html body .page-header h1, html body .page-header h2 {-webkit-hyphens: auto; hyphens: auto; word-break: normal; overflow-wrap: break-word;}
    html body .item-page .page-header h2.hepa-prune {font-size: clamp(22px, 7.8vw, 36px);}
}

/* ---- Accessibilite : zone cliquable des liens de contact des membres (WCAG 2.2 : 24 px minimum) ---- */
html body .axe-equipe-links a {display: inline-flex; align-items: center; justify-content: center; min-width: 32px; min-height: 32px;}

/* ---- Menu mobile (off-canvas) : fond rose, texte prune, logo agrandi (demande agence 16/10/2026) ---- */
html body .t4-offcanvas,
html body .t4-offcanvas .t4-off-canvas-header,
html body .t4-offcanvas .t4-off-canvas-body,
html body .t4-offcanvas .t4-off-canvas-body .navbar,
html body .t4-offcanvas .t4-off-canvas-body .navbar .dropdown-menu {background-color: #ffcccc;}
html body .t4-offcanvas .t4-off-canvas-header {padding: 15px 20px 15px 24px; border-bottom: 1px solid rgba(97, 13, 61, 0.15);}
html body .t4-offcanvas .t4-off-canvas-header a img {max-height: none; height: 75px; width: auto;}
html body .t4-offcanvas .t4-off-canvas-body .navbar .nav-link,
html body .t4-offcanvas .t4-off-canvas-body .navbar .separator,
html body .t4-offcanvas .t4-off-canvas-body .navbar .dropdown-item,
html body .t4-offcanvas .t4-off-canvas-body .navbar .menu-item-title,
html body .t4-offcanvas .t4-off-canvas-body .navbar .sub-menu-back {color: #610d3d !important;}
html body .t4-offcanvas .t4-off-canvas-body .navbar .nav-link:hover,
html body .t4-offcanvas .t4-off-canvas-body .navbar .nav-link:focus,
html body .t4-offcanvas .t4-off-canvas-body .navbar .separator:hover,
html body .t4-offcanvas .t4-off-canvas-body .navbar .dropdown-item:hover,
html body .t4-offcanvas .t4-off-canvas-body .navbar .dropdown-item:focus {color: #610d3d !important; text-decoration: underline;}
/* Bouton de fermeture et chevrons des sous-menus */
html body .t4-offcanvas .t4-off-canvas-header .close {background-color: #610d3d;}
html body .t4-offcanvas .t4-off-canvas-header .close span {color: #ffcccc;}
html body .t4-offcanvas .t4-off-canvas-header .close:hover,
html body .t4-offcanvas .t4-off-canvas-header .close:focus {background-color: #4a0a2f;}
html body .t4-offcanvas .t4-off-canvas-body .navbar .btn-toggle {background-color: transparent; border: 1px solid #610d3d;}
html body .t4-offcanvas .t4-off-canvas-body .navbar .btn-toggle::after,
html body .t4-offcanvas .t4-off-canvas-body .navbar .btn-toggle.is-active::after {color: #610d3d;}
html body .t4-offcanvas .t4-off-canvas-body .navbar .btn-toggle:hover,
html body .t4-offcanvas .t4-off-canvas-body .navbar .btn-toggle:focus {background-color: #610d3d;}
html body .t4-offcanvas .t4-off-canvas-body .navbar .btn-toggle:hover::after,
html body .t4-offcanvas .t4-off-canvas-body .navbar .btn-toggle:focus::after {color: #ffcccc;}

/* ---- H1 SEO (16/10/2026) : les titres passes de H2 a H1 gardent exactement l'apparence des anciens H2 ---- */
/* Titre d'article (Plateformes, Mentions legales, equipes) */
html body .item-page .page-header h1[itemprop="headline"] {font-weight: 400; margin-top: 0; text-transform: none;}
html body .item-page .page-header h1[itemprop="headline"]:not(.hepa-prune) {margin-bottom: 7.5px;}
/* Titre de categorie (Projets, Publications) */
html body .page-subheader h1.page-subtitle {font-weight: 400; line-height: 1.733333;}
@media (max-width: 767.98px) {
    html body .item-page .page-header h1[itemprop="headline"] {font-size: 32px; line-height: 1.416667;}
    html body .item-page .page-header h1.hepa-prune[itemprop="headline"] {font-size: 24px; line-height: 1.416667; -webkit-hyphens: auto; hyphens: auto; word-break: normal; overflow-wrap: break-word;}
}
/* Titre de la page Offres d'emploi (article 44, ancien H3 dans le contenu) */
html body .contact-misc h1 {font-family: 'Candal', sans-serif; font-size: 28px; font-weight: 400; line-height: 1.416700; margin: 15px 0 7.5px; text-transform: none; letter-spacing: normal; color: #610d3d;}
@media (max-width: 767.98px) {
    html body .contact-misc h1 {font-size: 22px;}
}

/* =====================================================================
   Mobile, 2e passe (16/10/2026, retours agence sur Galaxy S24+ / 384 px)
   ===================================================================== */
@media (max-width: 991.98px) {
    /* Carrousel des equipes (accueil) : fleches masquees, points 2 x plus grands */
    html body .owl-carousel .owl-nav {display: none !important;}
    html body .owl-carousel .owl-dots .owl-dot {width: 16px; height: 16px; margin: 0 6px;}
    html body .owl-carousel .owl-dots .owl-dot:not(.active) {background-color: rgba(97, 13, 61, 0.3); border-color: transparent;}
    /* Bouton "Modifier" (utilisateurs connectes) : ne retrecit plus la colonne de contenu */
    html body .item-page .icons.float-end,
    html body .item-page .icons.float-right {float: none !important; display: flex; justify-content: flex-end; margin-bottom: 10px;}
}
@media (max-width: 767.98px) {
    /* Logos partenaires : la bordure basse de l'en-tete traversait les logos (qui chevauchent l'en-tete) */
    html body .t4-section.t4-hero {border-bottom: 0 !important;}
    /* Echelle typographique mobile des classes utilitaires du theme */
    html body .hepa-36, html body .hero-desc {font-size: 24px !important; line-height: 1.3 !important;}
    html body .hepa-28 {font-size: 20px !important; line-height: 1.5 !important;}
    html body .hepa-24 {font-size: 18px !important; line-height: 1.6 !important;}
    html body .hepa-20 {font-size: 16px !important; line-height: 1.6 !important;}
    html body .page-subheader .subheading-category {font-size: 22px;}
    /* Publications : couloir de texte elargi */
    html body .hepa-publi-cat-pg,
    html body .hepa-publi-cat-pg.item-content,
    html body .hepa-publi-cat-pg .item-content {padding-left: 0 !important; padding-right: 0 !important;}
    html body .hepa-publi-cat-pg [id^="rlta-panel-"] {padding-left: 12px !important; padding-right: 12px !important;}
    html body .hepa-publi-cat-pg [id^="rlta-panel-"] > div {padding-left: 0 !important; padding-right: 0 !important;}
    html body .hepa-publi-item-inner {padding-left: 0 !important; padding-right: 0 !important;}
}

/* Selecteur de langue dans le menu mobile (module 160, copie du module 154) */
html body .t4-offcanvas .mod-languages ul {display: flex; gap: 12px; margin: 0; padding: 10px 24px; list-style: none;}
html body .t4-offcanvas .mod-languages li {margin: 0; padding: 0;}
html body .t4-offcanvas .mod-languages a {display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-bottom: 2px solid transparent;}
html body .t4-offcanvas .mod-languages li.lang-active a {border-bottom-color: #610d3d;}
html body .t4-offcanvas .mod-languages img {width: 32px; height: auto;}

/* =====================================================================
   Mobile, 3e passe (19/10/2026, demandes agence)
   ===================================================================== */
@media (max-width: 991.98px) {
    /* Menu burger : libelles plus serres, niveau 1 en gras, sous-menus sans retrait */
    html body .t4-offcanvas .t4-off-canvas-body .navbar .nav-link,
    html body .t4-offcanvas .t4-off-canvas-body .navbar .separator,
    html body .t4-offcanvas .t4-off-canvas-body .navbar .dropdown-item,
    html body .t4-offcanvas .t4-off-canvas-body .navbar .menu-item-title {line-height: 1.4rem;}
    html body .t4-offcanvas .t4-off-canvas-body .navbar .navbar-nav > .nav-item > .nav-link,
    html body .t4-offcanvas .t4-off-canvas-body .navbar .navbar-nav > .nav-item > .separator {font-weight: 700;}
    html body .t4-offcanvas .t4-off-canvas-body .navbar .nav-item.parent .dropdown-menu .nav-item {padding-left: 0;}
    /* Barre LinkedIn / Intranet / langues clonee en haut du burger (hepareg.js) */
    html body .t4-offcanvas .hepa-oc-topbar {display: flex; align-items: center; justify-content: space-between; background-color: #610d3d; padding: 6px 24px;}
    html body .t4-offcanvas .hepa-oc-topbar .social-follow {gap: 6px;}
    html body .t4-offcanvas .hepa-oc-topbar .social-inner a {display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; color: #ffcccc; font-size: 20px;}
    html body .t4-offcanvas .hepa-oc-topbar .mod-languages ul {display: flex; gap: 4px; margin: 0; padding: 0; list-style: none;}
    html body .t4-offcanvas .hepa-oc-topbar .mod-languages li {margin: 0; padding: 0;}
    html body .t4-offcanvas .hepa-oc-topbar .mod-languages a {display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px;}
    html body .t4-offcanvas .hepa-oc-topbar .mod-languages img {width: 22px; height: auto;}
    /* Ancienne copie du selecteur de langue sous le menu (module 160) : remplacee par la barre ci-dessus */
    html body .t4-offcanvas #Mod160 {display: none;}
    /* Footer : la section copyright remonte de 106 px sur le footer (texte rose sur fond prune) ;
       on laisse plus d'espace sous les liens pour que sa bordure ne passe plus sur le dernier lien */
    html body .t4-section.t4-footer .t4-module {padding-bottom: 76px;}
}
@media (max-width: 767.98px) {
    /* Plateformes et CHB : espacement superflu */
    html body .hepa-platformes-header.hepa-pt-60 {padding-top: 0 !important;}
    html body .hepa-platformes-ctn-inner.hepa-pt-60 {padding-top: 20px !important;}
    html body .hepa-platformes-ctn-inner.hepa-pb-60 {padding-bottom: 30px !important;}
    /* Pages projets (equipes) */
    html body .hepa-header-lead {font-size: 14px;}
    html body span.axes-geoloc-bat, html body span.axes-geoloc-mod {font-size: 14px; line-height: 1.4rem;}
    html body .axes-groupe1 .col-lg-9 {padding-right: 0; padding-left: 0;}
    html body .hepa-axe-body ul {padding-left: 20px;}
    html body span.hepa-teamcount {display: block;}
    html body h5.hepa-prune.axe-equipe-name,
    html body .axe-equipe-item-ctn .axe-equipe-item h5.hepa-prune.axe-equipe-name {font-size: 16px;}
    html body .axe-equipe-item-content {padding: 12px !important;}
    html body .axe-equipe-poste,
    html body .axe-equipe-item-ctn .axe-equipe-item .axe-equipe-poste {font-size: 14px; line-height: 1.4rem;}
    html body .axe-equipe-item {border-radius: 15px !important;}
    html body .axe-equipe-item img {border-top-right-radius: 15px; border-top-left-radius: 15px;}
    /* Publications : titre de bloc */
    html body h3.hepa-publi-catpg-Gentitle.hepa-prune {font-size: 18px;}
}

/* Menu "Contact" (menu 320, page Offres d'emploi) : affiche dans le burger uniquement, masque dans le menu desktop */
@media (min-width: 992px) {
    html body .t4-header .nav-item.item-320,
    html body .t4-header .t4-megamenu .nav-item[data-id="320"] {display: none;}
}

/* Offres d'emploi / Contact and Job Opportunities : formulaire detache du texte quand les colonnes sont empilees */
@media (max-width: 991.98px) {
    html body .contactform-ctn > .contact-form {margin-top: 40px;}
}

/* Publications - Equipe 1 (menu 321) : titres d'annee en double (h2 hors accordeon) masques, toutes largeurs */
html body.item-321 .hepa-publi-cat-pg .page-header > h2[itemprop="headline"] {display: none;}