/**
 * Section 09 — native FAQ / Trust accordion.
 */

.lupet-faq-trust {
	overflow: clip;
}

.lupet-faq-trust__header,
.lupet-faq-trust__accordion,
.lupet-faq-trust__support {
	grid-column: 1 / -1;
}

.lupet-faq-trust__header {
	order: 1;
}

.lupet-faq-trust__accordion {
	order: 2;
	margin-top: var(--lupet-space-9);
	border-top: 1px solid var(--lupet-color-line-inverse);
}

.lupet-faq-trust__support {
	order: 3;
	margin-top: var(--lupet-space-9);
	padding-top: var(--lupet-space-6);
	border-top: 1px solid var(--lupet-color-line-inverse);
}

.lupet-faq-trust__eyebrow,
.lupet-faq-trust__status-label,
.lupet-faq-trust__policy-heading,
.lupet-faq-trust__answer-status {
	color: var(--lupet-color-accent-soft);
}

.lupet-faq-trust__eyebrow {
	margin-bottom: var(--lupet-space-5);
}

.lupet-faq-trust__heading {
	max-width: 8em;
}

.lupet-faq-trust__intro {
	max-width: 31rem;
	margin-top: var(--lupet-space-6);
	color: var(--lupet-color-inverse-muted);
}

.lupet-faq-trust__item {
	border-bottom: 1px solid var(--lupet-color-line-inverse);
}

.lupet-faq-trust__summary {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 2.75rem;
	gap: var(--lupet-space-3) var(--lupet-space-4);
	align-items: center;
	min-height: 5.5rem;
	padding: var(--lupet-space-5) 0;
	color: var(--lupet-color-inverse);
	cursor: pointer;
	list-style: none;
}

.lupet-faq-trust__summary::-webkit-details-marker {
	display: none;
}

.lupet-faq-trust__summary::marker {
	content: "";
}

.lupet-faq-trust__summary:focus-visible {
	outline: 2px solid var(--lupet-color-inverse);
	outline-offset: 5px;
}

.lupet-faq-trust__topic {
	grid-column: 1;
	color: var(--lupet-color-accent-soft);
}

.lupet-faq-trust__question {
	grid-column: 1;
	color: var(--lupet-color-inverse);
	font-family: var(--lupet-font-serif);
	font-size: clamp(1.55rem, 7vw, 1.9rem);
	font-weight: var(--lupet-font-weight-medium);
	letter-spacing: var(--lupet-letter-spacing-heading);
	line-height: 1.15;
}

.lupet-faq-trust__icon {
	position: relative;
	grid-column: 2;
	grid-row: 1 / span 2;
	width: 2.75rem;
	height: 2.75rem;
	border: 1px solid var(--lupet-color-line-inverse);
}

.lupet-faq-trust__icon span {
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	width: 0.875rem;
	height: 1px;
	background: var(--lupet-color-inverse);
	transform: translate(-50%, -50%);
	transition: transform var(--lupet-motion-duration-base) var(--lupet-motion-ease-standard);
}

.lupet-faq-trust__icon span:last-child {
	transform: translate(-50%, -50%) rotate(90deg);
}

.lupet-faq-trust__item[open] .lupet-faq-trust__icon span:last-child {
	transform: translate(-50%, -50%) rotate(0deg);
}

.lupet-faq-trust__answer {
	max-width: 43rem;
	padding: 0 3.75rem var(--lupet-space-7) 0;
	color: var(--lupet-color-inverse-muted);
}

.lupet-faq-trust__answer > :first-child {
	margin-top: 0;
}

.lupet-faq-trust__answer > :last-child {
	margin-bottom: 0;
}

.lupet-faq-trust__answer strong {
	color: var(--lupet-color-inverse);
	font-weight: var(--lupet-font-weight-semibold);
}

.lupet-faq-trust__answer-status {
	margin-top: var(--lupet-space-4) !important;
}

.lupet-faq-trust__status-text,
.lupet-faq-trust__policy-empty {
	max-width: 28rem;
	margin-top: var(--lupet-space-3);
	color: var(--lupet-color-inverse-muted);
}

.lupet-faq-trust__policies {
	margin-top: var(--lupet-space-7);
}

.lupet-faq-trust__policy-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--lupet-space-2) var(--lupet-space-6);
	margin: var(--lupet-space-3) 0 0;
	padding: 0;
	list-style: none;
}

.lupet-faq-trust__policy-link {
	display: inline-flex;
	align-items: center;
	gap: var(--lupet-space-2);
	min-height: 2.75rem;
	color: var(--lupet-color-inverse);
	font-family: var(--lupet-font-sans);
	font-size: var(--lupet-font-size-caption);
	font-weight: var(--lupet-font-weight-semibold);
	letter-spacing: var(--lupet-letter-spacing-label);
	line-height: 1.2;
	text-decoration: none;
}

.lupet-faq-trust__policy-link svg {
	width: 1rem;
	height: 1rem;
	transition: transform var(--lupet-motion-duration-fast) var(--lupet-motion-ease-out);
}

.lupet-faq-trust__policy-link:focus-visible {
	outline: 2px solid var(--lupet-color-inverse);
	outline-offset: 4px;
}

@media (hover: hover) and (pointer: fine) {
	.lupet-faq-trust__summary:hover .lupet-faq-trust__question,
	.lupet-faq-trust__policy-link:hover {
		color: var(--lupet-color-accent-soft);
	}

	.lupet-faq-trust__policy-link:hover svg {
		transform: translateX(var(--lupet-space-1));
	}
}

@media (min-width: 48rem) {
	.lupet-faq-trust__header {
		grid-column: 1 / span 3;
	}

	.lupet-faq-trust__accordion {
		grid-column: 4 / span 5;
		grid-row: 1 / span 2;
		margin-top: 0;
	}

	.lupet-faq-trust__support {
		grid-column: 1 / span 3;
		margin-top: var(--lupet-space-10);
	}

	.lupet-faq-trust__summary {
		grid-template-columns: 7rem minmax(0, 1fr) 3rem;
		gap: var(--lupet-space-5);
		min-height: 7rem;
		padding: var(--lupet-space-6) 0;
	}

	.lupet-faq-trust__topic {
		grid-column: 1;
	}

	.lupet-faq-trust__question {
		grid-column: 2;
		font-size: 1.7rem;
	}

	.lupet-faq-trust__icon {
		grid-column: 3;
		grid-row: 1;
	}

	.lupet-faq-trust__answer {
		margin-left: calc(7rem + var(--lupet-space-5));
		padding-right: calc(3rem + var(--lupet-space-5));
	}

	.lupet-faq-trust__policy-list {
	display: block;
	}
}

@media (min-width: 75rem) {
	.lupet-faq-trust__header {
		grid-column: 1 / span 5;
	}

	.lupet-faq-trust__accordion {
		grid-column: 7 / span 6;
	}

	.lupet-faq-trust__support {
		grid-column: 1 / span 4;
		margin-top: var(--lupet-space-12);
	}

	.lupet-faq-trust__summary {
		grid-template-columns: 8rem minmax(0, 1fr) 3rem;
	}

	.lupet-faq-trust__question {
		font-size: 1.85rem;
	}

	.lupet-faq-trust__answer {
		margin-left: calc(8rem + var(--lupet-space-5));
	}
}

@media (max-width: 47.99rem) {
	.lupet-faq-trust__heading {
		font-size: clamp(2.45rem, 11.5vw, 2.9rem);
	}

	.lupet-faq-trust__intro,
	.lupet-faq-trust__answer {
		font-size: 0.9375rem;
		line-height: 1.65;
	}

	.lupet-faq-trust__policy-list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--lupet-space-2) var(--lupet-space-4);
	}
}

@media (prefers-reduced-motion: reduce) {
	.lupet-faq-trust__icon span,
	.lupet-faq-trust__policy-link svg {
		transition-duration: 0.01ms !important;
	}
}

@media (forced-colors: active) {
	.lupet-faq-trust__icon {
		border-color: ButtonText;
	}

	.lupet-faq-trust__icon span {
		background: ButtonText;
	}
}