﻿/*Variables*/

:root {
	--darker: #333333;
	--basebg: #F0F2F4;
	--gradient: linear-gradient(to right, #0277D2 0%, #9747FF 50%, #FFAE33 100%);
	--bdradius: 30px;
}

html {
	font-size: 18px;
}

body {
	font-family: "Manrope", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	background-color: white;
}

header {
	background-color: var(--basebg);
}

h2, h3, h4, h5, h1 {
	font-family: "Sora", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}

img {
	max-width: 100%;
}

.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
	max-width: 1420px;
}

.wrapper-col {
	padding: 3rem;
}

.base-padding {
	padding-bottom: 2.5rem;
}

.spacing-y {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

body.modal-open {
	overflow: hidden !important;
}

a {
	color: #212529;
}

	a:hover {
		color: #212529;
	}


/* #region Text formats */

.text-xxl {
	font-size: clamp(2.5rem, 7vw, 5.3rem);
	line-height: clamp(3rem, 7.5vw, 5.3rem);
}

.text-xl {
	font-size: clamp(2rem, 6vw, 5.3rem);
	line-height: clamp(2.5rem, 7vw, 6.3rem);
}

.text-l {
	font-size: clamp(1.7rem, 3.8vw, 4.4rem);
	line-height: clamp(1.7rem, 4vw, 5rem);
}

/* test clamp */
.text-ml {
	font-size: clamp(1.2rem, 4vw, 3.5rem);
	line-height: clamp(1.2rem, 4vw, 4.1rem);
}

.text-m {
	font-size: clamp(1.5rem, 3.5vw, 2.7rem);
	line-height: clamp(1.8rem, 3.6vw, 3rem);
}

.text-ms {
	font-size: clamp(1rem, 3vw, 2.2rem);
	line-height: clamp(1.4rem, 3.5vw, 3.3rem);
}

.text-s {
	font-size: clamp(1.2rem, 2.5vw, 1.7rem);
	line-height: clamp(1.5rem, 3vw, 2.2rem);
}

.text-xs {
	font-size: clamp(1rem, 2vw, 1.3rem);
	line-height: clamp(1.2rem, 2.5vw, 2rem);
}

.text-xxs {
	font-size: clamp(0.7rem, 1.5vw, 0.8rem);
	line-height: clamp(1rem, 2vw, 1.5rem);
}

.text-xxxs {
	font-size: clamp(0.6rem, 1.2vw, 0.72rem);
	line-height: clamp(0.8rem, 1.5vw, 1rem);
}

.text-label {
	font-size: clamp(0.9rem, 1.5vw, 1.1rem);
}

.gradient-text {
	background: var(--gradient);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	/* For Firefox */
	background-clip: text;
	color: transparent;
}

.mr-5 {
	margin-right: 5rem;
}


/*#endregion*/

.fullwidth {
	padding: 0 !important;
}

/* #region Button gradient  */
.button-gradient {
	position: relative;
	z-index: 1;
	border-radius: var(--bdradius);
	padding: 1rem 2rem;
	background-color: white;
	color: black;
	text-decoration: none;
	transition: color 0.3s ease;
	overflow: hidden;
	display: inline-block;
}

	.button-gradient::before {
		content: "";
		position: absolute;
		inset: 0;
		padding: 2px;
		background: var(--gradient);
		border-radius: inherit;
		-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
		-webkit-mask-composite: destination-out;
		mask-composite: exclude;
		z-index: -1;
	}

	.button-gradient::after {
		content: "";
		position: absolute;
		inset: 0;
		background: var(--gradient);
		border-radius: inherit;
		z-index: -2;
		opacity: 0;
		transition: opacity 0.3s ease;
	}

	.button-gradient:hover::after {
		opacity: 1;
	}

	.button-gradient:hover {
		color: white;
	}

/* #endregion BUTTON GRADIENT  */


.dropdown:hover > .dropdown-menu {
	display: block;
}

.dropdown > .dropdown-toggle:active { /*Without this, clicking will make it sticky*/
	pointer-events: none;
}

a.wrapperlink {
	color: unset;
	text-decoration: unset;
}

#languageDropdown.dropdown-toggle::after {
	content: "";
	margin: 0;
	height: 0;
	width: 0;
	top: 100%;
}

/* Stili per il popup di login/registrazione */
#popup-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 51, 102, 0.2);
	display: none;
	justify-content: center;
	align-items: center;
	z-index: 1000;
}

.popup {
	background: #fff;
	border-radius: 4px;
	width: 500px;
	box-shadow: 0 2px 16px rgba(0,0,0,0.2);
	font-family: 'Segoe UI', Arial, sans-serif;
	animation: popupIn 0.3s;
}

@keyframes popupIn {
	from {
		transform: scale(0.95);
		opacity: 0;
	}

	to {
		transform: scale(1);
		opacity: 1;
	}
}

.popup-header {
	background: #1566a2;
	color: #fff;
	padding: 16px;
	font-size: 18px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-radius: 4px 4px 0 0;
}

.popup-body {
	padding: 24px;
}

.section {
	margin-bottom: 20px;
}

	.section h3 {
		color: #1566a2;
		margin-bottom: 10px;
		font-size: 16px;
	}

label {
	font-size: 15px;
	color: #333;
	display: block;
	margin-top: 10px;
}

	label.umbraco-forms-label {
		font-size: inherit;
		color: black;
		padding-left: 5px;
	}


.umbraco-forms-field.dropdown select {
	border: none;
	border-bottom: 1px solid #bbb;
	width: 100%;
}



.login-btn, .register-btn {
	background: #fff;
	color: #1566a2;
	border: 1px solid #1566a2;
	border-radius: 4px;
	padding: 7px 18px;
	cursor: pointer;
	margin-bottom: 10px;
	font-size: 15px;
	transition: background 0.2s, color 0.2s;
}

	.login-btn:hover, .register-btn:hover {
		background: #1566a2;
		color: #fff;
	}

.forgot {
	display: block;
	color: #1566a2;
	font-size: 14px;
	margin-top: 8px;
	text-decoration: none;
	font-weight: bold;
}









/* NEW POPUP */
.popuplogin {
	background: white;
	border-radius: var(--bdradius);
	position: relative;
	max-width: 900px;
}


.close-btn {
	position: absolute;
	top: 3%;
	right: 3%;
	background: transparent;
	border-radius: var(--bdradius);
	border: none;
}

	.close-btn img {
		width: 30px;
		border: 1px solid black;
		padding: 8px 9px;
		border-radius: 50%;
	}

.logintop, .loginbottom {
	padding: 2rem 4rem;
}

.logintop {
	padding-top: 3rem;
}

.loginbottom {
	padding-bottom: 3rem;
	background-color: #F0F2F4;
	border-bottom-right-radius: var(--bdradius);
	border-bottom-left-radius: var(--bdradius);
}

.popuplogin .button-gradient {
	background-color: transparent;
}

.button-gradient .arrow-right.hover {
	display: none;
}

.button-gradient:hover .arrow-right.default {
	display: none;
}

.button-gradient:hover .arrow-right.hover {
	display: inline;
}

.logintop h3 {
	padding: 1rem 0;
	font-weight: 600;
}

.logintop h2 {
	font-weight: 600;
}

.loginbottom h3 {
	font-weight: 600;
}

hr {
	border: none;
	border-top: 1px solid #eee;
	margin: 20px 0;
}

.popuplogin .form-control {
	border: none;
	border-bottom: 1px solid #ccc;
	border-radius: 0;
	box-shadow: none;
	outline: none;
	padding-left: 0;
	padding-right: 0;
	margin: 0;
}

	/* Keep the border visible on focus */
	.popuplogin .form-control:focus {
		border-bottom: 1px solid #333;
		box-shadow: none;
	}

/* Optional: make labels bold like in your screenshot */
.popuplogin .form-label {
	display: none;
}

.btnforgot {
	text-decoration: none;
	color: black;
	font-weight: 600;
}


.header-gradient-bar {
	width: 100%;
	padding: 1.3rem;
	border-radius: 40px;
	background: var(--gradient);
	display: flex;
	justify-content: center;
	align-items: center;
}

	.header-gradient-bar span {
		color: #fff;
		font-size: 2rem;
		font-weight: bold;
	}

.dark-grey {
	color: #fff;
}

	.dark-grey .card {
		color: #000;
	}

.section-title {
	color: #1761a0;
	font-weight: bold;
	margin-bottom: 24px;
	margin-top: 24px;
	font-size: 18px;
}

/*GENERIC*/

.darker {
	background-color: var(--darker);
}

.w-fit {
	width: fit-content;
}

.white {
	color: white;
}

/* #region HEADER*/

.contain {
	object-fit: contain;
}

.cover {
	object-fit: cover;
}

.dropdown-menu {
	background-color: #333333;
	padding: 1rem 0;
	border-radius: 20px;
}

.wrappertoolbar {
	border-radius: var(--bdradius);
}


.toolbar {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	padding: 0 3rem;
}

.menu {
	display: flex;
	/*	flex-wrap: wrap;*/
	align-items: center;
	justify-content: space-between;
	background: white;
	border-radius: 50px;
	padding: 1.4rem 3rem;
}

	.menu .nav-link {
		padding: .5rem 10px;
	}

.nav-item a {
	color: #21272A;
	font-size: 1rem;
	font-weight: 600;
	display: flex;
	margin: 0 6px;
}

.nav-link:focus, .nav-link:hover {
	color: #21272A;
}

.dropdown-toggle::after {
	content: url('../images/vector.svg');
	display: flex;
	margin-left: 8px;
	border: none;
	vertical-align: 0;
	height: 1em;
	width: 1em;
	place-items: center;
	margin-top: 2px;
	transition: all 0.3s ease;
}

.dropdown-menu a {
	color: white;
	font-size: 0.9rem;
	font-weight: 400;
}

.dropdown-menu.autocomplete a {
	white-space: normal;
}

.dropdown-item:focus, .dropdown-item:hover {
	color: white;
	background-color: transparent;
}

.button-toolbar {
	padding: 7px 0;
	padding-right: 1.5rem;
	line-height: 1rem;
	align-items: center;
	display: flex;
	position: relative;
}

	.button-toolbar img {
		padding-right: 12px;
		height: 18px;
	}

	.button-toolbar a {
		text-decoration: none;
	}

		.button-toolbar a:hover {
			text-decoration: underline;
		}

	.button-toolbar button {
		background: none;
		border: none;
		padding: 0;
		color: black;
		display: flex;
	}

		.button-toolbar button:hover {
			text-decoration: underline;
		}

		.button-toolbar button img {
			/*margin-bottom: 3px;*/
		}

	.button-toolbar:last-of-type {
		padding-right: 0;
	}

.wrapper-search {
	display: flex;
	align-items: center;
}

.search-button {
	margin-right: 1rem;
}

	.search-button:hover {
		cursor: pointer;
	}

.site-search {
	position: fixed;
	left: 0;
	top: -100px;
	right: 0;
	z-index: 1000000;
	opacity: 0;
	-webkit-transition: opacity 0.3s, top 0.3s;
	transition: opacity 0.3s, top 0.3s;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	padding: 1.5rem 4rem 1.5rem 2rem;
	height: 100px;
	color: #333333;
	border-color: #d9d9d9;
	background-color: #ffffff;
	display: flex;
}

.search-form {
	position: relative;
	display: flex;
	align-items: center;
}

.site-search .site-search-close {
	right: 40px;
	left: initial;
	width: 20px;
	height: 20px;
	margin: -10px 0 0;
	font-size: 20px;
	position: absolute;
	top: 50%;
	cursor: pointer;
	transition: opacity 0.3s;
	text-align: center;
}

	.site-search .site-search-close:before {
		content: url('../images/close_small.svg');
	}

.search-form .search-form-icon:before {
	content: url('../images/search.svg');
}

.site-search .search-form .search-form-icon {
	margin-bottom: -6px;
}

.site-search .search-form .search-form-field {
	padding: 0 0 0 50px;
	border: none;
	-webkit-border-radius: 0;
	border-radius: 0;
	height: 25px;
	line-height: 25px;
}

.search-form .search-form-field {
	background: none;
	outline: none;
	padding: 0 55px 12px 0;
	height: 40px;
	font-size: 16px;
	line-height: 22px;
	font-weight: 400;
	margin: 0;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.site-search.active {
	top: 0;
	opacity: 1;
}

.site-search-overlay, .site-menu-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5); /* semi-transparent black */
	z-index: 999; /* below site-search */
	display: none; /* hidden by default */
}

/* #endregion */

#swiperHome {
	background-color: var(--basebg);
}

	#swiperHome .swiper-slide > img {
		border-radius: var(--bdradius);
		min-height: 300px;
		object-fit: cover;
		max-height: 870px;
	}

	#swiperHome .swiper-slide video {
		width: 100%;
		max-height: 870px;
		object-fit: cover;
		position: relative;
		display: block;
		vertical-align: middle;
		border-radius: var(--bdradius);
	}

	#swiperHome .videoimgwrapper {
		position: relative;
		width: 100%;
		aspect-ratio: 16 / 9;
		overflow: hidden;
		max-height: 740px;
		min-height: 300px;
	}

		#swiperHome .videoimgwrapper img, #swiperHome .videoimgwrapper video {
			width: 100%;
			height: 100%;
			max-height: 740px;
			object-fit: cover;
			display: block;
			border-radius: var(--bdradius);
		}
/*"COMPONENT"*/
.wrapper-2col {
	padding: 3.5rem 0;
}

.wrapper-image {
	border-radius: 2.2rem;
	object-fit: cover;
	object-position: center;
	min-height: 500px;
}


/* #region Carousel Home */
.content-slider {
	position: absolute;
	background: white;
	border-radius: var(--bdradius);
	height: 85%;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	margin: 0 1rem;
	max-width: 40%;
	display: flex;
	flex-direction: column;
	place-content: space-evenly;
	padding: 3rem;
}

#swiperHome .swiper-slide .imageslide, #swiperHome swiper-slide > video {
	border-radius: var(--bdradius);
	min-height: 740px;
	object-fit: cover;
}

a.btndark {
	max-width: 260px;
	background-color: #333;
	color: white;
	text-align: center;
	text-decoration: none;
	padding: 1rem;
	border-radius: var(--bdradius);
}

	a.btndark:hover {
		background: var(--gradient);
	}

button.btndark {
	max-width: 220px;
	background-color: #333;
	color: white;
	text-align: center;
	text-decoration: none;
	padding: 1rem 4rem;
	border: none;
	border-radius: 40px;
	margin: 1.5rem 0;
}

	button.btndark:hover {
		background: var(--gradient);
	}


#caroselgeneric, #carousel-pages {
	margin: 2rem 4%;
	margin-right: 0;
}


	#caroselgeneric .swiper-slide, #carousel-pages .swiper-slide {
		background-color: #F0F2F4;
		padding: 1.7rem;
		border-radius: var(--bdradius);
	}

.light-grey #caroselgeneric .swiper-slide, .light-grey #carousel-pages .swiper-slide {
	background-color: white;
}

#caroselgeneric .sliderimage, #carousel-pages .sliderimage, #carosel-related-othercat .sliderimage, #carosel-related-otherprod .sliderimage, #carosel-components .sliderimage, #carosel-gallery .sliderimage, #carosel-related-prod .sliderimage, #carousel-related-realizations .sliderimage {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--bdradius);
	aspect-ratio: 1;
	max-height: 550px;
}

.content-card {
	display: flex;
	padding: 1rem;
	padding-top: 2rem;
	align-items: center;
}

	.content-card h5 {
		margin: 0;
	}

	.content-card .btnlink {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		aspect-ratio: 1 / 1;
		width: 48px;
		background-color: black;
		border-radius: 50%;
		padding: 10px;
		text-decoration: none;
	}

		.content-card .btnlink img {
			width: 50%;
			height: auto;
		}

#caroselgeneric .swiper-wrapper, #carousel-pages .swiper-wrapper, #carousel-sectors .swiper-wrapper {
	padding-bottom: 4rem;
}

#caroselgeneric .swiper-pagination, #carousel-sectors .swiper-pagination, #carousel-pages .swiper-pagination, #carosel-related-othercat .swiper-pagination, #carosel-related-otherprod .swiper-pagination, #carosel-components .swiper-pagination, #carosel-gallery .swiper-pagination, #carosel-related-prod .swiper-pagination, #carosel-variants .swiper-pagination, #carousel-related-realizations .swiper-pagination {
	text-align: left;
}


#caroselgeneric .swiper-pagination-bullet, #carousel-sectors .swiper-pagination-bullet, #carousel-pages .swiper-pagination-bullet, #carosel-related-othercat .swiper-pagination-bullet, #carosel-related-otherprod .swiper-pagination-bullet, #carosel-components .swiper-pagination-bullet, #carosel-gallery .swiper-pagination-bullet, #carosel-related-prod .swiper-pagination-bullet, #carosel-variants .swiper-pagination-bullet, #swiperHome .swiper-pagination-bullet, #carousel-related-realizations .swiper-pagination-bullet {
	width: 18px;
	height: 18px;
	transition: width 0.3s ease;
	border-radius: 20px;
}

#caroselgeneric .swiper-pagination-bullet-active, #carousel-sectors .swiper-pagination-bullet-active, #carousel-pages .swiper-pagination-bullet-active, #carosel-related-othercat .swiper-pagination-bullet-active, #carosel-related-otherprod .swiper-pagination-bullet-active, #carosel-components .swiper-pagination-bullet-active, #carosel-gallery .swiper-pagination-bullet-active, #carosel-related-prod .swiper-pagination-bullet-active, #carosel-variants .swiper-pagination-bullet-active, #swiperHome .swiper-pagination-bullet-active, #carousel-related-realizations .swiper-pagination-bullet-active {
	background: var(--gradient);
	width: 70px;
	border-radius: 20px;
}

.darker .swiper-pagination-bullet {
	background-color: white;
}
/* #endregion */
.media-wrapper {
	margin: 0 2rem;
	position: relative;
}

	.media-wrapper img {
		max-height: 700px;
		object-fit: cover;
		border-radius: var(--bdradius);
		min-height: 350px;
	}

.verticalwrapper, .verticalimg {
	border-radius: var(--bdradius);
}

.verticalwrapper {
	margin: 0 2rem;
	padding: 2rem;
}

	.verticalwrapper .button-gradient {
		margin: 1rem 0;
	}


.verticaltitle {
	padding: 3% 20% 3% 5%;
}

.vertical-carousel-stack {
	padding-left: 0;
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: repeat(var(--cards), var(--cardHeight));
	gap: var(--cardMargin);
	padding-bottom: calc(var(--cards) * var(--cardTopPadding));
	margin-bottom: var(--cardMargin);
}

#verticalslider-0 {
	--index: 1;
}

#verticalslider-1 {
	--index: 2;
}

#verticalslider-2 {
	--index: 3;
}

#verticalslider-3 {
	--index: 4;
}

.vertical-slide {
	position: sticky;
	top: 0;
	padding-top: calc(var(--index) * var(--cardTopPadding));
}

	.vertical-slide img {
		box-sizing: border-box;
		height: var(--cardHeight);
		display: flex;
		justify-content: center;
		align-items: center;
		transition: all 0.5s;
		max-height: 600px;
		min-height: 300px;
		object-fit: cover;
		border-radius: var(--bdradius);
		width: 100%;
		margin: 1rem 0;
	}


.overlap-sentinel {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	pointer-events: none;
	z-index: 10;
}

.vertical-slide.is-overlapped img {
	/* progress goes from 0 (not covered) to 1 (fully covered) */
	transform: scale(calc(1 - 0.15 * var(--overlap-progress, 0)));
	filter: brightness(calc(1 - 0.4 * var(--overlap-progress, 0)));
	transition: transform 0.1s, filter 0.1s;
	z-index: 1;
}



.wrappercta {
	padding: 7% 10%;
	margin: 0 2rem;
	border-radius: var(--bdradius);
	display: flex;
}

	.wrappercta .button-gradient {
		margin: 1rem 0;
	}

.darker.button-gradient {
	background-color: #333333;
	color: white;
}
/*FOOTER*/

footer {
	margin: 0 2rem;
	border-radius: var(--bdradius);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

	footer .socials img {
		width: 20px;
	}

.logofooter {
	width: 100%;
	max-width: 200px;
}

.footerwrapper {
	padding: 0 4%;
	padding-top: 5rem;
}

.socials {
	margin-top: 2rem;
}

	.socials a {
		margin: 0 10px;
	}

.footergrey {
	color: #B7B7B7;
}

.footerwrapper .nav li a {
	color: #B7B7B7;
	text-decoration: none;
}

	.footerwrapper .nav li a:hover {
		color: white;
		text-decoration: underline;
		cursor: pointer;
	}

.copywrapper {
	display: flex;
	background-color: white;
	color: black;
	place-self: center;
	padding: 0.5rem 10%;
	border-radius: 20px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	margin-top: 2rem;
}

	.copywrapper p {
		margin: 0;
	}

.sendwrapper {
	background: #434343;
	border-radius: 10px;
	padding: 0.5rem 0;
}

	.sendwrapper input, .sendwrapper input:focus {
		background: #434343;
		border: none;
		margin: 0;
		outline: none;
		box-shadow: none;
		color: white;
		padding-left: 50px
	}

		.sendwrapper input:before {
			content: url('../images/mail.svg');
		}


		.sendwrapper input::placeholder {
			color: #B7B7B7;
		}

button.btnsend {
	background: none;
	border: none;
	margin-right: 0.7rem;
}

.btnsend img {
	height: 17px;
}


/*	HEADRE MOBILE */

.wrapper-mobile {
	display: none;
}

header.sticky .wrapper-mobile {
	padding: 0;
}

.mobileheader {
	display: flex;
	justify-content: space-between;
	background: white;
	border-radius: var(--bdradius);
	padding: 0 1rem;
	align-items: center;
}

header.sticky .mobileheader {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.wrapper-mobile .nav-item a {
	font-size: 0.8rem;
}

.wrapper-mobile .dropdown-item:focus, .wrapper-mobile .dropdown-item:hover {
	color: black;
}

.wrapper-mobile hr {
	height: 2px;
	color: grey;
}

.logomobile img {
	max-height: 30px;
	margin: 1rem 0;
	margin-left: 0.2rem;
}

.menumobile {
	display: none;
	background: white;
	z-index: 1000;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	max-width: 400px;
	padding: 10px 20px;
	height: 100%;
	overflow: auto;
}

.wrapper-mobile .nav-item:hover > a {
	font-weight: 800;
}

.wrapper-mobile a.dropdown-item:hover {
	font-weight: 800;
}

.nav-item.dropdown.label.active-dropdown .dropdown-toggle::after {
	transform: rotate(-180deg); /* Rotate when active */
}

.dropdown-menu-mobile {
	list-style: none;
	padding-left: 10px;
	display: none;
	z-index: 9999;
}

	.dropdown-menu-mobile .dropdown-item {
		white-space: normal;
	}

.navmobile {
	list-style: none;
	margin: 0;
	padding: 0;
}

.wrapper-buttons-mobile {
	text-align: right;
	margin: 1rem 0;
}

.toolbarmobile ul {
	list-style: none;
	padding: 0 10px;
	margin: 0 8px;
	margin-bottom: 20px;
}

.toolbarmobile li a {
	color: black;
}

header.sticky {
	position: fixed;
	width: 100%;
	top: 0;
	z-index: 999;
}

/*IMPORTED HAMB*/
.header-icons-container {
	align-content: center;
}

	.header-icons-container .header-icon {
		margin: 4px;
	}

.header-icon {
	color: #333333;
}

.menu-trigger {
	position: relative;
}

	.menu-trigger .menu-trigger-icon {
		display: block;
		width: 26px;
		height: 23px;
		cursor: pointer;
		text-align: center;
		-webkit-transition: color 0.3s, background-color 0.3s;
		transition: color 0.3s, background-color 0.3s;
	}

	.menu-trigger .hamburger {
		display: block;
		width: 26px;
		height: 15px;
		position: absolute;
		left: 50%;
		right: auto;
		top: 50%;
		margin: -6px 0 0 -13px;
	}

		.menu-trigger .hamburger span:first-child {
			margin-bottom: 4px;
		}

		.menu-trigger .hamburger span {
			height: 2px;
			width: 26px;
			display: block;
			opacity: 1;
			-webkit-transition: all 0.3s ease;
			transition: all 0.3s ease;
		}

			.menu-trigger .hamburger span:last-child {
				margin-top: 4px;
				width: 10px;
				float: right;
				-webkit-transition: width 0.3s;
				transition: width 0.3s;
			}

		.menu-trigger .hamburger:hover span:last-child {
			width: 100%;
		}

		.menu-trigger .hamburger span {
			background-color: #333333;
		}

/* Prodotti */

.headerbg {
	background-color: var(--basebg);
	border-bottom-left-radius: var(--bdradius);
	border-bottom-right-radius: var(--bdradius);
	padding-bottom: 2rem;
}

.wrapperheader {
	position: relative;
}

	.wrapperheader .wrapheader-left.cover img {
		object-fit: cover;
	}

	.wrapperheader .wrapheader-left.contain img {
		object-fit: contain;
	}

.headerimage {
	object-fit: cover;
	height: 500px;
	width: 100%;
	border-radius: var(--bdradius);
	/* Remove horizontal positioning */
	position: relative; /* or keep static */
	left: auto;
	transform: translateY(0); /* initial state */
	transition: transform 0.1s linear;
}

.wrapperheader::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4); /* semi‑transparent black overlay */
	/*  background: linear-gradient(to bottom, rgba(0,0,0,0.3), rgba(0,0,0,0.7)); 
    uncomment for a gradient instead */
	border-radius: inherit; /* keep same rounded corners */
	pointer-events: none; /* clicks pass through */
	z-index: 1; /* sit above the img */
	border-radius: var(--bdradius);
}

.wrapperheader#productHeader::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: none;
	border-radius: inherit; /* keep same rounded corners */
	pointer-events: none; /* clicks pass through */
	z-index: 1; /* sit above the img */
	border-radius: var(--bdradius);
}


.contentheader {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 5%;
	z-index: 1;
}

.breadcrumbwrapper {
	position: absolute;
	bottom: 0;
	right: 4%;
	background: var(--basebg);
	margin: 0;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	z-index: 1;
}

.breadcrumb {
	position: relative;
	/* previously transparent – now white */
	background-color: var(--basebg);
	padding: 0.7rem 1rem;
	padding-bottom: 0.4rem;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	margin: 0;
}

.breadcrumbwrapper:before, .breadcrumbwrapper:after {
	box-shadow: 0 20px 0 0 var(--basebg);
}

.breadcrumbwrapper:before {
	right: 100%;
	border-bottom-right-radius: 20px;
}

.breadcrumbwrapper:after {
	left: 100%;
	border-bottom-left-radius: 20px;
}

.breadcrumbwrapper:before, .breadcrumbwrapper:after {
	content: "";
	position: absolute;
	background-color: transparent;
	bottom: 0;
	height: 40px;
	width: 10px;
}

.breadcrumb-item, .breadcrumb-item a {
	color: black;
	font-weight: 600;
	text-decoration: none;
}

	.breadcrumb-item a {
		position: relative;
		display: inline-block;
		padding-bottom: 1px; /* space for the border */
		text-decoration: none;
		font-weight: 500;
	}

	.breadcrumb-item.active {
		color: black;
		font-weight: 600;
	}

	.breadcrumb-item a::after {
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		height: 2px;
		width: 100%;
		background: var(--gradient); /* your gradient here */
		pointer-events: none;
	}

	.breadcrumb-item.active a::after {
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		height: 2px;
		width: 100%;
		background: transparent; /* your gradient here */
		pointer-events: none;
	}

.wrapperheader h3 {
	font-weight: 300;
}

.wrapheader-left, .wrapheader-right {
	max-height: 700px;
}

.wrapheader-right {
	background-color: white;
	border-radius: var(--bdradius);
	min-height: 700px;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 7% 3%;
}

	.wrapheader-right h3 {
		padding: 1rem 0;
	}

.wrapperheader .wrapheader-left > img {
	height: 700px;
	border-radius: var(--bdradius);
}

.wrapperheader .wrapheader-left.contain > img {
	object-fit: contain;
}

.wrapperheader .wrapheader-left.cover > img {
	object-fit: cover;
}
/* LIST */
.wrapperitem {
	margin: 1rem 0;
	border: 1px solid #eaeaea;
	border-radius: var(--bdradius);
	width: 100%;
}

	.wrapperitem > img {
		border-radius: var(--bdradius);
		width: 100%;
		height: 390px;
		object-fit: contain;
	}

#experiences-list .wrapperitem > img {
	border-radius: var(--bdradius);
	width: 100%;
	height: 390px;
	object-fit: cover;
}

.imagelist {
	border-radius: var(--bdradius);
}

.contentitem {
	padding: 1rem 2rem;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.wrapperlist .card-img-top {
	border-radius: var(--bdradius);
	height: 350px;
	object-fit: contain;
}

.contentitem h5 {
	max-width: 80%;
}

.contentitem a img {
	min-width: 50px;
}

/* carosel related */

.wrapper-related-othercategories, .wrapper-related-otherproducts {
	margin: 0 2rem;
	background-color: var(--basebg);
	border-radius: var(--bdradius);
	padding: 1rem 2rem;
	padding-top: 2rem;
}

.wrapper-related-products {
	margin: 0;
	background-color: var(--basebg);
	border-radius: var(--bdradius);
	padding: 1rem 0;
	padding-top: 2rem;
}

.wrapper-related-othercategories h2, .wrapper-related-otherproducts h2 {
	padding-left: 2rem;
}

#carosel-related-othercat .swiper-slide, #carosel-related-otherprod .swiper-slide, #carosel-related-prod .swiper-slide {
	background-color: white;
	padding: 0;
	border-radius: var(--bdradius);
	min-height: -webkit-fill-available;
	min-height: -moz-available;
}

#carousel-related-realizations .swiper-slide {
	background-color: white;
	padding: 0;
	border-radius: var(--bdradius);
	min-height: -webkit-fill-available;
	min-height: -moz-available;
	border: 1px solid #EAEAEA;
}

#carosel-related-othercat, #carosel-related-otherprod {
	padding: 2rem;
	padding-bottom: 4rem;
}

#carosel-related-prod, #carousel-related-realizations {
	padding: 2rem 0;
	padding-bottom: 4rem;
}

	#carosel-related-othercat .content-card, #carosel-related-otherprod .content-card, #carosel-related-prod .content-card, #carousel-related-realizations .content-card {
		padding: 1rem;
	}


	#carosel-related-otherprod .swiper-slide .imageslide, #carosel-related-prod .swiper-slide .imageslide {
		max-height: 440px;
		min-height: 400px;
		object-fit: contain;
		height: 100%;
		width: 100%;
		border-radius: var(--bdradius);
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}

	#carousel-related-realizations .swiper-slide .imageslide {
		height: 400px;
		object-fit: cover;
		width: 100%;
		border-radius: var(--bdradius);
	}

	#carousel-related-realizations .content-card img {
		margin-left: auto;
	}

	#carousel-related-realizations .content-card {
		display: flex;
		flex-direction: column;
	}

#carosel-related-othercat .swiper-slide .imageslide {
	object-fit: cover;
	height: 440px;
	width: 100%;
	border-radius: var(--bdradius);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
/*products*/

.leftFeatures {
	background: url(/images/backgroundfeature.jpg);
	background-position: center;
	background-size: cover;
	border-radius: var(--bdradius);
	padding: 2rem;
	height: 100%;
}

.rightFeatures {
	background-color: var(--basebg);
	border-radius: var(--bdradius);
	padding: 2rem;
}

	/*bullets point personalized*/

	.rightFeatures ul {
		list-style: none; /* remove default bullets */
		padding: 0;
		margin: 0;
	}

	.rightFeatures li {
		position: relative;
		padding-left: 32px;
		margin-bottom: 8px;
	}

		.rightFeatures li::before {
			content: "";
			position: absolute;
			left: 1%;
			top: 50%;
			transform: translateY(-50%);
			width: 10px;
			height: 10px;
			background-image: url(/images/backgroundfeature.jpg);
			background-size: cover;
			background-repeat: no-repeat;
			background-position: center;
			border-radius: var(--bdradius);
		}

.wrappercomponents {
	border-radius: var(--bdradius);
}


	.wrappercomponents iframe {
		max-width: 100%;
	}

.verticalwrapper, .wrappercomponents {
	margin: 0 2rem;
	padding: 4rem;
}

#carosel-components .swiper-wrapper {
	margin-top: 3rem;
	padding-bottom: 4rem;
}

.contentimg-wrapper {
	background-color: white;
	border-radius: var(--bdradius);
	color: black;
}

	.contentimg-wrapper img {
		border-radius: var(--bdradius);
		width: 100%;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}

	.contentimg-wrapper h5 {
		padding: 1rem;
		padding-bottom: 1rem;
	}

		.contentimg-wrapper h5 p {
			margin-bottom: 0;
		}

.contentnoimg-wrapper {
}

/* gallery */

.wrapper-gallery {
	margin: 0 4rem;
	text-align: center;
}

	.wrapper-gallery .swiper-slide img {
		border-radius: var(--bdradius);
		max-height: 600px;
		min-height: 600px;
		width: 100%;
		object-fit: cover;
	}

	.wrapper-gallery .swiper-wrapper {
		padding-bottom: 3rem;
	}

/* Form+text */

.wrapperform {
	background: white;
	border-radius: var(--bdradius);
	padding: 1rem 2rem;
}

.wrapperformtext {
	border-radius: var(--bdradius);
	padding: 3rem;
}

	.wrapperformtext h2 {
		font-weight: 600;
	}

.textform {
	margin-top: 3%;
	padding-right: 3%;
}

.wrapperform .umbraco-forms-form input.text, .wrapperform .umbraco-forms-form textarea, .wrapperform .umbraco-forms-form select {
	width: 100% !important;
	max-width: 100% !important;
	border: none;
	border-bottom: 1px solid #C8C8C8;
	border-radius: 0;
	margin: 2rem 0;
}

.wrapperform .umbraco-forms-form select {
	display: block;
	font-weight: bold;
	padding: 5px 0;
}

	.wrapperform .umbraco-forms-form select:focus {
		border-top: none;
		border-right: none;
		border-left: none;
	}

.wrapperform .umbraco-forms-field input::placeholder, .wrapperform .umbraco-forms-form textarea::placeholder {
	font-weight: bold;
	color: black;
}

.wrapperform .umbraco-forms-field input:focus-visible, .wrapperform .umbraco-forms-field textarea:focus-visible {
	outline: none;
}

.wrapperform .umbraco-forms-field input:focus, .wrapperform .umbraco-forms-field textarea:focus {
	outline: none;
}

.wrapperform .umbraco-forms-form input.text:focus, .umbraco-forms-form input.title:focus, .umbraco-forms-form select:focus, .umbraco-forms-form textarea:focus {
	border-top: none;
	border-left: none;
	border-right: none;
}

.wrapperform .umbraco-forms-form textarea {
	height: 60px;
}

.wrapperform input[type="email"], input[type="password"] {
	font-size: 18px;
}


/* Accordion */

#productAccessories .accordion-item {
	background: transparent;
	border: none;
}

	#productAccessories .accordion-item .accordion-header button {
		background: transparent;
		padding: 1.4rem 0;
		border-top: 1px solid #D9D9D9;
		border-radius: 0;
		font-weight: 500;
	}

#productAccessories .accordion-button:focus {
	z-index: 3;
	border-color: none;
	outline: 0;
	box-shadow: none;
}

#productAccessories .accordion-button::after {
	color: black;
	background-image: url('../images/arrow_up.svg');
	transform: rotate(-180deg);
}

#productAccessories .accordion-button:not(.collapsed) {
	box-shadow: none;
	color: black;
}

	#productAccessories .accordion-button:not(.collapsed)::after {
		background-image: url('../images/arrow_up.svg');
		transform: rotate(0);
	}

#productAccessories .accordion-body {
	border-top: 1px solid #D9D9D9;
	padding: 1rem 0
}

	#productAccessories .accordion-body > a {
		text-decoration: none;
		color: black;
		padding: 0.7rem 0;
		display: flex;
		justify-content: space-between;
	}

		#productAccessories .accordion-body > a img {
			transition: all 0.5s ease;
		}


		#productAccessories .accordion-body > a:hover {
			cursor: pointer;
		}

			#productAccessories .accordion-body > a:hover img {
				cursor: pointer;
				transform: rotate(180deg);
			}

.showmore {
	width: 100%;
	text-align: center;
	margin: 2rem 0;
}

.showmorebtn {
	background: transparent;
}

	.showmorebtn img {
		margin-left: 0.6rem;
		width: 15px;
	}

	.showmorebtn:hover img {
		content: url('../images/arrow_up_white.svg');
		margin-left: 0.6rem;
		width: 15px;
	}

#productAccessories .modal-dialog {
	max-width: 900px;
	margin: auto;
	height: 100%;
	place-content: center;
}

#productAccessories .modal-header {
	border-bottom: none;
}

#productAccessories table tr td {
	border-bottom: 0;
	padding: 0.6rem 1rem;
	word-break: break-word;
}

#productAccessories table th {
	padding: 0.6rem 1rem;
}

#productAccessories thead tr {
	background: var(--gradient);
}

#productAccessories table th:first-child {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}

#productAccessories table th:last-child {
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	text-align: center;
}

#productAccessories table tr td:last-child {
	text-align: center;
}

.hiddenacc {
	display: none;
}

/* Document related */

.docs-grid {
}

.doc-card {
	border: 1px solid #e0e0e0;
	border-radius: 5px;
	background: #fff;
	display: flex;
	flex-direction: column;
	text-decoration: none;
	padding: 1rem 2rem;
	color: black;
	text-transform: capitalize;
	height: 100%;
	justify-content: center;
	position: relative;
	padding-left: 70px;
}

	.doc-card.locked {
		background: #F0F2F4;
	}

		.doc-card.locked:hover {
			color: black;
			cursor: cursor;
		}

		.doc-card.locked .doc-icon {
			color: #888;
		}

	.doc-card.unlocked .doc-icon {
		color: #1761a0;
	}

.doc-title {
	font-weight: bold;
	margin-bottom: 4px;
	text-decoration: none;
}

.doc-size {
	font-style: italic;
	font-size: 15px;
	color: #222;
	text-decoration: none;
}

.doc-card::before {
	content: "";
	position: absolute;
	left: 5%;
	width: 40px;
	height: 40px;
	background-image: url(../images/picture_as_pdf.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.doc-card.locked::before {
	background-image: url(../images/lock_blue.svg);
}


/* Vintage */

.wrappervintage img {
	width: 100%;
	max-height: 330px;
	object-fit: cover;
	object-position: top;
	border-radius: var(--bdradius);
	transition: transform 0.5s ease;
	display: block;
}

.wrappervintage .card {
	border-radius: var(--bdradius);
	height: 100%;
}

.wrappervintage a {
	color: black;
	text-decoration: none;
}

	.wrappervintage a:hover {
		color: black;
		text-decoration: none;
		cursor: pointer;
	}

.wrappervintage {
	overflow: hidden;
	border-radius: var(--bdradius);
	position: relative;
}

	.wrappervintage, .wrappervintage img {
		box-sizing: border-box;
	}

button.news-page-btn.active {
	font-weight: bold;
	background-color: #333;
	color: white;
}

/* insight */
.imginsight {
	position: relative;
}

	.imginsight img {
		width: 100%;
		border-radius: var(--bdradius);
	}

.insightlist .imginsight img {
	width: 100%;
	border-radius: var(--bdradius);
	height: 300px;
	object-fit: cover;
}

.contentinsight {
	display: flex;
	justify-content: space-between;
}

.insight {
	border: 1px solid #EAEAEA;
	border-radius: var(--bdradius);
	height: 100%;
	justify-content: space-between;
	display: flex;
	flex-direction: column;
}

.abs {
	position: absolute;
	bottom: 0;
	left: 1%;
	background-color: white;
	padding: 10px 2rem;
	border-radius: 15px;
	border-bottom-right-radius: 0;
}

	.abs:after {
		box-shadow: 0 5px 0 0 white;
		content: "";
		position: absolute;
		background-color: transparent;
		bottom: 0;
		height: 40px;
		width: 6px;
		left: 100%;
		border-bottom-left-radius: 20px;
	}

/* variant carosel */

.wrapper-variant {
	margin: 0 2rem;
	padding: 1rem 2rem;
	padding-top: 2rem;
}

#carosel-variants .swiper-slide > .imageslide {
	max-height: 440px;
	object-fit: contain;
	height: 100%;
	width: 100%;
	border-radius: var(--bdradius);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

#carosel-variants .swiper-slide {
	background-color: white;
	padding: 0;
	border-radius: var(--bdradius);
}

#carosel-variants {
	padding: 2rem 0;
	padding-bottom: 4rem;
}

.arrow-right {
	width: 16px;
	margin-left: 1rem;
	margin-bottom: 3px;
	transform: rotate(90deg);
}

/* AWARD */

.wrapperawards {
	padding: 4rem 0;
}

.wrapperaward {
	align-content: center;
}

/* map location */
.wrappermap .nav select {
	width: 100%;
	border: 1px solid #CACACA;
	border-radius: 10px;
	padding: 0.5rem 1rem;
	color: #808080;
	margin-top: 1rem;
}

.wrappermap .nav, .wrapperealization .nav {
	flex-wrap: nowrap;
	width: 100%;
}

.wrapperealization {
	width: auto;
	margin: 2rem auto;
}


.wrappermap {
	max-width: 800px;
	place-self: center;
}

	.wrappermap .nav:first-child, .wrapperealization .nav:first-child {
		background: #EEEEEF;
		margin: 0;
		border-radius: 10px;
	}

	.wrappermap .nav-link.active, .wrapperealization .nav-link.active {
		background: white;
		border-right: 0;
		box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.12);
		font-weight: 600;
		height: 100%;
	}

	.wrappermap .nav-link, .wrapperealization .nav-link {
		font-weight: 500;
		background: #EEEEEF;
		margin: 0;
		border-radius: 10px;
	}

	.wrappermap .nav .nav-item, .wrapperealization .nav .nav-item {
		align-content: center;
	}

	.wrappermap .nav select:focus-visible {
		outline: none;
	}

	.wrappermap .nav select option {
		color: black;
	}

	.wrappermap .nav select {
		appearance: none;
		background: url('../images/arrow_down.svg') no-repeat right 0.75rem center/1rem auto;
		padding-right: 2rem;
	}


/*form register */

.wrappergradient {
	margin: 1rem 2rem;
}

.custom-input, .custom-input input[type="email"], .custom-input input[type="password"] {
	background-color: transparent;
	border: none;
	border-bottom: 1px solid black;
	border-radius: 0;
	box-shadow: none;
	padding: 8px 4px;
	height: 40px;
	font-size: 16px;
	width: 100%;
	transition: border-color 0.3s;
	margin-bottom: 5px;
}

.wrapperfields .custom-input {
	margin-top: 1rem;
}

.custom-input:focus {
	outline: none;
	border-bottom: 1px solid #000;
	background-color: transparent;
	box-shadow: none;
}

.custom-input::placeholder {
	color: black;
}

.custom-input input[type="email"], .custom-input input[type="password"] {
	margin: 0;
}

select.custom-input {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: transparent;
}

#azienda label, #privato label {
	display: none
}

#azienda .wrappercheckbox label, #privato .wrappercheckbox label {
	display: block;
	margin-top: 0px;
	margin-left: 1rem;
}

.groupregister {
	background: #F0F2F4;
	padding-top: 1rem;
	padding-bottom: 1rem;
	border-radius: var(--bdradius);
}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
	/* change the yellow autofill background: */
	background-color: transparent !important;
}


.wrapperdropdownlist {
	position: relative;
}

	.wrapperdropdownlist::after {
		content: "";
		position: absolute;
		right: 0.5rem;
		top: 50%;
		transform: translateY(-50%);
		width: 16px;
		height: 16px;
		background-image: url('../images/arrow_down.svg');
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
	}

.select-wrapper select {
	appearance: none;
	padding-right: 2rem;
}

.registration-form .nav-tabs {
	justify-content: center;
}

.registration-form .nav-link {
	color: black;
}

.nav-tabs .nav-item.show .nav-link {
	color: white;
	background: var(--gradient);
}

.nav-tabs .nav-link.active {
	color: black;
	background: #dee2e6;
}

.sendregister {
	margin: 0 auto !important;
	max-width: 400px !important;
	margin-top: 1rem !important;
}

span.field-validation-error {
	color: red;
}

.wrappercheckbox .checkbox {
	display: flex;
	flex-direction: row-reverse;
	justify-content: left;
	margin-bottom: 1rem;
}

.wrapperprofile {
	background: var(--basebg);
}
	/*profile*/
	.wrapperprofile .wrappergradient {
		margin: 0;
		margin-bottom: 1rem;
	}

.wrappermygalletti button, .wrappermygalletti a {
	border: 0;
	margin: 0.5rem;
}

.wrappermygalletti {
	display: flex;
}

	.wrappermygalletti .leftprofile {
		border-top-left-radius: var(--bdradius);
		border-bottom-left-radius: var(--bdradius);
		padding: 2rem;
		display: flex;
	}

		.wrappermygalletti .leftprofile img {
			padding-right: 1rem;
		}

	.wrappermygalletti .rightprofile {
		background: white;
		border-top-right-radius: var(--bdradius);
		border-bottom-right-radius: var(--bdradius);
		display: flex;
		align-items: center;
		flex-flow: wrap;
		padding: 0 2rem;
	}

.wrapperprofiledetail {
	display: flex;
	margin: 1rem 0;
	--bs-gutter-x: 0;
}

.wrapperrightprofile {
	background: white;
	border-top-right-radius: var(--bdradius);
	border-bottom-right-radius: var(--bdradius);
	padding: 2rem;
}

.wrapperleftprofile {
	border-top-left-radius: var(--bdradius);
	border-bottom-left-radius: var(--bdradius);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.wrapperimageprofile {
	display: flex;
	padding: 2rem;
}

	.wrapperimageprofile img {
		width: 30px;
		margin-right: 1rem;
	}

.wrapperbutton {
	display: flex;
	flex-direction: column;
}

	.wrapperbutton a {
		color: white;
		background: grey;
		text-decoration: none;
	}

	.wrapperbutton a {
		color: white;
		background: grey;
		text-decoration: none;
		padding: 1rem 2rem;
		display: flex;
		justify-content: space-between;
	}

.info-row {
	display: flex;
	word-break: break-word;
}

.info-label {
	font-weight: 700;
}

.titledocuments {
	padding: 1rem;
	border-radius: 40px;
	text-align: center;
	font-weight: 600;
}

.documents-table {
	width: 100%;
}

	.documents-table th, .documents-table td {
		padding: 1rem;
	}

	.documents-table tr {
		border-bottom: 1px solid #c4c4c4;
	}

a.download-btn {
	color: white;
	background: #333;
	text-decoration: none;
	padding: 0.4rem 1rem;
	border-radius: 15px;
}

.login-status {
	position: absolute;
	padding: 1rem;
	padding-top: 0.5rem;
	top: 100%;
	background: rgb(51, 51, 51);
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

.btnprivate {
	display: flex;
}

.button-toolbar .btnlog {
	color: white;
	font-size: 14px;
	display: flex;
	margin-top: 11px;
}

.languages .dropdown-menu {
	position: absolute;
	z-index: 1000;
	top: 85%;
	padding: 0.5rem;
	min-width: 0;
	margin: 0;
	border: none;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.dropdown-menu-right {
	position: absolute;
	background: #333;
	top: 80%;
	font-size: 14px;
	z-index: 999;
	left: 0;
	padding: 0.5rem;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

	.dropdown-menu-right a {
		color: white;
	}

.toolbarmobile .dropdown-menu-right {
	font-size: 13px;
	padding: 0.5rem;
	padding-left: 20px;
	position: relative;
	background: transparent;
}

.toolbarmobile .languages, .toolbarmobile .logintool {
	display: flex;
	flex-direction: column;
	align-items: baseline;
}

	.toolbarmobile .languages:hover, .toolbarmobile .logintool:hover {
		cursor: pointer;
	}

.toolbarmobile .login-status {
	position: relative;
	background: white;
}

.toolbarmobile .btnlog {
	color: black;
	font-size: 0.7rem;
}

.button-toolbar img.dropmobile {
	width: 24px;
	height: 7px;
	margin-left: 12px;
}

.wrapperforgot, .wrapperreset {
	display: flex;
	flex-direction: column;
	align-items: center;
}

	.wrapperforgot label, .wrapperreset label {
		display: none;
	}

	.wrapperforgot button.btndark, .wrapperreset button.btndark {
		max-width: none;
	}

	.wrapperforgot input, .wrapperreset input {
		border: 0;
		width: auto;
		min-width: 270px;
		font-size: 16px;
		margin: 1rem 0;
		border-bottom: 1px solid grey;
	}

		.wrapperforgot input::placeholder, .wrapperreset inout::placeholder {
			font-size: 16px;
		}

		.wrapperforgot input:focus-visible, .wrapperforgot input:focus, .wrapperreset input:focus-visible, .wrapperreset input:focus {
			outline: 0;
		}

.wrapperbutton .btnlog {
	width: 100%;
	border: none;
	background: grey;
	color: white;
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
	padding: 1rem 2rem;
	border-bottom-left-radius: var(--bdradius);
	font-size: clamp(0.7rem, 1.5vw, 0.8rem);
	line-height: clamp(1rem, 2vw, 1.5rem);
}

.registration-form label {
	display: none;
}

/* REALIZZAZIONI */
#realization-list .wrapperitem > a > img, #experiences-list .wrapperitem > a > img, #perspectives-list .wrapperitem > a > img {
	border-radius: var(--bdradius);
	width: 100%;
	max-height: 360px;
	min-height: 360px;
	object-fit: cover;
}

#realization-list .contentitem h5 {
	max-width: 100%;
}

#realization-list .contentitem {
	padding: 1rem 2rem;
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: space-between;
}

	#realization-list .contentitem img {
		width: 40px;
		margin-left: auto;
	}

#realization-list a.wrapperlink, #experiences-list a.wrapperlink, #perspectives-list a.wrapperlink {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.pagination .page-link {
	border: none;
	border-radius: 50%;
	height: 50px;
	width: 50px;
	padding: 0;
	margin: 1rem 0.2rem;
}

.page-link {
	place-content: center;
	text-align: center;
}

.active .button-gradient.page-link {
	background: #333;
	color: white;
}

	.active .button-gradient.page-link:before {
		content: "";
		background: none;
	}

.ctawrapper > p {
	font-size: clamp(0.9rem, 1.5vw, 1.1rem);
	line-height: clamp(1rem, 2vw, 1.5rem);
}

/* QUOTES */
.quote-block {
	position: relative;
	padding: 2rem 1rem;
	font-weight: 200;
}

	.quote-block::before {
		position: absolute;
		top: 0px;
		left: -90px;
		content: '';
		display: inline-block;
		width: clamp(2rem, 6vw, 5.3rem);
		height: clamp(2rem, 6vw, 5.3rem);
		background-image: url('../images/format_quote.svg');
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center;
	}

	.quote-block::after {
		content: '';
		display: inline-block;
		width: clamp(2rem, 6vw, 5.3rem);
		height: clamp(2rem, 6vw, 5.3rem);
		background-image: url('../images/format_quote.svg');
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center;
		position: absolute;
		bottom: 0;
		right: -90px;
	}

.author {
	margin: 0;
	font-weight: bold;
}

.togglelightbox, .togglelightboxlocal {
	position: absolute;
	bottom: 0;
	right: 0;
	padding: 0.7rem 3rem;
	background: white;
	border-top-left-radius: 20px;
}

	.togglelightbox:after, .togglelightboxlocal:after {
		content: "";
		position: absolute;
		background-color: transparent;
		top: -25px;
		right: 15px;
		height: 40px;
		width: 10px;
		box-shadow: 0 20px 0 0 white;
		transform: rotate(270deg);
		border-bottom-left-radius: 20px;
	}


	.togglelightbox:before, .togglelightboxlocal:before {
		content: "";
		position: absolute;
		background-color: transparent;
		bottom: 0;
		height: 40px;
		width: 10px;
		box-shadow: 0 20px 0 0 white;
		right: 100%;
		border-bottom-right-radius: 20px;
	}

.media-wrapper .togglelightbox img, .media-wrapper .togglelightboxlocal img {
	height: 40px;
	min-height: 0;
	padding-right: 1rem;
}

.togglelightbox:hover, .togglelightboxlocal:hover {
	cursor: pointer;
}

.noscroll,
.noscroll body,
body.noscroll {
	overflow: hidden !important;
	height: 100vh; /* optional: prevent slight scroll from padding/margins */
}

/* Optional styling for close button */
.close-lightbox, .close-lightbox-local {
	position: absolute;
	top: 0;
	right: 1rem;
	background: none;
	border: none;
	font-size: 3.5rem;
	color: white;
	cursor: pointer;
	z-index: 10000;
}

.videolightbox iframe {
	border: 0;
	padding: 2rem;
}

/* insight list */


.singlefilter {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background: url('../images/ArrowDropDownFilled.svg') no-repeat right 0.75rem center / 1.5rem;
	padding-right: 2rem; /* make space for the icon */
	position: relative;
	padding: 1rem;
}

.filterwrapper {
	position: relative;
	margin-top: 1rem;
}

.singlefilter:focus {
	background: url('../images/ArrowDropDownFilled.svg') no-repeat right 0.75rem center / 1.5rem;
	transform-origin: center right;
	transition: transform 0.3s ease;
	background-position: right 0.75rem center;
	box-shadow: none;
	border: 1px solid #0000003B;
}

.filterwrapper label {
	position: absolute;
	background: white;
	z-index: 99;
	top: -9px;
	padding: 0 7px;
	left: 24px;
	margin: 0;
}

button.filterbutton {
	background: none;
	border: none;
	margin-top: 1rem;
}


.media-wrapper img.noborder {
	border-radius: 0;
}

.media-wrapper.nomargin {
	margin: 0;
}

legend {
	display: inline-block;
	margin-bottom: .5rem;
	font-family: "Montserrat", system-ui;
	font-size: 12pt;
	font-weight: 400;
	line-height: 1.5;
	text-align: left;
	color: initial;
}

/* Azienda */
.galletti_logo_img {
	width: 150px;
	margin-bottom: 2rem;
}

.gruppo_description {
	padding: 3rem;
}

.partner_grid {
	padding: 3rem;
}

.partner_img {
	padding: 3rem 2rem 0 1rem;
	object-fit: contain;
	height: 200px;
	border-radius: var(--bdradius) !important;
}

.title_partner {
	margin-top: 2rem;
}

.sectorwrapper {
	background: white;
	border-radius: var(--bdradius);
	padding: 2.5rem 2rem;
}

.sector-body img {
	max-height: 60px;
	margin-bottom: 1rem;
	padding: 11px;
	border: 1px solid #1463A1;
	border-radius: 10px;
}

.text_partner {
	padding: 1rem 0 1rem 0;
}

.img_partner {
	justify-content: center;
	align-items: center;
	max-width: 100%;
	max-height: 100%;
	height: auto;
	width: auto;
}

.img_box {
	object-fit: cover;
	height: 600px;
	border-radius: var(--bdradius);
	width: 100%;
}

.bg-light.box-right {
	margin-bottom: 6%;
}

.box-right {
	border-radius: var(--bdradius);
	padding: 2rem;
	height: 47%;
	align-content: center;
}

.bg-img {
	background-image: url('../images/backgroundfeature.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.col-right {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.intro-section {
	padding: 3rem;
}

/* TIMELINE */

.timeline {
	margin: 3rem 0;
}


.titletimeline {
	width: fit-content;
}

.timeline .nav-pills {
	border-right: 1px solid black;
	min-width: 120px;
	max-width: 120px;
}

.timeline .tab-content {
	margin-left: 1.5rem;
}

.timeline img {
	height: 550px;
	border-radius: var(--bdradius);
	width: -webkit-fill-available;
	width: -moz-available;
}

.buttontab {
	background: none;
	border: none;
	font-size: clamp(1rem, 2vw, 1.3rem);
	line-height: clamp(1.2rem, 2.5vw, 2rem);
	padding-right: 15px;
	text-align: right;
}

	.buttontab.active {
		font-size: clamp(1.4rem, 2.5vw, 1.9rem);
		line-height: clamp(1.5rem, 3vw, 2.2rem);
	}

.wrappercomponents.darker .certification-dark-card {
	border: 1px solid #fff;
	border-radius: 5px;
	background: #333;
	display: flex;
	flex-direction: column;
	text-decoration: none;
	padding: 1rem 2rem;
	color: white;
	text-transform: capitalize;
	height: 100%;
	justify-content: center;
	position: relative;
	padding-left: 70px;
	overflow-wrap: anywhere;
}

.wrappercomponents.darker .certification-dark-text {
	color: white;
	font-style: italic;
	font-size: 15px;
	text-decoration: none;
}

.doc-card.certification-card::before {
	content: "";
	position: absolute;
	left: 5%;
	width: 40px;
	height: 40px;
	background-image: url(../images/icon_pdf_gradient.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.certification-image {
	width: 30%;
}

.certification-product {
	width: 60%;
}

a.doc-card:hover {
	color: black;
}

.certification-list {
	color: white;
	text-decoration: none;
}

a.certification-list:hover {
	text-decoration: underline;
	color: white;
}

.certification-list-stop {
	overflow-wrap: anywhere;
}

/* LAVORA CON NOI */
.work-with-us {
	border-bottom: 1px solid #333;
	padding-bottom: 2rem;
}

.job-listing {
	max-width: 900px;
	margin: 0 auto;
	border-top: 1px solid #ddd;
}

.job-type {
	color: #888;
	margin-bottom: 4px;
}

.job-location {
	font-weight: bold;
	margin-bottom: 8px;
}

.job-title {
	font-weight: bold;
}

.job-desc {
	color: #444;
	margin-bottom: 8px;
}

.work-col-right {
	text-align: right;
}

.sidebar {
	background-color: #F0F2F4;
	padding: 3rem 3rem 3rem 1.5rem;
	border-radius: var(--bdradius);
}

.sidebar-title {
	color: #888;
}

.sidebar-location {
	font-weight: bold;
}

/* grid */
.gridlayout .swiper-slide {
	width: auto;
	height: auto;
}

.leftside .col-12:first-child .imggallery:first-of-type, .rightside .col-12:last-child .imggallery:last-of-type {
	height: 600px;
}


.imggallery {
	object-fit: cover;
	height: 284px;
	width: 100%;
	border-radius: var(--bdradius);
	max-height: 600px;
}

.row.gallery {
	margin: 1.5rem 0;
}

.wrapperelement {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.imggallery:hover {
	cursor: pointer;
}
/* carousel grid */
.gallery-lightbox {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0,0,0,0.9);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 10000;
}

	.gallery-lightbox img {
		max-height: 90vh;
		object-fit: contain;
	}

	.gallery-lightbox .close-lightbox {
		position: absolute;
		top: 20px;
		right: 30px;
		font-size: 2rem;
		color: white;
		background: none;
		border: none;
		cursor: pointer;
		z-index: 10001;
	}

	.gallery-lightbox .swiper-wrapper {
		align-items: center;
	}


	.gallery-lightbox .swiper-button-next:after, .gallery-lightbox .swiper-button-prev:after {
		color: white;
	}

.caroselgallery .swiper-slide {
	user-select: none;
	-webkit-user-drag: none;
}


/*CONTACTS*/
.productalreadyinstalled .radiobuttonlist {
	display: flex;
}

.productalreadyinstalled legend {
	font-family: "Manrope", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	padding: 5px;
}

.umbraco-forms-form fieldset {
	margin: 0;
}

.umbraco-forms-form input.text:focus, .umbraco-forms-form input.title:focus, .umbraco-forms-form select:focus, .umbraco-forms-form textarea:focus {
	border-top: none;
	border-left: none;
	border-right: none;
}

.umbraco-forms-form input.text:focus-visible, .umbraco-forms-form input.title:focus-visible, .umbraco-forms-form select:focus-visible, .umbraco-forms-form textarea:focus-visible {
	outline: none;
}

/*  contatti */

.wrapperform.greyform {
	background-color: #F0F2F4;
}

	.wrapperform.greyform .umbraco-forms-form input.text, .wrapperform.greyform .umbraco-forms-form textarea {
		background-color: transparent;
	}

.wrapperform input[type="submit"].button:hover {
	background: var(--gradient);
}

input[type="submit"].button {
	float: right;
	width: 170px;
	max-width: 260px;
	background-color: #333;
	color: white;
	text-align: center;
	text-decoration: none;
	padding: 1rem;
	border: none;
	border-radius: var(--bdradius);
}

.umbraco-forms-form .umbraco-forms-field-wrapper .radiobuttonlist {
	display: flex;
}

.umbraco-forms-form fieldset {
	margin: 0 !important;
}

.umbraco-forms-form .umbraco-forms-field-wrapper .radiobuttonlist > div {
	margin-right: 10px;
}

.umbraco-forms-field.checkbox .umbraco-forms-field-wrapper, .umbraco-forms-field.privacy .umbraco-forms-field-wrapper {
	padding: 6px;
	display: flex;
	align-items: flex-start;
}

.umbraco-forms-field .umbraco-forms-field-wrapper input[type="checkbox"] {
	margin-top: 4px;
	margin-right: 11px;
}


.umbraco-forms-field div label {
	margin: 0;
}

.contactwrapper h3 {
	text-wrap: pretty;
}

.contactwrapper .socials {
	margin-top: 1rem;
}

.detailcontact {
	display: flex;
	flex-direction: column;
	padding: 2rem;
	background-color: #F0F2F4;
	border-radius: var(--bdradius);
	height: 100%;
}

.wrappermapcontact {
	margin-top: 2rem;
}

.textmapcontact {
	padding: 1rem 0;
}

.toanimate .letter {
	display: inline-block;
	transform: translateY(.8em);
	opacity: 0;
	transition: transform .45s cubic-bezier(.2,.8,.2,1), opacity .45s ease;
}

	.toanimate .letter.in {
		transform: translateY(0);
		opacity: 1;
	}

.toanimate .gradient-text {
	display: inline-block; /* necessary for transform animation */
	opacity: 0;
	transform: translateY(.8em);
	transition: transform .45s cubic-bezier(.2,.8,.2,1), opacity .45s ease;
}



.button-gradient::before {
	content: "";
	position: absolute;
	inset: 0;
	padding: 2px;
	background: var(--gradient);
	border-radius: inherit;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: destination-out;
	mask-composite: exclude;
	z-index: -1;
}



.button-gradient {
	position: relative;
	z-index: 1;
	border-radius: var(--bdradius);
	padding: 1rem 2rem;
	background-color: white;
	color: black;
	text-decoration: none;
	transition: color 0.3s ease;
	overflow: hidden;
	display: inline-block;
}


	.button-gradient::after {
		content: "";
		position: absolute;
		inset: 0;
		background: var(--gradient);
		border-radius: inherit;
		z-index: -2;
		opacity: 0;
		transition: opacity 0.3s ease;
	}




/* CUSTOM FILE INPUT */
.fileupload .umbraco-forms-tooltip {
	display: none;
}

.file-upload {
	color: black;
	display: flex;
	align-items: center;
	width: 100% !important;
	max-width: 100% !important;
	border: none;
	border-bottom: 1px solid #C8C8C8;
	border-radius: 0;
	margin: 2rem 0;
	font-weight: bold;
	padding: 5px 0;
	justify-content: space-between;
}

	.file-upload .button-gradient {
		padding: 0.5rem 2rem;
	}

p#tooltip {
	margin: 0;
}

.file-upload input[type="file"] {
	display: none; /* hide native input */
}

.file-upload .file-name {
	font-size: 14px;
	color: #333;
}

.spacing-right {
	padding-right: 6rem;
}

.swiper-slide.disabled {
	opacity: 0.6;
}

	.swiper-slide.disabled a {
		cursor: default;
	}

.gm-style-iw.gm-style-iw-c {
	max-width: 25em !important;
	min-width: 150px !important;
}

.wrappercomponents a {
	color: #fff;
}
