/* Boostr v2 — cadran (arc + étapes) partagé : process /offres, assistant /reserver */
.dial-arc { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; overflow: visible; }
.dial-arc circle { fill: none; stroke: rgba(255, 255, 255, .28); stroke-width: 1.2; }
.dial-layer { --dial-node: 44px; position: absolute; left: 0; top: 0; width: 0; height: 0; z-index: 2; }
.dial-dot { position: absolute; left: 0; top: 0; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 5px; background: var(--white); will-change: transform; pointer-events: none; }
.dial-badge, .dial-label { position: absolute; left: 0; top: 0; will-change: transform, opacity; }
.dial-badge { width: 0; height: 0; }
.dial-btn, .dial-ring { position: absolute; left: calc(var(--dial-node) / -2); top: calc(var(--dial-node) / -2); width: var(--dial-node); height: var(--dial-node); border-radius: 50%; }
.dial-btn { border: 1px solid rgba(255, 255, 255, .35); background: var(--ink); color: var(--white); font-family: var(--font-body); font-size: 13px; line-height: 1; display: flex; align-items: center; justify-content: center; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: box-shadow .25s, border-color .25s, background-color .25s; }
/* Zone tactile ≥ 44 px même quand le disque visible est plus petit (téléphone : 38 px) */
.dial-btn::before { content: ""; position: absolute; inset: min(-3px, calc((var(--dial-node) - 44px) / 2)); border-radius: 50%; }
.dial-btn:hover, .dial-btn:active, .dial-btn:focus-visible { box-shadow: 0 0 0 6px rgba(44, 131, 255, .3); border-color: var(--blue) !important; background: var(--blue); outline: none; }
.dial-ring { border: 1.5px solid var(--blue); pointer-events: none; opacity: 0; }
.dial-badge.is-active .dial-ring { animation: dialRing 1.43s linear infinite; }
.dial-label { white-space: nowrap; font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; color: var(--slate); pointer-events: none; }
.dial-vline { position: absolute; left: calc(50% - 1px); top: 0; width: 2px; height: 0; transform: scaleY(0); transform-origin: 50% 0; background: var(--white); z-index: 1; pointer-events: none; }
@keyframes dialRing { from { transform: scale(1); opacity: .8; } to { transform: scale(1.9); opacity: 0; } }
@media (max-width: 860px) {
  .dial-layer { --dial-node: 38px; }
  .dial-btn { font-size: 12px; }
  .dial-label { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .dial-badge.is-active .dial-ring { animation: none; opacity: .6; }
}