﻿/*##################################################*/
/*# STILI MULTISCHERMO #############################*/
/*##################################################*/
body.landing_opening_2402 .contained { max-width: 1280px; padding: 0 20px; }
.landing_opening_2402.v2 .contained { padding-top: 0; }
/*##################################################*/
/*##################################################*/
/*# Logo Iniziale ##################################*/
.logo_iniziale { padding: 40px 0; }
    .logo_iniziale img { max-height: 100px; }
/*##################################################*/
/*# Visual Principale ##############################*/
.visual { position: relative; background: linear-gradient(to bottom, rgba(34,34,34,1) 0%,rgba(0,0,0,1) 50%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 100%); }
    .visual .j_center { width: 100%; position: relative; background: rgba(36,56,103,1); border-radius: 20px; padding: 30px 15px; overflow: hidden; }
        .visual .j_center .backdrop_shadow { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); z-index: 0; opacity: 0; }
        .visual .j_center:hover .backdrop_shadow { opacity: 0.55; }
        .visual .j_center .flx_itm img { position: relative; width: 85%; max-width: 120px; margin-bottom: 20px; z-index: 3; }
        .visual .j_center .flx_itm b { position: relative; z-index: 3; }
/*##################################################*/
/*# Logo Iniziale - Versione 2 #####################*/
.landing_opening_2402.v2 .logo_iniziale img { max-height: 150px;  }
/*# Visual Principale - Versione 2 #################*/
.landing_opening_2402.v2 .visual { height: 300px; background: linear-gradient(to bottom, rgba(34,34,34,1) 0%,rgba(0,0,0,1) 80%,rgba(255,255,255,1) 80%,rgba(255,255,255,1) 100%); }
    .landing_opening_2402.v2 .visual * { position: absolute; }
    .landing_opening_2402.v2 .visual .syline, .landing_opening_2402.v2 .visual .riflesso, .landing_opening_2402.v2 .visual .overlay_grad { display: block; height: 70%; left: 50%; width: auto; }
    .landing_opening_2402.v2 .visual .syline { bottom: 20%; transform: translateX(-50%); filter: invert(1); }
    .landing_opening_2402.v2 .visual .riflesso, .landing_opening_2402.v2 .visual .overlay_grad { top: 80%; transform: translateX(-50%) rotate(180deg) scaleX(-100%); }
    .landing_opening_2402.v2 .visual .riflesso { opacity: 0.25; filter: blur(1px); }
    .landing_opening_2402.v2 .visual:hover .riflesso { opacity: 0.15; }
    .landing_opening_2402.v2 .visual .overlay_grad { position: relative; background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); }
    .landing_opening_2402.v2 .visual .logo { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 250px; aspect-ratio: 1/1; border-radius: 50%; background: linear-gradient(to bottom, rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); }
    .landing_opening_2402.v2 .visual:hover .logo { transform: translate(-50%,-51%); }
    .landing_opening_2402.v2 .visual .logo:after { content: ""; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border: solid 2px #000; width: 105%; aspect-ratio: 1/1; border-radius: 50%; }
    .landing_opening_2402.v2 .visual .logo img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: auto; height: 65%; }
    .landing_opening_2402.v2 .visual span { position: relative; }
/*##################################################*/
/*# Copy ###########################################*/
.main_copy { margin: 30px auto; }
    /**/
    .main_copy .flx_itm.w1, .main_copy .flx_itm.w2, .main_copy .flx_itm.w3 { margin: 20px auto; }
        .main_copy .flx_itm.w3 .sep { width: 100%; height: 3px; }
        /**/
        .main_copy .flx_itm.w2 p { display: block; margin: 0; padding: 0; }
        .main_copy .flx_itm.w2.image { }
            .main_copy .flx_itm.w2.image .frame { width: 100%; max-width: 350px; aspect-ratio: 7/10; background-size: cover; background-position: center; border-radius: 15px; transition: 5s ease-in-out; overflow: hidden; position: relative; background-color: aqua; }
                .main_copy .flx_itm.w2.image .frame:hover { background-position: center right; }

                .main_copy .flx_itm.w2.image .frame img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); height: 100%; width: auto; }
    /**/
    .main_copy label { padding: 15px; border-radius: 8px; max-width: 350px; cursor: pointer; }
        .main_copy label b { display: block; flex: 0; }
        .main_copy label img { display: block; flex: 0; max-height: 4rem; }
        .main_copy label:hover { background-color: #bd9d4e; }
            .main_copy label:hover img { transform: rotate(90deg); }
/*Versione 2*/
body.landing_opening_2402.v2 .cta { position: relative; padding: 200px 0; background: url('../img/visual_3.jpg') center bottom 15% no-repeat; background-size: cover; }
#landing_form_trigger:checked ~ .cta { padding-bottom: 60px; }
    body.landing_opening_2402.v2 .cta .overlay_grad { display: none; position: absolute; z-index: 1; bottom: 0; left: 0; height: 50%; width: 100%; background: linear-gradient(to bottom, rgba(240,200,100,0) 0%,rgba(240,200,100,1) 100%); }
    body.landing_opening_2402.v2 .cta label { padding: 15px; border-radius: 8px; max-width: 350px; cursor: pointer; z-index: 2; box-shadow: 0 0 6px rgba(0,0,0,0.25);}
        body.landing_opening_2402.v2 .cta label b { display: block; flex: 0; }
    body.landing_opening_2402.v2 .cta img { display: block; flex: 0; max-height: 4rem; }
    body.landing_opening_2402.v2 .cta label:hover { background-color: #ffde6a; box-shadow: 0 3px 12px rgba(0,0,0,0.3); }
        body.landing_opening_2402.v2 .cta label:hover img { transform: rotate(90deg); }
/*##################################################*/
/*# Form ###########################################*/
.landing_form_container { overflow-y: hidden; height: 0; }
#landing_form_trigger:checked ~ .landing_form_container { height: auto; }
body.landing_opening_2402 form.contained { padding-top: 40px; padding-bottom: 80px; }
body.landing_opening_2402 form .flx_itm.w1 b { display: block; margin-bottom: 40px; }
.landing_opening_2402.v2 form.contained { padding-top: 60px; }
/*##################################################*/
/*# FOOT ###########################################*/
.landing_opening_2402 .foot { padding: 50px 0; border-top: solid 1px #555; }
.bkg_yellow_landing {
    background-color: #f0c864 !important;
}
/*##################################################*/
/*- STILI ESCLUSIVI GRANDI SCHERMI -----------------*/
@media (min-width: 1281px) {
    /*##############################################*/
}
/*##################################################*/
/*- STILI SCHERMI MEDI --------------------------*/
@media (min-width: 1025px) and (max-width: 1280px) {
    /*##################################################*/
}
/*##################################################*/
/*- STILI PICCOLI SCHERMI --------------------------*/
@media (min-width: 769px) and (max-width: 1024px) {
    /*##############################################*/
}
/*##################################################*/
/*- STILI TABLET -----------------------------------*/
@media (min-width: 481px) and (max-width: 768px) {
    /*##############################################*/
}
/*##################################################*/
/*- STILI MOBILE -----------------------------------*/
@media (max-width: 480px) {
    /*##############################################*/
}
