/* Home page floating section rail (frontend/includes/section-rail.blade.php).
   Dots on the right edge; each dot's label slides out on its own hover/focus. Desktop only. */
.sr { position: fixed; right: 20px; top: 50%; transform: translateY(-50%); z-index: 400;
  display: none; flex-direction: column; align-items: flex-end; }
@media (min-width: 1200px) { .sr { display: flex; } }

.sr-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.sr-item { display: flex; align-items: center; justify-content: flex-end; gap: 12px; height: 34px; padding: 0 8px;
  text-decoration: none; color: var(--navy); }
.sr-item:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; border-radius: 999px; }

.sr-lbl { font-family: var(--font-b); font-size: .8rem; font-weight: 600; white-space: nowrap; padding: .35rem .8rem;
  border-radius: 999px; background: #fff; color: var(--navy); box-shadow: 0 6px 18px -8px rgba(26,23,78,.45);
  opacity: 0; transform: translateX(8px); pointer-events: none; transition: opacity .2s, transform .2s; }
/* only the hovered (or keyboard-focused) dot shows its label */
.sr-item:hover .sr-lbl, .sr-item:focus-visible .sr-lbl { opacity: 1; transform: none; }
.sr-item.is-active .sr-lbl { background: var(--navy); color: #fff; }

.sr-dot { flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: #BFBBD6; transition: all .2s; }
.sr-item:hover .sr-dot { background: var(--navy); }
.sr-item.is-active .sr-dot { width: 14px; height: 14px; background: var(--orange); box-shadow: 0 0 0 5px rgba(243,117,42,.18); }

/* over the dark hero / footer */
.sr.sr-on-dark .sr-dot { background: rgba(255,255,255,.55); }
.sr.sr-on-dark .sr-item:hover .sr-dot { background: #fff; }
.sr.sr-on-dark .sr-item.is-active .sr-dot { background: var(--orange); box-shadow: 0 0 0 5px rgba(243,117,42,.3); }

@media (prefers-reduced-motion: reduce) { .sr-lbl, .sr-dot { transition: none; } }
@media print { .sr { display: none !important; } }