/*
Theme Name: OneRH Child
Theme URI: https://www.onerh.digital-3magroup.com
Description: Thème enfant Hello Elementor pour le site OneRH — intégration 3MA Group.
Author: 3MA Group
Author URI: https://www.3magroup.com
Template: hello-elementor
Version: 2.0.1
Text Domain: onerh-child
*/

/* Charte : source unique = kit Elementor (Réglages du site → Couleurs/Polices), seedé par
   inc/elementor-kit-sync.php. Ci-dessous des alias ; fallbacks = maquettes XD. */

:root {
  --onerh-primary: var(--e-global-color-primary, #1c0d40);
  --onerh-secondary: var(--e-global-color-secondary, #00aeb2);
  --onerh-text: var(--e-global-color-text, #1e1e1e);
  --onerh-accent: var(--e-global-color-accent, #ffe495);
  --onerh-primary-light: var(--e-global-color-onerhviolet2, #3f2975);
  --onerh-primary-deep: var(--e-global-color-onerhvioletd, #271355);
  --onerh-teal-light: var(--e-global-color-onerhteall, #7cd6d8);
  --onerh-text-muted: var(--e-global-color-onerhmuted, #707070);
  --onerh-bg-alt: var(--e-global-color-onerhbgalt, #f4f7fb);
  --onerh-bg: var(--e-global-color-onerhwhite, #ffffff);

  --onerh-font: var(--e-global-typography-text-font-family, "Inter Tight"), sans-serif;

  /* Survol des liens. Pas un alias du kit : la charte ne prévoit pas de couleur de lien. C'est le
     secondaire #00aeb2 assombri — 2,7:1 sur blanc devient 5,4:1. Jaune #ffe495 écarté : 1,25:1. */
  --onerh-link-hover: #00767a;
}

body {
  font-family: var(--onerh-font);
}

/* ===== Liens de contenu — contrat unique. Le soulignement seul identifie le lien au repos
   (WCAG 1.4.1) ; la couleur n'intervient qu'au survol et au focus. Boutons et cartes exclus. ===== */
.entry-content a,
.elementor-widget-theme-post-content a,
.elementor-widget-text-editor a {
  /* Explicite, sinon le lien prend la couleur du kit ou le rose #CC3366 d'Hello Elementor. */
  color: inherit;
  text-decoration: underline;
  /* Fin et décalé : un soulignement collé au texte coupe les jambages et
     dégrade la lisibilité de ce qu'il est censé signaler. */
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  transition: color 0.15s ease;
}

/* Le soulignement n'est jamais retiré au survol : seul le trait s'épaissit. */
.entry-content a:hover,
.elementor-widget-theme-post-content a:hover,
.elementor-widget-text-editor a:hover {
  color: var(--onerh-link-hover);
  text-decoration-thickness: 2px;
}

/* Focus clavier : même signal que la souris, Hello Elementor ne stylisant pas le focus des liens.
   `currentColor` reprend le teal posé juste au-dessus. */
.entry-content a:focus-visible,
.elementor-widget-theme-post-content a:focus-visible,
.elementor-widget-text-editor a:focus-visible {
  color: var(--onerh-link-hover);
  outline: 2px solid currentColor;
  outline-offset: 2px;
  border-radius: 2px;
}

/* Exceptions : liens que leur forme identifie déjà (bouton, pilule, trait détaché). `:where()`
   garde la spécificité à zéro, sans concurrence avec les habillages définis plus bas. */
.entry-content a:where(.wp-block-button__link, .wp-element-button, .elementor-button, .link-underline),
.elementor-widget-theme-post-content a:where(.wp-block-button__link, .wp-element-button, .elementor-button, .link-underline),
.elementor-widget-text-editor a:where(.wp-block-button__link, .wp-element-button, .elementor-button, .link-underline) {
  text-decoration: none;
}

/* ===== Utilitaires — seule famille de classes autorisée. Une classe décrit un EFFET, jamais une
   page ni une marque. Avant d'en ajouter : vérifier le kit, puis les réglages du bloc. ===== */

/* Largeur ajustée au contenu (au lieu d'occuper toute la ligne). */
.fit-content {
  width: fit-content;
}

/* Annule une largeur imposée ailleurs. Sans effet sur un élément qui n'en a aucune. */
.w-auto {
  width: auto;
}

/* Aligne titres et boutons entre cartes voisines. À poser sur les ENFANTS d'une grille. */
.subgrid-rows {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
}

/* Lien souligné par une bordure (trait détaché du texte, contrairement à
   text-decoration) — utilisé pour les liens de fin de bloc. */
.link-underline a,
a.link-underline {
  border-bottom: 1px solid currentColor;
  padding-bottom: 5px;
  text-decoration: none;
}

/* Masque le bas d'un visuel qui déborde. Le conteneur doit être en position relative. */
.band-bottom {
  position: relative;
}

/* `dvh` et non `vh` : `vh` se calcule barre d'adresse dépliée, et découvre le visuel au défilement. */
.band-bottom::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 22dvh;
  background: var(--e-global-color-onerhwhite, #fff);
  z-index: 1;
}

/* ===== CSS de dernier recours. Ne subsistent ici que les cas hors de portée d'un réglage de
   widget : HTML dynamique et garde-fous. Sélecteurs natifs Elementor uniquement. ===== */

/* ===== Dimensions fluides : `clamp()` partout. Pour du TEXTE la borne mini est en `rem`, jamais
   en `px` ni `vw` pur (zoom, WCAG 1.4.4). Pour les hauteurs d'écran : `dvh`, pas `vh`. ===== */

/* Corps d'article (119 articles migrés + cas clients) : colonne de lecture, H2 teal thin, H3
   courant. `min()` plutôt qu'une largeur fixe : plafonné à 760 px, fluide en dessous. */
.elementor-widget-theme-post-content {
  max-width: min(760px, 100%);
  margin-inline: auto;
}

.elementor-widget-theme-post-content h2 {
  color: var(--e-global-color-secondary, #00aeb2);
  font-weight: 300;
  font-size: clamp(1.5rem, 4vw, 2.75rem);
  line-height: 1.15;
  margin: clamp(2rem, 5vw, 3rem) 0 1.25rem;
}

.elementor-widget-theme-post-content h3 {
  margin: 32px 0 12px;
}

/* Fiches de formation : rythme resserré. Dix sections dont plusieurs de deux lignes laissent la
   page trouée avec l'espacement du blog. `single-formation` est posée par WordPress lui-même. */
body.single-formation .elementor-widget-theme-post-content h2 {
  margin-top: 0;
  margin-bottom: 12px;
}

/* Même raison pour les H3 : dans une fiche, un H3 coiffe une liste de trois lignes. */
body.single-formation .orh-contenu-publication h3 {
  margin: 0.5em 0 0.6em;
}

/* Idem pour les items : une fiche énumère des objectifs d'une ligne, pas des paragraphes. */
body.single-formation .orh-contenu-publication li {
  margin-bottom: 0.3em;
}

.elementor-widget-theme-post-content img {
  border-radius: 16px;
  height: auto;
}

/* Remplacé par le contrat de lien unique en tête de fichier. La couleur
   #00aeb2 mesure 2,7:1 sur blanc — le lien se voyait mais ne se lisait pas — et
   le soulignement réservé au survol ne signalait rien sur mobile. La reprise du
   rose #CC3366 d'Hello Elementor reste assurée : le nouveau bloc couvre les
   mêmes sélecteurs.

.entry-content a,
.elementor-widget-theme-post-content a {
  color: var(--e-global-color-secondary, #00aeb2);
  text-decoration: none;
}

.entry-content a:hover,
.elementor-widget-theme-post-content a:hover {
  text-decoration: underline;
}
*/

/* Boutons Gutenberg des articles migrés : gris ardoise #32373C par défaut, et aucun réglage de
   widget ne les atteint — le corps de l'article est rendu dynamiquement. */
.elementor-widget-theme-post-content .wp-block-button__link,
.elementor-widget-theme-post-content .wp-element-button {
  background-color: var(--e-global-color-secondary, #00aeb2);
  color: var(--e-global-color-primary, #1c0d40);
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
}

.elementor-widget-theme-post-content .wp-block-button__link:hover,
.elementor-widget-theme-post-content .wp-element-button:hover {
  background-color: var(--e-global-color-accent, #ffe495);
  text-decoration: none;
}

/* Illustrations vectorielles sans dimensions dans le HTML importé : sans contrainte,
   elles s'étirent à toute la largeur de la colonne (mesuré : une icône à 1120 px). */
.elementor-widget-theme-post-content svg:not([width]):not([height]) {
  max-width: 96px;
  height: auto;
}

/* Largeurs figées héritées de l'ancien site : empêchent l'image de se réduire sur
   mobile et provoquent un débordement horizontal. */
.elementor-widget-theme-post-content img[width],
.elementor-widget-theme-post-content figure {
  max-width: 100%;
}

/* ===== Habillage de widgets, mutualisé (remplace le « CSS personnalisé » recopié jusqu'à 8 fois
   en base). ⚠ Vérifier la portée : `.elementor-widget-*` touche TOUS les widgets du type. ===== */

/* Grilles d'articles (« Pour aller plus loin ») : cartes surélevées. La grille suit la largeur
   disponible (colonnes de 17 rem mini), donc 3/2/1 sans écrire un point de rupture. */
.elementor-widget-posts .elementor-posts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr));
  gap: clamp(1.25rem, 2.5vw, 2rem);
}

.elementor-widget-posts article {
  background: var(--e-global-color-onerhwhite, #fff);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(28, 13, 64, 0.08);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.elementor-widget-posts article:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(28, 13, 64, 0.14);
}

.elementor-widget-posts .elementor-post__thumbnail {
  aspect-ratio: 16 / 10;
}

.elementor-widget-posts .elementor-post__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.elementor-widget-posts .elementor-post__text {
  padding: clamp(1rem, 2.5vw, 1.375rem) clamp(1.125rem, 2.5vw, 1.5rem) clamp(1.25rem, 3vw, 1.75rem);
}

.elementor-widget-posts .elementor-post__meta-data {
  font-size: 0.875rem;
  color: var(--e-global-color-onerhmuted, #707070);
  margin-bottom: 8px;
}

.elementor-widget-posts .elementor-post__title {
  font-size: clamp(1.125rem, 1.6vw, 1.375rem);
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 10px;
}

.elementor-widget-posts .elementor-post__title a {
  color: var(--e-global-color-primary, #1c0d40);
}

.elementor-widget-posts .elementor-post__excerpt p {
  font-size: 16px;
  color: var(--e-global-color-text, #1e1e1e);
  line-height: 1.5;
}

/* Encadrés à icône (blocs « Pourquoi nous choisir », méthodologie). */
.elementor-widget-icon-box .elementor-icon-box-wrapper {
  text-align: left;
}

.elementor-widget-icon-box .elementor-icon-box-icon {
  margin-bottom: 14px;
}

.elementor-widget-icon-box .elementor-icon-box-title {
  font-size: clamp(1.0625rem, 1.4vw, 1.1875rem);
}

.elementor-widget-icon-box .elementor-icon-box-description {
  font-size: clamp(0.9375rem, 1.1vw, 1rem);
  line-height: 1.55;
}

/* Onglets en soulignement (« Nos offres »). `tabs-underline` décrit un EFFET, posé sur chaque
   widget : un futur bloc d'onglets pourra diverger sans conflit. */

/* Valeurs relevées dans le fichier source de la maquette, pas sur une capture (artboard 1920 →
   contenu 1140, facteur 0,594) : titre 74→44 px, onglets 32→19 px, écart 74→44 px. */
.tabs-underline {
  --n-tabs-title-font-size: clamp(1rem, 1.35vw, 1.1875rem);
  --n-tabs-title-gap: clamp(1.5rem, 3vw, 2.75rem);
  /* Le widget colore ses onglets et leurs fonds par variables. Sans ces valeurs, il
     retombe sur ses défauts — fond jaune au survol, texte blanc sur fond clair. */
  --n-tabs-title-color: var(--e-global-color-primary, #1c0d40);
  --n-tabs-title-color-active: var(--e-global-color-secondary, #00aeb2);
  --n-tabs-title-color-hover: var(--e-global-color-secondary, #00aeb2);
  --n-tabs-title-background-color: transparent;
  --n-tabs-title-background-color-active: transparent;
  --n-tabs-title-background-color-hover: transparent;
  --n-tabs-title-padding-block-start: 0px;
  --n-tabs-title-padding-block-end: 0px;
  --n-tabs-title-padding-inline-start: 0px;
  --n-tabs-title-padding-inline-end: 0px;
  --n-tabs-title-border-radius: 0px;
}

.tabs-underline .e-n-tab-title,
.tabs-underline .e-n-tab-title-text {
  font-weight: 300;
}

.tabs-underline .e-n-tabs-heading {
  border-bottom: 0;
}

/* UN SEUL soulignement : la bordure basse est retirée, le trait animé est plus fidèle à la maquette. */
.tabs-underline .e-n-tab-title {
  border: 0;
}

.tabs-underline .e-n-tabs-content {
  padding-top: 0;
}

/* Trait qui se déploie sous l'onglet au changement de sélection. */
.tabs-underline .e-n-tab-title::before {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 0;
  height: 1px;
  background-color: var(--e-global-color-secondary, #00aeb2);
  transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.tabs-underline .e-n-tab-title[aria-selected="true"]::before {
  width: 100%;
}

/* Remplacé par le contrat de lien unique en tête de fichier. `color: inherit`
   plaçait le lien à 1,07:1 contre le texte qui l'entoure : rigoureusement
   indiscernable d'un mot ordinaire, et sans survol au doigt, invisible sur
   mobile. C'était la règle la plus répandue du site — la plupart des pages sont
   faites d'éditeurs de texte.

.elementor-widget-text-editor a {
  color: inherit;
  text-decoration: none;
}

.elementor-widget-text-editor a:hover {
  color: var(--e-global-color-secondary, #00aeb2);
}
*/

/* Tags d'article / expertises cas client : pilules (termes dynamiques). */
.elementor-widget-post-info a {
  display: inline-block;
  background: var(--e-global-color-onerhbgalt, #f4f7fb);
  color: var(--e-global-color-primary, #1c0d40);
  font-size: 13px;
  padding: 6px 14px;
  border-radius: 15px;
  text-decoration: none;
}

.elementor-widget-post-info a:hover {
  background: var(--e-global-color-onerhteall, #7cd6d8);
}

/* ===== Navigation d'en-tête (.orh-header-nav) — TOUT DÉSACTIVÉ. Blocs numérotés commentés ; pour
   en activer un, retirer ses lignes d'ouverture et de fermeture. menu-item-53 = Nos offres. ===== */

/* 1 — Couleur du burger, classe à poser sur le widget */

.orh-burger-blanc {
  --orh-burger: var(--onerh-bg, #ffffff);
}
.orh-burger-violet {
  --orh-burger: var(--onerh-primary, #1c0d40);
}

/* 2 — Entrées de premier niveau */

.orh-header-nav .elementor-nav-menu > li > a.elementor-item {
  padding: 8px 0;
  margin: 0 14px;
  font-weight: 600 !important;
  font-size: 1.25rem !important;
  text-decoration: none;
  position: relative;
  align-self: center;
}

/* 3 — BUREAU : positionnement. Toutes les entrées en `static`, leurs panneaux se calent donc sur
   le container de l'en-tête : même hauteur d'ouverture pour les quatre, sans compensation. */
@media (min-width: 1025px) {
  .orh-header-nav .sub-arrow {
    display: none !important;
  }
  .orh-header-nav,
  .orh-header-nav .elementor-nav-menu {
    position: static !important;
  }
  .orh-header-nav {
    align-self: stretch;
  }
  .orh-header-nav .elementor-nav-menu--main,
  .orh-header-nav .elementor-nav-menu {
    height: 100%;
    align-items: stretch;
  }
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children {
    --orh-hover-bridge: 48px;
    position: static;
    display: flex;
    padding-bottom: var(--orh-hover-bridge);
    margin-bottom: calc(-1 * var(--orh-hover-bridge));
  }

  /* Pont invisible au-dessus du panneau, sur TOUTE sa largeur : le padding du libellé ne couvre
     qu'une colonne étroite, et une souris en diagonale perdait le survol. N'existe qu'au survol. */
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children:hover > ul.sub-menu::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    height: var(--orh-hover-bridge);
  }

  /* Curseur sur les deux zones de survol : ni l'une ni l'autre n'est un lien, et sans ces lignes le
     curseur passe de la main à la flèche puis revient pendant la descente vers le panneau. */
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children,
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children:hover > ul.sub-menu::after {
    cursor: pointer;
  }
}

/* 4 — BUREAU : panneau Nos offres, pleine largeur */
@media (min-width: 1025px) {
  .orh-header-nav .elementor-nav-menu > li.menu-item-53 > ul.sub-menu {
    left: 0 !important;
    right: 0 !important;
    top: 100% !important;
    width: auto !important;
    background: #f4f7fb !important;
    border-radius: 0 !important;
    box-shadow: 0 14px 26px rgba(28, 13, 64, 0.06) !important;
    border: 0;
    z-index: 999 !important;
    padding: 50px 60px 56px !important;
  }
  .orh-header-nav .elementor-nav-menu > li.menu-item-53:hover > ul.sub-menu {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 30px 40px;
  }
  .orh-header-nav .elementor-nav-menu > li.menu-item-53 > ul.sub-menu > li {
    flex: 1 1 0;
    min-width: 0;
  }
}

/* 5 — BUREAU : panneaux, fond débordant en 200vw. `--orh-panel-x` est posée par
   assets/onerh-nav.js ; la valeur de repli aligne sur la grille si le script ne se charge pas. */
@media (min-width: 1025px) {
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children:not(.menu-item-53) > ul.sub-menu {
    left: var(--orh-panel-x, max(20px, calc((100% - 1140px) / 2))) !important;
    right: auto !important;
    top: 100% !important;
    width: 394px !important;
    min-width: 0 !important;
    margin: 0;
    padding: 50px 0 56px !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 0;
    z-index: 999 !important;
  }
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children:not(.menu-item-53):hover > ul.sub-menu {
    display: block !important;
  }
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children:not(.menu-item-53) > ul.sub-menu::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 200vw;
    transform: translateX(-50%);
    background: #f4f7fb;
    z-index: -1;
    box-shadow: 0 14px 26px rgba(28, 13, 64, 0.06);
  }
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children:not(.menu-item-53) > ul.sub-menu > li {
    display: block;
    background: transparent !important;
  }
}

/* 5b — Ouverture en fondu-glissé. `display` ne s'anime pas : `allow-discrete` et
   `@starting-style` le permettent. Sans support navigateur, apparition instantanée, rien de plus. */
@media (min-width: 1025px) {
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children > ul.sub-menu {
    opacity: 0;
    transform: translateY(-14px);
    transition:
      opacity 0.42s ease,
      transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
      display 0.42s allow-discrete;
  }

  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children:hover > ul.sub-menu {
    opacity: 1;
    transform: translateY(0);
  }

  @starting-style {
    .orh-header-nav .elementor-nav-menu > li.menu-item-has-children:hover > ul.sub-menu {
      opacity: 0;
      transform: translateY(-14px);
    }
  }

  /* Le troisieme niveau du megamenu est deja deplie dans sa colonne : il ne doit ni
     glisser ni s estomper avec le panneau qui le contient. */
  .orh-header-nav li.menu-item-53:hover > ul.sub-menu > li > ul.sub-menu {
    transition: none;
  }
}

/* 6 — BUREAU : typographie des sous-menus */
@media (min-width: 1025px) {
  .orh-header-nav .elementor-nav-menu > li > ul.sub-menu > li:not(.menu-item-has-children) > a {
    color: #1c0d40 !important;
    background: transparent !important;
    font-size: 1.125rem !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    padding: 10px 0 !important;
    text-decoration: none;
  }
  .orh-header-nav .elementor-nav-menu > li > ul.sub-menu > li:not(.menu-item-has-children) > a:hover {
    color: #00aeb2 !important;
  }
  .orh-header-nav li.menu-item-53 > ul.sub-menu > li.menu-item-has-children > a {
    display: block !important;
    font-weight: 300 !important;
    font-size: clamp(1.5rem, 1.7vw, 1.75rem) !important;
    line-height: 1.21 !important;
    color: #46106a !important;
    padding: 0 0 26px !important;
    white-space: normal !important;
    text-decoration: none;
  }
  .orh-header-nav li.menu-item-53:hover > ul.sub-menu > li > ul.sub-menu {
    position: static !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    min-width: 0;
    transform: none !important;
    left: auto !important;
    right: auto !important;
    margin: 0;
  }
  .orh-header-nav li.menu-item-53 ul.sub-menu ul.sub-menu li a {
    font-size: 1.125rem !important;
    font-weight: 400 !important;
    color: #1c0d40 !important;
    padding: 7px 0 !important;
    text-decoration: none;
  }
  .orh-header-nav li.menu-item-53 ul.sub-menu ul.sub-menu li a:hover {
    color: #00aeb2 !important;
  }
}

/* 7 — BUREAU : trait teal au survol */
@media (min-width: 1025px) {
  .orh-header-nav .elementor-nav-menu > li > a.elementor-item::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px;
    height: 2px;
    background: #00aeb2;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.18s ease;
  }
  .orh-header-nav .elementor-nav-menu > li:hover > a.elementor-item::after {
    transform: scaleX(1);
  }
}

/* 8 — MOBILE : burger et voile sombre */
@media (max-width: 1024px) {
  .orh-header-nav {
    flex: 0 0 auto !important;
    width: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
  }
  .orh-header-nav .elementor-menu-toggle {
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    padding: 6px !important;
    color: var(--orh-burger, #fff) !important;
    position: relative;
    z-index: 1002;
    /* Un bouton ne reçoit pas le pointer du navigateur, contrairement à un lien, et Elementor le
       déclare dans son frontend.css : la ligne est posée ici, sur l'élément le plus cliqué en mobile. */
    cursor: pointer !important;
  }
  .orh-header-nav .elementor-menu-toggle svg,
  .orh-header-nav .elementor-menu-toggle i {
    width: 30px !important;
    height: 30px !important;
    font-size: 30px !important;
    fill: currentColor !important;
  }
  .orh-header-nav .elementor-menu-toggle.elementor-active {
    color: #1c0d40 !important;
    position: fixed !important;
    top: 22px !important;
    right: 14px !important;
    z-index: 1003 !important;
  }
  .orh-header-nav .elementor-menu-toggle.elementor-active svg {
    fill: #1c0d40 !important;
  }
  .orh-header-nav::after {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(28, 13, 64, 0.45);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
    z-index: 1000;
    pointer-events: none;
  }
  .orh-header-nav:has(.elementor-menu-toggle[aria-expanded="true"])::after {
    opacity: 1;
    visibility: visible;
  }
}

/* 9 — MOBILE : tiroir latéral et blocage du défilement */
@media (max-width: 1024px) {
  .orh-header-nav .elementor-nav-menu__container {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: 0 !important;
    height: 100dvh !important;
    width: 85% !important;
    max-width: 380px !important;
    margin: 0 !important;
    background: #fff !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: translateX(100%) !important;
    transition:
      transform 0.32s cubic-bezier(0.4, 0, 0.2, 1),
      box-shadow 0.32s ease;
    z-index: 1001;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 96px 0 32px;
    max-height: none !important;
  }
  /* L'ombre n'existe qu'à l'état OUVERT : sur la règle de base elle débordait vers la gauche
     (décalage -16 px, flou 40 px) et laissait un dégradé grisâtre permanent au bord droit. */
  .orh-header-nav .elementor-menu-toggle[aria-expanded="true"] ~ .elementor-nav-menu__container {
    transform: translateX(0) !important;
    box-shadow: -16px 0 40px rgba(28, 13, 64, 0.18) !important;
  }
  html:has(.orh-header-nav .elementor-menu-toggle[aria-expanded="true"]) {
    overflow: hidden;
  }
  .orh-header-nav .elementor-nav-menu > li.menu-item-has-children {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* 10 — MOBILE : contenu du tiroir */
@media (max-width: 1024px) {
  .orh-header-nav .elementor-nav-menu__container .elementor-item,
  .orh-header-nav .elementor-nav-menu__container .elementor-sub-item {
    font-size: 1rem !important;
    font-weight: 500 !important;
    color: #1c0d40 !important;
    padding: 15px 28px !important;
    margin: 0 !important;
  }
  .orh-header-nav .elementor-nav-menu__container > .elementor-nav-menu > .menu-item {
    border-bottom: 1px solid #eef1f6;
  }
  .orh-header-nav .elementor-nav-menu__container .sub-menu {
    background: #f4f7fb !important;
    border-radius: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
  }
  .orh-header-nav .elementor-nav-menu__container .sub-menu li {
    width: 100% !important;
    margin: 0 !important;
    background: transparent !important;
  }
  .orh-header-nav .elementor-nav-menu__container .sub-menu .elementor-sub-item {
    font-size: 0.9375rem !important;
    font-weight: 400 !important;
    padding: 12px 34px !important;
    background: transparent !important;
    width: 100% !important;
    box-sizing: border-box;
  }
  .orh-header-nav .elementor-nav-menu__container .sub-menu .sub-menu .elementor-sub-item {
    padding-left: 48px !important;
    font-size: 0.875rem !important;
  }
  .orh-header-nav .elementor-nav-menu__container .sub-menu > li.menu-item-has-children > a.elementor-sub-item {
    color: #46106a !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
  }
  .orh-header-nav .elementor-nav-menu__container .sub-menu > li.menu-item-has-children > a.elementor-sub-item br {
    display: none !important;
  }
  .orh-header-nav .elementor-nav-menu__container .menu-item {
    position: relative;
  }
}

/* 11 — MOBILE : chevrons d'ouverture */
@media (max-width: 1024px) {
  .orh-header-nav .elementor-nav-menu__container .sub-arrow {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    margin: 0 !important;
  }
  .orh-header-nav .elementor-nav-menu__container .sub-arrow i,
  .orh-header-nav .elementor-nav-menu__container .sub-arrow svg {
    color: #46106a !important;
    fill: #46106a !important;
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
    transition: transform 0.2s ease;
  }
  .orh-header-nav .elementor-nav-menu__container a.highlighted .sub-arrow i,
  .orh-header-nav .elementor-nav-menu__container a.highlighted .sub-arrow svg,
  .orh-header-nav .elementor-nav-menu__container a[aria-expanded="true"] .sub-arrow i,
  .orh-header-nav .elementor-nav-menu__container a[aria-expanded="true"] .sub-arrow svg {
    transform: rotate(180deg);
  }
  .orh-header-nav .elementor-nav-menu__container .sub-menu .sub-arrow {
    width: 36px !important;
  }
  .orh-header-nav .elementor-nav-menu__container .sub-menu .sub-arrow i,
  .orh-header-nav .elementor-nav-menu__container .sub-menu .sub-arrow svg {
    font-size: 11px !important;
    width: 11px !important;
    height: 11px !important;
    opacity: 0.7;
  }
}

/* 12 — Boutons Prendre RDV et Contact du tiroir. Classes à poser sur les liens personnalisés du
   menu WordPress : `menu-cta menu-cta-contour` et `menu-cta menu-cta-plein`. */
@media (min-width: 1025px) {
  .orh-header-nav .elementor-nav-menu > li.menu-cta {
    display: none !important;
  }
}
@media (max-width: 1024px) {
  .orh-header-nav .elementor-nav-menu__container > .elementor-nav-menu > li.menu-cta {
    border-bottom: 0 !important;
    padding: 0 28px;
  }
  .orh-header-nav .elementor-nav-menu__container > .elementor-nav-menu > li:not(.menu-cta) + li.menu-cta {
    margin-top: 40px;
  }
  .orh-header-nav .elementor-nav-menu__container li.menu-cta > a.elementor-item {
    display: block;
    text-align: center;
    padding: 13px 24px !important;
    margin: 0 0 12px !important;
    border-radius: 26px;
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em;
    text-transform: uppercase;
  }
  .orh-header-nav .elementor-nav-menu__container li.menu-cta-contour > a.elementor-item {
    background: transparent !important;
    border: 1px solid var(--onerh-secondary, #00aeb2);
    color: var(--onerh-secondary, #00aeb2) !important;
  }
  .orh-header-nav .elementor-nav-menu__container li.menu-cta-plein > a.elementor-item {
    background: var(--onerh-teal-light, #7cd6d8) !important;
    border: 1px solid var(--onerh-teal-light, #7cd6d8);
    color: var(--onerh-bg, #ffffff) !important;
  }
}

/* Responsive mobile : les valeurs responsive de padding et de largeur des containers ne sont pas
   reprises par le push REST — garde-fou contre un contenu collé aux bords. */
@media (max-width: 767px) {
  [data-elementor-type="wp-page"] .e-con.e-parent {
    padding-left: 18px;
    padding-right: 18px;
  }

  [data-elementor-type="archive"] .e-con.e-parent {
    padding-left: 18px;
    padding-right: 18px;
  }

  [data-elementor-type="single-post"] .e-con.e-parent {
    padding-left: 18px;
    padding-right: 18px;
  }

  [data-elementor-type="wp-page"] .e-con.e-flex {
    flex-wrap: wrap;
  }

  [data-elementor-type="wp-page"] .e-con.e-flex > .e-con {
    width: 100%;
    flex-basis: auto;
  }
}

/* Menu burger fermé : le panneau garé en `fixed` élargissait le document de 443 px (scroll
   parasite). Le clip doit porter sur `body`, et `clip` non `hidden`, qui bloquerait l'ouverture. */
body {
  overflow-x: clip;
}

/* Footer : survols (liens et icônes sociales). */
.elementor-location-footer a:hover {
  color: var(--e-global-color-secondary, #00aeb2);
}

.elementor-location-footer .elementor-social-icon {
  transition: color 0.2s;
}

.elementor-location-footer .elementor-social-icon:hover i {
  color: var(--e-global-color-secondary, #00aeb2);
}

@media (max-width: 767px) {
  .elementor-location-footer .elementor-heading-title {
    margin-top: 8px;
  }
}


.calendly-inline-widget {
  width: 100%;
  min-width: 320px;   /* évite que ça devienne trop étroit sur mobile */
  height: 700px;      /* hauteur fixe raisonnable, ou voir plus bas pour du fluide */
}

@media (max-width: 600px) {
  .calendly-inline-widget {
    height: 900px;     /* sur mobile, Calendly a besoin de plus de hauteur car tout s'empile verticalement */
  }
}

/* ===== CALAGES DE PAGES — anciennement style-inacio.css. Ordre conservé tel quel : à spécificité
   égale c'est la dernière règle qui gagne, déplacer un bloc changerait le rendu. ===== */

/***** ACCUEIL *****/
/* Accordéon « Nos offres » — la classe est posée sur le CONTAINER de la section, pas sur
   le widget. Historique dans style-inacio.css.bak et assets/onerh-ds.css.bak. */
.orh-offres-acc .e-n-accordion{display:flex;flex-direction:column;gap:0}
.orh-offres-acc .e-n-accordion details{align-items:flex-start!important}

/* Réinit de la bordure « boîte » du widget : elle est sur le titre ET sur l'item, sur les
   4 côtés. Le séparateur haut est remis juste après. */
.orh-offres-acc .e-n-accordion .e-n-accordion-item-title{border:0!important;border-radius:0!important}
.orh-offres-acc .e-n-accordion .e-n-accordion-item,
.orh-offres-acc .e-n-accordion .e-n-accordion-item > .e-con{border:0!important;border-radius:0!important;background:transparent!important}

/* Séparateur haut sur CHAQUE item. Classe répétée volontairement : `.orh-offres-acc.orh-offres-acc`
   compte pour deux classes et passe devant la bordure générée par le widget. */
.orh-offres-acc.orh-offres-acc .e-n-accordion .e-n-accordion-item{border-top:1px solid rgba(255,255,255,.28)!important}

/* Titre : texte à gauche, chevron à droite, grand et thin. */
.orh-offres-acc .e-n-accordion-item-title{padding:18px 2px!important;font-family:'Inter Tight'!important;
  font-weight:300!important;font-size:30px!important;color:#fff!important;cursor:pointer;list-style:none;
  display:flex!important;flex-direction:row!important;align-items:center;justify-content:space-between;gap:16px}
.orh-offres-acc .e-n-accordion-item-title-header{order:1}
.orh-offres-acc .e-n-accordion-item-title-icon{order:2;margin-left:auto;color:var(--e-global-color-onerhteall,#7CD6D8)!important}
.orh-offres-acc .e-n-accordion-item-title::-webkit-details-marker{display:none}
.orh-offres-acc .e-n-accordion-item-title-icon svg{fill:var(--e-global-color-onerhteall,#7CD6D8)!important;width:16px;height:16px}

/* Services : texte simple, pas de coche. */
.orh-offres-acc .elementor-icon-list-items{padding:0 0 16px;margin:0}
.orh-offres-acc .elementor-icon-list-item{padding:5px 0}
.orh-offres-acc .elementor-icon-list-icon{display:none!important}
.orh-offres-acc .elementor-icon-list-text{color:rgba(255,255,255,.82)!important;font-size:15px;padding:0!important}

/* Onglets « Vous êtes » — migré du CSS custom du widget. Le bloc d'origine empilait des pilules
   qu'une seconde passe annulait ; ici le rendu final résolu, sans les déclarations mortes. */
.orh-segments-tabs .e-n-tabs-heading {
  justify-content: center;
  gap: 5.5rem;
  border: 0;
  flex-wrap: wrap;
}

.orh-segments-tabs .e-n-tab-title {
  /* absent du CSS migré : sans lui, le trait ::before s'ancre au premier parent
     positionné et sort de l'onglet. */
  position: relative;
  font-family: "Inter Tight" !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  color: var(--e-global-color-primary, #1c0d40) !important;
  border: 0 !important;
  border-radius: 26px !important;
  padding: 0 !important;
  background: #fff !important;
}

/* trait qui se déploie de la gauche vers la droite à la sélection */
.orh-segments-tabs .e-n-tab-title::before {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 0;
  height: 1px;
  background-color: var(--e-global-color-primary) !important;
  transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.orh-segments-tabs .e-n-tab-title[aria-selected="true"] {
  background: none !important;
}

.orh-segments-tabs .e-n-tab-title[aria-selected="true"]::before {
  width: 100%;
}

.orh-segments-tabs .e-n-tabs-content {
  padding-top: 30px;
}

/* Bande blanche « Notre équipe » — même mécanisme que `.band-bottom`, à 12vh et blanc en dur.
   BUREAU UNIQUEMENT : retirée sous 1024 px, où elle rognerait le contenu (palier plus bas). */
.orh-equipe {
  /* absent du CSS migré : sans lui, le ::after s'ancre au premier parent positionné
     et la bande se pose hors de la section. */
  position: relative;
}

.orh-equipe::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 12vh;
  background: #fff;
  z-index: 1;
}

/* Carte RDV : carré jaune décoratif derrière la carte blanche. `.orh-rendez-vous` est sur le
   container qui l'enveloppe, d'où un z-index 0/1 sans négatif. Proportions en % (maquette 663×583). */
/* Le carré déborde à droite et créait un scroll horizontal que le clip sur `body` n'absorbait pas :
   rogné sur la SECTION, pleine largeur. `clip` non `hidden`, qui forcerait l'axe vertical en auto. */
.e-con.e-parent:has(.orh-rendez-vous) {
  overflow-x: clip;
}

.orh-rendez-vous {
  position: relative;
}

.orh-rendez-vous > .e-con {
  position: relative;
  z-index: 1;
}

.orh-rendez-vous::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: -44%;
  bottom: -7%;
  width: 115%;
  height: 68%;
  background: var(--e-global-color-accent, #ffe495);
  border-radius: 0 0 0 24px;
  pointer-events: none;
}

/* Témoignages : bande grise posée entièrement SOUS la section (`bottom` négatif = sa hauteur).
   Une variable unique pilote les deux : les découpler ferait un liseré ou un chevauchement. */
.orh-temoignent {
  /* sans lui, le ::after s'ancre au premier parent positionné et la bande se pose
     ailleurs dans la page. */
  position: relative;
}

.orh-temoignent::after {
  --band-height: 30vh;
  /* Plafonné au tiers de la hauteur : à ~47 px sur mobile, un rayon fixe de 24 px arrondirait tout. */
  --band-radius: min(24px, calc(var(--band-height) / 3));
  content: "";
  position: absolute;
  left: 0;
  bottom: calc(-1 * var(--band-height));
  width: 100%;
  height: var(--band-height);
  background-color: #f4f7fb;
  /* angles du BAS seulement : le haut doit rester d'équerre avec la section prolongée. */
  border-radius: 0 0 var(--band-radius) var(--band-radius);
  z-index: 1;
  /* la bande recouvre le HAUT de la section suivante : sans ceci, elle intercepte
     les clics sur les liens et boutons qui s'y trouvent. */
  pointer-events: none;
}

/* Cabinet de conseil : l'image sort de la section par une marge basse négative, le fond Elementor
   s'arrête donc plus haut. Le container doit rester en débordement visible, sinon l'effet disparaît. */
.orh-cabinet-conseil {
  --orh-image-overflow: 52px;
}

.orh-cabinet-conseil .elementor-widget-image {
  margin-bottom: calc(-1 * var(--orh-image-overflow));
}

/* ===== Blog : grille de cartes (.orh-blog, skin Cards). Carte en flex colonne, blocs réordonnés
   pour mettre la date au-dessus du titre. Auteur masqué : le widget le sort en texte brut. ===== */

/* Rétablit le réglage 3/2/1 du widget, que la règle mutualisée passe en `auto-fit`.
   `minmax(0, 1fr)` et non `1fr` : sans le minimum à zéro, un titre long déborde la grille. */
.orh-blog .elementor-posts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}

.orh-blog .elementor-post__card {
  display: flex;
  flex-direction: column;
  background: var(--onerh-bg, #ffffff);
  border: 0;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(28, 13, 64, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.orh-blog .elementor-post__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(28, 13, 64, 0.14);
}

/* `display: contents` efface `.elementor-post__meta-data` : ses deux spans deviennent enfants
   directs de la carte et reçoivent des `order` distincts — date en haut, auteur en bas. */
.orh-blog .elementor-post__meta-data {
  display: contents;
}

.orh-blog .elementor-post__thumbnail__link {
  order: 0;
  margin: 0;
}

.orh-blog .elementor-post-date {
  order: 1;
}

.orh-blog .elementor-post__text {
  order: 2;
}

.orh-blog .elementor-post-author {
  order: 3;
}

/* `padding-bottom: 0` : Elementor réserve le ratio de la vignette par un padding, que
   `aspect-ratio` remplace ici — les deux cumulés doubleraient la hauteur. */
.orh-blog .elementor-post__thumbnail {
  aspect-ratio: 16 / 10;
  height: auto;
  padding-bottom: 0 !important;
}

.orh-blog .elementor-post__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Le padding se pose sur les spans eux-mêmes : la boîte qui le portait a disparu avec
   `display: contents`. */
.orh-blog .elementor-post-date {
  padding: 24px 28px 0;
  font-size: 0.8125rem;
  color: var(--onerh-text-muted, #707070);
}

/* `margin-top: auto` pousse le bloc auteur en bas : les filets s'alignent d'une carte à l'autre. */
.orh-blog .elementor-post-author {
  margin-top: auto;
  padding: 16px 28px 22px;
  border-top: 1px solid #eef1f6;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--onerh-primary, #1c0d40);
}

.orh-blog .elementor-post__text {
  padding: 8px 28px 22px;
  margin: 0;
}

/* Troncature à un nombre de LIGNES, non de mots comme le réglage d'Elementor : la hauteur des
   cartes ne varie plus. `-webkit-line-clamp` exige `display: -webkit-box` et `box-orient`. */
.orh-blog .elementor-post__title {
  font-size: clamp(1.125rem, 1.5vw, 1.375rem);
  font-weight: 500;
  line-height: 1.3;
  margin: 0 0 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.orh-blog .elementor-post__title a {
  color: var(--onerh-primary, #1c0d40);
  text-decoration: none;
}

.orh-blog .elementor-post__title a:hover {
  color: var(--onerh-secondary, #00aeb2);
}

.orh-blog .elementor-post__excerpt p {
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--onerh-text, #1e1e1e);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ===== Accordéon courant — habillage par défaut. Cible le widget, pas une classe ; la FAQ et
   l'accordéon violet sont exclus. `!important` : le widget écrit ses styles par élément. ===== */

.elementor-widget-n-accordion:not(.orh-faq):not(.orh-offres-acc):not(.orh-offres-acc *),
.orh-accordeon-default {
  & .e-n-accordion {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  /* Filet haut sur chaque item, filet bas sur le dernier : la liste est fermée des deux
     côtés sans jamais doubler le trait entre deux items. */
  & .e-n-accordion-item {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    border-top: 1px solid rgba(28, 13, 64, 0.12) !important;

    &:last-child {
      border-bottom: 1px solid rgba(28, 13, 64, 0.12) !important;
    }
  }

  & .e-n-accordion-item-title {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 16px;
    padding: 20px 2px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    cursor: pointer;
    list-style: none;

    /* Un `<summary>` affiche un triangle natif, qui ferait doublon avec le plus/moins. */
    &::-webkit-details-marker {
      display: none;
    }

    &::marker {
      content: "";
    }

    /* L'accordéon se parcourt aux flèches du clavier : sans contour, à l'aveugle. */
    &:focus-visible {
      outline: 2px solid var(--onerh-secondary, #00aeb2);
      outline-offset: 2px;
    }
  }

  & .e-n-accordion-item-title-header {
    flex: 1;
    min-width: 0;
  }

  & .e-n-accordion-item-title-text {
    font-family: "Inter Tight", sans-serif;
    font-size: clamp(1rem, 1.3vw, 1.1875rem);
    font-weight: 500;
    line-height: 1.4;
    color: var(--onerh-primary, #1c0d40);
    transition: color 0.25s ease;
  }

  & .e-n-accordion-item[open] .e-n-accordion-item-title-text {
    color: var(--onerh-secondary, #00aeb2);
  }

  & .e-n-accordion-item-title-icon {
    flex: 0 0 auto;
    margin-left: auto;

    & svg {
      width: 14px;
      height: 14px;
      fill: var(--onerh-secondary, #00aeb2) !important;
    }
  }

  & .e-n-accordion-item > .e-con {
    padding: 0 2px 22px !important;
    background: transparent !important;
    border: 0 !important;
  }

  /* `break-inside: avoid` empêche qu'un nom soit coupé entre deux colonnes. */
  & .elementor-widget-text-editor ul {
    columns: 2;
    column-gap: 48px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  & .elementor-widget-text-editor li {
    position: relative;
    break-inside: avoid;
    padding: 5px 0 5px 20px;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: var(--onerh-text, #1e1e1e);

    /* Tiret teal en guise de puce : plus discret qu'un point sur une liste de noms
       propres, et cohérent avec les filets fins de la charte. */
    &::before {
      content: "";
      position: absolute;
      left: 0;
      top: 0.95em;
      width: 8px;
      height: 1px;
      background: var(--onerh-secondary, #00aeb2);
    }
  }
}


/* ===== FAQ (.orh-faq, accordéon nested). Parti pris : cartes DÉTACHÉES, l'ouverture se lisant à
   trois signaux — ombre, question en teal, liseré à gauche. `!important` : styles par élément. ===== */

.orh-faq .e-n-accordion {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.orh-faq .e-n-accordion-item {
  position: relative;
  overflow: hidden;
  background: var(--onerh-bg, #ffffff) !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 6px 20px rgba(28, 13, 64, 0.06);
  transition: box-shadow 0.28s ease;
}

.orh-faq .e-n-accordion-item[open] {
  box-shadow: 0 14px 34px rgba(28, 13, 64, 0.1);
}

/* `scaleY` plutôt qu'une hauteur : pas de recalcul de mise en page, l'animation reste fluide. */
.orh-faq .e-n-accordion-item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: var(--onerh-secondary, #00aeb2);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.orh-faq .e-n-accordion-item[open]::before {
  transform: scaleY(1);
}

/* Question. `list-style` et le marqueur WebKit sont neutralisés : un `<summary>` affiche
   un triangle natif par défaut, qui ferait doublon avec le chevron. */
.orh-faq .e-n-accordion-item-title {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 20px;
  padding: 20px 24px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  cursor: pointer;
  list-style: none;
}

.orh-faq .e-n-accordion-item-title::-webkit-details-marker {
  display: none;
}

.orh-faq .e-n-accordion-item-title::marker {
  content: "";
}

/* Repère clavier : le `<summary>` est focusable, et l'accordéon se parcourt aux flèches.
   Sans ce contour, la navigation au clavier se fait à l'aveugle. */
.orh-faq .e-n-accordion-item-title:focus-visible {
  outline: 2px solid var(--onerh-secondary, #00aeb2);
  outline-offset: -2px;
}

.orh-faq .e-n-accordion-item-title-header {
  flex: 1;
  min-width: 0;
}

.orh-faq .e-n-accordion-item-title-text {
  font-family: "Inter Tight", sans-serif;
  font-size: clamp(1rem, 1.3vw, 1.125rem);
  font-weight: 500;
  line-height: 1.4;
  color: var(--onerh-primary, #1c0d40);
  transition: color 0.25s ease;
}

.orh-faq .e-n-accordion-item[open] .e-n-accordion-item-title-text {
  color: var(--onerh-secondary, #00aeb2);
}

/* Chevron dans une pastille : cible plus large que l'icône seule, et le changement de
   fond à l'ouverture donne un second signal d'état, lisible sans lire le texte. */
.orh-faq .e-n-accordion-item-title-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-left: auto;
  border-radius: 50%;
  background: var(--onerh-bg-alt, #f4f7fb);
  transition: background 0.25s ease;
}

.orh-faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon {
  background: var(--onerh-teal-light, #7cd6d8);
}

.orh-faq .e-n-accordion-item-title-icon svg {
  width: 12px;
  height: 12px;
  fill: var(--onerh-primary, #1c0d40) !important;
}

/* Réponse sans padding haut, sinon l'écart double à l'ouverture. Retrait droit plus large qu'à
   gauche pour que la ligne de texte ne file pas sous le chevron. */
.orh-faq .e-n-accordion-item > .e-con {
  padding: 0 68px 22px 24px !important;
  background: transparent !important;
  border: 0 !important;
}

.orh-faq .elementor-widget-text-editor p {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--onerh-text, #1e1e1e);
  margin: 0;
}

/* Remplacé par le contrat de lien unique en tête de style.css. Ce bloc signalait
   correctement ses liens (bordure permanente), mais avec #00aeb2 à 2,7:1 sur
   blanc et un troisième habillage rien que pour la FAQ. Le contrat global donne
   le même signal permanent dans une couleur lisible ; ces sélecteurs devaient
   partir car leur spécificité (0,3,0) l'emportait sur lui.

.orh-faq .elementor-widget-text-editor a {
  color: var(--onerh-secondary, #00aeb2);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}

.orh-faq .elementor-widget-text-editor a:hover {
  color: var(--onerh-primary, #1c0d40);
}
*/

/* ===== Flèche « arrow-right » : `currentColor` sur le `stroke` (dessin au trait, `fill:none`).
   Ciblée par `[id=]`, l'ID étant répété sur plusieurs boutons. ⚠ SVG INLINE uniquement. ===== */
:is(.arrow-right, [id="arrow-right"]) :is(path, line, polyline),
:is(.arrow-right, [id="arrow-right"])[stroke] {
  stroke: currentColor !important;
}

/* Taille des flèches. `height: auto` garde les proportions (viewBox 31 × 15,414). Pas de
   `!important` : ce fichier est chargé après celui d'Elementor. */
.elementor-button-icon svg {
  width: 1.5rem;
  height: auto;
}

/* ===== Rayon et padding communs à TOUS les boutons (widget, Gutenberg, pagination) — portée large
   voulue. `!important` car Elementor écrit le rayon depuis le kit, qui reste le bon endroit. ===== */
.elementor-button,
.wp-block-button__link,
.wp-element-button {
  border-radius: 1rem !important;
  padding: 18px 19px !important;
}

/* ===== Publications en cartes (.orh-slider-publication) : habillage de .orh-blog sur la skin
   CLASSIC — c'est l'`<article>` qui fait la carte. La grille rétablit le réglage 3/2/1. ===== */

/* 5 colonnes comme le réglage du widget, que la règle mutualisée passerait en `auto-fit`. Une
   carte fait alors ~200 px sur 1140 : c'est ce qui commande les paddings et tailles réduits. */
.orh-slider-publication .elementor-posts {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 35px;
}

.orh-slider-publication .elementor-post {
  display: flex;
  flex-direction: column;
  margin: 0;
  background: var(--onerh-bg, #ffffff);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(28, 13, 64, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.orh-slider-publication .elementor-post:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(28, 13, 64, 0.14);
}

.orh-slider-publication .elementor-post__thumbnail__link {
  margin: 0;
}

.orh-slider-publication .elementor-post__thumbnail {
  aspect-ratio: 16 / 10;
  height: auto;
  padding-bottom: 0 !important;
}

.orh-slider-publication .elementor-post__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Le bloc texte devient la colonne : date remontée par `order`, « Lire la suite » poussé en bas. */
.orh-slider-publication .elementor-post__text {
  display: flex;
  flex-direction: column;
  flex: 1;
  /* Padding resserré : sur une carte de 200 px, 28 px de chaque côté ne laisseraient
     que 144 px de texte utile, soit une vingtaine de caractères par ligne. */
  padding: 18px 18px 20px;
  margin: 0;
}

.orh-slider-publication .elementor-post__meta-data {
  order: -1;
  border: 0;
  margin: 0 0 6px;
  padding: 0;
  font-size: 0.8125rem;
  color: var(--onerh-text-muted, #707070);
}

/* Titre sur 3 lignes ici contre 2 sur le blog : à 200 px, deux lignes couperaient la plupart des titres. */
.orh-slider-publication .elementor-post__title {
  font-size: clamp(0.9375rem, 1.1vw, 1.0625rem);
  font-weight: 500;
  line-height: 1.3;
  margin: 0 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.orh-slider-publication .elementor-post__title a {
  color: var(--onerh-primary, #1c0d40);
  text-decoration: none;
}

.orh-slider-publication .elementor-post__title a:hover {
  color: var(--onerh-secondary, #00aeb2);
}

.orh-slider-publication .elementor-post__excerpt {
  margin: 0;
}

.orh-slider-publication .elementor-post__excerpt p {
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--onerh-text, #1e1e1e);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.orh-slider-publication .elementor-post__read-more {
  margin-top: auto;
  padding-top: 12px;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--onerh-secondary, #00aeb2);
  text-decoration: none;
}

.orh-slider-publication .elementor-post__read-more:hover {
  text-decoration: underline;
}

/* Pagination du widget. Vaut pour les deux modes : `prev_next` (deux boutons seuls) et
   `numbers_and_prev_next` (numéros encadrés par les boutons). */
.orh-slider-publication .elementor-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 32px;
}

.orh-slider-publication .elementor-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(28, 13, 64, 0.14);
  border-radius: 1rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--onerh-primary, #1c0d40);
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* Survol et page courante réservés aux liens : un bouton en butée ne doit pas réagir. */
.orh-slider-publication .elementor-pagination a.page-numbers:hover {
  background: var(--onerh-secondary, #00aeb2);
  border-color: var(--onerh-secondary, #00aeb2);
  color: var(--onerh-bg, #ffffff);
}

.orh-slider-publication .elementor-pagination .page-numbers.current {
  background: var(--onerh-secondary, #00aeb2);
  border-color: var(--onerh-secondary, #00aeb2);
  color: var(--onerh-bg, #ffffff);
}

/* BUTÉE : en bout de liste Elementor rend le bouton en `<span>` au lieu de `<a>` — c'est ce qui
   permet de le distinguer sans JavaScript. `:not(.current)` garde la page active en teal. */
.orh-slider-publication .elementor-pagination span.page-numbers:not(.current) {
  color: var(--onerh-text-muted, #707070);
  border-color: rgba(28, 13, 64, 0.08);
  background: transparent;
  opacity: 0.55;
  cursor: default;
}

/* ===== Carrousel de podcasts (.orh-loop-podcast). L'écart vient du PADDING du container de slide
   (2 em). ⚠ Le vrai réglage est sur le modèle de boucle 3908 — ce CSS le contourne. ===== */
.orh-loop-podcast {
  --orh-podcast-ecart: 10px;
}

.orh-loop-podcast .swiper-slide > .e-con {
  --padding-left: var(--orh-podcast-ecart);
  --padding-right: var(--orh-podcast-ecart);
}

/* Ombre de la carte : remplace celle du modèle de boucle (noir 50 % sur 10 px de flou), trop dure.
   Quatre classes dans le sélecteur contre trois : passe devant sans `!important`. */
.orh-loop-podcast .swiper-slide .e-con-inner > .e-con {
  box-shadow: 0 3px 30px #0000000f;
}

/* Fond annulé sur ordinateur, conservé en tablette et mobile. `!important` car la règle générée
   pèse trois classes. 1025 px et non 1024 : la borne tablette d'Elementor s'arrête à 1024. */
@media (min-width: 1025px) {
  .orh-notre-entreprise {
    background-color: transparent !important;
  }
}

/* ===== Corps d'article (.orh-contenu-publication). Le widget porte aussi
   `.elementor-widget-theme-post-content`, déjà stylé plus haut : ici seul ce qui manquait. ===== */

/* Rythme : la marge basse tient l'écart entre paragraphes, les titres la reprennent en marge haute. */
.orh-contenu-publication p {
  font-size: clamp(0.9375rem, 1.1vw, 1.0625rem);
  line-height: 1.65;
  margin: 0 0 1.25em;
}

.orh-contenu-publication > *:last-child {
  margin-bottom: 0;
}

/* Le gras courant reste dans la couleur du texte : il structure la lecture sans
   entrer en concurrence avec les liens, qui sont eux en teal. */
.orh-contenu-publication strong {
  font-weight: 600;
  color: var(--onerh-primary, #1c0d40);
}

/* H3 et H4 descendent l'échelle en gardant le violet ; le H2 est déjà traité plus haut. */
.orh-contenu-publication h3 {
  font-size: clamp(1.125rem, 1.6vw, 1.375rem);
  font-weight: 600;
  line-height: 1.3;
  color: var(--onerh-primary, #1c0d40);
  margin: 2em 0 0.6em;
}

.orh-contenu-publication h4 {
  font-size: clamp(1rem, 1.3vw, 1.125rem);
  font-weight: 600;
  line-height: 1.35;
  color: var(--onerh-primary-light, #3f2975);
  margin: 1.6em 0 0.5em;
}

/* Listes. `padding-left` plutôt qu'une marge : le marqueur reste dans la colonne de
   lecture au lieu de déborder à gauche du texte. */
.orh-contenu-publication ol,
.orh-contenu-publication ul {
  margin: 0 0 1.5em;
  padding-left: 1.4em;
}

.orh-contenu-publication li {
  font-size: clamp(0.9375rem, 1.1vw, 1.0625rem);
  line-height: 1.6;
  margin-bottom: 0.7em;
}

.orh-contenu-publication li::marker {
  color: var(--onerh-secondary, #00aeb2);
  font-weight: 600;
}

/* Le terme d'une liste de définitions passe en teal. `:first-child` seul : pas un gras en cours de phrase. */
.orh-contenu-publication li > strong:first-child {
  color: var(--onerh-secondary, #00aeb2);
}

/* Images de contenu : le radius vient de style.css, ici l'air autour. */
.orh-contenu-publication figure,
.orh-contenu-publication .wp-block-uagb-image {
  margin: 2.25em 0;
}

/* `margin: 0` retirait le centrage obtenu par marges automatiques. Remis sur l'image elle-même :
   `display: block` + `margin-inline: auto`, indépendant de l'alignement du texte. */
.orh-contenu-publication .wp-block-uagb-image__figure {
  margin: 0;
  text-align: center;
}

.orh-contenu-publication figure img,
.orh-contenu-publication .wp-block-uagb-image img {
  display: block;
  margin-inline: auto;
  max-width: 100%;
  height: auto;
}

/* Encadré d'appel (bloc Info Box de Spectra/UAGB). */
.orh-contenu-publication .uagb-infobox__content-wrap {
  background: var(--onerh-bg-alt, #f4f7fb);
  border-radius: 16px;
  padding: clamp(1.25rem, 3vw, 2rem);
  margin: 2.25em 0;
}

.orh-contenu-publication .uagb-ifb-icon-wrap svg {
  width: 34px;
  height: 34px;
  fill: var(--onerh-secondary, #00aeb2);
}

.orh-contenu-publication .uagb-ifb-title {
  font-size: clamp(1.0625rem, 1.4vw, 1.1875rem);
  font-weight: 600;
  color: var(--onerh-primary, #1c0d40);
  margin: 0.5em 0 0.4em;
}

.orh-contenu-publication .uagb-ifb-desc {
  font-size: clamp(0.9375rem, 1.1vw, 1rem);
  line-height: 1.6;
  margin: 0;
}

/* Habillage dans le bloc « boutons » plus haut ; ici le centrage, l'air, et le gras interne neutralisé. */
/* Centrage de tous les boutons du corps d'article, sans dépendre de la classe de justification que
   Gutenberg ajoute ou non. Limité au corps : ailleurs, les boutons sont alignés par leur bloc. */
.orh-contenu-publication .wp-block-buttons {
  margin: 2em 0;
  justify-content: center;
}

/* Bouton isolé, hors conteneur `.wp-block-buttons` : les articles migrés en contiennent,
   leur HTML datant d'avant ce conteneur. */
.orh-contenu-publication > .wp-block-button {
  display: flex;
  justify-content: center;
  margin: 2em 0;
}

.orh-contenu-publication .wp-block-button__link strong {
  font-weight: inherit;
  color: inherit;
}

/* Sous 1024 px la carte n'a plus de marge à droite : un carré débordant de 44 % serait rogné.
   Il est donc resserré et réduit, pour rester lisible comme calage décoratif. */
@media (max-width: 1024px) {
  .orh-rendez-vous::after {
    right: -17%;
    bottom: -4%;
    width: 66%;
    height: 60%;
  }

  /* Palier intermédiaire entre les 30 vh du bureau et les 7 dvh du mobile. `dvh`
     dès ici — les tablettes ont aussi une barre d'adresse qui se rétracte. */
  .orh-temoignent::after {
    --band-height: max(5rem, 14dvh);
  }

  /* Bande « Notre équipe » retirée dès la tablette : colonnes empilées, plus rien à masquer. */
  .orh-equipe::after {
    display: none;
  }

  /* Reprend le réglage du widget : 2 colonnes en tablette, 1 en mobile. */
  .orh-blog .elementor-posts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .orh-slider-publication .elementor-posts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Onglets « Vous êtes » : la carte de texte de chaque onglet est réglée en
     `position: absolute` + `translateY(-50%)`. C'est la superposition voulue sur le
     bureau, où elle chevauche l'image.

     Sortie du flux, elle ne pousse plus rien : le conteneur de l'onglet ne mesure que
     la hauteur de son image, la carte dépasse en bas — bouton coupé — et recouvre la
     section suivante. Elle est donc remise dans le flux, sous l'image.

     `!important` : Elementor écrit ces deux propriétés dans une règle par élément
     (`.elementor-element-045c018 { position: absolute }`), qu'une classe ne bat pas. */
  .tabs-underline .e-n-tabs-content .e-con.e-transform {
    position: static !important;
    transform: none !important;
  }
}

/* `dvh` et non `vh` sur mobile (barre d'adresse rétractable). `max()` garantit une bande utile en
   paysage, où 15 % de la hauteur ne suffit pas. Même correctif que sur `.band-bottom`. */
@media (max-width: 767px) {
  /* Barre d'onglets conservée sur mobile : 62 caractères ne tiennent pas sur 375 px. `nowrap` et
     `overflow-x` la rendent glissable ; barre masquée, débordement signalé par le padding droit. */
  .tabs-underline .e-n-tabs-heading {
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    padding-right: 32px;
    /* `overflow-x: auto` fait passer `overflow-y` en `auto` : le trait à `bottom: -8px` provoquait une
       barre de défilement verticale. Ce padding le ramène à l'intérieur de la boîte. */
    padding-bottom: 12px;
    scrollbar-width: none;
  }

  .tabs-underline .e-n-tabs-heading::-webkit-scrollbar {
    display: none;
  }

  .tabs-underline .e-n-tab-title {
    white-space: nowrap;
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  /* La carte de texte de chaque onglet est réglée en `position: absolute` +
     `translateY(-50%)` : c'est la superposition voulue sur le bureau, où elle chevauche
     l'image. En accordéon, sortie du flux, elle ne pousse plus rien — le contenu de
     l'onglet ne mesure que son image et la carte retombe par-dessus les titres suivants.
     Elle est remise dans le flux, sous l'image.

     `.e-n-tabs-mobile` est la classe qu'Elementor pose lui-même en mode accordéon : le
     correctif suit donc le point de rupture réglé dans le widget. La media query reste
     comme garde-fou, au cas où cette classe soit rendue côté serveur.

     `!important` : Elementor écrit ces deux propriétés dans une règle par élément
     (`.elementor-element-045c018 { position: absolute }`), qu'une classe seule ne bat pas. */
  .e-n-tabs-mobile .e-n-tabs-content .e-con.e-transform {
    position: static !important;
    transform: none !important;
  }

  /* Le débordement est neutralisé sur une seule colonne — voir la fin du fichier. */

  /* 30 vh de fond sous la section, c'est presque un tiers d'écran de gris sur mobile.
     La variable pilote hauteur ET décalage d'un coup, ils restent donc opposés. */
  .orh-temoignent::after {
    --band-height: max(2.5rem, 7dvh);
  }

  /* Sur une colonne, l'image passe sous le texte et un débordement sous le fond n'a
     plus de sens : il mangerait l'espacement avec la section suivante. */
  .orh-cabinet-conseil {
    --orh-image-overflow: 0px;
  }

  .orh-blog .elementor-posts {
    grid-template-columns: minmax(0, 1fr);
  }

  .orh-slider-publication .elementor-posts {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Une seule colonne : à 375 px, deux colonnes de noms de logiciels donneraient des
     libellés coupés comme « Advantage RH / (Sigma) ». */
  .elementor-widget-n-accordion:not(.orh-faq):not(.orh-offres-acc):not(.orh-offres-acc *),
  .orh-accordeon-default {
    & .elementor-widget-text-editor ul {
      columns: 1;
    }

    & .e-n-accordion-item-title {
      padding: 16px 0 !important;
    }
  }

  /* FAQ sur 375 px : paddings resserrés, retrait droit ramené à la valeur de gauche, pastille réduite. */
  .orh-faq .e-n-accordion-item-title {
    gap: 12px;
    padding: 16px 18px !important;
  }

  .orh-faq .e-n-accordion-item-title-icon {
    width: 28px;
    height: 28px;
  }

  .orh-faq .e-n-accordion-item > .e-con {
    padding: 0 18px 18px !important;
  }

  /* Tableau « Votre besoin / Notre solution » empilé : à deux colonnes sur 375 px, des libellés de 40 à
     60 caractères se coupent sur trois lignes. `!important` — sinon à refaire sur les dix rangées. */
  .orh-solutions > .e-con {
    flex-direction: column !important;
  }

  .orh-solutions > .e-con > .e-con {
    width: 100% !important;
  }

  /* Détache les paires les unes des autres, pour qu'on voie où commence chaque cas. */
  .orh-solutions > .e-con + .e-con {
    margin-top: 14px;
  }

  /* Annule le filet teal des rangées posé plus bas : empilé, il double la séparation. `.e-con` pour la
     spécificité, ce bloc étant chargé avant. Solution de fond : limiter ce filet au bureau. */
  .orh-solutions > .e-con:not(:last-child) {
    border-bottom: 0;
  }
}

/* --- Listing des podcasts --- */
.orh-podcast-item-desc { display: none; }

.orh-podcast-card.orh-desc-open .orh-podcast-item-ext  { display: none; }
.orh-podcast-card.orh-desc-open .orh-podcast-item-desc { display: block; }

.orh-podcast-item-desc p:empty { display: none; }
.orh-podcast-item-desc > p:first-child { margin-top: 0; }
.orh-podcast-item-desc > p:last-child  { margin-bottom: 0; }

/* --- Déclencheur --- */
.orh-readmore {
  display: inline-block;
  background: none !important;
  border: 0;
  padding: 0;
  font-weight: 500 !important;
  color: var(--onerh-secondary) !important;
  text-decoration: underline;
  cursor: pointer;
}
.orh-readmore:hover { text-decoration: none; }
.orh-readmore:focus-visible { outline: 2px solid var(--onerh-primary); outline-offset: 2px; }
.orh-readmore[hidden] { display: none; }

.orh-readmore-less { display: none; }
.orh-podcast-card.orh-desc-open .orh-readmore-more { display: none; }
.orh-podcast-card.orh-desc-open .orh-readmore-less { display: inline; }


/* ═══ Bloc « Réservez votre rendez-vous » — Calendly adaptatif. 35 % (titre, flex-shrink:0) + 50 %
   (Calendly) + 271 px de gap exigent 1927 px, et le `min-width:550px` INLINE du Calendly déborde.
   `!important` indispensable (règle générée à 0,3,0, style inline au-dessus). Empilé sous 1024 px. ═══ */

/* ─── Au-dessus de 1 024 px : deux colonnes, Calendly à 550 px minimum ─── */
@media (min-width: 1025px) {

  /* Gap proportionnel : 271 px conservés sur grand écran, puis fonte régulière
     jusqu'au plancher de 2 rem à l'approche de 1 024 px. */
  .e-con:has(> .orh-rendez-vous) {
    --gap: clamp(2rem, calc((100vw - 64rem) * 0.35), 16.938rem) !important;
    --row-gap: clamp(2rem, calc((100vw - 64rem) * 0.35), 16.938rem) !important;
    --column-gap: clamp(2rem, calc((100vw - 64rem) * 0.35), 16.938rem) !important;
  }

  /* La colonne Calendly ne descend jamais sous 550 px. */
  .orh-rendez-vous {
    min-width: 550px !important;
    --flex-shrink: 0 !important;
  }

  /* La colonne titre cède à sa place. `min-width: 0` lève le plancher implicite
     de contenu, sans quoi flexbox refuserait de la réduire et déborderait. */
  .e-con:has(> .orh-rendez-vous) > .e-con:not(.orh-rendez-vous) {
    --flex-shrink: 1 !important;
    min-width: 0 !important;
  }
}

/* ─── Sous 1 024 px : le bloc s'empile, le plancher saute ─── */
@media (max-width: 1024px) {

  .e-con:has(> .orh-rendez-vous) {
    --flex-direction: column !important;
  }

  .e-con:has(> .orh-rendez-vous) > .e-con {
    --width: 100% !important;
    min-width: 0 !important;
  }

  .orh-rendez-vous {
    min-width: 0 !important;
  }

  .orh-rendez-vous .calendly-inline-widget {
    min-width: 0 !important;
    width: 100% !important;
  }
}

/* Hauteurs mobile : Calendly empile ses créneaux et les 550 px inline coupent le calendrier. */
@media (max-width: 767px) {
  .orh-rendez-vous .calendly-inline-widget {
    height: 700px !important;
  }
}

@media (max-width: 600px) {
  .orh-rendez-vous .calendly-inline-widget {
    height: 900px !important;
  }
}

/* ===== EN-TÊTE STICKY, ÉQUIPE, PODCASTS, FILTRES CAS CLIENT — anciennement style-bastien.css,
   chargée en dernier. Reste donc à la fin : elle l'emportait à spécificité égale. ===== */

/*** HEADER STICKY ***/
header {
   position: sticky;
   top: 0;
   z-index: 100;
   transition: padding 0.2s ease-out;
}

header.is-sticky .elementor-element-onrhrootl,
header.is-sticky .elementor-element-onrhrootd {
   padding: 1rem 3.75rem;
}

header .elementor-widget-image img {
   transition: width 0.3s ease-out;
}
header.is-sticky .elementor-widget-image img {
   width: 4.5rem !important;
}

@media screen and (min-width: 1024px) {
   header.is-sticky .orh-header-nav .elementor-nav-menu > li > a.elementor-item {
      font-size: 1rem !important;
   }

   header.is-sticky .elementor-button {
      font-size: 13px !important;
      padding: 12px 15px !important;
   }
}

/*** NOS OFFRES ***/
.orh-solutions > div:not(:last-child) {
   border-bottom: 1px solid #00AEB2;
}

.orh-solutions p {
   margin: 0 !important;
}

/*** TPE PME ***/
.onerh-pme-grid {
   grid-template-rows: auto auto auto !important; 
}

.onerh-pme-grid-item {
   grid-template-rows: subgrid !important;
   grid-row: span 3 !important;
}

.onerh-pme-chiffres:after {
   content: "";
   position: absolute;
   left: 0;
   bottom: 0;
   width: 100%;
   height: 30%;
   background: #fff;
}

.orh-grid-choice svg {
   color: #FFE495;
}

.orh-grid-choice .elementor-icon svg {
   width: 1.3em;
   height: 1.3em;
}


/*** NOTRE EQUIPE ***/
.orh-equipe-tabs .e-n-tabs-heading {
   border-bottom: 1px solid #D9D9D9;
   overflow: visible !important;
}

.orh-equipe-tabs button {
   background-color: transparent !important;
   padding: 0 0 10px 0 !important;
   border: none !important;
   position: relative;
}

.orh-equipe-tabs button:hover {
   color: var(--e-global-color-primary) !important;
}

.orh-equipe-tabs button::before {
   content: "";
   position: absolute;
   bottom: -1px;
   left: 0;
   width: 0;
   height: 2px;
   background: var(--e-global-color-primary);
   transition: width 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.orh-equipe-tabs button[aria-selected="true"]::before {
   width: 100%;
}

.btn-back-equipe svg {
   transform: rotate(-180deg);
}

@media screen and (max-width: 767px) {
   .orh-equipe-card {
      padding: 0 10px !important;   
   }

   .orh-equipe-info-icone {
      flex-wrap: nowrap !important;
   }
}


/*** PODCAST LISTING ***/
.orh-podcast-card-img a {
   height: 100%;
}

.podcast-play svg {
   color: #fff;
}


/*** CAS CLIENT LISTING ***/
.orh-filtre-bloc {
   gap: 10px;
}

@media screen and (min-width: 767px) {
   .orh-filtres {
   position: sticky;
   top: 6em;
   align-self: flex-start;
   }
}

.e-loop-item.cas_client .e-con {
   padding: 0;
}

/* Conteneur bordé unique (barre + liste) façon select */
.orh-filtre-bloc .orh-filtre-liste {
  border: 1px solid var(--e-global-color-primary);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  width: 100%;
}

.orh-filtre-bloc .orh-filtre-liste .e-filter {
   gap: 0;
   flex-direction: column !important;
   flex-wrap: nowrap !important;
   overflow-y: auto;
   justify-content: flex-start;
   scrollbar-width: thin;
   scrollbar-color: #eaeaea transparent;
}

/* Chrome, Edge, Safari */
.e-filter::-webkit-scrollbar {
    width: 4px;
}
.e-filter::-webkit-scrollbar-track {
    background: transparent;
}
.e-filter::-webkit-scrollbar-thumb {
    background: #eaeaea;
    border-radius: 3px;
}

/* La barre (toujours visible, figée en haut) */
.orh-filtre-bloc .orh-filtre-barre {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  cursor: pointer;
  user-select: none;
  min-height: 50px;
  color: var(--e-global-color-primary);
}

/* Chevron */
.orh-filtre-bloc .orh-filtre-barre::after {
  content: "";
  width: 9px; height: 9px;
  border-right: 2px solid var(--e-global-color-primary);
  border-bottom: 2px solid var(--e-global-color-primary);
  transform: rotate(45deg);
  transition: transform .3s cubic-bezier(.16,1,.3,1);
  flex: none;
  margin-left: 12px;
  margin-top: -3px;
}
.orh-filtre-bloc.is-open .orh-filtre-barre::after {
  transform: rotate(-135deg);
  margin-top: 3px;
}

/* La zone des options (repliable) */
.orh-filtre-bloc .e-filter {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s cubic-bezier(.16,1,.3,1);
}
.orh-filtre-bloc.is-open .e-filter {
  border-top: 1px solid #eceaf3;
}

/* Les options */
.orh-filtre-bloc .e-filter-item {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 10px 16px;
  font: inherit;
  color: #4a4368;
  cursor: pointer;
  transition: background .2s;
}
.orh-filtre-bloc .e-filter-item:hover { background: #f4f2f9; }
.orh-filtre-bloc .e-filter-item[aria-pressed="true"] {
  color: #1c0d40;
  font-weight: 500;
}

/* Cacher le bouton "Tout" quand il est lui-même actif (= aucun autre filtre sélectionné) */
.orh-filtre-bloc .e-filter-item[data-filter="__all"][aria-pressed="true"] {
  display: none;
}


/*** CAS CLIENT SINGLE ***/
@media screen and (max-width: 767px) {
   .cas_client .e-con {
   padding: 0 18px;
   }
}

.single-expert .e-con.e-parent {
   padding: 0 18px;
}

.cas_client .e-con.e-child {
   padding: 0;
}

.cas_client .e-con-inner, .post .e-con-inner {
   width: min(100%, 1200px)
}

.orh-filtre-bloc {
    scroll-margin-top: 100px;  /* ≈ hauteur de ton header */
}

.orh-cas-client-post.elementor-widget-theme-post-content {
   margin-inline: initial;
}

.orh-cas-client-post .elementor-icon-box-icon {
   margin-top: 10px;
   margin-bottom: 0;
}

.orh-cas-client-post-expertise  {
   display: flex;
   flex-direction: column;
}

.orh-cas-client-post-expertise span:before {
   content: "• ";
}