/* ==========================================================================
   AGENCE 4A — habillage organique et épuré pour Avada
   Lin, encre, sauge, argile. Beaucoup d'air, des formes douces, peu d'effets.
   Retirer ce fichier (ou désactiver le plugin) rend le site à Avada, sans trace.
   ========================================================================== */

/* ---------- 1. Jetons ---------- */
:root {
  --fond: #F3F0E8;          /* lin */
  --surface: #FAF8F3;
  --texte: #1D1C19;         /* encre */
  --texte-2: #6B675E;
  --ligne: rgba(29, 28, 25, .12);
  --sauge: #8E9C80;
  --sauge-pale: #E2E6D8;
  --argile: #B9876B;
  --argile-pale: #F0E2D5;
  --encart: #E7E9DF;
  --accent-bg: #1D1C19;
  --accent-fg: #FAF8F3;
  --focus: #6F7F62;
  --sauge-fort: #5C6C50;
  --forme-a: 61% 39% 52% 48% / 44% 58% 42% 56%;
  --forme-b: 42% 58% 38% 62% / 56% 40% 60% 44%;
  --doux: cubic-bezier(.22, .61, .36, 1);
  --police: 'Satoshi', 'Satoshi Repli', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, system-ui, sans-serif;
  --serif: 'Gambetta', Georgia, 'Times New Roman', serif;
  --titres: 'General Sans', 'General Sans Repli', 'Satoshi', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;

  /* Avada lit ses couleurs ici : on les aligne sur le lin et l'encre */
  --awb-color1: var(--fond);
  --awb-color2: var(--surface);
  --awb-color4: var(--sauge);
  --awb-color7: var(--texte-2);
  --awb-color8: var(--texte);
  color-scheme: light;
}
:root:is([data-theme='sombre'], [data-fond='noir']) {
  --fond: #121310; --surface: #191A16; --texte: #ECE8DF; --texte-2: #A29E93; --ligne: rgba(236, 232, 223, .12);
  --sauge: #A9B79B; --sauge-pale: #22261E; --argile: #D3A387; --argile-pale: #2A211B; --encart: #1D2019;
  --accent-bg: #ECE8DF; --accent-fg: #121310; --focus: #C9D4BC; --sauge-fort: #A9B79B;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='clair']) {
    --fond: #121310; --surface: #191A16; --texte: #ECE8DF; --texte-2: #A29E93; --ligne: rgba(236, 232, 223, .12);
    --sauge: #A9B79B; --sauge-pale: #22261E; --argile: #D3A387; --argile-pale: #2A211B; --encart: #1D2019;
    --accent-bg: #ECE8DF; --accent-fg: #121310; --focus: #C9D4BC; --sauge-fort: #A9B79B;
    color-scheme: dark;
  }
}

/* Fond « Noir » : un noir uni, sans la teinte olive du thème sombre */
:root[data-fond='noir'] { --fond: #050505; --surface: #0C0C0B; --sauge-pale: #1A1D17; --argile-pale: #1E1913; --encart: #121411; }
/* Autres fonds animés : le canevas WebGL se place derrière le contenu ; les formes floues du fond « Lin » se retirent */

/* ---------- 2. Base ---------- */
/* !important et :root : Avada (« Couleur d'arrière-plan du site », feuille dynamique chargée après la nôtre) pose
   html { background-color: var(--bg_color) } avec une couleur blanche de sa palette, et gagnait à égalité de force. */
html, html:root { background: var(--fond) !important; background-image: none !important; }
:root { --bg_color: var(--fond); --bg_image: none; }
html body.fusion-body, html body.fusion-body #boxed-wrapper, html body.fusion-body #wrapper, html body.fusion-body #main { background-color: transparent !important; }
/* Les photos de fond des pages (rideau, machine à écrire) chargent l'écran : on les retire */
html body.fusion-body #main { background-image: none !important; }
html body .post-content .fusion-fullwidth { background-color: transparent !important; background-image: none !important; }
html body .post-content :is(.awb-background-pattern, .awb-background-mask, .fullwidth-overlay) { display: none !important; }
html body #boxed-wrapper { position: relative; z-index: 1; }
body.fusion-body {
  color: var(--texte); font-family: var(--police); font-size: 17px; line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
html body, html body :is(p, li, input, textarea, select, button, label, .fusion-text, .fusion-text a, .fusion-button-text) { font-family: var(--police) !important; }
/* !important : Avada colore ses titres (h1…h6, .fusion-title-heading) depuis ses réglages typographiques, avec une feuille chargée après la nôtre */
html body :is(h1, h2, h3, h4, h5, h6, .fusion-title-heading, .fusion-title h1, .fusion-title h2, .fusion-title h3, .fusion-title h4, .fusion-title h5, .fusion-title h6, .a4a-contact-titre, .a4a-rubrique-nom) { font-family: var(--titres) !important; color: var(--texte) !important; }
body.fusion-body :is(.fusion-text, .fusion-text p, .post-content p, li) { color: var(--texte); }
body.fusion-body .fusion-text a, body.fusion-body .post-content p a {
  color: var(--texte); text-decoration: underline; text-decoration-color: var(--sauge); text-underline-offset: 4px; text-decoration-thickness: 1px;
  transition: text-decoration-color 120ms var(--doux), color 120ms var(--doux);
}
body.fusion-body .fusion-text a:hover, body.fusion-body .post-content p a:hover { text-decoration-color: currentColor; }
::selection { background: var(--sauge-pale); color: var(--texte); }

/* ---------- 3. En-tête ---------- */
html body .fusion-tb-header .fusion-fullwidth,
html body .fusion-tb-header .fusion-fullwidth:is(.fusion-sticky-container, .fusion-is-sticky, .fusion-sticky-transition) {
  background-color: transparent !important; border-bottom: 1px solid transparent; box-shadow: none !important;
  transition: background-color 160ms var(--doux), border-color 160ms var(--doux);
}
/* Dès que la page défile : un voile de lin et un trait fin */
:root[data-defile] body .fusion-tb-header .fusion-fullwidth {
  background-color: color-mix(in srgb, var(--fond) 86%, transparent) !important;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom-color: var(--ligne);
}
/* Les logos sont des images sombres sur fond clair : en mode sombre, on les inverse */
:root:is([data-theme='sombre'], [data-fond='noir']) img[src*='/logo-'] { filter: invert(1) brightness(1.05); }
@media (prefers-color-scheme: dark) { :root:not([data-theme='clair']) img[src*='/logo-'] { filter: invert(1) brightness(1.05); } }
html body .fusion-tb-header .fusion-imageframe img { max-height: 54px; width: auto; }

/* Menu : la liste d'Avada est remplacée par un bouton « Menu » (posé par le script) qui ouvre un panneau plein écran.
   Sans script, la liste d'Avada reste visible. */
:root[data-a4a-menu] .fusion-tb-header .awb-menu { display: none !important; }
html body .a4a-menubtn {
  all: unset; box-sizing: border-box; position: relative; display: inline-flex; align-items: center; gap: 12px; margin-left: auto; padding: 11px 14px 11px 22px;
  border-radius: 999px; border: 1px solid var(--ligne); background: color-mix(in srgb, var(--surface) 60%, transparent); color: var(--texte);
  font: 500 15px/1 var(--police); letter-spacing: .01em; cursor: pointer; overflow: hidden; -webkit-tap-highlight-color: transparent;
  transition: background-color 120ms var(--doux), border-color 120ms var(--doux);
}
html body .a4a-menubtn:hover { border-color: var(--texte); }
html body .a4a-menubtn:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.a4a-menubtn-ico { position: relative; width: 22px; height: 22px; border-radius: 50%; background: var(--sauge-pale); display: block; flex: none; transition: border-radius 280ms var(--doux), background-color 120ms var(--doux); }
.a4a-menubtn:hover .a4a-menubtn-ico { border-radius: var(--forme-b); background: var(--sauge); }
.a4a-menubtn-ico i { position: absolute; left: 6px; right: 6px; height: 1.5px; background: var(--texte); border-radius: 2px; transition: transform 160ms var(--doux), top 160ms var(--doux); }
.a4a-menubtn-ico i:first-child { top: 8px; }
.a4a-menubtn-ico i:last-child { top: 13px; }
:root[data-menu-ouvert] .a4a-menubtn-ico i:first-child { top: 10.5px; transform: rotate(45deg); }
:root[data-menu-ouvert] .a4a-menubtn-ico i:last-child { top: 10.5px; transform: rotate(-45deg); }

/* Le panneau : lin plein écran, il s'ouvre en cercle depuis le bouton */
.a4a-menu {
  position: fixed; inset: 0; z-index: 2000002; display: flex; flex-direction: column; background: var(--fond); color: var(--texte); overflow-y: auto; overscroll-behavior: contain;
  visibility: hidden; clip-path: circle(0 at var(--ox, 90%) var(--oy, 6%)); transition: clip-path 310ms var(--doux), visibility 0s linear 310ms;
}
.a4a-menu[data-etat='ouvert'] { visibility: visible; clip-path: circle(160vmax at var(--ox, 90%) var(--oy, 6%)); transition: clip-path 350ms var(--doux), visibility 0s; }
.a4a-menu-haut, .a4a-menu-corps { position: relative; z-index: 1; width: 100%; max-width: 1248px; margin-inline: auto; padding-inline: 30px; }
.a4a-menu-haut { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 22px; min-height: 100px; }
.a4a-menu-haut img { display: block; max-height: 54px; width: auto; }
.a4a-menu-fermer { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 12px; padding: 11px 14px 11px 22px; border-radius: 999px; border: 1px solid var(--ligne); background: color-mix(in srgb, var(--surface) 60%, transparent); font: 500 15px/1 var(--police); color: var(--texte); cursor: pointer; transition: border-color 120ms var(--doux); }
.a4a-menu-fermer:hover { border-color: var(--texte); }
.a4a-menu-fermer:focus-visible, .a4a-menu a:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; }
.a4a-menu-fermer .a4a-menubtn-ico { background: var(--sauge); }
.a4a-menu-fermer .a4a-menubtn-ico i:first-child { top: 10.5px; transform: rotate(45deg); }
.a4a-menu-fermer .a4a-menubtn-ico i:last-child { top: 10.5px; transform: rotate(-45deg); }
.a4a-menu-corps { flex: 1; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-content: center; padding-block: clamp(8px, 3vh, 40px) clamp(32px, 6vh, 72px); }
.a4a-menu-liste { display: flex; flex-direction: column; }
.a4a-menu-lien {
  position: relative; display: flex; align-items: center; gap: 18px; padding: clamp(5px, 1.1vh, 11px) 0; color: var(--texte-2) !important; text-decoration: none !important;
  font: 500 clamp(2rem, 6.4vh, 4.4rem)/1.04 var(--titres) !important; letter-spacing: -.035em; transition: color 160ms var(--doux), transform 230ms var(--doux);
}
.a4a-menu-lien::before { content: ''; flex: none; width: .26em; height: .26em; margin-left: -.5em; border-radius: 50%; background: var(--sauge); transform: scale(0); transition: transform 190ms var(--doux), margin 190ms var(--doux); }
.a4a-menu-lien:is(:hover, :focus-visible) { color: var(--texte) !important; transform: translateX(8px); }
.a4a-menu-lien:is(:hover, :focus-visible)::before { transform: scale(1); margin-left: 0; border-radius: var(--forme-b); }
.a4a-menu-lien[aria-current='page'] { color: var(--texte) !important; }
.a4a-menu-lien[aria-current='page']::before { transform: scale(1); margin-left: 0; }
.a4a-menu-lateral { display: flex; flex-direction: column; justify-content: flex-end; gap: 30px; padding-bottom: 8px; }
.a4a-menu-etiq { margin: 0 0 8px; font: 500 12px/1 var(--police); letter-spacing: .12em; text-transform: uppercase; color: var(--texte-2); }
.a4a-menu-lateral p { margin: 0; font-size: 1.05rem; line-height: 1.5; }
.a4a-menu-lateral a { color: var(--texte); text-decoration: underline; text-decoration-color: var(--sauge); text-underline-offset: 4px; transition: text-decoration-color 120ms var(--doux); }
.a4a-menu-lateral a:hover { text-decoration-color: currentColor; }
/* Entrée des liens : ils montent l'un après l'autre */
.a4a-menu .a4a-menu-lien, .a4a-menu .a4a-menu-lateral > div { opacity: 0; transform: translateY(28px); transition: opacity 160ms var(--doux), transform 230ms var(--doux), color 160ms var(--doux); }
.a4a-menu[data-etat='ouvert'] .a4a-menu-lien, .a4a-menu[data-etat='ouvert'] .a4a-menu-lateral > div { opacity: 1; transform: none; transition: opacity 280ms var(--doux), transform 350ms var(--doux), color 160ms var(--doux); transition-delay: calc(100ms + var(--i, 0) * 50ms); }
.a4a-menu[data-etat='ouvert'] .a4a-menu-lien:is(:hover, :focus-visible) { transform: translateX(8px); transition-delay: 50ms; }
:root[data-menu-ouvert] body { overflow: hidden; }
@media (max-width: 760px) {
  .a4a-menu-haut, .a4a-menu-corps { padding-inline: 20px; }
  .a4a-menu-haut { min-height: 76px; padding-block: 14px; }
  .a4a-menu-corps { grid-template-columns: 1fr; gap: 28px; align-content: start; padding-bottom: 96px; }
  .a4a-menu-lien { font-size: clamp(1.9rem, 8.4vw, 2.6rem) !important; }
  .a4a-menu-lateral { justify-content: flex-start; gap: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .a4a-menu, .a4a-menu[data-etat='ouvert'] { transition: none; }
  .a4a-menu .a4a-menu-lien, .a4a-menu .a4a-menu-lateral > div { opacity: 1; transform: none; transition: none; }
}
:root[data-effets='reduits'] .a4a-menu, :root[data-effets='reduits'] .a4a-menu[data-etat='ouvert'] { transition: none !important; }
:root[data-effets='reduits'] .a4a-menu :is(.a4a-menu-lien, .a4a-menu-lateral > div) { opacity: 1 !important; transform: none !important; transition: none !important; }

/* ---------- 4. Titres ---------- */
html body .fusion-title h1 { font-weight: 500; letter-spacing: -.035em; line-height: 1.04; text-wrap: balance; }
html body .post-content .fusion-title-size-one h1 { font-size: clamp(2.3rem, 5.6vw, 4.4rem); }
html body .fusion-title h2 { font-weight: 500; letter-spacing: -.03em; }
html body .fusion-title h5 { font-weight: 500; letter-spacing: -.01em; }
/* Un trait de pinceau sous les titres centrés */
html body .fusion-title-center h1::after {
  content: ''; display: block; width: 84px; height: 12px; margin: 22px auto 0; background: var(--sauge);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 84 12'%3E%3Cpath d='M2 7c12-5 22-5 34-1s24 5 46-3' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 84 12'%3E%3Cpath d='M2 7c12-5 22-5 34-1s24 5 46-3' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* ---------- 4b. Logo 4A : quatre pièces, un axe commun ----------
   Analyse du logo : quatre formes pleines alignées sur la même verticale à droite (x = 333 sur 500).
   1. un triangle rectangle (pointe en haut) ; 2. une barre dont le bord gauche est incliné comme l'hypoténuse du triangle ;
   3. un petit rectangle posé à sa droite, de même hauteur ; 4. un pied rectangulaire sous la barre.
   Les écarts entre pièces sont réguliers (26 unités), ce qui permet de les écarter et de les rassembler. */
.a4a-logo { display: block; width: auto; height: 100%; overflow: visible; color: var(--texte); }
.a4a-logo polygon {
  fill: currentColor; cursor: default; translate: calc(var(--nx, 0) * var(--pr, 0) * var(--petit, 1) * 1px) calc(var(--ny, 0) * var(--pr, 0) * var(--petit, 1) * 1px);
  transition: fill 170ms var(--doux), translate 350ms var(--doux);
}
.a4a-logo polygon:hover, .a4a-logo polygon.est-actif { fill: var(--sauge); }
/* les pièces arrivent de quatre côtés et se posent l'une après l'autre */
@keyframes a4a-assemble { from { transform: translate(calc(var(--sx) * 1px), calc(var(--sy) * 1px)); opacity: 0; } 60% { opacity: 1; } to { transform: none; opacity: 1; } }
.a4a-logo.a4a-monte polygon { animation: a4a-assemble 590ms var(--doux) backwards; animation-delay: calc(50ms + var(--k) * 50ms); }
.fusion-tb-header .a4a-logo, .a4a-menu-logo .a4a-logo { height: 58px; }
.fusion-tb-header a:has(.a4a-logo), .a4a-menu-logo a { display: inline-block; line-height: 0; }
:root[data-effets='reduits'] .a4a-logo polygon { animation: none !important; transition: fill 170ms var(--doux); translate: none; }
@media (prefers-reduced-motion: reduce) { .a4a-logo polygon { animation: none !important; translate: none; } }

/* ---------- 4c. Accueil : le logo, posé sur la page ---------- */
/* Quand le logo d'accueil est présent, les deux éléments d'origine (grand logo et titre) laissent la place */
/* seulement dans le contenu qui porte l'accueil : le titre d'une autre page (Les Auteurs…) reste affiché */
.post-content:has(.a4a-hero) .fusion-image-element:has(img[src*='logo-big']),
.post-content:has(.a4a-hero) .fusion-title:has(h1) { display: none !important; }
.a4a-hero { max-width: 1120px; margin: clamp(24px, 7vh, 80px) auto clamp(40px, 8vw, 96px); padding: 0 24px; text-align: center; }
.a4a-hero-logo { height: clamp(220px, 40vh, 380px); display: flex; justify-content: center; }
.a4a-hero-titre {
  margin: clamp(22px, 4vw, 40px) auto 0; max-width: 40ch; text-align: center; font: italic 400 clamp(.95rem, 1.25vw, 1.12rem)/1.5 var(--serif) !important; letter-spacing: .01em;
  color: var(--texte-2) !important; text-wrap: balance;
}
.a4a-hero-titre .a4a-mot { transition: color 170ms var(--doux), box-shadow 170ms var(--doux); border-radius: 2px; }
.a4a-hero-titre .a4a-mot b { font-weight: inherit; color: var(--sauge-fort); transition: color 170ms var(--doux); }
.a4a-hero-titre .a4a-mot.est-actif { color: var(--texte); box-shadow: 0 .14em 0 -.04em var(--sauge); }
.a4a-hero-titre .a4a-mot.est-actif b { color: var(--texte); }
@media (max-width: 760px) { .a4a-hero { padding: 0 16px; } .a4a-hero-logo { height: clamp(180px, 34vh, 280px); } }
/* ---------- 4d. Accueil en scène : les images des projets derrière le logo, le 4 monte prendre la place du petit, la bande-annonce passe devant ----------
   data-etat : « intro » (logo et titre sur les images assombries), « vol » (le grand 4 monte vers l'en-tête), « film » (bande-annonce). */
html:has(.a4a-scene) { overflow-x: clip; }
.a4a-scene { position: relative; isolation: isolate; width: 100vw; max-width: none; margin: 0 0 0 calc(50% - 50vw); padding: 0; min-height: max(540px, calc(100svh - var(--entete, 100px) - 80px)); display: flex; align-items: center; justify-content: center; overflow: visible; background: #050505; }
.a4a-scene-centre { position: relative; z-index: 3; width: 100%; max-width: 1120px; padding: clamp(24px, 5vh, 56px) 24px; text-align: center; }
.a4a-fond, .a4a-voile { position: absolute; inset: 0; overflow: hidden; }
.a4a-fond { z-index: 0; }
.a4a-voile { z-index: 1; pointer-events: none; }
.a4a-voile::before, .a4a-voile::after { content: ''; position: absolute; inset: 0; transition: opacity 700ms var(--doux); }
.a4a-voile::before { background: radial-gradient(ellipse 70% 62% at 50% 46%, rgba(5, 5, 5, .5) 0, rgba(5, 5, 5, .78) 62%, rgba(5, 5, 5, .9) 100%); }
.a4a-voile::after { opacity: 0; background: linear-gradient(to top, rgba(5, 5, 5, .92) 0, rgba(5, 5, 5, .5) 34%, rgba(5, 5, 5, .1) 62%, rgba(5, 5, 5, .38) 100%); }
.a4a-scene[data-etat='film'] .a4a-voile::before { opacity: .1; }
.a4a-scene[data-etat='film'] .a4a-voile::after { opacity: 1; }
.a4a-scene[data-etat='vol'] .a4a-voile::before { opacity: .45; }
.a4a-scene[data-etat='vol'] .a4a-voile::after { opacity: .6; }
.a4a-diapo { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity 600ms var(--doux); background: #0A0A09; }
.a4a-diapo.est-actif { opacity: 1; }
.a4a-diapo > img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); }
.a4a-diapo.est-actif > img { animation: a4a-kb 14s ease-out forwards; }
@keyframes a4a-kb { from { transform: scale(1.02); } to { transform: scale(1.1); } }
.a4a-diapo > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 500ms var(--doux); }
.a4a-diapo.est-lu > video { opacity: 1; }
/* image plus haute que large : posée entière à droite sur son propre flou */
.a4a-diapo.est-portrait::before { content: ''; position: absolute; inset: -12%; background: var(--img) center / cover; filter: blur(34px) brightness(.5) saturate(1.1); }
.a4a-diapo.est-portrait > img { position: absolute; right: clamp(24px, 9vw, 170px); top: 50%; translate: 0 -50%; width: auto; height: min(70%, 600px); max-width: 44%; object-fit: contain; border-radius: 6px; box-shadow: 0 30px 80px rgba(0, 0, 0, .55); animation: none; transform: none; }
.a4a-scene .a4a-hero-titre { transition: opacity 360ms var(--doux), transform 360ms var(--doux); }
.a4a-scene[data-etat='vol'] .a4a-hero-titre, .a4a-scene[data-etat='film'] .a4a-hero-titre { opacity: 0; transform: translateY(14px); }
.a4a-scene[data-etat='film'] .a4a-scene-centre { visibility: hidden; }
/* la bande-annonce */
.a4a-film { position: absolute; inset: 0; z-index: 4; display: grid; align-content: end; gap: 22px; padding: clamp(20px, 4vw, 56px) clamp(20px, 4vw, 56px) clamp(26px, 4vw, 48px); pointer-events: none; visibility: hidden; }
.a4a-scene[data-etat='film'] .a4a-film { visibility: visible; }
.a4a-film > * { opacity: 0; transform: translateY(16px); transition: opacity 520ms var(--doux), transform 520ms var(--doux); }
.a4a-scene[data-etat='film'] .a4a-film > * { opacity: 1; transform: none; }
.a4a-scene[data-etat='film'] .a4a-film > :nth-child(2) { transition-delay: 90ms; } .a4a-scene[data-etat='film'] .a4a-film > :nth-child(3) { transition-delay: 160ms; } .a4a-scene[data-etat='film'] .a4a-film > :nth-child(4) { transition-delay: 230ms; }
.a4a-film-etiq { position: absolute; top: clamp(20px, 4vw, 44px); left: clamp(20px, 4vw, 56px); margin: 0; display: flex; align-items: center; gap: 10px; font: 500 12px/1 var(--police); letter-spacing: .14em; text-transform: uppercase; color: var(--texte); }
.a4a-film-etiq::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--sauge); }
.a4a-film-textes { display: grid; max-width: min(760px, 100%); }
.a4a-film-legende { grid-area: 1 / 1; align-self: end; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; opacity: 0; visibility: hidden; transform: translateY(14px); transition: opacity 420ms var(--doux), transform 420ms var(--doux), visibility 0s 420ms; }
.a4a-film-legende.est-actif { opacity: 1; visibility: visible; transform: none; transition: opacity 520ms var(--doux) 140ms, transform 520ms var(--doux) 140ms, visibility 0s; pointer-events: auto; }
.a4a-film-sous { margin: 0; font: 500 12px/1.3 var(--police); letter-spacing: .14em; text-transform: uppercase; color: var(--texte-2); }
html body .a4a-film-titre { margin: 0; padding: 0; font: 500 clamp(2rem, 5.6vw, 4.8rem)/1.02 var(--titres) !important; letter-spacing: -.035em; color: var(--texte); text-wrap: balance; }
.a4a-film-legende .a4a-bouton { margin-top: 8px; }
.a4a-film-ctrl { position: absolute; right: clamp(20px, 4vw, 56px); bottom: clamp(34px, 4vw, 58px); display: flex; align-items: center; gap: 10px; pointer-events: auto; }
.a4a-film-ctrl button { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(236, 232, 223, .3); background: rgba(5, 5, 5, .45); color: var(--texte); font: 500 16px/1 var(--police); display: grid; place-items: center; cursor: pointer; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: background-color 160ms var(--doux), border-color 160ms var(--doux); }
.a4a-film-ctrl button:hover { background: rgba(236, 232, 223, .16); border-color: rgba(236, 232, 223, .6); }
.a4a-film-pause span { width: 12px; height: 14px; border-left: 3px solid currentColor; border-right: 3px solid currentColor; box-sizing: border-box; }
.a4a-film-pause[aria-pressed='true'] span { width: 0; height: 0; border: 0; border-left: 12px solid currentColor; border-top: 8px solid transparent; border-bottom: 8px solid transparent; margin-left: 3px; }
.a4a-film-compte { min-width: 64px; text-align: right; font: 500 13px/1 var(--police); letter-spacing: .08em; color: var(--texte-2); }
.a4a-film-compte b { color: var(--texte); font-weight: 500; }
.a4a-film-barres { display: flex; gap: 6px; pointer-events: auto; margin-inline: calc(-1 * clamp(20px, 4vw, 56px)); padding-inline: clamp(20px, 4vw, 56px); }
.a4a-film-barre { flex: 1; height: 22px; padding: 9px 0; border: 0; background: none; cursor: pointer; }
.a4a-film-barre i { display: block; height: 3px; border-radius: 2px; background: rgba(236, 232, 223, .26); position: relative; overflow: hidden; }
.a4a-film-barre i::after { content: ''; position: absolute; inset: 0; background: var(--texte); transform-origin: left; transform: scaleX(0); }
.a4a-film-barre.est-fait i::after { transform: scaleX(1); }
.a4a-film-barre.est-actif i::after { animation: a4a-barre var(--duree, 6500ms) linear forwards; animation-play-state: var(--lecture, running); }
[data-calme] .a4a-film-barre.est-actif i::after { animation: none; transform: scaleX(1); }
@keyframes a4a-barre { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.a4a-film-barre:focus-visible, .a4a-film-ctrl button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
/* en-tête : le petit 4 attend l'arrivée du grand ; si le script ne démarre pas, il revient seul */
@keyframes a4a-intro-secours { to { opacity: 1; } }
html[data-intro] .fusion-tb-header .a4a-logo { opacity: 0; animation: a4a-intro-secours 0s 4.5s forwards; }
.a4a-vole { position: fixed !important; z-index: 100000; margin: 0; pointer-events: none; transform-origin: 0 0; }
@media (max-width: 760px) {
  .a4a-scene { min-height: max(520px, calc(100svh - var(--entete, 90px) - 120px)); }
  .a4a-diapo.est-portrait > img { right: 50%; translate: 50% -64%; height: 50%; max-width: 70%; }
  .a4a-film-ctrl { bottom: auto; top: clamp(16px, 4vw, 40px); right: clamp(16px, 4vw, 40px); }
  .a4a-film-ctrl .a4a-film-compte { display: none; }
  .a4a-film-etiq { top: clamp(26px, 6vw, 48px); }
}
@media (prefers-reduced-motion: reduce) { .a4a-diapo.est-actif > img { animation: none; } .a4a-film > *, .a4a-diapo { transition-duration: 1ms; } }
:root[data-effets='reduits'] .a4a-diapo.est-actif > img { animation: none; }


/* ---------- 5a. Livres : des couvertures, pas des portraits ----------
   Une colonne d'image sans nom (titre) est une couverture : coins légèrement arrondis, proportions d'origine, pas d'arche. */
html body .post-content .fusion-layout-column:has(.awb-image-frame):not(:has(.fusion-title)) > .fusion-column-wrapper { padding: 0 0 8px; }
html body .post-content .fusion-layout-column:has(.awb-image-frame):not(:has(.fusion-title)) :is(.awb-image-frame, .fusion-imageframe) {
  display: block; overflow: hidden; border-radius: 12px; background: transparent; box-shadow: 0 18px 34px -22px rgba(0, 0, 0, .55);
  transition: transform 230ms var(--doux), box-shadow 230ms var(--doux);
}
html body .post-content .fusion-layout-column:has(.awb-image-frame):not(:has(.fusion-title)) img { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; -webkit-mask: none !important; mask: none !important; }
@media (hover: hover) and (pointer: fine) {
  html body .post-content .fusion-layout-column:has(.awb-image-frame):not(:has(.fusion-title)) > .fusion-column-wrapper:hover :is(.awb-image-frame, .fusion-imageframe) { transform: translateY(-5px); box-shadow: 0 26px 40px -22px rgba(0, 0, 0, .6); }
}
/* nom de l'auteur au-dessus de ses couvertures */
html body .post-content .fusion-title h3 { margin: 0; font-weight: 500; letter-spacing: -.02em; font-size: clamp(1.25rem, 2.2vw, 1.6rem); }
html body .post-content .fusion-title-size-three { margin: clamp(10px, 2vw, 24px) 0 4px !important; }

/* ---------- 5. Portraits : des arches ---------- */
html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) > .fusion-column-wrapper { padding: 0 0 8px; }
html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) :is(.awb-image-frame, .fusion-imageframe) {
  display: block; overflow: hidden; border-radius: 999px 999px 26px 26px; background: var(--sauge-pale);
  transform: translateZ(0); transition: border-radius 280ms var(--doux), transform 280ms var(--doux), opacity 350ms var(--doux);
}
html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) img {
  display: block; width: 100%; height: auto; aspect-ratio: 2 / 3; object-fit: cover;
  -webkit-mask: none !important; mask: none !important; transition: transform 350ms var(--doux), filter 230ms var(--doux);
}
@media (hover: hover) and (pointer: fine) {
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) > .fusion-column-wrapper:hover :is(.awb-image-frame, .fusion-imageframe) { border-radius: 48% 52% 40px 40px / 30% 30% 40px 40px; transform: translateY(-4px); }
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) > .fusion-column-wrapper:hover img { transform: scale(1.04); }
}
html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-title { margin: 18px 0 2px !important; }
html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-title h5 { font-size: 1.05rem; line-height: 1.25; }
html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-text { margin-top: 2px; }
html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-text p { margin: 0; font-size: .88rem; text-align: center; }
html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-text a { color: var(--texte-2); }
html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-text a:hover { color: var(--texte); }
/* les portraits attendent le mélange (verre-dencre.js) pour ne jamais s'afficher une seconde dans l'ordre alphabétique ;
   si le script ne répond pas, ils apparaissent d'eux-mêmes au bout de 3 s */
/* Avant le bloc « tôt » du script (voir verre-dencre.js), les blocs qui vont entrer en scène sont posés cachés : pas d'éclair, puis disparition, puis fondu.
   Si le script ne tourne jamais, tout apparaît au bout de 3 s. */
html:not([data-a4a-tot]) :is(.post-content .fusion-title, .post-content .fusion-text, .post-content .fusion-form, .a4a-rubrique-nom, .a4a-contact-titre, .a4a-contact-liens) { opacity: 0; animation: a4a-secours 0s 3s forwards; }
html:not([data-a4a-tot]) .post-content .fusion-layout-column:has(.awb-image-frame) > .fusion-column-wrapper { opacity: 0; animation: a4a-secours 0s 3s forwards; }
@keyframes a4a-secours { to { opacity: 1; } }
/* « lien de colonne » d'Avada : une zone cliquable sur toute la colonne passait devant le portrait */
html body .post-content .fusion-layout-column:has(.awb-image-frame) :is(.fusion-column-inner-bg, a.fusion-column-anchor, .fusion-column-inner-bg-image) { pointer-events: none !important; }
/* … et, pour ces colonnes, Avada coupe les clics sur tout leur contenu (c'est l'ancre qui les recevait) : on les rend au portrait et au nom */
html body .post-content .fusion-layout-column:has(.awb-image-frame) > .fusion-column-wrapper { pointer-events: auto !important; }
/* lien d'origine gardé sous le nom (galerie de photos, site personnel, Instagram) */
html body .post-content .a4a-carte-lien { margin: 4px 0 0; text-align: center; font-size: .86rem; line-height: 1.3; }
html body .post-content .a4a-carte-lien a { color: var(--texte-2) !important; text-decoration: underline; text-decoration-color: var(--ligne); text-underline-offset: 3px; transition: color 120ms var(--doux), text-decoration-color 120ms var(--doux); }
html body .post-content .a4a-carte-lien a:hover { color: var(--texte) !important; text-decoration-color: var(--sauge); }
/* portrait sans photo (logo noir sur blanc posé par le site) : inversé pour rester dans le noir de la page */
html body .post-content .awb-image-frame.a4a-sans-photo, html body .post-content .a4a-sans-photo .fusion-imageframe, .a4a-cv-photo.a4a-sans-photo { background: #0F0F0E; box-shadow: inset 0 0 0 1px var(--ligne); }
.a4a-sans-photo img { filter: invert(1) brightness(.9); mix-blend-mode: lighten; opacity: .9; }
/* Une ligne de portraits respire : plus d'espace entre les rangées */
html body .post-content .fusion-fullwidth:has(.awb-image-frame) { padding-bottom: 12px !important; }
html body .post-content .fusion-layout-column:has(.awb-image-frame) { margin-bottom: 36px !important; }

/* Encarts colorés posés dans Avada (ex. coordonnées sur la page Contact) : marqués par le script */
html body .post-content .a4a-encart { background-color: var(--encart) !important; border-radius: 40px; }
html body .post-content .a4a-encart :is(p, h1, h2, h3, h4, h5, a, span) { color: var(--texte) !important; }
html body .post-content .a4a-encart :is(hr, .fusion-separator, .fusion-separator-border) { border-color: var(--ligne) !important; }

/* ---------- 5b. Page dédiée au CV d'un talent ---------- */
.a4a-cv { max-width: 1120px; margin: clamp(8px, 2vh, 24px) auto clamp(48px, 8vw, 110px); padding: 0 24px; }
.a4a-cv-retour { display: inline-flex; align-items: center; gap: 8px; margin-bottom: clamp(20px, 3vw, 36px); font-size: .92rem; color: var(--texte-2) !important; text-decoration: none !important; transition: color 80ms var(--doux), transform 100ms var(--doux); }
.a4a-cv-retour:hover { color: var(--texte) !important; transform: translateX(-4px); }
.a4a-cv-tete { display: flex; align-items: flex-end; gap: clamp(22px, 4vw, 52px); margin-bottom: clamp(24px, 4vw, 48px); }
.a4a-cv-photo { flex: none; width: clamp(120px, 17vw, 190px); margin: 0; border-radius: 999px 999px 26px 26px; overflow: hidden; background: var(--sauge-pale); }
.a4a-cv-photo img { display: block; width: 100%; aspect-ratio: 2 / 3; object-fit: cover; }
.a4a-cv-id { min-width: 0; padding-bottom: 6px; }
.a4a-cv-etiq { margin: 0 0 10px; font: 500 12px/1 var(--police); letter-spacing: .12em; text-transform: uppercase; color: var(--texte-2); }
html body .a4a-cv-nom { margin: 0 0 22px; font: 500 clamp(2rem, 4.6vw, 3.4rem)/1.04 var(--titres) !important; letter-spacing: -.035em; text-wrap: balance; color: var(--texte); }
.a4a-cv-actions { margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.a4a-cv-note { margin: -8px 0 22px; max-width: 46ch; color: var(--texte-2); line-height: 1.55; }
/* fiche d'un comédien : bande démo, photos, puis le CV lu dans le PDF */
.a4a-cv-bloc { margin-top: clamp(32px, 5vw, 64px); }
.a4a-cv-sous { margin: 0 0 18px !important; padding-top: 14px; border-top: 1px solid var(--ligne); font: 500 12px/1 var(--police) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--texte-2) !important; }
.a4a-cv-riche > .a4a-cv-sous { margin-top: clamp(32px, 5vw, 64px) !important; }
.a4a-demo {
  position: relative; display: grid; place-items: center; align-content: center; gap: 12px; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 26px;
  background: radial-gradient(120% 120% at 50% 0%, var(--surface), var(--fond) 70%); border: 1px solid var(--ligne); color: var(--texte) !important; text-decoration: none !important;
  transition: border-color 160ms var(--doux), transform 230ms var(--doux), border-radius 280ms var(--doux);
}
.a4a-demo:hover { border-color: var(--texte-2); border-radius: 40px; transform: translateY(-3px); }
.a4a-demo-play { display: block; width: clamp(64px, 9vw, 92px); aspect-ratio: 1; border-radius: 50%; background: var(--accent-bg); position: relative; transition: transform 190ms var(--doux); }
.a4a-demo-play::after { content: ''; position: absolute; left: 53%; top: 50%; transform: translate(-50%, -50%); border-style: solid; border-width: .62em 0 .62em 1em; border-color: transparent transparent transparent var(--accent-fg); font-size: clamp(22px, 3.2vw, 32px); }
.a4a-demo:hover .a4a-demo-play { transform: scale(1.08); }
.a4a-demo-texte { font: 500 1.05rem/1.2 var(--titres); letter-spacing: -.01em; }
.a4a-demo-src { font: 500 12px/1 var(--police); letter-spacing: .12em; text-transform: uppercase; color: var(--texte-2); }
.a4a-demo-lecteur { padding: 0; display: block; border-radius: 26px; }
.a4a-demo-lecteur:hover { transform: none; border-radius: 26px; }
.a4a-demo-lecteur iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
.a4a-galerie { list-style: none; margin: 0; padding: 0; columns: 3 220px; column-gap: 14px; }
.a4a-galerie li { break-inside: avoid; margin: 0 0 14px; }
.a4a-galerie a { display: block; overflow: hidden; border-radius: 18px; background: var(--surface); line-height: 0; cursor: zoom-in; transition: border-radius 280ms var(--doux), transform 230ms var(--doux); }
.a4a-galerie img { display: block; width: 100%; height: auto; transition: transform 350ms var(--doux); }
@media (hover: hover) and (pointer: fine) {
  .a4a-galerie a:hover { border-radius: 30px; transform: translateY(-3px); }
  .a4a-galerie a:hover img { transform: scale(1.04); }
}
.a4a-vis-ouverte { overflow: hidden; }
.a4a-visionneuse { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(5, 5, 5, .94); color: var(--texte); z-index: 2000003; }
.a4a-visionneuse[open] { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; padding: 16px max(12px, env(safe-area-inset-right, 0px)) 16px max(12px, env(safe-area-inset-left, 0px)); animation: a4a-vis-entree 160ms var(--doux); }
@keyframes a4a-vis-entree { from { opacity: 0; } }
.a4a-visionneuse::backdrop { background: transparent; }
.a4a-vis-cadre { margin: 0; min-width: 0; min-height: 0; height: 100%; display: grid; grid-template-rows: 1fr auto; justify-items: center; gap: 10px; }
.a4a-vis-cadre img { max-width: 100%; max-height: 100%; min-height: 0; width: auto; height: auto; object-fit: contain; align-self: center; border-radius: 14px; }
.a4a-vis-compte { font: 500 12px/1 var(--police); letter-spacing: .12em; color: var(--texte-2); }
:where(.a4a-visionneuse) button { all: unset; box-sizing: border-box; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--ligne); background: var(--surface); color: var(--texte); font: 400 28px/1 var(--police); cursor: pointer; transition: background-color 120ms var(--doux), border-color 120ms var(--doux); }
.a4a-visionneuse button:hover { background: var(--encart); border-color: var(--texte-2); }
.a4a-visionneuse button:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.a4a-visionneuse button[hidden] { display: none; }
.a4a-visionneuse .a4a-vis-fermer { position: absolute; top: max(12px, env(safe-area-inset-top, 0px)); right: max(12px, env(safe-area-inset-right, 0px)); z-index: 1; }
@media (max-width: 640px) {
  .a4a-visionneuse[open] { grid-template-columns: 1fr; grid-template-rows: 1fr auto; }
  .a4a-visionneuse .a4a-vis-prec, .a4a-visionneuse .a4a-vis-suiv { position: absolute; bottom: max(16px, env(safe-area-inset-bottom, 0px)); z-index: 1; }
  .a4a-visionneuse .a4a-vis-prec { left: 16px; } .a4a-visionneuse .a4a-vis-suiv { right: 16px; }
  .a4a-galerie { columns: 2 140px; column-gap: 10px; } .a4a-galerie li { margin-bottom: 10px; } .a4a-galerie a { border-radius: 14px; }
  .a4a-demo { border-radius: 18px; }
}
/* le CV lu dans le PDF : texte remis en page */
.a4a-cv-doc { min-height: 120px; }
.a4a-cv-chargement { margin: 0; padding: 40px 0; text-align: center; color: var(--texte-2); }
.a4a-cv-contenu { max-width: 860px; margin-inline: auto; }
.a4a-cv-profil { margin-bottom: clamp(24px, 4vw, 44px); padding-bottom: clamp(20px, 3vw, 32px); border-bottom: 1px solid var(--ligne); }
.a4a-cv-profil p { margin: 0 0 4px; }
.a4a-cv-soustitre { font: italic 400 clamp(1.05rem, 1.7vw, 1.3rem)/1.4 var(--serif); color: var(--texte); }
.a4a-cv-mail a { color: var(--texte-2); font-size: .95rem; text-decoration: underline; text-decoration-color: var(--sauge); text-underline-offset: 4px; }
.a4a-cv-sec { margin-bottom: clamp(30px, 5vw, 60px); }
html body .a4a-cv-sectitre { margin: 0 0 6px; padding-bottom: 12px; border-bottom: 1px solid var(--ligne); font: 500 .8rem/1.2 var(--police) !important; letter-spacing: .14em; text-transform: uppercase; color: var(--sauge-fort); }
.a4a-cv-fiche { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr); gap: 0 clamp(18px, 4vw, 48px); padding: 18px 0; border-bottom: 1px solid var(--ligne); }
.a4a-cv-fiche:last-child { border-bottom: 0; }
html body .a4a-cv-fichetitre { grid-column: 1; grid-row: 1 / span 12; align-self: start; margin: 0; font: 500 1.05rem/1.3 var(--titres) !important; letter-spacing: -.01em; color: var(--texte); text-wrap: balance; }
.a4a-cv-fiche > p { grid-column: 2; margin: 0 0 5px; font-size: .95rem; line-height: 1.55; color: var(--texte-2); }
.a4a-cv-fiche > p:first-of-type { color: var(--texte); }
.a4a-cv-fichetitre:only-child { grid-column: 1 / -1; grid-row: auto; }
.a4a-cv-fiche > p:first-child, .a4a-cv-fiche > p:first-child ~ p { grid-column: 1 / -1; }
.a4a-cv-agent { margin: 28px 0 0; font-size: .82rem; color: var(--texte-2); }
.a4a-cv-brut { border: 1px solid var(--ligne); border-radius: 28px; overflow: hidden; background: var(--surface); }
@media (max-width: 640px) { .a4a-cv-fiche { grid-template-columns: 1fr; } .a4a-cv-fiche > p, .a4a-cv-fichetitre { grid-column: 1; grid-row: auto; } }
.a4a-cv-pdf { display: block; width: 100%; height: min(88vh, 1100px); min-height: 520px; border: 0; background: #fff; }
.a4a-cv-secours { margin: 0; padding: 28px; text-align: center; color: var(--texte-2); }
.a4a-cv-vide { text-align: center; padding-block: 60px; }
@media (max-width: 640px) {
  .a4a-cv { padding: 0 16px; }
  .a4a-cv-tete { align-items: flex-start; gap: 18px; }
  .a4a-cv-tete .a4a-cv-id { padding-top: 2px; }
  .a4a-cv-photo { width: 96px; }
  .a4a-cv-pdf { height: 72vh; min-height: 420px; }
}

/* ---------- 6. Rubriques ([a4a_rubriques]) : une liste typographique ---------- */
.a4a-rubriques {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(32px, 6vw, 96px);
  max-width: 1080px; margin: 0 auto clamp(48px, 9vw, 120px); padding: 0 24px;
}
.a4a-rubrique {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: clamp(18px, 2.4vw, 26px) 4px; border-top: 1px solid var(--ligne); color: var(--texte) !important; text-decoration: none !important;
}
.a4a-rubriques .a4a-rubrique:nth-last-child(-n + 2) { border-bottom: 1px solid var(--ligne); }
.a4a-rubrique-nom { font-size: clamp(1.45rem, 2.8vw, 2.15rem); font-weight: 500; letter-spacing: -.03em; line-height: 1.1; transition: transform 190ms var(--doux); }
.a4a-fleche { position: relative; display: grid; place-items: center; width: 46px; height: 46px; flex: none; color: var(--texte-2); transition: color 160ms var(--doux); }
.a4a-fleche::before {
  content: ''; position: absolute; inset: 0; background: var(--sauge-pale); border-radius: var(--forme-a);
  transform: scale(0); transition: transform 190ms var(--doux), border-radius 350ms var(--doux);
}
.a4a-fleche svg { position: relative; width: 18px; height: 18px; transition: transform 190ms var(--doux); }
.a4a-rubrique:is(:hover, :focus-visible) .a4a-rubrique-nom { transform: translateX(6px); }
.a4a-rubrique:is(:hover, :focus-visible) .a4a-fleche { color: var(--texte); }
.a4a-rubrique:is(:hover, :focus-visible) .a4a-fleche::before { transform: scale(1); border-radius: var(--forme-b); }
.a4a-rubrique:is(:hover, :focus-visible) .a4a-fleche svg { transform: translateX(2px) rotate(-45deg); }
@media (max-width: 720px) {
  .a4a-rubriques { grid-template-columns: 1fr; }
  .a4a-rubriques .a4a-rubrique:nth-last-child(2) { border-bottom: 0; }
}

/* Contact ([a4a_contact]) */
.a4a-contact { position: relative; max-width: 760px; margin: 0 auto clamp(56px, 10vw, 128px); padding: clamp(40px, 6vw, 72px) 28px; text-align: center; }
.a4a-contact-titre { margin: 0 0 26px; font-size: clamp(1.5rem, 3.2vw, 2.3rem); font-weight: 500; letter-spacing: -.03em; line-height: 1.15; text-wrap: balance; }
.a4a-contact-liens { margin: 0; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }

/* ---------- 7. Boutons ---------- */
.a4a-bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 24px; border-radius: 999px;
  border: 1px solid var(--ligne); background: transparent; color: var(--texte) !important; text-decoration: none !important;
  font-weight: 500; font-size: .95rem; line-height: 1.2; transition: background-color 120ms var(--doux), border-color 120ms var(--doux), color 120ms var(--doux);
}
.a4a-bouton:hover { border-color: var(--texte); }
html body .a4a-bouton.a4a-bouton-plein, html body .post-content .fusion-button, html body .fusion-form .fusion-button {
  background: var(--accent-bg) !important; color: var(--accent-fg) !important; border: 1px solid transparent !important; border-radius: 999px !important;
  box-shadow: none !important; font-weight: 500; letter-spacing: .01em; transition: background-color 120ms var(--doux), color 120ms var(--doux);
}
html body .a4a-bouton.a4a-bouton-plein:hover, html body .post-content .fusion-button:hover, html body .fusion-form .fusion-button:hover { background: var(--sauge) !important; color: #141512 !important; }
html body .fusion-button :is(.fusion-button-text, i) { color: inherit !important; }

/* ---------- 8. Formulaire ---------- */
html body .fusion-form .fusion-form-field :is(input:not([type='checkbox']):not([type='radio']), textarea, select) {
  background: var(--surface) !important; color: var(--texte) !important; border: 1px solid var(--ligne) !important; border-radius: 18px !important;
  padding: 15px 18px !important; box-shadow: none !important; transition: border-color 120ms var(--doux), box-shadow 120ms var(--doux);
}
html body .fusion-form .fusion-form-field :is(input, textarea, select):focus { border-color: var(--sauge) !important; box-shadow: 0 0 0 4px var(--sauge-pale) !important; outline: none; }
html body .fusion-form :is(label, .fusion-form-label-wrapper) { color: var(--texte-2); font-weight: 500; font-size: .9rem; }
html body .fusion-form ::placeholder { color: var(--texte-2); opacity: .85; }

/* ---------- 9. Pied de page ---------- */
html body .fusion-tb-footer :is(.fusion-fullwidth, .fusion-footer-widget-area) { background: transparent !important; }
html body .fusion-tb-footer .fusion-fullwidth { border-top: 1px solid var(--ligne); }
html body .fusion-tb-footer :is(p, span, a, div) { color: var(--texte-2); font-size: 14px; }
html body .fusion-tb-footer a:hover { color: var(--texte); }
html body .fusion-tb-footer .fusion-text a { text-decoration: underline; text-decoration-color: var(--ligne); text-underline-offset: 4px; }
/* Téléphone et e-mail : de simples liens, pas des boutons */
html body .fusion-tb-footer .fusion-button {
  background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 6px 4px !important; color: var(--texte-2) !important;
}
html body .fusion-tb-footer .fusion-button :is(span, i) { color: inherit !important; font-size: 14px; }
html body .fusion-tb-footer .fusion-button:hover { color: var(--texte) !important; }
html body .fusion-social-networks .fusion-social-network-icon {
  background: transparent !important; border: 1px solid var(--ligne) !important; border-radius: 50% !important; color: var(--texte-2) !important;
  transition: color 120ms var(--doux), border-color 120ms var(--doux);
}
html body .fusion-social-networks .fusion-social-network-icon:hover { color: var(--texte) !important; border-color: var(--texte) !important; }
html body .to-top-container #toTop { background: var(--surface) !important; border: 1px solid var(--ligne); border-radius: 50% !important; box-shadow: none; }
html body .to-top-container #toTop::before { color: var(--texte) !important; }

/* ---------- 11. Entrée en scène : les éléments montent doucement ---------- */
.a4a-pret .a4a-entree { opacity: 0; transform: translateY(22px); }
.a4a-pret .a4a-entree.a4a-vu { opacity: 1; transform: none; transition: opacity 350ms var(--doux), transform 350ms var(--doux); transition-delay: var(--a4a-delai, 50ms); }

/* ---------- 12. Accessibilité ---------- */
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.skip-link:focus { background: var(--accent-bg); color: var(--accent-fg); border-radius: 999px; padding: 12px 20px; z-index: 2000001; }
@media (prefers-contrast: more) {
  :root { --ligne: var(--texte); --texte-2: var(--texte); }
}
:root[data-effets='reduits'] .a4a-entree { opacity: 1 !important; transform: none !important; }
:root[data-effets='reduits'] *, :root[data-effets='reduits'] *::before, :root[data-effets='reduits'] *::after { transition-duration: 50ms !important; }
@media (prefers-reduced-motion: reduce) {
  .a4a-entree { opacity: 1 !important; transform: none !important; }
  *, *::before, *::after { transition-duration: 50ms !important; }
}

/* ---------- 13. Téléphone ---------- */
@media (max-width: 640px) {
  body.fusion-body { font-size: 16px; }
  html body .post-content .fusion-layout-column:has(.awb-image-frame) { margin-bottom: 28px !important; }
  /* deux portraits (ou deux couvertures) par ligne au lieu d'un : la liste des auteurs passe de ~45 à ~12 écrans */
  html body .post-content .fusion-layout-column:has(.awb-image-frame) {
    --awb-width-small: 50% !important; --awb-spacing-left-small: 8px !important; --awb-spacing-right-small: 8px !important;
    width: 50% !important; max-width: 50% !important; flex: 0 0 50% !important; padding-left: 8px !important; padding-right: 8px !important;
    margin-left: 0 !important; margin-right: 0 !important; margin-bottom: 22px !important;
  }
  html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-title { margin-top: 12px !important; }
  html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-title h5 { font-size: .95rem; overflow-wrap: anywhere; }
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) :is(.awb-image-frame, .fusion-imageframe) { border-radius: 999px 999px 18px 18px; }
}

/* ---------- 14. Passage d'une page à l'autre (Chrome, Edge, Safari récent) ---------- */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: 130ms; }
  /* page choisie dans le menu plein écran : le panneau (resté ouvert pendant le chargement) se replie en cercle vers le bouton « Menu »
     et révèle la nouvelle page dessous, comme à la fermeture du menu. L'origine du cercle (--ox, --oy) vient de la page précédente. */
  html[data-vt='menu']::view-transition-group(root) { animation-duration: 350ms; }
  html[data-vt='menu']::view-transition-old(root) { animation: a4a-vt-ferme 330ms var(--doux) both; mix-blend-mode: normal; z-index: 2; }
  html[data-vt='menu']::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
  @keyframes a4a-vt-ferme {
    from { clip-path: circle(160vmax at var(--ox, 90%) var(--oy, 6%)); }
    to { clip-path: circle(0 at var(--ox, 90%) var(--oy, 6%)); }
  }
}

/* ---------- 15. Relief, reflets et ondes (relief.js) ---------- */
@property --a4a-r { syntax: '<length>'; inherits: false; initial-value: 0px; }
@keyframes a4a-onde { from { --a4a-r: 0px; opacity: .95; } to { --a4a-r: 460px; opacity: 0; } }
/* Les blocs s'inclinent vers le pointeur (ou sous le doigt pendant l'appui) */
html body :is(.post-content .a4a-carte, .a4a-rubrique, .post-content .a4a-encart) {
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transform-style: preserve-3d;
  transition: transform 70ms var(--doux);
}
@media (hover: none) { html body :is(.post-content .a4a-carte, .a4a-rubrique, .post-content .a4a-encart):active { transform: perspective(900px) scale(.985) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); } }
/* Profondeur : le nom glisse à contresens de l'inclinaison */
.a4a-carte .fusion-title, .a4a-rubrique .a4a-rubrique-nom {
  translate: calc(var(--tx, 0px) * -1.6 + var(--gtx, 0px)) calc(var(--ty, 0px) * -1.6 + var(--gty, 0px)); transition: translate 70ms var(--doux), transform 190ms var(--doux);
}
/* Reflet qui suit le pointeur, ou l'inclinaison du téléphone */
html body .post-content .a4a-carte .awb-image-frame { position: relative; }
.a4a-carte .awb-image-frame::after, .a4a-rubrique::after, .a4a-encart::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 2; opacity: 0; transition: opacity 120ms var(--doux);
  background: radial-gradient(300px circle at var(--mx, calc(50% + var(--gx, 0) * 38%)) var(--my, calc(12% + var(--gy, 0) * 38%)), rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 62%);
  mix-blend-mode: soft-light;
}
.a4a-rubrique::after { background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), var(--sauge-pale), transparent 70%); mix-blend-mode: normal; z-index: -1; }
.a4a-rubrique { isolation: isolate; }
.a4a-rubrique::after { inset: 4px -14px; border-radius: 22px; }
.a4a-encart { position: relative; }
@media (hover: hover) and (pointer: fine) {
  :is(.a4a-carte:hover .awb-image-frame, .a4a-rubrique:hover, .a4a-encart:hover)::after { opacity: 1; }
}
:root[data-gyro='on'] :is(.a4a-carte .awb-image-frame, .a4a-encart)::after { opacity: .7; }
:root:is([data-theme='sombre'], [data-fond='noir']) :is(.a4a-carte .awb-image-frame, .a4a-encart)::after { background: radial-gradient(300px circle at var(--mx, 50%) var(--my, 12%), rgba(255, 255, 255, .2), rgba(255, 255, 255, 0) 62%); mix-blend-mode: normal; }
/* Onde lumineuse à l'appui */
:is(.a4a-carte[data-onde] .awb-image-frame, .a4a-rubrique[data-onde], .a4a-encart[data-onde])::after {
  opacity: 1; animation: a4a-onde 280ms var(--doux) both; mix-blend-mode: soft-light;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, 0) calc(var(--a4a-r) - 38px), rgba(255, 255, 255, .85) var(--a4a-r), rgba(255, 255, 255, 0) calc(var(--a4a-r) + 14px));
}
.a4a-rubrique[data-onde]::after { mix-blend-mode: normal; background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), transparent calc(var(--a4a-r) - 38px), var(--sauge-pale) var(--a4a-r), transparent calc(var(--a4a-r) + 14px)); }

/* ---------- 16. Boutons liquides (boutons.js) : reflet, vague, forme élastique ---------- */
@property --a4a-v { syntax: '<length>'; inherits: false; initial-value: 0px; }
@keyframes a4a-vague { from { --a4a-v: 0px; opacity: 1; } to { --a4a-v: 190px; opacity: 0; } }
.a4a-bouton, html body .fusion-button { position: relative; overflow: hidden; }
.a4a-bouton::before, html body .fusion-button::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity 100ms var(--doux);
  background: radial-gradient(130px circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .45), rgba(255, 255, 255, 0) 62%);
}
@media (hover: hover) and (pointer: fine) {
  :is(.a4a-bouton, .fusion-button):hover::before { opacity: 1; }
  :is(.a4a-bouton, .post-content .fusion-button, .fusion-form .fusion-button):hover { transform: scale(1.035); }
}
:is(.a4a-bouton, .post-content .fusion-button, .fusion-form .fusion-button):active { transform: scale(1.05, .9); }
:is(.a4a-bouton, .fusion-button) { transition-property: transform, background-color, border-color, color, border-radius !important; transition-duration: 120ms; transition-timing-function: cubic-bezier(.34, 1.4, .5, 1); }
.a4a-vague::before { opacity: 1 !important; animation: a4a-vague 260ms cubic-bezier(.2, .7, .3, 1) both;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, 0) calc(var(--a4a-v) * .55), rgba(255, 255, 255, .6) calc(var(--a4a-v) * .8), rgba(255, 255, 255, 0) var(--a4a-v)) !important; }
.a4a-bouton:not(.a4a-bouton-plein).a4a-vague::before { background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), transparent calc(var(--a4a-v) * .55), var(--sauge-pale) calc(var(--a4a-v) * .8), transparent var(--a4a-v)) !important; }

/* ---------- 17. Réfraction (refraction.js) : les bords des voiles déforment le fond (Chrome, Edge) ---------- */
:root { --voile: blur(14px) saturate(140%); }
:root[data-refraction='oui'] { --voile: url(#a4a-refraction) blur(8px) saturate(150%) brightness(1.04); }
:root[data-defile] body .fusion-tb-header .fusion-fullwidth, .a4a-bouton:not(.a4a-bouton-plein), .a4a-menubtn { -webkit-backdrop-filter: var(--voile) !important; backdrop-filter: var(--voile) !important; }
/* Un voile dans un voile n'a pas de second filtre */

/* Animations coupées : tout se fige */
:root[data-effets='reduits'] body :is(.a4a-carte, .a4a-rubrique, .a4a-encart, .a4a-bouton, .fusion-button) { transform: none !important; }
:root[data-effets='reduits'] :is(.a4a-carte .fusion-title, .a4a-rubrique-nom) { translate: none !important; }
:root[data-effets='reduits'] :is(.a4a-carte .awb-image-frame, .a4a-rubrique, .a4a-encart)::after,
:root[data-effets='reduits'] :is(.a4a-bouton, .fusion-button)::before { display: none; }
@media (prefers-reduced-motion: reduce) {
  :is(.a4a-carte, .a4a-rubrique, .a4a-encart, .a4a-bouton, .fusion-button) { transform: none !important; }
  .a4a-vague::before, [data-onde]::after, [data-onde] .awb-image-frame::after { animation: none !important; }
}


/* ---------- 19. Morphing ---------- */
/* Morphing portrait → CV : la photo de la page CV porte le nom que reçoit le portrait cliqué */
.a4a-cv-photo { view-transition-name: portrait; }
@media (prefers-reduced-motion: no-preference) {
  ::view-transition-group(portrait) { animation-duration: 240ms; animation-timing-function: cubic-bezier(.22, 1.15, .36, 1); border-radius: 999px 999px 26px 26px; overflow: clip; }
  ::view-transition-old(portrait), ::view-transition-new(portrait) { height: 100%; object-fit: cover; mix-blend-mode: normal; animation-duration: 240ms; }
}

/* ---------- 18. Impression ---------- */

/* ---------- 16b. Recherche d'un talent ----------
   Posée par verre-dencre.js (installerRecherche) sous le titre de chaque liste. Une pastille « Rechercher » qui s'élargit en champ de saisie. */
html body .post-content .a4a-recherche { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 1248px; margin: 0 auto; padding: clamp(6px, 1.5vw, 18px) 30px 0; }
.a4a-rech-pilule {
  position: relative; display: flex; align-items: center; width: 176px; max-width: 100%; height: 48px; border: 1px solid var(--ligne); border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 70%, transparent); color: var(--texte);
  transition: width 250ms var(--doux), border-color 120ms var(--doux), box-shadow 120ms var(--doux), background-color 120ms var(--doux);
}
.a4a-recherche:not([data-ouvert]) .a4a-rech-pilule:hover { border-color: var(--texte-2); background: var(--surface); }
.a4a-recherche[data-ouvert] .a4a-rech-pilule { width: min(460px, 100%); border-color: var(--texte-2); }
.a4a-rech-pilule:focus-within { border-color: var(--focus); box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 30%, transparent); }
html body .a4a-rech-pilule button { all: unset; box-sizing: border-box; display: flex; align-items: center; cursor: pointer; color: var(--texte); border-radius: 999px; }
html body .a4a-rech-pilule .a4a-rech-bouton { flex: none; gap: 10px; height: 100%; padding: 0 20px; font: 500 .95rem/1 var(--police); white-space: nowrap; justify-content: center; }
.a4a-recherche:not([data-ouvert]) .a4a-rech-bouton { width: 100%; }
.a4a-recherche[data-ouvert] .a4a-rech-bouton { padding: 0 6px 0 18px; cursor: default; pointer-events: none; }
.a4a-recherche[data-ouvert] .a4a-rech-bouton span { display: none; }
html body .a4a-rech-pilule .a4a-rech-bouton:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
html body .a4a-rech-pilule .a4a-rech-champ {
  flex: 1; min-width: 0; width: auto; height: 100%; margin: 0; padding: 0 4px !important; border: 0 !important; border-radius: 0 !important; outline: 0; box-shadow: none !important;
  background: transparent !important; color: var(--texte) !important; font: 400 1rem/1 var(--police) !important; -webkit-appearance: none; appearance: none;
  opacity: 0; pointer-events: none; transition: opacity 120ms var(--doux) 70ms;
}
.a4a-recherche[data-ouvert] .a4a-rech-champ { opacity: 1; pointer-events: auto; }
.a4a-rech-champ::placeholder { color: var(--texte-2); opacity: 1; }
.a4a-rech-champ::-webkit-search-cancel-button, .a4a-rech-champ::-webkit-search-decoration { -webkit-appearance: none; display: none; }
html body .a4a-rech-pilule .a4a-rech-effacer { flex: none; justify-content: center; width: 34px; height: 34px; margin-right: 7px; color: var(--texte-2); transition: background-color 120ms var(--doux), color 120ms var(--doux); }
html body .a4a-rech-pilule .a4a-rech-effacer:hover { background: var(--surface); color: var(--texte); }
html body .a4a-rech-pilule .a4a-rech-effacer:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.a4a-rech-effacer[hidden] { display: none !important; }
html body .post-content .a4a-rech-etat { margin: 0; min-height: 1.3em; font-size: .9rem; line-height: 1.3; text-align: center; color: var(--texte-2); }
html body .post-content .a4a-rech-vide .a4a-rech-etat { color: var(--texte); }
.a4a-filtre-cache { display: none !important; }
@media (max-width: 640px) { html body .post-content .a4a-recherche { padding-inline: 16px; } }

/* ---------- 17. Curseur (inspiré de bien-fonde.com) ----------
   Un point exact, deux anneaux qui suivent avec retard et respirent. Blanc avec un fin liseré sombre : lisible sur le noir de la page
   comme sur une photo claire ou grise (le mode de fusion « différence » rendait les photos grises illisibles). Le JavaScript (installerCurseur) pose data-curseur sur <html> à la première vraie souris :
   avant, et sur écran tactile, le pointeur d'origine reste en place. */
.a4a-curseur { position: fixed; left: 0; top: 0; width: 0; height: 0; z-index: 2000010; pointer-events: none; opacity: 0; transition: opacity 120ms var(--doux); contain: layout style; }
.a4a-curseur.est-visible { opacity: 1; }
/* invisible (avant le premier mouvement, souris sortie de la fenêtre, champ de saisie) : ses animations en boucle s'arrêtent */
.a4a-curseur:not(.est-visible) *, .a4a-curseur.est-cache * { animation-play-state: paused !important; }
.a4a-curseur.est-cache { opacity: 0 !important; }
.a4a-cp, .a4a-ca { position: absolute; left: 0; top: 0; width: 0; height: 0; will-change: transform; }
.a4a-cp-pt, .a4a-ca-int, .a4a-ca-ext { position: absolute; left: 0; top: 0; border-radius: 50%; transform: translate(-50%, -50%); }
.a4a-cp-pt { width: 6px; height: 6px; background: #fff; box-shadow: 0 0 0 1px rgba(5, 5, 5, .45); animation: a4a-curseur-pouls 2.6s ease-in-out infinite; transition: opacity 250ms var(--doux); }
.a4a-ca-int { width: 32px; height: 32px; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(5, 5, 5, .35), inset 0 0 0 1px rgba(5, 5, 5, .2); opacity: .85; transition: width 170ms var(--doux), height 170ms var(--doux), background-color 170ms var(--doux), opacity 100ms var(--doux), transform 100ms var(--doux); }
.a4a-ca-ext { width: 46px; height: 46px; border: 1px solid #fff; box-shadow: 0 0 0 1px rgba(5, 5, 5, .25); opacity: .45; animation: a4a-curseur-onde 3s ease-in-out .4s infinite; transition: width 450ms var(--doux), height 450ms var(--doux), opacity 250ms var(--doux); }
.a4a-ca-txt { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); white-space: nowrap; font: 500 11px/1 var(--police); letter-spacing: .14em; text-transform: uppercase; color: #fff; text-shadow: 0 0 8px rgba(5, 5, 5, .8); opacity: 0; transition: opacity 120ms var(--doux); }
@keyframes a4a-curseur-pouls {
  0%, 100% { opacity: .75; transform: translate(-50%, -50%) scale(.95); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.35); }
}
@keyframes a4a-curseur-onde {
  0%, 100% { opacity: .5; transform: translate(-50%, -50%) scale(.9); }
  50% { opacity: .2; transform: translate(-50%, -50%) scale(1.1); }
}
/* sur un lien : l'anneau s'élargit, l'onde s'efface */
.a4a-curseur.est-lien .a4a-ca-int { width: 58px; height: 58px; background-color: rgba(255, 255, 255, .12); }
.a4a-curseur.est-lien .a4a-ca-ext { opacity: 0; animation: none; }
/* sur un portrait, la galerie, la bande démo : grand anneau et un mot */
.a4a-curseur.est-carte .a4a-ca-int { width: 96px; height: 96px; background-color: rgba(5, 5, 5, .5); }
.a4a-curseur.est-carte .a4a-ca-ext { width: 124px; height: 124px; opacity: .3; }
.a4a-curseur.est-carte .a4a-ca-txt { opacity: 1; }
.a4a-curseur.est-carte .a4a-cp-pt { animation: none; opacity: 0; }
/* sur un bouton : le curseur se colle au centre et s'efface, le bouton émet l'onde (voir .a4a-echo) */
.a4a-curseur.est-colle .a4a-cp-pt, .a4a-curseur.est-colle .a4a-ca-int, .a4a-curseur.est-colle .a4a-ca-ext { animation: none; opacity: 0; transform: translate(-50%, -50%) scale(0); transition: transform 100ms var(--doux), opacity 100ms var(--doux); }
/* appui : l'anneau se resserre */
.a4a-curseur.est-appui .a4a-ca-int { transform: translate(-50%, -50%) scale(.82); }
@keyframes a4a-echo {
  from { outline: 1px solid rgba(236, 232, 223, .55); outline-offset: 0; }
  to { outline: 1px solid rgba(236, 232, 223, 0); outline-offset: 16px; }
}
html[data-curseur] .a4a-echo { animation: a4a-echo 0.59s ease-out infinite; }
/* le pointeur d'origine disparaît ; il reste dans les champs de saisie, les listes et la visionneuse (fenêtre au-dessus de tout) */
html[data-curseur], html[data-curseur] *, html[data-curseur] *::before, html[data-curseur] *::after { cursor: none !important; }
html[data-curseur] :is(input, textarea, [contenteditable='true']) { cursor: text !important; }
html[data-curseur] select { cursor: pointer !important; }
html[data-curseur].a4a-vis-ouverte, html[data-curseur].a4a-vis-ouverte * { cursor: auto !important; }
html.a4a-vis-ouverte .a4a-curseur { display: none; }
@media (hover: none), (pointer: coarse) { .a4a-curseur { display: none; } }

/* ---------- 18. Listes fabriquées d'après le portail (includes/pilotage.php) ----------
   Le balisage reprend les classes d'Avada (le style des cartes, l'ordre aléatoire, la recherche, le curseur et le lien vers la page CV
   s'appliquent d'eux-mêmes) ; seule la mise en colonnes est refaite ici, sans dépendre des réglages de colonnes d'Avada. */
html body .post-content .a4a-grille {
  display: grid !important; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); column-gap: clamp(20px, 3.4vw, 52px);
  max-width: 1248px; margin: 0 auto !important; padding: 0 clamp(16px, 4vw, 40px); box-sizing: border-box;
}
html body .post-content .a4a-grille > .fusion-layout-column:is(.a4a-talent, .a4a-livre, .a4a-livre-auteur) {
  width: auto !important; max-width: none !important; flex: none !important; min-width: 0; margin-left: 0 !important; margin-right: 0 !important;
  padding-left: 0 !important; padding-right: 0 !important;
}
/* Avada pose un pseudo-élément « clearfix » sur chaque rangée : dans une grille il prendrait la première case */
html body .post-content .a4a-grille::before, html body .post-content .a4a-grille::after { content: none !important; display: none !important; }
html body .post-content .a4a-grille-livres { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
html body .post-content .a4a-grille > .a4a-livre-auteur { grid-column: 1 / -1; margin: 18px 0 14px !important; }
html body .post-content .a4a-grille > .a4a-livre-auteur .fusion-title { margin: 0 !important; text-align: left; }
html body .post-content .a4a-grille > .a4a-livre-auteur h5 { font-size: clamp(1.1rem, 2vw, 1.4rem); font-weight: 500; letter-spacing: -.01em; }
@media (max-width: 640px) {
  html body .post-content .a4a-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 14px; padding: 0 16px; }
  html body .post-content .a4a-grille-livres { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
html body .post-content .a4a-grille .fusion-image-element img { width: 100%; height: auto; display: block; }

/* textes et actualités tenus dans le portail */
.a4a-texte { max-width: 62ch; margin: 0 auto; }
.a4a-texte p { margin: 0 0 1em; line-height: 1.65; color: var(--texte-2); }
.a4a-actus { max-width: 760px; margin: 0 auto clamp(48px, 8vw, 96px); padding: 0 28px; }
.a4a-actus-titre { margin: 0 0 24px; font-size: clamp(1.4rem, 2.6vw, 1.9rem); font-weight: 500; letter-spacing: -.02em; }
.a4a-actu { padding: 22px 0; border-top: 1px solid var(--ligne); }
.a4a-actu-date { display: block; margin-bottom: 6px; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--texte-2); }
.a4a-actu-titre { margin: 0 0 10px; font-size: 1.15rem; font-weight: 500; letter-spacing: -.01em; }
.a4a-actu p { margin: 0 0 .8em; line-height: 1.6; color: var(--texte-2); }
.a4a-actu-lien { color: var(--texte); text-decoration: underline; text-decoration-color: var(--ligne); text-underline-offset: 3px; }
.a4a-actu-lien:hover { text-decoration-color: var(--sauge); }

/* ---------- 19. Langues parlées, expertise, annonces, livres sans couverture ---------- */
.a4a-langues { display: inline-flex; align-items: center; gap: 4px; margin-left: .55em; vertical-align: .12em; white-space: nowrap; }
.a4a-drapeau { display: inline-block; width: 18px; height: 12px; border-radius: 2px; overflow: hidden; box-shadow: 0 0 0 1px rgba(255, 255, 255, .22); flex: none; line-height: 0; }
.a4a-drapeau svg { display: block; width: 100%; height: 100%; }
.a4a-drapeau-code { width: auto; min-width: 20px; padding: 0 3px; height: 14px; display: inline-flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, .1); box-shadow: 0 0 0 1px var(--ligne); }
.a4a-drapeau-code b { font: 600 8px/1 var(--corps, system-ui); letter-spacing: .05em; color: var(--texte-2); }
.a4a-drapeau-code b::before { content: attr(data-code); }
.a4a-cv-nom .a4a-langues { margin-left: .4em; vertical-align: .35em; }
.a4a-cv-nom .a4a-drapeau { width: 26px; height: 17px; border-radius: 3px; }
html body .post-content .a4a-expertise { margin: -2px 0 0; text-align: center; font-size: .82rem; line-height: 1.35; color: var(--texte-2); text-wrap: balance; }
.a4a-cv-expertise { margin: -12px 0 22px; font-size: 1.02rem; line-height: 1.4; color: var(--texte-2); max-width: 40ch; }

.a4a-annonces { max-width: 1248px; margin: 0 auto clamp(20px, 3vw, 36px); padding: 0 clamp(16px, 4vw, 40px); display: grid; gap: 14px; box-sizing: border-box; }
.a4a-annonce { display: flex; gap: clamp(16px, 3vw, 28px); align-items: center; padding: clamp(18px, 3vw, 28px); border: 1px solid var(--ligne); border-radius: 28px; background: color-mix(in srgb, var(--sauge) 9%, transparent); }
.a4a-annonce-image { width: clamp(84px, 14vw, 150px); aspect-ratio: 2 / 3; object-fit: cover; border-radius: 14px; flex: none; box-shadow: 0 16px 30px -18px rgba(0, 0, 0, .7); }
.a4a-annonce-corps { min-width: 0; }
.a4a-annonce-etiq { margin: 0 0 6px; font-size: .74rem; letter-spacing: .09em; text-transform: uppercase; color: var(--texte-2); }
.a4a-annonce-titre { margin: 0 0 8px; font-size: clamp(1.15rem, 2.2vw, 1.5rem); font-weight: 500; letter-spacing: -.02em; line-height: 1.2; }
.a4a-annonce-texte { margin: 0 0 14px; line-height: 1.55; color: var(--texte-2); max-width: 60ch; }
.a4a-annonce-action { margin: 0; }
@media (max-width: 640px) { .a4a-annonce { flex-direction: column; align-items: flex-start; } .a4a-annonce-image { width: 96px; } }

html body .post-content .a4a-livre-texte .a4a-couv-texte {
  display: flex; flex-direction: column; justify-content: space-between; aspect-ratio: 2 / 3; padding: 16px 14px; box-sizing: border-box; text-align: left;
  background: linear-gradient(160deg, #1b211a, #0d100c); border-radius: 6px; box-shadow: inset 0 0 0 1px var(--ligne);
}
.a4a-couv-texte b { font: 500 clamp(1.05rem, 1.6vw, 1.3rem)/1.15 var(--titres); letter-spacing: -.02em; color: var(--texte); text-wrap: balance; }
.a4a-couv-texte i { font: normal 500 .72rem/1.2 var(--corps, system-ui); letter-spacing: .1em; text-transform: uppercase; color: var(--texte-2); }

/* Filtre par langue parlée : rangée de pastilles à drapeau sous la barre de recherche (posée par le plugin quand des langues sont renseignées) */
.a4a-rech-langues { display: none; }
html[data-a4a-tot] .a4a-recherche .a4a-rech-langues { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; max-width: 640px; }
html body .a4a-rech-langues::before { content: 'Langues parlées'; flex: 0 0 100%; text-align: center; font-size: .74rem; letter-spacing: .09em; text-transform: uppercase; color: var(--texte-2); margin-bottom: 2px; }
html body .a4a-rech-langue { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 8px; padding: 6px 13px 6px 10px; border-radius: 999px; border: 1px solid var(--ligne); font: 500 .86rem/1 var(--police); color: var(--texte-2); cursor: pointer; transition: background-color 100ms var(--doux), color 100ms var(--doux), border-color 100ms var(--doux); }
html body .a4a-rech-langue:hover { border-color: var(--texte-2); color: var(--texte); }
html body .a4a-rech-langue[aria-pressed='true'] { background: var(--texte); color: var(--fond); border-color: var(--texte); }
html body .a4a-rech-langue:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.a4a-rech-langue .a4a-drapeau { margin: 0; }

/* le cadre de focus du navigateur n'apparaît que pour la navigation au clavier, jamais après un clic ou un retour arrière */
.a4a-menu-lien:focus:not(:focus-visible), .a4a-menu a:focus:not(:focus-visible) { outline: none; }
/* Menu plein écran : le lien qui reçoit le focus à l'ouverture (la page où l'on est) n'a plus de cadre. Pour le clavier, le repère reste
   le point vert, le décalage et la couleur du lien (voir plus haut) : plus lisibles qu'un cadre autour d'un si grand texte. */
html body .a4a-menu a.a4a-menu-lien:focus, html body .a4a-menu a.a4a-menu-lien:focus-visible { outline: none !important; box-shadow: none; }

/* Logo 4 (en-tête et menu) : pas de cadre qui grossit autour (l'en-tête le coupait en une ligne). À la place, une vague verte traverse
   les quatre pièces l'une après l'autre pendant que le curseur est collé au logo ; elle reste dans le dessin du 4. */
@keyframes a4a-piece-vague {
  0%, 62%, 100% { transform: none; fill: currentColor; }
  26% { transform: scale(1.1); fill: var(--sauge); }
}
html[data-curseur] :is(.a4a-logo, .a4a-menu-logo a).a4a-echo { animation: none; outline: none; }
html[data-curseur] .a4a-logo.a4a-echo polygon, html[data-curseur] .a4a-menu-logo a.a4a-echo .a4a-logo polygon {
  transform-box: fill-box; transform-origin: center;
  animation: a4a-piece-vague 0.66s var(--doux) infinite; animation-delay: calc(var(--k, 0) * 60ms);
}

/* ---------- 20. Organique : champ de dégradés qui dérive, grain, matières ----------
   Trois nappes floues (sauge, argile, sauge) flottent derrière la page, un grain fin la recouvre. Les nappes sont des images SVG déjà floutées :
   seule leur position est animée (transform), jamais leur forme ni un filtre, donc aucun recalcul de peinture. Le script (installerOrganique)
   pose les deux calques ; sans lui, la page reste noire et nette. Coupé par « Animations coupées », le mouvement réduit et A4A.organique = false. */
:root { --aurore-sauge: .5; --aurore-argile: .42; --grain-opacite: .07; }
.a4a-organique { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity 1400ms var(--doux); contain: strict; }
:root[data-organique] .a4a-organique { opacity: 1; }
.a4a-blob { position: absolute; width: 74vmax; height: 74vmax; background: center / contain no-repeat; opacity: var(--o); will-change: transform, opacity; animation: a4a-derive var(--d, 44s) ease-in-out infinite alternate, a4a-respire calc(var(--d, 44s) * .43) ease-in-out infinite alternate; }
.a4a-blob:nth-child(1) { --d: 41s; left: -26vmax; top: -30vmax; --o: var(--aurore-sauge); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cdefs%3E%3CradialGradient id='g' cx='0.5' cy='0.45' r='.62'%3E%3Cstop offset='0' stop-color='rgb(169,183,155)' stop-opacity='0.95'/%3E%3Cstop offset='.58' stop-color='rgb(169,183,155)' stop-opacity='0.38'/%3E%3Cstop offset='1' stop-color='rgb(169,183,155)' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cfilter id='f' x='-25%' y='-25%' width='150%' height='150%'%3E%3CfeGaussianBlur stdDeviation='26'/%3E%3C/filter%3E%3C/defs%3E%3Cpath filter='url(%23f)' fill='url(%23g)' d='M300,60 C420,40 560,130 560,270 C560,420 440,560 290,550 C150,540 40,430 50,290 C60,160 170,70 300,60 Z'/%3E%3C/svg%3E"); }
.a4a-blob:nth-child(2) { --d: 53s; right: -34vmax; top: 6vh; width: 84vmax; height: 78vmax; --o: var(--aurore-argile); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cdefs%3E%3CradialGradient id='g' cx='0.5' cy='0.45' r='.62'%3E%3Cstop offset='0' stop-color='rgb(211,163,135)' stop-opacity='0.9'/%3E%3Cstop offset='.58' stop-color='rgb(211,163,135)' stop-opacity='0.32'/%3E%3Cstop offset='1' stop-color='rgb(211,163,135)' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cfilter id='f' x='-25%' y='-25%' width='150%' height='150%'%3E%3CfeGaussianBlur stdDeviation='26'/%3E%3C/filter%3E%3C/defs%3E%3Cpath filter='url(%23f)' fill='url(%23g)' d='M330,50 C470,70 570,190 540,330 C510,470 380,570 240,540 C110,510 30,390 70,250 C110,110 220,30 330,50 Z'/%3E%3C/svg%3E"); animation-direction: alternate-reverse, alternate; }
.a4a-blob:nth-child(3) { --d: 61s; left: 8vw; bottom: -52vmax; width: 80vmax; height: 80vmax; --o: calc(var(--aurore-sauge) * .8); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cdefs%3E%3CradialGradient id='g' cx='0.5' cy='0.45' r='.62'%3E%3Cstop offset='0' stop-color='rgb(169,183,155)' stop-opacity='0.8'/%3E%3Cstop offset='.58' stop-color='rgb(169,183,155)' stop-opacity='0.3'/%3E%3Cstop offset='1' stop-color='rgb(169,183,155)' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cfilter id='f' x='-25%' y='-25%' width='150%' height='150%'%3E%3CfeGaussianBlur stdDeviation='26'/%3E%3C/filter%3E%3C/defs%3E%3Cpath filter='url(%23f)' fill='url(%23g)' d='M260,70 C400,30 540,110 565,260 C590,410 470,555 320,560 C170,565 45,470 45,320 C45,180 130,100 260,70 Z'/%3E%3C/svg%3E"); }
@keyframes a4a-derive { from { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); } to { transform: translate3d(9vmax, 6vmax, 0) rotate(32deg) scale(1.14); } }
@keyframes a4a-respire { from { opacity: var(--o); } to { opacity: calc(var(--o) * .6); } }
/* grain : bruit fin sur toute la page, par-dessus le contenu (très léger) ; il tressaute par pas, comme une pellicule */
.a4a-grain { position: fixed; inset: -180px; z-index: 1999999; pointer-events: none; opacity: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n' x='0' y='0' width='100%' height='100%'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .93  0 0 0 0 .91  0 0 0 0 .87  1.6 0 0 0 -.62'/%3E%3C/filter%3E%3Crect width='100%' height='100%' filter='url(%23n)'/%3E%3C/svg%3E"); background-size: 180px 180px; animation: a4a-grain 1.1s steps(1) infinite; transition: opacity 1400ms var(--doux); }
:root[data-organique] .a4a-grain { opacity: var(--grain-opacite); }
@keyframes a4a-grain { 0% { transform: translate(0, 0); } 20% { transform: translate(-71px, 38px); } 40% { transform: translate(43px, -92px); } 60% { transform: translate(-128px, -17px); } 80% { transform: translate(96px, 121px); } 100% { transform: translate(0, 0); } }
/* menu plein écran : ses propres nappes (il recouvre la page) */
.a4a-menu { background: radial-gradient(60vmax 46vmax at 88% 6%, rgba(169, 183, 155, .13), transparent 70%), radial-gradient(54vmax 44vmax at 4% 98%, rgba(211, 163, 135, .1), transparent 70%), var(--fond); }
/* bouton plein : dégradé lin vers sauge pâle qui glisse au survol */
html body .a4a-bouton.a4a-bouton-plein, html body .post-content .fusion-button, html body .fusion-form .fusion-button { background-image: linear-gradient(115deg, #ECE8DF 0%, #E4E7D8 48%, #CFD8C0 100%) !important; background-size: 220% 100% !important; background-position: 0 0 !important; }
html body .a4a-bouton.a4a-bouton-plein:hover, html body .post-content .fusion-button:hover, html body .fusion-form .fusion-button:hover { background-image: linear-gradient(115deg, #CFD8C0 0%, #A9B79B 52%, #98AA89 100%) !important; background-position: 100% 0 !important; }
/* titre d'accueil : un reflet de sauge traverse la ligne italique, lentement */
.a4a-hero-titre { background: linear-gradient(100deg, var(--texte) 0%, var(--texte) 38%, #D5E0C6 50%, var(--texte) 62%, var(--texte) 100%) 100% 0 / 260% 100% no-repeat; -webkit-background-clip: text; background-clip: text; animation: a4a-reflet 9s ease-in-out 2.4s infinite; }
.a4a-hero-titre .a4a-mot, .a4a-hero-titre .a4a-mot b { -webkit-text-fill-color: currentColor; }
@keyframes a4a-reflet { 0%, 55% { background-position: 100% 0; } 100% { background-position: 0% 0; } }
.a4a-hero-titre { -webkit-text-fill-color: transparent; }
.a4a-hero-titre .a4a-mot { -webkit-text-fill-color: transparent; }
.a4a-hero-titre .a4a-mot b { -webkit-text-fill-color: var(--sauge-fort); }
.a4a-hero-titre .a4a-mot.est-actif, .a4a-hero-titre .a4a-mot.est-actif b { -webkit-text-fill-color: var(--texte); }
/* portraits : un anneau dégradé sauge et argile tourne autour de l'arche au survol */
@property --a4a-angle { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
@keyframes a4a-tourne { to { --a4a-angle: 360deg; } }
html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) :is(.awb-image-frame, .fusion-imageframe) { position: relative; }
@media (hover: hover) and (pointer: fine) {
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) > .fusion-column-wrapper:hover .awb-image-frame::before {
    content: ''; position: absolute; inset: 0; z-index: 3; border-radius: inherit; pointer-events: none; padding: 2px;
    background: conic-gradient(from var(--a4a-angle), rgba(169, 183, 155, .95), rgba(211, 163, 135, .85), rgba(236, 232, 223, .0) 40%, rgba(169, 183, 155, .95));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    animation: a4a-tourne 3.2s linear infinite;
  }
}
/* encarts et annonces : matière de papier teinté (dégradé sauge pâle vers argile pâle) */
html body .post-content .a4a-encart, .a4a-annonce { background-image: radial-gradient(120% 140% at 0% 0%, rgba(169, 183, 155, .1), transparent 60%), radial-gradient(100% 120% at 100% 100%, rgba(211, 163, 135, .08), transparent 60%) !important; }
/* pastilles de menu : le galet respire lentement */
@keyframes a4a-galet { 0% { border-radius: var(--forme-a); } 100% { border-radius: var(--forme-b); } }
.a4a-menubtn-ico { animation: a4a-galet 7s ease-in-out infinite alternate; }
/* filets : ils s'effacent aux extrémités au lieu de couper net */
.a4a-rubrique { border-top-color: transparent; background: linear-gradient(90deg, transparent, var(--ligne) 10%, var(--ligne) 90%, transparent) top / 100% 1px no-repeat; }
.a4a-rubriques .a4a-rubrique:nth-last-child(-n + 2) { border-bottom-color: transparent; background: linear-gradient(90deg, transparent, var(--ligne) 10%, var(--ligne) 90%, transparent) top / 100% 1px no-repeat, linear-gradient(90deg, transparent, var(--ligne) 10%, var(--ligne) 90%, transparent) bottom / 100% 1px no-repeat; }
/* bande-annonce : le voile prend une teinte de nappe */
.a4a-voile::after { background: linear-gradient(to top, rgba(5, 5, 5, .92) 0, rgba(5, 5, 5, .5) 34%, rgba(5, 5, 5, .1) 62%, rgba(5, 5, 5, .38) 100%), radial-gradient(60% 50% at 82% 100%, rgba(169, 183, 155, .16), transparent 70%); }
/* coupé : mouvement réduit ou animations coupées — les nappes restent, sans bouger ; plus de grain animé */
@media (prefers-reduced-motion: reduce) {
  .a4a-blob, .a4a-grain, .a4a-hero-titre, .a4a-menubtn-ico { animation: none !important; }
  .a4a-hero-titre { background: none; -webkit-text-fill-color: currentColor; }
  .a4a-hero-titre .a4a-mot, .a4a-hero-titre .a4a-mot b { -webkit-text-fill-color: unset; }
}
:root[data-effets='reduits'] :is(.a4a-blob, .a4a-grain, .a4a-menubtn-ico, .a4a-hero-titre) { animation: none !important; }
:root[data-effets='reduits'] .a4a-hero-titre { background: none; -webkit-text-fill-color: currentColor; }
:root[data-effets='reduits'] .a4a-hero-titre :is(.a4a-mot, .a4a-mot b) { -webkit-text-fill-color: unset; }

/* ---------- 21. Pleine page (écrans 16/9) et titres de page ----------
   Le contenu occupe toute la largeur de l'écran, avec une gouttière proportionnelle ; au-delà de 1920 px il se centre. */
:root { --a4a-gouttiere: clamp(20px, 4.5vw, 88px); --a4a-pleine: 1920px; --ressort: cubic-bezier(.22, 1.15, .36, 1); }
html body .fusion-tb-header .fusion-row, html body .fusion-tb-footer .fusion-row, html body #main .fusion-row,
html body .post-content .fusion-builder-row, html body .post-content .fusion-builder-row[style] { max-width: var(--a4a-pleine) !important; }
html body #main { padding-left: 0 !important; padding-right: 0 !important; }
html body .post-content .fusion-fullwidth, html body .fusion-tb-header .fusion-fullwidth { padding-left: var(--a4a-gouttiere) !important; padding-right: var(--a4a-gouttiere) !important; }
html body .post-content .a4a-grille { max-width: var(--a4a-pleine); padding: 0 var(--a4a-gouttiere); grid-template-columns: repeat(auto-fill, minmax(clamp(150px, 13.5vw, 270px), 1fr)); }
html body .post-content .a4a-grille-livres { grid-template-columns: repeat(auto-fill, minmax(clamp(130px, 11vw, 220px), 1fr)); }
html body .post-content :is(.a4a-recherche, .a4a-annonces) { max-width: var(--a4a-pleine); padding-left: var(--a4a-gouttiere); padding-right: var(--a4a-gouttiere); }
.a4a-menu-haut, .a4a-menu-corps { max-width: var(--a4a-pleine); padding-inline: var(--a4a-gouttiere); }
.a4a-cv { max-width: 1480px; padding: 0 var(--a4a-gouttiere); }
.a4a-cv-contenu { max-width: 1040px; }
/* rubriques : toute la largeur, trois colonnes sur grand écran, chaque nom porte ses deux filets */
.a4a-rubriques { max-width: var(--a4a-pleine); padding: 0 var(--a4a-gouttiere); grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.a4a-rubriques .a4a-rubrique, .a4a-rubriques .a4a-rubrique:nth-last-child(-n + 2) { border: 0; background: linear-gradient(90deg, transparent, var(--ligne) 10%, var(--ligne) 90%, transparent) top / 100% 1px no-repeat, linear-gradient(90deg, transparent, var(--ligne) 10%, var(--ligne) 90%, transparent) bottom / 100% 1px no-repeat; }
.a4a-rubrique-nom { font-size: clamp(1.6rem, 2.6vw, 2.8rem); }
/* accueil sans bande-annonce : le logo occupe l'écran entier */
.a4a-hero:not(.a4a-scene) { max-width: none; min-height: calc(100svh - var(--entete, 100px)); margin: 0 auto; display: grid; place-content: center; padding: 24px var(--a4a-gouttiere); }
.a4a-hero:not(.a4a-scene) .a4a-hero-logo { height: clamp(240px, 50vh, 540px); }
.a4a-hero-titre { font-size: clamp(1.1rem, 1.9vw, 2rem) !important; padding: 0 .3em .1em; }

/* titres de page : plus de trait ondulé ; grands, très serrés, une étiquette au-dessus, les lettres montent l'une après l'autre */
html body .fusion-title-center h1::after { content: none !important; display: none !important; }
html body .post-content .fusion-title-size-one h1 { font-size: clamp(3rem, 8.6vw, 9.5rem) !important; letter-spacing: -.055em !important; line-height: .92 !important; font-weight: 500 !important; }
html body .post-content .fusion-title-size-one { margin-top: clamp(16px, 4vh, 56px) !important; margin-bottom: clamp(20px, 4vh, 56px) !important; }
.a4a-titre-etiq { display: flex; justify-content: center; align-items: center; gap: 12px; margin: 0 0 clamp(10px, 2vh, 22px); font: 500 12px/1 var(--police); letter-spacing: .16em; text-transform: uppercase; color: var(--texte-2); }
.a4a-titre-etiq::before, .a4a-titre-etiq::after { content: ''; width: clamp(24px, 4vw, 64px); height: 1px; background: linear-gradient(90deg, transparent, var(--sauge)); }
.a4a-titre-etiq::after { background: linear-gradient(90deg, var(--sauge), transparent); }
.a4a-titre-etiq b { color: var(--texte); font-weight: 500; }
.a4a-mots { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.a4a-l { display: inline-block; transform: translateY(105%); animation: a4a-lettre 520ms var(--ressort) forwards; animation-delay: calc(80ms + var(--i, 0) * 22ms); }
@keyframes a4a-lettre { to { transform: none; } }
.a4a-titre-etiq { animation: a4a-monte-doux 420ms var(--doux) both 40ms; }
@keyframes a4a-monte-doux { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ---------- 22. Animations supplémentaires ---------- */
/* barre de lecture : un fil sauge en haut de l'écran suit le défilement (animation liée au défilement, sans script) */
@supports (animation-timeline: scroll()) {
  .a4a-fil { position: fixed; left: 0; right: 0; top: 0; height: 2px; z-index: 2000001; pointer-events: none; transform-origin: 0 50%; background: linear-gradient(90deg, var(--sauge), #D3A387); animation: a4a-fil linear both; animation-timeline: scroll(root); }
  @keyframes a4a-fil { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  /* portraits et couvertures : l'image se resserre en entrant dans l'écran (propriété scale, distincte du zoom de survol) */
  html body .post-content .awb-image-frame img { animation: a4a-vue linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
  @keyframes a4a-vue { from { scale: 1.16; opacity: .35; } to { scale: 1; opacity: 1; } }
}
/* liste de portraits : survoler un portrait estompe les autres */
@media (hover: hover) and (pointer: fine) {
  html body .post-content .a4a-grille > .a4a-talent, html body .post-content .fusion-row > .fusion-layout-column:has(.awb-image-frame) { transition: opacity 260ms var(--doux), filter 260ms var(--doux); }
  html body .post-content .a4a-grille:has(> .a4a-talent:hover) > .a4a-talent:not(:hover),
  html body .post-content .fusion-row:has(> .fusion-layout-column .awb-image-frame:hover) > .fusion-layout-column:has(.awb-image-frame):not(:hover) { opacity: .42; filter: grayscale(.5); }
}
/* nom sous un portrait : un trait se dessine de gauche à droite au survol */
html body .post-content .fusion-layout-column:has(.awb-image-frame) .fusion-title h5 { display: inline; background: linear-gradient(var(--sauge), var(--sauge)) 0 100% / 0 1px no-repeat; transition: background-size 320ms var(--doux); }
html body .post-content .fusion-layout-column:has(.awb-image-frame) > .fusion-column-wrapper:hover .fusion-title h5 { background-size: 100% 1px; }
/* bandeau défilant des rubriques sous le logo d'accueil */
.a4a-bandeau { position: relative; overflow: hidden; padding: clamp(18px, 3vh, 34px) 0; margin: 0 0 clamp(40px, 7vh, 90px); -webkit-mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.a4a-bandeau-piste { display: flex; width: max-content; gap: clamp(28px, 4vw, 64px); animation: a4a-defile 38s linear infinite; }
.a4a-bandeau:hover .a4a-bandeau-piste { animation-play-state: paused; }
.a4a-bandeau a { display: inline-flex; align-items: center; gap: clamp(28px, 4vw, 64px); font: 500 clamp(2.4rem, 6vw, 6.4rem)/1 var(--titres); letter-spacing: -.045em; color: transparent !important; -webkit-text-stroke: 1px rgba(236, 232, 223, .38); text-decoration: none !important; white-space: nowrap; transition: color 260ms var(--doux), -webkit-text-stroke-color 260ms var(--doux); }
.a4a-bandeau a::after { content: ''; width: .18em; height: .18em; border-radius: var(--forme-b); background: var(--sauge); flex: none; }
.a4a-bandeau a:hover { color: var(--texte) !important; -webkit-text-stroke-color: transparent; }
@keyframes a4a-defile { to { transform: translateX(-50%); } }
/* en-tête : il s'efface quand on descend, revient dès qu'on remonte */
html body .fusion-tb-header { transition: translate 300ms var(--doux); }
:root[data-entete-cache]:not([data-menu-ouvert]) body .fusion-tb-header { translate: 0 -110%; }
/* boutons aimantés : ils glissent de quelques pixels vers le curseur (posé par le script, propriété translate) */
:is(.a4a-bouton, .fusion-button, .a4a-menubtn, .a4a-cv-retour) { transition-property: transform, translate, background-color, background-position, border-color, color, border-radius !important; }
/* pied de page : il monte doucement quand il arrive */
@supports (animation-timeline: view()) {
  html body .fusion-tb-footer { animation: a4a-pied linear both; animation-timeline: view(); animation-range: entry 0% entry 80%; }
  @keyframes a4a-pied { from { opacity: 0; translate: 0 40px; } to { opacity: 1; translate: 0 0; } }
}
@media (prefers-reduced-motion: reduce) {
  .a4a-l, .a4a-titre-etiq { animation: none !important; transform: none !important; }
  .a4a-bandeau-piste, .a4a-fil, html body .post-content .awb-image-frame img, html body .fusion-tb-footer { animation: none !important; }
  :root[data-entete-cache] body .fusion-tb-header { translate: none; }
}
:root[data-effets='reduits'] :is(.a4a-l, .a4a-titre-etiq, .a4a-bandeau-piste) { animation: none !important; transform: none !important; }
@media (max-width: 760px) { html body .post-content .fusion-title-size-one h1 { font-size: clamp(2.6rem, 13vw, 4.4rem) !important; } .a4a-bandeau a { font-size: clamp(2rem, 11vw, 3.2rem); } }

/* ---------- 23. Interface inspirée de QBH, dans nos couleurs ----------
   Apparitions floutées, encre qui se répand depuis le point d'entrée du curseur, portraits qui prennent leurs couleurs, projecteur et parallaxe
   sur l'accueil, rythme décalé des portraits, pied de page en matière, chiffres de l'agence. Palette inchangée : noir, lin, sauge, argile. */
/* apparition : le bloc monte, se met au point (flou qui se dissipe) et grandit d'un rien */
.a4a-pret .a4a-entree { opacity: 0; transform: translateY(30px) scale(.985); filter: blur(6px); }
.a4a-pret .a4a-entree.a4a-vu { opacity: 1; transform: none; filter: none; transition: opacity 480ms var(--doux), transform 520ms var(--doux), filter 480ms var(--doux); transition-delay: var(--a4a-delai, 50ms); }
/* boutons creux : la sauge se répand depuis l'endroit où le curseur est entré */
html body .a4a-bouton:not(.a4a-bouton-plein), html body .a4a-cv-retour { isolation: isolate; }
html body .a4a-bouton:not(.a4a-bouton-plein)::after {
  content: ''; position: absolute; z-index: -1; left: var(--mx, 50%); top: var(--my, 50%); width: 320%; aspect-ratio: 1; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, #B8C5AA 0%, var(--sauge) 55%, #8E9C80 100%); transform: translate(-50%, -50%) scale(0); transition: transform 420ms var(--doux);
}
@media (hover: hover) and (pointer: fine) {
  html body .a4a-bouton:not(.a4a-bouton-plein):hover { color: #121310 !important; border-color: var(--sauge); }
  html body .a4a-bouton:not(.a4a-bouton-plein):hover::after { transform: translate(-50%, -50%) scale(1); }
}
/* portraits : en gris au repos, ils prennent leurs couleurs au survol ; un voile sauge-argile passe dessus ; l'arche s'assouplit avec un ressort */
@media (hover: hover) and (pointer: fine) {
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) img { filter: grayscale(1) contrast(1.04); }
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) > .fusion-column-wrapper:hover img { filter: none; }
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) :is(.awb-image-frame, .fusion-imageframe) { transition: border-radius 650ms cubic-bezier(.34, 1.4, .64, 1), transform 280ms var(--doux), box-shadow 450ms var(--doux); }
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) > .fusion-column-wrapper:hover .awb-image-frame { box-shadow: 0 30px 50px -30px rgba(0, 0, 0, .9), 0 0 60px -20px rgba(169, 183, 155, .35); }
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) .fusion-imageframe::after {
    content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; transition: opacity 500ms var(--doux); mix-blend-mode: soft-light;
    background: linear-gradient(160deg, rgba(169, 183, 155, .5), rgba(211, 163, 135, .3) 60%, rgba(5, 5, 5, .2));
  }
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) > .fusion-column-wrapper:hover .fusion-imageframe::after { opacity: 1; }
  html body .post-content .fusion-layout-column:has(.awb-image-frame):has(.fusion-title) .fusion-imageframe { position: relative; }
}
/* rythme décalé : sur grand écran, un portrait sur deux descend d'un cran */
@media (min-width: 900px) {
  html body .post-content .a4a-grille:not(.a4a-grille-livres) > .a4a-talent:nth-child(2n) { translate: 0 clamp(24px, 3vw, 56px); }
  html body .post-content .a4a-grille:not(.a4a-grille-livres) { padding-bottom: clamp(24px, 3vw, 56px); }
}
/* langues : le filtre actif est un galet en dégradé sauge, qui ondule doucement */
html body .a4a-rech-langue[aria-pressed='true'] { background: linear-gradient(115deg, #ECE8DF, #CFD8C0 50%, #A9B79B) 0 0 / 200% 100%; border-color: transparent; color: #121310; box-shadow: 0 8px 22px -10px rgba(169, 183, 155, .7); animation: a4a-ondule 7s ease-in-out infinite alternate; }
@keyframes a4a-ondule { from { background-position: 0% 0; } to { background-position: 100% 0; } }
/* accueil : un projecteur doux suit la souris, une fuite de lumière dérive ; en défilant, le logo monte et s'efface (parallaxe, posé par le script) */
.a4a-hero:not(.a4a-scene) { position: relative; isolation: isolate; overflow: hidden; }
.a4a-hero:not(.a4a-scene)::before {
  content: ''; position: absolute; inset: -10%; z-index: -1; pointer-events: none; opacity: .9;
  background: radial-gradient(40% 50% at 20% 30%, rgba(169, 183, 155, .14), transparent 70%), radial-gradient(36% 46% at 80% 72%, rgba(211, 163, 135, .11), transparent 70%);
  animation: a4a-fuite 18s ease-in-out infinite alternate;
}
@keyframes a4a-fuite { from { transform: translate(-3%, -2%) rotate(0deg) scale(1); } to { transform: translate(4%, 3%) rotate(6deg) scale(1.1); } }
.a4a-hero:not(.a4a-scene)::after {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0; transition: opacity 600ms var(--doux);
  background: radial-gradient(520px circle at var(--sx, 50%) var(--sy, 50%), rgba(236, 232, 223, .08), rgba(169, 183, 155, .05) 45%, transparent 68%);
}
.a4a-hero:not(.a4a-scene):hover::after { opacity: 1; }
.a4a-hero:not(.a4a-scene) > * { will-change: transform, opacity; }
/* chiffres de l'agence : un texte d'introduction, puis les rubriques comptées ; les nombres défilent jusqu'à leur valeur en entrant à l'écran */
.a4a-agence { max-width: var(--a4a-pleine, 1920px); margin: 0 auto clamp(56px, 10vh, 120px); padding: 0 var(--a4a-gouttiere, 24px); display: grid; gap: clamp(28px, 5vh, 56px); }
.a4a-agence-texte { max-width: 26ch; margin: 0 auto; text-align: center; font: italic 400 clamp(1.5rem, 3.2vw, 3rem)/1.18 var(--serif); color: var(--texte); text-wrap: balance; }
.a4a-chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); border-top: 1px solid var(--ligne); }
.a4a-chiffre { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: clamp(20px, 3vh, 34px) clamp(12px, 1.6vw, 26px); border-bottom: 1px solid var(--ligne); color: var(--texte) !important; text-decoration: none !important; position: relative; overflow: hidden; isolation: isolate; }
.a4a-chiffre + .a4a-chiffre { border-left: 1px solid var(--ligne); }
.a4a-chiffre::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 120% at 0% 100%, rgba(169, 183, 155, .16), transparent 60%); opacity: 0; transition: opacity 400ms var(--doux); }
.a4a-chiffre:hover::before { opacity: 1; }
.a4a-chiffre-n { font: 500 clamp(2.8rem, 6vw, 6rem)/.9 var(--titres); letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.a4a-chiffre-l { font: 500 12px/1.2 var(--police); letter-spacing: .14em; text-transform: uppercase; color: var(--texte-2); transition: color 200ms var(--doux), letter-spacing 500ms var(--doux); }
.a4a-chiffre:hover .a4a-chiffre-l { color: var(--sauge); letter-spacing: .2em; }
@media (max-width: 640px) { .a4a-chiffre + .a4a-chiffre { border-left: 0; } .a4a-chiffres { grid-template-columns: repeat(2, minmax(0, 1fr)); } .a4a-chiffre:nth-child(2n) { border-left: 1px solid var(--ligne); } }
/* pied de page : matière profonde, nappes qui dérivent */
html body .fusion-tb-footer { position: relative; isolation: isolate; }
html body .fusion-tb-footer::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(55% 90% at 8% 0%, rgba(169, 183, 155, .16), transparent 66%), radial-gradient(48% 80% at 96% 100%, rgba(211, 163, 135, .12), transparent 70%); background-size: 150% 150%; animation: a4a-matiere 24s ease-in-out infinite alternate; }
@keyframes a4a-matiere { from { background-position: 0% 0%; } to { background-position: 100% 100%; } }
/* CV : le nom du talent prend une encre en dégradé qui circule */
html body .a4a-cv-nom { background: linear-gradient(95deg, var(--texte) 0%, var(--texte) 34%, #CFD8C0 52%, #D3A387 70%, var(--texte) 90%) 0 50% / 260% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: a4a-encre 14s ease-in-out infinite alternate; }
html body .a4a-cv-nom .a4a-langues { -webkit-text-fill-color: initial; }
@keyframes a4a-encre { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
::selection { background: var(--sauge); color: #121310; }
@media (prefers-reduced-motion: reduce) {
  .a4a-pret .a4a-entree { filter: none !important; }
  .a4a-hero:not(.a4a-scene)::before, html body .fusion-tb-footer::before, html body .a4a-cv-nom, html body .a4a-rech-langue[aria-pressed='true'] { animation: none !important; }
  html body .post-content .a4a-grille > .a4a-talent:nth-child(2n) { translate: none; }
}
:root[data-effets='reduits'] :is(.a4a-hero::before, .a4a-cv-nom) { animation: none !important; }

/* ---------- 24. Fonds unis : plus de fondus en arrière-plan (3.17.0) ----------
   Les nappes, la fuite de lumière et le projecteur d'accueil, la matière du pied de page, les halos des encarts et du menu sont retirés ;
   le fond reste le noir uni. Le grain très léger est conservé (a4a_verre_organique ou A4A.organique = false le retire aussi). */
.a4a-organique, .a4a-blob { display: none !important; }
.a4a-hero:not(.a4a-scene)::before, .a4a-hero:not(.a4a-scene)::after, html body .fusion-tb-footer::before { content: none !important; }
.a4a-menu { background: var(--fond) !important; }
html body .post-content .a4a-encart, .a4a-annonce { background-image: none !important; }
.a4a-chiffre::before { content: none; }

/* ---------- 25. Structure calquée sur QBH : catalogue des talents, À propos, actualités, pied de page en colonnes ---------- */
/* catalogue : filtres par métier */
.a4a-roles-filtre { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; max-width: var(--a4a-pleine, 1920px); margin: 0 auto clamp(18px, 3vh, 32px); padding: 0 var(--a4a-gouttiere, 24px); }
.a4a-roles-filtre .a4a-puce { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px; border: 1px solid var(--ligne); color: var(--texte-2); font: 500 12px/1 var(--police); letter-spacing: .16em; text-transform: uppercase; cursor: pointer; transition: color 160ms var(--doux), border-color 160ms var(--doux), background-color 160ms var(--doux); }
.a4a-roles-filtre .a4a-puce span { font-variant-numeric: tabular-nums; opacity: .6; letter-spacing: 0; }
.a4a-roles-filtre .a4a-puce:hover { color: var(--texte); border-color: var(--texte-2); }
.a4a-roles-filtre .a4a-puce[aria-pressed='true'] { background: linear-gradient(115deg, #ECE8DF, #CFD8C0 60%, #A9B79B); border-color: transparent; color: #121310; }
.a4a-roles-filtre .a4a-puce:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.a4a-role-cache { display: none !important; }
/* carte : les métiers apparaissent en bas de l'arche au survol */
.a4a-roles { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 38px 14px 18px; text-align: center; font: 500 11px/1.5 var(--police); letter-spacing: .16em; text-transform: uppercase; color: #ECE8DF; background: linear-gradient(0deg, rgba(5, 5, 5, .92), rgba(5, 5, 5, .55) 55%, transparent); opacity: 0; transform: translateY(10px); transition: opacity 320ms var(--doux), transform 420ms var(--doux); pointer-events: none; }
.a4a-talent:hover .a4a-roles, .a4a-talent:focus-within .a4a-roles { opacity: 1; transform: none; }
html body .post-content .a4a-talent .awb-image-frame { position: relative; }

/* À propos */
.a4a-apropos { max-width: 1180px; margin: 0 auto clamp(56px, 10vh, 120px); padding: 0 var(--a4a-gouttiere, 24px); display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(32px, 7vw, 120px); align-items: start; }
.a4a-apropos-texte p { margin: 0 0 1.2em; font: italic 400 clamp(1.25rem, 2.2vw, 2rem)/1.35 var(--serif); color: var(--texte); text-wrap: pretty; }
.a4a-equipe-titre { margin: 0 0 18px; font: 500 12px/1 var(--police) !important; letter-spacing: .16em; text-transform: uppercase; color: var(--sauge) !important; }
.a4a-equipe-groupe { padding: 18px 0; border-top: 1px solid var(--ligne); }
.a4a-equipe-groupe h3 { margin: 0 0 10px; font: 500 12px/1 var(--police) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--texte-2) !important; }
.a4a-equipe-groupe ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.a4a-equipe-groupe li { font: 500 clamp(1.3rem, 2vw, 1.8rem)/1.2 var(--titres); letter-spacing: -.03em; transition: transform 220ms var(--doux), color 220ms var(--doux); color: var(--texte-2); }
.a4a-equipe-groupe li:hover { color: var(--texte); transform: translateX(8px); }
@media (max-width: 860px) { .a4a-apropos { grid-template-columns: 1fr; } }

/* actualités : cartes avec image, date, titre, extrait, « Lire la suite » */
.a4a-actus-grille { max-width: var(--a4a-pleine, 1920px); margin: 0 auto clamp(48px, 9vh, 110px); padding: 0 var(--a4a-gouttiere, 24px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: clamp(24px, 3vw, 48px); align-items: start; }
.a4a-actu-carte { position: relative; display: flex; flex-direction: column; gap: 18px; }
.a4a-actu-cadre-lien { display: block; text-decoration: none !important; }
.a4a-actu-cadre { display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 26px; background: #0F0F0E; box-shadow: inset 0 0 0 1px var(--ligne); transition: border-radius 800ms cubic-bezier(.34, 1.4, .64, 1), transform 500ms var(--doux); }
.a4a-actu-cadre img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(.85) contrast(1.05); transition: filter 600ms var(--doux), transform 1000ms var(--doux); }
.a4a-actu-carte:hover .a4a-actu-cadre { border-radius: 26px 90px 26px 90px; transform: translateY(-4px); }
.a4a-actu-carte:hover .a4a-actu-cadre img { filter: none; transform: scale(1.05); }
.a4a-actu-sans { background: radial-gradient(120% 90% at 20% 0%, var(--sauge-pale), #0C0C0B); }
.a4a-actu-corps { display: grid; gap: 8px; }
.a4a-actu-date { font: 500 12px/1 var(--police); letter-spacing: .14em; text-transform: uppercase; color: var(--texte-2); }
.a4a-actu-carte .a4a-actu-titre { margin: 0; font: 500 clamp(1.3rem, 1.8vw, 1.7rem)/1.15 var(--titres); letter-spacing: -.03em; color: var(--texte); }
.a4a-actu-extrait { margin: 0; line-height: 1.55; color: var(--texte-2); }
.a4a-actu-carte .a4a-actu-lien { justify-self: start; margin-top: 4px; font: 500 12px/1 var(--police); letter-spacing: .16em; text-transform: uppercase; color: var(--texte); text-decoration: none; background: linear-gradient(var(--sauge), var(--sauge)) 0 100% / 100% 1px no-repeat; padding-bottom: 6px; transition: background-size 400ms var(--doux), letter-spacing 400ms var(--doux); }
.a4a-actu-carte .a4a-actu-lien:hover { letter-spacing: .24em; }
@media (min-width: 900px) { .a4a-actus-grille > .a4a-actu-carte:nth-child(3n + 2) { margin-top: clamp(24px, 4vw, 64px); } }
/* accueil : dernières actualités */
.a4a-actus-accueil { margin-top: clamp(40px, 8vh, 100px); }
.a4a-actus-accueil .a4a-actus-titre { max-width: var(--a4a-pleine, 1920px); margin: 0 auto clamp(20px, 3vh, 36px); padding: 0 var(--a4a-gouttiere, 24px); font: 500 clamp(2rem, 4vw, 4rem)/1 var(--titres); letter-spacing: -.045em; }
.a4a-actus-tout { margin: 0 auto clamp(48px, 9vh, 110px); text-align: center; }

/* pied de page : marque et slogan, réseaux, liens rapides, métiers, mentions ; le pied d'Avada se range dessous quand celui-ci est posé */
.a4a-pied { position: relative; z-index: 2; margin-top: clamp(24px, 6vh, 80px); border-top: 1px solid var(--ligne); background: linear-gradient(0deg, #0A0A09, transparent); }
.a4a-pied[hidden] { display: none; }
.a4a-pied-grille { max-width: var(--a4a-pleine, 1920px); margin: 0 auto; padding: clamp(36px, 7vh, 80px) var(--a4a-gouttiere, 24px) clamp(24px, 4vh, 48px); display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(auto-fit, minmax(150px, 1fr)); gap: clamp(28px, 4vw, 72px); }
.a4a-pied-marque p { max-width: 24ch; margin: 18px 0 0; font: italic 400 1.15rem/1.35 var(--serif); color: var(--texte-2); }
.a4a-pied-logo { display: block; height: 64px; }
.a4a-pied-logo .a4a-logo { height: 100%; }
.a4a-pied-col { display: grid; align-content: start; gap: 10px; }
.a4a-pied-col h4 { margin: 0 0 6px; font: 500 12px/1 var(--police) !important; letter-spacing: .16em; text-transform: uppercase; color: var(--sauge) !important; }
.a4a-pied-col a, .a4a-pied-legal { width: fit-content; color: var(--texte) !important; text-decoration: none !important; font-size: 15px; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size 380ms var(--doux), color 200ms var(--doux); }
.a4a-pied-col a:hover, .a4a-pied-legal:hover { background-size: 100% 1px; }
.a4a-pied-bas { max-width: var(--a4a-pleine, 1920px); margin: 0 auto; padding: 20px var(--a4a-gouttiere, 24px) 28px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; border-top: 1px solid var(--ligne); font-size: 13px; color: var(--texte-2); }
.a4a-pied-legal { font-size: 13px; color: var(--texte-2) !important; }
.a4a-pied ~ .fusion-tb-footer, .a4a-pied + * .fusion-tb-footer { display: none !important; }
@media (max-width: 760px) { .a4a-pied-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } .a4a-pied-marque { grid-column: 1 / -1; } }

/* ---------- 26. En chantier, recommandations sur la fiche d'un talent ---------- */
.a4a-chantier { display: flex; align-items: center; justify-content: center; gap: 14px; max-width: 640px; margin: 0 auto clamp(48px, 9vh, 110px); padding: clamp(26px, 5vh, 48px) 24px; border: 1px dashed var(--ligne); border-radius: 28px; font: 500 12px/1.4 var(--police); letter-spacing: .16em; text-transform: uppercase; color: var(--texte-2); text-align: center; }
.a4a-chantier span { width: 10px; height: 10px; flex: none; border-radius: var(--forme-b); background: var(--sauge); animation: a4a-galet 3.2s ease-in-out infinite alternate; }
.a4a-actus-accueil .a4a-chantier { margin-top: 0; }
.a4a-reco { max-width: var(--a4a-pleine, 1920px); margin: clamp(48px, 9vh, 110px) auto clamp(40px, 7vh, 90px); padding: clamp(28px, 5vh, 56px) 0 0; border-top: 1px solid var(--ligne); }
.a4a-reco-titre { max-width: var(--a4a-pleine, 1920px); margin: 0 auto clamp(20px, 3vh, 36px); padding: 0 var(--a4a-gouttiere, 24px); font: 500 clamp(1.8rem, 3.6vw, 3.4rem)/1 var(--titres) !important; letter-spacing: -.045em; }
.a4a-reco .a4a-grille-reco { grid-template-columns: repeat(auto-fit, minmax(clamp(150px, 15vw, 280px), 1fr)); max-width: 1500px; }
.a4a-reco-tout { margin: clamp(8px, 2vh, 24px) 0 0; text-align: center; }
@media (prefers-reduced-motion: reduce) { .a4a-chantier span { animation: none; } }