@layer components {
	.ethical-statement--spaced { margin-top: 2rem; }

	.package-grid {
		display: grid;
		gap: 1.5rem;
		margin-top: 2.5rem;
		grid-template-columns: 1fr;
	}
	@media (min-width: 640px) { .package-grid { grid-template-columns: repeat(2, 1fr); } }
	@media (min-width: 1024px) { .package-grid { grid-template-columns: repeat(4, 1fr); } }

	.package-card {
		display: flex;
		flex-direction: column;
		border: 1px solid var(--color-border);
		background-color: var(--color-card);
		color: var(--color-card-foreground);
		border-radius: var(--radius-lg);
		padding: 1.5rem;
	}
	.package-card__title { font-size: 1.0625rem; }
	.package-card__description { margin-top: 0.5rem; font-size: 0.875rem; color: var(--color-muted-foreground); }
	.package-card__features {
		margin-top: 1.25rem;
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
		font-size: 0.8125rem;
		color: var(--color-foreground);
	}
	.package-card__features li {
		list-style: none;
		padding-left: 1.25rem;
		position: relative;
	}
	.package-card__features li::before {
		content: '';
		position: absolute;
		left: 0;
		top: 0.5em;
		width: 0.5rem;
		height: 0.5rem;
		border-radius: 999px;
		background-color: var(--color-accent);
	}

	.two-col-lists {
		display: grid;
		gap: 2.5rem;
		grid-template-columns: 1fr;
	}
	@media (min-width: 768px) { .two-col-lists { grid-template-columns: repeat(2, 1fr); } }

	.bullet-list {
		margin-top: 1.25rem;
		display: flex;
		flex-direction: column;
		gap: 0.625rem;
		font-size: 0.9375rem;
		color: var(--color-muted-foreground);
	}
	.bullet-list li { list-style: disc; margin-left: 1.25rem; }

	.faq-category + .faq-category { margin-top: 3rem; }

	.faq-list {
		margin-top: 2.5rem;
		display: flex;
		flex-direction: column;
		gap: 0.75rem;
		max-width: 48rem;
	}
	.faq-item {
		border: 1px solid var(--color-border);
		background-color: var(--color-card);
		border-radius: var(--radius-lg);
		padding: 1rem 1.25rem;
	}
	.faq-item__question {
		cursor: pointer;
		font-weight: 600;
		font-size: 0.9375rem;
		color: var(--color-foreground);
		list-style: none;
	}
	.faq-item__question::-webkit-details-marker { display: none; }
	.faq-item__question::before {
		content: '+';
		display: inline-block;
		width: 1rem;
		margin-right: 0.5rem;
		color: var(--color-accent);
		font-weight: 700;
	}
	.faq-item[open] .faq-item__question::before { content: '\2212'; }
	.faq-item__answer { margin-top: 0.75rem; font-size: 0.875rem; }
	.faq-item__question:focus-visible {
		outline: 2px solid var(--color-ring);
		outline-offset: 2px;
		border-radius: 2px;
	}
}
