/* =========================================================================
   WEBCRAFT — logo-net.css · 23/10/2026 · Hugo
   Logo du rail : le logo de la charte, PARFAITEMENT PLAT et blanc (logo-white
   de la charte, aucune texture, aucun bombé) + UNE seule touche de matière :
   la pastille du symbole, traitée en vraie bille de mercure (image matiere,
   sphère chromée avec reflet et ombre) posée exactement sur le point, et un
   reflet lent qui tourne dessus. Forme et proportions du logo : intactes.
   ========================================================================= */

/* ---------- 1. Le conteneur : aucune matière autour ---------- */
aside.rail .rail__marque,
.rail .rail__marque{
  position:relative!important;
  display:block!important;
  width:190px!important;
  max-width:190px!important;
  margin:0 0 clamp(16px,2.8vh,28px)!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  overflow:visible!important;
}
aside.rail .rail__marque::before,
aside.rail .rail__marque::after,
.rail .rail__marque::before,
.rail .rail__marque::after{content:none!important;display:none!important}

/* ---------- 2. Le logo plat ---------- */
aside.rail .rail__logo,
.rail .rail__logo{
  position:relative!important;
  display:block!important;
  width:190px!important;
  max-width:100%!important;
  line-height:0!important;
  isolation:isolate;
}
aside.rail .rail__logo-plat,
.rail .rail__logo-plat{
  display:block!important;
  width:190px!important;
  max-width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
  filter:none!important;
  opacity:1!important;
  position:relative!important;
  z-index:1;
}
aside.rail .rail__logo-alt,
.rail .rail__logo-alt{
  position:absolute!important;
  width:1px!important;height:1px!important;
  overflow:hidden!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
}

/* ---------- 3. La bille de mercure, posée sur le point du symbole -------
   Repères mesurés sur le PNG de la charte (898 × 138) :
   le point est le centre du disque du symbole, à x ≈ 137 px, y ≈ 69 px,
   diamètre ≈ 52 px. En % de la largeur (190 px affichés) :
   left ≈ 15,25 %  ·  top ≈ 50 %  ·  diamètre ≈ 11,6 % de la largeur.
   On pose la BILLE (image transparente recadrée) exactement dessus : elle
   recouvre le point plat, la forme du logo n'est pas modifiée.            */
aside.rail .rail__logo-bille,
.rail .rail__logo-bille{
  position:absolute!important;
  left:15.25%!important;
  top:50%!important;
  width:11.9%!important;
  aspect-ratio:1/1!important;
  height:auto!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  background-image:url("images/bille-chrome.png");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  z-index:2;
  pointer-events:none;
  /* ombre portée sous la bille : elle décolle du logo */
  filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.55));
}
/* Reflet lent qui tourne sur la bille : un mince éclat qui balaie la sphère. */
aside.rail .rail__logo-bille::after,
.rail .rail__logo-bille::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  border-radius:50%!important;
  background:linear-gradient(115deg,
    rgba(255,255,255,0) 38%,
    rgba(255,255,255,.85) 47%,
    rgba(255,255,255,0) 57%);
  mix-blend-mode:screen;
  animation:railBilleReflet 6.5s linear infinite;
}
@keyframes railBilleReflet{
  0%{transform:rotate(0deg) scale(1.35);opacity:0}
  8%{opacity:.9}
  50%{opacity:.9}
  62%{opacity:0}
  100%{transform:rotate(360deg) scale(1.35);opacity:0}
}
@media (prefers-reduced-motion:reduce){
  aside.rail .rail__logo-bille::after,.rail .rail__logo-bille::after{animation:none!important;opacity:0!important}
}

/* ---------- 4. « Poitiers » sous le logo ---------- */
aside.rail .rail__lieu,.rail .rail__lieu{display:block!important;margin-top:10px!important}