privacy-section {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3.5em;
	padding: 6em 2em;
	max-width: 70em;
	margin: 0 auto;
}

privacy-panel {
	display: flex;
	flex-direction: column;
	gap: 2.5em;
	width: 100%;
	padding: 3em;

	border-radius: 1.2em;
	background: var(--glass-bg);
	border: var(--glass-border);
	box-shadow: var(--glass-shadow);
	backdrop-filter: blur(1.5em);

	privacy-points {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 2em;

		point-item {
			display: flex;
			align-items: flex-start;
			gap: 1em;

			svg.shield-check {
				flex-shrink: 0;
				width: 1.6em;
				height: 1.6em;
				fill: none;
				stroke: light-dark(hsl(141, 61%, 42%), hsl(141, 61%, 55%));
				stroke-width: 2;
				stroke-linecap: round;
				stroke-linejoin: round;
				margin-top: 0.1em;
			}

			p {
				margin: 0;
				font-size: 1rem;
				line-height: 1.6;
				color: var(--text-main);
			}
		}
	}

	privacy-action {
		display: flex;
		justify-content: flex-end;
		padding-top: 1.5em;
		border-top: var(--glass-border);
	}
}

/* --- 20. FAQ Section                                   --- */

faq-section {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4em;
	padding: 6em 2em;
	max-width: 54em;
	margin: 0 auto;
}

faq-accordion {
	display: flex;
	flex-direction: column;
	gap: 1em;
	width: 100%;
}

details.faq-item {
	border-radius: 0.8em;
	background: var(--glass-bg);
	border: var(--glass-border);
	box-shadow: var(--card);
	backdrop-filter: blur(1.5em);
	overflow: hidden;

	summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1em;
		padding: 1.4em 1.8em;
		cursor: pointer;
		list-style: none;
		user-select: none;
		transition: background-color 0.2s;

		&::-webkit-details-marker {
			display: none;
		}

		h3 {
			margin: 0;
			font-size: 1.1rem;
			font-weight: 700;
			color: var(--text-main);
			line-height: 1.4;
		}

		svg.chevron-down {
			flex-shrink: 0;
			width: 1.2em;
			height: 1.2em;
			fill: var(--text-muted);
			transition: rotate 0.3s ease;
		}

		&:hover {
			background: light-dark(hsla(0, 0%, 0%, 0.02), hsla(0, 0%, 100%, 0.02));
		}
	}

	&[open] summary svg.chevron-down {
		rotate: 180deg;
	}

	/* Native expansion animation */
	&::details-content {
		height: 0;
		overflow: hidden;
		transition:
			height 0.3s ease-out,
			content-visibility 0.3s allow-discrete;
	}

	&[open]::details-content {
		height: auto;
	}

	faq-body {
		display: block;
		padding: 0 1.8em 1.6em 1.8em;

		p {
			margin: 0;
			font-size: 0.95rem;
			line-height: 1.6;
			color: var(--text-muted);
		}
	}
}

privacy-section svg,
pricing-section svg,
faq-section svg {
	&.shield-check path {
		d: path("M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z M9 12l2 2 4-4");
	}
	&.chevron-down path {
		d: path("M6 9l6 6 6-6");
		fill: none;
		stroke: currentColor;
		stroke-width: 2;
		stroke-linecap: round;
		stroke-linejoin: round;
	}

	&.shield path {
		d: path("M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z");
	}
}
