p.overtitle, h1.titleHero, p.textHero, p.textIndicatore, p.score, p.nps, li.itemNPS, p.lastUpdate, h2.titleOpinione, p.textOpinione, p.textSocial, p.textRacconta, a.btnRacconta {
    font-family: 'news-gothic-std', sans-serif;
}
p.overtitle {
    color: #EE7D11;
}
h1.titleHero, h2.subtitleHero, p.textHero, p.nps, li.itemNPS, p.lastUpdate, h2.titleOpinione, p.textOpinione, p.textSocial, p.textRacconta{
    color: #1A317F;
}
p.textHero{
    font-weight: 100;
}
.gridHero > div:first-child > p:last-child, p.textIndicatore, p.score, p.lastUpdate, p.textOpinione:last-child, p.textSocial, p.textRacconta{
    margin: 0;
}
.indicatore{
    background: #003883;
}
.innerIndicatore, .gridRacconta{
    margin: auto;
}
p.textIndicatore{
    color: white;
}
.gridPunteggio, .gridOpinione, .listSocial, .iconTextSocial, .gridRacconta{
    display: flex;
}
.circle{
    border: 3px solid #28BF91;
    border-radius: 50%;
    background: rgb(255 255 255 / 77%);
}
p.score{
   color: #28BF91; 
   display: flex;
   height: 100%;
   width: 100%;
   align-items: center;
   justify-content: center;
}
ul.listNPS{
    list-style: none;
    padding: 0;
}
.opinione {
    position: relative;
}
.triangolo {
    background-color: #ededed;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
    position: absolute;
    top: -1px;
}
.listSocial {
    flex-direction: column;
}
.rowSocial {
    border: 3px solid #003883;
}
.iconTextSocial {
    align-items: center;
}
img.iconOpinione {
    height: auto;
}
.racconta{
    background-color: #ededed;
}
a.btnRacconta {
    background: #28BF91;
    border: 3px solid #28BF91;
    text-decoration: none;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}
a.btnRacconta:hover{
   background: transparent; 
   color: #28BF91;
}
@media (max-width: 550px){
    .gridHero > .colHero:first-child, .indicatore, .punteggio{
        padding: 10vw 5vw 10vw 10vw;
    }
    p.overtitle, p.lastUpdate, p.textSocial, a.btnRacconta{
        font-size: 3.6vw;
    }
    h1.titleHero{
        font-size: 11vw;
        line-height: 11vw;
    }
    h1.titleHero, .gridHero > .colHero:first-child > p:nth-of-type(2), p.nps, ul.listNPS, h2.titleOpinione, p.textOpinione:first-of-type{
        margin: 0 0 7vw;
    }
    p.textHero, p.nps, li.itemNPS{
        font-size: 7.3vw;
    }
    p.textHero {
        line-height: 8.4vw;
    }
    .gridHero > .colHero:nth-child(2){
        background: url('/media/heroNPS550.webp');
        height: calc(100vw / (550 / 430));
    }
    p.textIndicatore {
        font-size: 8.2vw;
        line-height: 9vw;
    }
    .gridPunteggio, .gridOpinione, .gridRacconta {
        grid-gap: 10vw;
    }    
    p.score {
        font-size: 19.7vw;
    }
    .triangolo {
        width: 28.4vw;
        height: 14.2vw;
    }
    .gridOpinione > div:first-child{
        padding: 20vw 6vw 0 10vw;
    }
    h2.titleOpinione{
        font-size: 10vw;
        line-height: 10vw;
    }
    p.textOpinione, p.textRacconta {
        font-size: 5.45vw;
    }
    p.textOpinione {
        width: 77vw;
    }
    .gridOpinione > div:nth-child(2){
        padding: 0 10vw 10vw 10vw;
    }
    .listSocial {
        grid-gap: 4vw;
    }
    .rowSocial {
        padding: 3vw 4vw;
        border-radius: 10vw;
    }
    .iconTextSocial {
        grid-gap: 3vw;
    }
    img.iconOpinione{
        width: 10vw;
    }
    p.textSocial {
        width: 45vw;
    }
    a.btnRacconta {
        height: 15vw;
        border-radius: 8vw;
    }
}
@media (min-width: 551px) and (max-width: 766.9px){
    .gridHero > .colHero:first-child, .indicatore, .punteggio{
        padding: 10vw;
    }
    p.overtitle, p.lastUpdate, p.textSocial, a.btnRacconta{
        font-size: 2.6vw;
    }
    h1.titleHero{
        font-size: 8.54vw;
        line-height: 8.54vw;
        width: 55vw;
        margin: 0 0 5vw;
    }
    p.textHero, p.nps, li.itemNPS{
        font-size: 5.3vw;
    }
    p.textHero {
        line-height: 6.5vw;
        width: 64vw;
    }
    .gridHero > .colHero:first-child > p:nth-of-type(2){
        margin: 0 0 5vw;
    }
    .gridHero > .colHero:nth-child(2){
        background: url('/media/heroNPS551.webp');
        height: calc(100vw / (750 / 586));
    }
    p.textIndicatore {
        font-size: 5.9vw;
        line-height: 7.4vw;
    }
    .gridPunteggio, .gridOpinione, .gridRacconta {
        grid-gap: 8vw;
    }    
    p.score {
        font-size: 19.7vw;
    }
    p.nps {
        margin: 0 0 6vw;
    }
    ul.listNPS {
        margin: 0 0 4vw;
    }
    .opinione{
        padding: 15vw 10vw 10vw;
    }
    .triangolo {
        width: 20.4vw;
        height: 10.2vw;
    }
    h2.titleOpinione{
        font-size: 7.2vw;
        line-height: 7.2vw;
        margin: 0 0 5vw;
    }
    p.textOpinione, p.textRacconta {
        font-size: 3.9vw;
    }
    p.textOpinione {
        width: 70vw;
    }
    p.textOpinione:first-of-type {
        margin: 0 0 5vw;
    }
    .listSocial {
        grid-gap: 3vw;
    }
    .rowSocial {
        padding: 2vw 3vw;
        border-radius: 6vw;
    }
    .iconTextSocial {
        grid-gap: 2vw;
    }
    img.iconOpinione{
        width: 7vw;
    }
    a.btnRacconta {
        height: 10vw;
        border-radius: 6vw;
    }
}
@media (max-width: 766.9px){
    .gridHero > .colHero:nth-child(2){
        background-size: contain;
    }
    .punteggio{
        background: #ededed;
    }
    .gridPunteggio, .gridOpinione, .gridRacconta {
        flex-direction: column;
    }
    .colPunteggio:first-child {
        align-self: center;
    }
    .triangolo {
        left: 10vw;
    }
    .circle {
        width: 65vw;
        height: 65vw;
    }
    .racconta{
        padding: 10vw;
    }
    a.btnRacconta {
        width: 100%;
    }
}
@media (min-width: 767px){
    .hero, .gridHero, .gridOpinione{
        display: flex;
    }
    .hero, .punteggio{
        background-size: contain !important;
        background-position: right center !important;
        background-repeat: no-repeat !important;
    }
    .gridHero, .gridPunteggio, .gridOpinione {
        margin: auto;
    }
    .gridPunteggio {
        height: 100%;
        align-items: center;
    }
    .gridOpinione, .gridRacconta {
        justify-content: space-between;
    }
    .gridOpinione {
        align-items: center;
    }
    .rowSocial {
        padding: 1.5vw 2.5vw;
    }
    .gridRacconta {
        align-items: center;
    }
    a.btnRacconta {
        border-radius: 5vw;
    }
}
@media (min-width: 767px) and (max-width: 899.9px){
    .hero{
        background: url('/media/heroNPS767.webp');
        height: calc(100vw / (850 / 650));
    }
    p.overtitle, p.lastUpdate, p.textSocial, a.btnRacconta{
        font-size: 1.89vw;
    }
    h1.titleHero{
        font-size: 6.13vw;
        line-height: 6.5vw;
        width: 39vw;
        margin: 0 0 4vw;
    }
    p.textHero, p.nps, li.itemNPS{
        font-size: 3.8vw;
    }
    p.textHero {
        line-height: 4.8vw;
        width: 46vw;
    }
    .gridHero > div:first-child > p:not(:last-child), h2.titleOpinione{
        margin: 0 0 4vw;
    }
    .indicatore, .punteggio, .opinione, .racconta {
        padding-block: 8vw;
    }
    p.textIndicatore {
        font-size: 4.23vw;
        line-height: 4.8vw;
    }
    .punteggio{
        background: #ededed;
    }
    .gridPunteggio {
        justify-content: space-between;
    }
    .circle {
        width: 38vw;
        height: 38vw;
    }
    p.score {
        font-size: 14.14vw;
    }
    p.nps {
        margin: 0 0 4vw;
    }
    ul.listNPS {
        margin: 0 0 3vw;
    }
    .triangolo {
        left: 10vw;
        width: 14.2vw;
        height: 7.1vw;
    }
    h2.titleOpinione {
        font-size: 5.17vw;
        line-height: 5.17vw;
        width: 45vw;
    }
    p.textOpinione, p.textRacconta {
        font-size: 2.83vw;
    }
    p.textOpinione {
        width: 40vw;
    }
    .listSocial {
        grid-gap: 2.5vw;
    }
    .rowSocial {
        border-radius: 5vw;
        width: 32vw;
    }
    img.iconOpinione {
        width: 5.6vw;
    }
    p.textRacconta {
        width: 37vw;
    }
    a.btnRacconta {
        width: 37vw;
        height: 8vw;
    }
}
@media (min-width: 767px) and (max-width: 1099.9px){
    .gridHero, .innerIndicatore, .gridPunteggio, .gridOpinione, .gridRacconta {
        width: 84vw;
    }
    .iconTextSocial {
        grid-gap: 1.5vw;
    }
    .triangolo {
        left: 8vw;
    }
}
@media (max-width: 899.9px){
    p.overtitle {
        margin: 0 0 2vw;
    } 
}
@media (min-width: 900px){
    p.overtitle {
        margin: 0 0 1vw;
    } 
    .indicatore{
        padding-block: 6vw;
    }
    p.nps {
        margin: 0 0 3vw;
    }
    ul.listNPS {
        margin: 0 0 2vw;
    }
}
@media (min-width: 900px) and (max-width: 1099.9px){
    .hero{
        background: url('/media/heroNPS900.webp');
        height: calc(100vw / (1000 / 600));
    }
    p.overtitle, p.lastUpdate, p.textSocial, a.btnRacconta{
        font-size: 1.61vw;
    }
    h1.titleHero{
        font-size: 5.22vw;
        width: 39vw;
        line-height: 5.8vw;
        margin: 0 0 3vw;
    }
    p.textHero, p.nps, li.itemNPS{
        font-size: 3.22vw;
    }
    p.textHero {
        line-height: 4vw;
        width: 40vw;
    }
    p.textIndicatore {
        font-size: 3.61vw;
        line-height: 4.5vw;
    }
    .punteggio{
        background: url('/media/punteggioNPS900.webp'), #ededed;
        height: calc(100vw / (1000 / 450));
    }
    .gridPunteggio {
        grid-gap: 6vw;
    }
    .circle {
        width: 30vw;
        height: 30vw;
    }
    p.score{
        font-size: 12.08vw;
    }
    .opinione {
        padding-block: 12vw 8vw;
    }
    .triangolo {
        width: 14.2vw;
        height: 7.1vw;
    }
    h2.titleOpinione {
        font-size: 4.41vw;
        line-height: 4.1vw;
        width: 43vw;
    }
    p.textOpinione, p.textRacconta {
        font-size: 2.41vw;
    }
    p.textOpinione {
        width: 40vw;
    }
    .rowSocial {
        width: 27vw;
    }
    img.iconOpinione {
        width: 4.7vw;
    }
    p.textRacconta {
        width: 43vw;
    }
    a.btnRacconta {
        width: 34vw;
        height: 7vw;
    }
    .racconta {
        padding-block: 7vw;
    }
}
@media (min-width: 900px) and (max-width: 1400px){
    .gridOpinione {
        width: 80vw;
    }
    h2.titleOpinione {
        margin: 0 0 3vw;
    }
    .listSocial {
        grid-gap: 2vw;
    }
    .rowSocial {
        border-radius: 4vw;
    }
}
@media (min-width: 1100px){
    h1.titleHero, .gridHero > div:first-child > p:nth-child(3), p.textOpinione{
        margin: 0 0 2vw;
    }
    .gridPunteggio {
        grid-gap: 4vw;
    }
    .iconTextSocial {
        grid-gap: 1vw;
    }
}
@media (min-width: 1100px) and (max-width: 1400px){
    .hero{
        background: url('/media/heroNPS1100.webp');
        height: calc(100vw / (1200 / 600));
    }
    .gridHero, .innerIndicatore, .gridPunteggio, .gridOpinione, .gridRacconta {
        width: 80vw;
    }
    p.overtitle, p.lastUpdate, p.textSocial, a.btnRacconta{
        font-size: 1.32vw;
    }
    h1.titleHero{
        font-size: 4.27vw;
        width: 39vw;
        line-height: 4.27vw;
    }
    p.textHero, p.nps, li.itemNPS{
        font-size: 2.64vw;
    }
    p.textHero{
        line-height: 3.2vw;
        width: 33vw;
    }
    p.textIndicatore {
        font-size: 2.95vw;
        width: 72vw;
        line-height: 4vw;
    }
    .punteggio{
        background: url('/media/punteggioNPS1100.webp'), #ededed;
        height: calc(100vw / (1200 / 436));
    }
    .circle {
        width: 26vw;
        height: 26vw;
    }
    p.score{
        font-size: 9.86vw;
    }
    .opinione {
        padding-block: 9vw 6.5vw;
    }
    .triangolo {
        left: 10vw;
        width: 11vw;
        height: 5.4vw;
    }
    h2.titleOpinione {
        font-size: 3.6vw;
        line-height: 3.6vw;
        width: 32vw;
    }
    p.textOpinione, p.textRacconta {
        font-size: 2vw;
    }
    p.textOpinione {
        width: 34vw;
    }
    img.iconOpinione {
        width: 3.5vw;
    }
    .racconta {
        padding-block: 5vw;
    }
    p.textRacconta {
        width: 36vw;
    }
    a.btnRacconta {
        width: 36vw;
        height: 7vw;
    }
}
@media (min-width: 1401px) {
    .hero{
        background: url('/media/heroNPS2000.webp');
        height: calc(100vw / (2000 / 800));
    }
    .gridHero, .innerIndicatore, .gridPunteggio, .gridOpinione, .gridRacconta {
        width: 70vw;
    }
    p.overtitle, p.lastUpdate, p.textSocial, a.btnRacconta {
        font-size: 1.05vw;
    } 
    h1.titleHero{
        font-size: 3.4vw;
        line-height: 3.4vw;
        width: 23vw;
    }
    p.textHero, p.nps, li.itemNPS{
        font-size: 2.1vw;
    }
    p.textHero{
        line-height: 2.6vw;
        width: 26vw;
    }
    p.textIndicatore {
        font-size: 2.35vw;
        width: 58vw;
        line-height: 3vw;
    }
    .punteggio{
        background: url('/media/punteggioNPS2000.webp'), #ededed;
        height: calc(100vw / (2000 / 727));
    }
    .circle {
        width: 21vw;
        height: 21vw;
    }
    p.score{
        font-size: 7.83vw;
    }
    .opinione {
        padding: 6.5vw 0;
    }
    .triangolo {
        width: 7.4vw;
        height: 3.7vw;
        left: 15vw;
    }
    h2.titleOpinione {
        font-size: 2.9vw;
        line-height: 2.9vw;
        margin: 0 0 2vw;
        width: 25vw;
    }
    p.textOpinione, p.textRacconta {
        font-size: 1.57vw;
    }
    p.textOpinione {
        width: 31vw;
    }
    .listSocial {
        grid-gap: 1.5vw;
    }
    .rowSocial {
        border-radius: 3vw;
        width: 25vw;
    }
    img.iconOpinione {
        width: 2.7vw;
    }
    .racconta{
        padding-block: 4vw;
    }
    p.textRacconta {
        width: 28vw;
    }
    a.btnRacconta {
        width: 33vw;
        height: 5.5vw;
    }
}