.elementor-kit-6{--e-global-color-primary:#1C30E5;--e-global-color-secondary:#6D31FF;--e-global-color-text:#252525;--e-global-color-accent:#B6D827;--e-global-color-6e91666:#580BFF;--e-global-color-2fce236:#009FE2;--e-global-color-91aded2:#FFFFFF;--e-global-typography-primary-font-family:"Space Grotesk";--e-global-typography-primary-font-size:50px;--e-global-typography-primary-font-weight:700;--e-global-typography-primary-line-height:55px;--e-global-typography-secondary-font-family:"Space Grotesk";--e-global-typography-secondary-font-size:30px;--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-line-height:35px;--e-global-typography-text-font-family:"Space Grotesk";--e-global-typography-text-font-size:20px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;color:var( --e-global-color-text );font-family:"Space Grotesk", Sans-serif;font-size:20px;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 a{color:var( --e-global-color-text );}.elementor-kit-6 a:hover{color:var( --e-global-color-accent );}.elementor-kit-6 h1{color:var( --e-global-color-text );font-family:"Space Grotesk", Sans-serif;font-size:90px;font-weight:700;line-height:55px;}.elementor-kit-6 h3{color:var( --e-global-color-text );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1366px){.elementor-kit-6 h3{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}}@media(max-width:1024px){.elementor-kit-6 h3{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6 h3{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//** CARD forma sagomata**/

.angled-card-static {
 /* width: 100%;*/
  height: 100%;
  /*margin-left:0%;
  margin-right:0%;*/

  background: #252525;
  color: #fff;
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
  box-sizing: border-box;

  clip-path: polygon(
    1.5em 0,
    100% 0,
    100% calc(100% - 1.5em),
    calc(100% - 1.5em) 100%,
    0 100%,
    0 1.5em
  );
}

.angled-card-static50 {
/*width: 96%;*/
  height: auto;
/*margin-left:2%;
  margin-right:2%;*/

  background: #252525;
  color: #fff;
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
  box-sizing: border-box;

  clip-path: polygon(
    1.5em 0,
    100% 0,
    100% calc(100% - 1.5em),
    calc(100% - 1.5em) 100%,
    0 100%,
    0 1.5em
  );
}
@media (max-width: 1366px) {
.angled-card-static50 {
 /* width: 100%!important;*/
  height: 50%;
  margin-left:0%;
  margin-right:0%;

  background: #252525;
  color: #fff;
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
 

  clip-path: polygon(
    1.5em 0,
    100% 0,
    100% calc(100% - 1.5em),
    calc(100% - 1.5em) 100%,
    0 100%,
    0 1.5em
  );
}
}


.angled-card-static-adt{
     
  width: 100%;
  height: auto;
  margin-left:5%;
  margin-right:5%;

  background: #252525;
  color: #fff;
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
  box-sizing: border-box;

  clip-path: polygon(
    1.5em 0,
    100% 0,
    100% calc(100% - 1.5em),
    calc(100% - 1.5em) 100%,
    0 100%,
    0 1.5em);
}

.immagine-piccola{
  position: relative;
  height: auto !important;   /* override del tuo height:100% */
  overflow: hidden;
  aspect-ratio: 1 / 1;       /* in alternativa usa min-height (vedi sotto) */
  /* min-height: clamp(320px, 60vh, 720px); */
}
.immagine-piccola > img,
.immagine-piccola .elementor-widget-container > img{
  display: block;
  width: 100%;
  height:100%;
  object-fit: cover;
  object-position: center;
}

/* Aggiunte per l'<img> interno */
.immagine > img,
.immagine .elementor-widget-container > img{
  display: block;
  width: 100%;
  height:auto;
  object-fit: cover;
  object-position: center;
}

.immagine{
  position: relative;
  height: auto !important;   /* override del tuo height:100% */
  overflow: hidden;
  aspect-ratio: 2 / 3;       /* in alternativa usa min-height (vedi sotto) */
  /* min-height: clamp(320px, 60vh, 720px); */
}

.angled-card-static2 {
  width: 100%;
  /*height: 100%;*/
  height:auto;
  margin-left:0%;
  margin-right:0%;
  padding:5px;

  background: #252525;
  color: #fff;
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
  box-sizing: border-box;

  clip-path: polygon(
    1.5em 0,
    100% 0,
    100% calc(100% - 1.5em),
    calc(100% - 1.5em) 100%,
    0 100%,
    0 1.5em
  );

}


.immagine2{
  position: relative;
  height: auto !important;   /* override del tuo height:100% */
  overflow: hidden;
  aspect-ratio: 3 / 2;       /* in alternativa usa min-height (vedi sotto) */
  /* min-height: clamp(320px, 60vh, 720px); */
}
.immagine2 > img,
.immagine2 .elementor-widget-container > img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Aggiunte per l'<img> interno */
.immagine > img,
.immagine .elementor-widget-container > img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.angled-card-static-19 {
  width: 100%;
  height: 100%;

  background: #252525;
  color: #fff;
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
  box-sizing: border-box;

  clip-path: polygon(
    1.5em 0,
    100% 0,
    100% calc(100% - 1.5em),
    calc(100% - 1.5em) 100%,
    0 100%,
    0 1.5em
  );
}

.angled-card-static-19:hover {
  transform: translateY(-0.5em);
  box-shadow: 0 0.8em 1.5em rgba(0, 0, 0, 0.25);
}

.angled-card-static-19:hover .elementor-widget-heading h2 {
  color: white !important;
}

.angled-card-static-19:hover .elementor-widget-image img {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.angled-card-static-19 .elementor-widget-image img {
  transition: opacity 0.3s ease;
}





.angled-card-aree{
    width: 100%;
  height: 100%;

  background: #252525;
  color: #fff;
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
  box-sizing: border-box;

  clip-path: polygon(
    1.5em 0,
    100% 0,
    100% calc(100% - 1.5em),
    calc(100% - 1.5em) 100%,
    0 100%,
    0 1.5em
  );
  }



.angled-card-aree:hover {
  transform: translateY(-0.5em);
  box-shadow: 0 0.8em 1.5em rgba(0, 0, 0, 0.25);
}




/* Swiper: tutte le slide alte uguali (quella più alta fa da riferimento) */ 
.e-n-carousel .swiper-wrapper{ align-items: stretch; }
.e-n-carousel .swiper-slide{ height: auto; }

/* Tokens */
:root{
  --ux-bg:#252525; --ux-ink:#fff; --ux-brand:#B6D827;
  --ux-pad: clamp(16px, 2.2vw, 24px);
  --ux-gap: clamp(8px, 1.2vw, 12px);

  /* MINIMO dell’area immagine (puoi regolarlo per breakpoint) */
  --ux-media-min: clamp(150px, 22vh, 220px);

  /* Titolo: icona inline */
  --ux-icon-url: url("https://www.elfim.com/wp-content/uploads/2025/07/prima.png");
  --ux-icon-size: 1em;  /* ~ altezza font del titolo */
  --ux-icon-gap: .5em;

  /* Freccia */
  --ux-arrow-size: 18px; --ux-arrow-pad: 10px; --ux-arrow-offset: 10px;

  --ux-shadow: 0 0.5em 1em rgba(0,0,0,0.15);
  --ux-shadow-hover: 0 0.8em 1.5em rgba(0,0,0,0.25);
}

/* Card: riempie tutta l’altezza della slide (padding card NON toccato) */
.ux-card{
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--ux-bg);
  color: var(--ux-ink);
  padding: var(--ux-pad);
  box-shadow: var(--ux-shadow);
  clip-path: polygon(1.5em 0,100% 0,100% calc(100% - 1.5em),calc(100% - 1.5em) 100%,0 100%,0 1.5em);
  transition: transform .3s, box-shadow .3s;
}
.ux-card:hover{ transform: translateY(-6px); box-shadow: var(--ux-shadow-hover); }

/* Spaziatura widget interni Elementor (evita extra-gap) */
.ux-card .elementor-widget{ margin: 0 0 var(--ux-gap) !important; }
.ux-card .elementor-widget:last-child{ margin-bottom: 0 !important; }
.ux-card .e-con{ gap: var(--ux-gap) !important; }
.ux-card .e-con, .ux-card .e-con-inner{ min-height: 20vh !important; }

/* Titolo (H3) con icona inline */
.ux-card__title{
  display: inline-flex; align-items: center; gap: var(--ux-icon-gap);
  line-height: 1.2; font-weight: 700; margin: 0;
}
.ux-card__title::before{
  content:""; display:inline-block; width:var(--ux-icon-size); height:var(--ux-icon-size);
  background: var(--ux-icon-url) no-repeat center/contain;
  align-self: flex-start; flex:0 0 auto;
}




/* Descrizione (H4) – tutto leggibile, nessun clamp */
.ux-card__desc{ margin:0; line-height:1.45; font-weight:500; }

/* AREA IMMAGINE (DIV con background) – allineata in basso, senza spazio extra */
.ux-card__media{
  margin-top: auto;                 /* ancora il media al fondo della card */
  margin-bottom: 0 !important;      /* NO extra spacing dal builder */
  padding: 0 !important;            /* evita padding interni del container */

  /* assegna un’altezza reale al div vuoto con background */
  min-height: 20vh !important;      /* oppure: min-height: var(--ux-media-min) !important; */

  background-size: cover;
  background-position: center;      /* se vuoi privilegiare il basso: center bottom */
  background-repeat: no-repeat;

  clip-path: polygon(0 0,100% 0,100% calc(100% - 1.5em),calc(100% - 1.5em) 100%,0 100%,0 1.5em);
  overflow: hidden;
}
/* Se il media è un Container Elementor, azzera gap/padding interni */
.ux-card__media.e-con{ gap: 0 !important; padding: 0 !important; }
.ux-card__media .e-con-inner{ padding: 0 !important; }

/* ===== Freccia (pulsante) — NON occupa spazio di layout ===== */
/* Copro sia la vecchia classe (.pulsante) sia la nuova (.ux-card__arrow) */
.ux-card .pulsante,
.ux-card .ux-card__arrow{
  position: absolute !important;    /* rimuove l’elemento dal flusso → niente vuoto */
  top: var(--ux-arrow-offset);
  right: var(--ux-arrow-offset);
  z-index: 3;

  /* niente margini del builder sul widget freccia */
  margin: 0 !important;

  /* stato “nascosto” ma senza occupare spazio */
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;

  transition: opacity .25s, transform .25s;
}
/* Mostra su hover/focus della card */
.ux-card:hover .pulsante,
.ux-card:focus-within .pulsante,
.ux-card:hover .ux-card__arrow,
.ux-card:focus-within .ux-card__arrow{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Stile interno dell’icona freccia (Elementor Icon widget) */
.ux-card .pulsante .elementor-icon,
.ux-card .ux-card__arrow .elementor-icon{
  display: grid; place-items: center; line-height: 1;
  width: calc(var(--ux-arrow-size) + 2*var(--ux-arrow-pad));
  height: calc(var(--ux-arrow-size) + 2*var(--ux-arrow-pad));
  border-radius: 999px; background: transparent;
}
.ux-card .pulsante .elementor-icon svg,
.ux-card .pulsante .elementor-icon i,
.ux-card .ux-card__arrow .elementor-icon svg,
.ux-card .ux-card__arrow .elementor-icon i{
  width: var(--ux-arrow-size); height: var(--ux-arrow-size); color: var(--ux-brand);
  transition: transform .2s;
}
.ux-card .pulsante:hover .elementor-icon svg,
.ux-card .pulsante:focus-visible .elementor-icon svg,
.ux-card .ux-card__arrow:hover .elementor-icon svg,
.ux-card .ux-card__arrow:focus-visible .elementor-icon svg{
  transform: translateX(2px);
}
.ux-card .pulsante:focus-visible .elementor-icon,
.ux-card .ux-card__arrow:focus-visible .elementor-icon{
  outline: 2px solid var(--ux-brand);
  outline-offset: 2px;
}



/**PULSANTE HOVER**/
/* Bottone base */

.btn-fill-up a.elementor-button {
  position: relative;
  overflow: hidden;
  z-index: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  background: none !important;
}

/* Bordo e background animato */
.btn-fill-up a.elementor-button::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #252525;
  z-index: 1;
  transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s ease;
}

.btn-fill-up a.elementor-button:hover::before {
  height: 100%;
  background-color: #B6D827;
}

/* Testo e freccia */
.btn-fill-up a.elementor-button .elementor-button-text,
.btn-fill-up a.elementor-button .elementor-button-icon {
  position: relative;
  z-index: 2;
}

/* Testo: cambio colore immediato ma fluido */
.btn-fill-up a.elementor-button:hover .elementor-button-text {
  color: #000;
  transition: color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Freccia: colore + movimento con ritardo ed easing */
.btn-fill-up a.elementor-button .elementor-button-icon {
  transition: color 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.15s,
              transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.15s;
}

.btn-fill-up a.elementor-button:hover .elementor-button-icon {
  color: #000;
  transform: translateX(4px);
}
  /*---------------------------*/
 
.angled-card-mesh {
  position: relative;
  overflow: hidden; /* mantiene il clip-path */
  background: #252525; /* colore di base */
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
  color: #fff;
  box-sizing: border-box;
  clip-path: polygon(
    1.5em 0,
    100% 0,
    100% calc(100% - 1.5em),
    calc(100% - 1.5em) 100%,
    0 100%,
    0 1.5em
  );
}

/* Layer animato mesh */
.angled-card-mesh::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;

  background: radial-gradient(at 30% 30%, #1C30E5 0px, transparent 60%),
              radial-gradient(at 70% 70%, #6D31FF 0px, transparent 60%);
  background-size: 300% 300%; /* più grande = movimento più visibile */
  animation: meshMove 12s ease-in-out infinite alternate;
}

/* Animazione più ampia */
@keyframes meshMove {
  0%   { background-position: 0% 30%, 100% 70%; }
  50%  { background-position: 80% 80%, 20% 20%; }
  100% { background-position: 0% 30%, 100% 70%; }
}

/* Mantieni i contenuti sopra */
.angled-card-mesh > * {
  position: relative;
  z-index: 1;
}

/**MENU**/
@media screen and (min-width: 769px) {
#settoriMobile{display:none!important;}
#settoriDesk{display:flex;}

}

@media screen and (max-width: 768px) {
  #settoriMobile{display:flex;}
  #settoriDesk{display:none!important;}
  #menubar-240 #settoriMobile {
/*  border-top: 1px solid #e5e7eb !important;
  border-bottom: 1px solid #e5e7eb !important;*/
}

#menu-toggle-240{margin-top:10px;}

}/* End custom CSS */