/* Espoir Citoyen Mag V7.11 — « Autour de vous » : ce que le radar a recoupé près du visiteur, sans compte. Jamais « Vérifié ». */
.atoi{background:linear-gradient(180deg,var(--papier) 0%,#fff 100%)}
.atoi .sh{align-items:flex-end}
.atoi .sh h2{font-size:clamp(2.2rem,5.4vw,5rem);line-height:.92}
.atoi .sh h2 em{display:block;font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--bleu)}
.atoi-n{font-variant-numeric:tabular-nums}
.atoi-cote{display:grid;gap:.8rem;justify-items:start;max-width:24rem}
.atoi-pouls{display:inline-flex;align-items:center;gap:.55rem;font-size:.92rem;color:var(--encre2);min-height:1.5em}
.atoi-pouls i{flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:var(--rouge);box-shadow:0 0 0 0 rgba(240,72,78,.5);animation:atoip 1.8s infinite}
@keyframes atoip{70%{box-shadow:0 0 0 9px rgba(240,72,78,0)}100%{box-shadow:0 0 0 0 rgba(240,72,78,0)}}
.atoi-lieu{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.9rem;color:var(--gris)}
.atoi-lieu select{min-height:44px;padding:.45rem 2.2rem .45rem .9rem;border-radius:999px;border:0;background:var(--blanc) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23070A18' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat right .9rem center;-webkit-appearance:none;appearance:none;box-shadow:inset 0 0 0 1.5px var(--filet);font:600 .9rem var(--sans);color:var(--encre);cursor:pointer}
.atoi-lieu select:focus-visible{outline:3px solid var(--bleu);outline-offset:2px}
.atoi-cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px;align-items:start}
.atoi .vf-c{border-left-color:var(--filet);transition:transform .5s var(--ease,cubic-bezier(.2,.7,.2,1)),box-shadow .5s}
.atoi .vf-c.chez{border-left-color:var(--bleu)}
.atoi .vf-c:hover{transform:translateY(-3px);box-shadow:0 1px 0 var(--filet),0 26px 50px -30px rgba(7,10,24,.45)}
.atoi-pq{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px;padding:.32rem .7rem;background:var(--filet2);color:var(--encre2);font:600 .78rem var(--sans)}
.atoi-pq.chez{background:var(--bleup);color:var(--bleu3)}
.atoi-pq.chez::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--bleu)}
.atoi-rc{border-radius:7px;padding:.28rem .5rem;background:var(--ambrep);color:#6E4300;box-shadow:inset 0 0 0 1.5px rgba(230,138,0,.35);font:700 .66rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.atoi .vf-pts i{background:var(--gris2)}
.atoi .vf-c.chez .vf-pts i{background:var(--bleu)}
.atoi-quand{margin:.5rem 0 0;font-size:.8rem;color:var(--gris)}
.atoi-pied{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem;margin-top:1.6rem}
.atoi-note{max-width:40em;margin:0;font-size:.88rem;color:var(--gris)}
.atoi-vide{padding:1.2rem 0;color:var(--gris)}
.atoi .cache-a{opacity:0;transform:translateY(18px)}
.atoi .vu-a{opacity:1;transform:none;transition:opacity .7s ease,transform .7s var(--ease,cubic-bezier(.2,.7,.2,1));transition-delay:calc(var(--i,0)*90ms)}
/* le repère « Autour de vous » dans l'image d'accueil (fond nuit) */
.atoi-pill{display:inline-flex;align-items:center;gap:.6rem;max-width:min(100%,34rem);margin-bottom:1rem;padding:.6rem 1rem .6rem .8rem;border-radius:999px;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;text-decoration:none;font:500 .9rem/1.3 var(--sans);transition:background .3s}
.atoi-pill:hover{background:rgba(255,255,255,.18)}
.atoi-pill i{flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:var(--jaune);box-shadow:0 0 0 0 rgba(255,212,59,.6);animation:atoip2 1.8s infinite}
.atoi-pill b{font-weight:700}
.atoi-pill span{min-width:0}
@keyframes atoip2{70%{box-shadow:0 0 0 9px rgba(255,212,59,0)}100%{box-shadow:0 0 0 0 rgba(255,212,59,0)}}
@media (prefers-reduced-motion:reduce){.atoi-pouls i,.atoi-pill i{animation:none}.atoi .cache-a{opacity:1;transform:none}.atoi .vf-c{transition:none}}
@media (max-width:520px){.atoi-pill{font-size:.84rem}.atoi .sh h2{font-size:clamp(2rem,9vw,2.6rem)}}
.h-g{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
