/* 
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
*/

/* 
Stili generici
 */

span.ev {
  color: var(--e-global-color-accent);
}

/*
header sticky
*/

header.elementor.elementor-location-header {
  position: relative;
  z-index: 1;
}

#header-stick {
  transition:
    width 0.35s ease,
    border-radius 0.35s ease,
    background 0.35s ease,
    padding 0.35s ease,
    box-shadow 0.35s ease;
}

#header-stick.is-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
}

#header-stick.is-hidden {
  visibility: hidden;
  pointer-events: none;
}

#header-stick.is-sticky {
  width: 800px;
  max-width: 90vw;
  border-radius: 999px;
  background: rgba(21, 21, 21, 0.92);
  backdrop-filter: blur(8px);
  padding: 10px 30px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}
/*
Animazione menu hero
*/

.menuhero {
  display: inline-block;
  text-align: right;
}

.menuhero .e-heading-link-base {
  position: relative;
  display: inline-block;
  letter-spacing: 0em;
  transform: scale(1);
  transform-origin: right center;
  transition:
    letter-spacing 0.35s ease,
    transform 0.35s ease;
}

.menuhero .e-heading-link-base::after {
  content: "";
  position: absolute;
  left: -6px;
  right: -6px;
  height: 100%;
  background: #f23a02;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.35s ease;
  z-index: -1;
}

.menuhero:hover .e-heading-link-base {
  letter-spacing: 0.06em;
  transform: scale(1.05);
}

.menuhero:hover .e-heading-link-base::after {
  transform: scaleX(1);
}

/*
Parallasse immagine
*/
.parallax-image img,
.parallax-image {
  width: 100%;
  height: 130%;
  object-fit: cover;
  position: absolute;
  top: -15%;
  left: 0;
  will-change: transform;
}

/*
Tag competenze
*/
.tag-competenze li.elementor-icon-list-item {
  border: 1px solid var(--bordo-grigio);
  border-radius: 100px;
  padding: 0px 20px;
  margin-bottom: 15px;
  background: rgba(21, 21, 21, 0.92);
}

.tag-voci li.elementor-icon-list-item a {
  color: var(--e-global-color-primary) !important;
  border-radius: 100px;
  padding: 10px 20px;
  margin-bottom: 15px;
  background: rgba(21, 21, 21, 0.92);
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  transition: all 0.3s ease-in-out;
}

.tag-voci li.elementor-icon-list-item a:hover {
  background: var(--e-global-color-accent);
}

/*
Tag lavori
*/

.tag-lavori .elementor-shortcode {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
}
.tag-lavori span {
  border: 1px solid var(--bordo-grigio);
  border-radius: 100px;
  padding: 0px 15px 2px;
  background: rgba(21, 21, 21, 0.92);
  font-size: 14px;
}

/*
Animazione colore testo
*/
.text-anim-bg {
  background-image: linear-gradient(
    120deg,
    #ffffff 0%,
    #ffffff 45%,
    rgba(255, 255, 255, 0.25) 55%,
    rgba(255, 255, 255, 0.25) 100%
  );
  background-size: 250% 100%;
  background-position: 100% 0;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

/*
Lavoro singolo
*/

.lavoro-singolo {
  position: relative;
  transition: border-color 0.5s ease-in-out;
}

.descrizione-lavoro {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  pointer-events: none;
  max-width: 280px;
  font-size: 0.9rem;
  line-height: 1.4;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  opacity: 0;
  transform: translate(20px, 20px) scale(0.95);
  transition: none !important;
  border-color: var(--bordo-grigio) !important;
}

.lavoro-singolo:hover .descrizione-lavoro {
  opacity: 1 !important;
  transform: translate(20px, 20px) scale(1);
}

.lavoro-singolo:hover {
  border-color: var(--e-global-color-accent) !important;
}

.pulsante.e-button-base {
  position: relative;
  overflow: hidden !important;
  background: #ffffff;
  isolation: isolate;
  z-index: 0;
  transition: color 0.4s ease;
}

.pulsante.e-button-base::before {
  content: "";
  position: absolute;
  left: -10%;
  right: -10%;
  bottom: 0;
  height: 0%;
  background: var(--e-global-color-accent);
  border-radius: 50% 50% 0 0 / 100% 100% 0 0; /* bordo concavo iniziale */
  transition:
    height 0.5s cubic-bezier(0.65, 0, 0.65, 1),
    border-radius 0.5s cubic-bezier(0.65, 0, 0.35, 1);
  color: color 0.5s cubic-bezier(0.65, 0, 0.35, 1) 0.5s;
  z-index: -1;
}

.pulsante.e-button-base:hover::before {
  height: 130%; /* supera il 100% per coprire tutto anche con angolo curvo */
  border-radius: 0 0 0 0; /* si appiattisce del tutto man mano che sale */
}

.pulsante.e-button-base:hover {
  color: #ffffff;
}

/* ripple al click, parte dal punto esatto del click */
.pulsante.e-button-base .ripple {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
  transform: scale(0);
  pointer-events: none;
  z-index: 1;
}