﻿/*#||###############################################*/
/*|VARIAZIONI DI LAYOUT in base ai contenitori con le seguenti classi: vetrina_square, vetrina_vertical, vetrina_wide|*/
/*#||###############################################*/
/*|VARIAZIONI DI CONTENUTO in base alla classe di tipologia promo da applicare all'oggetto .item: content_auto, content_generic|*/
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*# STILI MULTISCHERMO #############################*/
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*#|THUMBNAIL CONTENT|##############################*/
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*#|ESCLUSIONI: container dependent|################*/
.vetrina_square .thmb_content .media img.img_wide, .vetrina_vertical .thmb_content .media img.img_wide, .vetrina_square .thmb_content .media iframe, .vetrina_vertical .thmb_content .media iframe { display: none !important; }
.thmb_content .media .promo_tag { display: none  }
/*#||###############################################*/
/*#|ESCLUSIONI: content dependent|##################*/
.thmb_content.content_auto .content_generic_only, .thmb_content.content_generic .content_auto_only { display: none !important; }
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*#|PROPRIETÀ GENERICHE|############################*/
.thmb_content { display: block; }
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*#|VARIABILE QUADRATA|#############################*/
.vetrina_square .thmb_content, .vetrina_square .thmb_content .media { width: 100%; aspect-ratio: 1/1; }
    /*MEDIA*/
    .vetrina_square .thmb_content .media { z-index: 1; }
        .vetrina_square .thmb_content .media img { z-index: 1; }
    .vetrina_square .thmb_content:hover .media img.img_square { transform: translate(-50%,-50%) scale(1.01); transition: 2s ease-in-out; }
    .vetrina_square .thmb_content .media .brand { position: absolute; z-index: 5; top: 0; right: 0; aspect-ratio: 1/1; height: 6rem; border-radius: 0 1.5rem 0 1.5rem; background: linear-gradient(45deg, rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.8) 100%); }
        .vetrina_square .thmb_content .media .brand img { width: 70%; height: 70%; object-fit: contain; z-index: 5; }
    /*COPY - Versione auto singola*/
    .vetrina_square .thmb_content.content_auto .copy { z-index: 2; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; display: flex; flex-flow: column; flex-wrap: wrap; justify-content: space-between; /**/ background: linear-gradient(to bottom, rgba(0,0,0,0.9) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 70%,rgba(0,0,0,0.9) 100%); }
    .vetrina_square .thmb_content.content_auto:hover .copy { filter: contrast(1.5); }
    .vetrina_square .thmb_content.content_auto .copy * { color: #fff; }
    .vetrina_square .thmb_content.content_auto .copy p { display: block; padding: 2rem; text-shadow: 0 0 0.8rem rgba(0,0,0,0.7); padding-right: 7rem; }
    .vetrina_square .thmb_content.content_auto:hover .copy p { text-shadow: 0 0 2rem rgba(0,0,0,0.7); }
    .vetrina_square .thmb_content.content_auto .copy p span { }
    .vetrina_square .thmb_content.content_auto .copy p.marca_modello { }
        .vetrina_square .thmb_content.content_auto .copy p.marca_modello .font_sz_var_02 { -webkit-line-clamp: 2; }
    .vetrina_square .thmb_content.content_auto .copy p span.prezzo_mese { display: block; }
    /*COPY - Versione Generica*/
    .vetrina_square .thmb_content.content_generic .copy { z-index: 2; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; height: auto; padding: 2rem; color: #fff; text-shadow: 0 0 0.8rem rgba(0,0,0,0.7); /**/ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%); }
        .vetrina_square .thmb_content.content_generic .copy .title { -webkit-line-clamp: 2; }
        .vetrina_square .thmb_content.content_generic .copy .description { -webkit-line-clamp: 3; padding-right: 5rem; }
    /*CTA*/
    .vetrina_square .thmb_content .cta { position: absolute; bottom: 2rem; right: 2rem; z-index: 5; background-color: #fff; border-radius: 0.7rem; color: #034798; height: 4rem; aspect-ratio: 1/1; }
        .vetrina_square .thmb_content .cta strong { display: none; }
        .vetrina_square .thmb_content .cta i { font-size: 3rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
    .vetrina_square .thmb_content:hover .cta i { transform: translate(-40%,-50%); }
    /*Variabile per NOLEGGIO*/
    .vetrina_square .thmb_content.content_auto.content_noleggio .copy p span.prezzo_mese { display: inline-block; }
    /**/
    .vetrina_square .thmb_content.content_auto.content_noleggio .cta { }
        .vetrina_square .thmb_content.content_auto.content_noleggio .cta i { transform: rotate(90deg) translate(-50%,50%); filter: saturate(0); }
        .vetrina_square .thmb_content.content_auto.content_noleggio:hover .cta i { filter: saturate(1); }
    .vetrina_square .thmb_content.content_auto.content_noleggio .cta i:hover { transform: rotate(90deg) translate(-40%,50%); }
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*#|VARIABILE WIDE|#################################*/
.vetrina_wide { position: relative; width: 100%; }
    .vetrina_wide.thmb_content.brdr_rad_std { }
    .vetrina_wide.fullscreen .thmb_content.brdr_rad_std { border-radius: 0; }
    /*Media*/
    .vetrina_wide .thmb_content .media { z-index: 1; width: 100%; overflow: hidden; }
        .vetrina_wide .thmb_content .media iframe { width: 100%; height: auto; aspect-ratio: 16/9; }
        .vetrina_wide .thmb_content .media .brand { position: absolute; z-index: 5; top: 0; right: 0; aspect-ratio: 1/1; height: 6rem; border-radius: 0 1.5rem 0 1.5rem; background: linear-gradient(45deg, rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.8) 100%); }
    .vetrina_wide.highlighted .thmb_content .media .brand { display: none; }
    .vetrina_wide.highlighted .thmb_content .media .brand { border-top-right-radius: 0; }
    .vetrina_wide.fullscreen .thmb_content .media .brand { border-top-right-radius: 0; }
    .vetrina_wide .thmb_content .media .brand img { width: 70%; height: 70%; object-fit: contain; z-index: 5; }
    /*COPY - Versione auto singola*/
    .vetrina_wide .thmb_content .copy { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; padding: 5rem 0 2rem 0; }
    .vetrina_wide .thmb_content p { width: 100%; padding: 0 3rem; margin: auto; color: #fff; text-shadow: 0 0 0.8rem rgba(0,0,0,0.7); }
        .vetrina_wide .thmb_content p span { position: relative; z-index: 3; width: 100%;  max-width: 160rem; margin: auto;  }
    .vetrina_wide.fullscreen .thmb_content p span { text-align: left; margin: auto; width: 100%; }
    .vetrina_wide .thmb_content .copy p span.prezzo_mese { display: block; }
    .vetrina_wide .thmb_content .copy:after { content: ''; display: block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 200%; height: 20rem; z-index: 1; /**/ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%); }
    /*COPY - Versione Generica*/
    .vetrina_wide .thmb_content.content_generic .copy { z-index: 2; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; height: auto; padding: 2rem; color: #fff; text-shadow: 0 0 0.8rem rgba(0,0,0,0.7); /* background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%);*/ }
        .vetrina_wide .thmb_content.content_generic .copy .title { -webkit-line-clamp: 2; font-size: 2.4rem; position: relative; z-index: 2; margin: 0;}
        .vetrina_wide .thmb_content.content_generic .copy .description { -webkit-line-clamp: 3; padding-right: 5rem; position: relative; z-index: 2; margin-top: 0.5rem;}
        .vetrina_wide .thmb_content.content_generic .copy .description p { padding: 0; margin: 0; max-width: 80rem; }
    /*CTA*/
    .vetrina_wide .thmb_content .cta { display: block; margin-top: 1rem ; }
    /*Variabili Correttive per Thumbnail News*/
    .vetrina_wide .thmb_content.content_generic.content_news .copy .title { -webkit-line-clamp: 2; font-size: 2.4rem; position: relative; z-index: 2; margin: 0; display: block; }
    .vetrina_wide .thmb_content.content_news p { padding: 0; }
    .vetrina_wide .thmb_content .cta { position: relative; z-index: 2; box-shadow: none; }
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*#|VARIABILE VERTICALE|############################*/
.vetrina_vertical { }
    .vetrina_vertical .thmb_content.brdr_rad_std { aspect-ratio: 10/16; display: flex; flex-flow: column; justify-content: space-between; height: 100%; }
    /*MEDIA*/
    .vetrina_vertical .thmb_content .media { z-index: 1; aspect-ratio: 1/1; position: relative;  }
        .vetrina_vertical .thmb_content .media img { z-index: 1; }
    .vetrina_vertical .thmb_content:hover .media img.img_square { transform: translate(-50%,-50%) scale(1.01); transition: 2s ease-in-out; }
    .vetrina_vertical .thmb_content .media .brand { position: absolute; z-index: 5; top: 0; right: 0; aspect-ratio: 1/1; height: 6rem; border-radius: 0 1.5rem 0 1.5rem; background: linear-gradient(45deg, rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.8) 100%); }
        .vetrina_vertical .thmb_content .media .brand img { width: 70%; height: 70%; object-fit: contain; z-index: 5; }
.vetrina_veicoli .vetrina_vertical .thmb_content .media .promo_tag { display: block; position: absolute; z-index: 5; top: 0; right: 0; height: 6rem; padding: 0 7.5rem 0 1.5rem; border-radius: 0 1.5rem 0 1.5rem; background: linear-gradient(45deg, rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.8) 100%); }
    .vetrina_vertical .thmb_content.content_generic .media .promo_tag { padding-right: 1.5rem; } 
    /*COPY - Versione auto singola*/
    .vetrina_vertical .thmb_content .copy { z-index: 2; position: relative; width: 100%; height: auto; flex: 1 1 auto; display: flex; flex-flow: column; flex-wrap: wrap; justify-content: flex-start; padding: 1.25rem 1.5rem 7rem 1.5rem; }
        .vetrina_vertical .thmb_content .copy * { }
        .vetrina_vertical .thmb_content .copy p { display: block; }
    .vetrina_vertical .thmb_content.content_auto .copy p.marca_modello .font_sz_var_02 { -webkit-line-clamp: 2; }
    .vetrina_vertical .thmb_content.content_auto .copy p span.prezzo_mese { display: inline; }
    /*COPY - Versione Generica*/
    .vetrina_vertical .thmb_content.content_generic .copy .title { -webkit-line-clamp: 3; font-size: 1.75rem; }
    .vetrina_vertical .thmb_content.content_generic .copy .description { -webkit-line-clamp: 3; padding-right: 5rem; }
    /*CTA*/
    .vetrina_vertical .thmb_content .cta { position: absolute; bottom: 0; right: 0; z-index: 5; background-color: #fff; border-radius: 0.7rem; color: #034798; height: auto; width: 100%; padding: 1rem 1.5rem; }
        .vetrina_vertical .thmb_content .cta strong { display: block; }
        .vetrina_vertical .thmb_content .cta i { font-size: 3rem; }
    .vetrina_vertical .thmb_content:hover .cta i { transform: translateX(0.5rem); }
    .vetrina_vertical .thmb_content .cta:hover strong { text-decoration: underline; }
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*#||###############################################*/

/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*- STILI Comuni: tutti gli schermi DESKTOP --------*/
@media (min-width: 769px) {
    /*#||###############################################*/
    /*#|ESCLUSIONI: container dependent|################*/
    .vetrina_wide .thmb_content .media img.img_square { display: none; }
    /*#||###############################################*/
    /*#|VARIABILE WIDE|#################################*/
    .vetrina_wide.highlighted .thmb_content:after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 25%; z-index: 2; /**/ background: linear-gradient(to bottom, rgba(238,238,238,1) 0%,rgba(238,238,238,0) 100%); }
    .vetrina_wide .thmb_content .media { aspect-ratio: 10/4; }
    .vetrina_wide .thmb_content p span { width: 50%; margin: 0 50% 0 0; }
    .vetrina_wide .thmb_content.content_auto p { }
    .vetrina_wide .thmb_content.content_auto p.prezzo span { display: inline-block; width: auto; margin: auto;}
    /*#||###############################################*/
    /*--------------------------------------------------*/
    /*#||###############################################*/
    /*#|VARIABILE Promo connessa al veicolo|############*/
    .vetrina_vertical.promo_connessa .thmb_content.brdr_rad_std { aspect-ratio: unset; flex-flow: row; }
    .vetrina_vertical.promo_connessa .thmb_content .media { flex: 0 1 25%; }
    .vetrina_vertical.promo_connessa .thmb_content .copy { flex: 0 1 75%; justify-content: center;}
    .vetrina_vertical.promo_connessa .thmb_content .cta { width: 75%; border-top-left-radius: 0; border-bottom-left-radius: 0; }
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI Comuni: tutti gli schermi PORTABLE -------*/
@media (max-width: 768px) {
    /*#||###############################################*/
    /*#|VARIABILE WIDE|#################################*/
    .vetrina_wide .thmb_content .media { aspect-ratio: 1/1; }
    /*#||###############################################*/
}
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*- STILI ESCLUSIVI GRANDI SCHERMI -----------------*/
@media (min-width: 1281px) {
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI SCHERMI MEDI --------------------------*/
@media (min-width: 1025px) and (max-width: 1280px) {
    /*#||###############################################*
    .vetrina_vertical .thmb_content.brdr_rad_std { aspect-ratio: 10/18;  }
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI PICCOLI SCHERMI --------------------------*/
@media (min-width: 769px) and (max-width: 1024px) {
    /*#||###############################################*
    .vetrina_vertical .thmb_content.brdr_rad_std { aspect-ratio: 10/16; }
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI TABLET -----------------------------------*/
@media (min-width: 481px) and (max-width: 768px) {
    /*#||###############################################*
    .vetrina_vertical .thmb_content.brdr_rad_std { aspect-ratio: 10/17.5; height: 100%;}
    /*#||###############################################*/
    /*#|VARIABILE Promo connessa al veicolo|############*/
    .vetrina_vertical.promo_connessa .thmb_content.brdr_rad_std { aspect-ratio: unset; flex-flow: row; }
    .vetrina_vertical.promo_connessa .thmb_content .media { flex: 0 1 33%; }
    .vetrina_vertical.promo_connessa .thmb_content .copy { flex: 0 1 66%; justify-content: center; }
    .vetrina_vertical.promo_connessa .thmb_content .cta { width: 66%; border-top-left-radius: 0; border-bottom-left-radius: 0; }
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI MOBILE -----------------------------------*/
@media (max-width: 480px) {
    /*--------------------------------------------------*/
    /*#||###############################################*/
    /*#|VARIABILE WIDE|#################################*/
    /*#||###############################################*/
}
/*--------------------------------------------------*/
