/* Accueil : une voix de participante et les visages de l'équipe. */
/* Fond de marque (bleu nuit, lueur orangée) sous la photo, et repris par-dessus elle. */
.home-page .hero-gradient { background: var(--gradient-hero, #101e34); }
/* La photo occupe les 62 % de droite, recadrée sur le personnage, et se fond dans le bleu par son bord
   gauche : aucune limite visible, quelle que soit la largeur ; le texte reste sur le bleu, le visage à droite. */
.home-page .hero-gradient::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 38%; background: url('/assets/home-apprehension-travail.webp') 62% 30% / cover no-repeat; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 38%); mask-image: linear-gradient(90deg, transparent 0, #000 38%); }
.home-page .hero-gradient::after { content: ""; display: block; position: absolute; inset: 0; animation: none; opacity: 1; transform: none; background: radial-gradient(ellipse 55% 75% at 100% 100%, rgba(214, 108, 18, .85) 0, rgba(160, 80, 24, .55) 30%, rgba(122, 66, 30, .25) 55%, transparent 78%), radial-gradient(ellipse 40% 50% at 88% 18%, rgba(36, 84, 206, .28), transparent 70%), linear-gradient(90deg, #101e34 0%, rgba(16, 30, 52, .9) 34%, rgba(16, 30, 52, .35) 56%, rgba(16, 30, 52, 0) 72%), linear-gradient(0deg, #101e34 0, rgba(16, 30, 52, .4) 14%, transparent 36%), linear-gradient(180deg, rgba(16, 30, 52, .55), transparent 20%); }
/* Bleu nuit en haut de page seulement : une fois la page défilée, l’en-tête reprend son fond clair et ses textes foncés. */
.home-page .header:not(.scrolled) { background: rgba(16, 30, 52, .94); }
.home-page .hero-container--photo-background { grid-template-columns: minmax(0, 1fr); }
.home-page .hero-container--photo-background .hero-content { width: min(100%, 580px); min-width: 0; margin: 0; align-items: flex-start; text-align: left; }
.ui-polish.home-page .hero-container--photo-background .hero-title { max-width: 21ch; margin-left: 0; margin-right: 0; font-size: clamp(36px, 3.8vw, 54px); }
.home-page .hero-container--photo-background .gradient-text { white-space: normal; }
.home-page .hero-container--photo-background .hero-subtitle { text-align: left; margin-left: 0; margin-right: 0; }
.home-page .hero-container--photo-background .hero-actions { justify-content: flex-start; }
.home-page .hero-container--photo-background .hero-voice { margin-left: 0; margin-right: 0; background: rgba(16, 30, 52, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
/* Titre en trois lignes voulues (« Aucun professionnel / ne devrait rester démuni / face à la violence ») :
   aucune coupure dans une ligne sur ordinateur et tablette ; sur téléphone, les lignes longues peuvent se replier. */
@media (min-width: 701px) {
  .ui-polish.home-page .hero-container--photo-background .hero-title { max-width: none; white-space: nowrap; font-size: clamp(32px, 3.6vw, 54px); }
  .ui-polish.home-page .hero-container--photo-background .hero-title .gradient-text { white-space: nowrap; }
}
@media (max-width: 1050px) and (min-width: 701px) {
  .home-page .hero-container--photo-background .hero-content { width: min(100%, 560px); }
  .home-page .hero-gradient::after { background: radial-gradient(ellipse 55% 75% at 100% 100%, rgba(214, 108, 18, .85) 0, rgba(160, 80, 24, .55) 30%, rgba(122, 66, 30, .25) 55%, transparent 78%), radial-gradient(ellipse 40% 50% at 88% 18%, rgba(36, 84, 206, .28), transparent 70%), linear-gradient(90deg, #101e34, rgba(16, 30, 52, .94) 45%, rgba(16, 30, 52, .6) 72%, rgba(16, 30, 52, .3)), linear-gradient(0deg, #101e34, transparent 30%); }
}
@media (max-width: 700px) {
  .home-page .hero { padding-top: 320px; }
  .home-page .hero-gradient::before { inset: 0; -webkit-mask-image: none; mask-image: none; background-size: auto 520px; background-position: 55% top; }
  .home-page .hero-gradient::after { background: radial-gradient(ellipse 95% 45% at 100% 100%, rgba(214, 108, 18, .7), rgba(122, 66, 30, .25) 50%, transparent 78%), linear-gradient(180deg, rgba(16, 30, 52, .1) 0, rgba(16, 30, 52, .2) 140px, rgba(16, 30, 52, .88) 310px, #101e34 480px); }
  .ui-polish.home-page .hero-container--photo-background .hero-title { font-size: clamp(28px, 8vw, 40px); }
  /* Sur téléphone, le titre coule sans retours forcés : un bloc compact plutôt que sept lignes. */
  .home-page .hero-title br { display: none; }
}
.hero-voice { max-width: 640px; margin: 34px auto 0; padding: 18px 22px; border-left: 3px solid var(--orange); background: rgba(255, 255, 255, .06); border-radius: 0 var(--radius-md) var(--radius-md) 0; text-align: left; }
.hero-voice blockquote { margin: 0; font-size: 1.08rem; line-height: 1.55; font-style: italic; color: #fff; }
.hero-voice figcaption { margin-top: 8px; font-size: .9rem; color: rgba(255, 255, 255, .72); }
.hero-voice strong { color: #fff; font-weight: 600; }
.hero-voice a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* Une scène humaine en introduction aux avis : la photo part du haut de la section jusqu'au bord
   droit de l'écran et se pose sur le filet des témoignages. Son fond clair se fond dans le blanc
   du site par la gauche seulement : aucun contour flottant. */
.ui-polish.home-page .google-reviews.google-reviews--voices { overflow: clip; }
.home-page .voices-head { --voices-top: clamp(56px, 7vw, 88px); position: relative; isolation: isolate; min-height: 360px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 24px; margin-bottom: 0; padding-bottom: 32px; }
.home-page .voices-head::before { content: ""; position: absolute; z-index: -1; pointer-events: none; top: calc(-1 * var(--voices-top)); bottom: 0; left: 40%; right: calc(50% - 50vw); background: url('/assets/home-avis-confiance-20261009.webp') 62% 22% / cover no-repeat; -webkit-mask-image: linear-gradient(90deg, transparent, #000 32%); mask-image: linear-gradient(90deg, transparent, #000 32%); }
.home-page .voices-head > div { max-width: 44%; }
.home-page .voices-head h2 { max-width: 18ch; }
.home-page .voices-head .voices-google { max-width: 44%; line-height: 1.7; }
[data-theme=dark] .home-page .voices-head::before { opacity: .75; }
@media (max-width: 900px) and (min-width: 601px) {
  .home-page .voices-head { min-height: 320px; }
  .home-page .voices-head::before { left: 38%; background-position: 66% 22%; }
  .home-page .voices-head > div, .home-page .voices-head .voices-google { max-width: 48%; }
}
@media (max-width: 600px) {
  .ui-polish.home-page .google-reviews.google-reviews--voices { padding-top: 0; }
  /* Sur téléphone, la photo ouvre la section sur toute la largeur et se fond vers le texte. */
  .home-page .voices-head { min-height: 0; padding-top: 250px; padding-bottom: 24px; gap: 20px; }
  .home-page .voices-head::before { top: 0; bottom: auto; left: calc(50% - 50vw); height: 290px; background-position: 70% 20%; -webkit-mask-image: linear-gradient(180deg, #000 62%, transparent); mask-image: linear-gradient(180deg, #000 62%, transparent); }
  .home-page .voices-head > div, .home-page .voices-head .voices-google { max-width: 100%; }
  .home-page .voices-head h2 { max-width: 20ch; }
}
/* Les acquis : même photo intégrée au fond que les avis, jusqu'au bord de la section. */
.home-page .performance-home { overflow: clip; scroll-margin-top: 80px; }
.home-page .performance-home-heading { position: relative; isolation: isolate; min-height: 380px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 24px; margin-bottom: 0; padding-bottom: 32px; }
.home-page .performance-home-heading::before { content: ""; position: absolute; z-index: -1; pointer-events: none; top: -72px; bottom: 0; left: 40%; right: calc(50% - 50vw); background: url('/assets/home-acquis-groupe-professionnels-20261009.webp') 100% 22% / cover no-repeat; -webkit-mask-image: linear-gradient(90deg, transparent, #000 32%); mask-image: linear-gradient(90deg, transparent, #000 32%); }
.home-page .performance-home-heading > div { max-width: 44%; }
.home-page .performance-home-heading h2 { max-width: 18ch; }
.home-page .performance-home-heading > .btn { max-width: 44%; }
[data-theme=dark] .home-page .performance-home-heading::before { opacity: .75; }
/* Le groupe garde toute la largeur sur tablette et téléphone : aucun participant exclu du cadrage. */
@media (max-width: 1050px) {
  .home-page .performance-home { padding-top: 0; }
  .home-page .performance-home-heading { --results-photo-height: clamp(230px, 48vw, 400px); min-height: 0; padding-top: calc(var(--results-photo-height) - 24px); padding-bottom: 28px; gap: 20px; }
  .home-page .performance-home-heading::before { top: 0; bottom: auto; left: calc(50% - 50vw); height: var(--results-photo-height); background-position: 100% 20%; -webkit-mask-image: linear-gradient(180deg, #000 62%, transparent); mask-image: linear-gradient(180deg, #000 62%, transparent); }
  .home-page .performance-home-heading > div, .home-page .performance-home-heading > .btn { max-width: 100%; }
  .home-page .performance-home-heading h2 { max-width: 20ch; }
}
.home-people { padding: clamp(56px, 8vw, 96px) 0; background: var(--white); }
.home-people-head { max-width: 760px; margin: 0 auto 36px; text-align: center; }
.home-people-head h2 { margin: 10px 0 14px; }
.home-people-head p { color: var(--text-secondary); font-size: 1.05rem; margin: 0; }
.home-people-list { list-style: none; margin: 0 auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 22px 16px; max-width: 1200px; }
.home-people-list li { width: 110px; }
.home-people-list a { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; color: inherit; text-decoration: none; }
.home-people-list img { width: 104px; height: 104px; border-radius: 50%; object-fit: cover; object-position: center 18%; background: var(--gray-100); margin-bottom: 8px; box-shadow: 0 8px 22px rgba(15, 23, 42, .12); transition: transform .2s ease; }
.home-people-list a:hover img, .home-people-list a:focus-visible img { transform: translateY(-3px); }
.home-people-list strong { color: var(--gray-900); font-size: 1rem; }
.home-people-list span { color: var(--text-muted); font-size: .82rem; line-height: 1.3; }
.home-people-more { text-align: center; margin: 34px 0 0; }
.home-people-more a { font-weight: 600; color: var(--primary); }
[data-theme="dark"] .home-people-more a { color: #93c5fd; }
@media (max-width: 520px) {
  .home-people-list { gap: 18px 8px; }
  .home-people-list li { width: calc((100% - 16px) / 3); }
  .home-people-list img { width: 80px; height: 80px; }
}
/* Équipe de l’accueil : titre puis les profils (photo de groupe retirée le 11/10). */
.home-people--team-photo { overflow: clip; scroll-margin-top: 80px; }
.home-people--team-photo .home-people-head { position: relative; }
.home-people--team-photo .home-people-head h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.15; letter-spacing: -.035em; }
.home-people--team-photo .home-people-list { max-width: 1040px; gap: 20px 24px; padding-top: 24px; border-top: 1px solid var(--gray-200); }
.home-people--team-photo .home-people-list li { width: calc((100% - 96px) / 5); }
.home-people--team-photo .home-people-list a { min-height: 44px; text-align: center; gap: 5px; }
.home-people--team-photo .home-people-list a:hover strong { color: var(--primary); }
.home-people--team-photo .home-people-list a:focus-visible { outline: 3px solid var(--primary); outline-offset: 5px; }
.home-people--team-photo .home-people-list strong { font-size: 14px; }
@media (max-width: 700px) {
  .home-people--team-photo .home-people-list { gap: 18px 12px; }
  .home-people--team-photo .home-people-list li { width: calc((100% - 24px) / 3); }
  .home-people--team-photo .home-people-list strong { font-size: 13px; }
  .home-people--team-photo .home-people-list span { font-size: 12px; }
}
@media (max-width: 400px) {
  .home-people--team-photo .home-people-list li { width: calc((100% - 12px) / 2); }
}
/* Pourquoi nous formons : le texte de présentation et le chiffre qui parle à chaque équipe,
   dans le langage des chiffres du site (« Nos résultats ») : pas de carte posée, le chiffre sur la page. */
.home-context { padding: clamp(56px, 8vw, 88px) 0; background: var(--white); border-bottom: 1px solid var(--gray-200); }
/* Le chiffre prend la place disponible, la vidéo la largeur de son cadre : plus de vide autour d’elle. */
.home-context-grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(32px, 6vw, 96px); align-items: center; }
/* Ordre du récit : le chiffre (l’émotion) puis notre réponse, en vidéo (Anthony). */
.home-context-video { display: grid; justify-items: center; gap: 14px; margin: 0; padding-left: clamp(24px, 4vw, 56px); border-left: 1px solid var(--gray-200); }
.home-context-video video { display: block; width: auto; height: min(680px, 78vh); max-width: 100%; aspect-ratio: 9 / 16; object-fit: cover; border-radius: var(--radius-lg); background: #101e34; box-shadow: 0 24px 50px rgba(15, 23, 42, .18); }
.home-context-video figcaption { max-width: 34ch; text-align: center; color: var(--text-secondary); font-size: 13px; line-height: 1.6; }
.home-context-video figcaption strong { display: block; color: var(--gray-900); font-size: 15px; }
.home-stat { margin: 0; }
/* Même titre que « Ils forment leurs équipes » : libellé au-dessus, même taille, même interlettrage. */
.home-stat-title { margin: 14px 0 26px; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.15; letter-spacing: -.035em; color: var(--gray-900); }
.home-stat-lead { margin: 0; color: var(--text-secondary); font-size: 11px; line-height: 1.5; font-weight: 700; letter-spacing: .065em; text-transform: uppercase; }
/* Le chiffre en vedette : « 1 » et « 3 » en très grand, le « 1 » en orange comme les silhouettes touchées. */
.home-stat-number { display: flex; align-items: center; gap: clamp(10px, 1.4vw, 18px); margin: 10px 0 16px; color: var(--primary); }
.home-stat-digit { font: 800 clamp(96px, 11vw, 156px)/.8 var(--font-body); letter-spacing: -.07em; font-variant-numeric: tabular-nums; }
.home-stat-digit--hit { color: var(--secondary); }
.home-stat.is-counted .home-stat-digit { animation: home-stat-pop .7s cubic-bezier(.2, .9, .3, 1.2) both; }
.home-stat.is-counted .home-stat-digit + .home-stat-unit + .home-stat-digit { animation-delay: .15s; }
@keyframes home-stat-pop { from { opacity: 0; transform: translateY(14px) scale(.9); } }
.home-stat-unit { font: 800 clamp(20px, 2.2vw, 30px)/1.05 var(--font-heading); text-transform: uppercase; letter-spacing: -.01em; color: var(--gray-900); }
.home-stat figcaption { display: grid; gap: 20px; }
.home-stat-caption { margin: 0; max-width: 46ch; color: var(--gray-800); font-size: 16px; line-height: 1.6; }
.home-stat-team { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 18px 22px; padding: 18px 0; border-block: 1px solid var(--gray-200); }
.home-stat-team ul { list-style: none; display: grid; grid-template-columns: repeat(10, 24px); gap: 6px 4px; margin: 0; padding: 0; }
.home-stat-team li svg { width: 24px; height: 24px; display: block; fill: var(--gray-300); transition: fill .4s ease; }
.home-stat.is-counted .home-stat-team li.is-hit svg { fill: var(--secondary); transition-delay: calc(var(--i, 0) * .18s); }
.home-stat-team p { margin: 0; color: var(--text-secondary); font-size: 14px; line-height: 1.6; }
.home-stat-team strong { color: var(--gray-900); }
.home-stat-source { margin: 0; font-size: 12px; line-height: 1.8; color: var(--text-secondary); }
.home-stat-source a { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
[data-theme="dark"] .home-stat-number { color: #93c5fd; }
[data-theme="dark"] .home-stat-unit { color: #f8fafc; }
[data-theme="dark"] .home-stat-source a { color: #93c5fd; }
@media (max-width: 860px) {
  .home-context-grid { grid-template-columns: 1fr; }
  .home-context-video { padding-left: 0; padding-top: 28px; border-left: 0; border-top: 1px solid var(--gray-200); }
  .home-context-video video { height: auto; width: min(100%, 340px); }
}
@media (max-width: 480px) { .home-stat-team { grid-template-columns: 1fr; } }
.home-video-frame { position: relative; display: grid; justify-items: center; }
.home-video-sound { position: absolute; top: 14px; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border: 0; border-radius: 99px; background: rgba(16, 30, 52, .78); color: #fff; font: 600 13px var(--font-body); cursor: pointer; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); box-shadow: 0 8px 20px rgba(0, 0, 0, .25); }
.home-video-sound:hover, .home-video-sound:focus-visible { background: var(--primary); }
.home-video-sound[hidden] { display: none; }
/* Rythme de l'accueil : fonds alternés pour distinguer « Ils nous font confiance » (nos clients, fond gris,
   logos en cartes) de « Ils l'ont vécu » (les participants, fond blanc, voix et visages). */
.home-page .client-proof { background: var(--gray-50); border-bottom: 1px solid var(--gray-200); }

/* Articles : montrés sur l'accueil, pas à chercher. Un article à la une, une question par métier. */
.home-articles { padding: clamp(56px, 8vw, 96px) 0; background: var(--white); }
.home-articles + .home-people, .home-articles + * .home-people { border-top: 1px solid var(--gray-200); }
.home-articles-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px 48px; margin-bottom: 36px; }
.home-articles-heading > div { max-width: 640px; }
.home-articles-heading h2 { margin: 12px 0 14px; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.15; letter-spacing: -.035em; color: var(--gray-900); text-wrap: balance; }
.home-articles-heading p { margin: 0; color: var(--text-secondary); font-size: 16px; line-height: 1.75; }
.home-articles-all { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; color: var(--primary); font-weight: 700; font-size: 15px; text-decoration: none; white-space: nowrap; }
.home-articles-all span { transition: transform .2s ease; }
.home-articles-all:hover span { transform: translateX(3px); }
.home-articles-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
.home-article a { display: block; color: inherit; text-decoration: none; }
.home-article img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 14px; background: var(--gray-100); }
.home-article h3 { margin: 0; color: var(--gray-900); letter-spacing: -.02em; text-wrap: balance; transition: color .15s ease; }
.home-article a:hover h3 { color: var(--primary); }
.home-article a:focus-visible { outline: 3px solid #f97316; outline-offset: 6px; border-radius: 14px; }
.home-article-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-bottom: 8px; color: var(--text-secondary); font-size: 13px; }
.home-article-meta span:first-child { color: #c2410c; font-weight: 700; }
.home-article--lead .home-article-meta { margin-top: 20px; }
.home-article--lead h3 { font-size: clamp(22px, 2.3vw, 28px); line-height: 1.25; }
.home-article--lead p { margin: 12px 0 16px; color: var(--text-secondary); font-size: 16px; line-height: 1.7; }
.home-article-read { display: inline-flex; gap: 8px; color: var(--primary); font-weight: 700; font-size: 15px; }
.home-articles-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--gray-200); }
.home-articles-list .home-article { border-bottom: 1px solid var(--gray-200); }
.home-articles-list a { display: grid; grid-template-columns: 148px minmax(0, 1fr); gap: 20px; align-items: center; padding: 18px 0; }
.home-articles-list img { border-radius: 10px; }
.home-articles-list h3 { font-size: 17px; line-height: 1.35; }
[data-theme="dark"] .home-article-meta span:first-child { color: #fdba74; }
@media (max-width: 900px) {
  .home-articles-grid { grid-template-columns: 1fr; }
  .home-articles-heading { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 520px) {
  .home-articles-list a { grid-template-columns: 104px minmax(0, 1fr); gap: 14px; padding: 14px 0; }
  .home-articles-list h3 { font-size: 16px; }
  .home-articles-all { white-space: normal; }
}