/* Fase 24H - Navigazione rapida schede progetto
   Obiettivo: sotto ai pulsanti principali aggiungere collegamenti rapidi alle sezioni della form.
   Nessuna logica applicativa: solo usabilità e layout. */

html {
    scroll-behavior: smooth;
}

body.p22v-project .section-card,
body.p22v-project #section-technical-live {
    scroll-margin-top: 96px;
}

body.p22v-project .p24h-section-jump-card {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    padding: 12px 14px !important;
    border: 1px solid #cfe0ef !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #f8fbff 0%, #eef7ff 100%) !important;
    box-shadow: 0 10px 24px rgba(32, 70, 115, .055) !important;
    box-sizing: border-box !important;
}

body.p22v-project .p24h-section-jump-title {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 30px !important;
    padding: 5px 9px !important;
    border-radius: 999px !important;
    background: #e0edff !important;
    color: #174a83 !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
    white-space: nowrap !important;
}

body.p22v-project .p24h-section-jump-links {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    flex: 1 1 520px !important;
}

body.p22v-project .p24h-jump-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    border: 1px solid #c7d9ea !important;
    background: #ffffff !important;
    color: #23384d !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: 0 6px 14px rgba(32, 70, 115, .045) !important;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease !important;
}

body.p22v-project .p24h-jump-btn:hover,
body.p22v-project .p24h-jump-btn:focus-visible {
    background: #f5fbff !important;
    border-color: #91b7dc !important;
    color: #102d4a !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 9px 20px rgba(32, 70, 115, .08) !important;
    outline: none !important;
}

body.p22v-project .p24h-jump-primary {
    border-color: #7cc9bd !important;
    background: #e4f8f4 !important;
    color: #075f52 !important;
}

body.p22v-project .p24h-jump-primary:hover,
body.p22v-project .p24h-jump-primary:focus-visible {
    border-color: #4fb3a5 !important;
    background: #d6f3ed !important;
    color: #064d44 !important;
}

@media (max-width: 900px) {
    body.p22v-project .p24h-section-jump-card {
        align-items: stretch !important;
    }
    body.p22v-project .p24h-section-jump-title {
        width: 100% !important;
        justify-content: center !important;
    }
    body.p22v-project .p24h-section-jump-links {
        flex: 1 1 100% !important;
    }
    body.p22v-project .p24h-jump-btn {
        flex: 1 1 calc(50% - 8px) !important;
    }
}

@media (max-width: 560px) {
    body.p22v-project .p24h-jump-btn {
        flex-basis: 100% !important;
        width: 100% !important;
    }
}