/* pilotrh-jetons.css */
/* ==========================================================================
   V131 - Identité visuelle PILOT'RH : jetons de design (variables --pr-…).
   Ajouté automatiquement en tête de chaque regroupement CSS (pilotrh_css()).
   Les composants communs (boutons, bannières, en-tête) sont dans
   css/pilotrh-identite.css, chargé en dernier par includes/header.php.
   ========================================================================== */
:root {
  /* Couleurs de marque : marine + violet */
  --pr-navy: #1b155f;          --pr-navy-rgb: 27 21 95;        /* fonds sombres (pied de page, bandeaux) */
  --pr-ink: #121d5a;           --pr-ink-rgb: 18 29 90;         /* texte principal et titres */
  --pr-violet-900: #29217f;    --pr-violet-900-rgb: 41 33 127; /* texte fort, survol */
  --pr-violet: #5136d9;        --pr-violet-rgb: 81 54 217;     /* accent : liens, éléments actifs */
  --pr-violet-500: #6337f4;    --pr-violet-500-rgb: 99 55 244; /* fin du dégradé */
  --pr-violet-300: #aaa5f2;    --pr-violet-300-rgb: 170 165 242; /* accent clair, sur fond sombre */
  --pr-violet-200: #d0cff3;    --pr-violet-200-rgb: 208 207 243;
  --pr-violet-100: #eeefff;    --pr-violet-100-rgb: 238 239 255; /* fonds teintés */
  /* Dégradés signature bleu → violet (uniquement dans les dégradés, jamais en aplat) */
  --pr-blue: #2a72dc;          --pr-blue-rgb: 42 114 220;
  --pr-magenta: #a52bd9;       --pr-magenta-rgb: 165 43 217;
  /* Boutons principaux et bandeaux : texte blanc lisible sur toute la longueur (≥ 4,5:1) */
  --pr-gradient: linear-gradient(110deg, var(--pr-blue), var(--pr-violet-500) 60%, var(--pr-magenta));
  /* Mots mis en valeur dans les titres (texte en dégradé, grands caractères) */
  --pr-gradient-text: linear-gradient(100deg, #087bff, #354aff 52%, #9900e9);

  /* Neutres */
  --pr-surface: #ffffff;       --pr-surface-rgb: 255 255 255;
  --pr-surface-alt: #f4f7ff;   --pr-surface-alt-rgb: 244 247 255; /* fonds de section et de bannière */
  --pr-line: #dde2f3;          --pr-line-rgb: 221 226 243;     /* bordures, séparateurs */
  --pr-subtle: #646c90;        --pr-subtle-rgb: 100 108 144;   /* mentions, texte tertiaire (contraste ≥ 4,5:1 sur les fonds clairs) */
  --pr-muted: #535d83;         --pr-muted-rgb: 83 93 131;      /* texte secondaire */
  --pr-on-dark: #e9e9ff;       --pr-on-dark-rgb: 233 233 255;  /* texte sur fond sombre */

  /* États (le vert-sarcelle est réservé au succès) */
  --pr-success: #176b5a;       --pr-success-rgb: 23 107 90;
  --pr-success-bg: #e4f4ef;    --pr-success-bg-rgb: 228 244 239;
  --pr-warning: #7d5700;       --pr-warning-rgb: 125 87 0;
  --pr-warning-bg: #fff4dc;    --pr-warning-bg-rgb: 255 244 220;
  --pr-error: #a32222;         --pr-error-rgb: 163 34 34;
  --pr-error-bg: #fdecec;      --pr-error-bg-rgb: 253 236 236;
  --pr-etoile: #e5a100;        --pr-etoile-rgb: 229 161 0;     /* étoiles des notes (témoignages) */

  /* Typographie (la police Inter n'est pas embarquée : pile système cohérente sinon) */
  --pr-font: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Roboto, Arial, sans-serif;
  --pr-h1: clamp(2rem, 1.35rem + 2.1vw, 3.2rem);          /* 32 → 51 px */
  --pr-h1-banner: clamp(1.75rem, 1.3rem + 1.4vw, 2.5rem); /* 28 → 40 px, titres posés sur une image */
  --pr-h2: clamp(1.5rem, 1.25rem + 0.9vw, 2.1rem);        /* 24 → 34 px */
  --pr-h3: clamp(1.15rem, 1.08rem + 0.3vw, 1.3rem);       /* 18 → 21 px */

  /* Formes et mise en page */
  --pr-radius-sm: 10px;
  --pr-radius: 16px;
  --pr-radius-lg: 24px;
  --pr-radius-btn: 12px;
  --pr-bordure-bloc: 1.5px;                              /* contour en dégradé des blocs (pilotrh-identite.css) */
  --pr-container: 1200px;
  --pr-gutter: 24px;
  --pr-banner-gap: 24px;       /* espace entre l'en-tête et la bannière */
}
@media (max-width: 640px) { :root { --pr-gutter: 16px; --pr-banner-gap: 16px; } }

/* pilotrh-header-commun.css */
/* V36: navigation publique, deux lignes uniquement. */
.pr36-header{position:relative;z-index:1000}
.pr36-header .pr36-top{max-width:1380px;margin:auto;display:flex;justify-content:flex-end;padding:7px clamp(16px,2vw,30px) 0}
.pr36-account{font-size:13px;font-weight:700;color:var(--pr-violet);text-decoration:none;display:inline-flex;gap:6px;align-items:center}
.pr36-header .pr36-main{max-width:1380px!important;width:100%;margin:auto;display:flex!important;align-items:center!important;justify-content:space-between;flex-wrap:nowrap!important;gap:clamp(10px,1.6vw,25px)!important;padding:5px clamp(16px,2vw,30px) 13px!important;box-sizing:border-box}
.pr36-header .pr36-brand{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;flex:0 0 158px!important;gap:3px!important}
.pr36-header .pr36-brand .pr-brand-logo-officiel{width:145px!important;height:63px!important;max-height:none!important;object-fit:contain!important;object-position:center!important}
.pr36-header .pr36-signature{display:block!important;text-align:center!important;font-size:10px!important;font-weight:700;line-height:1.3;color:var(--pr-violet);white-space:nowrap}
.pr36-header .pr36-nav{display:flex;align-items:center;justify-content:flex-end;flex:1;gap:clamp(0px,.2vw,4px)!important;min-width:0}
.pr36-header .pr36-nav>a,.pr36-header .pr36-parent>a{font-size:clamp(11px,.89vw,13px)!important;white-space:nowrap!important;padding:10px clamp(5px,.6vw,9px)!important;text-decoration:none;color:var(--pr-violet);font-weight:650}
.pr36-header .pr36-dropdown{position:relative;flex:0 0 auto}
.pr36-header .pr36-parent{display:flex;align-items:center;white-space:nowrap}
.pr36-header .pr36-expand{background:none;border:0;color:var(--pr-violet);font-size:19px;cursor:pointer;padding:5px 3px 5px 0;line-height:1}
.pr36-header .pr36-submenu{display:none;position:absolute;top:100%;left:0;min-width:265px;max-width:340px;background:var(--pr-surface);border:1px solid var(--pr-line);border-radius:12px;box-shadow:0 14px 35px rgb(var(--pr-violet-rgb) / 0.14);padding:8px;z-index:1100}
.pr36-header .pr36-submenu a{display:block!important;white-space:normal!important;padding:11px 12px!important;font-size:13px!important;line-height:1.4;color:var(--pr-violet);text-decoration:none;border-radius:8px}
.pr36-header .pr36-submenu a:hover,.pr36-header .pr36-submenu a:focus-visible{background:var(--pr-surface-alt)}
@media(hover:hover) and (pointer:fine){.pr36-header .pr36-dropdown:hover .pr36-submenu{display:block}}
.pr36-header .pr36-dropdown:focus-within .pr36-submenu,.pr36-header .pr36-dropdown.is-expanded .pr36-submenu{display:block}
.pr36-header .pr36-nav .pr-rdv-button{background:var(--pr-violet-300)!important;color:var(--pr-surface)!important;border-radius:99px!important;padding:11px 14px!important}
@media(max-width:1170px){.pr36-header .pr36-main{flex-wrap:wrap!important}.pr36-header .pr-menu-toggle{display:block!important;margin-left:auto}.pr36-header .pr36-nav{display:none;flex-basis:100%!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important}.pr36-header .pr36-nav.is-open{display:flex!important}.pr36-header .pr36-parent{justify-content:space-between}.pr36-header .pr36-nav>a,.pr36-header .pr36-parent>a{font-size:15px!important;padding:12px!important}.pr36-header .pr36-submenu{position:static;min-width:0;max-width:none;box-shadow:none;border-radius:8px;margin:0 0 7px 12px}.pr36-header .pr36-brand{flex-basis:150px!important}}
@media(max-width:480px){.pr36-header .pr36-brand .pr-brand-logo-officiel{width:128px!important;height:55px!important}.pr36-header .pr36-signature{font-size:9px!important}}

/* V37 - Header equilibre : logo et navigation sur une ligne. */
.pr36-header .pr36-top{max-width:1560px!important;padding:7px clamp(18px,2.3vw,36px) 0!important}
.pr36-header .pr36-main{max-width:1560px!important;gap:clamp(20px,2.2vw,38px)!important;padding:3px clamp(18px,2.3vw,36px) 12px!important}
.pr36-header .pr36-brand{flex:0 0 176px!important;min-width:176px!important;gap:5px!important}
.pr36-header .pr36-brand .pr-brand-logo-officiel{width:160px!important;height:72px!important;object-fit:contain!important}
.pr36-header .pr36-signature{font-size:11px!important;letter-spacing:.01em!important;line-height:1.35!important}
.pr36-header .pr36-nav{flex:1 1 auto!important;justify-content:space-between!important;gap:clamp(3px,.45vw,9px)!important;min-width:0!important}
.pr36-header .pr36-nav>a,.pr36-header .pr36-parent>a{font-size:clamp(11px,.78vw,13px)!important;padding:10px clamp(3px,.38vw,7px)!important}
.pr36-header .pr36-nav .pr-rdv-button{padding:11px 15px!important;flex-shrink:0}
@media(max-width:1250px){.pr36-header .pr36-main{flex-wrap:wrap!important}.pr36-header .pr-menu-toggle{display:block!important;margin-left:auto}.pr36-header .pr36-nav{display:none!important;flex-basis:100%!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important}.pr36-header .pr36-nav.is-open{display:flex!important}.pr36-header .pr36-parent{justify-content:space-between}.pr36-header .pr36-nav>a,.pr36-header .pr36-parent>a{font-size:15px!important;padding:12px!important}.pr36-header .pr36-submenu{position:static;min-width:0;max-width:none;box-shadow:none;border-radius:8px;margin:0 0 7px 12px}}
@media(max-width:480px){.pr36-header .pr36-brand{flex:0 0 150px!important;min-width:150px!important}.pr36-header .pr36-brand .pr-brand-logo-officiel{width:140px!important;height:62px!important}.pr36-header .pr36-signature{font-size:10px!important}}

/* V38: typographie de navigation 15px, icones a gauche, chevrons a droite. */
.pr36-header .pr36-main{max-width:1720px!important;gap:clamp(12px,1.2vw,22px)!important;padding-left:clamp(14px,1.5vw,28px)!important;padding-right:clamp(14px,1.5vw,28px)!important}
.pr36-header .pr36-top{max-width:1720px!important;padding-right:clamp(14px,1.5vw,28px)!important}
.pr36-header .pr36-brand{flex:0 0 176px!important;min-width:176px!important}
.pr36-header .pr36-nav{gap:clamp(2px,.35vw,7px)!important;justify-content:space-between!important}
.pr36-header .pr36-nav>a,.pr36-header .pr36-parent>a{display:inline-flex!important;align-items:center!important;gap:6px!important;font-size:15px!important;line-height:1.25!important;padding:11px 5px!important;white-space:nowrap!important}
.pr36-header .pr36-nav .pr-rdv-button{display:inline-flex!important;align-items:center!important;gap:7px!important;font-size:15px!important;padding:12px 15px!important}
.pr36-header .pr38-icon{width:17px;height:17px;flex:0 0 17px;color:var(--pr-subtle)}
.pr36-header .pr-rdv-button .pr38-icon{color:var(--pr-surface)}
.pr36-header .pr36-parent{gap:2px}
.pr36-header .pr36-expand{font-size:18px!important;padding:5px 2px!important}
.pr36-header .pr36-submenu a{font-size:14px!important}
@media(max-width:1500px){.pr36-header .pr36-main{flex-wrap:wrap!important}.pr36-header .pr-menu-toggle{display:block!important;margin-left:auto}.pr36-header .pr36-nav{display:none!important;flex-basis:100%!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important}.pr36-header .pr36-nav.is-open{display:flex!important}.pr36-header .pr36-parent{justify-content:space-between}.pr36-header .pr36-nav>a,.pr36-header .pr36-parent>a{font-size:15px!important;padding:12px!important}.pr36-header .pr36-submenu{position:static;min-width:0;max-width:none;box-shadow:none;border-radius:8px;margin:0 0 7px 12px}}
@media(max-width:480px){.pr36-header .pr36-brand{flex:0 0 150px!important;min-width:150px!important}}

/* V40 : groupe de navigation centre dans la zone a droite du logo. */
/* V39 : rapprochement des menus d'environ deux tiers sur grand ecran. */
@media (min-width:1501px) {
  .pr36-header .pr36-nav {
    justify-content: center !important;
    gap: clamp(10px, 1.15vw, 20px) !important;
  }
  .pr36-header .pr36-main { justify-content: space-between !important; }
  .pr36-header .pr36-nav > a,
  .pr36-header .pr36-parent > a { padding-left: 3px !important; padding-right: 3px !important; }
}

/* V41 - Header sur la meme grille horizontale que les blocs de contenu. */
@media (min-width:1501px) {
  .pr36-header .pr36-top,
  .pr36-header .pr36-main {
    width: 100% !important;
    max-width: 1360px !important;
    margin-inline: auto !important;
    box-sizing: border-box !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .pr36-header .pr36-nav {
    justify-content: flex-end !important;
    gap: clamp(10px, 1.15vw, 20px) !important;
  }
}

/* V42 — Contact button, navy, matching the RDV pill */
.pr36-header .pr36-nav > a.pr42-contact-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 12px 15px !important;
  border-radius: 999px !important;
  background: var(--pr-ink) !important;
  color: var(--pr-surface) !important;
  font-size: 15px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}
.pr36-header .pr36-nav > a.pr42-contact-button .pr38-icon { color: var(--pr-surface) !important; }
.pr36-header .pr36-nav > a.pr42-contact-button:hover,
.pr36-header .pr36-nav > a.pr42-contact-button:focus-visible {
  background: var(--pr-ink) !important;
  color: var(--pr-surface) !important;
}
.pr36-header .pr36-nav > a.pr42-contact-button:focus-visible { outline: 2px solid var(--pr-ink); outline-offset: 3px; }


