/* Pricing cards (Figma: Examples/Pricing > Card Grid) */
.hdv-pricing-grid {
	gap: var(--wp--preset--spacing--1600);
}

.hdv-pricing-card {
	flex: 1 1 300px;
	max-width: 360px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--200, 8px);
	padding: var(--wp--preset--spacing--800);
	gap: var(--wp--preset--spacing--600);
}

.hdv-pricing-card--brand {
	border-color: var(--wp--preset--color--brand);
}

.hdv-pricing-top {
	gap: var(--wp--preset--spacing--400);
}

.hdv-pricing-card__button--brand {
	border: 1px solid var(--wp--preset--color--border-secondary);
}

.hdv-faq-heading {
	gap: var(--wp--preset--spacing--200);
}

.hdv-hero-contact {
	padding: var(--wp--preset--spacing--4000) var(--wp--preset--spacing--1600);
	gap: var(--wp--preset--spacing--800);
}

.hdv-price {
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.hdv-price__currency {
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: -0.48px;
}

.hdv-price__amount {
	font-size: 3rem;
	font-weight: 700;
	letter-spacing: -0.96px;
}

.hdv-price__label {
	font-size: 0.875rem;
	margin-left: 0.25rem;
}

.hdv-pricing-list {
	list-style: disc;
	padding-left: 1.5rem;
}

/* Pill toggle (Monthly / Yearly) */
.hdv-pill-toggle {
	display: flex;
	gap: 0.5rem;
}

.hdv-pill {
	padding: 0.5rem;
	border-radius: var(--wp--custom--radius--200, 8px);
	font-size: 1rem;
}

.hdv-pill--active {
	background-color: var(--wp--preset--color--background-secondary);
}

/* FAQ accordion (native details/summary, no JS) */
.hdv-accordion {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--400);
	max-width: 640px;
	width: 100%;
	margin-inline: auto;
}

.hdv-accordion__item {
	background-color: var(--wp--preset--color--background-secondary);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--200, 8px);
	padding: 1rem;
}

.hdv-accordion__item[open] {
	background-color: var(--wp--preset--color--background);
}

.hdv-accordion__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	cursor: pointer;
	font-weight: 600;
	list-style: none;
}

.hdv-accordion__summary::-webkit-details-marker {
	display: none;
}

.hdv-accordion__chevron {
	transition: transform 0.15s ease;
}

.hdv-accordion__item[open] .hdv-accordion__chevron {
	transform: rotate(180deg);
}

.hdv-accordion__content p {
	margin-top: 0.5rem;
	margin-bottom: 0;
}

/* Contact form (Figma: Hero Form) */
.hdv-contact-form {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--600);
	width: 100%;
	max-width: 320px;
	margin-inline: auto;
	background-color: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--200, 8px);
	padding: var(--wp--preset--spacing--600);
	box-sizing: border-box;
}

.hdv-contact-form__field {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--200);
}

.hdv-contact-form__field label {
	font-size: 1rem;
}

.hdv-contact-form__field input,
.hdv-contact-form__field textarea {
	font-family: inherit;
	font-size: 1rem;
	padding: var(--wp--preset--spacing--300) var(--wp--preset--spacing--400);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--200, 8px);
	background-color: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
}

.hdv-contact-form__field input::placeholder,
.hdv-contact-form__field textarea::placeholder {
	color: var(--wp--preset--color--foreground-tertiary);
}

.hdv-contact-form__field textarea {
	min-height: 80px;
	resize: vertical;
}

.hdv-contact-form__submit {
	font-family: inherit;
	font-size: 1rem;
	padding: var(--wp--preset--spacing--300);
	background-color: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--brand-on-brand);
	border: 1px solid var(--wp--preset--color--brand);
	border-radius: var(--wp--custom--radius--200, 8px);
	cursor: pointer;
}

/* Mobile (Figma Mobile frame: 375px) */
@media (max-width: 600px) {
	.hdv-pricing-grid {
		gap: var(--wp--preset--spacing--600) !important;
	}

	/* Title + price become a row, list moves below (Figma's mobile pricing card). */
	.hdv-pricing-top {
		display: grid;
		grid-template-columns: 1fr auto;
		grid-template-areas: "title price" "list list";
		align-items: start;
		text-align: left;
	}

	.hdv-pricing-top h3 {
		grid-area: title;
		text-align: left;
	}

	.hdv-pricing-top .hdv-price {
		grid-area: price;
		justify-content: flex-end;
	}

	.hdv-pricing-top ul {
		grid-area: list;
	}

	.hdv-price__currency {
		font-size: 1rem;
		font-weight: 600;
		letter-spacing: -0.32px;
	}

	.hdv-price__amount {
		font-size: 1.5rem;
		font-weight: 600;
		letter-spacing: -0.48px;
	}

	.hdv-price__label {
		display: none;
	}
}