 /* ===== Legal menu styles ===== */

 /* Position the small legal bar in the top-right corner */
 .legal-bar {
     position: fixed;
     top: 16px;
     right: 16px;
     z-index: 50;
     /* stays above background effects */
     padding: 6px 8px;
     color: #e5e7eb;
 }

 /* Horizontal list of links */
 .legal-nav {
     display: inline-flex;
     gap: 1.1rem;
 }

 /* Individual link look */
 .legal-link {
     font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
     font-weight: 600;
     letter-spacing: 0.04em;
     text-transform: uppercase;
     font-size: clamp(0.72rem, 0.7rem + 0.25vw, 0.9rem);
     color: #a8b0bb;
     text-decoration: none;
     position: relative;
     padding: 8px 2px;
     /* touch target without looking bulky */
     transition: color 180ms ease, opacity 180ms ease;
     opacity: 0.95;
 }

 /* Underline reveal on hover/focus */
 .legal-link::after {
     content: "";
     position: absolute;
     left: 0;
     right: 0;
     bottom: 6px;
     height: 1px;
     background: linear-gradient(90deg, transparent, rgba(190, 230, 255, 0.8), transparent);
     transform: scaleX(0.25);
     transform-origin: center;
     opacity: 0;
     transition: transform 220ms ease, opacity 220ms ease;
 }

 /* Hover & focus visuals */
 .legal-link:hover {
     color: #d3e7ff;
     opacity: 1;
 }

 .legal-link:focus-visible {
     outline: none;
     color: #e7f3ff;
     opacity: 1;
     box-shadow: 0 0 0 2px rgba(130, 200, 255, 0.45);
     border-radius: 6px;
 }

 .legal-link:hover::after,
 .legal-link:focus-visible::after {
     opacity: 1;
     transform: scaleX(1);
 }

 /* Optional: compact spacing on very small screens */
 @media (max-width: 420px) {
     .legal-bar {
         top: 12px;
         right: 12px;
         padding: 4px 6px;
     }

     .legal-nav {
         gap: 0.8rem;
     }
 }