/* --------------------------------------------------------------
   AL QUÈRTO - FAQ
-------------------------------------------------------------- */

.aq-faq-widget {
	position: relative;

	overflow: hidden;
	isolation: isolate;

	padding:
		clamp(96px, 12vw, 180px)
		clamp(20px, 5vw, 76px);

	border-top:
		1px solid rgba(5, 60, 255, .14);

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

	background:
		radial-gradient(
			circle at 82% 18%,
			rgba(5, 60, 255, .13),
			transparent 32rem
		),
		linear-gradient(
			180deg,
			#fffef9 0%,
			#fbfaf5 100%
		);
}


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

.aq-faq-widget__ghost {
	position: absolute;

	right: -2vw;
	bottom: -3vw;

	z-index: 0;

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

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

	font-size:
		clamp(12rem, 26vw, 34rem);

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

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

	pointer-events: none;
}


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

.aq-faq-widget__inner {
	position: relative;

	z-index: 2;

	width: min(1440px, 100%);

	margin: 0 auto;
}


/* --------------------------------------------------------------
   HEADING
-------------------------------------------------------------- */

.aq-faq-widget__head {
	display: block;

	max-width: 1120px;

	margin-left: auto;

	margin-bottom:
		clamp(46px, 7vw, 96px);
}


/* Marker */

.aq-faq-widget__marker {
	display: grid;

	gap: 10px;

	width: fit-content;

	margin-bottom:
		clamp(18px, 2.4vw, 34px);

	text-transform: uppercase;
}


.aq-faq-widget__marker span {
	width: fit-content;

	padding: 8px 11px;

	border-radius: 999px;

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

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

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


.aq-faq-widget__marker strong {
	color:
		var(--aq-blue, #053cff);

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

	font-size:
		clamp(1.85rem, 3vw, 3.4rem);

	font-weight: 400;
	line-height: .88;
	letter-spacing: -.02em;
}


/* Title */

.aq-faq-widget__kicker {
	margin: 0 0 20px;

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

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

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

	text-transform: uppercase;
}


.aq-faq-widget__heading h2 {
	max-width: 980px;

	margin: 0;

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

	font-size:
		clamp(4rem, 8.2vw, 7.5rem);

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

	text-transform: uppercase;
}


/* --------------------------------------------------------------
   FAQ LIST
-------------------------------------------------------------- */

.aq-faq-widget__list {
	position: relative;

	z-index: 2;

	display: grid;

	gap: 14px;

	max-width: 1120px;

	margin-left: auto;
}


/* --------------------------------------------------------------
   FAQ ITEM
-------------------------------------------------------------- */

.aq-faq-item {
	overflow: hidden;

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

	background:
		rgba(255, 255, 255, .78);

	box-shadow:
		0 24px 76px rgba(5, 60, 255, .08);

	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);

	transition:
		border-color .3s ease,
		box-shadow .3s ease,
		background .3s ease;
}


.aq-faq-item:hover {
	border-color:
		rgba(5, 60, 255, .32);

	box-shadow:
		0 30px 86px rgba(5, 60, 255, .12);
}


.aq-faq-item[open] {
	border-color:
		rgba(5, 60, 255, .34);

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


/* --------------------------------------------------------------
   QUESTION
-------------------------------------------------------------- */

.aq-faq-item summary {
	position: relative;

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

	gap: 18px;

	padding:
		clamp(20px, 2.6vw, 30px)
		clamp(22px, 3vw, 38px);

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

	cursor: pointer;

	list-style: none;

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

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

	font-weight: 400;
	line-height: .92;
	letter-spacing: -.02em;

	text-transform: uppercase;
}


.aq-faq-item summary::-webkit-details-marker {
	display: none;
}


.aq-faq-item summary::marker {
	display: none;
	content: "";
}


/* Plus */

.aq-faq-item summary::after {
	content: "+";

	flex: 0 0 auto;

	display: grid;
	place-items: center;

	width: 44px;
	height: 44px;

	border-radius: 999px;

	color: #fff;

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

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

	font-size: 1.4rem;
	font-weight: 800;
	line-height: 1;

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


.aq-faq-item[open]
summary::after {

	transform: rotate(45deg);
}


/* Keyboard */

.aq-faq-item summary:focus-visible {
	outline:
		3px solid var(--aq-blue);

	outline-offset: -3px;
}


/* --------------------------------------------------------------
   ANSWER
-------------------------------------------------------------- */

.aq-faq-item__answer {
	padding:
		0
		clamp(22px, 3vw, 38px)
		clamp(22px, 3vw, 34px);
}


.aq-faq-item__answer > * {
	max-width: 860px;
}


.aq-faq-item__answer p {
	margin: 0;

	color: #151b2b;

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

	font-size:
		clamp(1.18rem, 1.7vw, 1.3rem);

	font-weight: 400;
	line-height: 1.55;
	letter-spacing: -.02em;
}


.aq-faq-item__answer p + p {
	margin-top: 16px;
}


.aq-faq-item__answer a {
	color:
		var(--aq-blue);

	text-decoration: underline;

	text-underline-offset: 3px;
}


/* --------------------------------------------------------------
   REVEAL
-------------------------------------------------------------- */

.aq-faq-widget [data-aq-reveal] {
	opacity: 0;

	transform: translateY(44px);

	transition:
		opacity .85s cubic-bezier(.16, 1, .3, 1),
		transform .85s cubic-bezier(.16, 1, .3, 1);

	transition-delay:
		var(--aq-reveal-delay, 0ms);
}


.aq-faq-widget
[data-aq-reveal].is-visible {

	opacity: 1;

	transform: none;
}


.elementor-editor-active
.aq-faq-widget
[data-aq-reveal] {

	opacity: 1;

	transform: none;
}


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

@media (max-width: 1080px) {

	.aq-faq-widget__head,
	.aq-faq-widget__list {
		margin-left: 0;
	}

}


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

@media (max-width: 760px) {

	.aq-faq-widget {
		padding:
			76px
			18px;
	}


	.aq-faq-widget__heading h2 {
		font-size:
			clamp(3.5rem, 17vw, 6.1rem);
	}


	.aq-faq-widget__marker strong {
		font-size: 2.2rem;
	}


	.aq-faq-item summary {
		font-size:
			clamp(1.9rem, 10vw, 3.2rem);
	}


	.aq-faq-item summary::after {
		width: 38px;
		height: 38px;

		font-size: 1.2rem;
	}


	.aq-faq-item__answer p {
		font-size: 1.05rem;
	}

}


/* --------------------------------------------------------------
   REDUCED MOTION
-------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

	.aq-faq-widget [data-aq-reveal] {
		opacity: 1;

		transform: none;

		transition: none;
	}


	.aq-faq-item summary::after {
		transition: none;
	}

}