/* Restrained navigation: compact utility icons, quiet active state, and no glow-heavy animation. */
.hero-reference-nav nav { gap: 4px; }
.hero-reference-nav nav .nav-visual-link { display: inline-flex; align-items: center; gap: 6px; padding: 10px 9px; border: 1px solid transparent; border-radius: 5px; color: #dceaff !important; font-size: .71rem; font-weight: 700; line-height: 1; white-space: nowrap; }
.hero-reference-nav nav .nav-visual-link svg { width: 16px; height: 16px; fill: none; stroke: #83bfff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.hero-reference-nav nav .nav-visual-link:hover, .hero-reference-nav nav .nav-visual-link:focus-visible { border-color: rgba(121, 183, 255, .35); background: rgba(255, 255, 255, .06); color: #fff !important; outline: none; }
.hero-reference-nav nav .nav-visual-link.is-active { border-color: rgba(106, 177, 255, .42); background: rgba(24, 118, 234, .18); color: #fff !important; }
.hero-reference-nav nav .nav-visual-link.is-active svg { stroke: #b8e1ff; }
.hero-reference-nav nav .nav-visual-cta { display: inline-flex; align-items: center; gap: 10px; margin-left: 10px; padding: 12px 16px; border: 1px solid #4a9fff; border-radius: 5px; background: #126fe6; box-shadow: none; color: #fff !important; font-size: .72rem; font-weight: 800; white-space: nowrap; }
.hero-reference-nav nav .nav-visual-cta:hover, .hero-reference-nav nav .nav-visual-cta:focus-visible { background: #0b60d0; outline: 1px solid #a9d9ff; outline-offset: 2px; }
.hero-reference-nav nav .nav-visual-cta b { font-size: 1rem; }
@media (max-width: 1360px) { .hero-reference-nav nav { gap: 1px; } .hero-reference-nav nav .nav-visual-link { gap: 5px; padding: 9px 6px; font-size: .64rem; } .hero-reference-nav nav .nav-visual-link svg { width: 15px; height: 15px; } .hero-reference-nav nav .nav-visual-cta { gap: 7px; margin-left: 5px; padding: 11px 12px; font-size: .65rem; } }
@media (max-width: 1000px) { .hero-reference-nav nav .nav-visual-link span { display: none; } .hero-reference-nav nav .nav-visual-link { padding: 10px 8px; } }
@media (max-width: 800px) { .hero-reference-nav nav { gap: 0; } .hero-reference-nav nav .nav-visual-link { display: flex; align-items: center; gap: 11px; padding: 12px 5px; border: 0; border-bottom: 1px solid rgba(140,195,255,.18); border-radius: 0; font-size: .82rem; text-align: left; } .hero-reference-nav nav .nav-visual-link span { display: inline; } .hero-reference-nav nav .nav-visual-link svg { width: 19px; height: 19px; } .hero-reference-nav nav .nav-visual-link:hover, .hero-reference-nav nav .nav-visual-link.is-active { border-color: transparent; background: transparent; } .hero-reference-nav nav .nav-visual-cta { justify-content: center; margin: 14px 0 0; padding: 14px 18px; } }