/**
 * Widget: structure|content-secondary-v02
 * Sezione centrata: stelle + testo che passa da #3D3D3D66 a #3D3D3DFF parola per parola allo scroll.
 * Senza JS (o con prefers-reduced-motion) il testo è a colore pieno.
 * Tutte le regole scopate sotto .structure-content-secondary-v02.
 */

.structure-content-secondary-v02 {
    display: block;
    background: var(--website-color-light, #FFFAF0);
    padding: clamp(40px, 7vw, 96px) 0;
}
.structure-content-secondary-v02 .structure-content-secondary-v02-inner {
    max-width: 828px;
    margin: 0 auto;
    padding: 0 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(18px, 2.4vw, 28px);
}

/* Stelle */
.structure-content-secondary-v02 .structure-content-secondary-v02-stars {
    display: inline-flex;
    gap: 2px;
    color: var(--website-color-txt-title, #3D3D3D);
}
.structure-content-secondary-v02 .structure-content-secondary-v02-star { display: block; }

/* Testo */
.structure-content-secondary-v02 .structure-content-secondary-v02-text {
    margin: 0;
    text-align: center;
    text-transform: uppercase;
    font-weight: 400;
    font-size: clamp(1.35rem, 2.4vw, 1.875rem);
    line-height: 1.2;
    color: var(--website-color-txt-title, #3D3D3D);
}

/* Effetto scroll: attivo solo quando il JS aggiunge .is-scroll-reveal */
.structure-content-secondary-v02 .structure-content-secondary-v02-text.is-scroll-reveal .structure-content-secondary-v02-word {
    color: rgba(61, 61, 61, 0.4); /* #3D3D3D66 */
    transition: color .25s ease;
}
.structure-content-secondary-v02 .structure-content-secondary-v02-text.is-scroll-reveal .structure-content-secondary-v02-word.is-active {
    color: var(--website-color-txt-title, #3D3D3D); /* #3D3D3DFF */
}
