/* 
Theme Name: Hello Elementor Child
Theme URI: https://www.wpguiders.com/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by WPGuiders team
Author: Elementor Team
Author URI: https://www.wpguiders.com/
Template: hello-elementor
Version: 1.0.1
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
*/



/*a.elementskit-btn.whitespace--normal:hover {
  -webkit-box-shadow: 0px 0px 48px 12px rgb(2 121 193);
  -moz-box-shadow: 0px 0px 48px 12px rgb(2 121 193);
  box-shadow:0px 0px 48px 12px rgb(2 121 193);
  border:0px !important;
}*/


/* .elementskit-btn {
	position: relative !important;
	border-radius: 1rem !important;
	overflow: hidden !important;

	box-shadow:
		0 0 8px rgba(213, 223, 255, 0.25),
		inset 0 0 6px rgba(213, 223, 255, 0.2) !important;

	transition:
		box-shadow .4s ease,
		transform .4s ease !important;
}

.elementskit-btn::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;

	background: linear-gradient(
		120deg,
		transparent,
		rgba(213, 223, 255, 0.9),
		transparent
	);
	background-size: 200% 200%;

	mask:
		linear-gradient(#fff 0 0) content-box,
		linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;

	padding: 1px;
	opacity: 0;
}

.elementskit-btn:hover {
	transform: translateY(-3px);

	box-shadow:
		0 0 12px rgba(213, 223, 255, 0.55),
		0 0 28px rgba(213, 223, 255, 0.4),
		inset 0 0 10px rgba(213, 223, 255, 0.35) !important;
}

.elementskit-btn:hover::after {
	opacity: 1;
	animation: neon-border 3s linear infinite;
}

@keyframes neon-border {
	0% {
		background-position: 0% 50%;
	}
	100% {
		background-position: 200% 50%;
	}
}
*/

/* =========================================================
   Design System — Typography
   Responsive heading scale
========================================================= */

:root {

    /* Font sizes */
    --font-size-xs: 12px;
    --font-size-sm: 14px;
    --font-size-base: 16px;
    --font-size-md: 18px;
    --font-size-lg: 20px;
    --font-size-xl: 24px;
    --font-size-2xl: 32px;
    --font-size-3xl: 36px;
    --font-size-4xl: 48px;

    /* Line heights */
    --line-height-tight: 1.1;
    --line-height-base: 1.5;
    --line-height-relaxed: 1.7;

    /* Font weights */
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* Spacing */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;

}


#violetta h1.elementor-heading-title.elementor-size-default {
    font-weight: 800;
    background: linear-gradient(310deg, #fff 0%, #00a1d4 15%, #0277bf 55%, #54035a 75%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#violetta h2 {
    font-weight: 800;
    background: linear-gradient(310deg, #fff 0%, #00a1d4 15%, #0277bf 55%, #54035a 75%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


html,
body {
    overflow-x: hidden;
	  overflow-x: clip;
}


/* =========================================================
   LINK
========================================================= */
.elementor-kit-20 a:hover {
    color: #01071A;
    text-decoration: underline;
}

.ekit-wid-con a:active, .ekit-wid-con a:focus, .ekit-wid-con a:hover, .ekit-wid-con a:visited {
    text-decoration: underline!important;
	color:#fff;
}

a:hover.elementor-post__read-more {
    color:  #007DC2!important;
}

#titolo-servizi .elementor-post__title a:hover {
    text-decoration: underline;
    color:  #007DC2;
}


/* =========================================================
   Category News
========================================================= */

.category-news h2, .single-post h2 {
    font-size: var(--font-size-3xl);
    line-height: var(--line-height-tight);
    font-weight: var(--font-weight-semibold);
    margin-bottom: var(--spacing-md);
}


/* =========================================================
   Responsive
========================================================= */

@media screen and (max-width: 1024px) {

    .category-news h2, .single-post h2 {
        font-size: var(--font-size-2xl);
    }

}

@media screen and (max-width: 768px) {

    .category-news h2, .single-post h2 {
        font-size: 28px;
        line-height: 1.2;
    }

}

@media screen and (max-width: 480px) {

    .category-news h2, .single-post h2 {
        font-size: 24px;
    }

}


/* =========================================================
   BUTTON
========================================================= */

.elementskit-btn {
	position: relative !important;
	border-radius: 999px !important; /* pill perfetto */
	overflow: hidden !important;

	box-shadow:
		0 0 6px rgba(213,223,255,0.25),
		inset 0 0 4px rgba(213,223,255,0.2) !important;
}

.elementskit-btn::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;

	background: linear-gradient(
		90deg,
		transparent,
		rgba(213,223,255,0.9),
		transparent
	);
	background-size: 200% 100%;

	mask:
		linear-gradient(#fff 0 0) content-box,
		linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;

	padding: 1px;
}


.elementskit-btn:hover {
	box-shadow:
		0 0 10px rgba(213,223,255,0.45),
		0 0 22px rgba(213,223,255,0.35),
		inset 0 0 6px rgba(213,223,255,0.3) !important;
}

.elementskit-btn:hover::after {
	opacity: 1;
	animation: neon-border-horizontal 3s linear infinite;
}


.elementskit-btn::after {
	opacity: 1;
	animation: neon-border-horizontal 3s linear infinite;
}
@keyframes neon-border-horizontal {
	0% { background-position: 0%; }
	100% { background-position: 200%; }
}



div#commedia-clienti .single-client.image-switcher {
	position: relative;
	border-radius: 1.2rem;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.02);
	box-shadow:
		0 0 10px rgba(213, 223, 255, 0.15),
		inset 0 0 6px rgba(213, 223, 255, 0.12);
}

div#commedia-clienti .single-client.image-switcher::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;

	background: linear-gradient(
		90deg,
		transparent,
		rgba(213, 223, 255, 0.9),
		transparent
	);
	background-size: 200% 100%;

	mask:
		linear-gradient(#fff 0 0) content-box,
		linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;

	padding: 1px;
	opacity: .55;
}

div#commedia-clienti .single-client.image-switcher::after {
	animation: border-flow 6s linear infinite;
}


@keyframes border-flow {
	0%   { background-position: 0%; }
	100% { background-position: 200%; }
}


/*------ Gradiente titoli -----*/

span.commedia  {
	background: linear-gradient(310deg, #fff, #00a1d447 11%, #0387c6e0 68%, #0277bf 70%, #CB5BDCE3);
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

span.commedia2 {
	background: linear-gradient(310deg, #fff 0%, #00a1d447 15%, #0277bf 55%, #CB5BDCE3 75%);
    background-clip: text;
    -webkit-text-fill-color: transparent;
}



/* =====================================================
   PORTFOLIO – LOOP GRID
   overlay bottom 30% + titolo centrato verticalmente
   ===================================================== */

/* container item */
.portfolio .portfolio-item {
  position: relative;
  overflow: hidden;
}

/* image */
.portfolio .portfolio-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}

.portfolio .portfolio-item:hover img {
  transform: scale(1.05);
}

/* overlay – solo 30% bottom */
.portfolio .portfolio-item::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 30%;
  background-color: #01071ACF;
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 1;
  pointer-events: none;
}

.portfolio .portfolio-item:hover::after {
  opacity: 1;
}

/* titolo – centrato verticalmente nella fascia bottom */
.portfolio .portfolio-title {
  position: absolute;
  left: 24px;
  bottom: 0;
  height: 30%;
  z-index: 2;
  display: flex;
  align-items: center;
  max-width: 80%;
  margin: 0;
  color: #ffffff;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 0.02em;
  text-align: left;

  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.portfolio .portfolio-title h3 {
	margin: 12px;
}

.portfolio .portfolio-item:hover .portfolio-title {
  opacity: 1;
  transform: translateY(0);
}

/* BARRETTA LATERALE MENU MOBILE */

ul#menu-menu-mobile-it a.ekit-menu-nav-link::before,
ul#menu-menu-mobile-en a.ekit-menu-nav-link::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 2px;
    height: 33px;
    background: #0281c4;
	margin-left: 5px;
}

/* BORDINO PROGETTI E SEDI*/

div#progetti article.elementor-post.elementor-grid-item {
    background: linear-gradient(white, white) padding-box, linear-gradient(81deg, #53045b, #0b88c2) border-box;
    border-bottom: 6px solid transparent;
}

div#sedi {
    background: linear-gradient(white, white) padding-box, linear-gradient(81deg, #53045b, #0b88c2) border-box;
    border-bottom: 6px solid transparent;
    border-right: 1px solid transparent;
    border-left: 1px solid transparent;
    border-top: 1px solid transparent;
    border-radius: 13px;
    padding: 20px;
}

/* SFONDO ICONE PAGINA CHI SIAMO*/

.elementskit-info-box-icon.text-center {
    background: linear-gradient(37deg, #54045B 20%, var(--e-global-color-896f197) 100%);
}


/* NASCODNI FILTRO CASE STUDIES*/

.e-filter-item[data-filter="comunicazione-politica"],
.e-filter-item[data-filter="political-communication"] {
    display: none !important;
}

.e-filter-item[data-filter="sitefinity"],
.e-filter-item[data-filter="progress-sitefinity"] {
    display: none !important;
}

/* SCUOLA VOLO */

.scuola-droni {
    background:
  linear-gradient(
    to bottom,
    transparent 0%,
    transparent 38%,
    rgba(0, 31, 55, 0.20) 55%,
    rgba(0, 59, 93, 0.95) 100%
  ),
  linear-gradient(
    to right,
    #232e5b 0%,
    #202b55 25%,
    #1d284e 50%,
    #192342 75%,
    #192342 100%
  );
    );
}

/* ##################################################################################################### */
/* ### COOKIEBOT ### */
/* ##################################################################################################### */

:root {
    --cookiebot-primary:#232e5b;
    --cookiebot-secondary: #232e5b;
    --cookiebot-sfondo-interruttori: #54035a;
  }
  
  div#CybotCookiebotDialog {
    background: #ffffff;
  }
  
  body.browser-chrome div#CybotCookiebotDialog,
  body.browser-edge div#CybotCookiebotDialog {
    background: #ffffffcc;
    backdrop-filter: blur(4px);
  }
  
  #CybotCookiebotDialog h2,
  #CybotCookiebotDialogBodyContentText,
  .CybotCookiebotDialogBodyButton {
    color: var(--cookiebot-secondary) !important;
  }
  
  #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll {
    color: white !important;
  }
  
  #CybotCookiebotDialogTabContent .CybotCookiebotDialogBodyLevelButtonSlider {
    background-color: var(--cookiebot-secondary) !important;
  }
  #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton, #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonCustomize, #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection {
    background-color: #fff !important;
  }
  
  #CybotCookiebotDialogPoweredbyCybot svg {
    fill: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink:hover {
    color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink.active {
    border-bottom: 1px solid var(--cookiebot-primary) !important;
    color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogDetailBulkConsentLink:hover {
    color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton {
    border: 2px solid var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonCustomize,
  #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection {
    border-color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyButtonAccept,
  #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonAccept,
  #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll {
    background-color: var(--cookiebot-primary) !important;
    border-color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogDetailBodyContentIABv2Tabs .CybotCookiebotDialogBodyLevelButtonIABHeaderButton,
  #CybotCookiebotDialogDetailBodyContentIABv2Tabs .CybotCookiebotDialogBodyLevelButtonIABHeaderToggleDeselectVendorsLink,
  #CybotCookiebotDialogDetailBodyContentIABv2Tabs .CybotCookiebotDialogBodyLevelButtonIABHeaderToggleSelectVendorsLink {
    border: 2px solid var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogDetailBodyContentIABv2Tabs .CybotCookiebotDialogBodyLevelButtonIABHeaderButton.select,
  #CybotCookiebotDialogDetailBodyContentIABv2Tabs .CybotCookiebotDialogBodyLevelButtonIABHeaderToggleSelectVendorsLink {
    background-color: var(--cookiebot-primary) !important;
    border-color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyEdgeMoreDetails a {
    color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialog .CookieCard .CybotCookiebotDialogDetailBodyContentCookieContainerButton:hover,
  #CybotCookiebotDialog .CookieCard .CybotCookiebotDialogDetailBodyContentIABv2Tab:hover,
  #CybotCookiebotDialogBodyLevelButtonsSelectPane label:not([for=CybotCookiebotDialogBodyLevelButtonNecessary]) .CybotCookiebotDialogBodyLevelButtonDescription:hover,
  #CybotCookiebotDialogDetailBodyContentCookieContainerTypes .CybotCookiebotDialogDetailBodyContentCookieProvider:not(.CybotCookiebotDialogDetailBodyContentCookieInfoCount):hover {
    color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialogTabContent input:checked+.CybotCookiebotDialogBodyLevelButtonSlider {
    background-color: var(--cookiebot-sfondo-interruttori) !important;
  }
  
  @media screen and (min-width:601px) {
    #CybotCookiebotDialogTabContent input:focus+.CybotCookiebotDialogBodyLevelButtonSlider {
        box-shadow: 0 0 1px var(--cookiebot-primary) !important;
    }
  }
  
  #CybotCookiebotDialog #CybotCookiebotDialogDetailBodyContentIABv2Tabs input[type=checkbox]:checked {
    background-color: var(--cookiebot-primary) !important;
    border-color: var(--cookiebot-primary) !important;
  }
  
  #CybotCookiebotDialog #CybotCookiebotDialogBodyContentText a,
  #CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonIABHeaderViewPartnersLink,
  #CybotCookiebotDialog #CybotCookiebotDialogDetailBulkConsentList dt a,
  #CybotCookiebotDialog #CybotCookiebotDialogDetailFooter a,
  #CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonIABDescription a,
  #CybotCookiebotDialog .CybotCookiebotDialogDetailBodyContentCookieLink,
  #CybotCookiebotDialogDetailBodyContentTextAbout a {
    color: var(--cookiebot-primary) !important;
  }
  
  @media screen and (min-width:601px) {
    #CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonSliderWrapper input:focus-visible+span,
    #CybotCookiebotDialog :focus-visible {
        outline: var(--cookiebot-primary) solid 2px !important;
    }
  }
  
  /* -- Bottone consenso CookieBOt ----*/
  #CookiebotWidget #CookiebotWidget-buttons #CookiebotWidget-btn-change {
    background-color: var(--cookiebot-primary) !important;
    border-color: var(--cookiebot-primary) !important;
  }
  
  #CookiebotWidget #CookiebotWidget-buttons #CookiebotWidget-btn-withdraw {
  border-color: var(--cookiebot-primary) !important;
  }
  
  #CookiebotWidget .CookiebotWidget-consent-details button {
    color: var(--cookiebot-sfondo-interruttori) !important;
  }
  
  #CookiebotWidget .CookiebotWidget-body .CookiebotWidget-consents-list li.CookiebotWidget-approved svg {
    fill: var(--cookiebot-sfondo-interruttori)!important;
  }

#CybotCookiebotDialogNav #CybotCookiebotDialogNavList .CybotCookiebotDialogNavItemLink.CybotCookiebotDialogActive{
	border-bottom: 1px solid var(--cookiebot-primary);
	color: var(--cookiebot-primary);
}
  
  /*-------------------------------------------------------------------------------------------------------------------------------*/