/**
 * Datanex Widgets — Preguntas frecuentes.
 */
.dnx-faq {
	--dnx-faq-px: 32px;
	--dnx-faq-py: 80px;
	--dnx-faq-bg: transparent;
	--dnx-faq-list: 780px;

	position: relative;
	isolation: isolate;
	padding-block: var(--dnx-faq-py);
	background: var(--dnx-faq-bg);
}

.dnx-faq--ninguno { --dnx-faq-py: 0px; }
.dnx-faq--claro { --dnx-faq-bg: #fff; }
.dnx-faq--alterno { --dnx-faq-bg: var(--dnx-surface-alt); }
.dnx-faq--oscuro { --dnx-faq-bg: var(--dnx-primary); color: #fff; }

.dnx-faq--full {
	width: 100vw;
	max-width: 100vw;
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
}

.dnx-faq__wrap {
	width: 100%;
	max-width: var(--dnx-wrap);
	margin-inline: auto;
	padding-inline: var(--dnx-faq-px);
}

.dnx-faq--head-dividido .dnx-faq__wrap {
	display: grid;
	grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
	align-items: start;
	gap: 64px;
}

/* ---------- Encabezado ---------- */
.dnx-faq__head--centrado {
	margin-bottom: 48px;
	text-align: center;
}

.dnx-faq__title {
	margin: 0;
	color: var(--dnx-primary);
	font-family: var(--dnx-font-display);
	font-size: clamp(40px, 5vw, 62px);
	font-weight: 400;
	letter-spacing: .5px;
	line-height: .95;
}

.dnx-faq__desc {
	max-width: 620px;
	margin: 18px 0 0;
	color: var(--dnx-ink-muted);
	font-size: 17px;
	line-height: 1.55;
}

.dnx-faq__head--centrado .dnx-faq__desc {
	margin-inline: auto;
}

.dnx-faq__head-actions {
	margin-top: 24px;
}

.dnx-faq__foot {
	justify-content: center;
	margin-top: 36px;
}

/* ---------- Lista ---------- */
.dnx-faq__list {
	max-width: var(--dnx-faq-list);
	margin-inline: auto;
	padding: 8px 28px;
	border: 1px solid var(--dnx-line);
	border-radius: var(--dnx-radius-card);
	background: #fff;
	box-shadow: var(--dnx-shadow);
}

.dnx-faq--head-dividido .dnx-faq__list {
	max-width: none;
	margin: 0;
}

.dnx-faq__item {
	border-bottom: 1px solid var(--dnx-line);
	transition: border-color .25s, padding .25s, margin .25s, background .25s;
}

.dnx-faq__item:last-child {
	border-bottom: 0;
}

.dnx-faq__item[open] {
	margin-left: -16px;
	padding-left: 13px;
	border-left: 3px solid var(--dnx-accent);
}

.dnx-faq__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 22px 0;
	list-style: none;
	cursor: pointer;
}

.dnx-faq__summary::-webkit-details-marker {
	display: none;
}

.dnx-faq__summary:focus-visible {
	border-radius: 6px;
	outline: 3px solid color-mix(in srgb, var(--dnx-accent) 45%, transparent);
	outline-offset: 2px;
}

.dnx-faq__question {
	margin: 0;
	color: var(--dnx-primary);
	font-family: var(--dnx-font-body);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.35;
	transition: color .25s, transform .3s cubic-bezier(.22, .61, .36, 1);
}

.dnx-faq__item[open] .dnx-faq__question {
	color: var(--dnx-accent);
}

/* Icono dibujado con CSS: más/menos o flecha */
.dnx-faq__icon {
	position: relative;
	flex: none;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	transition: transform .35s cubic-bezier(.22, .61, .36, 1), background .25s;
}

.dnx-faq--icono-mas .dnx-faq__icon::before,
.dnx-faq--icono-mas .dnx-faq__icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 14px;
	height: 2px;
	border-radius: 2px;
	background: var(--dnx-accent);
	transform: translate(-50%, -50%);
	transition: transform .35s cubic-bezier(.22, .61, .36, 1), opacity .25s;
}

.dnx-faq--icono-mas .dnx-faq__icon::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.dnx-faq--icono-mas .dnx-faq__item[open] .dnx-faq__icon {
	transform: rotate(180deg);
}

.dnx-faq--icono-mas .dnx-faq__item[open] .dnx-faq__icon::after {
	opacity: 0;
	transform: translate(-50%, -50%) rotate(0deg);
}

.dnx-faq--icono-flecha .dnx-faq__icon::before {
	content: "";
	position: absolute;
	top: 40%;
	left: 50%;
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--dnx-accent);
	border-bottom: 2px solid var(--dnx-accent);
	transform: translate(-50%, -50%) rotate(45deg);
}

.dnx-faq--icono-flecha .dnx-faq__item[open] .dnx-faq__icon {
	transform: rotate(180deg);
}

.dnx-faq__answer {
	overflow: hidden;
}

.dnx-faq__answer-inner {
	padding-bottom: 22px;
	color: var(--dnx-ink-muted);
	font-size: 15px;
	line-height: 1.6;
}

/* ---------- Animaciones ---------- */
.dnx-faq--anim .dnx-faq__item.dnx-reveal {
	transition-delay: calc(var(--i, 0) * 70ms);
}

.dnx-faq--anim .dnx-faq__summary:hover .dnx-faq__question {
	color: var(--dnx-accent);
	transform: translateX(4px);
}

.dnx-faq--anim .dnx-faq__summary:hover .dnx-faq__icon {
	background: color-mix(in srgb, var(--dnx-accent) 10%, transparent);
}

/* Apertura sin JS (navegadores que animan <details> de forma nativa). */
.dnx-faq--anim .dnx-faq__item[open] .dnx-faq__answer-inner {
	animation: dnx-faq-in .35s ease both;
}

@keyframes dnx-faq-in {
	from {
		opacity: 0;
		transform: translateY(-6px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

/* ---------- Tema oscuro ---------- */
.dnx-faq--oscuro .dnx-faq__title {
	color: #fff;
}

.dnx-faq--oscuro .dnx-eyebrow {
	color: color-mix(in srgb, var(--dnx-accent) 62%, #fff);
}

.dnx-faq--oscuro .dnx-faq__desc {
	color: rgba(255, 255, 255, .72);
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.dnx-faq {
		--dnx-faq-py: 56px;
	}

	.dnx-faq--ninguno {
		--dnx-faq-py: 0px;
	}

	.dnx-faq--head-dividido .dnx-faq__wrap {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.dnx-faq__head--centrado {
		margin-bottom: 32px;
	}
}

@media (max-width: 640px) {
	.dnx-faq {
		--dnx-faq-px: 20px;
	}

	.dnx-faq__list {
		padding: 4px 20px;
	}

	.dnx-faq__item[open] {
		margin-left: -12px;
		padding-left: 9px;
	}

	.dnx-faq__summary {
		padding: 18px 0;
	}

	.dnx-faq__question {
		font-size: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.dnx-faq__icon,
	.dnx-faq__icon::before,
	.dnx-faq__icon::after,
	.dnx-faq__question,
	.dnx-faq__item {
		transition: none;
	}

	.dnx-faq--anim .dnx-faq__item[open] .dnx-faq__answer-inner {
		animation: none;
	}
}