/* Navegação lateral entre seções */
.section-nav {
    position: fixed;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 900;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 6px;
    background: rgba(255, 255, 255, .85);
    backdrop-filter: blur(6px);
    border-radius: 24px;
    box-shadow: 0 4px 18px rgba(34, 58, 102, .15);
}

.section-nav button,
.section-nav a {
    position: relative;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--secondary-color, #223a66);
    font-size: 12px;
}

.section-nav .dot::before {
    content: '';
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #b9c6df;
    transition: transform .2s, background .2s;
}

.section-nav .dot:hover::before { background: var(--secondary-color, #223a66); transform: scale(1.3); }
.section-nav .dot.active::before { background: var(--primary-color, #F03E42); transform: scale(1.5); }

.section-nav .dot span {
    position: absolute;
    right: 32px;
    white-space: nowrap;
    padding: 4px 10px;
    border-radius: 6px;
    background: var(--secondary-color, #223a66);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s;
}

.section-nav .dot:hover span,
.section-nav .dot:focus-visible span { opacity: 1; }

.section-nav .arrow:hover { color: var(--primary-color, #F03E42); }
.section-nav button:focus-visible { outline: 2px solid var(--primary-color, #F03E42); border-radius: 50%; }

@media (max-width: 991px) {
    .section-nav { display: none; }
}