/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/*COOKIE E PRIVACY*/
.page-id-892 a,
.page-id-891 a{
    color: #123F5A;
}


.project-card {
    position: relative;
    min-height: 500px;
    overflow: hidden;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.project-title {
    opacity: 1;
    z-index: 2;
    visibility: visible;
    transform: translateY(0);
    transition:
        opacity 0.2s ease,
        transform 0.2s ease,
        visibility 0s linear 0s;
}

.project-card:hover .project-title {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition:
        opacity 0.2s ease,
        transform 0.2s ease,
        visibility 0s linear 0.2s;
}

/* Pannello inizialmente completamente nascosto */
.project-info {
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 0px;
    z-index: 4;
    padding: 26px;
    background: rgba(51, 51, 51, 0.35);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(calc(100% + 32px));
    transition:
        transform 0.55s cubic-bezier(.22, .61, .36, 1),
        opacity 0.35s ease,
        visibility 0s linear 0.55s;
}

/* Comparsa del pannello */
.project-card:hover .project-info {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
    transition:
        transform 0.55s cubic-bezier(.22, .61, .36, 1),
        opacity 0.35s ease,
        visibility 0s;
}

.project-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background: rgba(0, 0, 0, 0);
    pointer-events: none;
    transition: background 0.4s ease;
}

.project-card:hover::before {
    background: rgba(0, 0, 0, 0.3);
}


.swiper-pagination.swiper-pagination-progressbar.swiper-pagination-horizontal{
    position: relative;
    margin-top: 30px;
    z-index: 5;
}

.elementor-icon-list-item{
    width: fit-content;
    background-color: #123F5A;
    padding: 5px 15px 5px 10px !important;
    border-radius: 50px;
}

.animated-title .word {
    display: inline-block;
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity 0.6s ease,
        transform 0.6s cubic-bezier(.22, .61, .36, 1);
    transition-delay: calc(var(--word-index) * 0.08s);
}

.animated-title.is-visible .word {
    opacity: 1;
    transform: translateY(0);
}

/* HEADER */
.site-header {
    background:
        linear-gradient(
            to bottom,
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.15) 55%,
            rgba(0, 0, 0, 0) 100%
        ) !important;

    transition:
        background 0.35s ease,
        background-color 0.35s ease,
        box-shadow 0.35s ease;
}

.site-header.header-scrolled {
    background: #F8F7F3 !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
}

.site-header .elementor-heading-title,
.site-header .elementor-nav-menu a,
.site-header .elementor-icon-list-text {
    color: #F8F7F3 !important;
    transition: color 0.35s ease;
}

.site-header.header-scrolled .elementor-heading-title,
.site-header.header-scrolled .elementor-nav-menu a,
.site-header.header-scrolled .elementor-icon-list-text {
    color: #333333 !important;
}

/* LOGHI */
.site-header .logo-bianco {
    display: block;
}

.site-header .logo-scuro {
    display: none;
}

.site-header.header-scrolled .logo-bianco {
    display: none;
}

.site-header.header-scrolled .logo-scuro {
    display: block;
}

/* Icona menu mobile */
.site-header .icona-menu-mobile,
.site-header .icona-menu-mobile i,
.site-header .icona-menu-mobile svg {
    color: #F8F7F3 !important;
    fill: #F8F7F3 !important;
    transition:
        color 0.2s ease,
        fill 0.2s ease;
}

/* Icona dopo lo scroll */
.site-header.header-scrolled .icona-menu-mobile,
.site-header.header-scrolled .icona-menu-mobile i,
.site-header.header-scrolled .icona-menu-mobile svg {
    color: #333333 !important;
    fill: #333333 !important;
}

/*CARD HOTSPOT*/
.elementor-widget-hotspot .e-hotspot {
    --white-space: normal !important;
    --tooltip-min-width: 200px !important;
}

.e-hotspot__tooltip.e-hotspot--tooltip-position.e-hotspot--fade-in-out{
    padding: 20px;
    border: solid 1px #E7DED1;
}

.e-hotspot__tooltip.e-hotspot--tooltip-position.e-hotspot--fade-in-out img{
    position: absolute;
    right: -30px;
    max-width: 80px;
    top: -30px;
}

.e-hotspot__tooltip.e-hotspot--tooltip-position.e-hotspot--fade-in-out h3{
    margin-bottom: 5px;
}

.e-hotspot__tooltip.e-hotspot--tooltip-position.e-hotspot--fade-in-out .elementor-icon-list-item {
    padding: 5px 8px !important;
}
.elementor-widget-hotspot .e-hotspot__tooltip {
    width: 200px !important;
    min-width: 200px !important;
    max-width: 200px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    box-sizing: border-box !important;
}

.elementor-widget-hotspot .e-hotspot__tooltip p,
.elementor-widget-hotspot .e-hotspot__tooltip h3,
.elementor-widget-hotspot .e-hotspot__tooltip span {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

/*ICONA HOTSPOT*/
.e-hotspot__button.e-hotspot--expand{
    padding: 6px !important;
}

/* CARD MOBILE HOTSPOT */
.mobile-hotspot-card {
    display: none;
}

/*CAROSELLO PROGETTI*/
.contenitore-immagini-progetti {
    position: relative;
    overflow: hidden;
}

.contenitore-immagini-progetti .immagine-progetto {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    opacity: 0;
    visibility: hidden;

    transition:
        opacity 0.7s ease,
        visibility 0.7s ease;
}
.contenitore-immagini-progetti .immagine-progetto.is-active {
    opacity: 1;
    visibility: visible;
}

.contenitore-immagini-progetti .immagine-progetto .elementor-widget-container {
    width: 100%;
    height: 100%;
}

.contenitore-immagini-progetti .immagine-progetto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* tablet */
@media (max-width: 1028px){
    .elementor-element-f55366f{
        padding-left: 20px;
        padding-right: 20px;
    } 
}

/* Mobile */
@media (max-width: 767px) {
    .site-header {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    /*ICONA HOTSPOT*/
    .e-hotspot__button.e-hotspot--expand{
    padding: 2px !important;
    }
    /*
============================================
WIDGET
============================================
*/

.hotspot-mobile-card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.hotspot-mobile-card > .elementor-widget-container {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}


/*
============================================
NASCONDI SOLO I TOOLTIP ORIGINALI
============================================
*/

.hotspot-mobile-card .e-hotspot > .e-hotspot__tooltip {
    display: none !important;
}


/*
============================================
CARD MOBILE
============================================
*/

.hotspot-mobile-card > .mobile-hotspot-card {
    display: none !important;

    position: relative !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    transform: none !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    box-sizing: border-box !important;

    margin-top: 20px !important;

    white-space: normal !important;

    overflow: visible !important;
}


/*
Card aperta
*/

.hotspot-mobile-card > .mobile-hotspot-card.is-open {
    display: block !important;
    padding: 5px 15px 15px 15px;
}


/*
============================================
IMMAGINE
============================================
*/

.hotspot-mobile-card > .mobile-hotspot-card img {
    position: absolute !important;

    top: -65px !important;
    right: 20px !important;

    max-width: 110px !important;
    height: auto !important;

    margin: 0 !important;

    z-index: 2;
}


/*
============================================
TESTI
============================================
*/

.hotspot-mobile-card > .mobile-hotspot-card p,
.hotspot-mobile-card > .mobile-hotspot-card h1,
.hotspot-mobile-card > .mobile-hotspot-card h2,
.hotspot-mobile-card > .mobile-hotspot-card h3,
.hotspot-mobile-card > .mobile-hotspot-card h4,
.hotspot-mobile-card > .mobile-hotspot-card span {
    white-space: normal !important;

    word-break: normal !important;
    overflow-wrap: normal !important;
}


/*
============================================
BADGE LOCALITÀ
Spazio riservato all'immagine
============================================
*/

.hotspot-mobile-card
> .mobile-hotspot-card
.elementor-icon-list-item {
    max-width: calc(100% - 150px) !important;
}


/*
============================================
TITOLO
Spazio riservato all'immagine
============================================
*/

.hotspot-mobile-card
> .mobile-hotspot-card
h3 {
    max-width: calc(100% - 150px) !important;

    white-space: normal !important;
}
    /*
    Contenitore generale che comprende
    carosello + immagini
    */
    .carosello-progetti-wrapper {
        position: relative !important;
    }


    /*
    Contenitore immagini
    */
    .elementor-element-8d8b085.contenitore-immagini-progetti {
        position: absolute !important;

        top: 0 !important;
        left: 20px !important;
        right: 20px !important;

        margin-top: 300px !important;

        width: auto !important;
        max-width: none !important;

        height: 260px !important;

        overflow: hidden !important;
        box-sizing: border-box !important;

        z-index: 2;
    }


    /*
    Singole immagini
    */
    .contenitore-immagini-progetti .immagine-progetto {
        position: absolute !important;

        top: 0;
        right: 0;
        bottom: 0;
        left: 0;

        width: 100% !important;
        height: 100% !important;
    }


    /*
    Wrapper Elementor
    */
    .contenitore-immagini-progetti
    .immagine-progetto
    .elementor-widget-container {
        width: 100% !important;
        height: 100% !important;
    }


    /*
    Immagine
    */
    .contenitore-immagini-progetti
    .immagine-progetto img {
        width: 100% !important;
        height: 100% !important;

        object-fit: cover !important;

        display: block;
    }
}
}