/* « Recherche vivante » v1 — l'objet animé qui rejoue une recherche d'annuaire.univers.fr (fichier généré par
   maquettes/recherche-vivante/fabriquer.py, ne pas modifier à la main). Feuille autonome : classes rv-*, jetons --rv-*, palette
   « nuit et or » portée par les jetons ; aucune dépendance à une feuille de produit, aucune surcharge des composants communs.
   Pages : /emailing-bases-fichier-adresse-email (haut de page, placement dans ad-b2b-v5.css) et l'accueil (section d'annonce,
   placement dans ad-accueil-v4.css).
   Sans script ou en mouvement réduit : l'image finale (sa cible : 578 établissements en Gironde). Avec script : .rv-pret pose la
   première image pleine (toute la France), .rv-joue lance le cycle à l'entrée dans l'écran et le met en pause hors de l'écran. */

a.rv { --rv-fond:rgba(19,28,46,.86); --rv-texte:#fff; --rv-doux:#b0b8c6; --rv-or:#e0b95a; --rv-puce:#f4dfa8; --rv-filet:rgba(255,255,255,.14);
  --rv-rayon:1em; --rv-max:16px; --rv-w:27; --rv-flou:blur(14px); --cycle:13s;
  --rv-ombre:0 0 0 1px rgba(255,255,255,.16),0 2px 4px rgba(0,0,0,.2),-10px 26px 50px -16px rgba(0,0,0,.65),-30px 60px 100px -34px rgba(0,0,0,.6);
  display:block; container-type:inline-size; width:100%; text-align:left; text-decoration:none; color:var(--rv-texte);
  font-family:var(--ad-police-texte); border-radius:var(--rv-rayon); }
/* échelle en em : le corps de l'objet suit la largeur de son cadre, entre 13 px et --rv-max */
.rv .rv-in { display:block; position:relative; font-size:max(13px,min(calc(100cqw / var(--rv-w)),var(--rv-max))); line-height:1.35; padding:1.15em 1.2em 1.1em;
  border-radius:var(--rv-rayon); background:var(--rv-fond); box-shadow:var(--rv-ombre); -webkit-backdrop-filter:var(--rv-flou); backdrop-filter:var(--rv-flou);
  transition:transform 160ms cubic-bezier(0.23,1,0.32,1); }
a.rv:active .rv-in { transform:scale(.985); }
a.rv:focus-visible { outline:3px solid #fff; outline-offset:4px; }
/* petits textes : jamais sous 10,5 px (DESIGN.md §9) ; le corps de l'objet vaut 13 px au plancher, d'où .82 em au moins */
.rv .rv-lab { display:block; font-size:.82em; line-height:1.3; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--rv-doux); }

/* le champ : deux lignes, la phrase telle qu'on la dit */
.rv .rv-champ { position:relative; display:block; margin:.45em 0 .95em; padding:.55em .75em; border-radius:.6em; background:rgba(255,255,255,.06);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); font-size:1.06em; line-height:1.45; font-weight:500; }
.rv .rv-champ::after { content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 0 1.5px var(--rv-or); opacity:0; pointer-events:none; }
.rv .rv-l { display:block; min-height:1.45em; white-space:nowrap; }
.rv .rv-s { position:relative; display:inline-block; }
.rv .rv-s::before { content:""; position:absolute; left:0; right:0; bottom:.02em; height:2px; border-radius:1px; background:var(--rv-or); opacity:.9; transform-origin:0 50%; }
.rv .rv-t { display:inline-block; }
/* curseur : un élément de la largeur du segment, dont seul le bord droit se voit ; il avance par les mêmes paliers que le texte */
.rv .rv-k { position:absolute; top:.18em; bottom:.12em; left:0; width:100%; box-shadow:inset -1.5px 0 0 #fff; opacity:0; pointer-events:none; }
.rv .rv-s1::after { content:""; position:absolute; top:.18em; bottom:.12em; right:-.16em; width:1.5px; background:#fff; opacity:0; }

/* les critères compris */
.rv .rv-puces { display:flex; flex-wrap:wrap; gap:.4em; margin:.45em 0 .95em; }
.rv .rv-puce { display:inline-flex; align-items:center; padding:.3em .7em; border-radius:99px; background:rgba(224,185,90,.15); color:var(--rv-puce);
  box-shadow:inset 0 0 0 1px rgba(224,185,90,.28); font-size:.86em; line-height:1.25; font-weight:600; white-space:nowrap; }

/* la mesure : le nombre, la carte */
.rv .rv-mesure { display:grid; grid-template-columns:minmax(0,1fr) 7.2em; gap:1em; align-items:center; padding:.75em 0;
  border-top:1px solid var(--rv-filet); border-bottom:1px solid var(--rv-filet); }
.rv .rv-nb { display:block; }
.rv .rv-nb__n { display:grid; overflow:hidden; }
.rv .rv-n { grid-area:1/1; font:600 2.7em/1.08 var(--ad-police-titre); letter-spacing:-.035em; font-variant-numeric:tabular-nums; white-space:nowrap; }
.rv .rv-nb__l { display:block; margin-top:.3em; font-size:.86em; color:var(--rv-doux); }
.rv .rv-carte { position:relative; display:block; aspect-ratio:10.44 / 10.19; overflow:hidden; border-radius:.55em;
  background:rgba(255,255,255,.035); box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
.rv .rv-svg { position:absolute; inset:0; display:block; width:100%; height:100%; transform-origin:30.67% 63.72%; }
.rv .rv-svg path { fill:none; stroke-linecap:round; }
.rv .rv-fr path { stroke:#fff; stroke-width:.17px; }
.rv .rv-d0 { opacity:.3; } .rv .rv-d1 { opacity:.58; } .rv .rv-d2 { opacity:.95; }
.rv .rv-v { stroke:#fff; stroke-width:.028px; stroke-opacity:.22; }
.rv .rv-svg .rv-ge { fill:rgba(224,185,90,.1); stroke:rgba(224,185,90,.6); stroke-width:.018px; stroke-linejoin:round; }
.rv .rv-f { stroke:#fff; stroke-width:.05px; }
.rv .rv-gr circle { fill:var(--rv-or); }
.rv .rv-ondes circle { fill:none; stroke:var(--rv-or); stroke-width:.014px; opacity:0; transform-box:fill-box; transform-origin:center; }
@container (max-width:300px) { .rv .rv-n { font-size:2.3em; } .rv .rv-mesure { grid-template-columns:minmax(0,1fr) 6.4em; } }

/* les établissements trouvés (trois emplacements, trois variantes empilées) */
.rv .rv-lignes { display:block; margin:.35em 0 .75em; }
.rv .rv-slot { display:grid; overflow:hidden; }
.rv .rv-slot + .rv-slot { border-top:1px solid rgba(255,255,255,.1); }
.rv .rv-ln { grid-area:1/1; display:grid; grid-template-columns:.5em minmax(0,1fr); column-gap:.7em; padding:.42em 0; line-height:1.25; }
.rv .rv-pt { grid-row:1 / span 2; align-self:center; width:.5em; height:.5em; border-radius:50%; background:rgba(255,255,255,.45); }
.rv .rv-ln--c .rv-pt { background:var(--rv-or); }
.rv .rv-nom { font-size:.95em; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rv .rv-meta { font-size:.82em; color:var(--rv-doux); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* l'action : tout l'objet est le lien (doctrine d'affordance du 28/10/2026) */
.rv .rv-go { display:flex; align-items:center; justify-content:space-between; gap:.8em; padding:.7em .9em; border-radius:.6em; background:rgba(255,255,255,.1);
  font-weight:600; font-size:.95em; }
.rv .rv-go__d { display:flex; align-items:center; gap:.7em; }
.rv .rv-pill { display:inline-flex; align-items:center; padding:.28em .7em; border-radius:99px; background:#fff3c4; color:#5c4400; font-size:.86em; font-weight:600; white-space:nowrap; }
.rv .rv-go i { display:inline-block; }
@media (hover:hover) {
  a.rv:hover .rv-go { background:rgba(255,255,255,.18); }
  a.rv:hover .rv-go i { translate:3px 0; }
  .rv .rv-go i { transition:translate .15s ease; }
}

/* ---------- disposition large (objet de 520 px et plus : section d'annonce de l'accueil) ----------
   La carte grandit et passe à droite sur la hauteur de la recherche ; chaque établissement tient sur une ligne. */
@container (min-width:520px) {
  .rv .rv-in { display:grid; grid-template-columns:minmax(0,1fr) 13em; column-gap:1.7em; align-items:start; padding:1.75em 1.8em 1.6em; }
  .rv .rv-in > * { grid-column:1; }
  .rv .rv-mesure { display:contents; }
  /* la fenêtre de carte prend la hauteur de la colonne de recherche (du libellé au nombre) ; la carte y reste à son rapport, centrée :
     le centrage passe par la propriété translate, les images-clés du rapprochement gardent transform */
  .rv .rv-carte { grid-column:2; grid-row:1 / span 5; align-self:stretch; aspect-ratio:auto; margin-bottom:1.1em; border-radius:.8em; }
  .rv .rv-svg { inset:50% auto auto 0; height:auto; aspect-ratio:10.44 / 10.19; translate:0 -50%; }
  .rv .rv-nb { padding:.15em 0 1.1em; }
  .rv .rv-n { font-size:3.3em; }
  .rv .rv-nb__l { font-size:.9em; }
  .rv .rv-lignes, .rv .rv-go { grid-column:1 / -1; }
  .rv .rv-lignes { margin:0 0 .9em; border-top:1px solid var(--rv-filet); padding-top:.3em; }
  .rv .rv-ln { grid-template-columns:.5em minmax(0,1fr) auto; align-items:center; padding:.62em 0; }
  .rv .rv-pt { grid-row:auto; }
  .rv .rv-nom { font-size:1em; }
  .rv .rv-meta { font-size:.86em; text-align:right; }
  .rv .rv-go { padding:.85em 1.05em; font-size:1em; }
}

/* image finale (sans script, mouvement réduit) : sa cible */
.rv .rv-n--a, .rv .rv-n--b, .rv .rv-ln--a, .rv .rv-ln--b { opacity:0; }
.rv .rv-svg { transform:translate(19.33%,-13.72%) scale(4.4); }
.rv .rv-fr { opacity:0; } .rv .rv-gf { opacity:.18; }

/* ---------- chorégraphie (13 s) ----------
   0-1.6s     première image pleine : « restaurants », toute la France, 304 082 établissements (l'état que croit le lecteur : court)
   1.6-2.32s  frappe de « en Gironde, » ; 2.45s : critère Gironde, 7 699, la carte se rapproche de la Gironde
   4.6-5.59s  frappe de « de plus de 10 salariés » ; 5.75s : critère taille, 578, les établissements retenus en or
   6.3-12.2s  sa cible, longtemps (on retient la fin) ; 12.2-13s : retour à la première image, plus rapide que l'aller */
.rv-anim.rv-pret *, .rv-anim.rv-pret *::before, .rv-anim.rv-pret *::after {
  animation-duration:var(--cycle); animation-iteration-count:infinite; animation-fill-mode:both; animation-timing-function:linear; animation-play-state:paused; }
.rv-anim.rv-pret.rv-joue *, .rv-anim.rv-pret.rv-joue *::before, .rv-anim.rv-pret.rv-joue *::after { animation-play-state:running; }
/* pause tant que le pointeur ou le focus clavier est sur l'objet (WCAG 2.2.2, avec l'arrêt posé par le script) */
.rv-anim.rv-pret.rv-joue:focus-visible *, .rv-anim.rv-pret.rv-joue:focus-visible *::before, .rv-anim.rv-pret.rv-joue:focus-visible *::after { animation-play-state:paused; }
@media (hover:hover) { .rv-anim.rv-pret.rv-joue:hover *, .rv-anim.rv-pret.rv-joue:hover *::before, .rv-anim.rv-pret.rv-joue:hover *::after { animation-play-state:paused; } }
.rv-pret .rv-s2 { animation-name:rvS2; }
.rv-pret .rv-s3 { animation-name:rvS3; }
.rv-pret .rv-s2 .rv-t { animation-name:rvTape2; } .rv-pret .rv-s2 .rv-k { animation-name:rvCurseur2; }
.rv-pret .rv-s3 .rv-t { animation-name:rvTape3; } .rv-pret .rv-s3 .rv-k { animation-name:rvCurseur3; }
.rv-pret .rv-s1::after { animation-name:rvCa1; }
.rv-pret .rv-champ::after { animation-name:rvFocus; }
.rv-pret .rv-s2::before { animation-name:rvSouligne2; }
.rv-pret .rv-s3::before { animation-name:rvSouligne3; }
.rv-pret .rv-p2 { animation-name:rvPuce2; }
.rv-pret .rv-p3 { animation-name:rvPuce3; }
.rv-pret .rv-n--a { animation-name:rvA; } .rv-pret .rv-n--b { animation-name:rvB; } .rv-pret .rv-n--c { animation-name:rvC; }
.rv-pret .rv-ln--a { animation-name:rvA; } .rv-pret .rv-ln--b { animation-name:rvB; } .rv-pret .rv-ln--c { animation-name:rvC; }
.rv-pret .rv-ln { animation-delay:calc(120ms + var(--k) * 60ms); }
.rv-pret .rv-svg { animation-name:rvZoom; }
.rv-pret .rv-fr { animation-name:rvZoom, rvFr; }
.rv-pret .rv-vo { animation-name:rvZoom, rvVo; }
.rv-pret .rv-gf { animation-name:rvZoom, rvGf; }
.rv-pret .rv-gr { animation-name:rvZoom, rvGr; }
.rv-pret .rv-ondes circle { animation-name:rvOnde; }
.rv-pret .rv-ondes circle:nth-child(2n) { animation-delay:70ms; }
.rv-pret .rv-go i { animation-name:rvFleche; }
@media (prefers-reduced-motion:reduce) { .rv-anim.rv-pret *, .rv-anim.rv-pret *::before, .rv-anim.rv-pret *::after { animation:none !important; } }

@keyframes rvS2 {
  0%, 12.231% { opacity:0; }
  12.308%, 93.846% { opacity:1; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  95.769%, 100% { opacity:0; }
}
@keyframes rvS3 {
  0%, 35.308% { opacity:0; }
  35.385%, 93.846% { opacity:1; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  95.769%, 100% { opacity:0; }
}
@keyframes rvTape2 {
  0%, 12.308% { clip-path:inset(-.3em 100% -.3em 0); animation-timing-function:steps(11, jump-end); }
  17.808%, 100% { clip-path:inset(-.3em 0 -.3em 0); }
}
@keyframes rvCurseur2 {
  0%, 12.3% { opacity:0; transform:translateX(-100%); }
  12.308% { opacity:1; transform:translateX(-100%); animation-timing-function:steps(11, jump-end); }
  17.808%, 35.377% { opacity:1; transform:none; }
  35.385%, 100% { opacity:0; transform:none; }
}
@keyframes rvTape3 {
  0%, 35.385% { clip-path:inset(-.3em 100% -.3em 0); animation-timing-function:steps(22, jump-end); }
  43%, 100% { clip-path:inset(-.3em 0 -.3em 0); }
}
@keyframes rvCurseur3 {
  0%, 35.377% { opacity:0; transform:translateX(-100%); }
  35.385% { opacity:1; transform:translateX(-100%); animation-timing-function:steps(22, jump-end); }
  43%, 93.838% { opacity:1; transform:none; }
  93.846%, 100% { opacity:0; transform:none; }
}
@keyframes rvCa1 {
  0%, 12.3% { opacity:1; }
  12.308%, 95.769% { opacity:0; }
  95.846%, 100% { opacity:1; }
}
@keyframes rvFocus {
  0%, 10% { opacity:0; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  11.923%, 18.846% { opacity:1; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  21.154%, 33.077% { opacity:0; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  35%, 44.231% { opacity:1; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  46.538%, 100% { opacity:0; }
}
@keyframes rvSouligne2 {
  0%, 18.462% { transform:scaleX(0); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  21.154%, 100% { transform:scaleX(1); }
}
@keyframes rvSouligne3 {
  0%, 43.846% { transform:scaleX(0); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  46.538%, 100% { transform:scaleX(1); }
}
@keyframes rvPuce2 {
  0%, 19.231% { opacity:0; transform:translateY(.35em) scale(.96); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  21.692%, 93.846% { opacity:1; transform:none; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  95.385%, 100% { opacity:0; transform:scale(.98); }
}
@keyframes rvPuce3 {
  0%, 44.615% { opacity:0; transform:translateY(.35em) scale(.96); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  47.077%, 93.846% { opacity:1; transform:none; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  95.385%, 100% { opacity:0; transform:scale(.98); }
}
@keyframes rvA {
  0%, 19.615% { opacity:1; transform:none; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  21% { opacity:0; transform:translateY(-45%); }
  95.385% { opacity:0; transform:translateY(-45%); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  98%, 100% { opacity:1; transform:none; }
}
@keyframes rvB {
  0%, 20% { opacity:0; transform:translateY(45%); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  22.462%, 45% { opacity:1; transform:none; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  46.385%, 100% { opacity:0; transform:translateY(-45%); }
}
@keyframes rvC {
  0%, 45.385% { opacity:0; transform:translateY(45%); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  47.846%, 93.846% { opacity:1; transform:none; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  95.231%, 100% { opacity:0; transform:translateY(45%); }
}
@keyframes rvZoom {
  0%, 19.231% { transform:none; animation-timing-function:cubic-bezier(0.77,0,0.175,1); }
  26.154%, 93.846% { transform:translate(19.33%,-13.72%) scale(4.4); animation-timing-function:cubic-bezier(0.77,0,0.175,1); }
  99.231%, 100% { transform:none; }
}
@keyframes rvFr {
  0%, 19.231% { opacity:1; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  24.231%, 93.846% { opacity:0; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  98.462%, 100% { opacity:1; }
}
@keyframes rvVo {
  0%, 21.538% { opacity:0; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  26.538%, 93.846% { opacity:1; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  96.154%, 100% { opacity:0; }
}
@keyframes rvGf {
  0%, 22.308% { opacity:0; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  26.923%, 45% { opacity:1; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  48.077%, 93.846% { opacity:.18; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  95.769%, 100% { opacity:0; }
}
@keyframes rvGr {
  0%, 45.769% { opacity:0; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  48.846%, 93.846% { opacity:1; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  95.769%, 100% { opacity:0; }
}
@keyframes rvOnde {
  0%, 46.154% { opacity:0; transform:scale(.6); }
  46.538% { opacity:.9; transform:scale(.6); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  55.385%, 100% { opacity:0; transform:scale(2.8); }
}
@keyframes rvFleche {
  0%, 48.846% { transform:none; animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  50.769% { transform:translateX(.3em); animation-timing-function:cubic-bezier(0.23,1,0.32,1); }
  53.462%, 100% { transform:none; }
}
