.vcp-wizard {
    --vcp-colore-primario: #1c70c4;
    --vcp-colore-primario-attivo: #155ea8;
    --vcp-colore-primario-tenue: #eaf2fb;
    --vcp-colore-primario-velato: #f3f8fe;
    --vcp-colore-primario-alone: rgba(28, 112, 196, 0.12);
    --vcp-colore-primario-ombra: rgba(28, 112, 196, 0.3);
    --vcp-colore-primario-tratteggio: #b9cfe8;

    --vcp-colore-testo: var(--ink);
    --vcp-colore-testo-etichetta: var(--ink-label);
    --vcp-colore-testo-secondario: var(--ink-muted);
    --vcp-colore-testo-tenue: var(--ink-soft);
    --vcp-colore-segnaposto: var(--ink-placeholder);
    --vcp-colore-disattivato: #b9c8da;
    --vcp-colore-su-primario: #fff;

    --vcp-colore-sfondo: #f5f8fc;
    --vcp-colore-superficie: #fff;
    --vcp-colore-superficie-tenue: #f9fbfe;
    --vcp-colore-superficie-incassata: var(--hero-bg);
    --vcp-colore-superficie-riquadro: #f6f9fd;
    --vcp-colore-traccia: #eef3f9;
    --vcp-colore-traccia-avanzamento: #e9eff7;

    --vcp-colore-bordo: #e6edf6;
    --vcp-colore-bordo-campo: var(--field-border);
    --vcp-colore-bordo-forte: #c3d0e0;
    --vcp-colore-bordo-casella: #b9c8da;
    --vcp-colore-bordo-riquadro: #e1eaf5;
    --vcp-colore-separatore: #edf1f7;

    --vcp-colore-successo: #14804a;
    --vcp-colore-successo-sfondo: #e8f6ee;
    --vcp-colore-successo-velato: #f2fbf6;

    --vcp-colore-errore: #c62828;
    --vcp-colore-errore-bordo: #e57373;
    --vcp-colore-errore-alone: rgba(198, 40, 40, 0.12);
    --vcp-colore-errore-sfondo: #fdf1f1;
    --vcp-colore-errore-bordo-tenue: #f4c7c7;
    --vcp-colore-errore-testo-forte: #8e1c1c;

    --vcp-colore-avviso: #c77700;
    --vcp-colore-avviso-testo: #7a4b00;
    --vcp-colore-avviso-testo-tenue: #a35c00;
    --vcp-colore-avviso-sfondo: #fff7e8;
    --vcp-colore-avviso-sfondo-forte: #fff4e0;
    --vcp-colore-avviso-bordo: #f6dcaa;
    --vcp-colore-avviso-segno: #f5a623;

    --vcp-colore-ai: #5b3fd1;
    --vcp-colore-ai-sfondo: #f1ecff;
    --vcp-colore-ai-superficie: #faf8ff;
    --vcp-colore-ai-bordo: #d9cffa;
    --vcp-colore-ai-scheletro: #ece6fd;

    --vcp-colore-accento: #f5672b;
    --vcp-colore-accento-attivo: var(--color-cta-hover);
    --vcp-colore-accento-sfondo: #fff1ea;
    --vcp-colore-accento-ombra: rgba(245, 103, 43, 0.3);

    --vcp-colore-superficie-traslucida: rgba(255, 255, 255, 0.88);
    --vcp-colore-bordo-traslucido: rgba(15, 39, 71, 0.06);
    --vcp-colore-segmento-vuoto: #dde6f1;
    --vcp-sfocatura-barra: blur(18px) saturate(180%);
    --vcp-barra-laterale-larghezza: 17rem;
    --vcp-avanzamento-mini-larghezza: 5.25rem;
    --vcp-spaziatura-titolo: -0.02em;
    --vcp-spaziatura-maiuscolo: 0.08em;

    --vcp-colore-velo: rgba(15, 39, 71, 0.55);
    --vcp-colore-velo-finestra: rgba(15, 39, 71, 0.45);
    --vcp-colore-velo-foglio: rgba(15, 39, 71, 0.35);
    --vcp-colore-facebook: #0866ff;
    --vcp-opacita-disattivato: 0.55;

    --vcp-font: var(--font-family-base);
    --vcp-peso-normale: 400;
    --vcp-peso-medio: 500;
    --vcp-peso-semigrassetto: 600;
    --vcp-peso-grassetto: 700;

    --vcp-testo-11: 0.6875rem;
    --vcp-testo-12: 0.75rem;
    --vcp-testo-13: 0.8125rem;
    --vcp-testo-14: 0.875rem;
    --vcp-testo-15: 0.9375rem;
    --vcp-testo-16: 1rem;
    /* Safari su iPhone ingrandisce la pagina quando si tocca un campo con testo sotto i 16px. */
    --vcp-testo-campo: var(--vcp-testo-16);
    --vcp-testo-17: 1.0625rem;
    --vcp-testo-19: 1.1875rem;
    --vcp-testo-20: 1.25rem;
    --vcp-testo-22: 1.375rem;
    --vcp-testo-24: 1.5rem;
    --vcp-testo-28: 1.75rem;
    --vcp-testo-30: 1.875rem;

    --vcp-spaziatura-stretta: -0.01em;

    --vcp-interlinea-stretta: 1.25;
    --vcp-interlinea: 1.5;
    --vcp-interlinea-larga: 1.6;

    --vcp-spazio-2: 0.125rem;
    --vcp-spazio-3: 0.1875rem;
    --vcp-spazio-4: 0.25rem;
    --vcp-spazio-6: 0.375rem;
    --vcp-spazio-8: 0.5rem;
    --vcp-spazio-10: 0.625rem;
    --vcp-spazio-12: 0.75rem;
    --vcp-spazio-14: 0.875rem;
    --vcp-spazio-16: 1rem;
    --vcp-spazio-18: 1.125rem;
    --vcp-spazio-20: 1.25rem;
    --vcp-spazio-24: 1.5rem;
    --vcp-spazio-28: 1.75rem;
    --vcp-spazio-32: 2rem;
    --vcp-spazio-40: 2.5rem;
    --vcp-spazio-48: 3rem;

    --vcp-raggio-6: 0.375rem;
    --vcp-raggio-10: 0.625rem;
    --vcp-raggio-12: 0.75rem;
    --vcp-raggio-14: 0.875rem;
    --vcp-raggio-16: 1rem;
    --vcp-raggio-18: 1.125rem;
    --vcp-raggio-20: 1.25rem;
    --vcp-raggio-24: 1.5rem;
    --vcp-raggio-pillola: 999px;
    --vcp-raggio-cerchio: 50%;

    --vcp-bordo-sottile: 1px;
    --vcp-bordo-medio: 1.5px;
    --vcp-bordo-spesso: 2px;

    --vcp-altezza-34: 2.125rem;
    --vcp-altezza-36: 2.25rem;
    --vcp-altezza-38: 2.375rem;
    --vcp-altezza-40: 2.5rem;
    --vcp-altezza-44: 2.75rem;
    --vcp-altezza-48: 3rem;
    --vcp-altezza-52: 3.25rem;
    --vcp-altezza-68: 4.25rem;
    --vcp-altezza-area-testo: 12.5rem;

    --vcp-interruttore-larghezza: 3rem;
    --vcp-interruttore-altezza: 1.75rem;
    --vcp-interruttore-larghezza-compatta: 2.75rem;
    --vcp-interruttore-altezza-compatta: 1.625rem;
    --vcp-interruttore-margine: var(--vcp-spazio-3);
    --vcp-casella-lato: 1.25rem;
    --vcp-contatore-valore-larghezza: 1.75rem;
    --vcp-campo-larghezza-massima: 22.5rem;
    --vcp-pagina-larghezza-massima: 51.25rem;
    --vcp-finestra-larghezza-massima: 34rem;

    --vcp-ombra-anello-fuoco: 0 0 0 4px var(--vcp-colore-primario-alone);
    --vcp-ombra-anello-errore: 0 0 0 4px var(--vcp-colore-errore-alone);
    --vcp-ombra-selezione: 0 4px 12px var(--vcp-colore-primario-ombra);
    --vcp-ombra-pomello: 0 1px 4px rgba(0, 0, 0, 0.2);
    --vcp-ombra-icona: 0 2px 8px rgba(28, 112, 196, 0.1);
    --vcp-ombra-icona-media: 0 6px 18px rgba(28, 112, 196, 0.12);
    --vcp-ombra-icona-grande: 0 8px 22px rgba(28, 112, 196, 0.14);
    --vcp-ombra-scheda-scelta: 0 10px 28px rgba(28, 112, 196, 0.14);
    --vcp-ombra-rialzo: 0 4px 14px rgba(15, 39, 71, 0.1);
    --vcp-ombra-menu: 0 16px 40px rgba(15, 39, 71, 0.14);
    --vcp-ombra-barra: 0 -8px 24px rgba(15, 39, 71, 0.05);
    --vcp-ombra-finestra: 0 30px 80px rgba(15, 39, 71, 0.25);
    --vcp-ombra-invito: 0 8px 20px rgba(28, 112, 196, 0.28);
    --vcp-ombra-invito-accento: 0 8px 20px var(--vcp-colore-accento-ombra);

    --vcp-contorno-fuoco: 2px solid var(--vcp-colore-primario);
    --vcp-contorno-fuoco-distanza: 2px;

    --vcp-durata-rapida: 0.15s;
    --vcp-durata: 0.2s;
    --vcp-durata-lenta: 0.4s;
    --vcp-durata-scorrimento: 0.25s;
    --vcp-curva-scorrimento: cubic-bezier(0.3, 0, 0.2, 1);
    --vcp-durata-pulsazione: 1.4s;

    --vcp-livello-rialzato: 3;
    --vcp-livello-menu: 5;
    --vcp-livello-testata: 10;
    --vcp-livello-barra: 20;
    --vcp-livello-velo: 1000;
    --vcp-livello-finestra: 1010;
    --vcp-livello-notifica: 1020;

    /* Le media query non leggono le proprietà personalizzate: queste soglie
       valgono come riferimento e vanno ripetute per esteso in ogni @media. */
    --vcp-soglia-compatta: 576px;
    --vcp-soglia-colonne: 860px;
    --vcp-soglia-larga: 1100px;

    --vcp-classe-a4: #0a8f3c;
    --vcp-classe-a3: #2fa543;
    --vcp-classe-a2: #5bb846;
    --vcp-classe-a1: #8cc63f;
    --vcp-classe-b: #b5c72a;
    --vcp-classe-c: #e6b800;
    --vcp-classe-d: #f5a623;
    --vcp-classe-e: #ef7d22;
    --vcp-classe-f: #e5541b;
    --vcp-classe-g: #d32f2f;
    --vcp-classe-larghezza-minima: 2.875rem;

    --vcp-colore-bordo-invito: #c9daee;
    --vcp-colore-neutro-scelto: #8a9ab0;
    --vcp-spaziatura-maiuscole: 0.04em;
    --vcp-spaziatura-maiuscole-larga: 0.06em;
    --vcp-spaziatura-prezzo: -0.02em;
    --vcp-altezza-32: 2rem;
    --vcp-altezza-42: 2.625rem;
    --vcp-altezza-46: 2.875rem;
    --vcp-spazio-22: 1.375rem;
    --vcp-radio-lato: 1.375rem;
    --vcp-radio-punto: 0.625rem;
    --vcp-scheda-colonna-minima: 16.25rem;
    --vcp-sponsor-rientro: 3.25rem;
    --vcp-durata-rotazione: 0.9s;

    --vcp-griglia-colonna-minima: 100%;
    --vcp-scheda-margine: var(--vcp-spazio-16);
    --vcp-scheda-distanza: var(--vcp-spazio-16);
    --vcp-campi-distanza: var(--vcp-spazio-12);

    --vcp-colore-velo-chiaro: rgba(255, 255, 255, 0.55);
    --vcp-colore-velo-tenue: rgba(255, 255, 255, 0.4);
    --vcp-colore-traccia-velata: rgba(15, 39, 71, 0.12);
    --vcp-colore-errore-testo-tenue: #8e3a3a;
    --vcp-colore-errore-bordo-medio: #e9a6a6;
    --vcp-colore-mappa: #e6eef6;
    --vcp-colore-mappa-riga: #d9e4f0;
    --vcp-sfocatura-velo: blur(4px);
    --vcp-sfocatura-distintivo: blur(10px);
    --vcp-opacita-sollevato: 0.4;
    --vcp-opacita-da-eliminare: 0.45;
    --vcp-altezza-30: 1.875rem;
    --vcp-altezza-60: 3.75rem;
    --vcp-ombra-pulsante-riquadro: 0 2px 8px rgba(0, 0, 0, 0.12);
    --vcp-riquadro-media-proporzione: 4 / 3;
    --vcp-griglia-media-minima: 8.75rem;
    --vcp-mappa-altezza: 12.5rem;
    --vcp-mappa-maglia: 2.25rem;
    --vcp-menu-altezza-massima: 18rem;
    --vcp-miniatura-annuncio-larghezza: 4.5rem;
    --vcp-miniatura-annuncio-altezza: 3.5rem;
    --vcp-altezza-navbar-sito: 4.75rem;

    --vcp-colore-superficie-scura: #070b12;
    --vcp-colore-su-scuro: #fff;
    --vcp-colore-su-scuro-tenue: rgba(255, 255, 255, 0.72);
    --vcp-colore-controllo-su-scuro: rgba(255, 255, 255, 0.14);
    --vcp-colore-controllo-su-scuro-attivo: rgba(255, 255, 255, 0.28);
    --vcp-contorno-fuoco-su-scuro: 2px solid #fff;
    --vcp-colore-controllo-su-immagine: rgba(7, 11, 18, 0.72);
    --vcp-colore-controllo-su-immagine-attivo: rgba(7, 11, 18, 0.9);
    --vcp-ombra-controllo-su-immagine: 0 0 0 1px rgba(255, 255, 255, 0.55), 0 2px 10px rgba(7, 11, 18, 0.45);
    --vcp-ombra-fuoco-su-immagine: 0 0 0 4px var(--vcp-colore-superficie-scura);
}

@media (min-width: 860px) {
    .vcp-wizard {
        --vcp-testo-campo: var(--vcp-testo-15);
        --vcp-griglia-colonna-minima: 13.75rem;
        --vcp-scheda-margine: var(--vcp-spazio-24);
        --vcp-scheda-distanza: var(--vcp-spazio-20);
        --vcp-campi-distanza: var(--vcp-spazio-16);
        --vcp-griglia-media-minima: 9.375rem;
        --vcp-mappa-altezza: 17.5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vcp-wizard {
        --vcp-durata-rapida: 0s;
        --vcp-durata: 0s;
        --vcp-durata-lenta: 0s;
        --vcp-durata-scorrimento: 0s;
    }
}
