/* --------------------------------------------------------------
   AL QUÈRTO - SINGLE PRODUCT
-------------------------------------------------------------- */

.single-product .aq-single-product-page {
	max-width: none;
	width: 100%;

	margin: 0;
	padding: 0;
}


.single-product .aq-single-product-page > * {
	max-width: none;

	margin-top: 0;
	margin-bottom: 0;
}


.single-product .site-content {
	padding: 0;
}


/* --------------------------------------------------------------
   PRODUCT
-------------------------------------------------------------- */

.aq-pdp {
	--aq-pdp-buybar-height: 104px;

	position: relative;

	width: 100%;

	background:
		#fffef9;
}


/* --------------------------------------------------------------
   HERO
-------------------------------------------------------------- */

.aq-pdp-hero {
	position: relative;

	display: flex;
	align-items: center;

	width: 100%;

	/*
	 * L'intera schermata = header + PDP.
	 * Il JS valorizzerà --aq-header-height.
	 */
	height:
		calc(
			100svh -
			var(--aq-header-height, 110px)
		);

	min-height: 650px;

	padding:
		clamp(28px, 4vw, 62px)
		clamp(24px, 5vw, 80px)
		calc(
			var(--aq-pdp-buybar-height)
			+
			28px
		);

	overflow: hidden;

	isolation: isolate;

	background:
		radial-gradient(
			circle at 22% 60%,
			rgba(5, 60, 255, .14),
			transparent 32rem
		),
		linear-gradient(
			110deg,
			#fffef9 0%,
			#fdfcf8 56%,
			#f4f6ff 100%
		);
}


/* --------------------------------------------------------------
   GHOST TITLE
-------------------------------------------------------------- */

.aq-pdp-hero__ghost {
	position: absolute;

	z-index: 0;

	left: 5%;
	top: 5%;

	width: 100%;

	color:
		rgba(5, 60, 255, .045);

	font-family:
		var(--aq-font-display);

	font-size:
		clamp(12rem, 25vw, 31rem);

	font-weight: 400;
	line-height: .72;
	letter-spacing: -.055em;

	text-transform: uppercase;
	white-space: nowrap;

	pointer-events: none;
}


/* --------------------------------------------------------------
   GRID
-------------------------------------------------------------- */

.aq-pdp-hero__inner {
	position: relative;

	z-index: 2;

	display: grid;

	grid-template-columns:
		minmax(0, 1.08fr)
		minmax(400px, .92fr);

	gap:
		clamp(50px, 7vw, 120px);

	align-items: center;

	width:
		min(1600px, 100%);

	margin: 0 auto;
}


/* --------------------------------------------------------------
   GALLERY
-------------------------------------------------------------- */

.aq-pdp-gallery {
	position: relative;

	display: grid;

	grid-template-columns:
		74px
		minmax(0, 1fr);

	gap: 26px;

	align-items: center;

	min-width: 0;
}


/* --------------------------------------------------------------
   THUMBS
-------------------------------------------------------------- */

.aq-pdp-gallery__thumbs {
	display: grid;

	gap: 12px;

	align-content: center;
}


/* --------------------------------------------------------------
   GALLERY THUMB
-------------------------------------------------------------- */

.aq-pdp-thumb {
	position: relative;

	display: flex;
display: none;
	align-items: center;
	justify-content: center;

	width: auto;
	height: 96px;

	padding: 0;

	overflow: hidden;

	border:none;

	border-radius: 0;

	background:
		rgba(255, 255, 255,0);

	cursor: pointer;

	transition:
		border-color .3s ease,
		background .3s ease,
		transform .3s cubic-bezier(.16, 1, .3, 1);
}


.aq-pdp-thumb:hover,
.aq-pdp-thumb.is-active {
	border-color:
		var(--aq-blue, #053cff);

	background: #fff;

	transform:
		translateX(4px);
}


.aq-pdp-thumb img {
	display: block;

	width: 100%;
	height: 100%;

	max-width: 100%;
	max-height: 100%;

	margin: 0;

	object-fit: contain;
	object-position: center;
}

.aq-pdp-thumb span {
	position: absolute;

	left: 5px;
	bottom: 4px;

	color:
		var(--aq-blue, #053cff);

	font-family:
		var(--aq-font-body);

	font-size: .52rem;
	font-weight: 800;
	display: none;
}


/* --------------------------------------------------------------
   STAGE
-------------------------------------------------------------- */

.aq-pdp-gallery__stage {
	position: relative;

	width: 100%;

	height:
		min(
			68vh,
			720px
		);

	min-height: 480px;

	overflow: hidden;
}


/* Blue light */

.aq-pdp-gallery__glow {
	position: absolute;

	z-index: 0;

	left: 10%;
	right: 10%;

	bottom: 4%;

	height: 32%;

	border-radius: 50%;

	background:
		radial-gradient(
			ellipse at center,
			rgba(5, 60, 255, .36),
			rgba(5, 60, 255, .13) 42%,
			transparent 72%
		);

	filter:
		blur(32px);

	pointer-events: none;
}


/* --------------------------------------------------------------
   SLIDES
-------------------------------------------------------------- */

.aq-pdp-gallery__slide {
	position: absolute;

	inset: 0;

	z-index: 1;

	display: flex;

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

	margin: 0;
	padding:
	clamp(18px, 2.5vw, 36px);
	opacity: 0;

	pointer-events: none;

	transform:
		translateY(16px)
		scale(.96);

	transition:
		opacity .45s ease,
		transform .65s
			cubic-bezier(.16, 1, .3, 1);
}


.aq-pdp-gallery__slide.is-active {
	opacity: 1;

	pointer-events: auto;

	transform:
		translateY(0)
		scale(1);
}


.aq-pdp-gallery__image {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: contain;

	filter:
		drop-shadow(
			0 40px 34px
			rgba(5, 25, 100, .18)
		);
}


/* --------------------------------------------------------------
   SUMMARY
-------------------------------------------------------------- */

.aq-pdp-summary {
	position: relative;

	z-index: 4;

	max-width: 670px;
}


/* CATEGORY */

.aq-pdp-summary__category {
	margin:
		0
		0
		14px;

	color:
		var(--aq-blue, #053cff);

	font-family:
		var(--aq-font-body);

	font-size: .72rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: .09em;

	text-transform: uppercase;
}


/* TITLE */

.aq-pdp-summary__title {
	margin:
		0
		0
		20px;

	color:
		var(--aq-black, #04070f);

	font-family:
		var(--aq-font-display);

	font-size:clamp(5rem, 8vw, 7.3rem);

	font-weight: 400;
	line-height: .9;
	letter-spacing: -.05em;

	text-transform: uppercase;
}


/* CLAIM */

.aq-pdp-summary__claim {
	max-width: 620px;

	margin: 0;

	color: #1c2435;

	font-family:
		var(--aq-font-body);

	font-size:
		clamp(1rem, 1.4vw, 1.3rem);

	font-weight: 500;
	line-height: 1.45;
}


/* LINE */

.aq-pdp-summary__line {
	width: 100%;
	height: 1px;

	margin:
		clamp(22px, 3vw, 34px)
		0;

	background:
		rgba(5, 60, 255, .28);
}


/* --------------------------------------------------------------
   INFO
-------------------------------------------------------------- */

.aq-pdp-info-block {
	display: grid;

	gap: 9px;

	margin-bottom: 24px;
}


.aq-pdp-info-block__label {
	color:
		var(--aq-blue, #053cff);

	font-family:
		var(--aq-font-body);

	font-size: .64rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: .09em;

	text-transform: uppercase;
}


/* --------------------------------------------------------------
   INGREDIENTS
-------------------------------------------------------------- */

.aq-pdp-ingredients {
	display: flex;

	flex-wrap: wrap;

	gap:
		7px
		0;
}


.aq-pdp-ingredients span {
	position: relative;

	display: inline-flex;
	align-items: center;

	padding-left: 14px;
	margin-right: 12px;

	color: #32394a;

	font-family:
		var(--aq-font-body);

	font-size: .86rem;
	line-height: 1.45;
}


.aq-pdp-ingredients span::before {
	content: '';

	position: absolute;

	left: 0;
	top: 50%;

	width: 4px;
	height: 4px;

	border-radius: 50%;

	background:
		var(--aq-blue, #053cff);

	transform:
		translateY(-50%);
}


/* --------------------------------------------------------------
   DETAILS
-------------------------------------------------------------- */

.aq-pdp-details {
	display: flex;
	flex-wrap: wrap;

	gap: 8px;

	margin-bottom: 26px;
}


.aq-pdp-detail {
	display: flex;

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

	min-height: 48px;

	padding:
		11px
		16px;

	border:
		1px solid
		rgba(5, 60, 255, .24);

	background:
		rgba(255, 255, 255, .72);
}


.aq-pdp-detail span {
	color:
		var(--aq-black, #04070f);

	font-family:
		var(--aq-font-body);

	font-size: .82rem;
	font-weight: 800;
}


/* --------------------------------------------------------------
   PRICE
-------------------------------------------------------------- */

.aq-pdp-summary__price {
	margin-top: 4px;

	color:
		var(--aq-black, #04070f);

	font-family:
		var(--aq-font-display);

	font-size:
		clamp(3.3rem, 5vw, 5.4rem);

	font-weight: 400;
	line-height: .9;
}


.aq-pdp-summary__price del {
	margin-right: 10px;

	color:
		rgba(4, 7, 15, .32);

	font-size: .62em;
}


.aq-pdp-summary__price ins {
	color:
		var(--aq-blue, #053cff);

	text-decoration: none;
}


/* --------------------------------------------------------------
   STOCK
-------------------------------------------------------------- */

.aq-pdp-summary__stock {
	margin:
		10px
		0
		0;

	color:
		var(--aq-blue, #053cff);

	font-family:
		var(--aq-font-body);

	font-size: .62rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: .09em;
}


.aq-pdp-summary__stock--out {
	color: #9e2525;
}


/* --------------------------------------------------------------
   FIXED BUY BAR
-------------------------------------------------------------- */

.aq-pdp-buybar {
	position: fixed;

	z-index: 999;

	left: 50%;
	bottom: 18px;

	width:
		min(
			1500px,
			calc(100% - 48px)
		);

	transform:
		translateX(-50%);

	color: #fff;

	background:
		linear-gradient(
			105deg,
			#041443 0%,
			#010713 54%,
			#041443 100%
		);

	border:
		1px solid
		rgba(255, 255, 255, .12);

	box-shadow:
		0 20px 60px
		rgba(1, 7, 30, .28);
}


/* --------------------------------------------------------------
   BUYBAR INNER
-------------------------------------------------------------- */

.aq-pdp-buybar__inner {
	display: grid;

	grid-template-columns:
		minmax(260px, 1fr)
		auto
		minmax(150px, auto)
		minmax(230px, auto);

	align-items: center;

	min-height:
		var(--aq-pdp-buybar-height);

	padding:
		10px
		14px
		10px
		12px;
}


/* --------------------------------------------------------------
   PRODUCT IN BAR
-------------------------------------------------------------- */

.aq-pdp-buybar__product {
	display: flex;

	align-items: center;

	gap: 15px;

	min-width: 0;
}


.aq-pdp-buybar__thumb {
	display: flex;

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

	width: 64px;
	height: 72px;

	padding: 5px;

	background:
		rgba(255, 255, 255, .08);
}


.aq-pdp-buybar__thumb img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: contain;
}


.aq-pdp-buybar__product-text {
	display: grid;

	gap: 5px;

	min-width: 0;
}


.aq-pdp-buybar__product-text strong {
	overflow: hidden;

	color: #fff;

	font-family:
		var(--aq-font-display);

	font-size: 1.65rem;
	font-weight: 400;
	line-height: .9;

	text-overflow: ellipsis;
	text-transform: uppercase;

	white-space: nowrap;
}


.aq-pdp-buybar__product-text span {
	overflow: hidden;

	color:
		rgba(255, 255, 255, .66);

	font-family:
		var(--aq-font-body);

	font-size: .70rem;

	text-overflow: ellipsis;
	white-space: nowrap;
}


/* --------------------------------------------------------------
   QUANTITY
-------------------------------------------------------------- */

.aq-pdp-buybar__quantity {
	display: grid;

	grid-template-columns:
		50px
		64px
		50px;

	align-items: center;

	height: 56px;

	margin:
		0
		clamp(22px, 4vw, 60px);

	background:
		rgba(255, 255, 255, .09);
}


.aq-pdp-buybar__quantity button,
.aq-pdp-buybar__quantity input {
	display: flex;

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

	width: 100%;
	height: 100%;

	margin: 0;
	padding: 0;

	border: 0;
	border-radius: 0;

	outline: none;

	color: #fff;

	background: transparent;

	font-family:
		var(--aq-font-body);

	font-size: 1rem;
	font-weight: 700;

	text-align: center;
}


.aq-pdp-buybar__quantity button {
	cursor: pointer;

	transition:
		background .2s ease;
}


.aq-pdp-buybar__quantity button:hover {
	background:
		rgba(255, 255, 255, .10);
}


.aq-pdp-buybar__quantity
input::-webkit-outer-spin-button,
.aq-pdp-buybar__quantity
input::-webkit-inner-spin-button {

	margin: 0;

	-webkit-appearance: none;
}


/* --------------------------------------------------------------
   TOTAL
-------------------------------------------------------------- */

.aq-pdp-buybar__total {
	padding-right:
		clamp(22px, 3vw, 44px);

	text-align: right;
}


.aq-pdp-buybar__total strong {
	color: #fff;

	font-family:
		var(--aq-font-display);

	font-size:
		clamp(2rem, 2.6vw, 3rem);

	font-weight: 400;
	line-height: .9;

	white-space: nowrap;
}


/* --------------------------------------------------------------
   BUTTON
-------------------------------------------------------------- */

.aq-pdp-buybar__button {
	display: flex;

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

	gap: 26px;

	min-width: 245px;
	height: 64px;

	padding:
		0
		24px;

	border:
		1px solid
		var(--aq-blue, #053cff);

	border-radius: 0;

	color: #fff;

	background:
		var(--aq-blue, #053cff);

	font-family:
		var(--aq-font-body);

	font-size: .75rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: .07em;

	text-transform: uppercase;

	cursor: pointer;

	transition:
		color .3s ease,
		background .3s ease;
}


.aq-pdp-buybar__button svg {
	width: 25px;
	height: 25px;
}


.aq-pdp-buybar__button:hover {
	color:
		var(--aq-blue, #053cff);

	background: #fff;
}


.aq-pdp-buybar__button.is-loading {
	pointer-events: none;

	opacity: .65;
}


/* --------------------------------------------------------------
   UNAVAILABLE
-------------------------------------------------------------- */

.aq-pdp-buybar__unavailable {
	grid-column:
		2 / -1;

	padding:
		18px
		24px;

	color:
		rgba(255, 255, 255, .6);

	font-family:
		var(--aq-font-body);

	font-size: .74rem;
	font-weight: 800;

	text-align: right;
}


/* --------------------------------------------------------------
   TABLET
-------------------------------------------------------------- */

@media (max-width: 1100px) {

	.aq-pdp-hero {
		height: auto;

		min-height:
			calc(
				100svh -
				var(--aq-header-height, 90px)
			);
	}


	.aq-pdp-hero__inner {
		grid-template-columns:
			1fr
			1fr;

		gap: 40px;
	}


	.aq-pdp-gallery {
		grid-template-columns: 1fr;
	}


	.aq-pdp-gallery__thumbs {
		display: flex;
		
		order: 2;
	}


	.aq-pdp-thumb {
		width: 68px;
		height: 76px;
	
		padding: 7px;
	}


	.aq-pdp-gallery__stage {
		height: 56vh;

		min-height: 440px;
	}


	.aq-pdp-buybar__inner {
		grid-template-columns:
			1fr
			auto
			auto;
	}


	.aq-pdp-buybar__product {
		display: none;
	}


	.aq-pdp-buybar__quantity {
		margin:
			0
			20px
			0
			0;
	}

}


/* --------------------------------------------------------------
   MOBILE
-------------------------------------------------------------- */

@media (max-width: 767px) {

	.aq-pdp {
		--aq-pdp-buybar-height: 78px;
	}


	.aq-pdp-hero {
		display: block;

		height: auto;

		min-height: 0;

		padding:
			42px
			18px
			120px;
	}


	.aq-pdp-hero__inner {
		grid-template-columns: 1fr;

		gap: 26px;
	}


	.aq-pdp-gallery__stage {
		height: 52vh;

		min-height: 380px;
	}


	.aq-pdp-summary__title {
		font-size:
			clamp(4.3rem, 20vw, 6.5rem);
	}


	.aq-pdp-hero__ghost {
		font-size: 13rem;
	}


	.aq-pdp-buybar {
		bottom: 0;

		width: 100%;

		border-left: 0;
		border-right: 0;
		border-bottom: 0;
	}


	.aq-pdp-buybar__inner {
		grid-template-columns:
			auto
			1fr;

		min-height: 78px;

		padding:
			8px
			10px;
	}


	.aq-pdp-buybar__quantity {
		grid-template-columns:
			38px
			44px
			38px;

		height: 52px;

		margin:
			0
			10px
			0
			0;
	}


	.aq-pdp-buybar__total {
		display: none;
	}


	.aq-pdp-buybar__button {
		min-width: 0;

		width: 100%;
		height: 52px;

		padding:
			0
			16px;

		font-size: .65rem;
	}


	.aq-pdp-buybar__button svg {
		width: 21px;
		height: 21px;
	}

}