/* =========================================================
   BLUMI PRODUCTS INTRO + SLIDER
   ========================================================= */

.elementor-widget-blumi-products-intro-slider {

	width: 100%;

}


.blumi-products-intro {

	--blumi-products-section-height: 800px;
	--blumi-products-content-right: 80px;

	position: relative;

	display: grid;

	grid-template-columns:
		50% 50%;

	width: 100vw;

	max-width: 100vw;

	height:
		var(
			--blumi-products-section-height
		);

	margin-left:
		calc(50% - 50vw);

	overflow: hidden;

}


/* =========================================================
   CONTENT COLUMN
   ========================================================= */

.blumi-products-intro__content {

	display: flex;

	align-items: center;

	min-width: 0;


	/*
	 * Questo è il punto fondamentale.
	 *
	 * Il widget è full viewport ma l'inizio del testo
	 * coincide con l'inizio del container Blumi.
	 */

	padding-left:
		max(
			var(--blumi-gutter, 24px),
			calc(
				(
					100vw
					-
					var(
						--blumi-container,
						1436px
					)
				)
				/
				2
			)
		);


	padding-right:
		var(
			--blumi-products-content-right,
			80px
		);

}


.blumi-products-intro__content-inner {

	width: 100%;

	max-width: 650px;

}


/* ---------------------------------------------------------
   Eyebrow
   --------------------------------------------------------- */

.blumi-products-intro__eyebrow {

	margin: 0 0 20px;

	font-family:
		var(
			--blumi-font-primary,
			"bc-novatica-cyr",
			sans-serif
		);

	font-size: 30px;

	font-weight: 400;

	line-height: 1;

}


/* ---------------------------------------------------------
   Title
   --------------------------------------------------------- */

.blumi-products-intro__title {

	margin: 0 0 42px;

	padding: 0;

	font-family:
		var(
			--blumi-font-primary,
			"bc-novatica-cyr",
			sans-serif
		);

	font-size: 80px;

	font-weight: 700;

	line-height: 80px;

	letter-spacing: 0;

}


/* ---------------------------------------------------------
   Text
   --------------------------------------------------------- */

.blumi-products-intro__text {

	max-width: 560px;

	margin: 0 0 54px;

	font-family:
		var(
			--blumi-font-primary,
			"bc-novatica-cyr",
			sans-serif
		);

	font-size: var(--blumi-body-size);

	font-weight: 400;

	line-height: var(--global--line-height-body);

}


/* =========================================================
   SLIDER
   ========================================================= */

.blumi-products-intro__slider {

	position: relative;

	min-width: 0;

	height: 100%;

	overflow: hidden;

	background: #401F0F;

}


.blumi-products-intro__track {

	position: absolute;

	inset: 0;

	overflow: hidden;

}


.blumi-products-intro__slide {

	position: absolute;

	inset: 0;

	z-index: 0;

	visibility: hidden;

	transform:
		translate3d(
			0,
			100%,
			0
		);

}


.blumi-products-intro__slide.is-active {

	z-index: 1;

	visibility: visible;

	transform:
		translate3d(
			0,
			0,
			0
		);

}


.blumi-products-intro__slide picture,
.blumi-products-intro__slide img {

	display: block;

	width: 100%;
	height: 100%;

}


.blumi-products-intro__slide img {

	max-width: none;

	object-fit: cover;

	object-position:
		var(
			--blumi-products-position,
			center center
		);

}


/* =========================================================
   ARROWS
   ========================================================= */

.blumi-products-intro__navigation {

	position: absolute;

	z-index: 10;

	right: 42px;
	bottom: 58px;

	display: flex;

	flex-direction: column;

	align-items: center;

	gap: 12px;

}


.blumi-products-intro__arrow {

	display: flex;

	align-items: center;
	justify-content: center;

	width: 50px;
	height: 50px;

	margin: 0;
	padding: 0;

	border: 0;

	border-radius: 50%;

	background: transparent !important;

	color: #FFFFFF;

	cursor: pointer;

}


.blumi-products-intro__arrow span {

	display: block;

	width: 100%;
	height: 100%;

	background:
		currentColor;

	-webkit-mask-image:
		var(--blumi-icon);

	mask-image:
		var(--blumi-icon);

	-webkit-mask-position:
		center;

	mask-position:
		center;

	-webkit-mask-repeat:
		no-repeat;

	mask-repeat:
		no-repeat;

	-webkit-mask-size:
		contain;

	mask-size:
		contain;

}


/*
 * Desktop:
 * left/right SVG -> up/down
 */

.blumi-products-intro__arrow span {

	transform:
		rotate(90deg);

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1024px) {

	.blumi-products-intro {

		grid-template-columns:
			48% 52%;

	}


	.blumi-products-intro__content {

		padding-left:
			var(
				--blumi-gutter,
				24px
			);

		padding-right: 40px;

	}


	.blumi-products-intro__title {

		font-size: 64px;

	}
	
	.page-id-396 .blumi-products-intro__title {
		font-size: 80px;
	}

}

/* =========================================================
   TABLET / STACKED
   <= 990px
   ========================================================= */

@media (max-width: 990px) {

	/* =====================================================
	   SECTION
	   ===================================================== */

	.blumi-products-intro {

		display: flex;

		flex-direction: column;

		width: 100%;

		height: auto;

		min-height: 0;

		overflow: visible;

	}


	/* =====================================================
	   CONTENT SOPRA
	   ===================================================== */

	.blumi-products-intro__content {

		order: 1;

		width: 100%;

		height: auto;

		min-height: 0;

		flex: none;

	}


	.blumi-products-intro__content-inner {

		width: 100%;

		max-width: none;

		margin: 0;

		padding:
			70px
			clamp(30px, 7vw, 70px);
		padding-left: 0;
		padding-right: 0;

	}
	
	.blumi-products-intro__content {
		padding-left: 10px;
		padding-right: 10px;
	  } 


	/* =====================================================
	   SLIDER SOTTO
	   ===================================================== */

	.blumi-products-intro__slider {

		order: 2;

		position: relative;

		width: 100%;

		height:
			clamp(
				520px,
				70svh,
				720px
			);

		min-height: 0;

		flex: none;

		overflow: hidden;

	}


	.blumi-products-intro__track {

		position: absolute;

		inset: 0;

		width: 100%;
		height: 100%;

	}


	.blumi-products-intro__slide {

		width: 100%;
		height: 100%;

	}


	.blumi-products-intro__slide picture {

		display: block;

		width: 100%;
		height: 100%;

	}


	.blumi-products-intro__slide img {

		display: block;

		width: 100%;
		height: 100%;

		max-width: none;

		object-fit: cover;

		object-position:
			var(
				--blumi-products-position-mobile,
				center center
			);

	}


	/* =====================================================
	   FRECCE
	   ===================================================== */

	.blumi-products-intro__navigation {

		right: 28px;
		bottom: 28px;

		flex-direction: row;

	}

}


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

@media (max-width: 767px) {
	
	.blumi-products-intro__content-inner {
		padding-top: 0;
	}

	.blumi-products-intro {

		display: flex;

		flex-direction: column;

		width: 100%;

		max-width: 100%;

		height: auto;

		margin-left: 0;

		overflow: visible;

	}


	/* -----------------------------------------------------
	   Text first
	   ----------------------------------------------------- */

	.blumi-products-intro__content {

		display: block;

		width: 100%;

		padding:70px 10px 65px;

	}


	.blumi-products-intro__content-inner {

		max-width: none;

	}


	.blumi-products-intro__eyebrow {

		margin-bottom: 30px;

		font-size: 18px;

	}


	.blumi-products-intro__title {

		margin-bottom: 32px;

		font-size: 38px;

		line-height: 44px;

	}
	
	.page-int .blumi-products-intro__title {
		font-size: 50px;
		  font-weight: 600;
		  line-height: 50px;
	}
	
	.page-id-396 .blumi-products-intro__text {
		margin-bottom: 38px;
		
	  }
	  
	  
	.page-id-396 .blumi-products-intro__eyebrow {
		font-size: 30px;
		  font-weight: 400;
		  line-height: 1;
	}

	.blumi-products-intro__text {

		margin-bottom: 38px;

		font-size: 18px;

		line-height: 1.15;

	}


	/* -----------------------------------------------------
	   Slider below
	   ----------------------------------------------------- */

	.blumi-products-intro__slider {

		width: 100%;

		height: 62svh;

		min-height: 420px;

		max-height: 680px;

	}


	/*
	 * Mobile slider becomes horizontal.
	 */

	.blumi-products-intro__slide {

		transform:
			translate3d(
				100%,
				0,
				0
			);

	}


	.blumi-products-intro__slide.is-active {

		transform:
			translate3d(
				0,
				0,
				0
			);

	}


	.blumi-products-intro__slide img {

		object-position:
			var(
				--blumi-products-position-mobile,
				var(
					--blumi-products-position,
					center center
				)
			);

	}


	/* -----------------------------------------------------
	   Arrows horizontal
	   ----------------------------------------------------- */

	.blumi-products-intro__navigation {

		right: 22px;
		bottom: 22px;

		flex-direction: row;

		gap: 10px;

	}


	.blumi-products-intro__arrow {

		width: 44px;
		height: 44px;

	}


	.blumi-products-intro__arrow span {

		transform: none;

	}

}


@media (max-width: 660px) { 
	
	.home .blumi-products-intro__content-inner {
		padding-bottom: 0;
	}
	.blumi-products-intro__content-inner {padding-bottom: 30px;}
	
}
/* Keep long titles within the half-width copy column on small desktops/tablets. */
@media (min-width: 991px) and (max-width: 1600px) {
  .blumi-products-intro .blumi-products-intro__title {
    font-size: clamp(48px, 5vw, 80px);
    line-height: 1.02;
  }
}
