/**
 * Call To Action Section Styles — WP SOC Theme
 * ============================================================
 * Reused as-is from the design system: .wp-soc-section(--surface),
 * .wp-soc-section-pad, .wp-soc-container, .wp-soc-bg-grid,
 * .wp-soc-bg-glow, .wp-soc-section-label(__dot), .wp-soc-section-title,
 * .wp-soc-section-description, .wp-soc-card.wp-soc-card--feature
 * (incl. its own .wp-soc-card__icon treatment), .wp-soc-card__title,
 * .wp-soc-card__description, .wp-soc-btn(--primary/--ghost/--block/
 * __icon), .wp-soc-btn-group, .wp-soc-hover-premium, .wp-soc-fade-up
 * + .is-visible.
 *
 * Nothing above is redefined. Only the two-column layout, the trust
 * bullet list, the stronger dual ambient glow, and the vertical
 * stacking of the panel's action buttons are added below — all using
 * existing tokens only.
 * ============================================================
 */

/* ------------------------------------------------------------ *
 * Ambient background — the strongest glow treatment on the site,
 * built from the same .wp-soc-bg-glow utility every other section
 * uses, just doubled and centered behind the panel for emphasis.
 * ------------------------------------------------------------ */

.wp-soc-cta__glow {
	width: 640px;
	height: 640px;
}

.wp-soc-cta__glow--a {
	top: -200px;
	right: -160px;
}

.wp-soc-cta__glow--b {
	bottom: -220px;
	left: 10%;
	opacity: 0.28;
}

/* ------------------------------------------------------------ *
 * Layout — two columns
 * ------------------------------------------------------------ */

.wp-soc-cta__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: var(--wp-soc-space-8);
}

.wp-soc-cta__content {
	max-width: var(--wp-soc-container-max-prose);
}

/* ------------------------------------------------------------ *
 * Trust bullets
 * ------------------------------------------------------------ */

.wp-soc-cta__bullets {
	margin-top: var(--wp-soc-space-6);
	display: flex;
	flex-direction: column;
	gap: var(--wp-soc-space-3);
}

.wp-soc-cta__bullets li {
	display: flex;
	align-items: center;
	gap: var(--wp-soc-space-3);
	font-size: var(--wp-soc-text-body);
	color: var(--wp-soc-color-text-secondary);
}

.wp-soc-cta__bullets svg {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	color: var(--wp-soc-color-primary);
}

/* ------------------------------------------------------------ *
 * Consultation panel
 * ------------------------------------------------------------ */

.wp-soc-cta__panel {
	padding: var(--wp-soc-space-8) var(--wp-soc-space-7);
}

.wp-soc-cta__panel-actions {
	flex-direction: column;
	align-items: stretch;
	margin-top: var(--wp-soc-space-2);
}

.wp-soc-cta__panel-actions .wp-soc-btn--ghost {
	justify-content: center;
}

/* ------------------------------------------------------------ *
 * Responsive
 * ------------------------------------------------------------ */

@media (max-width: 1023px) {
	.wp-soc-cta__grid {
		grid-template-columns: 1fr;
		gap: var(--wp-soc-space-7);
	}

	.wp-soc-cta__content {
		max-width: 100%;
	}
}

@media (max-width: 639px) {
	.wp-soc-cta__panel {
		padding: var(--wp-soc-space-6) var(--wp-soc-space-5);
	}
}

/* ------------------------------------------------------------ *
 * Accessibility
 * All motion in this section lives in the shared animation system
 * (.wp-soc-fade-up / .wp-soc-hover-premium), which already honors
 * prefers-reduced-motion — nothing additional to disable here.
 * ------------------------------------------------------------ */