/* ===========================================================
   SECTION « L'expérience Road2Luxe » — pleine largeur
   =========================================================== */
.r2l-exp{
  --r2l-orange:#F55F2A;--r2l-black:#2C282A;--r2l-brown:#8B7355;
  --r2l-sand:#F7F3EE;--r2l-sand-2:#EDE6DB;
  --gap:clamp(20px,2.2vw,40px);
  /* Géométrie photo/widget : la réserve d'overflow de .r2l-exp__media en dérive. */
  --exp-photo-h:240px;   /* hauteur du cadre photo */
  --exp-widget-top:72px; /* offset du widget depuis le haut de la photo */
  --exp-widget-h:332px;  /* hauteur du widget (fixe, cf. .r2l-widget & co) */
  padding-top:clamp(56px,7vw,100px);padding-bottom:calc(var(--r2l-rythme-intra) / 2);background:var(--r2l-sand);color:var(--r2l-black);
}
.r2l-exp *{box-sizing:border-box}
/* Inset container partagé : header + 1re card démarrent sur la même
   ligne verticale. Rail full-bleed à droite (peek). */
.r2l-exp__inner{
  --inset:max(var(--r2l-gutter),calc((100% - var(--r2l-container)) / 2));
  max-width:none;margin:0;padding:0;
}

/* en-tête — aligné sur le container : titre au bord gauche, nav au bord droit */
.r2l-exp__head{max-width:var(--r2l-container-max);margin-inline:auto;padding-inline:var(--r2l-gutter);display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:clamp(32px,3.5vw,52px)}
.r2l-exp__title{font-family:var(--r2l-font-titres, inherit);font-size:clamp(30px,4.2vw,56px);line-height:1.04;font-weight:700;letter-spacing:-.01em;margin:0;max-width:16ch}
.r2l-exp__accent{color:var(--r2l-brown)}

/* piste scrollable */
.r2l-exp__track{
  display:flex;align-items:stretch;gap:var(--gap);
  list-style:none;margin:0;padding:4px 0 40px;
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-padding-inline-start:var(--inset);
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
  /* Fondu droite : la card qui pointe se dissout au lieu d'être coupée. */
  -webkit-mask-image:linear-gradient(to right,#000 0,#000 94%,transparent 100%);
  mask-image:linear-gradient(to right,#000 0,#000 94%,transparent 100%);
}
/* Espaceur fantôme : aligne la 1re card sur l'inset container.
   (padding-left avalé par Safari/Chrome sur un conteneur scrollable.) */
.r2l-exp__track::before{content:"";flex:0 0 max(0px,calc(var(--inset) - var(--gap)))}
/* Espaceur de fin : en bout de scroll, la dernière card sort du fondu droit
   (mask 94%→100%) au lieu de rester dissoute dessous. */
.r2l-exp__track::after{content:"";flex:0 0 clamp(28px,8vw,96px)}
.r2l-exp__track::-webkit-scrollbar{display:none}

/* carte — flex column, widget aligné en bas → hauteurs harmonisées.
   flex-basis EXTÉRIEURE only → peek ~2,4 cards (layout interne inchangé). */
.r2l-exp__card{
  flex:0 0 clamp(340px,34vw,500px);
  scroll-snap-align:start;
  display:flex;flex-direction:column;
}
.r2l-exp__num{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--r2l-brown);margin:0 0 12px}
.r2l-exp__card-title{font-family:var(--r2l-font-title, inherit);font-size:clamp(18px,1.35vw,22px);line-height:1.18;font-weight:700;letter-spacing:-.005em;color:var(--r2l-black);margin:0 0 10px}
.r2l-exp__card-desc{font-size:14px;line-height:1.5;color:var(--r2l-brown);margin:0 0 clamp(20px,2.5vw,32px);max-width:34ch;min-height:3em}

/* média : photo en flux normal, widget absolu par-dessus, débordement bas.
   Réserve = ce que le widget dépasse sous la photo + 50px de garde d'ombre. */
.r2l-exp__media{
  position:relative;margin-top:auto;
  padding-bottom:calc(var(--exp-widget-top) + var(--exp-widget-h) - var(--exp-photo-h) + 50px);
}
.r2l-exp__photo{
  position:relative;
  height:var(--exp-photo-h);border-radius:18px;overflow:hidden;
  background:linear-gradient(135deg,#cfc3b4,#9a8b7a);
  box-shadow:0 14px 30px -20px rgba(28,20,14,.5);
}
.r2l-exp__photo img{width:100%;height:100%;object-fit:cover;display:block}
.r2l-exp__widget-host{
  position:absolute;z-index:2;
  top:var(--exp-widget-top);
  left:50%;transform:translateX(-50%);
}

/* Fondu droite assuré par le mask-image du rail (.r2l-exp__track). */
.r2l-exp__track-wrap{position:relative}

@media (max-width:640px){
  .r2l-exp__head{flex-direction:column;align-items:flex-start}
  /* Respiration + peek carte suivante ~16 % → swipe instinctif, harmonisé avec « Nos voyages » (#31). */
  .r2l-exp{
    --gap:18px;--exp-card:84vw;
    /* Le widget occupe toute la largeur de carte : sans ces deux valeurs il ne
       resterait qu'un bandeau de photo trop fin au-dessus. Photo plus haute +
       widget descendu → la photo redevient lisible. */
    --exp-photo-h:320px;
    --exp-widget-top:150px;
  }
  .r2l-exp__card{flex-basis:var(--exp-card)}
  /* Flèches overlay masquées sur tactile : swipe manuel + peek suffisent. */
  .r2l-exp__nav{display:none}
  /* Widget calé sur la largeur réelle de la carte : le host prend toute la
     largeur (au lieu de sa largeur intrinsèque 332px) → plus de débordement
     sur la carte voisine. */
  .r2l-exp__widget-host{left:0;right:0;transform:none;display:flex;justify-content:center}
}


/* ===========================================================
   NAV carrousel
   =========================================================== */
.r2l-nav{display:flex;justify-content:flex-end;align-items:center;gap:10px}
.r2l-nav-btn{width:46px;height:46px;border-radius:50%;padding:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;background:#2C282A;color:#F7F3EE;border:1px solid #2C282A;transition:background .2s,color .2s,border-color .2s,opacity .2s,transform .12s}
.r2l-nav-btn svg{width:20px;height:20px;display:block}
.r2l-nav-btn:hover{background:#F55F2A;border-color:#F55F2A;color:#fff}
.r2l-nav-btn:active{transform:translateY(1px)}
.r2l-nav-btn:focus-visible{outline:2px solid #F55F2A;outline-offset:2px}
.r2l-nav-btn:disabled{opacity:.32;cursor:default;background:transparent;color:#2C282A;border-color:rgba(44,40,42,.3)}
.r2l-nav-btn:disabled:hover{background:transparent;color:#2C282A;border-color:rgba(44,40,42,.3)}

/* ===========================================================
   FLÈCHES EN OVERLAY — brique partagée des carrousels home (#31)
   Utilisée par « L'expérience » (.r2l-exp__nav) et « Nos voyages »
   (.r2l-voyages__nav). Chaque section n'ajoute que le positionnement
   (top/bottom/left/right). Jamais orange (charbon), lisible sur photo.
   =========================================================== */
.r2l-nav--overlay{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:4;
}
.r2l-nav--overlay .r2l-nav-btn{
  pointer-events:auto;
  /* liseré crème (fonds sombres) + liseré charbon externe + ombre (fonds clairs) */
  border-color:rgba(247,243,238,.38);
  box-shadow:0 0 0 1px rgba(44,40,42,.22),0 6px 20px rgba(44,40,42,.45);
}
.r2l-nav--overlay .r2l-nav-btn:hover{
  background:var(--r2l-charbon);
  border-color:rgba(247,243,238,.6);
  color:var(--r2l-sable-1);
  box-shadow:0 0 0 1px rgba(44,40,42,.22),0 8px 24px rgba(44,40,42,.5);
}
.r2l-nav--overlay .r2l-nav-btn:focus-visible{outline-color:var(--r2l-charbon)}
/* En bout de course : la flèche disparaît (plus propre qu'un cercle sur photo). */
.r2l-nav--overlay .r2l-nav-btn:disabled{opacity:0;pointer-events:none}

/* ===========================================================
   DRAG-TO-SCROLL — brique partagée (#31, piloté par main.js)
   =========================================================== */
@media (hover:hover) and (pointer:fine){
  .js-drag-scroll{cursor:grab}
  .js-drag-scroll.is-dragging{cursor:grabbing}
}
.js-drag-scroll.is-dragging{
  scroll-behavior:auto;
  scroll-snap-type:none;
  user-select:none;
}

/* Positionnement overlay propre à la section Expérience.
   Inset gauche calé sur le container (--inset), petit inset droit (peek). */
.r2l-exp__nav{
  top:0;
  bottom:40px; /* aligne le bas sur le padding-bottom du track → centrage sur les cartes */
  left:var(--inset);
  right:var(--r2l-gutter);
}


/* ===========================================================
   WIDGET 01 — « Tracé sélectionné »
   =========================================================== */
.r2l-widget{--r2l-orange:#F55F2A;--r2l-black:#2C282A;--r2l-sand-2:#EDE6DB;--r2l-brown:#8B7355;position:relative;width:332px;height:332px;max-width:100%;border-radius:15px;background:linear-gradient(180deg, rgba(255,253,251,.60) 0%, rgba(250,245,239,.50) 100%);-webkit-backdrop-filter:blur(22px) saturate(1.3);backdrop-filter:blur(22px) saturate(1.3);border:1px solid rgba(255,255,255,.55);box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 18px 40px -22px rgba(28,20,14,.50),0 4px 14px -8px rgba(28,20,14,.28);padding:18px;display:flex;flex-direction:column;gap:13px;overflow:hidden;animation:r2l-rise .8s cubic-bezier(.16,1,.3,1) both}
.r2l-widget *{box-sizing:border-box;margin:0;padding:0}
@keyframes r2l-rise{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
.r2l-widget .r2l-head{display:flex;align-items:center;justify-content:space-between}
.r2l-widget .r2l-label{font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--r2l-brown);display:flex;align-items:center;gap:8px}
.r2l-widget .r2l-pip{width:6px;height:6px;border-radius:50%;background:var(--r2l-orange);box-shadow:0 0 0 3px rgba(245,95,42,.16)}
.r2l-widget .r2l-tag{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:600;letter-spacing:.02em;color:var(--r2l-orange);background:rgba(245,95,42,.14);padding:5px 9px;border-radius:100px}
.r2l-widget .r2l-tag svg{width:11px;height:11px}
.r2l-widget .r2l-map{position:relative;flex:1;border-radius:11px;overflow:hidden;border:1px solid rgba(255,255,255,.5);background:linear-gradient(160deg, rgba(255,255,255,.34) 0%, rgba(245,238,228,.20) 100%);box-shadow:0 1px 0 rgba(255,255,255,.5) inset}
.r2l-widget .r2l-route{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.r2l-widget .r2l-route-base{fill:none;stroke:rgba(255,255,255,.6);stroke-width:7;stroke-linecap:round}
.r2l-widget .r2l-route-line{fill:none;stroke:var(--r2l-orange);stroke-width:2.6;stroke-linecap:round;stroke-dasharray:5 6;animation:r2l-flow 14s linear infinite}
@keyframes r2l-flow{to{stroke-dashoffset:-220}}
.r2l-widget .r2l-wp{fill:#fff;stroke:#c9b89f;stroke-width:1.5}
.r2l-widget .r2l-pin-start{fill:var(--r2l-black)}
.r2l-widget .r2l-pin-end{fill:var(--r2l-orange);stroke:#fff;stroke-width:2.5}
.r2l-widget .r2l-halo{fill:var(--r2l-orange);opacity:.18;transform-origin:center;animation:r2l-ping 2.4s ease-out infinite}
@keyframes r2l-ping{0%{transform:scale(.6);opacity:.35}70%,100%{transform:scale(1.9);opacity:0}}
.r2l-widget .r2l-lab{position:absolute;z-index:3;font-size:10px;font-weight:600;color:var(--r2l-black);background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:3px 8px;border-radius:7px;box-shadow:0 3px 10px rgba(44,40,42,.18);white-space:nowrap}
.r2l-widget .r2l-lab-start{left:14px;bottom:30px}
.r2l-widget .r2l-lab-end{right:12px;top:12px}
.r2l-widget .r2l-dist{position:absolute;z-index:3;left:50%;top:46%;transform:translate(-60%,-50%);display:flex;align-items:baseline;gap:3px;background:var(--r2l-black);color:#fff;padding:5px 10px;border-radius:8px;box-shadow:0 6px 16px rgba(44,40,42,.35)}
.r2l-widget .r2l-dist i{font-style:normal;font-size:11px;opacity:.7;margin-right:1px}
.r2l-widget .r2l-dist b{font-size:13px;font-weight:700}
.r2l-widget .r2l-dist span{font-size:9.5px;opacity:.75;letter-spacing:.03em}
.r2l-widget .r2l-stats{display:flex;align-items:stretch}
.r2l-widget .r2l-stat{flex:1;display:flex;flex-direction:column;gap:2px;padding:0 4px}
.r2l-widget .r2l-v{font-weight:700;font-size:26px;line-height:1;color:var(--r2l-black)}
.r2l-widget .r2l-v i{font-style:normal;font-size:.6em;color:var(--r2l-brown);vertical-align:.12em;margin-right:1px}
.r2l-widget .r2l-v em{font-style:normal;font-size:.7em;color:var(--r2l-orange)}
.r2l-widget .r2l-k{font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--r2l-brown);font-weight:600}
.r2l-widget .r2l-sep{width:1px;background:rgba(139,115,85,.22);margin:2px 0}
@media (prefers-reduced-motion: reduce){.r2l-widget .r2l-route-line,.r2l-widget .r2l-halo,.r2l-widget{animation:none !important}}


/* ===========================================================
   WIDGET 02 — « Clé en main »
   =========================================================== */
.r2l-logi{--r2l-or:#F55F2A;--r2l-ink:#F7F3EE;--r2l-muted:#C2A988;--r2l-line:rgba(247,243,238,.18);--r2l-node:rgba(255,255,255,.06);position:relative;width:332px;height:332px;max-width:100%;border-radius:15px;background:linear-gradient(155deg, rgba(54,50,49,.60) 0%, rgba(38,34,36,.48) 100%);-webkit-backdrop-filter:blur(16px) saturate(125%);backdrop-filter:blur(16px) saturate(125%);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 22px 50px -22px rgba(0,0,0,.55),0 6px 18px -10px rgba(0,0,0,.45);padding:18px;display:flex;flex-direction:column;overflow:hidden;animation:r2l-logi-rise .8s cubic-bezier(.16,1,.3,1) both}
.r2l-logi *{box-sizing:border-box;margin:0;padding:0}
@keyframes r2l-logi-rise{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
.r2l-logi .r2l-logi-head{display:flex;align-items:center;justify-content:space-between}
.r2l-logi .r2l-logi-label{font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--r2l-muted);display:flex;align-items:center;gap:8px}
.r2l-logi .r2l-logi-pip{width:6px;height:6px;border-radius:50%;background:var(--r2l-or);box-shadow:0 0 0 3px rgba(245,95,42,.22)}
.r2l-logi .r2l-logi-ring{position:relative;width:34px;height:34px;flex-shrink:0}
.r2l-logi .r2l-logi-ring svg{width:34px;height:34px;display:block}
.r2l-logi .r2l-logi-ring-bg{fill:none;stroke:var(--r2l-line);stroke-width:3}
.r2l-logi .r2l-logi-ring-fg{fill:none;stroke:var(--r2l-or);stroke-width:3;stroke-linecap:round;stroke-dasharray:82;stroke-dashoffset:82;transform:rotate(-90deg);transform-origin:center;animation:r2l-logi-ring 6s linear infinite both}
@keyframes r2l-logi-ring{0%,6%{stroke-dashoffset:82}50%,84%{stroke-dashoffset:0}90%,100%{stroke-dashoffset:82}}
.r2l-logi .r2l-logi-ring-check{position:absolute;inset:0;margin:auto;width:8px;height:8px;stroke:var(--r2l-or);stroke-width:2.8;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:scale(.4);animation:r2l-logi-rcheck 6s linear infinite both}
@keyframes r2l-logi-rcheck{0%,46%{opacity:0;transform:scale(.4)}52%,84%{opacity:1;transform:scale(1)}90%,100%{opacity:0;transform:scale(.4)}}
.r2l-logi .r2l-logi-list{position:relative;flex:1;display:flex;flex-direction:column;justify-content:space-between;padding:14px 0}
.r2l-logi .r2l-logi-track{position:absolute;left:11px;top:26px;bottom:26px;width:2px;background:var(--r2l-line);border-radius:2px}
.r2l-logi .r2l-logi-fill{position:absolute;left:11px;top:26px;bottom:26px;width:2px;background:var(--r2l-or);border-radius:2px;transform-origin:top;transform:scaleY(0);animation:r2l-logi-fill 6s linear infinite both}
@keyframes r2l-logi-fill{0%,6%{transform:scaleY(0)}50%,84%{transform:scaleY(1)}90%,100%{transform:scaleY(0)}}
.r2l-logi .r2l-logi-item{display:flex;align-items:center;gap:13px;position:relative;z-index:1}
.r2l-logi .r2l-logi-node{width:24px;height:24px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;background:var(--r2l-node);border:2px solid var(--r2l-line);animation:6s linear infinite both}
.r2l-logi .r2l-logi-check{width:12px;height:12px;stroke:#fff;stroke-width:2.8;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:scale(.4);animation:6s linear infinite both}
.r2l-logi .r2l-logi-txt{font-size:13px;font-weight:600;color:var(--r2l-ink);letter-spacing:.01em}
.r2l-logi .n1{animation-name:r2l-logi-n1}  .r2l-logi .m1{animation-name:r2l-logi-m1}
.r2l-logi .n2{animation-name:r2l-logi-n2}  .r2l-logi .m2{animation-name:r2l-logi-m2}
.r2l-logi .n3{animation-name:r2l-logi-n3}  .r2l-logi .m3{animation-name:r2l-logi-m3}
.r2l-logi .n4{animation-name:r2l-logi-n4}  .r2l-logi .m4{animation-name:r2l-logi-m4}
@keyframes r2l-logi-n1{0%,10%{background:var(--r2l-node);border-color:var(--r2l-line)}14%,84%{background:var(--r2l-or);border-color:var(--r2l-or)}90%,100%{background:var(--r2l-node);border-color:var(--r2l-line)}}
@keyframes r2l-logi-n2{0%,22%{background:var(--r2l-node);border-color:var(--r2l-line)}26%,84%{background:var(--r2l-or);border-color:var(--r2l-or)}90%,100%{background:var(--r2l-node);border-color:var(--r2l-line)}}
@keyframes r2l-logi-n3{0%,34%{background:var(--r2l-node);border-color:var(--r2l-line)}38%,84%{background:var(--r2l-or);border-color:var(--r2l-or)}90%,100%{background:var(--r2l-node);border-color:var(--r2l-line)}}
@keyframes r2l-logi-n4{0%,46%{background:var(--r2l-node);border-color:var(--r2l-line)}50%,84%{background:var(--r2l-or);border-color:var(--r2l-or)}90%,100%{background:var(--r2l-node);border-color:var(--r2l-line)}}
@keyframes r2l-logi-m1{0%,10%{opacity:0;transform:scale(.4) rotate(-10deg)}16%,84%{opacity:1;transform:scale(1) rotate(0)}90%,100%{opacity:0;transform:scale(.4)}}
@keyframes r2l-logi-m2{0%,22%{opacity:0;transform:scale(.4) rotate(-10deg)}28%,84%{opacity:1;transform:scale(1) rotate(0)}90%,100%{opacity:0;transform:scale(.4)}}
@keyframes r2l-logi-m3{0%,34%{opacity:0;transform:scale(.4) rotate(-10deg)}40%,84%{opacity:1;transform:scale(1) rotate(0)}90%,100%{opacity:0;transform:scale(.4)}}
@keyframes r2l-logi-m4{0%,46%{opacity:0;transform:scale(.4) rotate(-10deg)}52%,84%{opacity:1;transform:scale(1) rotate(0)}90%,100%{opacity:0;transform:scale(.4)}}
.r2l-logi .r2l-logi-foot{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--r2l-ink);padding-top:13px;border-top:1px solid var(--r2l-line)}
.r2l-logi .r2l-logi-dot{width:7px;height:7px;border-radius:50%;background:var(--r2l-or);flex-shrink:0;animation:r2l-logi-pulse 2.2s ease-in-out infinite}
@keyframes r2l-logi-pulse{0%,100%{box-shadow:0 0 0 0 rgba(245,95,42,.45)}50%{box-shadow:0 0 0 5px rgba(245,95,42,0)}}
@media (prefers-reduced-motion: reduce){.r2l-logi *{animation:none !important}.r2l-logi .r2l-logi-node{background:var(--r2l-or) !important;border-color:var(--r2l-or) !important}.r2l-logi .r2l-logi-check{opacity:1 !important;transform:none !important}.r2l-logi .r2l-logi-fill{transform:scaleY(1) !important}.r2l-logi .r2l-logi-ring-fg{stroke-dashoffset:0 !important}.r2l-logi .r2l-logi-ring-check{opacity:1 !important;transform:none !important}}


/* ===========================================================
   WIDGET 03 — « L'accompagnement » (le cortège)
   =========================================================== */
.r2l-acc{--r2l-orange:#F55F2A;--r2l-black:#2C282A;--r2l-sand-2:#EDE6DB;--r2l-brown:#8B7355;position:relative;width:332px;height:332px;max-width:100%;border-radius:15px;background:linear-gradient(180deg, rgba(255,253,251,.55) 0%, rgba(251,247,242,.42) 100%);-webkit-backdrop-filter:blur(16px) saturate(125%);backdrop-filter:blur(16px) saturate(125%);border:1px solid rgba(255,255,255,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 20px 44px -22px rgba(28,20,14,.45),0 5px 16px -10px rgba(28,20,14,.3);padding:18px;display:flex;flex-direction:column;gap:13px;overflow:hidden;animation:r2l-acc-rise .8s cubic-bezier(.16,1,.3,1) both}
.r2l-acc *{box-sizing:border-box;margin:0;padding:0}
@keyframes r2l-acc-rise{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
.r2l-acc .r2l-acc-head{display:flex;align-items:center;justify-content:space-between}
.r2l-acc .r2l-acc-label{font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--r2l-brown);display:flex;align-items:center;gap:8px}
.r2l-acc .r2l-acc-pip{width:6px;height:6px;border-radius:50%;background:var(--r2l-orange);box-shadow:0 0 0 3px rgba(245,95,42,.16)}
.r2l-acc .r2l-acc-chip{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:600;letter-spacing:.02em;color:var(--r2l-orange);background:rgba(245,95,42,.12);padding:5px 9px;border-radius:100px}
.r2l-acc .r2l-acc-chip svg{width:11px;height:11px}
.r2l-acc .r2l-acc-panel{position:relative;flex:1;border-radius:11px;overflow:hidden;border:1px solid rgba(255,255,255,.55);background:radial-gradient(120% 100% at 50% 45%, rgba(255,253,248,.55) 0%, rgba(239,230,216,.42) 60%, rgba(233,220,203,.38) 100%)}
.r2l-acc .r2l-acc-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.r2l-acc .r2l-acc-road{fill:rgba(255,255,255,.34);stroke:rgba(255,255,255,.5);stroke-width:1}
.r2l-acc .r2l-acc-lane{stroke:var(--r2l-orange);stroke-width:2.4;stroke-dasharray:6 9;stroke-linecap:round;opacity:.6;animation:r2l-acc-flow 3.4s linear infinite}
@keyframes r2l-acc-flow{to{stroke-dashoffset:-30}}
.r2l-acc .r2l-acc-convoy{transform-box:view-box;transform-origin:148px 130px;animation:r2l-acc-breathe 4.6s ease-in-out infinite}
@keyframes r2l-acc-breathe{0%,100%{transform:translateY(2px)}50%{transform:translateY(-3px)}}
.r2l-acc .r2l-acc-rider{fill:var(--r2l-black);stroke:#fff;stroke-width:2}
.r2l-acc .r2l-acc-lead{fill:var(--r2l-orange);stroke:#fff;stroke-width:2.4}
.r2l-acc .r2l-acc-halo{fill:var(--r2l-orange);opacity:.2;transform-box:view-box;transform-origin:148px 76px;animation:r2l-acc-ping 2.6s ease-out infinite}
@keyframes r2l-acc-ping{0%{transform:scale(.6);opacity:.34}70%,100%{transform:scale(2)}}
.r2l-acc .r2l-acc-lab{position:absolute;z-index:3;font-size:10px;font-weight:600;color:var(--r2l-black);background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);padding:3px 8px;border-radius:7px;box-shadow:0 3px 10px rgba(44,40,42,.16);white-space:nowrap}
.r2l-acc .r2l-acc-lab-lead{top:12px;left:50%;transform:translateX(-50%)}
.r2l-acc .r2l-acc-lab-group{left:50%;bottom:12px;transform:translateX(-50%)}
.r2l-acc .r2l-acc-foot{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--r2l-black);padding-top:13px;border-top:1px solid var(--r2l-sand-2)}
.r2l-acc .r2l-acc-dot{width:7px;height:7px;border-radius:50%;background:var(--r2l-orange);flex-shrink:0;animation:r2l-acc-pulse 2.2s ease-in-out infinite}
@keyframes r2l-acc-pulse{0%,100%{box-shadow:0 0 0 0 rgba(245,95,42,.4)}50%{box-shadow:0 0 0 5px rgba(245,95,42,0)}}
@media (prefers-reduced-motion: reduce){.r2l-acc *,.r2l-acc{animation:none !important}}


/* ===========================================================
   WIDGET 04 — « L'arc de la journée »
   =========================================================== */
.r2l-arc{--r2l-or:#F55F2A;--r2l-ink:#F7F3EE;--r2l-muted:#C2A888;--r2l-line:rgba(247,243,238,.16);position:relative;width:332px;height:332px;max-width:100%;border-radius:15px;background:linear-gradient(155deg, rgba(54,50,49,.60) 0%, rgba(38,34,36,.48) 100%);-webkit-backdrop-filter:blur(16px) saturate(125%);backdrop-filter:blur(16px) saturate(125%);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 22px 50px -22px rgba(0,0,0,.55),0 6px 18px -10px rgba(0,0,0,.45);padding:18px;display:flex;flex-direction:column;overflow:hidden;animation:r2l-arc-rise .8s cubic-bezier(.16,1,.3,1) both}
.r2l-arc *{box-sizing:border-box;margin:0;padding:0}
@keyframes r2l-arc-rise{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
.r2l-arc .r2l-arc-head{display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.r2l-arc .r2l-arc-label{font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--r2l-muted);display:flex;align-items:center;gap:8px}
.r2l-arc .r2l-arc-pip{width:6px;height:6px;border-radius:50%;background:var(--r2l-or);box-shadow:0 0 0 3px rgba(245,95,42,.22)}
.r2l-arc .r2l-arc-scene{position:relative;flex:1;margin:4px -2px}
.r2l-arc .r2l-arc-scene svg{display:block;width:100%;height:100%}
.r2l-arc .r2l-arc-track{fill:none;stroke:var(--r2l-line);stroke-width:8;stroke-linecap:round}
.r2l-arc .r2l-arc-band{fill:none;stroke:var(--r2l-or);stroke-opacity:.15;stroke-width:16;stroke-linecap:round}
.r2l-arc .r2l-arc-prog{animation:r2l-arc-prog 6s linear infinite both}
@keyframes r2l-arc-prog{0%{opacity:0}6%{opacity:1}88%{opacity:1}97%,100%{opacity:0}}
.r2l-arc .r2l-arc-draw{fill:none;stroke:url(#r2lArcGrad);stroke-width:8;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;animation:r2l-arc-draw 6s linear infinite both}
@keyframes r2l-arc-draw{0%{stroke-dashoffset:100}65%,100%{stroke-dashoffset:0}}
.r2l-arc .r2l-arc-marker{transform-box:view-box;transform-origin:0 0;animation:r2l-arc-travel 6s linear infinite both}
.r2l-arc .r2l-arc-m-halo{fill:var(--r2l-or);opacity:.35}
.r2l-arc .r2l-arc-m-dot{fill:#FFFBF6;stroke:var(--r2l-or);stroke-width:1.5}
@keyframes r2l-arc-travel{0%{transform:translate(40px,150px)}6.5%{transform:translate(45.4px,116px)}13%{transform:translate(61px,85.3px)}19.5%{transform:translate(85.3px,61px)}26%{transform:translate(116px,45.4px)}32.5%{transform:translate(150px,40px)}39%{transform:translate(184px,45.4px)}45.5%{transform:translate(214.7px,61px)}52%{transform:translate(239px,85.3px)}58.5%{transform:translate(254.6px,116px)}65%,100%{transform:translate(260px,150px)}}
.r2l-arc .r2l-arc-start{fill:rgba(247,243,238,.55)}
.r2l-arc .r2l-arc-step{fill:var(--r2l-ink);stroke:var(--r2l-muted);stroke-width:1.5}
.r2l-arc .r2l-arc-halte{fill:var(--r2l-or);stroke:#fff;stroke-width:2}
.r2l-arc .r2l-arc-halte-halo{fill:var(--r2l-or);transform-box:view-box;transform-origin:260px 150px;animation:r2l-arc-ping 6s ease-out infinite both}
@keyframes r2l-arc-ping{0%,56%{transform:scale(.5);opacity:0}66%{opacity:.5}100%{transform:scale(2.4);opacity:0}}
.r2l-arc .r2l-arc-split{stroke:rgba(255,253,248,.6);stroke-width:2.4;stroke-linecap:round}
.r2l-arc .r2l-arc-seg{font-size:11px;font-weight:700;letter-spacing:.14em}
.r2l-arc .r2l-arc-sub{font-size:9px;font-weight:600}
.r2l-arc .r2l-arc-foot{display:flex;align-items:center;gap:8px;flex-shrink:0;font-size:12.5px;font-weight:600;color:var(--r2l-ink);padding-top:13px;border-top:1px solid var(--r2l-line)}
.r2l-arc .r2l-arc-dot{width:7px;height:7px;border-radius:50%;background:var(--r2l-or);flex-shrink:0;animation:r2l-arc-pulse 2.2s ease-in-out infinite}
@keyframes r2l-arc-pulse{0%,100%{box-shadow:0 0 0 0 rgba(245,95,42,.45)}50%{box-shadow:0 0 0 5px rgba(245,95,42,0)}}
@media (prefers-reduced-motion: reduce){.r2l-arc *{animation:none !important}.r2l-arc .r2l-arc-prog{opacity:1 !important}.r2l-arc .r2l-arc-draw{stroke-dashoffset:0 !important}.r2l-arc .r2l-arc-marker{transform:translate(260px,150px) !important}.r2l-arc .r2l-arc-halte-halo{opacity:0 !important}}