/* ==========================================================================
   JustiComm · page « Publicité en ligne » (Google Ads, Microsoft Ads, LinkedIn, Facebook et Instagram)
   v3, 22/10/2026 (Raoudha : « tu peux largement mieux ») : haut de page en vidéo Remotion 3D,
   écrans dessinés des trois canaux, vidéo du parcours, sélecteur interactif des professions,
   document de budget signé. Mise en page éditoriale, charte et composants communs, aucun visuel de l'accueil.
   Animations courtes jouées une fois (vidéos : bouton pause) ; état final fixe si « moins d'animations »
   ou sans JavaScript (le sélecteur affiche alors les six professions à la suite).
   Préfixe : pel-
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Communs à la page
   -------------------------------------------------------------------------- */
.pel .titre-section { font-size: clamp(2.25rem, 1.7rem + 1.7vw, 3.5rem); line-height: 1.05; color: var(--titre); text-wrap: balance; }
.pel-or { font-style: italic; color: var(--or-texte); }
.surface-sombre .pel-or, .surface-nuit .pel-or { color: var(--or-clair); }
.pel-texte { margin-top: var(--e-4); max-width: 42rem; font-size: var(--t-corps); line-height: 1.65; color: var(--texte); }
.surface-sombre .pel-texte, .surface-nuit .pel-texte { color: var(--creme-doux); }
.pel-tete { margin-bottom: clamp(2.5rem, 5vw, 4rem); }

.pel-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; margin-top: clamp(1.75rem, 3vw, 2.5rem); }

.pel-actions .lien-suite { margin-top: 0; }
.pel-masque { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@keyframes pel-monte { from { opacity: 0; translate: 0 24px; } to { opacity: 1; translate: 0 0; } }
@keyframes pel-apparait { from { opacity: 0; } to { opacity: 1; } }
@keyframes pel-pastille { from { opacity: 0; scale: 0.7; } to { opacity: 1; scale: 1; } }
@keyframes pel-remplit { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes pel-trace { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes pel-frappe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes pel-onde { from { opacity: 0; scale: 0.3; } 50% { opacity: 1; } to { opacity: 0; scale: 1.15; } }
@keyframes pel-tampon { from { opacity: 0; scale: 1.8; } to { opacity: 1; scale: 1; } }

/* Bouton rond lecture / pause (vidéos) */
.pel-lecture {
  flex: none; display: none; place-items: center; width: 48px; height: 48px; padding: 0;
  border: 1px solid rgba(224, 189, 142, 0.6); border-radius: 50%;
  background: rgba(2, 24, 24, 0.6); color: var(--or-clair); cursor: pointer; backdrop-filter: blur(6px);
  transition: background-color var(--d) var(--ease-sortie);
}
.js .pel-lecture { display: grid; }
.pel-lecture svg { width: 20px; height: 20px; fill: currentColor; }
.pel-lecture__pause { display: none; }
.est-en-lecture .pel-lecture__pause { display: block; }
.est-en-lecture .pel-lecture__lire { display: none; }
.pel-lecture:hover { background: var(--petrole); }
.pel-lecture:focus-visible { outline: 2px solid var(--or); outline-offset: 3px; }

/* --------------------------------------------------------------------------
   1. Haut de page (v4, 23/10/2026, comme la page Réseaux sociaux) : fil d'Ariane sur fond clair,
   vidéo pleine largeur sous la barre du haut, texte dessous aligné à gauche sur toute la largeur
   -------------------------------------------------------------------------- */
body:has(.pel-haut) .entete__fond { opacity: 1; }   /* barre du haut avec son fond dès le départ */
.pel-haut { position: relative; padding: var(--h-entete) 0 clamp(2rem, 4vw, 3rem); background: var(--papier); }
.pel-haut__ariane .pel-ariane { margin: 0; padding-block: 0.9rem; }
.pel-ariane { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; font-size: 0.875rem; color: var(--taupe); }
.pel-ariane a { color: inherit; text-underline-offset: 3px; }
.pel-ariane [aria-current] { color: var(--encre); }
.pel-haut__bandeau { position: relative; background: var(--petrole-900); }
/* affiche en fond (même cadrage que la vidéo) : le navigateur ne télécharge que celle de l'écran ; visible tant que la vidéo ne joue pas */
.pel-haut__video { display: block; width: 100%; height: auto; aspect-ratio: 1920 / 900; object-fit: cover; background: var(--petrole-900) url("../img/videos/publicite-en-ligne-google-ads-avocat-justicomm-nice.webp") center / cover no-repeat; }
@media (max-width: 47.99em) and (orientation: portrait) { .pel-haut__video { aspect-ratio: 1080 / 1350; object-fit: contain; background-image: url("../img/videos/publicite-en-ligne-google-ads-avocat-justicomm-nice-720.webp"); } }   /* au téléphone : version verticale, jamais recadrée */
.pel-haut__bouton { position: absolute; top: 1rem; right: 1rem; }
.pel-haut__texte { margin-top: clamp(2.25rem, 4.5vw, 3.5rem); }
.pel-haut__titre { margin: 0; font-family: var(--f-titre); font-weight: 500; color: var(--petrole); }
.pel-haut__sur { display: flex; flex-wrap: wrap; margin-bottom: var(--e-4); font-size: 1rem; letter-spacing: 0.2em; line-height: 1.5; color: var(--texte-doux); }
.pel-haut__phrase { display: block; font-size: clamp(2rem, 1.4rem + 1.9vw, 3.25rem); line-height: 1.06; text-wrap: pretty; }   /* comme le H1 du Référencement local */
.pel-haut__accroche { margin-top: var(--e-5); font: italic 500 clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem) / 1.38 var(--f-titre); color: var(--petrole); text-wrap: pretty; }
.pel-haut__intro { margin-top: var(--e-2); font-size: var(--t-corps); line-height: 1.6; color: var(--encre); text-wrap: pretty; }
.pel-haut .pel-actions { margin-top: var(--e-5); gap: 12px 18px; }
.pel-engagements { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; margin: clamp(1.75rem, 3vw, 2.25rem) 0 0; padding: 0; list-style: none; font-size: 0.9375rem; color: var(--encre); }
.pel-engagements li { display: inline-flex; align-items: center; gap: 0.55rem; }
.pel-engagements li::before { content: "✓"; display: grid; place-items: center; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--petrole); font-size: 0.6875rem; color: var(--or); }
.pel-professions { display: flex; flex-wrap: wrap; gap: 0.25rem 1.5rem; margin: clamp(2rem, 4vw, 2.75rem) 0 0; padding: var(--e-3) 0 0; list-style: none; border-top: 1px solid var(--lin); font-size: 0.9375rem; }
.pel-professions a { display: inline-flex; align-items: center; min-height: 44px; color: var(--taupe); text-decoration: none; }
.pel-professions a:hover, .pel-professions a:focus-visible { color: var(--petrole); }

/* --------------------------------------------------------------------------
   2. D'abord, une priorité claire (v5, 23/10/2026) : cinq professionnels en photo, chacun avec sa priorité
   -------------------------------------------------------------------------- */
.pel-portraits { display: grid; gap: var(--e-6) var(--gouttiere); margin: 0; padding: 0; list-style: none; }
@media (min-width: 40em) { .pel-portraits { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64em) { .pel-portraits { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--e-5); } }
.pel-portrait { display: flex; flex-direction: column; }
.pel-portrait__photo {
  position: relative; aspect-ratio: 3 / 4; overflow: hidden; border-radius: 4px; background: var(--petrole);
  box-shadow: 0 1.5rem 2.5rem -1.5rem rgba(2, 24, 24, 0.45);
}
.pel-photo { display: block; width: 100%; height: 100%; object-fit: cover; transition: scale 0.9s var(--ease-sortie); }
.pel-portrait:hover .pel-photo { scale: 1.04; }

.pel-portrait__qui { margin: var(--e-4) 0 0; padding-top: var(--e-3); border-top: 1px solid var(--or-400); font-size: 0.8125rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--or-texte); }
.pel-portrait__quoi { margin: var(--e-2) 0 0; font-size: 1.0625rem; line-height: 1.55; color: var(--encre); }
.pel-portraits.est-visible .pel-portrait { animation: pel-monte 0.8s var(--ease-sortie) both; }
.pel-portraits.est-visible .pel-portrait:nth-child(2) { animation-delay: 0.1s; }
.pel-portraits.est-visible .pel-portrait:nth-child(3) { animation-delay: 0.2s; }
.pel-portraits.est-visible .pel-portrait:nth-child(4) { animation-delay: 0.3s; }
.pel-portraits.est-visible .pel-portrait:nth-child(5) { animation-delay: 0.4s; }
.pel-exergue { margin: clamp(2.5rem, 5vw, 3.5rem) auto 0; max-width: none; text-align: center; font: italic 500 clamp(1.375rem, 1.2rem + 0.5vw, 1.75rem) / 1.3 var(--f-titre); color: var(--petrole); text-wrap: pretty; }
.pel-exergue::before { content: ""; display: block; width: 48px; height: 1px; margin: 0 auto var(--e-4); background: var(--bronze); }

/* --------------------------------------------------------------------------
   3. Le bon canal : trois écrans dessinés
   -------------------------------------------------------------------------- */
.pel-canaux__grille { display: grid; gap: clamp(3rem, 5vw, 2.5rem) var(--gouttiere); }
@media (min-width: 60em) { .pel-canaux__grille { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pel-scene {
  position: relative; display: grid; place-items: center; height: 19rem; margin-bottom: var(--e-5); overflow: hidden;
  background: radial-gradient(ellipse 70% 70% at 50% 40%, rgba(255, 255, 255, 0.7), transparent 70%), linear-gradient(180deg, #E7E1D5, #DCD4C5);
  border-radius: 4px;
}
.pel-canal__titre { margin: 0; font: 500 clamp(1.625rem, 1.4rem + 0.7vw, 2rem) / 1.15 var(--f-titre); color: var(--petrole); }
.pel-canal__titre span { display: block; margin-top: 6px; font-style: italic; font-size: 0.8em; color: var(--or-texte); }
.pel-canal__texte { margin: var(--e-3) 0 0; font-size: 1.0625rem; line-height: 1.65; color: var(--encre); }

/* Ordinateur portable : la recherche */
.pel-scene--portable { place-items: end center; padding-bottom: 2.25rem; }
.pel-portable { width: min(84%, 21rem); padding: 9px 9px 0; border-radius: 14px 14px 0 0; background: linear-gradient(180deg, #213332, #0F1D1D); box-shadow: 0 30px 50px -20px rgba(2, 24, 24, 0.55); }
.pel-portable__ecran { height: 12.5rem; padding: 12px 14px; overflow: hidden; border-radius: 5px 5px 0 0; background: #fff; }
.pel-portable__barre { display: flex; align-items: center; gap: 7px; margin: 0; padding: 6px 12px; border: 1px solid var(--lin); border-radius: 999px; font-size: 0.8125rem; color: var(--encre); }
.pel-portable__barre svg { flex: none; width: 13px; height: 13px; fill: none; stroke: var(--taupe); stroke-width: 2.4; stroke-linecap: round; }
.pel-tape { white-space: nowrap; overflow: hidden; }
.pel-portable__annonce { margin-top: 10px; padding: 8px 10px; border: 1.5px solid var(--or); border-radius: 7px; box-shadow: 0 0 0 4px rgba(224, 189, 142, 0.18); }
.pel-portable__source { margin: 0; font-size: 0.6875rem; color: var(--taupe); }
.pel-portable__source b { font-weight: 600; color: var(--encre); }
.pel-portable__titre { margin: 3px 0 0; font-size: 0.875rem; font-weight: 500; color: var(--petrole); }
.pel-portable__desc { margin: 2px 0 0; font-size: 0.75rem; color: var(--encre); }
.pel-portable__resultat { display: grid; gap: 5px; margin-top: 11px; }
.pel-portable__resultat i { display: block; height: 6px; border-radius: 3px; background: var(--lin); }
.pel-portable__resultat i:nth-child(1) { width: 34%; }
.pel-portable__resultat i:nth-child(2) { width: 62%; height: 8px; background: #D5DEDC; }
.pel-portable__resultat i:nth-child(3) { width: 88%; }
.pel-portable__socle { position: absolute; bottom: 1.6rem; width: min(96%, 24rem); height: 12px; border-radius: 2px 2px 14px 14px; background: linear-gradient(180deg, #CFC8BB, #9E978B); box-shadow: 0 14px 20px -10px rgba(2, 24, 24, 0.5); }
.pel-portable__socle::before { content: ""; position: absolute; left: 50%; top: 0; width: 70px; height: 5px; margin-left: -35px; border-radius: 0 0 6px 6px; background: rgba(0, 0, 0, 0.12); }

/* Fil LinkedIn : publication sponsorisée et public */
.pel-fil { width: min(84%, 19rem); padding: 14px; border-radius: 10px; background: #fff; box-shadow: 0 24px 44px -18px rgba(2, 24, 24, 0.45); }
.pel-fil__tete { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; }
.pel-fil__avatar { flex: none; width: 32px; height: 32px; border-radius: 6px; background: linear-gradient(135deg, var(--petrole), var(--petrole-600)); box-shadow: inset 0 0 0 2px rgba(224, 189, 142, 0.6); }
.pel-fil__tete span { display: grid; line-height: 1.2; }
.pel-fil__tete b { font-size: 0.8125rem; font-weight: 600; color: var(--encre); }
.pel-fil__tete small { font-size: 0.6875rem; color: var(--taupe); }
.pel-fil__ligne { display: block; height: 6px; margin-top: 6px; border-radius: 3px; background: var(--lin); }
.pel-fil__ligne--courte { width: 70%; }
.pel-fil__visuel { position: relative; display: grid; place-items: end start; height: 6.5rem; margin: 12px -14px 0; padding: 10px 14px; overflow: hidden; background: radial-gradient(circle at 78% 40%, rgba(224, 189, 142, 0.45), transparent 40%), linear-gradient(140deg, var(--petrole-600), var(--petrole-profond)); }
.pel-fil__visuel span { font: italic 500 1.25rem / 1 var(--f-titre); color: var(--creme); }
.pel-fil__action { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 10px 0 0; font-size: 0.6875rem; color: var(--taupe); }
.pel-fil__action b { flex: none; padding: 4px 10px; border: 1px solid var(--petrole); border-radius: 999px; font-size: 0.6875rem; font-weight: 600; color: var(--petrole); }
.pel-fil__public { position: absolute; right: 6%; top: 10%; display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.pel-fil__public li { padding: 5px 12px; border-radius: 999px; background: var(--petrole-profond); border: 1px solid var(--or); box-shadow: 0 10px 20px -8px rgba(2, 24, 24, 0.6); font-size: 0.75rem; color: var(--creme); text-align: center; }

/* Téléphone : Instagram */
.pel-telephone { width: 10.5rem; padding: 7px; border-radius: 28px; background: linear-gradient(180deg, #233534, #0E1B1B); box-shadow: 0 30px 50px -18px rgba(2, 24, 24, 0.6), inset 0 0 0 1px #3A4A4A; rotate: -4deg; }
.pel-telephone__ecran { height: 17rem; overflow: hidden; border-radius: 22px; background: #fff; }
.pel-telephone__encoche { width: 56px; height: 14px; margin: 6px auto 4px; border-radius: 7px; background: #0E1B1B; }
.pel-telephone__tete { display: flex; align-items: center; gap: 7px; margin: 0; padding: 4px 9px 7px; }
.pel-telephone__tete i { flex: none; width: 24px; height: 24px; border-radius: 50%; background: radial-gradient(circle, var(--petrole) 55%, transparent 58%), linear-gradient(135deg, var(--or), var(--cuivre)); }
.pel-telephone__tete span { display: grid; line-height: 1.15; }
.pel-telephone__tete b { font-size: 0.6875rem; font-weight: 600; color: var(--encre); }
.pel-telephone__tete small { font-size: 0.6875rem; color: var(--taupe); }
.pel-telephone__visuel { position: relative; height: 9.25rem; overflow: hidden; background: linear-gradient(170deg, #1E5554, var(--petrole-profond)); }
.pel-telephone__onde { position: absolute; left: 50%; top: 55%; width: 120px; height: 120px; margin: -60px 0 0 -60px; border: 1px solid rgba(224, 189, 142, 0.6); border-radius: 50%; }
.pel-telephone__onde + .pel-telephone__onde { width: 64px; height: 64px; margin: -32px 0 0 -32px; }
.pel-telephone__repere { position: absolute; left: 50%; top: 55%; width: 16px; height: 16px; margin: -16px 0 0 -8px; border-radius: 50% 50% 50% 0; rotate: -45deg; background: #D08A5E; box-shadow: 0 0 18px var(--or); }
.pel-telephone__ville { position: absolute; left: 10px; bottom: 8px; font: italic 500 1.125rem / 1 var(--f-titre); color: var(--creme); }
.pel-telephone__action { display: flex; justify-content: space-between; margin: 0 9px; padding: 7px 0; border-bottom: 1px solid var(--lin); font-size: 0.6875rem; font-weight: 600; color: var(--petrole); }
.pel-telephone__icones { display: flex; gap: 8px; margin: 0; padding: 8px 9px; }
.pel-telephone__icones i { width: 14px; height: 14px; border: 1.5px solid var(--encre); border-radius: 50%; }

/* Animations des écrans (une fois, à l'arrivée) */
.pel-canal.est-visible .pel-portable, .pel-canal.est-visible .pel-fil, .pel-canal.est-visible .pel-telephone { animation: pel-monte 0.9s var(--ease-sortie) 0.1s both; }
.pel-canal.est-visible .pel-tape { animation: pel-frappe 1.1s steps(24, end) 0.7s both; }
.pel-canal.est-visible .pel-portable__annonce { animation: pel-monte 0.6s var(--ease-sortie) 1.9s both; }
.pel-canal.est-visible .pel-portable__resultat { animation: pel-apparait 0.5s ease 1.7s both; }
.pel-canal.est-visible .pel-fil__public li { animation: pel-pastille 0.45s var(--ease-sortie) both; }
.pel-canal.est-visible .pel-fil__public li:nth-child(1) { animation-delay: 1s; }
.pel-canal.est-visible .pel-fil__public li:nth-child(2) { animation-delay: 1.25s; }
.pel-canal.est-visible .pel-telephone__onde { animation: pel-onde 1.6s var(--ease-sortie) 0.9s 2; }
.pel-canal.est-visible .pel-telephone__onde + .pel-telephone__onde { animation-delay: 1.2s; }

.pel-conseil {
  display: flex; align-items: center; justify-content: center; gap: var(--e-4);
  max-width: 54rem; margin: clamp(2.5rem, 5vw, 3.5rem) auto 0; padding-top: clamp(2rem, 4vw, 2.5rem); border-top: 1px solid #D6CFC1;
  font: italic 500 clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem) / 1.4 var(--f-titre); color: var(--petrole);
}
.pel-conseil__picto { flex: none; width: 40px; height: 40px; fill: none; stroke: var(--or-texte); stroke-width: 1.3; stroke-linejoin: round; }

/* --------------------------------------------------------------------------
   4. Du premier clic à la prise de contact : vidéo + quatre étapes (fond nuit)
   -------------------------------------------------------------------------- */
.pel-parcours { background: radial-gradient(ellipse 70% 50% at 50% 30%, rgba(224, 189, 142, 0.1), transparent 70%), var(--petrole-profond); }
.pel-film { position: relative; max-width: 72rem; margin: 0 auto; }
.pel-film__video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: var(--petrole-900) url("../img/videos/publicite-linkedin-cabinet-comptable-parcours-justicomm-nice.webp") center / cover no-repeat; border-radius: 6px; box-shadow: 0 3rem 6rem -2rem rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(224, 189, 142, 0.35); }
.pel-film__bouton { position: absolute; right: clamp(0.75rem, 2vw, 1.5rem); bottom: clamp(0.75rem, 2vw, 1.5rem); }
.pel-film__legende { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pel-etapes { display: grid; gap: clamp(2rem, 4vw, 2.5rem) var(--gouttiere); margin: clamp(3rem, 6vw, 4.5rem) 0 0; padding: 0; list-style: none; }
@media (min-width: 40em) { .pel-etapes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 72em) { .pel-etapes { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pel-etape { padding-top: var(--e-5); border-top: 1px solid rgba(224, 189, 142, 0.4); }
.pel-etape__num { display: block; font: italic 500 3rem / 1 var(--f-titre); color: var(--or-clair); }
.pel-etape__titre { margin: var(--e-3) 0 0; font: 500 clamp(1.5rem, 1.35rem + 0.5vw, 1.75rem) / 1.2 var(--f-titre); color: var(--creme); }
.pel-etape p { margin: var(--e-3) 0 0; font-size: 1.0625rem; line-height: 1.65; color: var(--creme-doux); }

/* --------------------------------------------------------------------------
   5. Chaque mois, des décisions expliquées
   -------------------------------------------------------------------------- */
.pel-rapport__grille { display: grid; gap: clamp(3rem, 6vw, 5rem); align-items: center; }
@media (min-width: 60em) { .pel-rapport__grille { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); } }
.pel-questions { display: grid; gap: var(--e-4); margin: clamp(1.75rem, 3vw, 2.25rem) 0 var(--e-3); padding: 0; list-style: none; }
.pel-questions li { position: relative; padding-left: 2.25rem; font: italic 500 clamp(1.5rem, 1.25rem + 0.8vw, 2rem) / 1.25 var(--f-titre); color: var(--petrole); }
.pel-questions li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 20px; height: 1px; background: var(--bronze); }

.pel-doc__barres { display: grid; gap: 7px; margin: 0; }
.pel-doc__barres i { display: block; width: calc(var(--l) * 100%); height: 10px; border-radius: 5px; background: linear-gradient(90deg, var(--petrole), var(--petrole-600)); transform-origin: left center; }
.pel-doc__jauge { display: flex; gap: 3px; height: 14px; margin: 0; }
.pel-doc__jauge i { display: block; flex: none; width: calc(var(--l) * 100%); border-radius: 3px; background: var(--petrole); transform-origin: left center; }
.pel-doc__jauge i:nth-child(2) { background: var(--or-400); }
.pel-doc__jauge i:nth-child(3) { background: var(--sauge); }
.pel-doc__contacts { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.pel-doc__contacts span { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; background: var(--papier); font-size: 0.8125rem; color: var(--encre); }
.pel-doc__contacts span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #D08A5E; }
.pel-doc__ajust { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.pel-doc__ajust li { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-left: 2px solid var(--or-400); background: #FBF8F2; font-size: 0.875rem; color: var(--encre); }
.pel-doc__ajust li::before { flex: none; width: 1.25em; font-weight: 700; text-align: center; color: var(--or-texte); }
.pel-doc__ajust li:nth-child(1)::before { content: "✕"; }
.pel-doc__ajust li:nth-child(2)::before { content: "✎"; }
.pel-doc__ajust li:nth-child(3)::before { content: "↗"; }
.pel-doc__ajust li:nth-child(4)::before { content: "⇄"; }

/* --------------------------------------------------------------------------
   Encadré : ce qui dépend de nous
   -------------------------------------------------------------------------- */
.pel-promesse { padding-block: clamp(4rem, 8vw, 6.5rem); text-align: center; background: radial-gradient(ellipse 60% 100% at 50% 0%, rgba(205, 166, 117, 0.16), transparent 70%), var(--petrole-profond); }
.pel-promesse__texte { max-width: 56rem; margin: 0 auto; font: 500 clamp(1.5rem, 1.1rem + 1.4vw, 2.375rem) / 1.3 var(--f-titre); color: var(--creme); text-wrap: balance; }
.pel-promesse__texte::before { content: ""; display: block; width: 56px; height: 1px; margin: 0 auto var(--e-6); background: var(--or); }
.pel-promesse__texte strong { display: block; margin-top: var(--e-4); font-style: italic; font-weight: 600; color: var(--or-clair); }

/* --------------------------------------------------------------------------
   6. Profession par profession : sélecteur
   -------------------------------------------------------------------------- */
.pel-sel { max-width: 72rem; margin: 0 auto; }
.pel-sel__onglets { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: clamp(1.75rem, 3vw, 2.5rem); }
.pel-sel:not(.est-actif) .pel-sel__onglets { display: none; }
.pel-sel__onglet {
  min-height: 46px; padding: 10px 20px; border: 1px solid var(--bronze); border-radius: 999px; background: transparent;
  font: 500 1rem / 1.2 var(--f-texte); color: var(--petrole); cursor: pointer;
  transition: background-color var(--d) var(--ease-sortie), color var(--d) var(--ease-sortie), border-color var(--d) var(--ease-sortie);
}
.pel-sel__onglet:hover { background: rgba(156, 121, 82, 0.1); }
.pel-sel__onglet[aria-selected="true"] { background: var(--petrole); border-color: var(--petrole); color: var(--creme); }
.pel-sel__onglet--non { border-style: dashed; }
.pel-sel__onglet--non[aria-selected="true"] { background: #8A4A28; border-color: #8A4A28; border-style: solid; color: #FFF6EC; }
.pel-sel__onglet:focus-visible { outline: 2px solid var(--petrole); outline-offset: 3px; }
.pel-sel__panneau {
  display: grid; gap: clamp(2rem, 4vw, 3.5rem); align-items: center;
  padding: clamp(1.75rem, 4vw, 3.25rem); background: var(--papier); border: 1px solid #D6CFC1; border-top: 3px solid var(--or-400);
  box-shadow: 0 2.5rem 4rem -2rem rgba(2, 24, 24, 0.28);
}
.pel-sel__panneau + .pel-sel__panneau { margin-top: var(--e-5); }
.pel-sel.est-actif .pel-sel__panneau + .pel-sel__panneau { margin-top: 0; }
.pel-sel__panneau[hidden] { display: none; }
.pel-sel__panneau:focus-visible { outline: 2px solid var(--petrole); outline-offset: 3px; }
.pel-sel__panneau.est-change { animation: pel-apparait 0.45s ease both; }
.pel-sel__panneau.est-change .pel-sel__exemple { animation: pel-monte 0.6s var(--ease-sortie) 0.05s both; }
@media (min-width: 56em) { .pel-sel__panneau { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.pel-sel__panneau--non { border-top-color: #8A4A28; }
.pel-sel__nom { margin: 0; font: 500 clamp(2rem, 1.6rem + 1.3vw, 2.75rem) / 1.1 var(--f-titre); color: var(--petrole); }
.pel-sel__nom a { color: inherit; text-decoration: underline; text-decoration-color: var(--or-400); text-decoration-thickness: 1px; text-underline-offset: 6px; }
.pel-sel__nom a:hover { text-decoration-color: var(--petrole); }
.pel-sel__canaux { display: flex; flex-wrap: wrap; gap: 8px; margin: var(--e-5) 0 0; padding: 0; list-style: none; }
.pel-sel__canaux li { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; border-radius: 999px; font-size: 0.9375rem; }
.pel-sel__canaux .est-ouvert { background: var(--petrole); color: var(--creme); }
.pel-sel__canaux .est-ouvert::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--or); }
.pel-sel__canaux .est-ferme { border: 1px dashed #B8AFA0; color: var(--taupe); text-decoration: line-through; text-decoration-color: rgba(110, 104, 98, 0.6); }
.pel-sel__canaux .est-non { background: #8A4A28; color: #FFF6EC; font-weight: 600; }
.pel-sel__texte { margin: var(--e-5) 0 0; font-size: var(--t-corps); line-height: 1.65; color: var(--encre); }
.pel-sel__texte a { color: var(--petrole); text-decoration-color: var(--bronze); text-underline-offset: 3px; }

.pel-sel__exemple { position: relative; margin: 0; padding: clamp(1.25rem, 3vw, 2rem); background: linear-gradient(160deg, var(--petrole-600), var(--petrole-profond)); border-radius: 4px; }
.pel-ex { padding: 16px 18px; border-radius: 10px; background: #fff; border: 2px solid var(--or); box-shadow: 0 0 0 6px rgba(224, 189, 142, 0.18), 0 24px 40px -16px rgba(0, 0, 0, 0.5); }
.pel-ex__source { margin: 0; font-size: 0.8125rem; color: var(--taupe); }
.pel-ex__source b { font-weight: 600; color: var(--encre); }
.pel-ex__titre { margin: 6px 0 0; font: 500 1.1875rem / 1.3 var(--f-texte); color: var(--petrole); }
.pel-ex__desc { margin: 6px 0 0; font-size: 0.9375rem; line-height: 1.5; color: var(--encre); }
.pel-ex__controle { display: inline-flex; align-items: center; gap: 8px; margin: 16px 0 0; padding: 7px 14px 7px 10px; border-radius: 999px; background: var(--or); font-size: 0.9375rem; font-weight: 500; color: var(--petrole-profond); }
.pel-ex__controle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.pel-ex--non { border-color: #B8AFA0; box-shadow: none; opacity: 0.55; }
.pel-ex--non .pel-ex__titre, .pel-ex--non .pel-ex__desc { height: 10px; border-radius: 5px; background: var(--lin); }
.pel-ex--non .pel-ex__titre { width: 70%; height: 14px; }
.pel-ex--non .pel-ex__desc--courte { width: 55%; }
.pel-ex__tampon {
  position: absolute; left: 50%; top: 50%; margin: 0; padding: 10px 18px; translate: -50% -50%; rotate: -8deg;
  border: 3px solid #E7A57D; border-radius: 6px; background: rgba(2, 24, 24, 0.82);
  font-size: 1rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #F6C9A9; white-space: nowrap;
}

/* --------------------------------------------------------------------------
   7. Vous savez ce que vous engagez : document signé + deux flux
   -------------------------------------------------------------------------- */
.pel-tarif__grille { display: grid; gap: clamp(3rem, 6vw, 5rem); align-items: center; }
@media (min-width: 60em) { .pel-tarif__grille { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); } }

.pel-tarif .titre-section { max-width: 16ch; }
.pel-flux { margin-top: clamp(1.75rem, 3.5vw, 2.5rem); border-top: 1px solid rgba(224, 189, 142, 0.3); }
.pel-flux__bloc { padding: clamp(1.5rem, 3vw, 2rem) 0; border-bottom: 1px solid rgba(224, 189, 142, 0.3); }
.pel-flux__chemin { display: flex; align-items: center; gap: 10px; max-width: 26rem; margin: 0 0 var(--e-4); font-size: 0.8125rem; }
.pel-flux__chemin span { flex: none; padding: 3px 12px; border-radius: 999px; border: 1px solid rgba(224, 189, 142, 0.45); color: var(--creme-doux); }
.pel-flux__chemin span:last-child { background: var(--or); border-color: var(--or); color: var(--petrole-profond); font-weight: 600; }
.pel-flux__chemin i { position: relative; flex: 1; min-width: 24px; height: 1px; background: var(--or); transform-origin: left center; }
.pel-flux__chemin i::after { content: ""; position: absolute; right: -1px; top: -4px; width: 8px; height: 8px; border-top: 1px solid var(--or); border-right: 1px solid var(--or); rotate: 45deg; }
.pel-flux__titre { margin: 0; font: 600 clamp(1.375rem, 1.25rem + 0.4vw, 1.625rem) / 1.2 var(--f-titre); color: var(--creme); }
.pel-flux__prix { margin: var(--e-1) 0 0; font: italic 500 clamp(2rem, 1.5rem + 1.6vw, 3rem) / 1.1 var(--f-titre); color: var(--or-clair); }
.pel-flux__texte { margin: var(--e-3) 0 0; font-size: var(--t-corps); line-height: 1.6; color: var(--creme-doux); }
.pel-tarif__note { margin: var(--e-5) 0 0; max-width: 38rem; font-size: var(--t-corps); line-height: 1.6; color: var(--creme); }
.pel-flux.est-visible .pel-flux__chemin i { animation: pel-remplit 0.8s var(--ease-douce) 0.3s both; }
.pel-flux.est-visible .pel-flux__bloc + .pel-flux__bloc .pel-flux__chemin i { animation-delay: 0.7s; }

/* --------------------------------------------------------------------------
   8. FAQ (faq-v5.css)
   -------------------------------------------------------------------------- */
.pel.faq5 .faq5__reponse a { color: var(--petrole); text-underline-offset: 3px; }

/* --------------------------------------------------------------------------
   9. Appel final
   -------------------------------------------------------------------------- */
.pel-final { position: relative; overflow: hidden; text-align: center; padding-block: clamp(5rem, 10vw, 8rem); background: radial-gradient(ellipse 55% 70% at 50% 50%, rgba(224, 189, 142, 0.12), transparent 70%), var(--petrole-profond); }
.pel-final::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-radial-gradient(circle at 50% 50%, transparent 0 56px, rgba(224, 189, 142, 0.08) 57px 58px);
  -webkit-mask-image: radial-gradient(ellipse 55% 65% at 50% 50%, #000 0, transparent 100%);
  mask-image: radial-gradient(ellipse 55% 65% at 50% 50%, #000 0, transparent 100%);
}
.pel-final__contenu { position: relative; }
.pel-final__repere { display: block; width: 16px; height: 16px; margin: 0 auto var(--e-6); border-radius: 50%; background: var(--cuivre); box-shadow: 0 0 0 8px rgba(176, 99, 57, 0.18), 0 0 40px rgba(224, 189, 142, 0.6); }
.pel-final .titre-section { max-width: 20ch; margin-inline: auto; color: var(--creme); }
.pel-final__texte { max-width: 38rem; margin: var(--e-5) auto 0; font-size: var(--t-corps); line-height: 1.6; color: var(--creme-doux); }

/* --------------------------------------------------------------------------
   10. Tablette et téléphone
   -------------------------------------------------------------------------- */

@media (max-width: 39.99em) {
  .pel-actions .btn--grand, .pel-actions .btn-cartouche { width: 100%; justify-content: center; text-align: center; white-space: normal; }
  .pel-conseil { flex-direction: column; text-align: center; }
  
  .pel-sel__onglet { padding-inline: 14px; font-size: 0.9375rem; }
  
  
}

/* --------------------------------------------------------------------------
   11. Moins d'animations : état final immédiat
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .pel *, .pel *::before, .pel *::after { animation: none !important; transition: none !important; }
  
}

/* --------------------------------------------------------------------------
   12. v4 (23/10/2026, « comme la page Réseaux sociaux ») : titres, chapeaux et textes sur toute la largeur,
   alignés à gauche (seuls les encadrés restent centrés) ; vidéo du parcours d'un bord à l'autre ;
   étapes en cartes à grands chiffres ; appel final calé à gauche
   -------------------------------------------------------------------------- */
.pel .titre-section { max-width: none; font-size: clamp(2rem, 1.5rem + 1.5vw, 2.75rem); line-height: 1.1; text-wrap: pretty; }
.pel-tete { text-align: left; }
.pel-tete .titre-section, .pel-tarif .titre-section, .pel-final .titre-section { max-width: none; margin-inline: 0; }
.pel-texte { max-width: none; text-wrap: pretty; }
.pel-chapo { margin-top: var(--e-5); font: italic 500 clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem) / 1.4 var(--f-titre); color: var(--titre); text-wrap: pretty; }
.surface-nuit .pel-chapo, .surface-sombre .pel-chapo { color: var(--creme); }
.pel-tete { margin-bottom: clamp(2rem, 4vw, 3rem); }

/* Parcours : vidéo sur toute la largeur de l'écran */
.pel-film { max-width: none; margin-inline: calc(50% - 50vw); }
.pel-film__video { border-radius: 0; box-shadow: none; }
@media (max-width: 47.99em) { .pel-film__video { background-image: url("../img/videos/publicite-linkedin-cabinet-comptable-parcours-justicomm-nice-720.webp"); } }   /* affiche plus légère au téléphone */
.pel-film__bouton { top: 1rem; right: 1rem; bottom: auto; }

/* Étapes : quatre cartes à grands chiffres dorés */
.pel-etapes { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
.pel-etape { padding: clamp(1.5rem, 2.5vw, 2rem); border: 1px solid rgba(224, 189, 142, 0.3); border-top: 2px solid var(--or); background: rgba(238, 234, 225, 0.04); transition: translate var(--d) var(--ease-sortie), background-color var(--d) var(--ease-sortie); }
.pel-etape:hover { translate: 0 -3px; background: rgba(238, 234, 225, 0.07); }
.pel-etape__num { font: 600 3.5rem / 1 var(--f-titre); font-variant-numeric: lining-nums; color: transparent; -webkit-text-stroke: 1px var(--or); }

/* Appel final : texte calé à gauche, cercles à droite */
.pel-final { text-align: left; }
.pel-final::before {
  background: repeating-radial-gradient(circle at 78% 50%, transparent 0 56px, rgba(224, 189, 142, 0.09) 57px 58px);
  -webkit-mask-image: radial-gradient(ellipse 45% 75% at 78% 50%, #000 0, transparent 100%);
  mask-image: radial-gradient(ellipse 45% 75% at 78% 50%, #000 0, transparent 100%);
}
.pel-final__repere { margin: 0 0 var(--e-5); }
.pel-final .titre-section { font-size: clamp(1.75rem, 1.25rem + 1.4vw, 2.5rem); }
.pel-final__texte { margin: var(--e-4) 0 0; max-width: none; }
@media (prefers-reduced-motion: reduce) { .pel-etape:hover { translate: none; } }

/* Sélecteur des professions sur toute la largeur, onglets alignés à gauche comme le titre */
.pel-sel { max-width: none; }
.pel-sel__onglets { justify-content: flex-start; }

/* v5 (23/10/2026, Raoudha : « c'est écrit gros ») : tailles plus mesurées */
.pel .titre-section { font-size: clamp(1.875rem, 1.5rem + 1.1vw, 2.5rem); }
.pel-chapo { font-size: clamp(1.125rem, 1.05rem + 0.3vw, 1.3125rem); }
.pel-canal__titre, .pel-etape__titre { font-size: clamp(1.375rem, 1.25rem + 0.4vw, 1.625rem); }
.pel-questions li { font-size: clamp(1.25rem, 1.15rem + 0.4vw, 1.5rem); }
.pel-promesse__texte { font-size: clamp(1.375rem, 1.15rem + 0.8vw, 1.875rem); }
.pel-sel__nom { font-size: clamp(1.75rem, 1.5rem + 0.8vw, 2.25rem); }
.pel-flux__prix { font-size: clamp(1.625rem, 1.35rem + 0.9vw, 2.25rem); }
.pel-etape__num { font-size: 2.75rem; }
.pel-conseil { font-size: clamp(1.125rem, 1.05rem + 0.3vw, 1.3125rem); }

/* Écrans des canaux : photos dans les publications (LinkedIn, Instagram) quand elles sont là */
.pel-fil__visuel .pel-photo, .pel-telephone__visuel .pel-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pel-fil__visuel:has(.pel-photo)::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(2, 24, 24, 0.75), transparent 60%); }
.pel-fil__visuel span { position: relative; z-index: 1; }
.pel-telephone__visuel:has(.pel-photo) .pel-telephone__onde, .pel-telephone__visuel:has(.pel-photo) .pel-telephone__repere { display: none; }
.pel-telephone__ville { z-index: 1; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6); }
.pel-portable__titre { font-size: 0.8125rem; }

/* Téléphone : les cinq professionnels en bande qui défile au doigt (sinon la page devient très longue) */
@media (max-width: 39.99em) {
  .pel-portraits { display: flex; gap: var(--e-4); overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: calc(-1 * var(--marge)); padding: 0 var(--marge) var(--e-3); scrollbar-width: none; }
  .pel-portraits::-webkit-scrollbar { display: none; }
  .pel-portrait { flex: 0 0 78%; scroll-snap-align: start; }
  .pel-portraits { scroll-padding-inline: var(--marge); }
  .pel-portraits:focus-visible { outline: 2px solid var(--petrole); outline-offset: 4px; }
}

/* ==========================================================================
   v6 (23/10/2026, Raoudha) : petits encadrés, quatre canaux animés (dont TikTok), rapport officiel JustiComm,
   encadré de la promesse reformulé et compact
   ========================================================================== */

/* Priorité : chaque profession dans un encadré */
.pel-portrait { padding: 10px 10px 20px; background: #fff; border: 1px solid var(--lin); border-radius: 8px; box-shadow: 0 1.25rem 2rem -1.5rem rgba(2, 24, 24, 0.35); transition: translate var(--d) var(--ease-sortie), box-shadow var(--d) var(--ease-sortie); }
.pel-portrait:hover { translate: 0 -4px; box-shadow: 0 1.75rem 2.5rem -1.5rem rgba(2, 24, 24, 0.45); }
.pel-portrait__photo { border-radius: 5px; box-shadow: none; }
.pel-portrait__qui { margin: var(--e-4) 8px 0; }
.pel-portrait__quoi { margin: var(--e-2) 8px 0; font-size: 1rem; }

/* Canaux : quatre encadrés, deux par rangée */
.pel-canaux__grille { gap: var(--gouttiere); }
@media (min-width: 48em) { .pel-canaux__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 60em) { .pel-canaux__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pel-canal { padding: 12px 12px clamp(1.5rem, 3vw, 2rem); background: #fff; border: 1px solid #D6CFC1; border-radius: 10px; box-shadow: 0 1.5rem 2.5rem -1.75rem rgba(2, 24, 24, 0.35); }
.pel-canal + .pel-canal { border-left: 1px solid #D6CFC1; border-top: 1px solid #D6CFC1; }
.pel-canal .pel-scene { height: 21rem; margin-bottom: var(--e-5); border-radius: 6px; }
.pel-canal__titre, .pel-canal__texte { padding-inline: clamp(0.5rem, 1.5vw, 1rem); }
.pel-canal__titre { margin-top: 0; }

/* LinkedIn : photo moins coupée (les visages restent dans le cadre) */
.pel-fil__visuel { height: 9.5rem; }
.pel-fil__visuel .pel-photo { object-position: 50% 30%; }

/* TikTok : téléphone vertical, vidéo sous-titrée */
.pel-tiktok { width: 10.5rem; padding: 7px; border-radius: 28px; background: linear-gradient(180deg, #233534, #0E1B1B); box-shadow: 0 30px 50px -18px rgba(2, 24, 24, 0.6), inset 0 0 0 1px #3A4A4A; rotate: 4deg; }
.pel-tiktok__ecran { position: relative; height: 18.5rem; overflow: hidden; border-radius: 22px; background: #111; }
.pel-tiktok__ecran .pel-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 45% 30%; filter: brightness(0.85); }
.pel-tiktok__haut { position: absolute; left: 0; right: 0; top: 14px; display: flex; justify-content: center; gap: 12px; margin: 0; font-size: 0.6875rem; color: rgba(255, 255, 255, 0.75); }
.pel-tiktok__haut b { color: #fff; border-bottom: 2px solid #fff; }
.pel-tiktok__icones { position: absolute; right: 8px; bottom: 74px; display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.pel-tiktok__icones li { width: 22px; height: 22px; border-radius: 50%; background: rgba(255, 255, 255, 0.85); }
.pel-tiktok__icones .pel-tiktok__coeur { background: #fff; position: relative; }
.pel-tiktok__sous-titre { position: absolute; left: 10px; right: 36px; top: 46%; display: grid; gap: 3px; margin: 0; }
.pel-tiktok__sous-titre span { justify-self: start; padding: 2px 6px; border-radius: 4px; background: rgba(0, 0, 0, 0.7); font-size: 0.75rem; font-weight: 600; line-height: 1.3; color: #fff; }
.pel-tiktok__bas { position: absolute; left: 10px; right: 36px; bottom: 16px; display: grid; gap: 2px; color: #fff; }
.pel-tiktok__bas b { font-size: 0.75rem; }
.pel-tiktok__bas small { font-size: 0.6875rem; opacity: 0.85; }
.pel-tiktok__bouton { justify-self: start; margin-top: 5px; padding: 3px 9px; border-radius: 4px; background: #fe2c55; font-size: 0.6875rem; font-weight: 600; }
.pel-tiktok__barre { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: #fff; transform-origin: left center; }

/* Animations des quatre écrans (une fois, à l'arrivée, moins de 5 s) */
.pel-canal.est-visible .pel-fil { animation: pel-monte 0.8s var(--ease-sortie) 0.1s both; }
.pel-canal.est-visible .pel-fil__visuel .pel-photo { animation: pel-zoom-doux 4s ease-out 0.3s both; }
.pel-canal.est-visible .pel-telephone__visuel .pel-photo { animation: pel-zoom-doux 4s ease-out 0.3s both; }
.pel-canal.est-visible .pel-tiktok { animation: pel-monte 0.9s var(--ease-sortie) 0.1s both; }
.pel-canal.est-visible .pel-tiktok__sous-titre span { animation: pel-pastille 0.4s var(--ease-sortie) both; }
.pel-canal.est-visible .pel-tiktok__sous-titre span:nth-child(1) { animation-delay: 0.9s; }
.pel-canal.est-visible .pel-tiktok__sous-titre span:nth-child(2) { animation-delay: 1.6s; }
.pel-canal.est-visible .pel-tiktok__sous-titre span:nth-child(3) { animation-delay: 2.3s; }
.pel-canal.est-visible .pel-tiktok__barre { animation: pel-remplit 4.5s linear 0.3s both; }
.pel-canal.est-visible .pel-tiktok__coeur { animation: pel-coeur 0.6s var(--ease-sortie) 3s both; }
.pel-canal.est-visible .pel-telephone__action { animation: pel-pastille 0.5s var(--ease-sortie) 1.6s both; }
@keyframes pel-zoom-doux { from { scale: 1.12; } to { scale: 1; } }
@keyframes pel-coeur { 0% { scale: 1; background: #fff; } 50% { scale: 1.4; background: #fe2c55; } 100% { scale: 1; background: #fe2c55; } }

/* Rapport mensuel : document officiel de JustiComm */
.pel-rapport-doc { position: relative; justify-self: center; width: min(100%, 33rem); padding: 1rem 0 1.5rem; }
.pel-rapport-doc__dessous { position: absolute; inset: 2rem 1.25rem 0 1.75rem; background: #EFEBE3; rotate: 3deg; border-radius: 3px; box-shadow: 0 2rem 3rem -1.5rem rgba(2, 24, 24, 0.35); }
.pel-rapport-doc__page { position: relative; padding: clamp(1.5rem, 3vw, 2.25rem); background: #fff; border-radius: 3px; rotate: -1deg; box-shadow: 0 2.5rem 4rem -1.5rem rgba(2, 24, 24, 0.4), 0 0 0 1px var(--lin); }
.pel-rapport-doc__entete { display: flex; align-items: center; justify-content: space-between; gap: var(--e-4); padding-bottom: var(--e-4); border-bottom: 2px solid var(--petrole); }
.pel-rapport-doc__logo { width: 9.5rem; height: auto; }
.pel-rapport-doc__titre { display: grid; margin: 0; text-align: right; line-height: 1.2; }
.pel-rapport-doc__titre span { font: 600 1.375rem / 1.1 var(--f-titre); color: var(--petrole); }
.pel-rapport-doc__titre small { font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--or-texte); }
.pel-rapport-doc__infos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-3); margin: var(--e-4) 0 0; padding: var(--e-3) var(--e-4); background: var(--papier); border-radius: 4px; }
.pel-rapport-doc__infos dt { font-size: 0.6875rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--taupe); }
.pel-rapport-doc__infos dd { margin: 2px 0 0; font-size: 0.875rem; font-weight: 500; color: var(--encre); }
.pel-rapport-doc__rubrique { display: flex; align-items: center; gap: 10px; margin: var(--e-5) 0 var(--e-3); font: 600 1.125rem / 1.2 var(--f-titre); color: var(--petrole); }
.pel-rapport-doc__rubrique span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--petrole); font-family: var(--f-texte); font-size: 0.75rem; color: var(--or); }
.pel-rapport-doc__tuiles { display: grid; gap: var(--e-3); }
.pel-rapport-doc__tuile { padding: 10px 12px; border: 1px solid var(--lin); border-radius: 5px; }
.pel-rapport-doc__tuile > p:first-child { margin: 0 0 8px; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--taupe); }
.pel-rapport-doc__legende { display: flex; gap: 12px; margin: 6px 0 0; font-size: 0.6875rem; color: var(--taupe); }
.pel-rapport-doc__legende span::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 5px; border-radius: 2px; background: var(--petrole); }
.pel-rapport-doc__legende span:nth-child(2)::before { background: var(--or-400); }
.pel-rapport-doc__legende span:nth-child(3)::before { background: var(--sauge); }
.pel-rapport-doc__pied { display: flex; justify-content: space-between; gap: var(--e-3); margin: var(--e-5) 0 0; padding-top: var(--e-3); border-top: 1px solid var(--lin); font-size: 0.6875rem; color: var(--taupe); }
.pel-rapport-doc.est-visible .pel-doc__barres i, .pel-rapport-doc.est-visible .pel-doc__jauge i { animation: pel-remplit 0.8s var(--ease-douce) both; }
.pel-rapport-doc.est-visible .pel-doc__barres i:nth-child(2) { animation-delay: 0.15s; }
.pel-rapport-doc.est-visible .pel-doc__barres i:nth-child(3) { animation-delay: 0.3s; }
.pel-rapport-doc.est-visible .pel-doc__jauge i:nth-child(1) { animation-delay: 0.5s; }
.pel-rapport-doc.est-visible .pel-doc__jauge i:nth-child(2) { animation-delay: 0.7s; }
.pel-rapport-doc.est-visible .pel-doc__jauge i:nth-child(3) { animation-delay: 0.9s; }
.pel-rapport-doc.est-visible .pel-doc__ajust li { animation: pel-monte 0.45s var(--ease-sortie) both; }
.pel-rapport-doc.est-visible .pel-doc__ajust li:nth-child(1) { animation-delay: 1.1s; }
.pel-rapport-doc.est-visible .pel-doc__ajust li:nth-child(2) { animation-delay: 1.3s; }
.pel-rapport-doc.est-visible .pel-doc__ajust li:nth-child(3) { animation-delay: 1.5s; }
.pel-rapport-doc.est-visible .pel-doc__ajust li:nth-child(4) { animation-delay: 1.7s; }

/* Encadré de la promesse : reformulé, compact, texte et bouton sur une ligne */
.pel-promesse { padding-block: clamp(2rem, 4vw, 2.75rem); text-align: left; }
.pel-promesse__grille { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--e-4) var(--e-6); }
.pel-promesse__texte { flex: 1 1 32rem; max-width: none; margin: 0; font: 500 clamp(1.125rem, 1.05rem + 0.35vw, 1.375rem) / 1.45 var(--f-titre); text-wrap: pretty; }
.pel-promesse__texte::before { display: none; }
.pel-promesse__texte strong { display: inline; margin: 0; }
@media (max-width: 39.99em) { .pel-promesse .btn-plaque { width: 100%; justify-content: center; } .pel-rapport-doc__infos { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .pel-portrait:hover { translate: none; } }

/* v7 (23/10/2026, Raoudha) : TikTok sans chevauchement ; puces en « C » du logo */
.pel-canal .pel-scene { height: 24rem; }
.pel-tiktok { width: 12.5rem; rotate: 3deg; }
.pel-tiktok__ecran { height: 22rem; }
.pel-tiktok__haut { top: 12px; }
.pel-tiktok__sous-titre { top: 30%; left: 12px; right: 44px; gap: 4px; }
.pel-tiktok__sous-titre span { font-size: 0.8125rem; }
.pel-tiktok__icones { right: 10px; bottom: 120px; gap: 14px; }
.pel-tiktok__bas { left: 12px; right: 44px; bottom: 14px; gap: 3px; }
.pel-tiktok__bas b { font-size: 0.8125rem; }
.pel-telephone { width: 12rem; }
.pel-telephone__ecran { height: 20rem; }
.pel-telephone__visuel { height: 11rem; }
.pel-questions li { padding-left: 2.1rem; }
.pel-questions li::before {
  top: 0.26em; width: 1.35rem; height: 1.35rem; background: var(--or-texte);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='12 12 80 76'%3E%3Cpath d='M75.66 28.47A33.5 33.5 0 1 0 75.66 71.53L70.3 67.03A26.5 26.5 0 1 1 70.3 32.97Z'/%3E%3Ccircle cx='84' cy='50' r='6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='12 12 80 76'%3E%3Cpath d='M75.66 28.47A33.5 33.5 0 1 0 75.66 71.53L70.3 67.03A26.5 26.5 0 1 1 70.3 32.97Z'/%3E%3Ccircle cx='84' cy='50' r='6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* v8 (23/10/2026, Raoudha) : « C » du logo dans un rond ; devis à l'en-tête de JustiComm */
.pel-questions li { padding-left: 2.75rem; }
.pel-questions li::before { content: ""; top: 0.12em; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--petrole); -webkit-mask: none; mask: none; }
.pel-questions li::after {
  content: ""; position: absolute; left: 0.45rem; top: calc(0.12em + 0.45rem); width: 1rem; height: 1rem; background: var(--or);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='12 12 80 76'%3E%3Cpath d='M75.66 28.47A33.5 33.5 0 1 0 75.66 71.53L70.3 67.03A26.5 26.5 0 1 1 70.3 32.97Z'/%3E%3Ccircle cx='84' cy='50' r='6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='12 12 80 76'%3E%3Cpath d='M75.66 28.47A33.5 33.5 0 1 0 75.66 71.53L70.3 67.03A26.5 26.5 0 1 1 70.3 32.97Z'/%3E%3Ccircle cx='84' cy='50' r='6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.pel-devis { position: relative; justify-self: center; width: min(100%, 31rem); margin: 0; padding: 1rem 0 1.5rem; }
.pel-devis__dessous { position: absolute; inset: 2.5rem 1rem 0.5rem; background: #E9E3D7; rotate: -4deg; border-radius: 3px; box-shadow: 0 2rem 3rem -1.5rem rgba(0, 0, 0, 0.5); }
.pel-devis__page { position: relative; padding: clamp(1.4rem, 3vw, 2rem); background: #FFFDF8; border-radius: 3px; rotate: 1.5deg; box-shadow: 0 2.5rem 4rem -1.5rem rgba(0, 0, 0, 0.55); color: var(--encre); }
.pel-devis__entete { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--e-4); padding-bottom: var(--e-4); border-bottom: 2px solid var(--petrole); }
.pel-devis__logo { display: block; width: 8.5rem; height: auto; }
.pel-devis__agence p { margin: 6px 0 0; font-size: 0.6875rem; line-height: 1.5; color: var(--taupe); }
.pel-devis__titre { display: grid; margin: 0; text-align: right; line-height: 1.1; }
.pel-devis__titre span { font: 600 1.75rem / 1 var(--f-titre); color: var(--petrole); }
.pel-devis__titre small { margin-top: 4px; font-size: 0.6875rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--or-texte); }
.pel-devis__infos { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--e-3); margin: var(--e-4) 0 0; padding: var(--e-3) var(--e-4); background: var(--papier); border-radius: 4px; }
.pel-devis__infos dt { font-size: 0.6875rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--taupe); }
.pel-devis__infos dd { margin: 2px 0 0; font-size: 0.875rem; font-weight: 500; color: var(--encre); }
.pel-devis__table { width: 100%; margin-top: var(--e-4); border-collapse: collapse; font-size: 0.8125rem; }
.pel-devis__table th { padding: 6px 8px; background: var(--petrole); font-weight: 500; letter-spacing: 0.06em; text-align: left; text-transform: uppercase; font-size: 0.6875rem; color: var(--creme); }
.pel-devis__table th:last-child, .pel-devis__table td:last-child { text-align: right; }
.pel-devis__table td { padding: 9px 8px; border-bottom: 1px dotted #CFC7B8; vertical-align: top; color: var(--encre); }
.pel-devis__table td small { display: block; margin-top: 2px; font-size: 0.6875rem; color: var(--taupe); }
.pel-devis__table td:last-child { font-weight: 600; color: var(--petrole); }
.pel-devis__note { margin: var(--e-3) 0 0; font-size: 0.75rem; font-style: italic; color: var(--taupe); }
.pel-devis__bas { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--e-3); margin-top: var(--e-4); }
.pel-devis__signature p { margin: 0; font: italic 500 1rem / 1 var(--f-titre); color: var(--taupe); }
.pel-devis__signature svg { display: block; width: 10rem; height: auto; margin-top: 2px; fill: none; stroke: var(--petrole); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.pel-devis__signature path { stroke-dasharray: 1; stroke-dashoffset: 0; }
.pel-devis__tampon { margin: 0 0 6px; padding: 6px 12px; rotate: -9deg; border: 3px solid #8A4A28; border-radius: 6px; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #8A4A28; }
.pel-devis__pied { display: flex; justify-content: space-between; gap: var(--e-3); margin: var(--e-4) 0 0; padding-top: var(--e-3); border-top: 1px solid var(--lin); font-size: 0.6875rem; color: var(--taupe); }
.pel-devis.est-visible .pel-devis__signature path { animation: pel-trace 1.6s var(--ease-douce) 0.6s both; }
.pel-devis.est-visible .pel-devis__tampon { animation: pel-tampon 0.45s var(--ease-sortie) 2.3s both; }
@media (max-width: 39.99em) { .pel-devis__entete { flex-direction: column; } .pel-devis__titre { text-align: left; } .pel-devis__infos { grid-template-columns: 1fr; } }

/* Appel final : photo en fond quand elle est là (texte sur la partie sombre, à gauche) */
.pel-final__fond { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; }
.pel-final:has(.pel-final__fond)::before { background: linear-gradient(90deg, rgba(2, 24, 24, 0.94) 0%, rgba(2, 24, 24, 0.8) 38%, rgba(2, 24, 24, 0.15) 70%, transparent 100%); -webkit-mask-image: none; mask-image: none; z-index: 0; }
.pel-final:has(.pel-final__fond) .pel-final__contenu { z-index: 1; max-width: 42rem; margin-left: 0; }
@media (max-width: 74.99em) { .pel-final:has(.pel-final__fond)::before { background: rgba(2, 24, 24, 0.82); } }
/* Appel final : voile au-dessus de la photo, texte au-dessus du voile ; au téléphone, photo en bandeau puis texte */
.pel-final__fond { z-index: 0; object-position: 78% 50%; }
.pel-final:has(.pel-final__fond)::before { z-index: 1; background: linear-gradient(90deg, rgba(2, 24, 24, 0.96) 0%, rgba(2, 24, 24, 0.88) 30%, rgba(2, 24, 24, 0.35) 52%, transparent 70%); }
.pel-final:has(.pel-final__fond) .pel-final__contenu { position: relative; z-index: 2; max-width: 36rem; margin-left: 0; margin-right: auto; }
@media (min-width: 75em) { .pel-final:has(.pel-final__fond) { padding-block: clamp(6rem, 11vw, 9rem); } }
@media (max-width: 74.99em) {
  .pel-final:has(.pel-final__fond) { padding-top: 0; }
  .pel-final__fond { position: relative; display: block; height: clamp(15rem, 42vw, 28rem); object-position: 70% 40%; }
  .pel-final:has(.pel-final__fond)::before { display: none; }
  .pel-final:has(.pel-final__fond) .pel-final__contenu { margin-top: var(--e-6); }
}
/* Appel final (Raoudha : « l'écriture est dans la lumière ») : texte en bas à gauche, loin de la lampe, voile renforcé ; bandeau photo + texte jusqu'à 1 199 px (contrôle de Pauline, tablettes) */
@media (min-width: 75em) {
  .pel-final:has(.pel-final__fond) { display: flex; align-items: flex-end; min-height: clamp(32rem, 42vw, 40rem); padding-block: clamp(3rem, 6vw, 5rem); }
  .pel-final:has(.pel-final__fond) > .pel-final__contenu { width: 100%; }
  .pel-final:has(.pel-final__fond)::before {
    background:
      radial-gradient(ellipse 34% 45% at 6% 8%, rgba(2, 24, 24, 0.75), transparent 70%),
      linear-gradient(90deg, rgba(2, 24, 24, 0.97) 0%, rgba(2, 24, 24, 0.92) 32%, rgba(2, 24, 24, 0.45) 54%, transparent 72%),
      linear-gradient(0deg, rgba(2, 24, 24, 0.7) 0%, transparent 45%);
  }
}

/* Téléphone : points sous la bande des cinq professionnels (on voit qu'elle défile au doigt) */
.pel-portraits__points { display: none; }
@media (max-width: 39.99em) {
  .pel-portraits__points { display: flex; justify-content: center; gap: 8px; margin: var(--e-3) 0 0; }
  .pel-portraits__points i { width: 8px; height: 8px; border-radius: 50%; background: var(--lin); transition: background-color var(--d) var(--ease-sortie), width var(--d) var(--ease-sortie); }
  .pel-portraits__points i.est-actif { width: 22px; border-radius: 4px; background: var(--or-texte); }
  .pel-portraits__points:not(:has(.est-actif)) i:first-child { width: 22px; border-radius: 4px; background: var(--or-texte); }
}

/* --------------------------------------------------------------------------
   13. Publicité dans ChatGPT (23/10/2026, demande de Raoudha) : écran d'assistant IA générique
   (ni logo ni écran de ChatGPT), annonce sous la réponse ; statut de chaque profession.
   Animation jouée une fois à l'arrivée (2,6 s), état final fixe si « moins d'animations » ou sans JavaScript.
   -------------------------------------------------------------------------- */
.pel-ia__grille { display: grid; gap: clamp(2.5rem, 5vw, 4rem); align-items: center; }
@media (min-width: 60em) { .pel-ia__grille { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); } }
.pel-ia__scene {
  display: grid; place-items: center; margin: 0; padding: clamp(1.5rem, 4vw, 3rem) clamp(1rem, 3vw, 2.5rem);
  background: radial-gradient(ellipse 70% 70% at 50% 40%, rgba(255, 255, 255, 0.7), transparent 70%), linear-gradient(180deg, #E7E1D5, #DCD4C5);
  border-radius: 4px;
}
.pel-ia__fenetre { width: min(100%, 26rem); overflow: hidden; border: 1px solid #E3DED4; border-radius: 14px; background: #fff; box-shadow: 0 30px 50px -20px rgba(2, 24, 24, 0.5); }
.pel-ia__barre { display: flex; align-items: center; gap: 12px; margin: 0; padding: 10px 14px; border-bottom: 1px solid #EEE9E0; }
.pel-ia__points { display: flex; gap: 5px; }
.pel-ia__points i { width: 8px; height: 8px; border-radius: 50%; background: #DDD6CA; }
.pel-ia__nom { display: inline-flex; align-items: center; gap: 6px; font-size: 0.8125rem; font-weight: 500; color: var(--encre); }
.pel-ia__nom svg { width: 14px; height: 14px; fill: var(--petrole); }
.pel-ia__fil { display: grid; gap: 12px; padding: 16px 16px 8px; }
.pel-ia__question { justify-self: end; max-width: 82%; margin: 0; padding: 9px 14px; border-radius: 16px 16px 4px 16px; background: #F1EDE6; font-size: 0.875rem; line-height: 1.4; color: var(--encre); }
.pel-ia__reponse { display: flex; align-items: flex-start; gap: 10px; }
.pel-ia__puce { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--petrole); }
.pel-ia__puce svg { width: 13px; height: 13px; fill: var(--or); }
.pel-ia__lignes { flex: 1; display: grid; gap: 7px; padding-top: 4px; }
.pel-ia__lignes i { display: block; height: 7px; border-radius: 4px; background: #E6E1D8; transform-origin: left center; }
.pel-ia__lignes i:nth-child(2) { width: 88%; }
.pel-ia__lignes i:nth-child(3) { width: 94%; }
.pel-ia__lignes i:nth-child(4) { width: 52%; }
.pel-ia__annonce { display: grid; gap: 8px; margin-top: 4px; padding: 10px 12px 12px; border: 1.5px solid var(--or); border-radius: 10px; background: #fff; box-shadow: 0 0 0 4px rgba(224, 189, 142, 0.18); }
.pel-ia__etiquette { margin: 0; font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--taupe); }
.pel-ia__offre { display: flex; align-items: center; gap: 10px; }
.pel-ia__monogramme { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 8px; background: linear-gradient(135deg, var(--petrole), var(--petrole-600)); font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.04em; color: var(--creme); box-shadow: inset 0 0 0 2px rgba(224, 189, 142, 0.6); }
.pel-ia__offre-texte { display: grid; margin: 0; line-height: 1.3; }
.pel-ia__offre-texte b { font-size: 0.9375rem; font-weight: 600; color: var(--petrole); }
.pel-ia__offre-texte span { font-size: 0.8125rem; color: var(--encre); }
.pel-ia__offre-texte small { font-size: 0.75rem; color: var(--taupe); }
.pel-ia__bouton { justify-self: start; padding: 6px 14px; border-radius: 999px; background: var(--petrole); font-size: 0.8125rem; font-weight: 500; color: var(--creme); }
.pel-ia__saisie { display: flex; align-items: center; justify-content: space-between; margin: 8px 12px 12px; padding: 7px 7px 7px 14px; border: 1px solid #E3DED4; border-radius: 999px; font-size: 0.8125rem; color: var(--taupe); }
.pel-ia__envoi { width: 26px; height: 26px; border-radius: 50%; background: var(--petrole); }

.pel-ia__titre { margin: 0; font: 500 clamp(1.375rem, 1.2rem + 0.5vw, 1.625rem) / 1.2 var(--f-titre); color: var(--petrole); }
.pel-ia__para { margin: var(--e-3) 0 0; font-size: 1.0625rem; line-height: 1.65; color: var(--encre); text-wrap: pretty; }
.pel-ia__para + .pel-ia__titre { margin-top: var(--e-6); }
.pel-ia__para a { font-weight: 500; color: var(--petrole); text-decoration: underline; text-decoration-color: var(--or); text-underline-offset: 3px; }
.pel-ia__para a:hover { text-decoration-color: var(--petrole); }
.pel-ia__statuts { margin: var(--e-4) 0 0; padding: 0; list-style: none; }
.pel-ia__statut { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); gap: 0.875rem; padding: 0.875rem 0; border-top: 1px solid var(--lin); }
.pel-ia__statut:last-child { border-bottom: 1px solid var(--lin); }
.pel-ia__statut svg { width: 1.5rem; height: 1.5rem; margin-top: 0.125rem; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pel-ia__statut p { margin: 0; font-size: 1rem; line-height: 1.55; color: var(--encre); }
.pel-ia__statut b { display: block; font-weight: 600; color: var(--petrole); }
.pel-ia__statut--oui circle { fill: var(--petrole); stroke: none; }
.pel-ia__statut--oui path { stroke: var(--creme); stroke-width: 2.2; }
.pel-ia__statut--attente svg { stroke: var(--or-texte); }
.pel-ia__statut--pas-encore svg { stroke: var(--taupe); }
.pel-ia__statut--non svg { stroke: #8A4A28; }
.pel-ia__date { margin: var(--e-4) 0 0; font-size: 0.875rem; font-style: italic; color: var(--taupe); }
.pel-ia__maintenant { margin-top: clamp(2.5rem, 5vw, 3.5rem); padding: clamp(1.5rem, 3vw, 2.25rem); border-left: 3px solid var(--or-400); background: rgba(156, 121, 82, 0.08); }
.pel-ia__maintenant .pel-ia__para { max-width: none; }

.pel-ia__scene.est-visible .pel-ia__question { animation: pel-monte 0.5s var(--ease-sortie) 0.2s both; }
.pel-ia__scene.est-visible .pel-ia__puce { animation: pel-pastille 0.4s var(--ease-sortie) 0.7s both; }
.pel-ia__scene.est-visible .pel-ia__lignes i { animation: pel-remplit 0.5s var(--ease-sortie) 0.8s both; }
.pel-ia__scene.est-visible .pel-ia__lignes i:nth-child(2) { animation-delay: 1s; }
.pel-ia__scene.est-visible .pel-ia__lignes i:nth-child(3) { animation-delay: 1.2s; }
.pel-ia__scene.est-visible .pel-ia__lignes i:nth-child(4) { animation-delay: 1.4s; }
.pel-ia__scene.est-visible .pel-ia__annonce { animation: pel-monte 0.7s var(--ease-sortie) 1.9s both; }

/* Sélecteur : ChatGPT « sous réserve d'OpenAI » (cabinets comptables, syndics) */
.pel-sel__canaux .est-reserve { border: 1px solid var(--or-400); background: rgba(224, 189, 142, 0.2); color: var(--petrole); }
.pel-sel__canaux .est-reserve::before { content: ""; width: 7px; height: 7px; border: 1.5px solid var(--or-texte); border-radius: 50%; }
.pel-sel__canaux .est-reserve small { font-size: 0.8125rem; color: var(--or-texte); }
